/*
Theme Name: La Fringale
Theme URI: https://www.lafringale91.com
Author: OSO Agency
Author URI: https://www.osoagency.fr
Description: Thème WordPress custom pour La Fringale — Smash Burgers & Philly's Halal à Longjumeau (91). Univers américain vintage, or & rouge sur fond nocturne. Reproduit la maquette officielle v2.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lafringale
Tags: restaurant, one-column, custom-menu, custom-logo, full-width-template, rtl-language-support, footer-widgets
*/

/* ════════════════════════════════════════
   RESET & TOKENS
════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }

:root {
  --night:   #0E2138;
  --navy:    #15315A;
  --navy2:   #1E4170;
  --red:     #E8151B;
  --red2:    #B80F14;
  --gold:    #F5C518;
  --gold2:   #D4A012;
  --gold3:   #FFE066;
  --white:   #FFFFFF;
  --cream:   #FFF8EC;
  --gray:    #8A99AA;
  --shadow:  0 20px 50px rgba(0,0,0,0.5);

  /* Arcade — police pixel (chrome/labels uniquement) + néons dérivés des tokens */
  --font-pixel: 'Press Start 2P', 'Courier New', monospace;
  --neon-gold:  0 0 4px var(--gold3), 0 0 10px rgba(245,197,24,.55);
  --neon-red:   0 0 4px var(--red),  0 0 12px rgba(232,21,27,.50);
  --crt-scanlines: repeating-linear-gradient(to bottom,
    rgba(0,0,0,0) 0px, rgba(0,0,0,0) 2px, rgba(0,0,0,.16) 3px, rgba(0,0,0,0) 4px);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Barlow', sans-serif;
  background: var(--night);
  color: var(--white);
  overflow-x: hidden;
  font-weight: 400;
  line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

/* No-JS safety: reveals only hide when JS is active */
.js .reveal { opacity: 0; transform: translateY(28px); }
.reveal { transition: opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* Accessibility helpers */
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; padding: 0; overflow: hidden;
  position: absolute !important; word-wrap: normal !important;
}
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--gold); color: var(--navy); padding: 10px 18px;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  letter-spacing: 2px; text-transform: uppercase; border-radius: 0 0 4px 0;
}
.skip-link:focus { left: 0; }

:focus-visible { outline: 3px solid var(--gold3); outline-offset: 2px; }

/* ── STARS UTILITY ── */
.stars {
  display: inline-flex; gap: 5px;
  color: var(--gold); font-size: 13px; letter-spacing: 2px;
}

/* ════════════════════════════════════════
   NAV
════════════════════════════════════════ */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  background: var(--night);
  border-bottom: 3px solid var(--gold);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2.5rem; height: 70px;
  box-shadow: 0 4px 30px rgba(0,0,0,0.6);
  transition: box-shadow .25s ease;
}
.site-nav.scrolled { box-shadow: 0 6px 34px rgba(0,0,0,0.85); }

/* Offset for WP admin bar */
body.admin-bar .site-nav { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar .site-nav { top: 46px; } }

.nav-logo-text {
  font-family: 'Pacifico', cursive;
  font-size: 26px;
  color: var(--white);
  text-decoration: none;
  text-shadow: 2px 2px 0 var(--red), -1px -1px 0 var(--gold2);
  letter-spacing: 1px;
  line-height: 70px;
}

/* Emblème baseball dans la nav (logo réel détouré) */
.nav-logo-img {
  display: inline-flex; align-items: center; gap: 12px;
  height: 70px; text-decoration: none;
}
.nav-logo-img img { height: 52px; width: auto; }
.nav-logo-word {
  font-family: 'Pacifico', cursive;
  font-size: 23px; color: var(--white);
  text-shadow: 2px 2px 0 var(--red), -1px -1px 0 var(--gold2);
  letter-spacing: 1px;
}
@media (max-width: 480px) {
  .nav-logo-img img { height: 44px; }
  .nav-logo-word { display: none; }
}

.nav-links { display: flex; align-items: center; gap: 1.75rem; list-style: none; }

.nav-links a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  text-decoration: none;
  transition: color .2s;
}
.nav-links a:hover, .nav-links a:focus-visible { color: var(--gold); }

.nav-halal {
  display: inline-block;
  background: var(--gold);
  color: var(--navy);
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800; font-size: 11px; letter-spacing: 2px;
  padding: 5px 12px; border-radius: 3px;
}

.nav-cta {
  background: var(--red) !important;
  color: var(--white) !important;
  padding: 10px 22px !important;
  border-radius: 4px !important;
  font-weight: 800 !important;
  border: 2px solid var(--gold2) !important;
}
.nav-cta:hover, .nav-cta:focus-visible { background: var(--red2) !important; color: var(--gold) !important; }

/* Hamburger */
.nav-toggle {
  display: none;
  flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px;
  background: transparent; border: none; cursor: pointer; padding: 8px;
}
.nav-toggle span {
  display: block; height: 3px; width: 100%;
  background: var(--gold); border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ════════════════════════════════════════
   BUTTONS
════════════════════════════════════════ */
.btn-gold {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--gold); color: var(--navy);
  text-decoration: none;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 800; letter-spacing: 2px;
  text-transform: uppercase;
  padding: 16px 36px; border-radius: 4px;
  border: 2px solid var(--gold3);
  box-shadow: 0 4px 20px rgba(245,197,24,0.3);
  transition: all .2s; cursor: pointer;
}
.btn-gold:hover, .btn-gold:focus-visible {
  background: var(--gold3);
  box-shadow: 0 6px 30px rgba(245,197,24,0.5);
  transform: translateY(-2px);
}

.btn-outline-gold {
  display: inline-flex; align-items: center; gap: 10px;
  background: transparent; color: var(--gold);
  text-decoration: none;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 800; letter-spacing: 2px;
  text-transform: uppercase;
  padding: 14px 32px; border-radius: 4px;
  border: 2px solid var(--gold2);
  transition: all .2s; cursor: pointer;
}
.btn-outline-gold:hover, .btn-outline-gold:focus-visible { background: rgba(245,197,24,0.1); color: var(--gold3); }

/* ════════════════════════════════════════
   HERO
════════════════════════════════════════ */
.hero {
  min-height: 100vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
  padding-top: 70px;
  background: var(--navy);
}

.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 50% 80%, rgba(20,60,120,0.6) 0%, transparent 70%),
    radial-gradient(ellipse 60% 40% at 30% 100%, rgba(30,80,160,0.3) 0%, transparent 60%),
    radial-gradient(ellipse 60% 40% at 70% 100%, rgba(30,80,160,0.3) 0%, transparent 60%),
    linear-gradient(180deg, #0E2138 0%, #163A63 40%, #1C4C8A 70%, #15315A 100%);
}
.hero-bg.has-photo { background-size: cover; background-position: center; }

