﻿/* ==========================================================================
   Le Comptoir de Marilou — Manosque
   Direction artistique : « trattoria de Provence » — le store à festons (fil rouge),
   l'arche des portes provençales, l'ardoise de la carte, la tomate et le basilic.
   Palette : lin chaud (fond), encre brune (texte), tomate (accent), olive, miel (survol), lavande.
   Typo : Fraunces (titres à fort caractère) + Figtree (texte).
   ========================================================================== */

:root{
  --lin:#F6ECDB;
  --craie:#FFF9EE;
  --encre:#2B1B14;
  --encre-2:#5A4538;
  --tomate:#C73B22;
  --tomate-2:#B8341C;
  --tomate-deep:#9F2C18;
  --olive:#5E7F34;
  --olive-deep:#3C5322;
  --miel:#E9A93B;
  --lavande:#8A78B8;
  --volet:#9FB8CF;
  --ardoise:#1E2420;
  --craie-ardoise:#F1EBDD;

  --f-display:'Fraunces', 'Iowan Old Style', Georgia, serif;
  --f-body:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --pad:clamp(20px,5vw,84px);
  --header-h:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-stopped{overflow:hidden}
body{
  margin:0;background:var(--lin);color:var(--encre);
  font:400 clamp(1rem,.96rem + .2vw,1.125rem)/1.6 var(--f-body);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
img,video,svg,iframe{display:block;max-width:100%}
img{height:auto}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,ul,ol,figure,blockquote,address,dl{margin:0;padding:0}
ul,ol{list-style:none}
address{font-style:normal}
:focus-visible{outline:3px solid var(--miel);outline-offset:3px;border-radius:6px}
::selection{background:var(--tomate);color:var(--craie)}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:2000;background:var(--encre);color:var(--craie);padding:.7em 1.1em;border-radius:10px;transition:top .2s}
.skip:focus{top:12px}
.wrap{width:100%;max-width:1480px;margin-inline:auto;padding-inline:var(--pad)}

/* Grain de papier kraft, statique (rien ne bouge → aucun coût) */
body::after{
  content:"";position:fixed;inset:0;z-index:998;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .12 0 0 0 0 .08 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Typo ---------- */
.h2{
  font:600 clamp(2.5rem,6.6vw,6.6rem)/.96 var(--f-display);letter-spacing:-.028em;
  font-variation-settings:'SOFT' 100,'WONK' 1;text-wrap:balance;
}
.h2--light{color:var(--craie)}
.h2--chalk{color:var(--craie-ardoise)}
.eyebrow{
  display:inline-flex;align-items:center;gap:.8em;margin-bottom:1.1rem;
  font:700 .76rem/1 var(--f-body);letter-spacing:.22em;text-transform:uppercase;color:var(--tomate-deep);
}
.eyebrow::before{content:"";width:36px;height:2px;background:currentColor;border-radius:2px}
.eyebrow--light{color:#F7D9A8}
.eyebrow--chalk{color:#F0C46A}

/* split text (mots / lettres masqués) */
.sp-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.1em .08em .16em;margin:-.1em -.08em -.16em}
.sp-i{display:inline-block;will-change:transform}
.js [data-split]{visibility:hidden}

/* ---------- Boutons & liens ---------- */
.btn{
  --bg:var(--tomate);--fg:var(--craie);--fill:var(--encre);--fill-fg:var(--craie);--bd:transparent;
  position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.7em;
  padding:1.05em 1.7em;border-radius:999px;background:var(--bg);color:var(--fg);border:1.5px solid var(--bd);
  font:700 .95rem/1 var(--f-body);letter-spacing:.01em;white-space:nowrap;
  transition:color .45s var(--ease),border-color .45s var(--ease);will-change:transform;
}
.btn::before{
  content:"";position:absolute;inset:-1px;z-index:-1;background:var(--fill);
  transform:translateY(102%);border-radius:50% 50% 0 0/100% 100% 0 0;
  transition:transform .6s var(--ease),border-radius .6s var(--ease);
}
.btn:hover,.btn:focus-visible{color:var(--fill-fg)}
.btn:hover::before,.btn:focus-visible::before{transform:translateY(0);border-radius:0}
.btn svg{width:1.15em;height:1.15em;flex:none;transition:transform .5s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn__label{position:relative}
.btn--sm{padding:.8em 1.3em;font-size:.86rem}
.btn--lg{padding:1.25em 2.1em;font-size:1.02rem}
.btn--block{width:100%}
.btn--ghost{--bg:transparent;--fg:var(--craie);--bd:rgba(255,249,238,.7);--fill:var(--craie);--fill-fg:var(--encre)}
.btn--ghost-light{--bg:transparent;--fg:var(--craie);--bd:rgba(255,249,238,.6);--fill:var(--craie);--fill-fg:var(--encre)}
.btn--ghost-dark{--bg:transparent;--fg:var(--encre);--bd:rgba(43,27,20,.35);--fill:var(--encre);--fill-fg:var(--craie)}
.btn--light{--bg:var(--craie);--fg:var(--encre);--fill:var(--tomate);--fill-fg:var(--craie)}

.link{
  background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:3px;font-weight:600;
  transition:background-size .5s var(--ease),background-position .5s var(--ease);
}
.link:hover{background-size:0 1.5px;background-position:100% 100%}
.link--light{color:var(--craie)}

.round{
  display:inline-grid;place-items:center;width:54px;height:54px;border-radius:50%;
  border:1.5px solid rgba(43,27,20,.3);background:transparent;transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease);
}
.round:hover{background:var(--encre);color:var(--craie)}
.round svg{width:22px;height:22px}
.round--sm{width:42px;height:42px;font-size:1.3rem;line-height:1}

/* ---------- Store à festons : le fil rouge ---------- */
.awning{
  position:absolute;left:0;right:0;height:36px;z-index:4;pointer-events:none;
  --a:var(--tomate);--b:var(--tomate-2);
  background:
    radial-gradient(circle at 13px 0,var(--a) 12.5px,transparent 13.5px) 0 23px/52px 13px repeat-x,
    radial-gradient(circle at 13px 0,var(--b) 12.5px,transparent 13.5px) 26px 23px/52px 13px repeat-x,
    repeating-linear-gradient(90deg,var(--a) 0 26px,var(--b) 26px 52px) 0 0/100% 23px no-repeat;
}
.awning--hero{bottom:-1px;transform:rotate(180deg)}
.awning--footer{top:0;--a:var(--tomate);--b:var(--craie)}
.scallop{position:absolute;left:0;right:0;top:0;height:26px;z-index:6;pointer-events:none;--sc:var(--lin)}
.scallop--down{background:radial-gradient(circle at 26px 0,var(--sc) 25.5px,transparent 26.5px) 0 0/52px 26px repeat-x}
.scallop--lin{--sc:var(--lin)}
.scallop--craie{--sc:var(--craie)}
.menu-board::before,.gallery::before,.reviews::before{
  content:"";position:absolute;left:0;right:0;top:0;height:26px;z-index:6;pointer-events:none;
  background:radial-gradient(circle at 26px 0,var(--sc) 25.5px,transparent 26.5px) 0 0/52px 26px repeat-x;
}
.menu-board{--sc:var(--tomate)}
.gallery{--sc:var(--ardoise)}
.reviews{--sc:var(--lin)}

/* ---------- Progression de lecture ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:900;pointer-events:none}
.progress span{display:block;height:100%;background:var(--miel);transform-origin:0 50%;transform:scaleX(0)}

/* ---------- Loader : le store se relève ---------- */
.loader{
  position:fixed;inset:0;z-index:1000;display:grid;place-items:center;color:var(--craie);text-align:center;
  background:repeating-linear-gradient(90deg,var(--tomate) 0 52px,var(--tomate-2) 52px 104px);will-change:transform;
}
.loader::after{
  content:"";position:absolute;left:0;right:0;top:100%;height:26px;
  background:
    radial-gradient(circle at 26px 0,var(--tomate) 25.5px,transparent 26.5px) 0 0/104px 26px repeat-x,
    radial-gradient(circle at 26px 0,var(--tomate-2) 25.5px,transparent 26.5px) 52px 0/104px 26px repeat-x;
}
.no-js .loader{display:none}
.loader__inner{display:grid;gap:1.1rem;justify-items:center;padding:24px}
.loader__tomato{width:70px;height:70px;animation:spin 6s linear infinite}
.loader__kicker{font:700 .74rem/1 var(--f-body);letter-spacing:.26em;text-transform:uppercase;opacity:.9}
.loader__title{font:700 clamp(2.6rem,9vw,7rem)/.9 var(--f-display);letter-spacing:-.03em;font-variation-settings:'SOFT' 100,'WONK' 1}
.loader__title span{display:block;overflow:hidden;padding:.06em .1em .14em}
.loader__title span i{display:inline-block;font-style:normal;will-change:transform}
.loader__title .l2{font-style:italic;font-weight:400}
.loader__count{font:600 1.2rem/1 var(--f-display);font-variant-numeric:tabular-nums;opacity:.9}
.loader__count i{font-style:normal;margin-left:.1em}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- Header ---------- */
.header{
  position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:18px var(--pad);color:var(--craie);
  transition:transform .6s var(--ease),background-color .4s,color .4s,box-shadow .4s,padding .4s var(--ease);
}
.header.is-solid{background:rgba(246,236,219,.92);color:var(--encre);box-shadow:0 1px 0 rgba(43,27,20,.1);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding-block:12px}
.header.is-hidden{transform:translateY(-110%)}
.header.is-menu-open,.header.is-menu-open.is-solid{background:transparent;color:var(--craie);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.brand{display:inline-flex;align-items:center;gap:.7rem;font:700 1.15rem/1 var(--f-display);letter-spacing:-.01em}
.brand__mark{width:38px;height:38px;flex:none;transition:transform .8s var(--ease)}
.brand:hover .brand__mark{transform:rotate(200deg)}
.brand__name em{font-weight:400;font-style:italic}
.nav{display:flex;gap:clamp(14px,2.2vw,34px);font-weight:600;font-size:.92rem}
.nav a{position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:currentColor;transform:scaleX(0);transform-origin:100% 50%;transition:transform .5s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:0 50%}
.header__cta{display:flex;align-items:center;gap:16px}
.header__tel{display:inline-flex;align-items:center;gap:.5em;font-weight:700;font-size:.92rem}
.header__tel svg{width:18px;height:18px}
.burger{display:none;width:46px;height:46px;border-radius:50%;border:1.5px solid currentColor;position:relative;z-index:120}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:currentColor;border-radius:2px;transition:transform .5s var(--ease),top .5s var(--ease)}
.burger span:first-child{top:18px}.burger span:last-child{top:25px}
.burger[aria-expanded="true"]{color:var(--craie)}
.burger[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}

.menu{
  position:fixed;inset:0;z-index:90;background:var(--tomate);color:var(--craie);display:flex;flex-direction:column;justify-content:center;
  padding:100px var(--pad) 40px;clip-path:circle(0 at calc(100% - 44px) 44px);visibility:hidden;
  transition:clip-path .9s var(--ease),visibility 0s .9s;
  background-image:repeating-linear-gradient(90deg,transparent 0 52px,rgba(0,0,0,.06) 52px 104px);
}
.menu.is-open{clip-path:circle(150% at calc(100% - 44px) 44px);visibility:visible;transition:clip-path .9s var(--ease),visibility 0s}
.menu__nav a{
  display:flex;align-items:baseline;gap:1rem;font:600 clamp(2.3rem,11vw,4.6rem)/1.12 var(--f-display);letter-spacing:-.02em;
  opacity:0;transform:translateY(34px);transition:opacity .6s var(--ease),transform .8s var(--ease);
}
.menu__nav a span{font:700 .8rem var(--f-body);letter-spacing:.16em;opacity:.7}
.menu.is-open .menu__nav a{opacity:1;transform:none}
.menu.is-open .menu__nav a:nth-child(1){transition-delay:.25s}.menu.is-open .menu__nav a:nth-child(2){transition-delay:.3s}
.menu.is-open .menu__nav a:nth-child(3){transition-delay:.35s}.menu.is-open .menu__nav a:nth-child(4){transition-delay:.4s}
.menu.is-open .menu__nav a:nth-child(5){transition-delay:.45s}.menu.is-open .menu__nav a:nth-child(6){transition-delay:.5s}
.menu.is-open .menu__nav a:nth-child(7){transition-delay:.55s}
.menu__foot{margin-top:2.2rem;display:grid;gap:.3rem;font-weight:600}

/* ---------- 1. Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;color:var(--craie);background:var(--encre)}
.hero__media{position:absolute;inset:-9% 0;will-change:transform}
.hero__video{width:100%;height:100%;object-fit:cover}
.hero__shade{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(43,27,20,.62) 0%,rgba(43,27,20,.30) 34%,rgba(43,27,20,.62) 72%,rgba(43,27,20,.86) 100%),
    radial-gradient(ellipse at 20% 80%,rgba(199,59,34,.28),transparent 60%);
}
.hero__layer{position:absolute;inset:0;pointer-events:none}
.hero__layer--mid{z-index:2}
.hero__layer--front{z-index:5}
.deco{position:absolute;will-change:transform;filter:drop-shadow(0 18px 24px rgba(0,0,0,.28))}
.deco--olive{width:clamp(200px,27vw,430px);height:clamp(100px,13.5vw,215px);right:-2%;top:15%;transform:rotate(8deg)}
.deco--lemon{width:clamp(60px,7vw,110px);height:clamp(60px,7vw,110px);left:41%;top:23%}
.deco--garlic{width:clamp(56px,6vw,96px);height:clamp(56px,6vw,96px);right:20%;bottom:30%}
.deco--basil-l{width:clamp(130px,17vw,270px);height:clamp(130px,17vw,270px);left:-3%;bottom:-3%;filter:blur(2px) drop-shadow(0 18px 24px rgba(0,0,0,.35));transform:rotate(-24deg)}
.deco--tomato-r{width:clamp(150px,19vw,300px);height:clamp(150px,19vw,300px);right:-4%;bottom:-5%;filter:blur(3px) drop-shadow(0 18px 24px rgba(0,0,0,.35))}
.deco--lav{width:clamp(50px,6vw,92px);height:clamp(120px,14vw,215px);right:15%;top:-3%;filter:blur(1.5px);transform:rotate(14deg)}

.hero__content{position:relative;z-index:4;width:100%;padding:calc(var(--header-h) + 40px) var(--pad) clamp(96px,15vh,160px)}
.hero__eyebrow{display:inline-flex;align-items:center;gap:.7em;margin-bottom:1.2rem;padding:.55em 1.1em;border-radius:999px;background:rgba(255,249,238,.14);border:1px solid rgba(255,249,238,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:700 .74rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase}
.hero__eyebrow .dot{width:9px;height:9px;border-radius:50%;background:var(--miel);box-shadow:0 0 0 0 rgba(233,169,59,.6);animation:pulse 2.2s infinite}
.hero__eyebrow.is-open .dot{background:#8FD36B;animation-name:pulse-g}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(233,169,59,0)}100%{box-shadow:0 0 0 0 rgba(233,169,59,0)}}
@keyframes pulse-g{0%{box-shadow:0 0 0 0 rgba(143,211,107,.6)}70%{box-shadow:0 0 0 10px rgba(143,211,107,0)}100%{box-shadow:0 0 0 0 rgba(143,211,107,0)}}
.hero__title{font-family:var(--f-display);font-variation-settings:'SOFT' 100,'WONK' 1;text-shadow:0 6px 40px rgba(0,0,0,.35)}
.hero__title .line{display:block}
.hero__title .line--small{font-size:clamp(1.8rem,4.6vw,4.4rem);font-weight:400;font-style:italic;letter-spacing:-.01em;margin-bottom:.05em}
.hero__title .line--big{font-size:clamp(4.2rem,16.2vw,17rem);font-weight:700;line-height:.82;letter-spacing:-.045em}
.hero__lead{max-width:34ch;margin-top:clamp(18px,3vh,32px);font-size:clamp(1.05rem,1.5vw,1.35rem);line-height:1.5;text-wrap:balance}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(22px,3.5vh,38px)}
.hero__badge{
  position:absolute;z-index:6;right:clamp(20px,5vw,84px);bottom:clamp(70px,12vh,120px);width:clamp(110px,12vw,168px);aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;background:var(--craie);color:var(--encre);box-shadow:0 20px 50px rgba(0,0,0,.35);transition:transform .6s var(--ease);
}
.hero__badge:hover{scale:1.08;rotate:-6deg}
.hero__badge{transition:scale .6s var(--ease),rotate .6s var(--ease)}
.hero__badge-ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 18s linear infinite}
.hero__badge-ring text{font:700 15px var(--f-body);text-transform:uppercase;fill:var(--tomate-deep)}
.hero__badge-num{font:700 clamp(2rem,3.4vw,3rem)/1 var(--f-display);letter-spacing:-.03em}
.hero__scroll{position:absolute;z-index:6;left:var(--pad);bottom:56px;display:flex;align-items:center;gap:12px;font:700 .7rem var(--f-body);letter-spacing:.22em;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg);transform-origin:center}
.hero__scroll i{width:1.5px;height:56px;background:rgba(255,249,238,.35);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;inset:0;background:var(--craie);animation:drip 2.2s var(--ease-io) infinite}
@keyframes drip{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ---------- 2. Marquee ---------- */
.marquee{position:relative;background:var(--tomate);color:var(--craie);padding:clamp(36px,6vw,80px) 0 clamp(46px,7vw,90px);overflow:hidden}
.marquee__row{display:flex;white-space:nowrap;will-change:transform}
.marquee__row+.marquee__row{margin-top:clamp(6px,1.4vw,18px)}
.marquee__track{display:flex;align-items:center;gap:clamp(18px,3vw,48px);padding-right:clamp(18px,3vw,48px);flex:none}
.marquee__track span{font:400 clamp(2.6rem,8vw,8.4rem)/1.05 var(--f-display);font-style:italic;font-variation-settings:'SOFT' 100,'WONK' 1;letter-spacing:-.03em}
.marquee__track svg{width:clamp(44px,6.4vw,100px);height:clamp(44px,6.4vw,100px);flex:none}
.marquee__row--alt .marquee__track span{font-style:normal;font-weight:800;color:transparent;-webkit-text-stroke:1.5px var(--craie);text-transform:uppercase;font-size:clamp(2.2rem,6.4vw,6.8rem);letter-spacing:-.01em}

/* ---------- 3. Histoire (pinnée) ---------- */
.story{position:relative;background:var(--lin);overflow:hidden}
.story__stage{
  position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center;gap:clamp(24px,5vw,90px);
  padding:clamp(84px,12vh,130px) var(--pad) clamp(40px,7vh,80px);max-width:1580px;margin-inline:auto;
}
.story__title{font-size:clamp(2.2rem,4.6vw,4.6rem);margin-bottom:clamp(20px,4vh,44px)}
.story__steps{display:grid;position:relative;min-height:clamp(200px,32vh,300px)}
.story__step{grid-area:1/1;max-width:50ch}
.js .story__step{opacity:0;visibility:hidden}
.js .story__step:first-child{opacity:1;visibility:visible}
.story__num{display:block;font:700 .8rem var(--f-body);letter-spacing:.2em;color:var(--tomate-deep);margin-bottom:.7rem}
.story__step h3{font:600 clamp(1.7rem,3vw,2.9rem)/1.05 var(--f-display);letter-spacing:-.02em;font-variation-settings:'SOFT' 100,'WONK' 1;margin-bottom:.8rem}
.story__step p{font-size:clamp(1rem,1.18vw,1.16rem);color:var(--encre-2)}
.story__dots{display:flex;gap:10px;margin-top:clamp(18px,3vh,32px)}
.story__dots i{width:44px;height:4px;border-radius:4px;background:rgba(43,27,20,.16);position:relative;overflow:hidden}
.story__dots i::after{content:"";position:absolute;inset:0;background:var(--tomate);transform:scaleX(0);transform-origin:0 50%}
.story__dots i.is-on::after{transform:scaleX(1)}
.story__right{position:relative;display:grid;place-items:center}
.story__arch{
  position:relative;width:min(100%,31vw,500px);aspect-ratio:3/4;overflow:hidden;background:var(--encre);
  border-radius:999px 999px 30px 30px;box-shadow:0 40px 80px -30px rgba(43,27,20,.55);
}
.story__img{position:absolute;inset:0}
.story__img img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.story__deco{position:absolute;pointer-events:none;filter:drop-shadow(0 14px 18px rgba(43,27,20,.25))}
.story__deco--a{width:clamp(90px,10vw,170px);height:clamp(90px,10vw,170px);left:2%;bottom:6%;transform:rotate(-30deg)}
.story__deco--b{width:clamp(44px,5vw,80px);height:clamp(110px,12vw,190px);right:3%;top:2%;transform:rotate(12deg)}
.story__caption{position:absolute;right:4%;bottom:2%;font:600 1rem var(--f-display);color:var(--encre-2)}
.story__counter{font-size:clamp(3rem,6vw,5.4rem);font-weight:700;color:var(--tomate);letter-spacing:-.04em;margin-right:.1em;font-variant-numeric:tabular-nums}
.no-js .story__step,.story.is-static .story__step{grid-area:auto;margin-bottom:1.8rem;opacity:1;visibility:visible}
.story.is-static .story__stage{align-items:start}
.story.is-static .story__dots,.story.is-static .story__caption,.story.is-static .story__deco{display:none}
.story.is-static .story__arch{width:100%;aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;border-radius:0;background:none;box-shadow:none;overflow:visible}
.story.is-static .story__img{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:999px 999px 18px 18px}
.hscroll.is-static .hscroll__track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:30px}
.hscroll.is-static .card{scroll-snap-align:center}

/* ---------- 4. Services : panneaux accordéon ---------- */
.services{position:relative;background:var(--olive-deep);color:var(--craie);padding:clamp(100px,14vw,170px) 0 0;--sc:var(--lin)}
.services__title{max-width:14ch;margin-bottom:clamp(36px,6vw,70px)}
.panels{display:flex;height:min(80vh,740px);min-height:520px}
.panel{position:relative;flex:1 1 0;min-width:0;overflow:hidden;cursor:pointer;transition:flex .9s var(--ease);outline-offset:-4px;border-right:1px solid rgba(255,249,238,.18)}
.panel.is-open{flex:3.6 1 0}
.panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.15);transition:transform 1.4s var(--ease),filter .8s}
.panel.is-open img{transform:scale(1)}
.panel:not(.is-open) img{filter:saturate(.7) brightness(.82)}
.panel__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,22,14,.1) 30%,rgba(30,22,14,.88))}
.panel__body{position:absolute;left:clamp(16px,2vw,32px);right:clamp(16px,2vw,32px);bottom:clamp(20px,3vw,40px)}
.panel__n{display:block;font:700 .78rem var(--f-body);letter-spacing:.2em;color:#F7D9A8;margin-bottom:.6rem}
.panel h3{font:600 clamp(1.4rem,2.3vw,2.4rem)/1.05 var(--f-display);letter-spacing:-.02em;font-variation-settings:'SOFT' 100,'WONK' 1}
.panel p,.panel .link{display:block;max-height:0;opacity:0;overflow:hidden;transform:translateY(14px);transition:max-height .8s var(--ease),opacity .5s var(--ease),transform .8s var(--ease),margin .8s var(--ease)}
.panel p{max-width:38ch;font-size:1rem;line-height:1.5}
.panel .link{width:max-content}
.panel.is-open p{max-height:200px;opacity:1;transform:none;margin-top:.9rem;transition-delay:.15s}
.panel.is-open .link{max-height:40px;opacity:1;transform:none;margin-top:1.1rem;transition-delay:.25s}

/* ---------- 5. L'ardoise : défilement horizontal ---------- */
.hscroll{position:relative;background:var(--lin);overflow:hidden}
.hscroll__pin{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:clamp(80px,11vh,120px) 0 clamp(24px,4vh,48px)}
.hscroll__head{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:clamp(20px,4vh,44px)}
.hscroll__head .h2{font-size:clamp(2.2rem,5vw,5rem)}
.hscroll__hint{display:inline-flex;align-items:center;gap:.6em;font:700 .76rem var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:var(--encre-2);white-space:nowrap}
.hscroll__hint svg{width:1.5em;height:1.5em;animation:nudge 1.6s var(--ease) infinite}
@keyframes nudge{50%{transform:translateX(8px)}}
.hscroll__track{display:flex;gap:clamp(16px,2vw,30px);padding:36px var(--pad) 24px;width:max-content;will-change:transform}
.card{
  position:relative;flex:0 0 clamp(270px,26vw,390px);height:clamp(430px,62vh,560px);display:flex;flex-direction:column;border-radius:24px;background:var(--craie);
  box-shadow:0 30px 60px -34px rgba(43,27,20,.5),0 0 0 1px rgba(43,27,20,.06);transform-style:preserve-3d;will-change:transform;
}
.card__img{position:relative;height:50%;overflow:hidden;border-radius:24px 24px 0 0}
.card__img img{position:absolute;left:-10%;top:0;width:120%;height:100%;max-width:none;object-fit:cover}
.card__body{position:relative;flex:1;padding:26px 24px 24px;display:flex;flex-direction:column;gap:.5rem}
.card__tag{font:700 .68rem var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:var(--olive)}
.card h3{font:600 clamp(1.3rem,1.8vw,1.7rem)/1.08 var(--f-display);letter-spacing:-.015em;font-variation-settings:'SOFT' 100,'WONK' 1}
.card p{font-size:.95rem;line-height:1.5;color:var(--encre-2)}
.card__price{
  position:absolute;right:20px;top:-36px;display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--tomate);color:var(--craie);
  font:700 1.2rem/1 var(--f-display);transform:rotate(9deg) translateZ(40px);box-shadow:0 10px 24px rgba(199,59,34,.4);
}
.card__glare{position:absolute;inset:0;border-radius:24px;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.42),transparent 48%)}
.card:hover .card__glare{opacity:1}
.card--end{background:var(--tomate);color:var(--craie);justify-content:center;flex-basis:clamp(250px,24vw,340px)}
.card__end{padding:30px;display:grid;gap:1rem;justify-items:start}
.card__end svg{width:84px;height:84px}
.card__end h3{font-size:clamp(1.8rem,2.6vw,2.5rem)}
.card__end p{color:rgba(255,249,238,.9)}
.card__end .btn{--bg:var(--craie);--fg:var(--encre);--fill:var(--encre);--fill-fg:var(--craie)}
.hscroll__note{margin-top:6px;font-size:.84rem;color:var(--encre-2)}

