/* WBSmart — direction « Le Ticket » */
@font-face{font-family:"Big Shoulders";src:url(/fonts/big-shoulders-display-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Big Shoulders";src:url(/fonts/big-shoulders-display-latin-900-normal.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/fonts/instrument-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/fonts/instrument-sans-latin-600-normal.woff2) format("woff2");font-weight:600 700;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(/fonts/instrument-serif-latin-400-italic.woff2) format("woff2");font-style:italic;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --ink:#15110E; --ink-2:#221C17; --ink-3:#2E2620;
  --paper:#F5F0E6; --paper-2:#EAE2D3;
  --chili:#FF4A1C; --chili-d:#D9370C;
  --lemon:#F2D50F;
  --green:#0F7A52; --green-d:#0B5F40;
  --grease:#8A8178;
  --display:"Big Shoulders","Arial Narrow",Impact,sans-serif;
  --sans:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --mono:"Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:14px; --gut:16px; --dock:76px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--sans);padding-bottom:calc(var(--dock) + env(safe-area-inset-bottom));overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:800;line-height:1}
p{margin:0}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.mono{font-family:var(--mono);font-weight:500;letter-spacing:.04em;text-transform:uppercase}
.wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:var(--gut)}
.skip{position:absolute;left:-999px;top:8px;background:var(--lemon);padding:10px 14px;z-index:99;border-radius:8px}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--lemon);outline-offset:3px;border-radius:6px}

/* grain papier */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.07;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- boutons ---------- */
.btn{--bg:var(--chili);--fg:#fff;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 24px;border-radius:999px;background:var(--bg);color:var(--fg);font:600 1.0625rem/1 var(--sans);text-decoration:none;border:2px solid transparent;transition:transform .2s var(--ease),background .2s,box-shadow .2s;box-shadow:0 2px 0 rgba(0,0,0,.25)}
.btn svg{width:22px;height:22px;fill:currentColor;flex:none}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 rgba(0,0,0,.2)}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn--call{--bg:var(--chili)} .btn--call:hover{--bg:var(--chili-d)}
.btn--wa{--bg:var(--green)} .btn--wa:hover{--bg:var(--green-d)}
.btn--sm{min-height:42px;padding:0 16px;font-size:.95rem}
.btn--ghost{--bg:transparent;--fg:var(--ink);border-color:var(--ink);box-shadow:none}
.btn--ghost:hover{--bg:var(--ink);--fg:var(--paper)}
.btn--block{width:100%}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:50;background:rgba(21,17,14,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--paper);border-bottom:1px solid rgba(245,240,230,.08)}
.top__in{display:flex;align-items:center;justify-content:space-between;height:60px;gap:16px}
.logo{display:inline-flex;align-items:center;text-decoration:none;flex:none}
.logo img{height:35px;width:auto}
.nav{display:none}
.top__cta{display:none}

/* ---------- hero ---------- */
.hero{background:var(--ink);color:var(--paper);position:relative;overflow:hidden;
  background-image:radial-gradient(60% 50% at 85% 20%,rgba(255,74,28,.22),transparent 70%),radial-gradient(40% 40% at 0% 100%,rgba(242,213,15,.08),transparent 70%)}