.hero-lights { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero-lights::before {
  content: ''; position: absolute; top: 10%; left: 5%;
  width: 3px; height: 40%;
  background: linear-gradient(180deg, rgba(245,197,24,0) 0%, rgba(245,197,24,0.15) 60%, rgba(245,197,24,0.5) 100%);
  box-shadow: 0 0 40px 20px rgba(245,197,24,0.08);
  transform: rotate(-5deg);
}
.hero-lights::after {
  content: ''; position: absolute; top: 8%; right: 8%;
  width: 3px; height: 38%;
  background: linear-gradient(180deg, rgba(245,197,24,0) 0%, rgba(245,197,24,0.15) 60%, rgba(245,197,24,0.5) 100%);
  box-shadow: 0 0 40px 20px rgba(245,197,24,0.08);
  transform: rotate(5deg);
}

.hero-content {
  position: relative; z-index: 5;
  text-align: center;
  padding: 3rem 2rem 2rem;
  max-width: 900px; width: 100%;
}

.hero-logo-zone { margin-bottom: 1.5rem; animation: fadeInDown 0.7s ease both; }

.hero-logo-main {
  font-family: 'Pacifico', cursive;
  font-size: clamp(72px, 12vw, 130px);
  line-height: 0.9; color: var(--white);
  text-shadow: 3px 3px 0 var(--red), 6px 6px 0 rgba(232,21,27,0.4), -2px -2px 0 rgba(245,197,24,0.3);
  filter: drop-shadow(0 8px 30px rgba(232,21,27,0.3));
  letter-spacing: -2px;
}

.hero-logo-sub {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: 6px;
  color: var(--gold); text-transform: uppercase; margin-top: 4px;
}

.hero-banner {
  position: relative; background: var(--red);
  margin: 1.5rem -20px; padding: 14px 40px;
  transform: rotate(-1deg);
  animation: fadeIn 0.7s 0.3s ease both;
  border-top: 3px solid var(--gold);
  border-bottom: 3px solid var(--gold);
}
.hero-banner::before, .hero-banner::after {
  content: '★'; position: absolute; top: 50%; transform: translateY(-50%);
  color: var(--gold); font-size: 18px;
}
.hero-banner::before { left: 16px; }
.hero-banner::after  { right: 16px; }

.hero-banner-text {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(16px, 3vw, 24px); font-weight: 800; letter-spacing: 3px;
  text-transform: uppercase; color: var(--white); white-space: nowrap;
}
.hero-banner-text em { font-style: italic; color: var(--gold); }

.hero-tagline {
  margin: 1.5rem 0;
  display: flex; align-items: center; justify-content: center; gap: 16px;
  animation: fadeIn 0.6s 0.5s ease both;
}
.hero-tagline-line { flex: 1; max-width: 100px; height: 2px; background: linear-gradient(90deg, transparent, var(--gold2), transparent); }
.hero-tagline-text {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px; font-weight: 700; letter-spacing: 3px;
  color: var(--gold); text-transform: uppercase;
}

.hero-stars-bar {
  display: flex; justify-content: center; gap: 6px;
  margin-bottom: 2rem; font-size: 18px; color: var(--gold);
  animation: fadeIn 0.6s 0.6s ease both;
}

.hero-actions {
  display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap;
  animation: fadeIn 0.6s 0.8s ease both;
}

.hero-bottom {
  position: relative; z-index: 5; width: 100%;
  padding: 1.5rem 2.5rem;
  background: rgba(0,0,0,0.5);
  border-top: 2px solid var(--gold2);
  display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap;
}
.hero-bottom-item {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
}
.hero-bottom-item .icon { font-size: 20px; }
.hero-bottom-item span { color: rgba(255,255,255,0.6); }
.hero-bottom-item strong { color: var(--gold); }
.hero-bottom-sep { width: 1px; height: 30px; background: rgba(255,255,255,0.15); }

/* ════════════════════════════════════════
   LIVRAISON BANNER
════════════════════════════════════════ */
.livraison-band {
  background: var(--red2);
  border-top: 4px solid var(--gold);
  border-bottom: 4px solid var(--gold);
  padding: 2.5rem; text-align: center;
  position: relative; overflow: hidden;
}
.livraison-band::before {
  content: 'LIVRAISON'; position: absolute;
  font-family: 'Oswald', sans-serif; font-size: 200px; font-weight: 700;
  color: rgba(255,255,255,0.04);
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  white-space: nowrap; pointer-events: none;
}
.livraison-inner {
  position: relative; z-index: 2;
  max-width: 1000px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap;
}
.livraison-title {
  font-family: 'Oswald', sans-serif; font-size: 48px; font-weight: 700;
  color: var(--gold); letter-spacing: 4px;
  text-shadow: 2px 2px 0 rgba(0,0,0,0.4); line-height: 1;
}
.livraison-grid { display: flex; gap: 2rem; flex-wrap: wrap; align-items: center; justify-content: center; }
.livraison-slot { text-align: center; }
.livraison-slot-day {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold); margin-bottom: 4px;
}
.livraison-slot-time {
  font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 600;
  color: var(--white); line-height: 1.2;
}
.livraison-divider { width: 1px; height: 60px; background: rgba(255,255,255,0.2); }

/* ════════════════════════════════════════
   SECTION COMMONS
════════════════════════════════════════ */
.section { padding: 6rem 2.5rem; scroll-margin-top: 80px; }
.container { max-width: 1200px; margin: 0 auto; }

.section-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: 4px;
  text-transform: uppercase; color: var(--gold); margin-bottom: 0.75rem;
}
.section-eyebrow::before, .section-eyebrow::after { content: '★'; font-size: 10px; color: var(--red); }

.section-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 6vw, 70px);
  font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  line-height: 0.95; color: var(--white); margin-bottom: 1.5rem;
}
.section-title em {
  color: var(--gold); font-style: italic;
  font-family: 'Pacifico', cursive; font-size: 0.85em; font-weight: 400; letter-spacing: 0;
}

/* ════════════════════════════════════════
   MENU SECTION
════════════════════════════════════════ */
.menu-section { background: var(--navy); }
.menu-section .section-title { text-align: center; }
.menu-section .section-eyebrow { display: flex; justify-content: center; }

/* Wrapping pill tabs (full carte = 9 catégories) */
.menu-tabs {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
  margin: 2.5rem auto; max-width: 880px;
}
.menu-tab {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  padding: 10px 18px; cursor: pointer;
  color: rgba(255,255,255,0.55);
  background: transparent;
  border: 1.5px solid var(--gold2); border-radius: 4px;
  transition: all .2s;
}
.menu-tab.active { background: var(--gold); color: var(--navy); border-color: var(--gold3); }
.menu-tab:hover:not(.active), .menu-tab:focus-visible:not(.active) { color: var(--gold); background: rgba(245,197,24,0.08); }

.menu-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1.5rem;
}

.menu-card {
  background: var(--navy2);
  border: 1px solid rgba(245,197,24,0.2);
  border-radius: 6px; overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.menu-card.is-hidden { display: none; }
.menu-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: var(--gold);
}

.menu-card-img {
  width: 100%; aspect-ratio: 16/10;
  background: linear-gradient(135deg, #0D2040 0%, #1A3560 100%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  position: relative; font-size: 48px; gap: 8px;
  border-bottom: 2px solid rgba(245,197,24,0.15);
}
.menu-card-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Photo produit carrée (1:1, déjà centrée) : zone image carrée, pas de rognage vertical. */
.menu-card-img.has-photo { aspect-ratio: 1 / 1; background: none; }
.menu-card-img .photo-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 2px;
  color: rgba(255,255,255,0.25); text-transform: uppercase;
}
.menu-card-img .menu-badge {
  position: absolute; top: 10px; left: 10px;
  background: var(--gold); color: var(--navy);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 800; letter-spacing: 1.5px;
  padding: 4px 10px; border-radius: 3px; text-transform: uppercase;
}
.menu-card-img .menu-badge.hot { background: var(--red); color: var(--white); }

.menu-card-body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; }
.menu-card-name {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--white); margin-bottom: 6px;
}
.menu-card-desc {
  font-size: 13px; color: rgba(255,255,255,0.6);
  line-height: 1.5; font-weight: 300; margin-bottom: 1rem; flex: 1;
}
.menu-card-footer {
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 1rem; margin-top: auto;
}
.menu-card-price {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700; color: var(--gold); letter-spacing: 1px;
}
.menu-card-price small { font-size: 14px; font-weight: 500; color: rgba(245,197,24,0.7); letter-spacing: 0; }
.menu-card-btn {
  width: 38px; height: 38px;
  background: var(--red);
  border: 2px solid rgba(232,21,27,0.3);
  color: var(--white); border-radius: 50%; cursor: pointer;
  font-size: 22px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s; flex-shrink: 0;
}
.menu-card-btn:hover, .menu-card-btn:focus-visible { background: var(--gold); color: var(--navy); transform: scale(1.1); }

.menu-note {
  text-align: center; margin-top: 2rem;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; letter-spacing: 1px; color: rgba(255,255,255,0.4);
}
.menu-note strong { color: var(--gold); }
.menu-cta { text-align: center; margin-top: 3rem; }

/* ════════════════════════════════════════
   BORNE « LE ROSTER » — carte-joueur + panier
   Override de .menu-card, tokens marque uniquement.
════════════════════════════════════════ */

/* La grille devient un terrain 3D (tilt enfant, pointeur fin) */
.menu-grid { perspective: 1100px; }

/* Filigrane terrain par variante (sur la section, sous la grille) */
.menu-section { position: relative; overflow: hidden; }
.menu-section > .container { position: relative; z-index: 1; }
.menu-section[data-variant]::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
}
.menu-section[data-variant="baseball"]::before { /* diamant craie */
  background:
    linear-gradient(45deg,  transparent 49.6%, rgba(245,197,24,.05) 50%, transparent 50.4%),
    linear-gradient(-45deg, transparent 49.6%, rgba(245,197,24,.05) 50%, transparent 50.4%);
  background-size: 62% 62%; background-position: center 30%; background-repeat: no-repeat;
}
.menu-section[data-variant="basket"]::before { /* cercle central + médiane */
  background:
    radial-gradient(circle at 50% 24%, transparent 116px,
      rgba(245,197,24,.05) 117px, rgba(245,197,24,.05) 120px, transparent 121px),
    linear-gradient(rgba(245,197,24,.04), rgba(245,197,24,.04)) 50% 24% / 2px 56% no-repeat;
}
.menu-section[data-variant="baseball"] { --shine-dur: .6s; }
.menu-section[data-variant="basket"]   { --shine-dur: .45s; }