/* ---------- 6. Chiffres ---------- */
.stats{position:relative;background:var(--tomate);color:var(--craie);padding:clamp(110px,14vw,180px) 0 clamp(90px,11vw,140px);overflow:hidden;--sc:var(--lin)}
.stats::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 52px,rgba(0,0,0,.05) 52px 104px);pointer-events:none}
.stats__grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,48px)}
.stat{display:grid;gap:.8rem;padding-top:1.4rem;border-top:2px dashed rgba(255,249,238,.45)}
.stat__num{font:700 clamp(3.6rem,9.5vw,9.6rem)/.9 var(--f-display);letter-spacing:-.05em;font-variant-numeric:tabular-nums;font-variation-settings:'SOFT' 100,'WONK' 1}
.stat__num i{font-size:.36em;font-style:italic;font-weight:400;letter-spacing:0;margin-left:.08em}
.stat__label{font-weight:600;max-width:20ch;line-height:1.35}
.stats__deco{position:absolute;pointer-events:none;opacity:.95;filter:drop-shadow(0 20px 30px rgba(0,0,0,.25))}
.stats__deco--l{width:clamp(120px,16vw,250px);height:clamp(120px,16vw,250px);left:-3%;bottom:-6%;transform:rotate(-20deg)}
.stats__deco--r{width:clamp(100px,13vw,200px);height:clamp(100px,13vw,200px);right:-2%;top:8%}