.hero__grid{display:grid;gap:28px;padding-top:36px;padding-bottom:40px}
.tag{display:inline-flex;align-items:center;gap:8px;font:500 .78rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--lemon);border:1px solid rgba(242,213,15,.35);padding:8px 12px;border-radius:999px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--lemon);box-shadow:0 0 0 0 rgba(242,213,15,.6);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(242,213,15,0)}100%{box-shadow:0 0 0 0 rgba(242,213,15,0)}}
.hero__title{font:900 clamp(3rem,13vw,6.6rem)/.9 var(--display);text-transform:uppercase;letter-spacing:-.005em;margin-top:20px}
.hero__title .hl{color:var(--chili);display:block}
.hero__title-2{display:block;font-size:.62em;line-height:1;margin-top:.35em;color:var(--paper)}
.hero__title-2 em{text-transform:none;color:var(--lemon);font-size:1.12em;line-height:.9}
.hero__lead{margin-top:20px;font-size:1.125rem;color:rgba(245,240,230,.82);max-width:36em}
.hero__lead strong{color:var(--paper)}
.hero__ctas{display:grid;gap:12px;margin-top:26px}
.hero__facts{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:1px dashed rgba(245,240,230,.25);padding-top:18px}
.hero__facts li{font-size:.82rem;line-height:1.3;color:rgba(245,240,230,.7)}
.hero__facts b{display:block;font:900 2.1rem/1 var(--display);color:var(--paper);margin-bottom:4px}
.hero__visual{margin:0;position:relative}
.hero__img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 40%;border-radius:var(--r)}
.hero__visual::after{content:"";position:absolute;inset:0;border-radius:var(--r);background:linear-gradient(180deg,transparent 55%,rgba(21,17,14,.55));pointer-events:none}

