/* =====================================================================
   SNACK MOP — « Le bon goût du frais »
   Direction artistique : la broche de feu.
   Palette  : charbon · braise (rouge du logo) · flamme · papier crème · sauce blanche
   Typo     : Bricolage Grotesque (titres condensés géants) + DM Sans (texte)
   Fil rouge: la goutte de sauce blanche (séparateurs) + la toque + la broche qui tourne
   ===================================================================== */

:root{
  --coal:#0e0a09;      /* fond principal */
  --char:#1a1210;      /* surfaces sombres */
  --char-2:#261b18;
  --ember:#dc1f2b;     /* accent principal (rouge du logo) */
  --ember-d:#b3141f;
  --flame:#ff8a1f;     /* accent chaud : survol, lueurs */
  --cream:#f5e9d6;     /* texte clair / papier */
  --paper:#ead9ba;     /* papier kraft (galerie) */
  --sauce:#fff8ee;     /* sauce blanche : surbrillances */
  --smoke:#a99b90;     /* texte secondaire sur sombre */
  --ink:#1b110e;       /* texte sur clair */

  --ff-display:'Bricolage Grotesque','Arial Narrow',system-ui,sans-serif;
  --ff-text:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;

  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --gutter:clamp(1.1rem,4vw,4rem);
  --nav-h:4.6rem;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto;background:var(--coal);overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--coal);color:var(--cream);font:400 1.05rem/1.6 var(--ff-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul{list-style:none;margin:0;padding:0}
[hidden]{display:none!important}
h1,h2,h3,h4,p,figure,blockquote,dl,dd,address{margin:0}
address{font-style:normal}
fieldset{border:0;margin:0;padding:0;min-width:0}
::selection{background:var(--ember);color:var(--sauce)}
:focus-visible{outline:3px solid var(--flame);outline-offset:3px;border-radius:6px}

.ico{width:1.15em;height:1.15em;fill:currentColor;flex:none}
.wrap{width:100%;max-width:92rem;margin:0 auto;padding:0 var(--gutter)}
.skip{position:fixed;left:1rem;top:-5rem;z-index:3000;background:var(--flame);color:var(--ink);padding:.7rem 1rem;border-radius:.6rem;font-weight:700;transition:top .3s}
.skip:focus{top:1rem}

/* ---------- typographie ---------- */
.display{font-family:var(--ff-display);font-weight:800;font-variation-settings:'wdth' 75;font-stretch:75%;text-transform:uppercase;line-height:.88;letter-spacing:-.012em}
.h2{font-size:clamp(2.9rem,8.4vw,8.6rem)}
.h3{font-size:clamp(2.4rem,6vw,5.6rem)}
.display em{font-style:normal;color:var(--ember)}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font:700 .78rem/1 var(--ff-text);letter-spacing:.2em;text-transform:uppercase;color:var(--smoke);margin-bottom:1.4rem}
.eyebrow span{display:inline-grid;place-items:center;min-width:2.1rem;height:2.1rem;padding:0 .4rem;border-radius:999px;background:var(--ember);color:var(--sauce);letter-spacing:0;font-size:.78rem}
.eyebrow--ink{color:rgba(27,17,14,.62)}
.eyebrow--sauce{color:rgba(255,248,238,.8)}
.eyebrow--sauce span{background:var(--sauce);color:var(--ember)}

/* split text */
.split .word{display:inline-block;overflow:hidden;vertical-align:top;padding:.14em 0 .06em;margin:-.14em 0 -.06em}
.split .char{display:inline-block;will-change:transform}
.nowrap{white-space:nowrap}

.u-link{position:relative;display:inline-block;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:.12em;transition:background-size .5s var(--ease)}
.u-link:hover,.u-link:focus-visible{background-size:0 1.5px;background-position:100% 100%;animation:uline .6s var(--ease) .0s forwards}
@keyframes uline{0%{background-size:100% 1.5px;background-position:100% 100%}49%{background-size:0 1.5px;background-position:100% 100%}50%{background-size:0 1.5px;background-position:0 100%}100%{background-size:100% 1.5px;background-position:0 100%}}

/* ---------- boutons ---------- */
.btn{--bg:var(--ember);--fg:var(--sauce);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.95rem 1.7rem;border-radius:999px;background:var(--bg);color:var(--fg);border:2px solid var(--bg);font:700 .98rem/1 var(--ff-text);letter-spacing:.01em;overflow:hidden;isolation:isolate;white-space:nowrap;transition:color .4s var(--ease),border-color .4s var(--ease);will-change:transform}
.btn::before{content:"";position:absolute;inset:-2px;background:var(--flame);transform:translateY(103%);transition:transform .55s var(--ease);z-index:-1;border-radius:inherit}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn:hover,.btn:focus-visible{color:var(--ink);border-color:var(--flame)}
.btn__t{display:inline-flex;align-items:center;gap:.6rem;will-change:transform}
.btn--sm{padding:.7rem 1.25rem;font-size:.9rem}
.btn--lg{padding:1.2rem 2.1rem;font-size:1.05rem}
.btn--ghost{--bg:transparent;color:var(--sauce);border-color:rgba(255,248,238,.5)}
.btn--ghost::before{background:var(--sauce)}
.btn--ghost:hover,.btn--ghost:focus-visible{color:var(--ink);border-color:var(--sauce)}
.btn--sauce{--bg:var(--sauce);color:var(--ember)}
.btn--sauce::before{background:var(--coal)}
.btn--sauce:hover,.btn--sauce:focus-visible{color:var(--sauce);border-color:var(--coal)}
.btn--ghost-sauce{--bg:transparent;color:var(--sauce);border-color:rgba(255,248,238,.6)}
.btn--ghost-sauce::before{background:var(--coal)}
.btn--ghost-sauce:hover,.btn--ghost-sauce:focus-visible{color:var(--sauce);border-color:var(--coal)}
.btn--submit{width:100%}

/* ---------- préchargeur ---------- */
.loader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;color:var(--cream)}
html:not(.js) .loader,html.force-loaded .loader,html.loaded .loader{display:none}
.loader__panel{position:absolute;left:0;right:0;height:50.4%;background:var(--coal);will-change:transform}
.loader__panel--top{top:0;border-bottom:4px solid var(--ember)}
.loader__panel--bottom{bottom:0;border-top:4px solid var(--ember)}
.loader__center{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.1rem;text-align:center}
.loader__coin{width:9.4rem;height:9.4rem;perspective:600px}
.loader__coin img{width:100%;height:100%;border-radius:50%;background:#fff;animation:coin 2.2s linear infinite;box-shadow:0 0 0 6px rgba(220,31,43,.25),0 0 60px rgba(255,138,31,.35)}
@keyframes coin{to{transform:rotateY(360deg)}}
.loader__count{font:800 clamp(3.6rem,10vw,6.4rem)/.9 var(--ff-display);font-variation-settings:'wdth' 75;letter-spacing:-.02em;display:flex;align-items:flex-start}
.loader__count i{font-style:normal;color:var(--ember);font-size:.5em;margin:.12em 0 0 .08em}
.loader__txt{font:600 .85rem/1 var(--ff-text);letter-spacing:.24em;text-transform:uppercase;color:var(--smoke)}
.loader__bar{width:min(15rem,60vw);height:3px;background:rgba(245,233,214,.16);border-radius:3px;overflow:hidden}
.loader__bar span{display:block;height:100%;background:linear-gradient(90deg,var(--ember),var(--flame));transform:scaleX(0);transform-origin:left}

/* ---------- barre de progression / curseur / grain ---------- */
.progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:300;pointer-events:none}
.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--ember),var(--flame));transform:scaleX(0);transform-origin:left}
.cursor{position:fixed;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--flame);z-index:2000;pointer-events:none;display:none;place-items:center;transform:translate3d(-100px,-100px,0);will-change:transform;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .3s}
.cursor span{font:700 .62rem/1 var(--ff-text);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);opacity:0;transition:opacity .2s}
.cursor.is-big{width:74px;height:74px;margin:-37px 0 0 -37px;background:rgba(255,138,31,.92)}
.cursor.is-big span{opacity:1}
.cursor.is-link{width:38px;height:38px;margin:-19px 0 0 -19px;background:rgba(255,138,31,.35)}
@media (hover:hover) and (pointer:fine){.js .cursor{display:grid}}
.grain{position:fixed;inset:-6%;width:112%;height:112%;z-index:1500;pointer-events:none;opacity:.55;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .2 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain 1.1s steps(7) infinite}
@keyframes grain{0%{transform:translate3d(0,0,0)}14%{transform:translate3d(-2%,1.5%,0)}28%{transform:translate3d(1.5%,-2.5%,0)}42%{transform:translate3d(-3%,-1%,0)}57%{transform:translate3d(2.5%,2%,0)}71%{transform:translate3d(-1%,3%,0)}85%{transform:translate3d(2%,-1.5%,0)}100%{transform:translate3d(0,0,0)}}