/* ---------- 7. La carte (ardoise) ---------- */
.menu-board{position:relative;background:var(--ardoise);color:var(--craie-ardoise);padding:clamp(110px,13vw,170px) 0 clamp(90px,11vw,140px);overflow:hidden}
.menu-board::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 10%,rgba(255,255,255,.06),transparent 55%),radial-gradient(ellipse at 90% 80%,rgba(233,169,59,.07),transparent 50%)}
.menu-board__wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(30px,5vw,90px);align-items:start}
.menu-board__intro{position:sticky;top:110px}
.menu-board__lead{margin-top:1.4rem;max-width:40ch;color:rgba(241,235,221,.78)}
.tabs{display:grid;margin-top:clamp(22px,4vh,40px);border-top:1px solid rgba(241,235,221,.2)}
.tabs button{
  display:flex;align-items:baseline;gap:1rem;padding:.7rem 0;border-bottom:1px solid rgba(241,235,221,.2);text-align:left;color:rgba(241,235,221,.62);
  font:italic 400 clamp(1.5rem,2.5vw,2.3rem)/1.1 var(--f-display);letter-spacing:-.01em;font-variation-settings:'SOFT' 100,'WONK' 1;
  transition:color .4s var(--ease),padding-left .5s var(--ease);
}
.tabs button span{font:700 .72rem var(--f-body);letter-spacing:.16em;font-style:normal;color:#F0C46A;min-width:2em}
.tabs button:hover{color:var(--craie-ardoise);padding-left:.5rem}
.tabs button[aria-selected="true"]{color:var(--craie);padding-left:1rem;position:relative}
.tabs button[aria-selected="true"]::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:50%;background:var(--tomate);transform:translateY(-50%)}
.menu-board__deco{position:absolute;right:-30px;bottom:-60px;width:clamp(180px,22vw,320px);height:clamp(90px,11vw,160px);opacity:.5;display:none}
.board__frame{
  position:relative;border:clamp(10px,1.2vw,16px) solid #8B6A45;border-radius:14px;padding:clamp(22px,3.4vw,52px);min-height:620px;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.7),inset 0 0 90px rgba(0,0,0,.55),0 0 0 2px #5E4529;
  background:
    radial-gradient(ellipse at 25% 15%,rgba(255,255,255,.09),transparent 55%),
    radial-gradient(ellipse at 85% 85%,rgba(255,255,255,.05),transparent 55%),
    linear-gradient(160deg,#2A332D,#222A25);
}
.board__panel[hidden]{display:none}
.board__title{font:600 clamp(1.8rem,3vw,2.9rem)/1.05 var(--f-display);letter-spacing:-.02em;color:#F0C46A;font-variation-settings:'SOFT' 100,'WONK' 1;margin-bottom:1.4rem}
.board__title small{display:block;font:italic 400 .42em var(--f-display);color:rgba(241,235,221,.7);letter-spacing:0;margin-top:.5rem}
.board__note{font-size:.92rem;color:rgba(241,235,221,.7);margin-bottom:1.4rem;max-width:60ch}
.mlist{display:grid;gap:1.1rem}
.mlist--tight{gap:.8rem}
.mrow{display:flex;align-items:baseline;gap:.4rem}
.mname{font:600 clamp(1.02rem,1.3vw,1.2rem)/1.25 var(--f-display);letter-spacing:-.005em;color:var(--craie)}
.mdots{flex:1;min-width:20px;border-bottom:2px dotted rgba(241,235,221,.35);transform:translateY(-.3em)}
.mprice{font:700 1.05rem var(--f-display);color:#F0C46A;white-space:nowrap}
.mlist p{margin-top:.2rem;font-size:.9rem;line-height:1.45;color:rgba(241,235,221,.7);max-width:62ch}
.flavors{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1.8rem;padding-top:1.4rem;border-top:1px dashed rgba(241,235,221,.3)}
.flavors h4,.cols h4{font:italic 600 1.2rem var(--f-display);color:#F0C46A;margin-bottom:.5rem}
.flavors p{font-size:.92rem;color:rgba(241,235,221,.82)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,44px)}
.cols h4{margin:1.4rem 0 .8rem}.cols>div>h4:first-child{margin-top:0}
.board__panel .board__note:last-child{margin:1.6rem 0 0;font-size:.8rem}

/* ---------- 8. Galerie ---------- */
.gallery{position:relative;background:var(--lin);padding:clamp(110px,13vw,170px) 0 clamp(70px,9vw,120px);overflow:hidden}
.gallery__head{margin-bottom:clamp(34px,6vw,76px)}
.gallery__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(48px,6.2vw,104px);gap:clamp(10px,1.5vw,22px);padding:0 var(--pad);max-width:1580px;margin-inline:auto}
.g{position:relative;overflow:hidden;border-radius:22px;background:var(--encre);transform-style:preserve-3d;will-change:transform}
.g img{position:absolute;inset:-8%;width:116%;height:116%;max-width:none;object-fit:cover;transition:scale 1.2s var(--ease)}
.g:hover img{scale:1.06}
.g figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:48px 20px 18px;color:var(--craie);font:italic 500 1.1rem var(--f-display);
  background:linear-gradient(180deg,transparent,rgba(43,27,20,.82));transform:translateY(101%);transition:transform .7s var(--ease);
}
.g:hover figcaption,.g:focus-within figcaption{transform:none}
.g1{grid-column:1/8;grid-row:1/6;border-radius:999px 999px 22px 22px / 260px 260px 22px 22px}
.g2{grid-column:8/13;grid-row:2/6}
.g3{grid-column:1/5;grid-row:6/11}
.g4{grid-column:5/9;grid-row:6/9}
.g5{grid-column:9/13;grid-row:6/10}
.g6{grid-column:5/9;grid-row:9/13}
.g7{grid-column:9/13;grid-row:10/13}
.g8{grid-column:1/5;grid-row:11/16}
.g9{grid-column:5/13;grid-row:13/17}
.kenburns img{animation:kb 22s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1) translate(0,0)}to{transform:scale(1.12) translate(-2%,-2%)}}
.gallery__note{margin-top:22px;font-size:.84rem;color:var(--encre-2)}

