/* =====================================================================
   L'OASIS – Direction artistique 2026 « Golden Street »
   Surcouche de design chargée APRÈS site.css (et les styles de index.html).
   Pour revenir à l'ancien design : retirer le <link> vers brand.css.
   Polices auto-hébergées (Barlow / Barlow Condensed – licence SIL OFL).
   ===================================================================== */
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/barlow-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/barlow-700.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 800; font-display: swap; src: url("/assets/fonts/barlow-800.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/barlowcondensed-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/barlowcondensed-700.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 800; font-display: swap; src: url("/assets/fonts/barlowcondensed-800.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 900; font-display: swap; src: url("/assets/fonts/barlowcondensed-900.woff2") format("woff2"); }

:root {
  --y: #FFCA2A; --y-d: #E9AE00; --y-dd: #B98900; --y-l: #FFF1C2; --y-xl: #FFF8E1;
  --k: #0B0B0B; --k2: #141414; --k3: #1E1E1E; --w: #FFFFFF;
  --cream: #FFF8E7; --g: #5E5A52; --g2: #EDE6D3; --g3: #FFF8E7;
  --font: "Barlow", -apple-system, "Segoe UI", Roboto, system-ui, sans-serif;
  --font-d: "Barlow Condensed", "Barlow", "Arial Narrow", Impact, sans-serif;
  --r-sm: 12px; --r: 16px; --r-lg: 22px; --r-xl: 28px;
  --sh: 0 1px 0 rgba(11,11,11,.04), 0 10px 28px rgba(60,40,0,.09);
  --sh-lg: 0 22px 54px rgba(40,25,0,.20);
  --ledge: 0 4px 0 var(--y-dd);
  --t: 220ms cubic-bezier(.2,.8,.2,1);
  --header-h: 68px;
}
@media (min-width: 760px) { :root { --gutter: 24px; } }

html { scroll-padding-top: calc(var(--header-h) + 72px); }
body { font-family: var(--font); font-size: 16.5px; color: var(--k); letter-spacing: .005em; }
::selection { background: var(--y); color: var(--k); }