/* Bandeau roster (scoreboard) — rempli par le JS */
.lineup-banner {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin: 0 auto 1.5rem; max-width: 880px; min-height: 44px; padding: 9px 18px;
  background: var(--red2); border-top: 2px solid var(--gold); border-bottom: 2px solid var(--gold);
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  letter-spacing: 4px; text-transform: uppercase; color: var(--gold3);
  text-shadow: 1px 1px 0 rgba(0,0,0,.4);
}
.lineup-banner:empty { display: none; }
.lineup-banner::before, .lineup-banner::after { content: '★'; color: var(--gold); font-size: 12px; }

/* ── Carte = trading card premium ── */
.menu-card {
  position: relative;
  border: 1.5px solid var(--gold2);
  box-shadow: 0 2px 0 var(--gold2), 0 10px 24px rgba(0,0,0,.45);
  transform: rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition: transform .25s ease, box-shadow .25s ease, border-color .2s;
}
@media (hover:hover) and (pointer:fine) {
  .menu-card:hover {
    transform: rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-5px);
    border-color: var(--gold3);
    box-shadow: 0 3px 0 var(--gold3), 0 18px 40px rgba(0,0,0,.55),
                0 0 0 1px rgba(245,197,24,.25) inset;
  }
}
.menu-card.in-cart { border-color: var(--gold); }

/* Numéro de maillot décoratif (data-num, stable) */
.menu-card::before {
  content: attr(data-num);
  position: absolute; top: 4px; right: 12px; z-index: 1;
  font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic;
  font-size: 60px; line-height: 1; letter-spacing: -2px;
  color: rgba(245,197,24,.13);
  text-shadow: 2px 2px 0 rgba(184,15,20,.18);
  pointer-events: none; transition: color .25s, transform .25s;
}
@media (hover:hover) and (pointer:fine) {
  .menu-card:hover::before { color: rgba(245,197,24,.22); transform: translateX(-4px); }
}

/* Brillance holographique au hover (pointeur fin) */
.menu-card::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(115deg, transparent 30%,
              rgba(255,224,102,.20) 45%, rgba(255,255,255,.28) 50%,
              rgba(255,224,102,.20) 55%, transparent 70%);
  background-size: 250% 100%; background-position: 120% 0;
  mix-blend-mode: screen; opacity: 0; pointer-events: none;
}
@media (hover:hover) and (pointer:fine) {
  .menu-card:hover::after { opacity: 1; animation: lfShine var(--shine-dur,.6s) ease forwards; }
}
@keyframes lfShine { to { background-position: -120% 0; } }

/* Portrait : bandeau poste + médaillon emoji */
.menu-card-img { isolation: isolate; }
.menu-card[data-pos]:not([data-pos=""]) .menu-card-img::before {
  content: attr(data-pos);
  position: absolute; top: 10px; right: 10px; z-index: 3;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--gold3); padding: 3px 8px;
  border: 1px solid var(--gold2); border-radius: 2px;
  background: rgba(14,33,56,.55);
}
.menu-card-emoji {
  font-size: 54px; line-height: 1;
  width: 104px; height: 104px; display: grid; place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, rgba(245,197,24,.18), transparent 70%);
  box-shadow: 0 0 0 2px var(--gold2), 0 0 0 6px rgba(245,197,24,.08);
}
.menu-section[data-variant="basket"] .menu-card-emoji {
  box-shadow: 0 0 0 2px var(--gold2), 0 0 0 7px rgba(232,21,27,.10);
}
.menu-card-img .menu-badge { box-shadow: 0 2px 0 var(--gold2); z-index: 3; }
.menu-card-img .photo-label { opacity: .55; }
.menu-card.in-cart .menu-card-img::after { /* coche « capitaine » quand au panier */
  content: "✓"; position: absolute; top: 8px; left: 10px; z-index: 4;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--gold); color: var(--navy); display: grid; place-items: center;
  font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 13px;
}

/* Footer : prix prioritaire */
.menu-card-price { text-shadow: 1px 1px 0 rgba(184,15,20,.35); }
.menu-card-btn.is-info { background: var(--navy2); border-color: var(--gold2); color: var(--gold); }

/* ─── Carte « photo pleine compo » : la photo porte déjà nom + prix + description.
   On masque les doublons et le chrome roster qui chevaucherait le texte gravé,
   il ne reste que la photo + le bouton d'ajout (et le prix HTML pour les 2 photos
   sans prix gravé : Notorious Big, Milkshake Cookies). ─── */
/* Nom/desc (et prix gravé) restent lisibles aux lecteurs d'écran (clip), juste
   masqués visuellement → pas de doublon à l'écran, zéro perte d'info a11y. */
.menu-card.has-photo .menu-card-name,
.menu-card.has-photo .menu-card-desc,
.menu-card.photo-priced .menu-card-price {
  position: absolute !important; width: 1px; height: 1px; margin: -1px;
  padding: 0; border: 0; overflow: hidden; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
}
.menu-card.has-photo[data-pos] .menu-card-img::before { content: none; } /* badge poste */
.menu-card.has-photo::before { display: none; }                           /* n° maillot déco */
.menu-card.has-photo .menu-card-img .menu-badge { display: none; }        /* badge déjà dans la DA photo */
.menu-card.has-photo .menu-card-body { padding: 0; }
.menu-card.has-photo .menu-card-footer { border-top: 0; margin-top: 0; padding: .6rem .85rem; }
.menu-card.photo-priced .menu-card-footer { justify-content: flex-end; }  /* ne reste que le + */

/* Cascade « distribution » au filtrage (stagger --i posé par le JS) */
.menu-card.lf-deal {
  animation: lfDeal .5s cubic-bezier(.2,.8,.2,1) both;
  animation-delay: calc(var(--i,0) * 45ms);
}
@keyframes lfDeal {
  from { opacity: 0; transform: translateY(24px) rotateZ(-4deg) scale(.96); }
  to   { opacity: 1; transform: translateY(0) rotateZ(0) scale(1); }
}
.menu-section[data-variant="basket"] .menu-card.lf-deal { /* rebond */
  animation-timing-function: cubic-bezier(.2,1.3,.4,1);
}

/* ════════════════════════════════════════
   SÉLECTEUR « SELECT YOUR FIGHTER » (remplace les onglets)
   Cellules = button.menu-tab[data-cat] → filtrage + panier intacts.
════════════════════════════════════════ */
.fighter-select {
  max-width: 920px; margin: 2.5rem auto; padding: 18px 16px;
  border: 2px solid var(--gold2); border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(14,33,56,.92), rgba(21,49,90,.92)),
    repeating-linear-gradient(0deg, rgba(0,0,0,.28) 0 2px, transparent 2px 4px);
}
.fs-chrome {
  font-family: var(--font-pixel); display: flex; align-items: center; gap: 12px;
  font-size: 8px; color: var(--gold);
}
.fs-top { justify-content: space-between; margin-bottom: 16px; }
.fs-title {
  font-size: 13px; line-height: 1.4; text-align: center; flex: 1;
  color: var(--gold3); text-shadow: 0 0 6px rgba(245,197,24,.65), 2px 2px 0 var(--red2);
}
.fs-1up, .fs-ins { color: var(--red); animation: fsBlink 1s steps(1) infinite; }
.fs-bot {
  justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 16px;
  padding-top: 12px; border-top: 1px dashed rgba(245,197,24,.3);
  font-size: 9px; color: var(--gold3);
}
.fs-status { color: var(--white); }
.fs-ins { margin-left: auto; }
.fs-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; max-width: none; margin: 0; }
.fs-cell.menu-tab {
  all: unset; box-sizing: border-box; position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; min-height: 92px; padding: 12px 8px; cursor: pointer;
  border: 1.5px solid var(--gold2); border-radius: 6px;
  background: linear-gradient(180deg, rgba(30,65,112,.85), rgba(21,49,90,.95));
  transition: transform .15s, border-color .15s, box-shadow .15s;
}
.fs-ico { font-size: 30px; line-height: 1; }
.fs-label {
  font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 800;
  letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.7); text-align: center;
}
.fs-cur, .fs-rdy { position: absolute; font-family: var(--font-pixel); opacity: 0; }
.fs-cur {
  top: -10px; left: 50%; transform: translateX(-50%); font-size: 9px;
  padding: 3px 5px; color: var(--navy); background: var(--gold); border-radius: 3px;
}
.fs-rdy { bottom: 6px; left: 50%; transform: translateX(-50%); font-size: 7px; color: var(--red); }
.fs-cell.menu-tab:hover:not(.active), .fs-cell.menu-tab:focus-visible { border-color: var(--gold); transform: translateY(-2px); }
.fs-cell.menu-tab:focus-visible { outline: 3px solid var(--gold3); outline-offset: 2px; }
.fs-cell.menu-tab.active {
  border-color: var(--gold3);
  background: linear-gradient(180deg, rgba(184,15,20,.55), rgba(21,49,90,.95));
  box-shadow: 0 0 0 1px var(--gold) inset;
}
.fs-cell.menu-tab.active .fs-label { color: var(--gold3); }
.fs-cell.menu-tab.active .fs-cur { opacity: 1; animation: fsCur .7s ease-in-out infinite alternate; }
.fs-cell.menu-tab.active .fs-rdy { opacity: 1; animation: fsBlink .8s steps(1) infinite; }
@keyframes fsBlink { 0%,49%{opacity:1} 50%,100%{opacity:.15} }
@keyframes fsCur { from{transform:translate(-50%,0)} to{transform:translate(-50%,-4px)} }