/* ---------- 9. Avis ---------- */
.reviews{position:relative;background:var(--craie);padding:clamp(110px,13vw,170px) 0 clamp(80px,10vw,130px);overflow:hidden}
.reviews__top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(28px,5vw,80px);align-items:end;margin-bottom:clamp(36px,6vw,70px)}
.rating{display:grid;gap:.5rem;justify-items:start}
.rating__big{display:flex;align-items:baseline;gap:.2em;font-family:var(--f-display)}
.rating__big b{font-size:clamp(4.4rem,9vw,8rem);line-height:.9;letter-spacing:-.05em;font-weight:700;color:var(--tomate)}
.rating__big span{font-size:1.6rem;font-style:italic}
.rating__stars{display:flex;gap:3px;color:var(--miel)}
.rating__stars svg{width:24px;height:24px}
.rating>p{font-weight:600}
.rating__bars{display:grid;gap:7px;width:100%;margin-top:.7rem}
.rating__bars li{display:grid;grid-template-columns:1.1em 1fr 2.6em;align-items:center;gap:10px;font-size:.84rem;font-weight:600}
.rating__bars i{height:8px;border-radius:99px;background:rgba(43,27,20,.1);overflow:hidden;display:block}
.rating__bars i::after{content:"";display:block;height:100%;width:var(--w);background:var(--miel);border-radius:99px;transform-origin:0 50%;transform:scaleX(var(--s,1))}
.rating__bars em{font-style:normal;color:var(--encre-2);text-align:right}
.carousel__track{
  display:flex;gap:clamp(14px,2vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;padding:12px var(--pad) 28px;scrollbar-width:none;cursor:grab;-webkit-overflow-scrolling:touch;
}
.carousel__track::-webkit-scrollbar{display:none}
.carousel__track.is-drag{cursor:grabbing;scroll-snap-type:none}
.rv{
  flex:0 0 clamp(280px,30vw,430px);scroll-snap-align:start;min-height:330px;padding:clamp(24px,2.6vw,36px);border-radius:28px;background:#fff;
  border:1px solid rgba(43,27,20,.1);display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem;box-shadow:0 24px 50px -36px rgba(43,27,20,.5);
  transition:translate .6s var(--ease),rotate .6s var(--ease);
}
.rv:hover{translate:0 -6px;rotate:-.6deg}
.rv__stars{display:flex;gap:3px;color:var(--miel)}
.rv__stars svg{width:20px;height:20px}
.rv blockquote{font:500 clamp(1.4rem,2vw,1.9rem)/1.25 var(--f-display);letter-spacing:-.012em;font-variation-settings:'SOFT' 100,'WONK' 1;text-wrap:balance}
.rv figcaption{display:grid;gap:.15rem}
.rv figcaption b{font-weight:700}
.rv figcaption span{font-size:.84rem;color:var(--encre-2)}
.rv--tomato{background:var(--tomate);color:var(--craie);border-color:transparent}
.rv--tomato figcaption span{color:rgba(255,249,238,.85)}
.rv--olive{background:var(--olive-deep);color:var(--craie);border-color:transparent}
.rv--olive figcaption span{color:rgba(255,249,238,.8)}
.rv__tags{display:flex;flex-wrap:wrap;gap:8px}
.rv__tags span{padding:.5em 1em;border-radius:99px;border:1.5px solid rgba(255,249,238,.5);font-weight:700;font-size:.9rem}
.rv__tags em{font-style:normal;color:#F7D9A8;margin-left:.3em}
.rv--cta{background:transparent;border:2px dashed rgba(43,27,20,.3);box-shadow:none;align-items:flex-start;justify-content:center;position:relative}
.rv--cta blockquote{max-width:14ch}
.rv__deco{position:absolute;right:20px;top:18px;width:54px;height:130px;opacity:.9}
.carousel__ctrl{display:flex;align-items:center;gap:18px;padding:0 var(--pad);margin-top:6px}
.carousel__bar{flex:1;height:3px;background:rgba(43,27,20,.12);border-radius:3px;overflow:hidden}
.carousel__bar i{display:block;height:100%;background:var(--tomate);transform-origin:0 50%;transform:scaleX(.2)}

/* ---------- 10. Réservation ---------- */
.reserve{position:relative;color:var(--craie);padding:clamp(120px,14vw,180px) 0 clamp(80px,10vw,130px);background:var(--encre);overflow:hidden}
.reserve__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reserve__shade{position:absolute;inset:0;background:linear-gradient(110deg,rgba(43,27,20,.93) 0%,rgba(43,27,20,.78) 45%,rgba(43,27,20,.55) 100%)}
.reserve__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,90px);align-items:start}
.reserve__text{position:sticky;top:110px}
.reserve__text .h2{font-size:clamp(2.4rem,5.6vw,5.6rem)}
.reserve__lead{margin-top:1.4rem;max-width:44ch;font-size:1.1rem;color:rgba(255,249,238,.9)}
.reserve__how{display:grid;gap:.8rem;margin-top:1.8rem}
.reserve__how li{display:flex;align-items:center;gap:1rem;font-weight:600}
.reserve__how b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--miel);color:var(--encre);font:700 .95rem var(--f-display);flex:none}
.reserve__call{display:flex;align-items:center;flex-wrap:wrap;gap:14px 20px;margin-top:2rem}
.reserve__small{font-size:.9rem;color:rgba(255,249,238,.8)}