/* ---------- Typographie ---------- */
.h1, .h2, .h3, .hero-title, .cat-h, .sheet-title, .track-number, .nf-code, .pts-num,
.f-title, .zone-name, .cat-name, .grp-name, .co-legend, .ctx-legend, .ups-title, .upgrade-q strong,
.consent-title, .carte-kicker, .dcheck-title, .added-title, .track-thanks {
  font-family: var(--font-d);
}
.h1, .h2 { font-weight: 900; text-transform: uppercase; letter-spacing: -.005em; line-height: .95; }
.h1 { font-size: clamp(2.5rem, 8vw, 4.4rem); }
.h2 { font-size: clamp(2rem, 6vw, 3.2rem); }
.h3 { font-weight: 800; font-size: 1.45rem; text-transform: uppercase; letter-spacing: .005em; }
.h4 { font-weight: 800; }
.lead { font-size: 1.12rem; color: #3b3830; }
.muted { color: var(--g); }
/* Surligneur jaune (signature L'Oasis) */
.section-head .h2, .page-hero .h1, .account > .h1, .acc-head .h1, .co-top .h2, .menu-section .h2 {
  display: inline; background: linear-gradient(180deg, transparent 58%, var(--y) 58%, var(--y) 90%, transparent 90%);
  -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 .08em;
}
.section--dark .section-head .h2 { background: none; padding: 0; }
.section-head > .h2, .page-hero > .h1 { display: inline; }
.kicker, .carte-kicker { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .14em; font-size: .92rem; color: var(--y-dd); }
.section--dark .kicker, .carte-kicker { color: var(--y); }
.kicker::before, .carte-kicker::before { content: ""; width: 22px; height: 3px; border-radius: 3px; background: currentColor; }

/* ---------- Boutons ---------- */
.btn { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; font-size: 1.08rem; min-height: 50px; padding: 0 24px; border-width: 2px; }
.btn--sm { min-height: 44px; font-size: 1rem; padding: 0 18px; }
.btn--lg { min-height: 60px; font-size: 1.22rem; padding: 0 30px; }
.btn--yellow { background: var(--y); color: var(--k); box-shadow: var(--ledge); transform: translateY(0); }
.btn--yellow:hover:not(:disabled) { background: #FFD448; transform: translateY(-2px); box-shadow: 0 6px 0 var(--y-dd); }
.btn--yellow:active:not(:disabled) { transform: translateY(3px); box-shadow: 0 1px 0 var(--y-dd); }
.btn--dark { background: var(--k); color: var(--w); box-shadow: 0 4px 0 #000; }
.btn--dark:hover:not(:disabled) { background: #222; transform: translateY(-2px); box-shadow: 0 6px 0 #000; }
.btn--dark:active:not(:disabled) { transform: translateY(3px); box-shadow: 0 1px 0 #000; }
.btn--light { background: var(--w); box-shadow: 0 4px 0 var(--g2); }
.btn--ghost { border-color: currentColor; }
.btn-price { font-family: var(--font-d); font-weight: 900; font-size: 1.15em; letter-spacing: .01em; }
.link-arrow { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 1.05rem; border-bottom: 3px solid var(--y); padding-bottom: 2px; }
.link-arrow:hover { text-decoration: none; border-color: var(--k); }
.section--dark .link-arrow:hover { border-color: var(--w); }
.linklike { font-weight: 700; }

/* ---------- Bandeau annonce ---------- */
.announce { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 1.02rem; padding: 9px var(--gutter); }

/* ---------- En-tête ---------- */
.site-header { background: rgba(11,11,11,.97); border-bottom: 0; box-shadow: 0 1px 0 rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.25); }
.site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 3px; background: var(--y); }
.header-in { height: var(--header-h); }
.logo-img { height: 52px; width: 52px; object-fit: cover; border-radius: 50%; clip-path: circle(47.5% at 50% 50%); transform: scale(1.06); transition: transform var(--t); }
.logo:hover .logo-img { transform: scale(1.12) rotate(-6deg); }
.logo-pill { font-family: var(--font-d); font-weight: 900; font-size: 1.3rem; padding: 8px 16px; letter-spacing: .03em; }
.nav a { font-family: var(--font-d); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 1.04rem; color: #e6e6e6; }
.nav a[aria-current="page"] { color: var(--y); box-shadow: inset 0 -3px 0 var(--y); border-radius: 0; }
.header-cta { box-shadow: 0 3px 0 var(--y-dd); }
@media (max-width: 899px) { .nav a[aria-current="page"] { box-shadow: none; } .nav { border-bottom: 3px solid var(--y); } }

/* ---------- Fil d'Ariane ---------- */
.crumbs { font-weight: 600; font-size: .9rem; }

/* ---------- Sections ---------- */
.section { padding: 56px 0; }
@media (min-width: 900px) { .section { padding: 84px 0; } }
.section--soft { background: var(--cream); }
.section--dark { background: radial-gradient(90% 70% at 100% 0%, rgba(255,202,42,.10), transparent 60%), var(--k); }
.section--yellow { background: var(--y); color: var(--k); }
.section-head { margin-bottom: 26px; align-items: end; }
.notice { border-radius: var(--r); font-weight: 600; }

/* ---------- Hero ---------- */
.hero { background:
  radial-gradient(70% 80% at 85% 20%, rgba(255,202,42,.28), transparent 60%),
  radial-gradient(40% 40% at 0% 100%, rgba(255,202,42,.10), transparent 70%),
  linear-gradient(180deg, #0B0B0B 0%, #121212 100%); }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 2px, transparent 2px 22px); }
.hero-title { font-family: var(--font-d); font-weight: 900; font-size: clamp(2.9rem, 10.5vw, 6rem); line-height: .88; letter-spacing: -.01em; max-width: 13ch; }
.hero-title .hl { color: var(--y); display: inline; }
.hero-sub { font-size: 1.15rem; color: #dedede; font-weight: 500; }
.status-pill { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .95rem; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); }
.mode-cta { border-radius: var(--r-lg); background: rgba(255,255,255,.06); border: 1.5px solid rgba(255,255,255,.14); }
.mode-cta:hover { background: rgba(255,202,42,.16); border-color: var(--y); transform: translateY(-2px); }
.mode-cta strong { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; font-size: 1.25rem; }
.mode-cta .ico { width: 26px; height: 26px; }
.hero-main { box-shadow: 0 5px 0 var(--y-dd), 0 18px 40px rgba(255,202,42,.25); }
.hero-photo .hero-price, .hero-price { font-family: var(--font-d); font-weight: 900; text-transform: uppercase; letter-spacing: .02em; background: var(--y); color: var(--k); border-radius: 16px; box-shadow: 0 4px 0 var(--y-dd), 0 14px 30px rgba(0,0,0,.35); transform: rotate(-4deg); }
.hero-price small { font-family: var(--font); font-weight: 800; text-transform: none; letter-spacing: 0; }

/* ---------- Bandeau défilant ---------- */
.ox-ticker { position: relative; overflow: hidden; background: var(--y); color: var(--k); border-top: 3px solid var(--k); border-bottom: 3px solid var(--k); transform: rotate(-1.2deg); margin: -10px -12px 0; z-index: 3; }
.ox-ticker-track { display: flex; width: max-content; animation: ox-marquee 34s linear infinite; }
.ox-ticker-track span { display: inline-flex; align-items: center; gap: 22px; padding: 12px 11px; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; letter-spacing: .04em; font-size: clamp(1.15rem, 2.6vw, 1.6rem); white-space: nowrap; }
.ox-ticker-track span::after { content: "✶"; font-size: .8em; }
@keyframes ox-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.ox-ticker:hover .ox-ticker-track { animation-play-state: paused; }

/* ---------- Visuels produits ---------- */
.visual { background: linear-gradient(160deg, #FFD95E, #FFC21A); }
.visual img, .pcard-visual, .prod-visual img, .mi-visual img { transition: transform 450ms cubic-bezier(.2,.8,.2,1); }
.visual--empty { background: radial-gradient(90% 80% at 80% 10%, rgba(255,202,42,.35), transparent 60%), linear-gradient(150deg, #262626 0%, #0B0B0B 70%); }
.visual--empty span { font-family: var(--font-d); font-weight: 900; font-size: 1.3rem; }

/* ---------- Cartes produits ---------- */
.cards-grid { gap: 18px; }
@media (min-width: 960px) { .cards-grid { gap: 24px; } }
.pcard-link, .menu-item, .prod { background: var(--w); border: 1px solid var(--g2); border-radius: var(--r-lg); box-shadow: var(--sh); overflow: hidden; }
.pcard-link:hover, .prod:hover:not(:disabled), .menu-item:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); border-color: var(--y); }
.pcard-link:hover .pcard-visual, .pcard-link:hover .visual img, .prod:hover:not(:disabled) .visual img, .menu-item:hover .visual img { transform: scale(1.06); }
.pcard-name, .prod-name, .mi-name { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .01em; font-size: 1.3rem; line-height: 1.02; }
.pcard-desc, .prod-desc, .mi-desc { color: var(--g); font-size: .95rem; line-height: 1.4; }
.pcard-body, .prod-body, .mi-body { padding: 16px 16px 14px; gap: 6px; }
.price, .cl-price, .rl-price, .var-price, .opt-price { font-family: var(--font-d); font-weight: 900; letter-spacing: .01em; }
.price { font-size: 1.45rem; line-height: 1; }
.pcard-foot, .prod-foot { margin-top: 10px; }
.add-dot { background: var(--k); color: var(--y); width: 44px; height: 44px; box-shadow: 0 3px 0 #000; transition: transform var(--t), background var(--t), color var(--t); }
.add-dot .ico { stroke-width: 3; }
.pcard-link:hover .add-dot, .prod:hover:not(:disabled) .add-dot, .add-dot--btn:hover { background: var(--y); color: var(--k); box-shadow: 0 3px 0 var(--y-dd); transform: rotate(90deg); }
.prod .add-dot { width: 42px; height: 42px; }
.prod-visual { min-height: 140px; }
.prod { grid-template-columns: 1fr 128px; }
.prod-flag, .badge--hot { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.badge { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: .85rem; }
.badge--hot { background: var(--y); color: var(--k); box-shadow: 0 2px 0 var(--y-dd); transform: rotate(-3deg); }
.tag { font-weight: 700; background: var(--y-xl); border: 1px solid var(--g2); }
.tag--hot { background: #FFE3D6; border-color: #FFD0BC; }
.mi-vars li { border-bottom-color: var(--g2); font-weight: 600; }
.mi-vars li span:last-child, .mi-vars li > :last-child { font-family: var(--font-d); font-weight: 900; font-size: 1.1rem; }

/* ---------- Tuiles catégories ---------- */
.cat-tile { border-radius: var(--r-lg); overflow: hidden; }
.cat-tile .cat-name, .cat-name { font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: 1.65rem; letter-spacing: .01em; line-height: 1; }
.cat-meta { font-weight: 600; }
.cat-tile:hover { transform: translateY(-4px); }

/* ---------- Carte (page /carte) et chips ---------- */
.chip { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 1.02rem; background: var(--w); border: 2px solid var(--g2); }
.chip:hover { border-color: var(--k); }
.chip[aria-current="page"] { background: var(--y); color: var(--k); border-color: var(--k); box-shadow: 0 3px 0 var(--k); }
.menu-section { padding: 40px 0; }
.menu-section + .menu-section { border-top: 0; }

/* ---------- Commande : contexte, onglets ---------- */
.page-order, .page-track { background: var(--cream); }
.ctx-summary, .ctx-panel { border: 1px solid var(--g2); }
.ctx-icon { box-shadow: 0 3px 0 var(--y-dd); }
.ctx-text strong { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; font-size: 1.15rem; letter-spacing: .02em; }
.ctx-legend { font-weight: 800; text-transform: uppercase; font-size: 1.3rem; letter-spacing: .02em; }
.mode-card { border-radius: var(--r-lg); border-width: 2px; background: var(--w); }
.mode-card strong { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; font-size: 1.15rem; letter-spacing: .03em; }
.mode-opt input:checked + .mode-card { background: var(--y); border-color: var(--k); box-shadow: 0 4px 0 var(--k); }
.mode-opt input:checked + .mode-card small { color: #3a2f00; }
.radio-pill span { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; font-size: 1.02rem; background: var(--w); }
.cat-tabs { background: rgba(255,248,231,.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--g2); padding: 10px 0; }
.tab { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 1.05rem; min-height: 46px; padding: 0 18px; border: 2px solid var(--g2); box-shadow: none; }
.tab:hover { border-color: var(--k); }
.tab[aria-current="true"] { background: var(--y); color: var(--k); border-color: var(--k); box-shadow: 0 3px 0 var(--k); }
.cat-sec { padding-top: 34px; }
.cat-h { font-weight: 900; font-size: clamp(2rem, 5vw, 2.6rem); line-height: .95; display: flex; align-items: center; gap: 12px; }
.cat-h::after { content: ""; flex: 1; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--y), transparent); }
.cat-desc { font-size: .98rem; }
.prod-grid { gap: 14px; margin-top: 16px; }

/* ---------- Panier ---------- */
.cart-in { background: var(--w); }
@media (min-width: 1024px) { .cart-in { border: 1px solid var(--g2); border-top: 6px solid var(--y); } }
.cart-head .h3, .cart-head h2 { font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: 1.7rem; letter-spacing: .01em; }
.cart-empty p:first-of-type { font-family: var(--font-d); text-transform: uppercase; font-size: 1.25rem; }
.cl-name { font-weight: 800; }
.cl-price { font-size: 1.15rem; }
.stepper { background: var(--cream); border: 1px solid var(--g2); }
.step-btn { box-shadow: 0 2px 0 var(--g2); }
.step-btn:hover:not(:disabled) { background: var(--y); }
.qty-val { font-family: var(--font-d); font-weight: 900; font-size: 1.2rem; }
.promo { background: var(--cream); border: 1.5px dashed #D9C79A; }
.tot-total { font-family: var(--font-d); font-size: 1.6rem; text-transform: uppercase; border-top: 3px solid var(--k); }
.tot-total dd { font-weight: 900; }
.ups { background: var(--y-xl); border: 2px solid var(--y); border-radius: var(--r-lg); padding: 14px; }
.ups-title { font-weight: 900; text-transform: uppercase; font-size: 1.3rem; letter-spacing: .01em; }
.ups-title::before { content: "🔥 "; }
.ups-item { border-radius: var(--r); border-color: var(--g2); box-shadow: 0 2px 0 var(--g2); }
.ups-name { font-family: var(--font-d); text-transform: uppercase; font-weight: 800; font-size: 1rem; }
.ups-price { color: var(--k); font-family: var(--font-d); font-weight: 900; font-size: 1.05rem; }
.cart-bar { background: linear-gradient(180deg, rgba(255,248,231,0), var(--cream) 34%); }
.cart-bar-btn { min-height: 62px; font-size: 1.2rem; box-shadow: 0 5px 0 var(--y-dd), 0 14px 30px rgba(0,0,0,.18); }
.cb-count { font-family: var(--font-d); font-size: 1.1rem; }
.cb-total { font-family: var(--font-d); font-weight: 900; font-size: 1.3rem; }
.toast { font-weight: 700; border: 2px solid var(--y); }

/* ---------- Fiche produit / personnalisation ---------- */
.sheet { border-radius: var(--r-xl) var(--r-xl) 0 0; }
@media (min-width: 760px) { .sheet { border-radius: var(--r-xl); max-width: 680px; } }
.sheet-visual { max-height: 40vh; background: linear-gradient(160deg, #FFD95E, #FFC21A); }
.sheet-title { font-weight: 900; text-transform: uppercase; font-size: clamp(2rem, 6vw, 2.6rem); line-height: .92; letter-spacing: 0; }
.sheet-head { padding: 22px 22px 8px; }
.sheet-desc { font-size: 1.02rem; color: #3b3830; }
.sheet-vars, .sheet-groups { padding: 0 22px; }
.sheet-note { padding: 6px 22px 20px; }
.grp { border-top: 1px dashed var(--g2); padding-top: 18px; }
.grp-name { font-weight: 800; text-transform: uppercase; font-size: 1.35rem; letter-spacing: .02em; }
.rule { font-family: var(--font-d); text-transform: uppercase; letter-spacing: .05em; font-size: .85rem; }
.rule--req { background: var(--k); color: var(--y); }
.opt { min-height: 56px; border-radius: var(--r); border: 2px solid var(--g2); background: var(--w); }
.opt:hover:not(.is-off) { border-color: #CDBF96; }
.opt.is-on { border-color: var(--k); background: var(--y-xl); box-shadow: 0 3px 0 var(--k); }
.opt-label { font-weight: 700; }
.opt-price { color: var(--k); font-size: 1.1rem; }
.opt-mark { border-radius: 7px; border-color: #A79E86; }
.var-list { gap: 10px; }
.var-card { min-height: 68px; border-radius: var(--r-lg); background: var(--w); }
.var-label { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; font-size: 1.25rem; letter-spacing: .02em; }
.var-price { font-size: 1.4rem; }
.var-opt--menu .var-card { border: 2px dashed var(--y-d); background: linear-gradient(100deg, var(--y-xl), #fff 70%); }
.var-opt--menu .var-label::before { content: "★ "; color: var(--y-dd); }
.var-opt input:checked + .var-card { background: var(--y); border-color: var(--k); border-style: solid; box-shadow: 0 4px 0 var(--k); }
.var-badge { font-family: var(--font-d); text-transform: uppercase; letter-spacing: .05em; font-size: .9rem; background: var(--k); color: var(--y); }
.var-opt input:checked + .var-card .var-badge { background: var(--k); color: var(--y); }
.sheet-foot { border-top: 0; box-shadow: 0 -10px 30px rgba(0,0,0,.08); }
.sheet-add { min-height: 62px; font-size: 1.2rem; }
.wiz-progress { height: 8px; background: var(--g2); }
.wiz-progress span { background: linear-gradient(90deg, var(--y-d), var(--y)); }
.wiz-step { font-family: var(--font-d); text-transform: uppercase; letter-spacing: .06em; font-size: .98rem; }
.upgrade { background: var(--y); border: 0; border-radius: var(--r-xl); box-shadow: 0 5px 0 var(--k); padding: 18px; }
.upgrade-q strong { font-weight: 900; text-transform: uppercase; font-size: 1.55rem; line-height: .95; }
.upgrade-q span { color: #3a2f00; font-weight: 600; }
.added-title { font-weight: 800; text-transform: uppercase; font-size: 1.3rem; }

/* ---------- Validation / paiement ---------- */
.co-block { border: 1px solid var(--g2); border-radius: var(--r-xl); padding: 22px; }
.co-legend { font-weight: 900; text-transform: uppercase; font-size: 1.55rem; letter-spacing: .01em; display: flex; align-items: center; gap: 10px; }
.co-legend::before { content: ""; width: 10px; height: 26px; border-radius: 4px; background: var(--y); }
.radio-card { border-radius: var(--r); border-width: 2px; min-height: 58px; }
.radio-card:has(input:checked) { border-color: var(--k); background: var(--y-xl); box-shadow: 0 3px 0 var(--k); }
.co-recap { border-top: 6px solid var(--y); }
.rl-qty { font-family: var(--font-d); font-size: 1.15rem; }
#co-submit { min-height: 64px; font-size: 1.25rem; }

/* ---------- Suivi de commande ---------- */
.track-head { background: radial-gradient(80% 90% at 90% 0%, rgba(255,202,42,.25), transparent 60%), var(--k); border-bottom: 6px solid var(--y); }
.track-thanks { font-weight: 900; text-transform: uppercase; font-size: 1.5rem; letter-spacing: .02em; }
.track-number { font-family: var(--font-d); color: var(--y); font-weight: 900; }
.track-label { font-family: var(--font-d); letter-spacing: .14em; }
.steps li { font-family: var(--font-d); text-transform: uppercase; letter-spacing: .04em; font-size: .95rem; }
.track-status { font-family: var(--font-d); text-transform: uppercase; font-size: 1.4rem; font-weight: 900; }

/* ---------- Compte & fidélité ---------- */
.form-card { border-radius: var(--r-xl); border: 1px solid var(--g2); box-shadow: var(--sh); padding: 24px; }
.form-card .h3 { font-size: 1.6rem; }
.field label { font-weight: 700; }
input[type=text], input[type=email], input[type=tel], input[type=password], input:not([type]), select, textarea { border-radius: 14px; border: 2px solid var(--g2); min-height: 52px; background: #fff; }
input:focus, select:focus, textarea:focus { border-color: var(--k); box-shadow: 0 0 0 4px rgba(255,202,42,.55); }
.points-card { position: relative; overflow: hidden; background: radial-gradient(90% 120% at 100% 0%, rgba(255,202,42,.35), transparent 55%), var(--k); border-radius: var(--r-xl); padding: 26px; box-shadow: var(--sh-lg); }
.points-card::after { content: "★"; position: absolute; right: 18px; bottom: -28px; font-size: 9rem; line-height: 1; color: rgba(255,202,42,.14); }
.pts-num { font-weight: 900; font-size: 4rem; }
.order-row { background: var(--w); border-radius: var(--r-lg); box-shadow: var(--sh); }

/* ---------- Infos, zones, horaires ---------- */
.zone-card { border: 1px solid var(--g2); border-top: 5px solid var(--y); border-radius: var(--r-lg); }
.zone-name { font-weight: 900; font-size: 1.4rem; }
.towns li { background: var(--w); border: 1.5px solid var(--g2); font-weight: 600; }
.info-card { border-radius: var(--r-xl); background: var(--cream); border: 1px solid var(--g2); }
.info-card--dark { background: var(--k); border-color: var(--k); }
.hours-block { background: var(--cream); border: 1px solid var(--g2); }
.usp li { background: var(--cream); border: 1px solid var(--g2); }
.usp strong { font-family: var(--font-d); text-transform: uppercase; font-size: 1.2rem; letter-spacing: .02em; }
.table thead th { background: var(--cream); font-family: var(--font-d); text-transform: uppercase; letter-spacing: .04em; }

/* ---------- Pied de page ---------- */
.site-footer { border-top: 6px solid var(--y); background: var(--k); }
.f-title { color: var(--y); font-weight: 800; font-size: 1.2rem; letter-spacing: .08em; }
.site-footer .logo-img { width: 92px; height: 92px; }
.f-bottom { font-weight: 500; }

/* ---------- Bandeau final « Une petite faim ? » ---------- */
.ox-hungry { position: relative; overflow: hidden; background: var(--y); color: var(--k); padding: 60px 0; }
.ox-hungry::before { content: "MIAM MIAM MIAM MIAM MIAM"; position: absolute; left: -2%; top: 50%; transform: translateY(-50%); white-space: nowrap; font-family: var(--font-d); font-weight: 900; font-size: 13rem; line-height: 1; color: rgba(11,11,11,.05); pointer-events: none; }
.ox-hungry-in { position: relative; display: grid; gap: 18px; justify-items: start; }
.ox-hungry .h2 { font-size: clamp(2.6rem, 8vw, 4.6rem); max-width: 14ch; }
.ox-hungry p { font-size: 1.15rem; font-weight: 600; max-width: 52ch; }
.ox-hungry .btn--dark { min-height: 62px; font-size: 1.25rem; padding: 0 32px; }
@media (min-width: 900px) { .ox-hungry-in { grid-template-columns: 1fr auto; align-items: center; } }

/* ---------- Bloc « Passe en menu » & fidélité (accueil) ---------- */
.ox-duo { display: grid; gap: 18px; }
@media (min-width: 900px) { .ox-duo { grid-template-columns: 1.15fr 1fr; gap: 24px; } }
.ox-promo { position: relative; overflow: hidden; border-radius: var(--r-xl); padding: 28px; min-height: 280px; display: grid; align-content: end; gap: 10px; box-shadow: var(--sh-lg); }
.ox-promo--menu { background: var(--k); color: var(--w); }
.ox-promo--menu img { position: absolute; right: -40px; top: -30px; width: 62%; max-width: 360px; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 6px solid var(--y); transform: rotate(8deg); }
.ox-promo--loyal { background: var(--y); color: var(--k); }
.ox-promo .ox-big { font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: clamp(2.3rem, 6vw, 3.4rem); line-height: .9; position: relative; max-width: 11ch; }
.ox-promo .ox-big em { font-style: normal; color: var(--y); }
.ox-promo--loyal .ox-big em { color: var(--w); -webkit-text-stroke: 2px var(--k); paint-order: stroke fill; }
.ox-promo p { position: relative; font-weight: 600; max-width: 40ch; }
.ox-promo--menu p { color: #d9d9d9; }
.ox-promo .btn { position: relative; justify-self: start; margin-top: 6px; }
.ox-sticker { position: absolute; top: 22px; left: 22px; z-index: 1; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; letter-spacing: .04em; background: var(--y); color: var(--k); padding: 8px 14px; border-radius: 999px; transform: rotate(-6deg); box-shadow: 0 3px 0 var(--y-dd); }
.ox-promo--loyal .ox-sticker { background: var(--k); color: var(--y); box-shadow: 0 3px 0 #000; }
.ox-steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 6px 0 4px; }
.ox-steps li { background: rgba(255,255,255,.55); border-radius: 14px; padding: 10px; font-weight: 700; font-size: .9rem; line-height: 1.2; }
.ox-steps b { display: block; font-family: var(--font-d); font-weight: 900; font-size: 1.6rem; line-height: 1; }

/* ---------- Animations d'apparition ---------- */
@keyframes ox-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.cards-grid > li, .cat-grid > *, .prod-grid > *, .menu-list > *, .ox-promo, .zone-card { animation: ox-rise 520ms cubic-bezier(.2,.8,.2,1) both; }
.cards-grid > li:nth-child(2), .cat-grid > :nth-child(2), .prod-grid > :nth-child(2) { animation-delay: 60ms; }
.cards-grid > li:nth-child(3), .cat-grid > :nth-child(3), .prod-grid > :nth-child(3) { animation-delay: 120ms; }
.cat-grid > :nth-child(4), .prod-grid > :nth-child(4) { animation-delay: 180ms; }
@supports (animation-timeline: view()) {
  .cards-grid > li, .cat-grid > *, .menu-list > *, .ox-promo, .zone-card { animation-timeline: view(); animation-range: entry 0% entry 40%; animation-delay: 0s; }
}

@media (prefers-reduced-motion: reduce) {
  .ox-ticker-track { animation: none; }
  .cards-grid > li, .cat-grid > *, .prod-grid > *, .menu-list > *, .ox-promo, .zone-card { animation: none; }
}

/* ---------- Grille produits : grandes photos ---------- */
.prod-flag { left: auto; right: 10px; top: 10px; z-index: 2; }
.prod { grid-template-columns: 1fr 136px; }
@media (min-width: 640px) {
  .prod-grid { grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 16px; }
  .prod { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .prod-visual { order: 0; aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  .prod-body { padding: 14px 16px 16px; }
  .prod-foot { margin-top: auto; padding-top: 8px; }
  .prod-body { display: flex; flex-direction: column; }
}

.var-badge { flex-basis: auto; width: auto; }

.section-head .kicker { display: flex; margin-bottom: 10px; }
.ox-promo { text-decoration: none; padding-top: 84px; min-height: 340px; transition: transform var(--t), box-shadow var(--t); }
.ox-promo:hover { transform: translateY(-4px); }
.ox-promo:hover .btn--yellow { background: #FFD448; }
.ox-steps { list-style: none; padding: 0; }
.ox-promo--menu::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,11,11,.96) 0%, rgba(11,11,11,.85) 45%, rgba(11,11,11,0) 75%); pointer-events: none; }
.ox-promo--menu > :not(img) { z-index: 1; }
.ox-promo--menu .ox-big, .ox-promo--menu p { max-width: 60%; }
.ox-promo--menu img { right: -30px; top: 50%; transform: translateY(-50%) rotate(8deg); width: 52%; }
@media (max-width: 559px) {
  .ox-promo { padding: 76px 20px 22px; }
  .ox-promo--menu img { width: 170px; top: 18px; right: -24px; transform: rotate(8deg); }
  .ox-promo--menu .ox-big, .ox-promo--menu p { max-width: none; }
  .ox-promo--menu::after { background: linear-gradient(180deg, rgba(11,11,11,0) 0%, rgba(11,11,11,.9) 38%, rgba(11,11,11,.97) 100%); }
  .ox-steps { grid-template-columns: 1fr; }
  .ox-hungry::before { font-size: 8rem; }
}

/* Surligneur : version robuste multi-lignes */
.section-head .h2, .page-hero .h1, .account > .h1, .acc-head .h1, .co-top .h2, .menu-section .h2 {
  display: block; background: none; padding: 0;
  text-decoration-line: underline; text-decoration-color: var(--y); text-decoration-thickness: .3em;
  text-underline-offset: -.14em; text-decoration-skip-ink: none;
}
.section--dark .section-head .h2 { text-decoration-line: none; }
@media (max-width: 479px) {
  .mode-cta strong { font-size: 1.05rem; }
  .mode-cta small { font-size: .8rem; }
  .hero-title { font-size: clamp(2.6rem, 12vw, 3.4rem); }
}

.dcheck-title { font-family: var(--font-d) !important; font-weight: 900 !important; text-transform: uppercase; font-size: clamp(1.7rem, 4vw, 2.2rem) !important; line-height: .95; }
.dcheck-badge { font-family: var(--font-d); text-transform: uppercase; letter-spacing: .05em; }

/* Correctif mobile : titres des catégories (accueil) empilés, sans chevauchement */
#carte .cat-tile { display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; padding: 16px 60px 16px 16px; }
#carte .cat-tile .cat-name, #carte .cat-tile .cat-meta { position: relative; left: auto; right: auto; top: auto; bottom: auto; z-index: 2; }
#carte .cat-tile .cat-go { z-index: 3; }
@media (max-width: 720px) {
  #carte .cat-tile { padding: 12px 52px 12px 12px; }
  #carte .cat-tile .cat-name { font-size: 1.35rem; }
  #carte .cat-tile .cat-meta { font-size: .8rem; line-height: 1.25; }
}
/* Correctif mobile : la photo du héros remonte sous le titre, comme la mise en avant sur ordinateur */
@media (max-width: 899px) {
  .hero-in { display: flex; flex-direction: column; align-items: stretch; }
  .hero-in > .status-pill { order: 0; align-self: flex-start; }
  .hero-in > .hero-title { order: 1; }
  .hero-in > .hero-photo { order: 2; align-self: center; width: min(76vw, 340px); max-width: 340px; margin: 4px auto 0; }
  .hero-in > .hero-sub { order: 3; }
  .hero-in > .hero-ctas { order: 4; }
  .hero-in > .hero-main { order: 5; align-self: stretch; }
}

/* ---------- Rubrique OASIS RUSH (accueil) ---------- */
.ox-rush { position: relative; overflow: hidden; background: radial-gradient(60% 80% at 80% 30%, rgba(255,202,42,.32), transparent 65%), repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 2px, transparent 2px 22px), #0B0B0B; color: #fff; padding: 64px 0; }
.ox-rush-in { display: grid; gap: 30px; align-items: center; }
@media (min-width: 900px) { .ox-rush-in { grid-template-columns: 1.2fr 1fr; } }
.ox-rush-txt { display: grid; gap: 14px; justify-items: start; }
.ox-rush-logo { margin: 0; display: grid; line-height: .82; font-family: var(--font-d); font-weight: 900; transform: rotate(-3deg); }
.ox-rush-logo .o { font-size: clamp(4rem, 13vw, 7rem); color: var(--y); -webkit-text-stroke: 3px #000; paint-order: stroke fill; }
.ox-rush-logo .r { font-size: clamp(3.6rem, 12vw, 6.4rem); font-style: italic; color: #fff; letter-spacing: .06em; padding-left: .4em; }
.ox-rush-tag { font-family: var(--font-d); font-weight: 800; text-transform: uppercase; font-size: 1.5rem; }
.ox-rush-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; font-weight: 600; color: #e6e6e6; }
.ox-rush-note { color: #bdbdbd; font-size: .95rem; margin: 0; }
.ox-rush-visual { justify-self: center; text-decoration: none; }
.ox-rush-phone { display: block; width: 230px; height: 440px; border-radius: 38px; background: #1b1b1b; border: 8px solid #2a2a2a; box-shadow: 0 30px 60px rgba(0,0,0,.6), 0 0 0 3px var(--y); transform: rotate(6deg); padding: 10px; transition: transform var(--t); }
.ox-rush-visual:hover .ox-rush-phone { transform: rotate(2deg) scale(1.03); }
.ox-rush-screen { display: grid; place-content: center; justify-items: center; gap: 4px; height: 100%; border-radius: 28px; background: linear-gradient(180deg, #3b8fd9 0%, #9fd2f0 45%, #ffe2a8 70%, #3a3a3f 70%); font-family: var(--font-d); font-weight: 900; }
.ox-rush-screen b { font-size: 3.4rem; color: var(--y); -webkit-text-stroke: 2px #000; paint-order: stroke fill; line-height: .85; }
.ox-rush-screen i { font-size: 3rem; color: #fff; -webkit-text-stroke: 2px #000; paint-order: stroke fill; line-height: .85; }
.ox-rush-screen em { margin-top: 18px; font-style: normal; background: var(--y); color: #000; padding: 8px 16px; border-radius: 14px; box-shadow: 0 4px 0 var(--y-dd); font-size: 1.3rem; }

/* ---------- Hero : slogan « La faim n’attend pas » (13/10/2026) ---------- */
.hero-title.hero-title--slogan { max-width: none; width: 100%; margin: 0; container-type: inline-size;
  font-family: var(--font-d); font-weight: 900; text-transform: uppercase; letter-spacing: -.005em; line-height: .9;
  font-size: clamp(2rem, 10.6vw, 5.6rem); }
.hero-title--slogan .ht-line { display: block; white-space: nowrap; font-size: min(11.4cqi, 5.6rem); }
.hero-title--slogan .ht-white { color: #fff; }
.hero-title--slogan .ht-yellow { color: #FFCA2A; text-shadow: 0 .05em 0 rgba(0,0,0,.35); }
.hero-tagline { margin: .4rem 0 0; font-family: var(--font-d); font-weight: 800; text-transform: uppercase;
  letter-spacing: .035em; line-height: 1.15; color: #fff; font-size: clamp(1.08rem, 1rem + .9vw, 1.6rem); text-wrap: balance; }
.hero-tagline::before { content: ""; display: inline-block; width: .9em; height: .2em; margin: 0 .45em .22em 0;
  background: #FFCA2A; border-radius: 99px; vertical-align: middle; }
.hero-tagline .ht-tag2 { display: inline-block; }
@media (min-width: 900px) {
  .hero-title--slogan .ht-line { font-size: min(17.6cqi, 7rem); }
  .hero-title--slogan .ht-line > span { display: block; }
  .hero-title--slogan .ht-yellow { margin-top: .04em; }
}
@media (max-width: 899px) {
  .hero .hero-in > .hero-tagline { order: 1; }
  .hero .hero-in > .hero-photo { margin-bottom: 30px; }
}
@media (max-width: 759px) {
  .hero .hero-in { row-gap: 12px; padding-top: 18px; }
  .hero .hero-in > .hero-photo { width: min(80vw, 330px); margin: 8px auto 30px; }
}

/* ---------- Fidélité sans compte (/fidelite) – 13/10/2026 ---------- */
.page-loyalty { background: #F7F5F0; }
.loy-hero { position: relative; overflow: hidden; color: #fff;
  background: radial-gradient(60% 90% at 90% 10%, rgba(255,202,42,.30), transparent 60%), linear-gradient(180deg, #0B0B0B, #151515); }
.loy-hero::after { content: "★"; position: absolute; right: -10px; bottom: -70px; font-size: 16rem; line-height: 1; color: rgba(255,202,42,.10); pointer-events: none; }
.loy-hero-in { position: relative; z-index: 1; padding-top: clamp(28px, 6vw, 64px); padding-bottom: clamp(72px, 10vw, 110px); }
.loy-kicker { display: inline-flex; gap: 8px; align-items: center; margin: 0 0 14px; padding: 6px 12px; border-radius: 99px; background: rgba(255,255,255,.1);
  font-family: var(--font-d); font-weight: 800; text-transform: uppercase; letter-spacing: .06em; font-size: .9rem; }
.loy-kicker span { color: #FFCA2A; }
.loy-title { margin: 0; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; line-height: .9; letter-spacing: -.005em;
  font-size: clamp(2.6rem, 9vw, 5.4rem); }
.loy-title span { display: block; }
.loy-title .loy-y { color: #FFCA2A; }
.loy-sub { margin: 14px 0 0; max-width: 34ch; font-size: clamp(1.08rem, 1rem + .6vw, 1.35rem); font-weight: 600; color: #eee; }
.loy-steps { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 760px; }
.loy-steps li { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); font-weight: 600; font-size: .95rem; line-height: 1.25; }
.loy-steps b { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #FFCA2A; color: #111; font-family: var(--font-d); font-size: 1.2rem; }
@media (max-width: 640px) { .loy-steps { grid-template-columns: 1fr; } .loy-steps li { padding: 10px 12px; } }

.loy-body { position: relative; z-index: 2; margin-top: -52px; padding-bottom: 56px; display: grid; gap: 16px; max-width: 640px; }
.loy-loading { background: #fff; border-radius: 20px; padding: 20px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,.08); }
.loy-card { background: #fff; color: #111; border-radius: 22px; padding: clamp(20px, 4vw, 30px); box-shadow: 0 12px 34px rgba(0,0,0,.08); display: grid; gap: 14px; }
.loy-card[hidden], .loy-space[hidden] { display: none; }
.loy-card .field { margin: 0; }
.loy-card input { font-size: 1.05rem; min-height: 52px; }
.loy-h2 { margin: 0; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: clamp(1.7rem, 4.5vw, 2.2rem); line-height: 1; }
.loy-h3 { margin: 0; font-family: var(--font-d); font-weight: 800; text-transform: uppercase; font-size: 1.35rem; }
.loy-lead { margin: -4px 0 0; color: #444; }
.loy-row { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
@media (max-width: 420px) { .loy-row { grid-template-columns: 1fr; } }
.loy-cta { font-family: var(--font-d); font-weight: 900; text-transform: uppercase; letter-spacing: .02em; font-size: 1.2rem; min-height: 58px; }
.loy-legal { margin: 0; font-size: .85rem; color: #666; line-height: 1.45; }
.loy-otp { text-align: center; letter-spacing: .5em; font-size: 1.8rem !important; font-family: var(--font-d); font-weight: 800; }
.loy-test { margin: 0; padding: 10px 12px; border-radius: 12px; background: #FFF6D6; border: 1px dashed #E5AF0B; font-weight: 700; }
.loy-code-actions { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.loy-code-actions .linklike[disabled] { opacity: .5; cursor: default; }

.loy-space { display: grid; gap: 16px; }
.loy-wallet { position: relative; overflow: hidden; border-radius: 24px; padding: clamp(22px, 5vw, 32px); color: #fff; display: grid; gap: 12px;
  background: radial-gradient(90% 120% at 100% 0%, rgba(255,202,42,.35), transparent 55%), #111; box-shadow: 0 18px 40px rgba(0,0,0,.25); }
.loy-wallet::after { content: "★"; position: absolute; right: 14px; top: -24px; font-size: 8rem; color: rgba(255,202,42,.12); pointer-events: none; }
.loy-hello { margin: 0; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: clamp(1.6rem, 5vw, 2.1rem); line-height: 1; outline: none; }
.loy-balance { margin: 0; font-family: var(--font-d); font-weight: 900; line-height: .9; color: #FFCA2A; font-size: clamp(3.6rem, 14vw, 5.2rem); }
.loy-balance small { font-size: .35em; color: #fff; text-transform: uppercase; letter-spacing: .04em; }
.loy-bar { height: 14px; border-radius: 99px; background: rgba(255,255,255,.16); overflow: hidden; }
.loy-bar span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #FFCA2A, #FFE07A); transition: width .8s cubic-bezier(.2,.8,.2,1); }
.loy-next { margin: 0; font-weight: 700; }
.loy-pending { margin: 0; font-size: .92rem; color: #ddd; }
.loy-reward { margin: 4px 0 0; display: grid; gap: 2px; padding: 12px 14px; border-radius: 14px; background: #FFCA2A; color: #111; }
.loy-reward strong { font-family: var(--font-d); text-transform: uppercase; font-size: 1.25rem; }
.loy-reward--soon, .loy-reward--off { background: rgba(255,255,255,.1); color: #fff; font-weight: 600; }
.loy-wallet .loy-cta { position: relative; z-index: 1; margin-top: 4px; }
.loy-hist { list-style: none; margin: 0; padding: 0; display: grid; }
.loy-h-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #eee; }
.loy-h-row:last-child { border-bottom: 0; }
.loy-h-l { display: grid; }
.loy-h-l small { color: #777; }
.loy-h-p { font-family: var(--font-d); font-weight: 900; font-size: 1.3rem; color: #1E7D3A; }
.loy-h-row.is-neg .loy-h-p { color: #C62828; }
.loy-data-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.loy-logout { justify-self: start; }

/* Récompense au moment de commander + message après commande */
.co-loy { display: grid; gap: 8px; padding: 14px 16px; border-radius: 16px; background: #111; color: #fff; }
.co-loy p { margin: 0; }
.co-loy strong { color: #FFCA2A; }
.co-loy a { color: #FFCA2A; font-weight: 700; }
.co-loy .check { color: #fff; }
.co-loy .co-loy-note { font-size: .88rem; color: #ccc; }
.track-loy { display: grid; gap: 6px; text-align: center; padding: 20px; border-radius: 22px; color: #111; background: #FFCA2A; box-shadow: 0 10px 28px rgba(255,202,42,.35); }
.track-loy-t { margin: 0; font-family: var(--font-d); font-weight: 900; text-transform: uppercase; font-size: clamp(1.5rem, 5vw, 2rem); line-height: 1; }
.track-loy-p { margin: 0; font-family: var(--font-d); font-weight: 900; font-size: clamp(2.4rem, 9vw, 3.2rem); line-height: 1; }
.track-loy-m { margin: 0; font-weight: 600; }
.track-loy a { color: #111; font-weight: 800; }

/* Suggestions par recette (16/10/2026) */
.opt-tag{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#FFCA2A;color:#111;font-size:.7rem;font-weight:700;line-height:1.5;letter-spacing:.03em;text-transform:uppercase;vertical-align:middle}