/* ticket */
.ticket{background:#FBF8F1;color:var(--ink);font:500 .78rem/1.45 var(--mono);text-transform:uppercase;letter-spacing:.02em;padding:14px 14px 18px;width:230px;box-shadow:0 18px 40px rgba(0,0,0,.35);
  -webkit-mask:radial-gradient(circle at 50% 100%,transparent 4px,#000 4.5px) 0 100%/10px 10px repeat-x,linear-gradient(#000,#000) 0 0/100% calc(100% - 9px) no-repeat;
  mask:radial-gradient(circle at 50% 100%,transparent 4px,#000 4.5px) 0 100%/10px 10px repeat-x,linear-gradient(#000,#000) 0 0/100% calc(100% - 9px) no-repeat}
.ticket__head{display:flex;justify-content:space-between;font-weight:500;border-bottom:1px dashed #b9b0a2;padding-bottom:8px;margin-bottom:8px}
.ticket__line{display:flex;justify-content:space-between;gap:8px}
.ticket__sub{color:#6d655c;padding-left:14px;font-size:.92em}
.ticket__paid{margin-top:10px;border-top:1px dashed #b9b0a2;padding-top:8px;color:var(--green);font-weight:500}
.ticket--hero{position:absolute;right:-6px;bottom:-18px;transform:rotate(4deg);animation:float 6s ease-in-out infinite;z-index:2}
@keyframes float{50%{transform:rotate(2.5deg) translateY(-8px)}}

/* bandeau cuisine */
.kds{border-top:1px solid rgba(245,240,230,.1);background:var(--ink-2);overflow:hidden;padding:12px 0}
.kds__track{display:flex;gap:40px;width:max-content;animation:scroll 40s linear infinite;font:500 .78rem/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:rgba(245,240,230,.55);white-space:nowrap}
.kds__track b{color:var(--lemon);font-weight:500}
@keyframes scroll{to{transform:translateX(-50%)}}

/* définition */
.define{background:var(--lemon);color:var(--ink)}
.define__in{padding-block:28px;display:grid;gap:8px}
.define__label{font-size:.75rem}
.define__text{font-size:1.06rem;line-height:1.55;max-width:60em}
.define__text em{font-size:1.15em}

/* sections */
section{position:relative}
.sec-head{margin-bottom:32px;max-width:46rem}
.kicker{font-size:.75rem;color:var(--chili);margin-bottom:12px}
.h2{font:900 clamp(2.3rem,9.5vw,4.6rem)/.95 var(--display);text-transform:uppercase}
.h2 em{text-transform:none;color:var(--chili);font-size:1.04em;line-height:.85}
.h2--xl{font-size:clamp(2.8rem,12vw,6rem)}
.sec-lead{margin-top:16px;font-size:1.08rem;color:#4a423b;max-width:38em}

/* ---------- comment ---------- */
.how{padding-block:64px 56px}
.how__grid{display:grid;gap:40px}
.phone-stage{position:relative;display:flex;justify-content:center;padding:10px 0 20px}
.phone-stage::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:var(--chili);top:50%;left:50%;transform:translate(-50%,-50%);opacity:.9}
.how__float{position:absolute;width:110px;border-radius:50%;right:calc(50% - 175px);bottom:10px;box-shadow:0 14px 30px rgba(0,0,0,.25);animation:float 7s ease-in-out infinite;aspect-ratio:1;object-fit:cover}
.phone{position:relative;width:272px;height:556px;border-radius:44px;background:#0d0b09;padding:11px;box-shadow:0 0 0 2px #3a322b inset,0 30px 60px rgba(21,17,14,.35),0 8px 18px rgba(21,17,14,.25);z-index:1}
.phone__notch{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:22px;border-radius:20px;background:#0d0b09;z-index:5}
.phone__screen{position:relative;height:100%;border-radius:34px;overflow:hidden;background:#EFE8DC;font-size:12.5px;line-height:1.35}
.scr{position:absolute;inset:0;transition:transform .6s var(--ease),opacity .5s}
/* chat */
.scr--chat{display:flex;flex-direction:column;background:#ECE4D6 radial-gradient(#d9cfbd 1px,transparent 1.2px) 0 0/14px 14px}
.chat__bar{display:flex;align-items:center;gap:9px;padding:44px 14px 10px;background:var(--ink-2);color:var(--paper)}
.chat__bar b{display:block;font-size:13px}
.chat__bar small{font-size:10.5px;opacity:.6}
.chat__avatar{width:32px;height:32px;border-radius:50%;background:var(--chili);display:grid;place-items:center;font:900 13px var(--display);color:#fff}
.chat__body{flex:1;padding:14px 10px;display:flex;flex-direction:column;gap:8px;justify-content:flex-end}
.bub{max-width:82%;padding:8px 11px;border-radius:14px;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.08);opacity:0;transform:translateY(10px) scale(.96);transition:opacity .35s,transform .35s var(--ease)}
.bub--out{align-self:flex-end;background:#CDEBD9;border-bottom-right-radius:4px}
.bub--in{align-self:flex-start;border-bottom-left-radius:4px}
.bub--link{display:flex;gap:8px;align-items:center}
.bub--link small{display:block;color:var(--grease);font-size:10.5px}
.link__thumb{width:36px;height:36px;border-radius:8px;flex:none;background:url(/img/mini-burger-400.webp) center/cover}
.bub--ok{border-left:3px solid var(--green)}
/* menu */
.scr--menu{background:var(--paper);padding:44px 12px 12px;display:flex;flex-direction:column;gap:8px;transform:translateY(100%)}
.menu__top b{display:block;font:900 20px/1 var(--display);text-transform:uppercase}
.menu__top small{color:var(--grease);font-size:11px}
.menu__cats{display:flex;gap:6px}
.menu__cats span{padding:5px 10px;border-radius:999px;background:var(--paper-2);font-size:11px;font-weight:600}
.menu__cats .on{background:var(--ink);color:var(--paper)}
.prod{display:flex;gap:10px;align-items:center;background:#fff;border-radius:12px;padding:7px;border:2px solid transparent;transition:border-color .3s}
.prod img{width:52px;height:52px;border-radius:9px;object-fit:cover}
.prod b{display:block;font-size:13px}
.prod small{color:var(--grease);font-size:10.5px}
.prod--sel.is-on{border-color:var(--chili)}
.prod__add{display:inline-block;margin-top:3px;background:var(--chili);color:#fff;font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:999px}
.opts{background:#fff;border-radius:12px;padding:8px 10px}
.opts p{font-weight:600;font-size:12px;display:flex;justify-content:space-between}
.opts small{color:var(--green);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.chip{padding:4px 9px;border-radius:999px;border:1.5px solid var(--paper-2);font-size:10.5px;font-weight:600}
.chip.on{border-color:var(--chili);background:#FFE5DC;color:var(--chili-d)}
.menu__cart{margin-top:auto;background:var(--ink);color:var(--paper);text-align:center;padding:11px;border-radius:12px;font-weight:600;font-size:12.5px}
/* paiement */
.scr--pay{background:var(--ink);color:var(--paper);padding:60px 16px 16px;display:flex;flex-direction:column;gap:14px;transform:translateY(100%)}
.pay__title{font:900 22px/1 var(--display);text-transform:uppercase}
.pay__card{position:relative;height:130px;border-radius:14px;padding:14px;background:linear-gradient(135deg,var(--chili),#a52a0a);display:flex;flex-direction:column;justify-content:flex-end;gap:4px;font-size:13px}
.pay__chip{position:absolute;top:14px;left:14px;width:30px;height:22px;border-radius:5px;background:linear-gradient(135deg,#f6dc6a,#b8962b)}
.pay__sum{display:flex;justify-content:space-between;font-size:12px;opacity:.75;border-top:1px dashed rgba(245,240,230,.25);padding-top:12px}
.pay__btn{background:var(--green);border-radius:12px;padding:13px;text-align:center;font-weight:600;position:relative;display:flex;justify-content:center;align-items:center;gap:8px}
.pay__spin{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;display:none;animation:spin .7s linear infinite}
.is-paying .pay__spin{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.pay__note{font-size:11px;opacity:.6;text-align:center}
/* états */
.phone__screen[data-step="1"] .b1,.phone__screen[data-step="1"] .b2,.phone__screen[data-step="1"] .b3{opacity:1;transform:none}
.phone__screen[data-step="2"] .scr--menu{transform:none}
.phone__screen[data-step="3"] .scr--menu{transform:none}
.phone__screen[data-step="3"] .scr--pay{transform:none}
.phone__screen[data-step="4"] .bub{opacity:1;transform:none}
.phone__screen[data-step="4"] .b1,.phone__screen[data-step="4"] .b2{display:none}
/* étapes */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.step{display:flex;gap:16px;padding:18px 14px;border-radius:var(--r);cursor:pointer;transition:background .3s}
.step h3{font:600 1.15rem/1.25 var(--sans);margin-bottom:6px}
.step p{color:#5a5149;font-size:1rem}
.step__n{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:900 1.5rem/1 var(--display);border:2px solid var(--ink);transition:background .3s,color .3s}
.step.is-on{background:#fff;box-shadow:0 1px 0 var(--paper-2)}
.step.is-on .step__n{background:var(--chili);border-color:var(--chili);color:#fff}
.how__photos{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-top:40px}
.ph{margin:0;position:relative;border-radius:var(--r);overflow:hidden;background:var(--ink-2)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph figcaption{position:absolute;left:10px;bottom:10px;background:var(--paper);color:var(--ink);font-size:.7rem;padding:6px 9px;border-radius:6px}
.how__photos .ph{aspect-ratio:3/4}
.how__photos .ph:last-child{aspect-ratio:auto}

/* ---------- espace resto ---------- */
.resto{background:var(--ink);color:var(--paper);padding-block:64px}
.sec-head--light .sec-lead{color:rgba(245,240,230,.7)}
.sec-head--light .h2 em{color:var(--lemon)}
.resto__stage{position:relative;display:grid;gap:0}
.ph--resto{aspect-ratio:3/2}
.ph--resto img{object-position:50% 70%}
.printer{position:relative;margin:-36px auto 0;width:260px;z-index:2}
.printer__slot{height:34px;border-radius:12px 12px 6px 6px;background:linear-gradient(#3a312a,#1d1814);box-shadow:0 10px 30px rgba(0,0,0,.4),inset 0 -6px 0 #0c0a08;position:relative;z-index:2}
.printer__tickets{display:flex;flex-direction:column;align-items:center;margin-top:-8px}
.ticket--print{width:228px;box-shadow:0 10px 24px rgba(0,0,0,.3);clip-path:inset(0 0 100% 0);transform:translateY(-30px);transition:clip-path 1.4s steps(14,end),transform 1.4s steps(14,end)}
.ticket--print.t2{margin-top:10px;transition-delay:1.6s}
.printer.is-in .ticket--print{clip-path:inset(0 0 0 0);transform:none}
.feats{list-style:none;padding:0;margin:48px 0 0;display:grid;gap:1px;background:rgba(245,240,230,.12);border-radius:var(--r);overflow:hidden}
.feat{background:var(--ink);padding:24px 18px}
.feat__ico{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--ink-3);color:var(--lemon);font-size:1.2rem;margin-bottom:14px}
.feat h3{font:800 1.6rem/1 var(--display);text-transform:uppercase;margin-bottom:8px}
.feat p{color:rgba(245,240,230,.72);font-size:1rem}

/* ---------- franchises ---------- */
.fr{padding-block:64px;background:var(--paper-2)}
.fr__grid{display:grid;gap:36px;align-items:center}
.fr__list{list-style:none;padding:0;margin:24px 0 28px;display:grid;gap:14px;counter-reset:fr}
.fr__list li{position:relative;padding-left:44px;font-size:1.05rem}
.fr__list li::before{counter-increment:fr;content:counter(fr,decimal-leading-zero);position:absolute;left:0;top:2px;font:500 .8rem/1 var(--mono);background:var(--ink);color:var(--paper);padding:5px 6px;border-radius:5px}
.ph--fr{aspect-ratio:4/3;overflow:visible;background:none}
.ph--fr img{border-radius:var(--r)}
.fr__badge{position:absolute;left:-4px;bottom:-22px;background:var(--chili);color:#fff;padding:14px 18px;border-radius:12px;transform:rotate(-3deg);box-shadow:0 14px 30px rgba(0,0,0,.25)}
.fr__badge span{font-size:.7rem;opacity:.85}
.fr__badge b{display:block;font:900 1.9rem/1 var(--display);text-transform:uppercase;margin:4px 0 2px}
.fr__badge small{font-size:.85rem}

/* ---------- avantages ---------- */
.adv{padding-block:72px 64px}
.adv__grid{display:grid;gap:28px}
.adv__zero{background:var(--chili);color:#fff;border-radius:var(--r);padding:28px 22px;position:relative;overflow:hidden}
.adv__big{display:block;font:900 clamp(9rem,46vw,15rem)/.78 var(--display);letter-spacing:-.03em}
.adv__big small{font-size:.45em;vertical-align:top;margin-left:4px}
.adv__zero h3{font:900 2rem/1 var(--display);text-transform:uppercase;margin:14px 0 10px}
.adv__zero p{color:rgba(255,255,255,.9)}
.adv__list{list-style:none;padding:0;margin:0;display:grid}
.adv__list li{padding:18px 0;border-bottom:1px dashed #c9bfae}
.adv__list li:first-child{padding-top:0}
.adv__list h3{font:800 1.55rem/1.05 var(--display);text-transform:uppercase;margin-bottom:6px}
.adv__list p{color:#5a5149}
.board{display:flex;gap:12px;margin:44px calc(var(--gut) * -1) 0;padding:0 var(--gut);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.board::-webkit-scrollbar{display:none}
.board figure{margin:0;flex:0 0 72%;scroll-snap-align:start;position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:1}
.board img{width:100%;height:100%;object-fit:cover}
.board figcaption{position:absolute;left:12px;bottom:10px;font:900 2.6rem/1 var(--display);text-transform:uppercase;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.5)}

/* ---------- tarifs + preuve ---------- */
.price{padding-block:64px;background:var(--ink);color:var(--paper)}
.price__grid{display:grid;gap:44px}
.receipt{background:#FBF8F1;color:var(--ink);padding:26px 20px 34px;max-width:420px;width:100%;margin-inline:auto;transform:rotate(-1.2deg);box-shadow:0 30px 60px rgba(0,0,0,.4);
  -webkit-mask:radial-gradient(circle at 50% 0,transparent 5px,#000 5.5px) 0 0/14px 12px repeat-x,radial-gradient(circle at 50% 100%,transparent 5px,#000 5.5px) 0 100%/14px 12px repeat-x,linear-gradient(#000,#000) 0 11px/100% calc(100% - 22px) no-repeat;
  mask:radial-gradient(circle at 50% 0,transparent 5px,#000 5.5px) 0 0/14px 12px repeat-x,radial-gradient(circle at 50% 100%,transparent 5px,#000 5.5px) 0 100%/14px 12px repeat-x,linear-gradient(#000,#000) 0 11px/100% calc(100% - 22px) no-repeat}
.receipt__head{font-size:.75rem;text-align:center;color:var(--grease)}
.receipt__title{font:900 3.6rem/1 var(--display);text-transform:uppercase;text-align:center;margin:6px 0 18px}
.receipt__row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px dashed #b9b0a2;font:500 .85rem/1.35 var(--mono);text-transform:uppercase}
.receipt__row b{font-weight:500;text-align:right}
.receipt__total{border-top:2px solid var(--ink);font-size:.95rem}
.receipt__total b{color:var(--chili)}
.receipt__foot{text-align:center;margin:16px 0;color:#5a5149}
.proof .kicker{color:var(--lemon)}
.proof__text{font:900 clamp(2.2rem,9vw,3.8rem)/1 var(--display);text-transform:uppercase}
.proof__text em{text-transform:none;color:var(--lemon)}
.city{color:var(--chili);display:inline-block;position:relative}
.ph--proof{aspect-ratio:3/2;margin-top:26px}
.proof__zone{margin-top:14px;color:rgba(245,240,230,.7);font-size:1rem}

/* ---------- faq ---------- */
.faq{padding-block:72px}
.faq__grid{display:grid;gap:8px}
.faq__list details{border-top:2px solid var(--ink)}
.faq__list details:last-child{border-bottom:2px solid var(--ink)}
.faq__list summary{list-style:none;cursor:pointer;padding:20px 44px 20px 0;font:600 1.12rem/1.3 var(--sans);position:relative;min-height:56px}
.faq__list summary::-webkit-details-marker{display:none}
.faq__list summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font:500 1.2rem/1 var(--mono);transition:transform .3s var(--ease),background .3s}
.faq__list details[open] summary::after{transform:translateY(-50%) rotate(45deg);background:var(--chili)}
.faq__list details p{padding:0 0 22px;color:#4a423b;max-width:44em}

/* ---------- contact ---------- */
.contact{padding-block:72px;background:var(--chili);color:#fff;overflow:hidden}
.contact .kicker{color:var(--ink)}
.contact .h2 em{color:var(--lemon)}
.contact .sec-lead{color:rgba(255,255,255,.9)}
.contact__grid{display:grid;gap:36px;align-items:center}
.contact__num{display:block;margin-top:24px;font:900 clamp(3rem,15vw,6rem)/1 var(--display);text-decoration:none;letter-spacing:.01em}
.contact .btn--call{--bg:var(--ink)} .contact .btn--call:hover{--bg:#000}
.ph--contact{aspect-ratio:1;transform:rotate(2deg);box-shadow:0 30px 60px rgba(0,0,0,.3)}
.ph--contact figcaption{background:var(--lemon)}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:rgba(245,240,230,.75);padding-block:48px 28px;font-size:.98rem}
.foot__in{display:grid;gap:28px}
.logo--foot{margin-bottom:14px}
.logo--foot img{height:48px}
.foot nav{display:grid;gap:10px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--lemon)}
.foot__contact a{font:900 2rem/1 var(--display);color:var(--paper)}
.foot__contact span{font-size:.85rem}
.foot__legal{margin-top:32px;padding-top:18px;border-top:1px solid rgba(245,240,230,.1);font-size:.68rem;line-height:1.6;color:rgba(245,240,230,.45)}

/* ---------- barre mobile ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(21,17,14,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(245,240,230,.1)}
.dock .btn{min-height:56px;padding:0 12px}

/* ---------- révélations ---------- */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
.hero .reveal:nth-child(2){transition-delay:.08s}.hero .reveal:nth-child(3){transition-delay:.16s}.hero .reveal:nth-child(4){transition-delay:.24s}.hero .reveal:nth-child(5){transition-delay:.32s}

/* ---------- tablette / desktop ---------- */
@media (min-width:600px){
  :root{--gut:28px}
  .hero__ctas{display:flex;flex-wrap:wrap}
  .feats{grid-template-columns:1fr 1fr}
  .board figure{flex-basis:46%}
}
@media (min-width:960px){
  :root{--gut:40px;--dock:0px}
  body{padding-bottom:0}
  .dock{display:none}
  .nav{display:flex;gap:26px;font-size:.95rem}
  .nav a{text-decoration:none;opacity:.8}
  .nav a:hover{opacity:1;color:var(--lemon)}
  .top__cta{display:inline-flex}
  .hero__grid{grid-template-columns:1.15fr .85fr;align-items:center;gap:56px;padding-block:72px 84px}
  .hero__img{aspect-ratio:4/5}
  .ticket--hero{right:-28px;bottom:36px}
  .how{padding-block:110px 96px}
  .how__grid{grid-template-columns:1fr 1fr;align-items:center;gap:64px}
  .phone-stage::before{width:380px;height:380px}
  .phone{width:300px;height:614px}
  .how__float{right:calc(50% - 220px);width:130px}
  .how__photos{grid-template-columns:1fr 2fr;margin-top:72px}
  .resto,.fr,.price,.contact{padding-block:110px}
  .resto__stage{grid-template-columns:1.6fr 1fr;align-items:end}
  .printer{margin:0 0 -30px -60px}
  .feats{grid-template-columns:repeat(3,1fr);margin-top:80px}
  .feat{padding:32px 28px}
  .fr__grid{grid-template-columns:1fr 1fr;gap:72px}
  .adv{padding-block:120px 110px}
  .adv__grid{grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
  .adv__zero{padding:40px 36px;position:sticky;top:90px}
  .board{margin-inline:0;padding:0;overflow:visible}
  .board figure{flex:1}
  .price__grid{grid-template-columns:.9fr 1.1fr;align-items:center;gap:80px}
  .faq{padding-block:120px}
  .faq__grid{grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
  .faq .sec-head{position:sticky;top:100px}
  .contact__grid{grid-template-columns:1.3fr .7fr;gap:72px}
  .foot__in{grid-template-columns:1.4fr 1fr 1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
  .ticket--print{clip-path:none;transform:none}
}

/* ---------- mentions légales ---------- */
.legal{padding-block:56px 80px}
.legal .h2{margin-bottom:28px}
.legal h2.l2{font:800 1.8rem/1.1 var(--display);text-transform:uppercase;margin:36px 0 12px}
.legal p,.legal li{max-width:44em;margin-bottom:8px}
.legal a{color:var(--chili-d)}

/* cadence des bulles */
.phone__screen[data-step="1"] .b2{transition-delay:.6s}
.phone__screen[data-step="1"] .b3{transition-delay:1.3s}
.phone__screen[data-step="4"] .b4{transition-delay:.3s}
.phone__screen[data-step="4"] .b5{transition-delay:1.8s}