/* ---------- navigation ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:120;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:.9rem var(--gutter);transition:transform .6s var(--ease),background .4s,box-shadow .4s}
.js .nav{transform:translateY(-120%)}
.js .nav.is-in{transform:none}
.js .nav.is-in.is-hidden{transform:translateY(-120%)}
.nav.is-solid{background:rgba(14,10,9,.92);box-shadow:0 1px 0 rgba(245,233,214,.08)}
.nav__brand{display:flex;align-items:center;gap:.8rem}
.nav__brand img{width:2.9rem;height:2.9rem;border-radius:50%;background:#fff;transition:transform .8s var(--ease)}
.nav__brand:hover img{transform:rotate(360deg)}
.nav__word{font:800 1.25rem/1 var(--ff-display);font-variation-settings:'wdth' 75;letter-spacing:.02em;text-transform:uppercase}
.nav__word b{color:var(--ember);margin-left:.3em}
.nav__links{display:flex;gap:clamp(1.2rem,2.4vw,2.4rem);font-weight:600;font-size:.95rem}
.nav__actions{display:flex;align-items:center;gap:1rem}
.nav__tel{display:none;align-items:center;gap:.5rem;font-weight:700;font-size:.95rem}
.nav__burger{display:none;width:3rem;height:3rem;border-radius:50%;background:var(--ember);position:relative}
.nav__burger span{position:absolute;left:.95rem;right:.95rem;height:2px;background:var(--sauce);border-radius:2px;transition:transform .5s var(--ease),top .5s var(--ease)}
.nav__burger span:nth-child(1){top:1.2rem}
.nav__burger span:nth-child(2){top:1.7rem}
.nav__burger[aria-expanded=true] span:nth-child(1){top:1.45rem;transform:rotate(45deg)}
.nav__burger[aria-expanded=true] span:nth-child(2){top:1.45rem;transform:rotate(-45deg)}
@media (min-width:1180px){.nav__tel{display:inline-flex}}
@media (max-width:980px){.nav__links{display:none}.nav__burger{display:block}}

.menu{position:fixed;inset:0;z-index:110;visibility:hidden;display:flex;flex-direction:column;justify-content:center;padding:6rem var(--gutter) 2.5rem}
.menu.is-open{visibility:visible}
.menu__bg{position:absolute;inset:0;background:var(--ember);z-index:-1;clip-path:circle(0 at calc(100% - 3rem) 2.4rem)}
.menu__links{display:flex;flex-direction:column;gap:.2rem}
.menu__links a{display:block;overflow:hidden;font:800 clamp(2.8rem,13vw,5.4rem)/1 var(--ff-display);font-variation-settings:'wdth' 75;text-transform:uppercase;color:var(--sauce);padding:.05em 0}
.menu__links a span{display:block;will-change:transform}
.menu__foot{margin-top:2.4rem;display:flex;flex-direction:column;gap:1rem;align-items:flex-start;color:var(--sauce)}
.menu__foot .btn{--bg:var(--coal);}

/* ---------- barre flottante mobile + panier ---------- */
.fab{position:fixed;left:50%;bottom:calc(.9rem + env(safe-area-inset-bottom));z-index:130;display:none;gap:.5rem;padding:.4rem;border-radius:999px;background:rgba(14,10,9,.94);box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 0 1px rgba(245,233,214,.1);transform:translate(-50%,160%);transition:transform .6s var(--ease)}
.fab.is-in{transform:translate(-50%,0)}
.fab a{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.3rem;border-radius:999px;font-weight:700;font-size:.95rem}
.fab__call{background:var(--ember);color:var(--sauce)}
.fab__book{background:var(--sauce);color:var(--ink)}
.fab b{display:inline-grid;place-items:center;min-width:1.3rem;height:1.3rem;border-radius:999px;background:var(--ember);color:var(--sauce);font-size:.75rem}
@media (max-width:760px){.fab{display:flex}}

.cartpill{position:fixed;right:var(--gutter);bottom:1.4rem;z-index:125;display:inline-flex;align-items:center;gap:.8rem;padding:.9rem 1.3rem;border-radius:999px;background:var(--sauce);color:var(--ink);font-weight:700;box-shadow:0 18px 50px rgba(0,0,0,.45);transform:translateY(200%);transition:transform .6s var(--ease)}
.cartpill[hidden]{display:none}
.cartpill.is-in{transform:none}
.cartpill .ico{color:var(--ember)}
@media (max-width:760px){.cartpill{right:50%;bottom:4.9rem;transform:translate(50%,260%)}.cartpill.is-in{transform:translate(50%,0)}}

.toast{position:fixed;left:50%;top:5.6rem;z-index:2100;transform:translate(-50%,-30px);opacity:0;pointer-events:none;background:var(--sauce);color:var(--ink);padding:.7rem 1.2rem;border-radius:999px;font-weight:700;font-size:.92rem;box-shadow:0 14px 40px rgba(0,0,0,.4);transition:transform .5s var(--ease),opacity .4s}
.toast.is-in{opacity:1;transform:translate(-50%,0)}

/* ---------- gouttes de sauce (séparateurs) ---------- */
.drip{position:absolute;top:-1px;left:0;right:0;height:clamp(3.6rem,7.2vw,7rem);z-index:6;pointer-events:none;color:var(--coal)}
.drip[data-color=coal]{color:var(--coal)}
.drip[data-color=cream]{color:var(--cream)}
.drip[data-color=ember]{color:var(--ember)}
.drip[data-color=paper]{color:var(--paper)}
.drip svg{display:block;width:100%;height:100%;fill:currentColor;transform-origin:50% 0;overflow:visible}
section,footer{position:relative}