/* ════════════════════════════════════════
   PANIER ARCADE (CREDIT · FEUILLE DE MATCH · START)
   Mêmes sélecteurs que ceux générés par main.js → zéro JS à changer.
════════════════════════════════════════ */
.lf-cart-fab {
  position: fixed; right: 20px; bottom: 20px; z-index: 90;
  display: none; align-items: center; gap: 10px;
  min-height: 52px; padding: 10px 14px 10px 16px;
  border: 2px solid var(--gold2); border-radius: 6px;
  background: var(--crt-scanlines), linear-gradient(180deg, var(--red) 0%, var(--red2) 100%);
  color: var(--white); cursor: pointer;
  font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1px;
  line-height: 1; text-transform: uppercase;
  box-shadow: 0 8px 22px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.06);
  text-shadow: var(--neon-red); -webkit-tap-highlight-color: transparent;
}
.lf-cart-fab.is-active { display: inline-flex; }
.lf-cart-fab::before { content: 'CREDIT'; font-family: var(--font-pixel); font-size: 8px; color: var(--gold3); letter-spacing: 1px; opacity: .9; }
.lf-cart-ico { font-size: 20px; line-height: 1; filter: drop-shadow(0 0 4px rgba(245,197,24,.5)); }
.lf-cart-count {
  min-width: 30px; height: 26px; padding: 0 7px; border-radius: 3px; border: 1px solid var(--gold2);
  background: var(--night); color: var(--gold3); display: grid; place-items: center;
  font-family: var(--font-pixel); font-size: 11px; line-height: 1;
  font-variant-numeric: tabular-nums; text-shadow: var(--neon-gold);
}
.lf-cart-fab.bump { animation: lfCartBump .4s cubic-bezier(.2,1.4,.4,1); }
@keyframes lfCartBump { 30%{transform:scale(1.16)} 60%{transform:scale(.95)} 100%{transform:scale(1)} }
.lf-cart-fab[aria-expanded="false"]:not(.is-active)::after {
  content: 'INSERT COIN'; position: absolute; left: 0; right: 0; bottom: -16px;
  font-family: var(--font-pixel); font-size: 7px; color: var(--gold);
  text-align: center; text-shadow: var(--neon-gold); animation: lfBlink 1.1s steps(1) infinite;
}
@keyframes lfBlink { 50% { opacity: 0; } }

.lf-cart-panel {
  position: fixed; right: 20px; bottom: 86px; z-index: 91; width: 340px;
  max-height: 70vh; overflow: auto;
  background: var(--crt-scanlines), linear-gradient(180deg, var(--navy2) 0%, var(--navy) 100%);
  border: 2px solid var(--gold2); border-radius: 8px;
  box-shadow: 0 16px 44px rgba(0,0,0,.6), inset 0 0 0 1px rgba(245,197,24,.08), 0 0 0 1px rgba(0,0,0,.4);
  padding: 1.1rem 1.1rem 1rem; isolation: isolate;
}
.lf-cart-panel::before {
  content: ''; position: absolute; inset: 0; z-index: -1; border-radius: 8px; pointer-events: none;
  background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(0,0,0,.45) 100%);
}
.lf-cart-panel[hidden] { display: none; }
.lf-cart-title {
  font-family: var(--font-pixel); font-size: 11px; line-height: 1.5;
  letter-spacing: 1px; text-transform: uppercase; color: var(--gold3); margin: 0 0 .9rem; text-shadow: var(--neon-gold);
}
.lf-cart-title::before {
  content: 'FEUILLE DE MATCH'; display: block; font-size: 8px; color: var(--red);
  text-shadow: var(--neon-red); margin-bottom: .5rem; letter-spacing: 2px;
}
.lf-cart-empty {
  font-family: var(--font-pixel); font-size: 8px; line-height: 1.8;
  color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: 1px;
}
.lf-cart-line {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: .55rem 0; border-bottom: 1px solid rgba(245,197,24,.12);
}
.lf-cart-line-name {
  flex: 1; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase; color: var(--white); font-size: 15px;
}
.lf-cart-qty { display: inline-flex; align-items: center; gap: 4px; }
.lf-q {
  width: 44px; min-width: 44px; height: 44px; /* cible tactile WCAG 2.5.5 */
  display: grid; place-items: center;
  border: 1.5px solid var(--gold2); border-radius: 4px;
  background: var(--night); color: var(--gold3); cursor: pointer;
  font-family: var(--font-pixel); font-size: 12px; line-height: 1; text-shadow: var(--neon-gold);
}
.lf-q:hover, .lf-q:focus-visible { background: var(--navy2); border-color: var(--gold3); box-shadow: var(--neon-gold); }
.lf-q-val {
  min-width: 26px; text-align: center; font-family: 'Oswald', sans-serif;
  font-weight: 700; color: var(--white); font-variant-numeric: tabular-nums;
}
.lf-cart-line-sub { font-family: 'Oswald', sans-serif; color: var(--gold); font-weight: 700; font-variant-numeric: tabular-nums; }
.lf-cart-total {
  display: flex; justify-content: space-between; align-items: center;
  margin: .9rem 0; padding: .6rem .7rem;
  background: var(--night); border: 1px solid var(--gold2); border-radius: 4px;
}
.lf-cart-total > span {
  font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1px;
  color: var(--gold); text-transform: uppercase; text-shadow: var(--neon-gold);
}
.lf-cart-total b {
  font-family: 'Oswald', sans-serif; font-weight: 700; color: var(--gold3);
  font-size: 26px; line-height: 1; font-variant-numeric: tabular-nums; text-shadow: var(--neon-gold);
}
.lf-cart-checkout {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  text-align: center; text-decoration: none;
  background: linear-gradient(180deg, var(--gold3) 0%, var(--gold) 60%, var(--gold2) 100%);
  color: var(--navy);
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800; letter-spacing: 2px;
  text-transform: uppercase; font-size: 16px;
  padding: 14px; border-radius: 4px; border: 2px solid var(--gold3);
  position: sticky; bottom: 0;
  box-shadow: 0 4px 0 var(--gold2), 0 8px 16px rgba(0,0,0,.4);
}
.lf-cart-checkout::before { content: 'START'; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; color: var(--red2); }
.lf-cart-checkout:hover, .lf-cart-checkout:focus-visible { background: var(--gold3); transform: translateY(-1px); box-shadow: 0 5px 0 var(--gold2), 0 10px 20px rgba(0,0,0,.45); }
.lf-cart-checkout:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--gold2); }
.lf-cart-fab:focus-visible, .lf-cart-checkout:focus-visible, .lf-q:focus-visible { outline: 2px solid var(--gold3); outline-offset: 2px; }