.book{position:relative;background:var(--craie);color:var(--encre);border-radius:30px;padding:clamp(22px,2.8vw,40px);box-shadow:0 50px 100px -30px rgba(0,0,0,.6)}
.book::before{content:"";position:absolute;left:24px;right:24px;top:-12px;height:24px;border-radius:14px 14px 0 0;background:repeating-linear-gradient(90deg,var(--tomate) 0 26px,var(--craie) 26px 52px);z-index:-1}
.book__title{font:600 clamp(1.4rem,2vw,1.8rem)/1.1 var(--f-display);letter-spacing:-.015em;font-variation-settings:'SOFT' 100,'WONK' 1}
.book__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:1.1rem 0 1.5rem}
.book__steps li{font:700 .68rem var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:rgba(43,27,20,.5);padding-top:.7rem;border-top:3px solid rgba(43,27,20,.12);transition:color .4s,border-color .4s}
.book__steps li.is-on{color:var(--tomate-deep);border-color:var(--tomate)}
.book__panels{position:relative;min-height:380px}
.bp{border:0;padding:0;margin:0;min-width:0;display:none}
.bp.is-on{display:block}
.bp__label{display:block;font:700 .76rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--encre-2);margin-bottom:.7rem}
.bp__hint{margin-top:1rem;font-size:.88rem;color:var(--encre-2)}
.bp__row{display:grid;grid-template-columns:1fr 1.4fr;gap:1.4rem;margin-top:1.6rem}
.bp__error{margin-top:.8rem;padding:.7em 1em;border-radius:12px;background:#FBE3DC;color:var(--tomate-deep);font-weight:600;font-size:.92rem}
.cal__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.cal__head strong{font:600 1.25rem var(--f-display);text-transform:capitalize}
.cal__dow,.cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal__dow{margin-bottom:4px;font:700 .68rem var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--encre-2);text-align:center}
.cal__grid button,.cal__grid span{aspect-ratio:1;display:grid;place-items:center;border-radius:50%;font-weight:600;font-size:.98rem}
.cal__grid button{transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.cal__grid button:hover:not(:disabled){background:rgba(199,59,34,.12);transform:scale(1.08)}
.cal__grid button:disabled{opacity:.28;cursor:not-allowed;text-decoration:line-through}
.cal__grid button.is-today{box-shadow:inset 0 0 0 2px var(--miel)}
.cal__grid button[aria-pressed="true"]{background:var(--tomate);color:var(--craie);transform:scale(1.06)}
.slots{display:grid;gap:1.1rem}
.slot-group h4{font:italic 600 1.05rem var(--f-display);margin-bottom:.5rem}
.slot-group h4 small{font:500 .82rem var(--f-body);font-style:normal;color:var(--encre-2);margin-left:.5em}
.slot-group div{display:flex;flex-wrap:wrap;gap:8px}
.slot{padding:.65em 1.05em;border-radius:99px;border:1.5px solid rgba(43,27,20,.22);font-weight:700;font-size:.92rem;transition:all .35s var(--ease)}
.slot:hover:not(:disabled){border-color:var(--tomate);color:var(--tomate-deep)}
.slot:disabled{opacity:.3;cursor:not-allowed;text-decoration:line-through}
.slot[aria-checked="true"]{background:var(--tomate);border-color:var(--tomate);color:var(--craie)}
.stepper{display:inline-flex;align-items:center;gap:14px}
.stepper output{min-width:2ch;text-align:center;font:700 2.2rem/1 var(--f-display)}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;inset:0}
.seg span{display:block;padding:.65em 1.05em;border-radius:99px;border:1.5px solid rgba(43,27,20,.22);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .35s var(--ease)}
.seg input:checked+span{background:var(--encre);border-color:var(--encre);color:var(--craie)}
.seg input:focus-visible+span{outline:3px solid var(--miel);outline-offset:2px}
.field--text{display:grid;gap:.4rem;margin-bottom:1rem}
.field--text>span{font:700 .76rem var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--encre-2)}
.field--text em{text-transform:none;letter-spacing:0;font-weight:500}
.field--text input,.field--text textarea{
  width:100%;padding:.95em 1.1em;border-radius:14px;border:1.5px solid rgba(43,27,20,.2);background:#fff;font-size:1rem;resize:vertical;
  transition:border-color .3s,box-shadow .3s;
}
.field--text input:focus,.field--text textarea:focus{outline:0;border-color:var(--tomate);box-shadow:0 0 0 4px rgba(199,59,34,.15)}
.field--text input.is-bad{border-color:var(--tomate);background:#FFF1EC}
.recap{padding:1.2rem 1.3rem;border-radius:18px;background:var(--lin);margin-bottom:1.1rem}
.recap__main{font:600 clamp(1.4rem,2.2vw,1.9rem)/1.15 var(--f-display);letter-spacing:-.015em;color:var(--tomate-deep)}
.recap__main::first-letter{text-transform:uppercase}
.recap dl{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin-top:.8rem;font-size:.95rem}
.recap dt{color:var(--encre-2);font-weight:600}
.recap dd{margin:0;font-weight:600}
.send{display:grid;gap:10px}
.book__nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid rgba(43,27,20,.1)}
.book__nav .btn{margin-left:auto}
.book__nav .link[hidden]{display:none}