/* ---------- 1. HERO ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--nav-h) + 2rem) var(--gutter) 7.2rem;overflow:hidden;isolation:isolate;color:var(--sauce);background:var(--coal)}
.hero__media{position:absolute;inset:-9% 0;z-index:-4;will-change:transform}
.hero__video{width:100%;height:100%;object-fit:cover}
.hero__shade{position:absolute;inset:0;z-index:-3;background:
  radial-gradient(120% 80% at 15% 100%,rgba(220,31,43,.45),transparent 55%),
  linear-gradient(180deg,rgba(14,10,9,.62) 0%,rgba(14,10,9,.18) 32%,rgba(14,10,9,.55) 68%,rgba(14,10,9,.96) 100%)}
.hero__mop{position:absolute;right:-2vw;bottom:-6vw;z-index:-2;font:800 clamp(14rem,44vw,48rem)/.78 var(--ff-display);font-variation-settings:'wdth' 75;color:rgba(255,248,238,.075);pointer-events:none;user-select:none;will-change:transform}
.embers{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.ember{position:absolute;bottom:-14px;width:var(--s,6px);height:var(--s,6px);border-radius:50%;background:radial-gradient(circle,#fff0cf 0,var(--flame) 45%,rgba(255,138,31,0) 72%);opacity:0;will-change:transform,opacity;box-shadow:0 0 12px 2px rgba(255,138,31,.55)}
.hero__inner{position:relative;max-width:92rem;width:100%;margin:0 auto}
.hero__kicker{display:inline-flex;align-items:center;gap:.7rem;font:700 .8rem/1 var(--ff-text);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.6rem;color:var(--cream)}
.hero__kicker .ico{color:var(--ember);width:1.7rem;height:1.7rem;background:var(--sauce);border-radius:50%;padding:.25rem}
.hero__title{font-size:clamp(3.9rem,15.4vw,18rem);line-height:.84}
.hl{display:block;overflow:hidden;padding:.12em 0 .02em;margin:-.12em 0 -.02em}
.hl__in{display:block;will-change:transform}
.hl--out .hl__in{color:transparent;background:linear-gradient(95deg,#ffb347 0%,var(--flame) 38%,var(--ember) 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 .04em 0 rgba(14,10,9,.55)) drop-shadow(0 .1em .3em rgba(14,10,9,.35))}
.hero__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:2rem 3rem;margin-top:2.4rem}
.hero__sub{max-width:36rem;font-size:clamp(1.02rem,1.5vw,1.22rem);color:rgba(255,248,238,.9)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem}
.hero__foot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:1.6rem;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1rem;border-radius:999px;background:rgba(14,10,9,.72);border:1px solid rgba(245,233,214,.16);font-size:.88rem;font-weight:500;color:var(--cream)}
.chip .ico{color:var(--flame)}
.chip b{font-weight:800;color:var(--sauce)}
.pulse{width:.6rem;height:.6rem;border-radius:50%;background:var(--smoke);position:relative}
.chip--status.is-open .pulse{background:#3ddc84}
.chip--status.is-open .pulse::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid #3ddc84;animation:ping 1.8s var(--ease) infinite}
.chip--status.is-closed .pulse{background:var(--ember)}
@keyframes ping{0%{transform:scale(.5);opacity:1}100%{transform:scale(1.8);opacity:0}}
.hero__scroll{margin-left:auto;display:flex;align-items:center;gap:.8rem;font:700 .72rem/1 var(--ff-text);letter-spacing:.24em;text-transform:uppercase;color:var(--cream)}
.hero__scroll i{display:block;width:3.4rem;height:2px;background:rgba(245,233,214,.25);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;inset:0;background:var(--flame);transform:translateX(-100%);animation:scrollcue 2.1s var(--ease-io) infinite}
@keyframes scrollcue{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
.vidbtn{width:2.7rem;height:2.7rem;border-radius:50%;display:grid;place-items:center;background:rgba(14,10,9,.72);border:1px solid rgba(245,233,214,.2)}
.vidbtn:hover{background:var(--ember)}

/* ---------- 2. MARQUEES ---------- */
.marquees{position:relative;padding:2.2rem 0 3rem;background:var(--coal);overflow:hidden;z-index:2}
.marquee{width:116vw;margin-left:-8vw;overflow:hidden;white-space:nowrap}
.marquee--red{background:var(--ember);color:var(--sauce);transform:rotate(-2.2deg);padding:1.1rem 0;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.marquee--dark{background:var(--cream);color:var(--ink);transform:rotate(1.4deg);padding:.9rem 0;margin-top:-1.1rem}
.marquee__track{display:flex;width:max-content;will-change:transform}
.marquee__grp{display:flex;align-items:center;flex:none}
.marquee__grp span{font:800 clamp(2.4rem,6.4vw,6rem)/1 var(--ff-display);font-variation-settings:'wdth' 75;text-transform:uppercase;padding:0 1.4rem}
.marquee__grp svg{width:clamp(1.6rem,3.4vw,3.2rem);height:clamp(1.6rem,3.4vw,3.2rem);fill:currentColor;flex:none;opacity:.9}
.marquee--dark .marquee__grp span{color:var(--ink)}
.marquee--dark .marquee__grp svg{fill:var(--ember)}

/* ---------- 3. LA BROCHE (pin) ---------- */
.story{background:var(--coal);color:var(--cream);overflow:hidden}
.story__pin{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:calc(var(--nav-h) + 1.2rem) var(--gutter) 2.4rem}
.story__wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2rem,6vw,7rem);width:100%;max-width:92rem;margin:0 auto;align-items:center}
.story .h2{font-size:clamp(2.6rem,6.6vw,7rem)}
.story__steps{position:relative;margin-top:2.2rem;min-height:15.5rem}
.step{position:absolute;left:0;right:0;top:0;max-width:34rem}
.step__n{position:absolute;right:0;top:-1.2rem;font-size:clamp(5rem,12vw,10rem);color:rgba(245,233,214,.09);line-height:.8;pointer-events:none}
.step h3{font:800 clamp(1.8rem,3.2vw,2.8rem)/1 var(--ff-display);font-variation-settings:'wdth' 85;text-transform:uppercase;color:var(--flame);margin-bottom:.9rem}
.step p{color:rgba(245,233,214,.88);font-size:1.08rem;position:relative}
.spitnav{display:flex;align-items:center;gap:1.4rem;margin-top:1.8rem}
.spit{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:center;width:3rem;height:4.6rem}
.spit::before{content:"";position:absolute;left:50%;top:-.5rem;bottom:-.5rem;width:2px;margin-left:-1px;background:var(--smoke);border-radius:2px}
.spit i{display:block;width:100%;height:.3rem;border-radius:.3rem;background:linear-gradient(90deg,#6b3a22,#c27a43 40%,#8a4b2a);transform-origin:50% 50%;will-change:transform}
.spit i:nth-child(3n){background:linear-gradient(90deg,#7c4429,#e0a064 40%,#a2612f)}
.spitnav__dots{display:flex;gap:.5rem}
.spitnav__dots b{width:.6rem;height:.6rem;border-radius:50%;background:rgba(245,233,214,.22);transition:background .4s,transform .4s var(--ease)}
.spitnav__dots b.is-on{background:var(--ember);transform:scale(1.5)}
.spitnav__count{font:700 .85rem/1 var(--ff-text);letter-spacing:.14em;color:var(--smoke)}
.spitnav__count b{color:var(--sauce)}
.story__right{position:relative}
.story__frame{position:relative;aspect-ratio:4/5;max-height:78vh;margin-left:auto;border-radius:1.8rem;overflow:hidden;background:var(--char);box-shadow:0 40px 90px -30px rgba(220,31,43,.45),0 0 0 1px rgba(245,233,214,.08)}
.story__frame::after{content:"";position:absolute;inset:0;background:radial-gradient(90% 60% at 50% 110%,rgba(14,10,9,.7),transparent 60%);pointer-events:none}
.shot{position:absolute;inset:0;will-change:clip-path}
.shot img{width:100%;height:100%;object-fit:cover;will-change:transform}
.story__tag{position:absolute;left:1.2rem;bottom:1.2rem;z-index:3;font:800 1.15rem/1.1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase;background:var(--ember);color:var(--sauce);padding:.55rem .9rem;border-radius:.5rem;transform:rotate(-3deg)}

/* ---------- 4. FAVORIS ---------- */
.stars{background:var(--cream);color:var(--ink);padding:clamp(7.5rem,14vw,12.5rem) 0 clamp(5rem,10vw,9rem)}
.stars .eyebrow span{background:var(--ember)}
.sec-head{display:flex;flex-direction:column;gap:1rem;max-width:62rem}
.sec-head--row{max-width:none;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:2rem 4rem;flex-wrap:wrap}
.sec-head__p{max-width:30rem;font-size:1.1rem;color:rgba(27,17,14,.72)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,2rem);margin-top:clamp(3rem,6vw,5rem);perspective:1400px}
.card{position:relative;display:flex;flex-direction:column;background:var(--sauce);border-radius:1.5rem;overflow:hidden;transform-style:preserve-3d;box-shadow:0 34px 70px -34px rgba(27,17,14,.55),0 0 0 1px rgba(27,17,14,.06);will-change:transform}
.card:nth-child(even){margin-top:3.6rem}
.card__img{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.card__img img{width:100%;height:100%;object-fit:cover;transition:scale 1s var(--ease)}
.card:hover .card__img img{scale:1.08}
.card__body{position:relative;padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.5rem;flex:1;transform:translateZ(36px)}
.card h3{font:800 1.9rem/1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase}
.card p{font-size:.95rem;color:rgba(27,17,14,.7)}
.badge{align-self:flex-start;font:700 .7rem/1 var(--ff-text);letter-spacing:.14em;text-transform:uppercase;background:var(--ink);color:var(--sauce);padding:.45rem .7rem;border-radius:999px}
.badge--red{background:var(--ember)}
.card__foot{margin-top:auto;padding-top:.9rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.card__foot strong{font:800 2rem/1 var(--ff-display);font-variation-settings:'wdth' 80;color:var(--ember)}
.add{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:999px;background:var(--ink);color:var(--sauce);font-weight:700;font-size:.88rem;transition:background .3s,scale .3s var(--ease)}
.add:hover{background:var(--ember);scale:1.06}
.add.is-done{background:#1f9d55}
.glare{position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.7),rgba(255,255,255,0) 46%);mix-blend-mode:soft-light;opacity:0;transition:opacity .4s}
.tilt:hover .glare{opacity:1}

/* ---------- 5. LA CARTE (horizontal) ---------- */
.board{background:var(--ember);color:var(--sauce);padding-top:clamp(3rem,6vw,5rem)}
.board__pin{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(1rem,2.6vh,2rem);padding:calc(var(--nav-h) - .6rem) 0 1.4rem;overflow:hidden}
.board__head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;padding:0 var(--gutter);flex-wrap:wrap}
.board .h2{font-size:clamp(2.4rem,4.6vw,5rem)}
.board .eyebrow{color:rgba(255,248,238,.8)}
.board .eyebrow span{background:var(--sauce);color:var(--ember)}
.board__meta{display:flex;flex-direction:column;gap:.9rem;min-width:min(18rem,100%);font-size:.95rem;color:rgba(255,248,238,.9)}
.board__meta b{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--sauce);color:var(--ember)}
.board__prog{height:4px;border-radius:4px;background:rgba(255,248,238,.28);overflow:hidden}
.board__prog span{display:block;height:100%;background:var(--sauce);transform:scaleX(0);transform-origin:left}
.board__track{display:flex;gap:clamp(1.2rem,2.6vw,2.6rem);padding:0 var(--gutter);width:max-content;will-change:transform}
.panel{flex:0 0 auto;width:min(62rem,86vw);display:grid;grid-template-columns:14.5em 1fr;gap:1.6em;padding:1.7em;font-size:clamp(.78rem,1.78vh,1.02rem);border-radius:1.8rem;background:var(--sauce);color:var(--ink);box-shadow:0 40px 80px -40px rgba(14,10,9,.7)}
.panel--alt{background:var(--coal);color:var(--cream)}
.panel__photo{position:relative;align-self:start;aspect-ratio:3/4.1;border-radius:.9em;overflow:hidden;transform:rotate(-3deg);box-shadow:0 20px 40px -18px rgba(14,10,9,.6);border:6px solid #fff}
.panel--alt .panel__photo{border-color:var(--sauce)}
.panel__photo.tapeB{transform:rotate(2.6deg)}
.panel__photo img{width:100%;height:100%;object-fit:cover}
.panel__photo::after{content:"";position:absolute;left:50%;top:.2em;width:5.4em;height:1.7em;margin-left:-2.7em;background:rgba(255,226,140,.82);transform:rotate(-4deg);z-index:4;box-shadow:0 2px 6px rgba(14,10,9,.25)}
.panel__body{min-width:0}
.panel__title{font-size:clamp(2.2rem,6.4vh,4.4rem);color:var(--ember);margin-bottom:.4em}
.panel__title span{opacity:.45}
.panel--alt .panel__title{color:var(--flame)}
.panel__note{font:700 .74em/1.2 var(--ff-text);letter-spacing:.16em;text-transform:uppercase;opacity:.62;margin-bottom:.8em}
.panel__foot{margin-top:.7em;font-size:.9em;opacity:.7}
.items li{position:relative;padding:.48em 3em .48em 0;border-bottom:1px dashed rgba(27,17,14,.2)}
.panel--alt .items li{border-bottom-color:rgba(245,233,214,.2)}
.items li:last-child{border-bottom:0}
.it__main{display:flex;align-items:baseline;gap:.5rem}
.it__name{font:700 1.1em/1.2 var(--ff-text)}
.it__dots{flex:1;border-bottom:2px dotted currentColor;opacity:.25;transform:translateY(-.25em);min-width:1rem}
.it__price{font:800 1.14em/1 var(--ff-display);font-variation-settings:'wdth' 85;color:var(--ember);white-space:nowrap}
.panel--alt .it__price{color:var(--flame)}
.it__desc{font-size:.84em;line-height:1.35;opacity:.68;margin-top:.12em}
.it__add{position:absolute;right:0;top:50%;margin-top:-1.05em;width:2.1em;height:2.1em;border-radius:50%;display:grid;place-items:center;background:var(--ember);color:var(--sauce);transition:transform .35s var(--ease),background .3s}
.it__add:hover{transform:scale(1.18) rotate(90deg);background:var(--ink)}
.panel--alt .it__add{background:var(--flame);color:var(--ink)}
.it__add.is-done,.drinks button.is-done{background:#1f9d55!important;color:#fff!important}
.drinks{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.8rem}
.drinks button{padding:.55em .95em;border-radius:999px;border:1.5px solid rgba(245,233,214,.35);font-weight:600;font-size:.9em;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease)}
.drinks button:hover{background:var(--flame);color:var(--ink);border-color:var(--flame);transform:translateY(-2px)}
.drinks small{opacity:.7;margin-left:.3rem}
.panel--end{background:transparent;box-shadow:none;grid-template-columns:1fr;width:min(34rem,86vw);align-content:center;color:var(--sauce)}
.panel__body--end{display:flex;flex-direction:column;align-items:flex-start;gap:1.2rem}
.panel__body--end .h3{color:var(--sauce)}
.panel__legal{font-size:.8rem;opacity:.75}

/* ---------- 6. CHIFFRES ---------- */
.numbers{background:var(--coal);color:var(--cream);padding:clamp(8rem,14vw,12rem) 0 clamp(7rem,12vw,10rem);overflow:hidden}
.numbers__grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:2.4rem;border-top:1px solid rgba(245,233,214,.16)}
.num{position:relative;padding:2.2rem clamp(.8rem,1.6vw,1.8rem) 0;border-left:1px solid rgba(245,233,214,.16)}
.num:first-child{border-left:0;padding-left:0}
.num:nth-child(2){margin-top:3.2rem}
.num:nth-child(3){margin-top:6.4rem}
.num:nth-child(4){margin-top:9.6rem}
.num__v{display:flex;align-items:flex-start;font-size:clamp(4.4rem,10.6vw,11.5rem);line-height:.82;color:var(--sauce)}
.num:nth-child(even) .num__v{color:var(--flame)}
.num__v em{font-style:normal;color:var(--ember);font-size:.55em;margin-left:.06em}
.num__l{margin-top:1.1rem;max-width:15rem;color:var(--smoke);font-size:1rem}

/* ---------- 7. GALERIE ---------- */
.gallery{background:var(--paper);color:var(--ink);padding:clamp(8rem,14vw,12rem) 0 clamp(5rem,9vw,8rem)}
.mosaic{column-count:3;column-gap:clamp(.7rem,1.4vw,1.4rem);margin-top:clamp(2.6rem,5vw,4rem)}
.tile{position:relative;display:block;break-inside:avoid;margin:0 0 clamp(.7rem,1.4vw,1.4rem);border-radius:1.2rem;overflow:hidden;cursor:zoom-in;perspective:900px;aspect-ratio:var(--ar,4/3);background:var(--char)}
.tile__in{position:absolute;inset:0;overflow:hidden;border-radius:inherit;transform-style:preserve-3d;transition:box-shadow .6s;will-change:transform}
.tile img{position:absolute;left:0;top:-9%;width:100%;height:118%;object-fit:cover;transition:filter .6s;will-change:transform}
.tile:hover .tile__in,.tile:focus-visible .tile__in{box-shadow:0 30px 60px -20px rgba(14,10,9,.55)}
.tile:hover img{filter:saturate(1.15) contrast(1.04)}
.tile figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.6rem 1.1rem 1rem;background:linear-gradient(transparent,rgba(14,10,9,.88));color:var(--sauce);font:700 .95rem/1.2 var(--ff-text);transform:translateY(101%);transition:transform .6s var(--ease)}
.tile:hover figcaption,.tile:focus-visible figcaption{transform:none}
.t1{--ar:4/3}.t2{--ar:3/4}.t3{--ar:4/3}.t4{--ar:1/1}.t5{--ar:4/3}.t6{--ar:2/3}.t7{--ar:4/3}.t8{--ar:2/3}.t9{--ar:4/3}.t10{--ar:4/3}.t11{--ar:3/4}.t12{--ar:4/3}

.lb{position:fixed;inset:0;z-index:2200;display:grid;place-items:center;background:rgba(14,10,9,.95);opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;padding:2rem}
.lb.is-open{opacity:1;visibility:visible}
.lb__fig{max-width:min(92vw,70rem);max-height:86vh;display:flex;flex-direction:column;align-items:center;gap:1rem}
.lb__fig img{max-height:76vh;width:auto;max-width:100%;object-fit:contain;border-radius:1rem;box-shadow:0 40px 90px rgba(0,0,0,.6)}
.lb__fig figcaption{color:var(--cream);font-weight:600}
.lb__x,.lb__nav{position:absolute;width:3.2rem;height:3.2rem;border-radius:50%;display:grid;place-items:center;background:rgba(245,233,214,.12);transition:background .3s}
.lb__x:hover,.lb__nav:hover{background:var(--ember)}
.lb__x{top:1.2rem;right:1.2rem}
.lb__nav--p{left:1.2rem;top:50%;margin-top:-1.6rem}
.lb__nav--n{right:1.2rem;top:50%;margin-top:-1.6rem}

/* ---------- 8. AVIS ---------- */
.reviews{background:var(--coal);color:var(--cream);padding:clamp(8rem,14vw,12rem) 0 clamp(4.5rem,8vw,7rem);overflow:hidden}
.rv__head{display:flex;justify-content:space-between;align-items:flex-end;gap:2.4rem;flex-wrap:wrap}
.rv__score{display:flex;flex-direction:column;gap:.7rem}
.rv__stars{display:flex;gap:.25rem}
.rv__stars svg{width:2rem;height:2rem;fill:var(--flame)}
.rv__score p{font-size:1.15rem;color:var(--smoke)}
.rv__score p b{color:var(--sauce);font-size:1.5rem}
.rv__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.3rem}
.rv__tags span{padding:.45rem .85rem;border-radius:999px;border:1px solid rgba(245,233,214,.22);font-size:.88rem}
.rv__tags b{color:var(--flame);margin-left:.3rem}
.rv__viewport{margin-top:clamp(2.6rem,5vw,4rem);padding-left:max(var(--gutter),calc((100vw - 92rem)/2 + var(--gutter)));cursor:grab;touch-action:pan-y}
.rv__viewport.is-drag{cursor:grabbing}
.rv__track{display:flex;gap:clamp(1rem,2vw,1.8rem);width:max-content;will-change:transform}
.rv{flex:0 0 auto;width:min(31rem,84vw);display:flex;flex-direction:column;gap:1.3rem;padding:clamp(1.4rem,2.4vw,2.2rem);border-radius:1.7rem;background:var(--char);border:1px solid rgba(245,233,214,.1);position:relative;user-select:none}
.rv::before{content:"“";position:absolute;right:1.4rem;top:.2rem;font:800 7rem/1 var(--ff-display);color:rgba(245,233,214,.07)}
.rv--red{background:var(--ember);border-color:transparent;color:var(--sauce)}
.rv--red::before{color:rgba(255,248,238,.18)}
.rv--cream{background:var(--cream);color:var(--ink);border-color:transparent}
.rv--cream::before{color:rgba(27,17,14,.08)}
.rv__top{display:flex;align-items:center;gap:.9rem}
.rv__av{display:grid;place-items:center;width:2.9rem;height:2.9rem;border-radius:50%;background:var(--flame);color:var(--ink);font:800 1.15rem/1 var(--ff-display)}
.rv--red .rv__av{background:var(--sauce);color:var(--ember)}
.rv--cream .rv__av{background:var(--ember);color:var(--sauce)}
.rv__top b{display:block;font-size:1.05rem}
.rv__top small{opacity:.65;font-size:.82rem}
.rv blockquote{font:500 clamp(1.15rem,1.8vw,1.42rem)/1.4 var(--ff-text);flex:1}
.rv__reply{padding:.9rem 1rem;border-radius:1rem;background:rgba(245,233,214,.07);font-size:.88rem}
.rv--red .rv__reply{background:rgba(14,10,9,.18)}
.rv--cream .rv__reply{background:rgba(27,17,14,.07)}
.rv__reply b{display:block;font:700 .68rem/1 var(--ff-text);letter-spacing:.16em;text-transform:uppercase;margin-bottom:.35rem;opacity:.75}
.rv__reply p{opacity:.9}
.rv__ctrl{display:flex;align-items:center;gap:1.6rem;margin-top:2.2rem;flex-wrap:wrap}
.rv__prog{flex:1;min-width:8rem;height:3px;border-radius:3px;background:rgba(245,233,214,.16);overflow:hidden}
.rv__prog span{display:block;height:100%;background:var(--ember);transform:scaleX(0);transform-origin:left}
.rv__btns{display:flex;gap:.6rem}
.rv__btns button{width:3.1rem;height:3.1rem;border-radius:50%;display:grid;place-items:center;border:1.5px solid rgba(245,233,214,.3);transition:background .3s,border-color .3s}
.rv__btns button:hover{background:var(--ember);border-color:var(--ember)}