/* Clone en vol vers le panier */
.lf-fly {
  position: fixed; z-index: 95; pointer-events: none; border-radius: 6px;
  border: 1.5px solid var(--gold3); background: var(--navy2);
  box-shadow: 0 10px 30px rgba(0,0,0,.6), var(--neon-gold); will-change: transform, opacity;
}

/* ════════════════════════════════════════
   COUCHE ARCADE / CRT — gated .menu-section.is-arcade
   (zéro impact si la classe est absente). Tokens marque uniquement.
════════════════════════════════════════ */
.menu-section.is-arcade {
  --arc-scan-rgba: rgba(14,33,56, 0.55);
  --arc-scan-gap: 3px;
  background: radial-gradient(120% 80% at 50% 0%, var(--navy2) 0%, var(--navy) 55%, var(--night) 100%);
}
.arcade-pixel {
  font-family: var(--font-pixel) !important; letter-spacing: 0 !important;
  text-transform: uppercase; line-height: 1.35; font-size: 0.62em;
}
/* Overlay CRT scanlines + vignette (sous le contenu, au-dessus du filigrane) */
.menu-section.is-arcade::after {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(130% 130% at 50% 50%, transparent 60%, rgba(14,33,56,0.35) 82%, rgba(14,33,56,0.75) 100%),
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--arc-scan-gap) - 1px),
      var(--arc-scan-rgba) calc(var(--arc-scan-gap) - 1px), var(--arc-scan-rgba) var(--arc-scan-gap));
  background-size: 100% 100%, 100% var(--arc-scan-gap);
  box-shadow: inset 0 0 90px rgba(245,197,24,0.06), inset 0 0 260px rgba(14,33,56,0.6);
  animation: arcScanRoll 9s linear infinite;
}
.menu-section.is-arcade::before { animation: arcFlicker 6s steps(60) infinite; }
@keyframes arcScanRoll { to { background-position: 0 0, 0 100vh; } }
@keyframes arcFlicker {
  0%,100% { filter: brightness(1); }
  47% { filter: brightness(1.02); } 48% { filter: brightness(0.96); }
  49% { filter: brightness(1.03); } 50% { filter: brightness(0.98); }
}
/* Néons sur le chrome (jamais le corps produit) */
.menu-section.is-arcade .section-eyebrow {
  font-family: var(--font-pixel); font-size: 9px; letter-spacing: 0; color: var(--gold3);
  text-shadow: 0 0 4px rgba(245,197,24,0.7), 0 0 10px rgba(232,21,27,0.5);
}
.menu-section.is-arcade .section-eyebrow::before, .menu-section.is-arcade .section-eyebrow::after {
  color: var(--red); text-shadow: 0 0 6px var(--red);
}
.menu-section.is-arcade .section-title {
  position: relative; color: var(--gold3);
  text-shadow: 0 0 2px rgba(255,255,255,0.6), 0 0 8px rgba(245,197,24,0.85),
    0 0 18px rgba(245,197,24,0.55), 0 0 34px rgba(232,21,27,0.45), 0 3px 0 rgba(184,15,20,0.5);
  animation: arcGlitch 5.5s steps(1) infinite; will-change: transform, clip-path;
}
.menu-section.is-arcade .section-title em {
  color: var(--gold3); text-shadow: 0 0 6px rgba(245,197,24,0.9), 0 0 16px rgba(232,21,27,0.6);
}
.menu-section.is-arcade .section-title::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 30%; pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0.10), transparent);
  mix-blend-mode: screen; animation: arcBeam 4.5s ease-in-out infinite;
}
@keyframes arcBeam { 0%,100%{transform:translateY(-40%);opacity:0} 10%{opacity:.5} 50%{transform:translateY(330%);opacity:0} }
@keyframes arcGlitch {
  0%,92%,100% { transform: translate(0,0); clip-path: none; }
  93% { transform: translate(-2px,1px); clip-path: polygon(0 0,100% 0,100% 33%,0 33%); }
  94% { transform: translate(3px,-1px); clip-path: polygon(0 33%,100% 33%,100% 66%,0 66%); }
  95% { transform: translate(-3px,0); clip-path: polygon(0 66%,100% 66%,100% 100%,0 100%); }
  96% { transform: translate(2px,1px); clip-path: none; }
  97% { transform: translate(-1px,-1px); }
  98% { transform: translate(0,0); clip-path: none; }
}
.menu-section.is-arcade .lineup-banner {
  color: var(--gold3); border: 1px solid rgba(245,197,24,0.55); border-radius: 4px;
  background: rgba(14,33,56,0.5);
  box-shadow: 0 0 0 1px rgba(232,21,27,0.25), 0 0 14px rgba(245,197,24,0.25), inset 0 0 10px rgba(245,197,24,0.08);
  text-shadow: 0 0 6px rgba(245,197,24,0.6);
}
.menu-section.is-arcade .lineup-banner::before, .menu-section.is-arcade .lineup-banner::after {
  color: var(--red); text-shadow: 0 0 6px var(--red);
}
/* Glow néon sur les cellules fighter quand arcade */
.menu-section.is-arcade .menu-tab.active {
  box-shadow: 0 0 0 1px var(--gold3), 0 0 12px rgba(245,197,24,0.7), 0 0 26px rgba(232,21,27,0.4);
}
/* Garde-fous lisibilité : le corps produit reste net */
.menu-section.is-arcade .menu-card-name { font-family: 'Oswald', sans-serif; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.menu-section.is-arcade .menu-card-desc { font-family: 'Barlow', sans-serif; text-shadow: none; color: rgba(255,255,255,0.62); }
.menu-section.is-arcade .menu-card-price { font-family: 'Oswald', sans-serif; text-shadow: 0 0 6px rgba(245,197,24,0.35), 1px 1px 0 rgba(184,15,20,0.35); }

/* ════════════════════════════════════════
   RESPONSIVE borne (carte · sélecteur · panier arcade)
════════════════════════════════════════ */
@media (max-width: 768px) {
  .menu-section.is-arcade { --arc-scan-gap: 4px; }
  .menu-section.is-arcade .section-eyebrow { font-size: 8px; }
  .fs-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 480px) {
  .menu-card::before { font-size: 50px; }
  .fs-grid { grid-template-columns: repeat(3, 1fr); }
  .fs-cell.menu-tab { min-height: 84px; }
  .fs-ins { display: none; }
  .lf-cart-fab { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); font-size: 8px; }
  .lf-cart-fab[aria-expanded="false"]:not(.is-active)::after { bottom: auto; top: -15px; }
  .lf-cart-panel {
    left: 0; right: 0; bottom: 0; width: auto; max-height: 80vh;
    border-radius: 12px 12px 0 0; border-width: 2px 0 0;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  }
  .lf-cart-title { font-size: 10px; }
  .lf-cart-total b { font-size: 23px; }
}
@media (max-width: 374px) {
  .menu-card-emoji { width: 92px; height: 92px; font-size: 46px; }
  .menu-section.is-arcade .arcade-pixel { font-size: 0.55em; }
  .fs-grid { grid-template-columns: repeat(2, 1fr); }
  .fs-cell.menu-tab { min-height: 80px; }
  .lf-cart-panel { padding-left: .85rem; padding-right: .85rem; }
  .lf-cart-line-name { font-size: 14px; }
}

/* ════════════════════════════════════════
   prefers-reduced-motion (carte · sélecteur · panier · CRT)
════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .menu-card { transform: none !important; }
  .menu-card::after { display: none; }
  .menu-card.lf-deal { animation: lfFade .3s both; }
  @keyframes lfFade { from{opacity:0} to{opacity:1} }
  .lf-cart-fab.bump { animation: none; }
  .lf-cart-fab[aria-expanded="false"]:not(.is-active)::after { animation: none; }
  .lf-cart-checkout, .lf-cart-checkout:hover, .lf-cart-checkout:active { transform: none; }
  .lf-fly { display: none; }
  .fs-1up, .fs-ins, .fs-cell.menu-tab.active .fs-rdy, .fs-cell.menu-tab.active .fs-cur { animation: none; }
  .fs-cell.menu-tab.active .fs-cur { transform: translateX(-50%); }
  .fs-cell.menu-tab:hover { transform: none; }
  .menu-section.is-arcade::after { animation: none; }
  .menu-section.is-arcade::before { animation: none; filter: none; }
  .menu-section.is-arcade .section-title { animation: none; }
  .menu-section.is-arcade .section-title::after { display: none; }
}

/* ════════════════════════════════════════
   ADN / HISTOIRE
════════════════════════════════════════ */
.adn-section { background: var(--night); position: relative; overflow: hidden; }
.adn-section::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 50% 60% at 100% 50%, rgba(232,21,27,0.06) 0%, transparent 70%),
              radial-gradient(ellipse 50% 60% at 0% 50%, rgba(245,197,24,0.04) 0%, transparent 70%);
}
.adn-layout {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center;
}
.adn-lead { font-size: 18px; color: rgba(255,255,255,0.55); line-height: 1.7; font-weight: 300; margin-bottom: 2.5rem; }
.adn-pillars { display: flex; flex-direction: column; gap: 1rem; }
.adn-pillar {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 1.25rem 1.5rem;
  background: rgba(255,255,255,0.03);
  border-radius: 4px;
  border-left: 3px solid var(--gold);
  border-bottom: 1px solid rgba(245,197,24,0.1);
}
.adn-pillar-icon { font-size: 28px; flex-shrink: 0; line-height: 1; }
.adn-pillar h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--white); margin-bottom: 4px;
}
.adn-pillar p { font-size: 13px; color: rgba(255,255,255,0.6); font-weight: 300; line-height: 1.5; }

