/* P'tit Sucré v5 — pages secondaires (allergènes, mentions légales, confidentialité) */

.hero--page { padding: calc(var(--header-h) + 90px) 0 clamp(24px, 3vw, 40px); }
.hero--page + .page-body { padding-top: clamp(28px, 4vw, 48px); }
.hero--page .section-header { position: relative; margin: 0; max-width: 820px; }
.hero--page h1 {
  font-family: var(--font-display); font-weight: 900; font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
  font-size: clamp(2.8rem, 8vw, 6.2rem); line-height: .92; letter-spacing: -.03em;
  color: var(--blanc); -webkit-text-stroke: .05em var(--cacao); paint-order: stroke fill;
  text-shadow: 0 .06em 0 var(--bonbon), 0 .095em 0 var(--cacao);
  padding-bottom: .1em;
}
.hero--page .section-lead { color: var(--cacao-doux); }
.page-body { padding-block: clamp(60px, 8vw, 110px); }

/* ---------- Textes légaux ---------- */
.legal { max-width: 820px; }
.legal h2 { display: flex; align-items: center; gap: 12px; margin: 2.4em 0 .8em; font-family: var(--font-display); font-weight: 900; font-variation-settings: "SOFT" 100, "WONK" 1; font-size: clamp(1.5rem, 2.6vw, 2rem); }
.legal h2:first-child { margin-top: 0; }
.legal h2 svg { width: 26px; height: 26px; flex: none; color: var(--framboise); }
.legal p { color: var(--cacao-doux); line-height: 1.75; }
.legal strong { color: var(--cacao); }
.legal ul { margin: 0 0 1em 1.2em; list-style: disc; color: var(--cacao-doux); }
.legal a { color: var(--framboise); font-weight: 700; }

/* ---------- Allergènes ---------- */
.allergens-legend { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 22px; font-weight: 700; }
.legend-item { display: inline-flex; align-items: center; gap: 8px; }
.legend-dot { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--cacao); }
.legend-contains { background: var(--bonbon); }
.legend-not { background: var(--blanc); }
.allergens-table-wrap { overflow-x: auto; background: var(--blanc); border: var(--line) solid var(--cacao); border-radius: var(--r-lg); box-shadow: 0 8px 0 var(--cacao); }
.allergens-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.allergens-table th, .allergens-table td { padding: 12px 10px; text-align: center; border-bottom: 1.5px solid rgba(59, 30, 20, .12); }
.allergens-table thead th { position: sticky; top: 0; background: var(--ciel); color: var(--cacao); font-weight: 800; font-size: .82rem; letter-spacing: .02em; white-space: nowrap; border-bottom: var(--line) solid var(--cacao); }
.allergens-table .col-product { position: sticky; left: 0; z-index: 1; text-align: left; background: var(--blanc); font-family: var(--font-display); font-weight: 900; font-variation-settings: "SOFT" 100, "WONK" 1; font-size: 1.05rem; white-space: nowrap; }
.allergens-table thead .col-product { background: var(--ciel); z-index: 2; }
.allergens-table td.contains { color: var(--cacao); font-weight: 800; background: var(--bonbon); background-clip: padding-box; }
.allergens-table td.not { color: rgba(59, 30, 20, .4); }
.allergens-table tbody tr:hover th, .allergens-table tbody tr:hover td.not { background: var(--barbe-clair); }
.allergens-cards { display: none; gap: 14px; }
.allergen-card { padding: 20px 22px; background: var(--blanc); border: var(--line) solid var(--cacao); border-radius: var(--r-md); box-shadow: var(--pop); }
.allergen-card h3 { display: flex; align-items: center; gap: 10px; margin-bottom: .6em; font-family: var(--font-display); font-weight: 900; font-variation-settings: "SOFT" 100, "WONK" 1; font-size: 1.4rem; }
.allergen-card h3 svg { width: 22px; height: 22px; color: var(--framboise); }
.allergen-card p { margin: 0 0 .4em; font-size: .95rem; color: var(--cacao-doux); }
.allergen-contains strong { color: var(--framboise); }
.allergens-note { display: flex; align-items: flex-start; gap: 12px; margin-top: 28px; padding: 18px 22px; background: var(--citron); border: var(--line) solid var(--cacao); border-radius: var(--r-md); }
.allergens-note svg { width: 22px; height: 22px; flex: none; }
.allergens-note p { margin: 0; font-weight: 600; }
.allergens-note a { color: var(--cacao); font-weight: 800; }

@media (max-width: 860px) {
  .allergens-table-wrap { display: none; }
  .allergens-cards { display: grid; }
}