/* ---------- 9. APPEL À L'ACTION ---------- */
.callout{background:var(--ember);color:var(--sauce);padding:clamp(9rem,15vw,13rem) 0 clamp(6rem,10vw,9rem);overflow:hidden;text-align:center}
.callout__bg{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;overflow:hidden}
.callout__bg span{font:800 clamp(18rem,52vw,60rem)/.8 var(--ff-display);font-variation-settings:'wdth' 75;color:rgba(255,248,238,.075);will-change:transform}
.callout__in{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.4rem}
.callout__title{font-size:clamp(3.2rem,10vw,10rem)}
.callout__tel{display:inline-flex;align-items:center;gap:clamp(.6rem,2vw,1.6rem);font-size:clamp(2.6rem,9.4vw,10.5rem);line-height:.9;margin:.6rem 0 1rem;color:var(--sauce);will-change:transform}
.callout__tel .ico{width:.62em;height:.62em;animation:ring 2.8s var(--ease) infinite;transform-origin:50% 50%}
@keyframes ring{0%,60%,100%{transform:rotate(0)}66%{transform:rotate(-16deg)}72%{transform:rotate(14deg)}78%{transform:rotate(-12deg)}84%{transform:rotate(10deg)}90%{transform:rotate(-5deg)}}
.telnum{display:inline-flex;gap:.22em}
.telnum i{font-style:normal;display:inline-block}
.callout__tel:hover .telnum i{animation:wave .7s var(--ease) both}
.callout__tel:hover .telnum i:nth-child(2){animation-delay:.06s}
.callout__tel:hover .telnum i:nth-child(3){animation-delay:.12s}
.callout__tel:hover .telnum i:nth-child(4){animation-delay:.18s}
.callout__tel:hover .telnum i:nth-child(5){animation-delay:.24s}
@keyframes wave{0%{transform:translateY(0)}40%{transform:translateY(-.14em);color:var(--coal)}100%{transform:translateY(0)}}
.callout__btns{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}