/* ---------- 11. Nous trouver ---------- */
.access{position:relative;background:var(--lin);padding:clamp(100px,12vw,160px) 0}
.access__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,6vw,110px);align-items:center}
.access__addr{display:flex;gap:1rem;align-items:flex-start;margin:1.6rem 0 1rem;font:600 clamp(1.2rem,1.8vw,1.6rem)/1.3 var(--f-display)}
.access__addr svg{width:30px;height:30px;color:var(--tomate);flex:none;margin-top:.15em}
.access__status{display:inline-flex;align-items:center;gap:.6em;margin-bottom:1rem;font-weight:700}
.access__status::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--tomate)}
.access__status.is-open::before{background:#5DAA3C;box-shadow:0 0 0 5px rgba(93,170,60,.2)}
.hours{width:100%;max-width:440px;border-collapse:collapse}
.hours th,.hours td{padding:.65rem 0;border-bottom:1px dashed rgba(43,27,20,.25);text-align:left;font-weight:500}
.hours td{text-align:right;font-variant-numeric:tabular-nums}
.hours th{font-family:var(--f-display);font-weight:600;font-size:1.05rem}
.hours tr.is-today th,.hours tr.is-today td{color:var(--tomate-deep);font-weight:700}
.access__small{margin-top:1rem;max-width:46ch;font-size:.92rem;color:var(--encre-2)}
.access__facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:1.2rem}
.access__facts li{padding:.45em .95em;border-radius:99px;background:var(--craie);border:1px solid rgba(43,27,20,.12);font-weight:600;font-size:.85rem}
.access__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.8rem}
.map-frame{position:relative;aspect-ratio:4/5;border-radius:999px 999px 28px 28px/380px 380px 28px 28px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(43,27,20,.5);background:#ddd}
.map-frame iframe{width:100%;height:100%;border:0;filter:saturate(.9) contrast(1.02)}
.map-link{display:inline-flex;align-items:center;gap:.6em;margin-top:1.1rem;font-weight:700;border-bottom:2px solid currentColor;padding-bottom:3px}
.map-link svg{width:1.1em;height:1.1em}

/* ---------- 12. Footer ---------- */
.footer{position:relative;background:var(--encre);color:var(--lin);padding:clamp(110px,12vw,150px) 0 0;overflow:hidden}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(24px,4vw,70px)}
.footer__lead{font:italic 500 clamp(1.6rem,3vw,2.6rem)/1.15 var(--f-display);letter-spacing:-.015em;margin-bottom:1.6rem}
.footer h3{font:700 .74rem var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:#F0C46A;margin-bottom:1rem}
.footer nav,.footer__grid>div:last-child{display:grid;align-content:start;gap:.55rem;justify-items:start}
.socials{display:flex;gap:10px;margin-top:.8rem}
.socials a{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(246,236,219,.4);transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease)}
.socials a:hover{background:var(--tomate);border-color:var(--tomate);color:var(--craie);transform:translateY(-4px) rotate(-6deg)}
.socials svg{width:22px;height:22px}
.footer__giant{
  margin-top:clamp(30px,6vw,70px);text-align:center;overflow:hidden;font:700 clamp(6rem,30vw,32rem)/.8 var(--f-display);letter-spacing:-.05em;color:var(--tomate);
  font-variation-settings:'SOFT' 100,'WONK' 1;padding-bottom:.02em;
}
.footer__giant span{display:block;will-change:transform}
.footer__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:22px 26px;border-top:1px solid rgba(246,236,219,.15);font-size:.84rem;color:rgba(246,236,219,.7)}

