/* NJANSANG — styles propres à la page Allergènes et origines. Chargé après styles.css (même ordre de couches). */
@layer pages {
  .prose-grid { display: grid; gap: var(--space-6); }
  @media (min-width: 64em) { .prose-grid { grid-template-columns: 1.2fr .8fr; } }
  .dot-yes { color: var(--color-terracotta); }
  .atable-wrap { overflow: auto; max-height: 75svh; border: 1px solid var(--color-sable); border-radius: var(--radius-m); background: var(--color-ivoire); margin-block-start: var(--space-4); }
  .atable { font-size: .875rem; min-width: 64rem; width: 100%; }
  .atable :is(th, td) { padding: .55rem .5rem; border-block-end: 1px solid var(--color-sable); text-align: center; }
  .atable thead th { position: sticky; top: 0; z-index: 2; background: var(--color-lin); font-size: .75rem; font-weight: 650; vertical-align: bottom; line-height: 1.2; }
  .atable tbody th[scope="row"], .atable thead th:first-child { position: sticky; inset-inline-start: 0; z-index: 1; background: var(--color-ivoire); text-align: start; min-width: 13rem; box-shadow: 1px 0 0 var(--color-sable); }
  .atable thead th:first-child { z-index: 3; background: var(--color-lin); }
  .atable tbody th a { color: var(--color-encre); font-weight: 600; text-decoration: none; }
  .atable tbody th a:hover { color: var(--color-terracotta-texte); text-decoration: underline; }
  .atable .is-yes { color: var(--color-terracotta); font-size: 1.05rem; background: #FBEBDC; }
  .atable__sec th { text-align: start !important; background: var(--color-nuit) !important; color: var(--color-creme); font-family: var(--font-display); font-size: 1rem; font-weight: 500; position: static !important; }
  .atable tbody tr:hover td, .atable tbody tr:hover th[scope="row"] { background: #FFF3E3; }
  .origins { display: grid; gap: 1rem; }
  .origin { padding: 1.1rem 1.25rem; background: var(--color-ivoire); border-radius: var(--radius-m); border: 1px solid var(--color-sable); }
  .origin dt { font-family: var(--font-display); font-size: 1.25rem; margin-block-end: .25rem; }
  .origin dd { color: var(--color-encre-2); font-size: .95rem; }
  @media (min-width: 48em) { .origins { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (min-width: 64em) { .origins { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .origins + .small { margin-block-start: var(--space-5); }
}