/* ---------- 10. RÉSERVATION ---------- */
.book{background:var(--cream);color:var(--ink);padding:clamp(8rem,14vw,12rem) 0 clamp(5rem,9vw,8rem)}
.book__grid{display:grid;grid-template-columns:minmax(0,1fr) 23rem;gap:clamp(1.6rem,4vw,4rem);margin-top:clamp(2.4rem,5vw,4rem);align-items:start}
.bookform{display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.bookdone,.ticketwrap{min-width:0}
.bookform[hidden]{display:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.fs{background:var(--sauce);border-radius:1.5rem;padding:clamp(1.2rem,2.4vw,1.9rem);box-shadow:0 20px 50px -34px rgba(27,17,14,.5),0 0 0 1px rgba(27,17,14,.06)}
.fs legend{float:left;width:100%;display:flex;align-items:center;gap:.8rem;font:800 1.7rem/1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase;margin-bottom:1.1rem;padding:0}
.fs legend span{display:inline-grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--ember);color:var(--sauce);font-size:1.05rem}
.fs legend small{font:500 .85rem/1 var(--ff-text);text-transform:none;letter-spacing:0;opacity:.6}
.fs > *:not(legend){clear:both}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.mode{position:relative;cursor:pointer}
.mode input,.dates input,.slots input{position:absolute;opacity:0;pointer-events:none}
.mode__box{display:flex;flex-direction:column;gap:.15rem;padding:1.1rem 1.2rem;border-radius:1.1rem;border:2px solid rgba(27,17,14,.14);background:#fff;transition:border-color .3s,background .3s,transform .4s var(--ease)}
.mode__box .ico{width:1.6rem;height:1.6rem;color:var(--ember);margin-bottom:.4rem}
.mode__box b{font-size:1.1rem}
.mode__box small{opacity:.65;font-size:.88rem}
.mode:hover .mode__box{transform:translateY(-3px)}
.mode input:checked + .mode__box{border-color:var(--ember);background:#fff3f1;box-shadow:0 0 0 4px rgba(220,31,43,.12)}
.mode input:focus-visible + .mode__box,.dates input:focus-visible + .date,.slots input:focus-visible + .slot{outline:3px solid var(--flame);outline-offset:2px}
.party{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding:.8rem 1rem;border-radius:1rem;background:rgba(27,17,14,.05)}
.party[hidden]{display:none}
.party__l{font-weight:600}
.stepper{display:inline-flex;align-items:center;gap:.5rem}
.stepper button{width:2.4rem;height:2.4rem;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--sauce);transition:background .3s,transform .3s var(--ease)}
.stepper button:hover{background:var(--ember);transform:scale(1.08)}
.stepper output{min-width:2.4rem;text-align:center;font:800 1.5rem/1 var(--ff-display);font-variation-settings:'wdth' 80}
.dates{position:relative;display:flex;gap:.55rem;overflow-x:auto;padding:.2rem .2rem .7rem;margin:0 -.2rem;scrollbar-width:thin}
.date{display:flex;flex-direction:column;align-items:center;min-width:4.2rem;padding:.65rem .5rem;border-radius:1rem;border:2px solid rgba(27,17,14,.14);background:#fff;cursor:pointer;transition:border-color .3s,background .3s,color .3s,transform .4s var(--ease)}
.date small{font:700 .68rem/1 var(--ff-text);letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.date b{font:800 1.7rem/1.1 var(--ff-display);font-variation-settings:'wdth' 80}
.date em{font-style:normal;font-size:.72rem;opacity:.65}
.date:hover{transform:translateY(-3px)}
.dates input:checked + .date{background:var(--ember);border-color:var(--ember);color:var(--sauce)}
.dates input:checked + .date small,.dates input:checked + .date em{opacity:.9}
.dates label,.slots label{position:relative;display:block;flex:none}
.slots{position:relative}
.dates input:disabled + .date{opacity:.38;cursor:not-allowed;background:transparent;transform:none}
.slotgrp{margin-top:.8rem}
.slotgrp h5{margin:0 0 .5rem;font:700 .74rem/1 var(--ff-text);letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.slotlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(4.7rem,1fr));gap:.45rem}
.slot{display:block;text-align:center;padding:.65rem .3rem;border-radius:.8rem;border:2px solid rgba(27,17,14,.14);background:#fff;font-weight:700;font-size:.95rem;cursor:pointer;transition:border-color .3s,background .3s,color .3s,transform .3s var(--ease)}
.slot:hover{border-color:var(--ember);transform:translateY(-2px)}
.slots input:checked + .slot{background:var(--ink);border-color:var(--ink);color:var(--sauce)}
.slots__none{padding:1rem;border-radius:1rem;background:rgba(27,17,14,.06);font-size:.95rem}
.cartlist{display:flex;flex-direction:column;gap:.1rem}
.cartlist__empty{padding:.9rem 1rem;border-radius:1rem;background:rgba(27,17,14,.05);font-size:.95rem}
.cartlist__empty a{color:var(--ember);font-weight:700;text-decoration:underline}
.cl{display:flex;align-items:center;gap:.8rem;padding:.6rem 0;border-bottom:1px dashed rgba(27,17,14,.18)}
.cl__n{flex:1;font-weight:600;min-width:0}
.cl__p{font:800 1.05rem/1 var(--ff-display);font-variation-settings:'wdth' 85;min-width:4.2rem;text-align:right}
.cl .stepper button{width:2rem;height:2rem}
.cl .stepper output{min-width:1.6rem;font-size:1.2rem}
.quick{margin:.9rem 0 1rem;border-radius:1rem;border:2px dashed rgba(27,17,14,.2)}
.quick summary{display:flex;align-items:center;gap:.5rem;padding:.8rem 1rem;font-weight:700;cursor:pointer;list-style:none}
.quick summary::-webkit-details-marker{display:none}
.quick summary .ico{color:var(--ember);transition:transform .4s var(--ease)}
.quick[open] summary .ico{transform:rotate(45deg)}
.quick__body{padding:0 1rem 1rem;max-height:22rem;overflow:auto}
.quick__body h6{margin:1rem 0 .3rem;font:800 1.05rem/1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase;color:var(--ember)}
.qrow{display:flex;align-items:center;gap:.7rem;padding:.4rem 0;border-bottom:1px solid rgba(27,17,14,.08);font-size:.95rem}
.qrow span:first-child{flex:1}
.qrow .qp{opacity:.65;font-size:.88rem;white-space:nowrap}
.qrow .stepper button{width:1.9rem;height:1.9rem}
.qrow .stepper output{min-width:1.4rem;font-size:1.05rem}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field--wide{margin-top:.4rem}
.field span{font:700 .78rem/1 var(--ff-text);letter-spacing:.12em;text-transform:uppercase;opacity:.7}
.field input,.field textarea{width:100%;padding:.95rem 1rem;border-radius:.9rem;border:2px solid rgba(27,17,14,.14);background:#fff;font:500 1.02rem/1.3 var(--ff-text);color:var(--ink);transition:border-color .3s,box-shadow .3s}
.field textarea{resize:vertical;min-height:4.4rem}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--ember);box-shadow:0 0 0 4px rgba(220,31,43,.14)}
.field.is-bad input{border-color:var(--ember);background:#fff3f1}
.form__status{min-height:1.4rem;font-weight:700;color:var(--ember)}
.form__legal{font-size:.84rem;opacity:.65}
.ticketwrap{position:sticky;top:6.2rem}
.ticket{position:relative;background:#fffdf7;color:var(--ink);padding:1.4rem 1.4rem 2.2rem;border-radius:.4rem .4rem 0 0;box-shadow:0 30px 60px -28px rgba(27,17,14,.6);transform:rotate(1.4deg);font-family:'DM Sans',monospace}
.ticket__head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.2rem}
.ticket__head img{border-radius:50%;margin-bottom:.4rem;border:1px solid rgba(27,17,14,.1)}
.ticket__head b{font:800 1.5rem/1 var(--ff-display);font-variation-settings:'wdth' 75;letter-spacing:.06em}
.ticket__head small{opacity:.65;font-size:.78rem}
.ticket__sep{height:0;border-top:2px dashed rgba(27,17,14,.28);margin:1rem 0}
.ticket__meta div{display:flex;justify-content:space-between;gap:1rem;padding:.18rem 0;font-size:.9rem}
.ticket__meta div[hidden]{display:none}
.ticket__meta dt{opacity:.6}
.ticket__meta dd{font-weight:700;text-align:right}
.ticket__lines{display:flex;flex-direction:column;gap:.35rem;min-height:3rem;font-size:.9rem}
.ticket__lines li{display:flex;justify-content:space-between;gap:.8rem}
.ticket__lines li span:first-child{flex:1}
.ticket__lines li b{font-variant-numeric:tabular-nums}
.ticket__none{opacity:.5;font-style:italic}
.ticket__total{display:flex;justify-content:space-between;align-items:baseline;font:800 1.7rem/1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase}
.ticket__total b{color:var(--ember)}
.ticket__foot{margin-top:1rem;text-align:center;font-size:.78rem;opacity:.6;line-height:1.5}
.ticket__teeth{position:absolute;left:0;right:0;bottom:-12px;height:12px;background:linear-gradient(135deg,#fffdf7 6px,transparent 0) 0 0/12px 12px,linear-gradient(225deg,#fffdf7 6px,transparent 0) 0 0/12px 12px;transform:rotate(0)}
.bookdone{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;padding:clamp(1.5rem,3vw,2.6rem);border-radius:1.8rem;background:var(--sauce);box-shadow:0 20px 50px -34px rgba(27,17,14,.5),0 0 0 1px rgba(27,17,14,.06)}
.bookdone[hidden]{display:none}
.bookdone:focus{outline:0}
.bookdone__ico{width:4rem;height:4rem;border-radius:50%;display:grid;place-items:center;background:#1f9d55;color:#fff}
.bookdone__ico .ico{width:2rem;height:2rem}
.bookdone__recap{width:100%;padding:1rem 1.2rem;border-radius:1rem;background:rgba(27,17,14,.05);font-size:.98rem;line-height:1.7}
.bookdone__btns{display:flex;flex-wrap:wrap;gap:.7rem}

/* ---------- 11. NOUS TROUVER ---------- */
.find{background:var(--coal);color:var(--cream);padding:clamp(8rem,14vw,12rem) 0 clamp(5rem,9vw,8rem)}
.find .sec-head__p{color:var(--smoke)}
.find__grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(1.6rem,4vw,4rem);margin-top:clamp(2.4rem,5vw,4rem)}
.map{position:relative;min-height:30rem;border-radius:1.8rem;overflow:hidden;background:var(--char);box-shadow:0 0 0 1px rgba(245,233,214,.1),0 40px 80px -40px rgba(220,31,43,.4)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.25) contrast(1.05)}
.map__open{position:absolute;left:1rem;bottom:1rem;display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.2rem;border-radius:999px;background:var(--sauce);color:var(--ink);font-weight:700;font-size:.92rem;box-shadow:0 12px 30px rgba(0,0,0,.4);transition:background .3s,color .3s}
.map__open:hover{background:var(--ember);color:var(--sauce)}
.map__open .ico{color:var(--ember)}
.map__open:hover .ico{color:var(--sauce)}
.info{display:flex;flex-direction:column;gap:1.8rem}
.info__block h3{font:700 .78rem/1 var(--ff-text);letter-spacing:.2em;text-transform:uppercase;color:var(--flame);margin-bottom:.8rem;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.info__block address,.info__block p{font-size:1.25rem;line-height:1.45;margin-bottom:.4rem}
.social{display:flex;gap:.6rem;margin-top:.9rem}
.social a{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;border:1.5px solid rgba(245,233,214,.3);transition:background .3s,border-color .3s,transform .4s var(--ease)}
.social a:hover{background:var(--ember);border-color:var(--ember);transform:translateY(-4px) rotate(-6deg)}
.hstatus{padding:.4rem .7rem;border-radius:999px;font-size:.7rem;letter-spacing:.1em;background:rgba(245,233,214,.1);color:var(--cream)}
.hstatus.is-open{background:rgba(61,220,132,.16);color:#6ff0a8}
.hstatus.is-closed{background:rgba(220,31,43,.2);color:#ff8d95}
.hours li{display:flex;justify-content:space-between;gap:1rem;padding:.6rem .8rem;border-bottom:1px solid rgba(245,233,214,.1);font-size:1rem}
.hours li span:first-child{font-weight:700}
.hours li span:last-child{color:var(--smoke);text-align:right}
.hours li.is-today{background:var(--ember);border-radius:.7rem;border-bottom-color:transparent}
.hours li.is-today span:last-child{color:var(--sauce)}

/* ---------- 12. FOOTER ---------- */
.footer{background:var(--cream);color:var(--ink);padding-top:clamp(6rem,10vw,9rem);overflow:hidden}
.footer__top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem}
.footer__col{display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;font-size:1rem}
.footer__col img{border-radius:50%;background:#fff;margin-bottom:.5rem;box-shadow:0 10px 30px -10px rgba(27,17,14,.4)}
.footer__col p{max-width:20rem;opacity:.75}
.footer__col h4{font:700 .76rem/1 var(--ff-text);letter-spacing:.2em;text-transform:uppercase;color:var(--ember);margin:0 0 .6rem}
.footer__giant{display:flex;justify-content:center;gap:.14em;margin-top:clamp(2rem,5vw,4rem);font:800 clamp(5.4rem,23vw,28rem)/.8 var(--ff-display);font-variation-settings:'wdth' 75;text-transform:uppercase;white-space:nowrap;color:var(--ember);padding:0 var(--gutter);overflow:hidden;user-select:none}
.footer__giant > span:last-child{color:var(--ink)}
.footer__giant .word{display:inline-block;overflow:hidden;vertical-align:top}
.footer__giant .char{display:inline-block;will-change:transform}
.footer__bot{display:flex;justify-content:space-between;align-items:center;gap:1.4rem;padding-top:1.6rem;padding-bottom:calc(2rem + env(safe-area-inset-bottom));font-size:.86rem;opacity:.85}
.totop{flex:none;width:3.4rem;height:3.4rem;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--sauce);transition:background .3s,transform .5s var(--ease)}
.totop:hover{background:var(--ember);transform:translateY(-6px) rotate(-12deg)}
.totop .ico{width:1.7rem;height:1.7rem}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .card:nth-child(even){margin-top:0}
  .card:nth-child(2n){margin-top:2rem}
  .numbers__grid{grid-template-columns:repeat(2,1fr)}
  .num:nth-child(n){margin-top:0}
  .num:nth-child(3){border-left:0;padding-left:0}
  .num:nth-child(n+3){margin-top:2.4rem}
  .footer__top{grid-template-columns:1fr 1fr}
  .book__grid{grid-template-columns:minmax(0,1fr)}
  .ticketwrap{position:static;max-width:26rem;width:100%;margin:0 auto}
  .find__grid{grid-template-columns:1fr}
  .map{min-height:24rem}
}
@media (max-width:900px){
  .story__wrap{grid-template-columns:1fr;gap:1.2rem}
  .story__right{order:-1}
  .story__frame{aspect-ratio:16/10;max-height:34svh;margin:0}
  .story .h2{font-size:clamp(2.2rem,9.5vw,3.6rem)}
  .story__steps{min-height:11.5rem;margin-top:1.2rem}
  .step__n{font-size:5rem;top:-.4rem}
  .spitnav{margin-top:1rem}
  .story__tag{font-size:.9rem}
  .story__pin{align-items:flex-start;padding-top:calc(var(--nav-h) + .4rem)}
  .board__pin{min-height:auto;padding-bottom:3rem}
  .board__track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1.4rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .board__track::-webkit-scrollbar{display:none}
  .panel{scroll-snap-align:center;width:min(88vw,30rem);grid-template-columns:1fr;font-size:1rem}
  .panel__photo{aspect-ratio:16/9;transform:rotate(-1.5deg)}
  .panel__photo.tapeB{transform:rotate(1.5deg)}
  .panel--end{width:min(80vw,22rem)}
  .board__meta{display:none}
  .mosaic{column-count:2}
}
@media (max-width:700px){
  :root{--nav-h:4.2rem}
  .hero{padding-bottom:6.2rem}
  .hero__foot{position:relative;left:auto;right:auto;bottom:auto;margin:1.6rem auto 0;width:100%;max-width:92rem}
  .hero__scroll{display:none}
  .vidbtn{margin-left:auto}
  .hero__row{margin-top:1.6rem}
  .hero__cta .btn{flex:1 1 auto}
  .modes{grid-template-columns:1fr}
  .fields{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .card:nth-child(2n){margin-top:0}
  .card{flex-direction:row}
  .card__img{aspect-ratio:auto;width:42%;flex:none}
  .card h3{font-size:1.5rem}
  .card__foot strong{font-size:1.5rem}
  .footer__top{grid-template-columns:1fr 1fr}
  .footer__col:first-child{grid-column:1/-1}
  .numbers__grid{grid-template-columns:1fr 1fr}
  .num__l{font-size:.92rem}
  .rv__ctrl .u-link{width:100%}
  .callout__btns .btn{width:100%}
  .tile figcaption{transform:none;padding-top:1.8rem;font-size:.8rem}
  .footer__bot{padding-bottom:6.4rem}
}
@media (max-width:420px){
  .card{flex-direction:column}
  .card__img{width:100%;aspect-ratio:4/3}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .grain{display:none}
  .hl__in{transform:none!important}
}
html.reduced .step{position:relative;margin-bottom:1.5rem}

/* rideau de révélation (images) */
.curtain{position:absolute;inset:0;z-index:3;background:var(--ember);transform-origin:50% 0;will-change:transform;pointer-events:none}
html.reduced .shot:not(:first-child){display:none}

@media (min-width:1101px){.bookform,.bookdone{grid-column:1;grid-row:1}.ticketwrap{grid-column:2;grid-row:1}}

/* mode allégé (prefers-reduced-motion ou ?lite) : la carte se parcourt au doigt / à la molette horizontale */
html.reduced .board__pin{min-height:auto;padding-bottom:3rem}
html.reduced .board__track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1.4rem}
html.reduced .panel{scroll-snap-align:center}
html.reduced .board__prog{display:none}
html.reduced .story__pin{min-height:auto}
/* bouton contour sombre (écran de confirmation) */
.btn--outline{--bg:transparent;color:var(--ink);border-color:rgba(27,17,14,.3)}
.btn--outline::before{background:var(--ink)}
.btn--outline:hover,.btn--outline:focus-visible{color:var(--sauce);border-color:var(--ink)}
/* =====================================================================
   COMMANDE : choix des plats (fenêtre « Choisir », liste dans le formulaire)
   ===================================================================== */
.items li[data-id]{cursor:pointer}
.items li[data-id]:hover .it__name{color:var(--ember)}
.panel--alt .items li[data-id]:hover .it__name{color:var(--flame)}
.items li.is-config{padding-right:6.2em}
.it__add--pick{width:auto;height:2.4em;margin-top:-1.2em;padding:0 1.1em;border-radius:999px;font:700 .86em/1 var(--ff-text)}
.it__add--pick:hover{transform:scale(1.06)}
.add .ico{transition:transform .4s var(--ease)}
.add:hover .ico{transform:translateX(3px)}

.sheet{position:fixed;inset:0;z-index:2300;display:flex;align-items:center;justify-content:center;padding:1rem;visibility:hidden}
.sheet.is-open{visibility:visible}
.sheet__bg{position:absolute;inset:0;background:rgba(14,10,9,.72);opacity:0;transition:opacity .4s}
.sheet.is-open .sheet__bg{opacity:1}
.sheet__panel{position:relative;width:min(40rem,100%);max-height:min(90vh,56rem);display:flex;flex-direction:column;background:var(--sauce);color:var(--ink);border-radius:1.8rem;box-shadow:0 40px 100px rgba(0,0,0,.55);opacity:0;transform:translateY(34px) scale(.97);transition:transform .55s var(--ease),opacity .3s}
.sheet.is-open .sheet__panel{opacity:1;transform:none}
.sheet__x{position:absolute;right:1rem;top:1rem;width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;background:rgba(27,17,14,.08);transition:background .3s,color .3s;z-index:2}
.sheet__x:hover{background:var(--ember);color:var(--sauce)}
.sheet__head{padding:1.6rem 4.2rem 1rem 1.6rem}
.sheet__cat{font:700 .72rem/1 var(--ff-text);letter-spacing:.18em;text-transform:uppercase;color:var(--ember);margin-bottom:.5rem}
.sheet__head h3{font-size:clamp(2.2rem,5vw,3.2rem);color:var(--ink)}
.sheet__desc{margin-top:.5rem;font-size:.95rem;opacity:.7}
.sheet__body{flex:1;min-height:0;overflow:auto;padding:.4rem 1.6rem 1.2rem;overscroll-behavior:contain}
.og{margin:0 0 1.2rem}
.og legend{display:block;float:none;width:100%;padding:0;margin:0 0 .55rem;font:800 1.15rem/1.1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase}
.og legend em{display:block;font:500 .8rem/1.2 var(--ff-text);text-transform:none;font-style:normal;opacity:.6;margin-top:.15rem}
.og__opts{display:flex;flex-wrap:wrap;gap:.45rem}
.opt{position:relative;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt span{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem 1rem;border-radius:999px;border:2px solid rgba(27,17,14,.16);background:#fff;font-weight:600;font-size:.95rem;transition:background .25s,border-color .25s,color .25s,transform .35s var(--ease)}
.opt span small{opacity:.7;font-size:.8rem}
.opt:hover span{border-color:var(--ember);transform:translateY(-2px)}
.opt input:checked + span{background:var(--ink);border-color:var(--ink);color:var(--sauce)}
.opt input[type=checkbox]:checked + span::before{content:"✓";font-weight:800;color:var(--flame)}
.opt input:focus-visible + span{outline:3px solid var(--flame);outline-offset:2px}
.og__note{margin-top:.2rem}
.sheet__foot{padding:1rem 1.6rem 1.4rem;border-top:1px solid rgba(27,17,14,.1);background:#fffdf7;border-radius:0 0 1.8rem 1.8rem}
.sheet__hint{min-height:1.2rem;margin:0 0 .6rem;font-weight:700;font-size:.88rem;color:var(--ember)}
.sheet__row{display:flex;align-items:center;gap:1rem}
.sheet__row .btn{flex:1}
.sheet__row .btn:disabled{opacity:.45;cursor:not-allowed}
.sheet__row .btn:disabled::before{display:none}
.sheet__row .btn:disabled:hover{color:var(--sauce);border-color:var(--ember)}
@media (max-width:700px){
  .sheet{align-items:flex-end;padding:0}
  .sheet__panel{width:100%;max-height:92vh;max-height:92svh;border-radius:1.8rem 1.8rem 0 0;transform:translateY(100%);opacity:1}
  .sheet__foot{border-radius:0;padding-bottom:calc(1.2rem + env(safe-area-inset-bottom))}
  .items li.is-config{padding-right:0}
  .items li.is-config .it__add--pick{position:static;margin:.45em 0 0}
  .picker__list{max-height:20rem}
}

.cl{align-items:flex-start}
.cl__n{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.cl__n small{font-size:.84rem;opacity:.65;font-weight:500;line-height:1.35}
.cl__edit{align-self:flex-start;margin-top:.3rem;font:700 .8rem/1 var(--ff-text);color:var(--ember);text-decoration:underline;text-underline-offset:3px}
.picker{margin:1rem 0 1.1rem;padding:1rem;border-radius:1.2rem;background:rgba(27,17,14,.045)}
.picker__t{font:800 1.05rem/1 var(--ff-display);font-variation-settings:'wdth' 80;text-transform:uppercase;margin-bottom:.7rem;color:var(--ember)}
.picker__tabs{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:thin}
.picker__tabs button{flex:none;padding:.55rem .95rem;border-radius:999px;border:2px solid rgba(27,17,14,.16);background:#fff;font-weight:700;font-size:.88rem;transition:background .25s,border-color .25s,color .25s}
.picker__tabs button:hover{border-color:var(--ember)}
.picker__tabs button.is-on{background:var(--ink);border-color:var(--ink);color:var(--sauce)}
.picker__list{margin-top:.4rem;max-height:23rem;overflow:auto;overscroll-behavior:contain}
.qrow{display:flex;align-items:center;gap:.8rem;padding:.65rem .3rem;border-bottom:1px solid rgba(27,17,14,.09);cursor:pointer;transition:background .25s}
.qrow:hover{background:rgba(220,31,43,.05)}
.qrow__t{flex:1;min-width:0;display:flex;flex-direction:column}
.qn{font-weight:700}
.qrow__t small{font-size:.8rem;opacity:.6;line-height:1.3}
.qcount{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;padding:0 .35rem;margin-left:.3rem;border-radius:999px;background:var(--ember);color:var(--sauce);font:800 .75rem/1 var(--ff-text)}
.qcount[hidden]{display:none}
.qp{font:800 1rem/1 var(--ff-display);font-variation-settings:'wdth' 85;color:var(--ember);white-space:nowrap}
.qbtn{padding:.6rem 1rem;border-radius:999px;background:var(--ink);color:var(--sauce);font-weight:700;font-size:.85rem;transition:background .3s,scale .3s var(--ease)}
.qbtn:hover{background:var(--ember);scale:1.05}
.qbtn.is-done{background:#1f9d55}
.ticket__lines li span:first-child{display:flex;flex-direction:column}
.ticket__lines li small{font-size:.74rem;opacity:.6;line-height:1.3}