.adn-collage { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: 10px; }
.adn-photo {
  background: var(--navy2);
  border: 1px solid rgba(245,197,24,0.15); border-radius: 4px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; padding: 2rem 1rem; text-align: center;
}
.adn-photo.tall { grid-row: span 2; min-height: 300px; }
.adn-photo .big-emoji { font-size: 40px; opacity: 0.4; }
.adn-photo .photo-hint {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 2px; color: rgba(255,255,255,0.2); text-transform: uppercase;
}
.adn-collage-frame { border: 2px solid var(--gold2); border-radius: 6px; padding: 6px; }

/* ════════════════════════════════════════
   HORAIRES & CONTACT
════════════════════════════════════════ */
.hours-section { background: var(--navy); }
.hours-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2rem; align-items: start; margin-top: 3rem; }

.hours-card { border: 2px solid var(--gold2); border-radius: 6px; overflow: hidden; }
.hours-card-head { background: var(--red); padding: 1.25rem 1.5rem; border-bottom: 2px solid var(--gold2); }
.hours-card-head h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--white);
}
.hours-card-head p {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold); margin-top: 2px;
}
.hours-card-body { padding: 1.5rem; background: var(--navy2); }
.hours-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.07); font-size: 14px; gap: 12px;
}
.hours-row:last-of-type { border-bottom: none; }
.hours-row .day { font-family: 'Barlow Condensed', sans-serif; font-weight: 600; letter-spacing: 1px; color: rgba(255,255,255,0.5); }
.hours-row .time { font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 500; color: var(--white); text-align: right; }

.open-pill {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(30,180,60,0.15); color: #5CDB6B;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  padding: 6px 14px; border-radius: 20px;
  border: 1px solid rgba(92,219,107,0.3); margin-top: 1rem;
}
.open-pill.is-closed { background: rgba(232,21,27,0.12); color: #ff7a7e; border-color: rgba(232,21,27,0.35); }
.open-pill-dot { width: 7px; height: 7px; background: currentColor; border-radius: 50%; animation: blink 1.4s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.2} }

.contact-card { border: 2px solid var(--gold2); border-radius: 6px; overflow: hidden; }
.contact-card-head { background: var(--gold); padding: 1.25rem 1.5rem; border-bottom: 2px solid var(--gold2); }
.contact-card-head h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--navy);
}
.contact-card-body { padding: 1.5rem; background: var(--navy2); }
.contact-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 1.25rem; }
.contact-icon {
  width: 40px; height: 40px; flex-shrink: 0;
  background: rgba(245,197,24,0.1); border: 1px solid rgba(245,197,24,0.2);
  border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.contact-item-text p {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 2px;
}
.contact-item-text strong, .contact-item-text a { font-size: 15px; font-weight: 500; color: var(--white); text-decoration: none; }
.contact-item-text a:hover, .contact-item-text a:focus-visible { color: var(--gold); }

.social-btns { display: flex; gap: 8px; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.08); }
.social-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
  background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.65);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  text-decoration: none; padding: 10px 14px; border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.1); transition: all .2s;
}
.social-btn:hover, .social-btn:focus-visible { background: rgba(245,197,24,0.1); color: var(--gold); border-color: var(--gold2); }

.map-card { border: 2px solid rgba(245,197,24,0.2); border-radius: 6px; overflow: hidden; }
.map-placeholder {
  background: var(--night); min-height: 200px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; padding: 2rem; text-align: center; height: 100%;
}
.map-placeholder .big-emoji { font-size: 40px; }
.map-placeholder h3 { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
.map-placeholder p { font-size: 14px; color: rgba(255,255,255,0.4); }
.map-cta-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--red); color: var(--white); text-decoration: none;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  padding: 12px 22px; border-radius: 4px; border: 2px solid var(--gold2);
  transition: all .2s; margin-top: 0.5rem;
}
.map-cta-btn:hover, .map-cta-btn:focus-visible { background: var(--red2); color: var(--gold); }

/* ════════════════════════════════════════
   CTA FINAL
════════════════════════════════════════ */
.cta-section {
  background: var(--red2); padding: 7rem 2.5rem; text-align: center;
  position: relative; overflow: hidden;
  border-top: 4px solid var(--gold); border-bottom: 4px solid var(--gold);
  scroll-margin-top: 80px;
}
.cta-section::before {
  content: '★ LA FRINGALE ★'; position: absolute;
  font-family: 'Oswald', sans-serif; font-size: 120px; font-weight: 700; letter-spacing: 20px;
  color: rgba(255,255,255,0.04);
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  white-space: nowrap; pointer-events: none;
}
.cta-section .section-eyebrow { display: flex; justify-content: center; margin-bottom: 1rem; }
.cta-big-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(50px, 8vw, 90px); font-weight: 700; text-transform: uppercase;
  letter-spacing: 3px; line-height: 0.95; color: var(--white);
  margin-bottom: 0.5rem; position: relative; z-index: 2;
}
.cta-big-sub {
  font-family: 'Pacifico', cursive; font-size: clamp(28px, 4vw, 48px);
  color: var(--gold); display: block; margin-bottom: 2rem; position: relative; z-index: 2;
}
.cta-section p { font-size: 18px; color: rgba(255,255,255,0.7); margin-bottom: 2.5rem; font-weight: 300; position: relative; z-index: 2; }
.btn-white-red {
  display: inline-flex; align-items: center; gap: 12px;
  background: var(--white); color: var(--red); text-decoration: none;
  font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  padding: 20px 48px; border-radius: 4px; border: 2px solid transparent;
  box-shadow: 0 6px 30px rgba(0,0,0,0.3); transition: all .25s; position: relative; z-index: 2;
}
.btn-white-red:hover, .btn-white-red:focus-visible {
  background: var(--gold); color: var(--navy);
  transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.4);
}

/* ════════════════════════════════════════
   FOOTER
════════════════════════════════════════ */
.site-footer { background: var(--night); padding: 4rem 2.5rem 2rem; border-top: 4px solid var(--gold); }
.footer-top { max-width: 1200px; margin: 0 auto 3rem; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 4rem; }
.footer-brand-name { font-family: 'Pacifico', cursive; font-size: 40px; color: var(--white); text-shadow: 2px 2px 0 var(--red); margin-bottom: 0.75rem; }
.footer-brand p { font-size: 14px; color: rgba(255,255,255,0.6); line-height: 1.7; font-weight: 300; max-width: 280px; margin-bottom: 1.5rem; }
.footer-halal {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--gold); color: var(--navy);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  padding: 7px 16px; border-radius: 3px;
}
.footer-col h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 1.25rem;
}
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col li a { color: rgba(255,255,255,0.6); text-decoration: none; font-size: 14px; transition: color .2s; }
.footer-col li a:hover, .footer-col li a:focus-visible { color: var(--white); }
.footer-stars { display: flex; gap: 6px; color: var(--gold); font-size: 16px; margin-bottom: 1.5rem; }
.footer-bottom {
  max-width: 1200px; margin: 0 auto; padding-top: 2rem;
  border-top: 1px solid rgba(255,255,255,0.07);
  display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap;
  font-size: 12px; color: rgba(255,255,255,0.55); letter-spacing: 1px;
}
.footer-bottom strong { color: rgba(255,255,255,0.7); }