/* ---------- Barre flottante mobile ---------- */
.fab{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:80;display:none;gap:10px;transition:transform .6s var(--ease)}
.fab.is-hidden{transform:translateY(160%)}
.fab a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:1em;border-radius:999px;font-weight:700;box-shadow:0 14px 30px -10px rgba(0,0,0,.5)}
.fab svg{width:20px;height:20px}
.fab__call{background:var(--encre);color:var(--craie)}
.fab__book{background:var(--tomate);color:var(--craie)}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .nav{display:none}
  .burger{display:inline-block}
  .stats__grid{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer__grid>div:first-child{grid-column:1/-1}
}
@media (max-width:900px){
  :root{--header-h:64px}
  .fab{display:flex}
  .footer{padding-bottom:84px}
  .header__tel span{display:none}
  .header__cta .btn{display:none}

  .story__stage{grid-template-columns:minmax(0,1fr);gap:14px;padding-top:82px;align-content:center}
  .story__right{order:-1}
  .story__arch{width:min(44vw,260px);aspect-ratio:4/5}
  .story__title{font-size:clamp(1.7rem,7vw,2.4rem);margin-bottom:12px}
  .story__steps{min-height:230px}
  .story__step h3{font-size:1.5rem}
  .story__step p{font-size:.96rem}
  .story__caption,.story__deco--b{display:none}
  .story__deco--a{width:70px;height:70px;left:6%;bottom:0}

  .panels{flex-direction:column;height:auto;min-height:0}
  .panel{flex:none;height:116px;transition:height .8s var(--ease);border-right:0;border-bottom:1px solid rgba(255,249,238,.18)}
  .panel.is-open{height:430px;flex:none}

  .hscroll__pin{padding-top:90px}
  .hscroll__hint{display:none}
  .hscroll__head{flex-direction:column;align-items:flex-start;gap:.4rem}
  .hscroll__track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:30px;scrollbar-width:none}
  .hscroll__track::-webkit-scrollbar{display:none}
  .card{scroll-snap-align:center;flex-basis:78vw;height:520px}
  .card--end{flex-basis:74vw}

  .menu-board__wrap{grid-template-columns:minmax(0,1fr)}
  .menu-board__intro{position:static}
  .tabs{display:flex;overflow-x:auto;gap:8px;border:0;margin-inline:calc(var(--pad) * -1);padding:0 var(--pad) 10px;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:none;padding:.55em 1.1em;border:1.5px solid rgba(241,235,221,.35);border-radius:99px;font-size:1.05rem;font-style:normal;font-family:var(--f-body);font-weight:600}
  .tabs button span{display:none}
  .tabs button[aria-selected="true"]{background:var(--craie-ardoise);color:var(--ardoise);padding-left:1.1em}
  .tabs button[aria-selected="true"]::before{display:none}
  .tabs button:hover{padding-left:1.1em}
  .flavors,.cols{grid-template-columns:1fr}
  .board__frame{min-height:0}

  .gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:38vw}
  .g{grid-column:auto !important;grid-row:auto !important}
  .g1{grid-column:1/-1 !important;grid-row:span 2 !important;border-radius:999px 999px 22px 22px / 200px 200px 22px 22px}
  .g4,.g8{grid-row:span 2 !important}
  .g9{grid-column:1/-1 !important}
  .g figcaption{transform:none;padding-top:30px;font-size:.95rem}

  .reviews__top{grid-template-columns:minmax(0,1fr)}
  .reserve__grid{grid-template-columns:minmax(0,1fr)}
  .reserve__text{position:static}
  .bp__row{grid-template-columns:1fr}
  .access__grid{grid-template-columns:minmax(0,1fr)}
  .map-frame{aspect-ratio:1/1.1;border-radius:999px 999px 28px 28px/240px 240px 28px 28px}
  .hero__badge{bottom:auto;top:calc(var(--header-h) + 14px);right:16px;width:96px}
  .hero__badge-ring text{font-size:14px}
  .hero__scroll{display:none}
  .deco--olive{top:10%;right:-10%}
}
@media (max-width:560px){
  .stats__grid{gap:26px 14px}
  .stat__num{font-size:clamp(3rem,16vw,4.4rem)}
  .footer__grid{grid-template-columns:1fr}
  .hero__lead{font-size:1rem}
  .hero__actions .btn{flex:1 1 auto}
  .book__steps li{font-size:.58rem;letter-spacing:.06em}
}
@media (max-height:820px) and (min-width:901px){
  .menu-board__intro,.reserve__text{position:static}
}
@media (hover:none){
  .card__glare{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .kenburns img{animation:none}
}