/* ════════════════════════════════════════
   GENERIC PAGES (page.php / index.php / fallbacks)
════════════════════════════════════════ */
.page-wrap { padding: 130px 2.5rem 5rem; min-height: 60vh; }
.page-wrap .container { max-width: 820px; }
.page-header-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(34px, 5vw, 56px); font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase; color: var(--white);
  margin-bottom: 2rem; border-bottom: 3px solid var(--gold); padding-bottom: 1rem;
}
.entry-content { color: rgba(255,255,255,0.7); font-size: 16px; line-height: 1.8; }
.entry-content h1, .entry-content h2, .entry-content h3 { font-family: 'Oswald', sans-serif; color: var(--white); margin: 2rem 0 1rem; letter-spacing: 1px; }
.entry-content a { color: var(--gold); }
.entry-content p { margin-bottom: 1.25rem; }
.entry-content ul, .entry-content ol { margin: 0 0 1.25rem 1.5rem; }
.entry-content img { border-radius: 6px; margin: 1.5rem 0; }
.entry-content blockquote { border-left: 3px solid var(--gold); padding-left: 1.25rem; color: var(--gold3); font-style: italic; margin: 1.5rem 0; }
.post-list { display: grid; gap: 1.5rem; }
.post-card { background: var(--navy2); border: 1px solid rgba(245,197,24,0.2); border-radius: 6px; padding: 1.5rem 1.75rem; transition: border-color .2s, transform .2s; }
.post-card:hover { border-color: var(--gold); transform: translateY(-3px); }
.post-card h2 { font-family: 'Oswald', sans-serif; font-size: 24px; letter-spacing: 1px; margin-bottom: .5rem; }
.post-card h2 a { color: var(--white); text-decoration: none; }
.post-card h2 a:hover { color: var(--gold); }
.post-card .post-meta { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--gray); margin-bottom: .75rem; }
.pagination { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 2.5rem; }
.pagination .page-numbers { padding: 8px 14px; border: 1px solid var(--gold2); border-radius: 4px; color: var(--gold); text-decoration: none; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; }
.pagination .page-numbers.current { background: var(--gold); color: var(--navy); }

/* WP core alignment / caption helpers */
.alignleft { float: left; margin: .5rem 1.5rem 1rem 0; }
.alignright { float: right; margin: .5rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin: 1.5rem auto; }
.wp-caption-text, .wp-element-caption { font-size: 13px; color: var(--gray); text-align: center; margin-top: .5rem; }

/* ════════════════════════════════════════
   ANIMATIONS
════════════════════════════════════════ */
@keyframes fadeInDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media (max-width: 960px) {
  .adn-layout { grid-template-columns: 1fr; gap: 3rem; }
  .adn-collage { display: none; }
  .hours-grid { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
}

/* Nav en hamburger dès 820px : logo + liens + badge Halal + CTA ne tiennent plus sur une ligne en dessous. */
@media (max-width: 820px) {
  .site-nav { padding: 0 1.25rem; }
  .nav-toggle { display: flex; }
  .nav-links {
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: flex-start; gap: 0;
    background: var(--night);
    border-bottom: 3px solid var(--gold);
    padding: 0; max-height: 0; overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.6);
    transition: max-height .3s ease;
  }
  .site-nav.nav-open .nav-links { max-height: 420px; }
  .nav-links li { width: 100%; border-top: 1px solid rgba(255,255,255,0.06); }
  .nav-links li:first-child { border-top: none; }
  .nav-links a, .nav-links .nav-halal { display: block; width: 100%; padding: 16px 1.5rem; border-radius: 0 !important; }
  .nav-links .nav-cta { border: none !important; border-top: 1px solid rgba(255,255,255,0.06) !important; }
  .nav-halal { background: transparent; color: var(--gold); }
}

@media (max-width: 640px) {
  .section { padding: 4rem 1.25rem; }
  .hero-banner { margin: 1.5rem -12px; }
  .hero-banner-text { white-space: normal; }
  .livraison-inner { flex-direction: column; gap: 1.5rem; }
  .livraison-divider { display: none; }
  .livraison-title { font-size: 38px; }
  .hero-bottom { gap: 1.25rem 2rem; }
  .hero-bottom-sep { display: none; }
  .cta-section { padding: 5rem 1.25rem; }
  .page-wrap { padding: 110px 1.25rem 4rem; }
}

/* ── 2 colonnes sur mobile (cartes produit) — Longjumeau & Bagneux ── */
@media (max-width: 640px) {
  .menu-grid { grid-template-columns: repeat(2, 1fr); gap: .8rem; }
  .menu-card-body { padding: .8rem .85rem 1rem; }
  .menu-card-name { font-size: 17px; letter-spacing: 1px; }
  .menu-section.is-arcade .menu-card-desc,
  .menu-card-desc { font-size: 12px; }
}

/* ════════════════════════════════════════
   PERSONNALISATION (sheet) · MODIFS PANIER · UPSELL
════════════════════════════════════════ */
body.lf-noscroll { overflow: hidden; }
.lf-sheet { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.55); }
.lf-sheet[hidden] { display: none; }
@media (min-width: 700px) { .lf-sheet { align-items: center; } }
.lf-sheet-card { width: 100%; max-width: 520px; max-height: 88vh; overflow-y: auto; background: var(--night); border: 2px solid var(--gold2); border-radius: 16px 16px 0 0; padding: 1.5rem 1.3rem 1.3rem; position: relative; box-shadow: 0 -10px 40px rgba(0,0,0,.5); animation: lfSheetUp .25s ease both; }
@media (min-width: 700px) { .lf-sheet-card { border-radius: 16px; } }
@keyframes lfSheetUp { from { transform: translateY(24px); opacity: .6; } to { transform: none; opacity: 1; } }
.lf-sheet-x { position: absolute; top: .7rem; right: .7rem; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.lf-sheet-title { font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #fff; font-size: 22px; padding-right: 2.5rem; }
.lf-sheet-base { font-family: 'Oswald', sans-serif; color: var(--gold); font-weight: 700; margin: .2rem 0 1rem; }
.lf-sheet-grp { margin-bottom: 1.1rem; }
.lf-sheet-grp h4 { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 13px; color: var(--gold3); margin-bottom: .5rem; }
.lf-opt { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem .2rem; border-bottom: 1px solid rgba(255,255,255,.08); cursor: pointer; }
.lf-opt-l { display: inline-flex; align-items: center; gap: .55rem; }
.lf-opt input, .lf-chip input { width: 20px; height: 20px; accent-color: var(--gold); }
.lf-opt-p { font-family: 'Oswald', sans-serif; color: var(--gold); font-weight: 700; white-space: nowrap; }
.lf-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.lf-chip { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; padding: .45rem .7rem; border: 1px solid rgba(255,255,255,.2); border-radius: 100px; font-family: 'Barlow', sans-serif; font-size: 14px; color: rgba(255,255,255,.9); }
.lf-chip:has(input:checked) { border-color: var(--red); background: rgba(232,21,27,.15); color: #fff; }
.lf-sheet-foot { display: flex; flex-direction: column; align-items: stretch; gap: .75rem; margin-top: 1rem; }
.lf-sheet-foot .lf-step { align-self: center; }
.lf-step { display: inline-flex; align-items: center; gap: 4px; }
.lf-sq-val { min-width: 26px; text-align: center; font-family: 'Oswald', sans-serif; font-weight: 700; color: #fff; }
.lf-sheet-add { width: 100%; justify-content: center; white-space: nowrap; border: 0; cursor: pointer; }
.lf-cart-line-main { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lf-cart-line-mods { font-family: 'Barlow', sans-serif; font-weight: 400; letter-spacing: 0; text-transform: none; font-size: 11px; line-height: 1.35; color: rgba(255,255,255,.55); }
.lf-ups-wrap { margin: .4rem 0 .2rem; padding-top: .6rem; border-top: 1px dashed rgba(245,197,24,.25); }
.lf-ups-h { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 12px; color: var(--gold3); margin-bottom: .5rem; }
.lf-ups-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.lf-ups { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; padding: .45rem .7rem; border: 1px solid var(--gold2); border-radius: 100px; background: rgba(245,197,24,.08); color: #fff; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .5px; font-size: 13px; }
.lf-ups span { color: var(--gold); }
.lf-ups:hover, .lf-ups:focus-visible { background: rgba(245,197,24,.18); }

/* ════════ Suppléments à quantité + popup MENU ════════ */
.lf-opt .lf-opt-l { flex: 1; }
.lf-opt .lf-step { margin-left: .6rem; flex: none; }
.lf-exv { min-width: 22px; text-align: center; font-family: 'Oswald', sans-serif; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.lf-menupop { position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.6); padding: 1rem; }
.lf-menupop[hidden] { display: none; }
.lf-menupop-card { position: relative; width: 100%; max-width: 380px; text-align: center; background: var(--night,#0E2138); border: 2px solid var(--gold2,#D4A012); border-radius: 16px; padding: 1.8rem 1.4rem 1.4rem; box-shadow: 0 20px 60px rgba(0,0,0,.55); animation: lfSheetUp .25s ease both; }
.lf-menupop-x { position: absolute; top: .6rem; right: .6rem; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); color: #fff; font-size: 22px; cursor: pointer; }
.lf-menupop-emoji { font-size: 34px; }
.lf-menupop-h { font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 1px; color: var(--gold,#F5C518); font-size: 22px; margin: .4rem 0 .3rem; }
.lf-menupop-p { font-family: 'Barlow', sans-serif; color: rgba(255,248,236,.9); margin-bottom: 1.1rem; }
.lf-menupop-p strong { color: #fff; }
.lf-menupop-actions { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; }
.lf-menupop-no { border: 1px solid rgba(255,255,255,.25); background: transparent; color: rgba(255,255,255,.8); border-radius: 8px; padding: .65rem 1rem; cursor: pointer; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.lf-menupop-yes { border: 0; cursor: pointer; }

/* ════════ SELECT YOUR FIGHTER → carrousel horizontal compact ════════ */
.fighter-select .fs-grid {
  display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 8px; max-width: none; margin: 0;
  padding: 4px 2px 10px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.fighter-select .fs-grid::-webkit-scrollbar { height: 6px; }
.fighter-select .fs-grid::-webkit-scrollbar-track { background: rgba(255,255,255,.06); border-radius: 3px; }
.fighter-select .fs-grid::-webkit-scrollbar-thumb { background: var(--gold2); border-radius: 3px; }
.fighter-select .fs-cell.menu-tab {
  flex: 0 0 auto; width: 86px; min-height: 0; padding: 10px 6px; gap: 4px; scroll-snap-align: start;
}
.fighter-select .fs-ico { font-size: 24px; }
.fighter-select .fs-label { font-size: 10px; letter-spacing: 1px; }
.fighter-select .fs-rdy { display: none; }
.fighter-select .fs-top { margin-bottom: 8px; }
@media (max-width: 480px) { .fighter-select .fs-cell.menu-tab { width: 78px; } }

/* Prix multiples (sides : « 4,50 € / 8 € ») — plus compact pour tenir dans la carte */
.menu-card-price.is-multi { font-size: 14px; letter-spacing: 0; line-height: 1.2; }
.menu-section.is-arcade .menu-card-price.is-multi { text-shadow: 1px 1px 0 rgba(184,15,20,.35); }

/* Notre histoire (récit canadien) — partagé Longjumeau + Bagneux */
.histoire-section { text-align: center; }
.histoire-body { max-width: 680px; margin: 1.5rem auto 0; }
.histoire-body p { font-family: 'Barlow', sans-serif; font-size: clamp(16px, 1.7vw, 19px); line-height: 1.75; color: rgba(255,248,236,.88); margin-bottom: 1.1rem; }

/* ════ Panier : alignement + bouton Modifier + note spéciale ════ */
.lf-cart-line { align-items: center; gap: 8px; }
.lf-cart-line-main { min-width: 0; }
.lf-cart-line-name { overflow-wrap: anywhere; }
.lf-cart-qty { flex: none; }
.lf-cart-line-sub { flex: none; min-width: 62px; text-align: right; }
.lf-cart-edit { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--gold2); border-radius: 6px; background: var(--navy2); color: var(--gold3); cursor: pointer; font-size: 13px; line-height: 1; }
.lf-cart-edit:hover, .lf-cart-edit:focus-visible { background: var(--night); border-color: var(--gold3); }
.lf-sheet-note textarea { width: 100%; min-height: 54px; resize: vertical; margin-top: .2rem; font-family: 'Barlow', sans-serif; font-size: 15px; padding: .55rem .7rem; border-radius: 8px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #fff; }
.lf-sheet-note textarea:focus { outline: 2px solid var(--gold3); outline-offset: 1px; }

/* Options à choix unique dans la fiche de personnalisation (frites, boisson, coulis). */
.lf-sheet-grp .lf-radio { display: flex; align-items: center; gap: .6rem; padding: .5rem .2rem; cursor: pointer; }
.lf-sheet-grp .lf-radio + .lf-radio { border-top: 1px solid rgba(255,255,255,.06); }
.lf-sheet-grp .lf-radio input { flex: none; accent-color: var(--gold); }
.lf-sheet-grp .lf-radio .lf-opt-l { flex: 1; }
.lf-sheet-grp .lf-radio .lf-opt-p { margin-left: auto; color: var(--gold3); }
/* Configurateur menu (popup) : frites + boisson au choix. */
.lf-menupop-choices { max-height: 46vh; overflow-y: auto; text-align: left; margin: .4rem 0 1rem; }
.lf-menupop-choices .lf-sheet-grp { margin-bottom: .6rem; }

/* Note chantilly (fiche milkshake). */
.lf-sheet-grp.lf-chantilly { display: flex; align-items: center; gap: .6rem; }
.lf-chantilly .lf-chantilly-l { font-weight: 600; }
.lf-chantilly .lf-chantilly-note { margin-left: auto; opacity: .7; font-size: 13px; font-style: italic; }

/* Bloc livraison Uber Eats (page Bagneux). */
.ue-section { text-align: center; padding: 4rem 1.5rem; background: #05060a; }
.ue-eyebrow { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: 2px; color: rgba(255,255,255,.7); font-size: 15px; margin: 0 0 .4rem; }
.ue-title { font-family: 'Oswald', sans-serif; text-transform: uppercase; color: #fff; font-size: clamp(24px, 5vw, 40px); margin: 0 0 1.6rem; }
.ue-btn { display: inline-flex; align-items: baseline; gap: 5px; background: #000; padding: 16px 36px; border-radius: 12px; text-decoration: none; font-family: 'Oswald', 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 30px; letter-spacing: .5px; box-shadow: 0 8px 30px rgba(6,193,103,.25); transition: transform .15s ease, box-shadow .15s ease; }
.ue-btn:hover, .ue-btn:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 40px rgba(6,193,103,.45); }
.ue-btn .ue-uber { color: #fff; }
.ue-btn .ue-eats { color: #06C167; }

/* Bouton Deliveroo (partagé Longjumeau + Bagneux, même DA que le bouton Uber Eats). */
.ue-btn-deliveroo { background: #00CCBC; margin-top: 12px; }
.ue-btn-deliveroo .ue-deliveroo { color: #fff; font-weight: 800; letter-spacing: .5px; }

/* ── Article épuisé (rupture temporaire, piloté par 'soldout' dans menu-data.php) ── */
.menu-card.is-soldout .menu-card-photo,
.menu-card.is-soldout .menu-card-emoji { filter: grayscale(1) brightness(.7); opacity: .55; }
.menu-card.is-soldout .menu-card-name,
.menu-card.is-soldout .menu-card-price { color: rgba(255,255,255,.45); }
.menu-card-img .menu-badge.soldout { background: #6b7280; color: #fff; }
/* Le badge reste visible même sur les cartes avec photo (sinon masqué par défaut). */
.menu-card.has-photo .menu-card-img .menu-badge.soldout { display: inline-block; }
.menu-card-btn.is-soldout {
  width: auto; height: 28px; padding: 0 .8rem; border-radius: 999px;
  background: #6b7280; border: 2px solid #6b7280; color: #fff;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  cursor: not-allowed; pointer-events: none;
}
.menu-card-btn.is-soldout:hover { background: #6b7280; color: #fff; transform: none; }

/* ── Composition de menu : choix obligatoires + surlignage si manquant ── */
.lf-req-star { color: var(--red, #E8151B); font-weight: 800; }
.lf-req-hint { color: rgba(255,255,255,.6); font-size: 12px; margin: 0 0 6px; }
.lf-sheet-grp.lf-grp-missing { outline: 2px solid var(--red, #E8151B); outline-offset: 6px; border-radius: 8px; }
.lf-sheet-grp.lf-grp-missing > h4::after { content: ' — à choisir'; color: var(--red, #E8151B); font-weight: 700; font-size: .85em; }