/* The Thien · feuille de style
   Monde : marbre noir, porcelaine, cuivre, jardin au crépuscule.
   Signature : le soleil (rayons du lustre et des bols). */

/* Polices hébergées sur le site (sous-ensemble latin, WOFF2) : pas d'appel à Google Fonts */
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/jost-300.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-400.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jost-500.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/cormorant-500.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/cormorant-500-italic.woff2) format('woff2')}
@font-face{font-family:'Poiret One';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/poiret-one-400.woff2) format('woff2')}

:root{
  --canvas:#0F1312;
  --panel:#171D1B;
  --panel-2:#1E2522;
  --porcelain:#F3EFE7;
  --ink:#161A19;
  --ink-2:#4A4F4C;
  --accent:#C27A47;
  --accent-hover:#D68E5A;
  --accent-ink:#9A5A2E;            /* cuivre lisible sur porcelaine */
  --accent-muted:rgba(194,122,71,.28);
  --accent-line:rgba(194,122,71,.55);
  --text-primary:#F1ECE3;
  --text-secondary:#A3ABA6;
  --line:rgba(241,236,227,.14);
  --line-strong:rgba(241,236,227,.42);

  --f-display:'Poiret One','Jost',system-ui,sans-serif;
  --f-body:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;

  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-soft:cubic-bezier(.65,.05,.36,1);
  --tshadow:0 1px 2px rgba(5,7,6,.95),0 3px 12px rgba(5,7,6,.78),0 10px 44px rgba(5,7,6,.8);
  --gutter:clamp(16px,5vw,72px);
  --nav-h:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--canvas);color:var(--text-primary);
  font-family:var(--f-body);font-weight:300;font-size:clamp(16.5px,1.05vw + 10px,19px);line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
/* Entrée de la page : un voile couleur fond qui s'efface. Le contenu, lui, est peint dès le départ,
   sinon Chrome ne compte pas le plus grand élément affiché dans ses mesures de vitesse. */
body::before{content:"";position:fixed;inset:0;z-index:2147483000;background:var(--canvas);pointer-events:none;animation:page-in .9s var(--ease-out) .05s forwards}
@keyframes page-in{to{opacity:0;visibility:hidden}}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{margin:0;font-weight:400}
button,input,select,textarea{font:inherit;color:inherit}

.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--accent);color:var(--canvas);padding:12px 18px;font-weight:500;text-decoration:none;transition:top .3s var(--ease-out)}
.skip:focus{top:16px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
main:focus{outline:none}

/* ---------- Le fond permanent : marbre, lueur, grain ---------- */
.env{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--canvas)}
.env .veins{position:absolute;left:-20%;top:-20%;width:140%;height:140%;opacity:.075;
  animation:veins-drift 120s linear infinite alternate;animation-delay:-37s}
.env::before{content:"";position:absolute;inset:-10%;
  background:radial-gradient(55% 45% at 72% 28%,rgba(194,122,71,.13),transparent 70%),
             radial-gradient(45% 40% at 18% 82%,rgba(70,96,82,.12),transparent 70%);
  animation:glow-breathe 60s ease-in-out infinite alternate;animation-delay:-21s}
.env::after{content:"";position:absolute;inset:0;opacity:.06;
  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")}
@keyframes veins-drift{from{transform:translate3d(-3%,-2%,0) rotate(-1deg)}to{transform:translate3d(3%,2%,0) rotate(1deg)}}
@keyframes glow-breathe{from{opacity:.55}to{opacity:1}}

/* ---------- Boutons : l'octogone de la verrière ---------- */
.btn{--cut:11px;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:14px 26px;
  background:var(--accent);color:var(--canvas);text-decoration:none;border:0;cursor:pointer;
  font-family:var(--f-body);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;text-shadow:none;
  clip-path:polygon(var(--cut) 0,calc(100% - var(--cut)) 0,100% var(--cut),100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,var(--cut) 100%,0 calc(100% - var(--cut)),0 var(--cut));
  transition:background-color .35s var(--ease-out),transform .35s var(--ease-out)}
.btn:hover{background:var(--accent-hover);transform:translateY(-1px)}
.btn:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--canvas),inset 0 0 0 4px var(--text-primary)}
.btn.small{min-height:40px;padding:10px 18px;font-size:12.5px;--cut:9px}
.link-arrow{display:inline-flex;align-items:baseline;gap:.5em;font-weight:400;font-size:14px;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;color:var(--text-primary);padding:12px 4px;border-bottom:1px solid var(--line-strong);
  transition:border-color .35s var(--ease-out),color .35s var(--ease-out)}
.link-arrow span{transition:transform .35s var(--ease-out)}
.link-arrow:hover{border-color:var(--accent);color:#fff}
.link-arrow:hover span{transform:translateX(4px)}
@media (pointer:coarse){.btn{min-height:48px}.link-arrow{min-height:44px;display:inline-flex;align-items:center}}

/* ---------- Petites étiquettes et éclosion du soleil ---------- */
.label{display:inline-flex;align-items:center;gap:12px;font-weight:500;font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:22px}
.burst{width:22px;height:22px;flex:none;color:var(--accent);fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;
  opacity:0;transform:scale(.35) rotate(-70deg);transition:opacity .9s var(--ease-out),transform 1.3s var(--ease-out)}
.in .burst,.band .burst,.hero-static .burst{opacity:1;transform:none}

.section-title{font-family:var(--f-display);font-size:clamp(36px,4.6vw,66px);line-height:1.08;letter-spacing:.005em;margin-bottom:26px}
.lede{color:var(--text-secondary);max-width:38ch}
.price{font-family:var(--f-serif);font-weight:500;font-size:1.25em;color:var(--accent);letter-spacing:.01em;white-space:nowrap}

/* ---------- Navigation ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:0 var(--gutter);transition:background-color .5s var(--ease-out),backdrop-filter .5s var(--ease-out),border-color .5s var(--ease-out);
  border-bottom:1px solid transparent}
.nav.solid{background:rgba(15,19,18,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:var(--line)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--text-primary)}
.brand .mono{width:38px;height:38px}
.brand .word{width:118px;height:auto}
.nav ul{display:flex;gap:clamp(14px,2.2vw,34px);list-style:none;margin:0;padding:0}
.nav ul a{font-weight:400;font-size:13px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--text-primary);opacity:.82;
  padding:10px 0;position:relative;transition:opacity .3s var(--ease-out)}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .45s var(--ease-out)}
.nav ul a:hover{opacity:1}.nav ul a:hover::after{transform:scaleX(1)}
@media (max-width:980px){.nav ul{display:none}}
@media (max-width:420px){.brand .word{display:none}}

/* ---------- Le hero ---------- */
.hero{position:relative;height:var(--hero-h,1100vh)}
.hero[data-v="2"]{--hero-h:800vh}  /* vidéo 2 : 8 s au lieu de 11,5 */
/* Au doigt : parcours plus court, sinon on lance la page trop fort et l'élan dépasse la vidéo */
@media (pointer:coarse){.hero{--hero-h:480vh}.hero[data-v="2"]{--hero-h:360vh}}
.stage{position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden;background:var(--canvas)}
.poster,.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.poster{background:var(--canvas) center/cover no-repeat}
.stage video{opacity:0;transition:opacity .8s var(--ease-out);will-change:transform;transform:translateZ(0)}
.stage.video-ready video{opacity:1}
.stage.video-failed video{display:none}
.stage .scrim{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(8,11,10,0) 38%,rgba(8,11,10,.6) 100%),
             linear-gradient(to bottom,rgba(8,11,10,.72) 0,rgba(8,11,10,.3) 12%,rgba(8,11,10,0) 24%)}
.nav:not(.solid) ul a,.nav:not(.solid) .brand{text-shadow:0 1px 3px rgba(5,7,6,.9),0 2px 14px rgba(5,7,6,.7)}
.nav:not(.solid) .brand svg{filter:drop-shadow(0 1px 3px rgba(5,7,6,.85))}

.band{position:absolute;top:50%;width:fit-content;max-width:min(600px,42vw);transform:translateY(-50%);opacity:0;text-shadow:var(--tshadow);pointer-events:none;will-change:opacity}
.band.on{pointer-events:auto}
.band.left{left:var(--gutter)}
.band.right{right:var(--gutter)}
.band.bl{left:var(--gutter);top:auto;bottom:clamp(48px,9vh,110px);transform:none;max-width:min(520px,38vw)}
.band.tl{left:var(--gutter);top:calc(var(--nav-h) + 3vh);transform:none}
.band.off{display:none}
.hero[data-v="2"] .band.right{right:auto;left:var(--gutter)}  /* vidéo 2 : l'assiette occupe la droite, tous les textes à gauche */
.band::before{content:"";position:absolute;inset:-96% -75%;z-index:-1;pointer-events:none;opacity:calc(.25 + .75*var(--k,1));
  background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(6,9,8,var(--scrim,.66)) 0%,rgba(6,9,8,calc(var(--scrim,.66)*.92)) 40%,rgba(6,9,8,calc(var(--scrim,.66)*.7)) 62%,rgba(6,9,8,calc(var(--scrim,.66)*.35)) 80%,rgba(6,9,8,calc(var(--scrim,.66)*.1)) 92%,rgba(6,9,8,0) 100%)}
.band h2{font-family:var(--f-display);font-size:clamp(40px,4.4vw,78px);line-height:1.06;letter-spacing:.005em}
.band .sub{margin-top:18px;font-size:clamp(17px,1.35vw,22px);line-height:1.5;font-weight:300;max-width:34ch;color:#ECE6DC}
.band .label{color:#EDB58A;text-shadow:0 1px 3px rgba(5,7,6,.95),0 2px 12px rgba(5,7,6,.8)}
.band .btn{text-shadow:none}

/* Bande 1 : le soir qui devient net */
.b1{top:auto;bottom:clamp(56px,10vh,120px);transform:none}
.b1{max-width:min(420px,31vw)}
.b1 .logo-full{position:relative;width:min(340px,25vw,40vh)}
.b1 .sub{font-weight:400}
.b1 .logo-full svg{width:100%;height:auto;filter:drop-shadow(0 4px 24px rgba(5,7,6,.85))}
.b1 .logo-full .soft{position:absolute;inset:0;filter:blur(10px);opacity:calc(1 - var(--k,0))}
.b1 .logo-full .sharp{opacity:var(--k,0)}
.b1 .sub{opacity:calc(var(--k,0)*1.4 - .4)}
.b1 .label{opacity:var(--k,0)}

/* Les mots et les lettres découpés par le script */
.w{display:inline-block;white-space:nowrap}
.c{display:inline-block}
.band h2 .vis,.band .sub .vis{display:block}

/* Bande 2 : les mots descendent avec la caméra */
.fx-drift .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translate3d(0,calc((1 - var(--kc))*-28px),0)}
/* Bande 3 : les lettres arrivent en étoile, comme les tiges du lustre */
.fx-radiate .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);
  transform:translate3d(calc((1 - var(--kc))*var(--jx,0px)),calc((1 - var(--kc))*var(--jy,0px)),0) rotate(calc((1 - var(--kc))*var(--jr,0deg)))}
/* Bande 4 : la vapeur, les mots montent et se posent */
.fx-steam .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);transform:translate3d(0,calc((1 - var(--kc))*34px),0) scale(calc(.94 + .06*var(--kc)))}
/* Bande 5 : la table est prête, montée mot à mot puis ligne puis boutons */
.fx-settle .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);opacity:var(--kc);transform:translate3d(0,calc((1 - var(--kc))*22px),0)}
.fx-settle .sub{--ks:clamp(0,(var(--k,0) - .66)*4,1);opacity:var(--ks);transform:translate3d(0,calc((1 - var(--ks))*10px),0)}
.fx-settle .cta-row{--kb:clamp(0,(var(--k,0) - .78)*5,1);opacity:var(--kb);transform:translate3d(0,calc((1 - var(--kb))*10px),0)}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:30px}

/* Chargement : l'anneau en soleil */
.loader{position:absolute;left:50%;bottom:34px;width:58px;height:58px;margin-left:-29px;color:var(--text-primary);opacity:.9;transition:opacity .6s var(--ease-out)}
.loader .rays line{stroke:currentColor;stroke-width:1.3;stroke-linecap:round;opacity:.35}
.loader .ring{stroke:var(--accent);stroke-width:2;fill:none;stroke-dasharray:126;stroke-dashoffset:var(--ld,126);transform:rotate(-90deg);transform-origin:29px 29px;transition:stroke-dashoffset .15s linear}
.stage.video-ready .loader,.stage.video-failed .loader{opacity:0}
.cue{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;
  font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--text-primary);text-shadow:var(--tshadow);opacity:0;transition:opacity .6s var(--ease-out);pointer-events:none}
.cue i{display:block;width:1px;height:38px;background:linear-gradient(var(--text-primary),transparent);transform-origin:top;animation:cue-line 2.6s var(--ease-soft) infinite;animation-delay:-.6s}
@keyframes cue-line{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.stage.video-ready .cue.show,.stage.video-failed .cue.show{opacity:.9}
@media (max-height:560px){.cue,.loader{display:none}}

/* Hero fixe (téléphone couché, mouvement réduit, économie de données) */
.hero-static{display:none;position:relative;min-height:100vh;min-height:100svh;padding:calc(var(--nav-h) + 24px) var(--gutter) 48px;
  background:var(--canvas) center/cover no-repeat;flex-direction:column;justify-content:flex-end}
.hero-static::before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,11,10,.55) 0,rgba(8,11,10,.05) 30%,rgba(8,11,10,.35) 52%,rgba(8,11,10,.92) 100%)}
.hero[data-v="2"] .hero-static::before{background:linear-gradient(to bottom,rgba(8,11,10,.55) 0,rgba(8,11,10,.3) 20%,rgba(8,11,10,.62) 42%,rgba(8,11,10,.94) 100%)}  /* vidéo 2 : le pot clair passe sous le logo */
.hero-static > *{position:relative}
.hero-static .logo-full{width:min(250px,52vw,30vh);margin-bottom:20px;filter:drop-shadow(0 4px 20px rgba(5,7,6,.85))}
.hero-static h1{font-family:var(--f-display);font-size:clamp(30px,7.4vw,48px);line-height:1.12;text-shadow:var(--tshadow);max-width:18ch}
.hero-static .label{letter-spacing:.18em;font-size:11.5px;color:#EDB58A;text-shadow:0 1px 3px rgba(5,7,6,.95)}
.hero-static p{margin:16px 0 0;font-size:17px;color:#ECE6DC;text-shadow:var(--tshadow);max-width:34ch}
.hero-static .cta-row{margin-top:26px}

/* Sélecteur de la vidéo d'accueil (temporaire, le temps que le client choisisse) */
.hero-pick{position:fixed;right:var(--gutter);bottom:24px;z-index:40;display:flex;gap:3px;padding:3px;
  border:1px solid var(--accent-line);background:rgba(15,19,18,.74);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease-out),visibility .4s}
.hero-pick.show{opacity:1;visibility:visible}
.hero-pick button{min-height:38px;padding:0 15px;border:0;background:none;color:var(--text-primary);cursor:pointer;
  font-family:var(--f-body);font-weight:500;font-size:12px;letter-spacing:.14em;text-transform:uppercase;transition:background-color .3s var(--ease-out),color .3s var(--ease-out)}
.hero-pick button:hover{background:rgba(194,122,71,.18)}
.hero-pick button[aria-checked="true"]{background:var(--accent);color:var(--canvas)}
.hero-pick button:focus-visible{outline:2px solid var(--text-primary);outline-offset:2px}
@media (pointer:coarse){.hero-pick button{min-height:44px}}

/* Écran vertical : la vidéo 9:16 défile aussi, les textes passent en bas sur toute la largeur */
@media (orientation:portrait){
  .hero-pick{top:calc(var(--nav-h) + 8px);bottom:auto}
  .stage .scrim{background:linear-gradient(to bottom,rgba(8,11,10,.72) 0,rgba(8,11,10,.25) 14%,rgba(8,11,10,0) 30%,rgba(8,11,10,0) 42%,rgba(8,11,10,.55) 62%,rgba(8,11,10,.9) 100%)}
  .band,.band.left,.band.right,.band.bl,.band.tl,.b1,.hero[data-v="2"] .band.right{left:16px;right:16px;top:auto;bottom:calc(104px + env(safe-area-inset-bottom));transform:none;width:auto;max-width:none}
  .band::before{inset:-40% -12%}
  .band h2{font-size:clamp(30px,8.6vw,46px)}
  .band .sub{margin-top:12px;font-size:16.5px}
  .b1 .logo-full{width:min(210px,48vw,26vh)}
  .cta-row{margin-top:22px}
}
/* Image fixe : téléphone couché, mouvement réduit, économie de données (html.lite posé par site.js) */
@media (orientation:landscape) and (pointer:coarse) and (max-height:560px),(prefers-reduced-motion:reduce){
  .hero{height:auto}
  .stage{display:none}
  .hero-static{display:flex}
  .hero-pick{top:calc(var(--nav-h) + 8px);bottom:auto}
}
.lite .hero{height:auto}
.lite .stage{display:none}
.lite .hero-static{display:flex}

/* ---------- Sections ---------- */
.section{position:relative;padding:clamp(96px,14vh,170px) var(--gutter)}
.wrap{max-width:1240px;margin:0 auto}
.reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal.in.d1{transition-delay:.12s}.reveal.in.d2{transition-delay:.24s}.reveal.in.d3{transition-delay:.36s}.reveal.in.d4{transition-delay:.48s}
.reveal.in.settled.d1,.reveal.in.settled.d2,.reveal.in.settled.d3,.reveal.in.settled.d4{transition-delay:0s}
.poster-card.reveal.in{transform:none}
.poster-card.reveal.in:nth-child(1){transform:rotate(-2.2deg) translateY(18px)}
.poster-card.reveal.in:nth-child(3){transform:rotate(2.2deg) translateY(18px)}
.poster-card.reveal.in:hover{transform:rotate(0) translateY(-4px)}

/* La famille */
.famille .head{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.simmer{position:relative;justify-self:center;width:min(640px,100%);touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;-webkit-touch-callout:none}
.simmer:focus-visible{outline-offset:10px}
.pour{--c:5%;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--panel);
  clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% calc(var(--c)*1.78),100% calc(100% - var(--c)*1.78),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)*1.78),0 calc(var(--c)*1.78))}
.pour img,.pour video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pour video{opacity:0;transition:opacity .5s var(--ease-out)}
.simmer.vready .pour video{opacity:1}
.pour .pour-end{opacity:0;transition:opacity 1s var(--ease-out)}
.famille.done .simmer:not(.vready) .pour-end,body.rm .pour .pour-end{opacity:1}
.pour::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(241,236,227,.1);
  background:linear-gradient(to top,rgba(8,11,10,.45),transparent 38%)}
.gauge{position:absolute;left:50%;bottom:0;width:92px;height:92px;transform:translate(-50%,50%);border-radius:50%;
  background:rgba(15,19,18,.92);border:1px solid var(--accent-line);display:grid;place-items:center;color:var(--accent);
  box-shadow:0 10px 30px rgba(0,0,0,.45);transition:transform .4s var(--ease-out)}
.simmer.holding .gauge{transform:translate(-50%,50%) scale(.94)}
.gauge{width:104px;height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.gauge .g-label{position:relative;height:12px;font-size:9.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;line-height:12px;color:var(--text-primary);white-space:nowrap}
.gauge .g-label span{display:block;transition:opacity .3s var(--ease-out)}
.gauge .g-label .l-hold,.gauge .g-label .l-nudge{position:absolute;left:50%;top:0;transform:translateX(-50%);opacity:0}
.simmer.holding .g-label .l-idle,.simmer.nudge .g-label .l-idle{opacity:0}
.simmer.holding .g-label .l-hold{opacity:1}
.simmer.nudge:not(.holding) .g-label .l-nudge{opacity:1;color:var(--accent)}
.simmer.nudge .gauge{animation:gauge-nudge .5s var(--ease-out)}
@keyframes gauge-nudge{0%,100%{transform:translate(-50%,50%)}30%{transform:translate(-50%,50%) scale(1.08)}60%{transform:translate(-50%,50%) scale(.97)}}
.famille.done .gauge .g-label{opacity:0}
.simmer.teasing .gauge{border-color:var(--accent)}
.gauge .icon{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.gauge .sun line{stroke:currentColor;stroke-linecap:round}
.gauge .sun{position:absolute;inset:-26px;width:calc(100% + 52px);height:calc(100% + 52px);overflow:visible;max-width:none}
.gauge .sun line{stroke-width:2.2;opacity:.18;transition:opacity .35s var(--ease-out)}
.gauge .sun line.lit{opacity:1}
.live .simmer:not(.holding) .gauge::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--accent-muted);animation:gauge-pulse 3.2s ease-out infinite;animation-delay:-1s}
.famille.done .gauge::before{display:none}
@keyframes gauge-pulse{0%{transform:scale(.9);opacity:.9}100%{transform:scale(1.35);opacity:0}}
.simmer-hint{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:94px;text-align:center}
.simmer-hint .how{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.simmer-hint .done{font-family:var(--f-display);font-size:26px;color:var(--text-primary);opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.famille.done .simmer-hint .how{opacity:0}
.famille.done .simmer-hint .done{opacity:1;transform:none}

.plates{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px);margin-top:clamp(64px,9vh,110px)}
.plate{text-align:center}
.plate .disc{position:relative;width:min(240px,62vw);aspect-ratio:1;margin:0 auto 26px}
.plate .disc img{position:absolute;inset:7%;width:86%;height:86%;border-radius:50%;object-fit:cover;filter:brightness(.58) saturate(.8);transition:filter 1.2s var(--ease-out),transform 1.2s var(--ease-out)}
.plate .disc svg{position:absolute;inset:0;width:100%;height:100%}
.plate .disc circle{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-dasharray:302;stroke-dashoffset:302;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset 1.4s var(--ease-out)}
.plate h3{font-family:var(--f-display);font-size:clamp(26px,2.2vw,32px);line-height:1.15;margin-bottom:10px}
.plate p{color:var(--text-secondary);max-width:28ch;margin:0 auto 12px;font-size:.95em}
.famille.done .plate .disc img{filter:none;transform:scale(1.02)}
.famille.done .plate .disc circle{stroke-dashoffset:0}
.famille.done .plate:nth-child(2) .disc img,.famille.done .plate:nth-child(2) .disc circle{transition-delay:.35s}
.famille.done .plate:nth-child(3) .disc img,.famille.done .plate:nth-child(3) .disc circle{transition-delay:.7s}

/* La maison */
.maison{padding-left:0;padding-right:0}
.maison .banner{position:relative;min-height:min(76vh,820px);display:flex;align-items:center;overflow:hidden;z-index:0}
.maison .banner > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% 50%;z-index:0}
.maison .banner::before,.maison .banner::after{z-index:1}
.maison .banner .copy{z-index:2}  /* photo, puis voile, puis texte : le voile passait sous la photo */
.maison .banner::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,13,12,.94) 0,rgba(10,13,12,.82) 30%,rgba(10,13,12,.45) 52%,rgba(10,13,12,.06) 74%),linear-gradient(to bottom,rgba(10,13,12,.7) 0,rgba(10,13,12,.25) 30%,transparent 46%),linear-gradient(to top,var(--canvas) 0,transparent 26%)}
.maison .banner::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-40%;width:28%;background:linear-gradient(100deg,transparent,rgba(255,236,214,.07),transparent);transform:translateX(0) skewX(-12deg);opacity:0}
.live.maison .banner::after{animation:sweep 11s var(--ease-soft) infinite;animation-delay:-3s}
@keyframes sweep{0%{transform:translateX(0) skewX(-12deg);opacity:0}15%{opacity:1}55%{transform:translateX(560%) skewX(-12deg);opacity:0}100%{transform:translateX(560%) skewX(-12deg);opacity:0}}
.maison .banner .copy{position:relative;padding:clamp(80px,12vh,140px) var(--gutter);max-width:720px;text-shadow:0 2px 18px rgba(5,7,6,.7)}
.maison .banner .copy p{color:#E3DED5;max-width:44ch}
.maison .below{display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,6vw,90px);align-items:center;padding:0 var(--gutter);max-width:1240px;margin:-120px auto 0;position:relative;z-index:1}  /* passe devant la photo de la bannière */
.octa{position:relative;width:min(380px,74vw);aspect-ratio:1}
.octa img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;clip-path:polygon(29.3% 0,70.7% 0,100% 29.3%,100% 70.7%,70.7% 100%,29.3% 100%,0 70.7%,0 29.3%)}
.octa svg{position:absolute;inset:-14px;width:calc(100% + 28px);height:calc(100% + 28px);max-width:none}
.octa polygon{fill:none;stroke:var(--accent-line);stroke-width:1.2;stroke-dasharray:1400;stroke-dashoffset:1400;transition:stroke-dashoffset 2.2s var(--ease-out)}
.octa.in polygon{stroke-dashoffset:0}
.quote{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(30px,3.4vw,48px);line-height:1.18;margin:0 0 16px;max-width:20ch}
.quote-by{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.facts{display:flex;flex-wrap:wrap;gap:10px 28px;list-style:none;padding:0;margin:34px 0 0}
.facts li{display:flex;align-items:baseline;gap:10px;font-size:15px;letter-spacing:.06em;color:var(--text-primary)}
.facts li::before{content:"";width:7px;height:7px;background:var(--accent);clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);flex:none;transform:translateY(-2px)}

/* Le lunch : la porcelaine */
.lunch{background:var(--porcelain);color:var(--ink)}
.lunch::before{content:"";position:absolute;inset:clamp(10px,1.6vw,22px);border:1px solid rgba(154,90,46,.5);pointer-events:none}
.lunch .wrap{display:grid;grid-template-columns:.9fr 1.3fr;gap:clamp(36px,6vw,96px);align-items:center}
.lunch .label{color:var(--accent-ink)}
.lunch .section-title .price{font-size:1em;color:var(--accent-ink)}
.lunch p{color:var(--ink-2);max-width:40ch}
.lunch .socials{display:flex;gap:22px;flex-wrap:wrap;margin:26px 0 8px}
.lunch .socials a{color:var(--ink);border-bottom-color:rgba(22,26,25,.35)}
.lunch .socials a:hover{color:var(--accent-ink);border-color:var(--accent-ink)}
.lunch .note{font-family:var(--f-serif);font-style:italic;font-size:1.3em;color:var(--ink);margin-top:20px}
.posters{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);align-items:start}
.poster-card{position:relative;background:#FCFAF6;border:1px solid rgba(154,90,46,.6);padding:26px 18px 22px;text-align:center;box-shadow:0 18px 40px rgba(22,26,25,.12);
  transition:opacity 1s var(--ease-out),transform .8s var(--ease-out),box-shadow .6s var(--ease-out)}
.poster-card:nth-child(1){transform:rotate(-2.2deg) translateY(18px)}
.poster-card:nth-child(3){transform:rotate(2.2deg) translateY(18px)}
.poster-card:hover{transform:rotate(0) translateY(-4px);box-shadow:0 26px 50px rgba(22,26,25,.18)}
.poster-card .word{width:72%;margin:0 auto 14px;color:var(--ink)}
.poster-card .tag{font-weight:500;letter-spacing:.32em;font-size:12px;color:var(--accent-ink);text-transform:uppercase}
.poster-card .tag.big{font-size:17px;letter-spacing:.34em;margin-top:6px}
.poster-card .tag.small{font-size:10.5px;letter-spacing:.3em;display:block;margin-top:2px}
.poster-card hr{width:36px;border:0;height:1px;background:var(--accent-ink);margin:14px auto;position:relative;overflow:hidden}
.live .poster-card hr::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff,transparent);transform:translateX(-100%);animation:sheen 7s var(--ease-soft) infinite}
.poster-card:nth-child(2) hr::after{animation-delay:-2.3s}.poster-card:nth-child(3) hr::after{animation-delay:-4.6s}
@keyframes sheen{0%,70%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.poster-card .dish{font-size:15.5px;line-height:1.35;color:var(--ink);font-weight:400;margin:6px 0 0}
.poster-card .p24{font-family:var(--f-serif);font-weight:500;font-size:30px;color:var(--accent-ink);margin:4px 0 8px}
.poster-card .mono{width:34px;height:34px;margin:0 auto;color:var(--ink)}
.posters-cap{grid-column:1/-1;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);text-align:center;margin-top:22px}

/* La carte */
.carte .top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(40px,6vh,70px)}
.carte .cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,110px)}
.course{margin-bottom:46px}
.course h3{font-family:var(--f-body);font-weight:500;font-size:13px;letter-spacing:.26em;text-transform:uppercase;color:var(--accent);margin-bottom:18px;display:flex;align-items:center;gap:14px}
.course h3::after{content:"";flex:1;height:1px;background:var(--line)}
.item{display:flex;align-items:baseline;gap:12px;padding:11px 0}
.item .n{font-weight:300;font-size:1.02em;line-height:1.4}
.item .dots{flex:1;min-width:24px;border-bottom:1px dotted rgba(241,236,227,.28);transform:translateY(-5px)}
.item .price{font-size:1.18em}
.carte .drinks{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;border-top:1px solid var(--line);padding-top:38px;margin-top:10px}
.carte .drinks p{margin:0;color:var(--text-secondary);max-width:52ch}
.pdfs{display:flex;flex-wrap:wrap;gap:12px 22px}
.allergy{margin-top:28px;font-family:var(--f-serif);font-style:italic;font-size:1.25em;color:var(--text-primary)}

/* Les avis et les questions */
.avis .grid{display:grid;grid-template-columns:auto 1fr;gap:clamp(40px,7vw,120px);align-items:center}
.score{text-align:center;position:relative;padding:20px 30px}
.score .big{font-family:var(--f-serif);font-weight:500;font-size:clamp(96px,11vw,150px);line-height:.9;color:var(--text-primary)}
.score .big small{font-size:.32em;color:var(--text-secondary)}
.score .stars{display:flex;justify-content:center;gap:6px;margin:16px 0 10px;color:var(--accent)}
.score .stars svg{width:20px;height:20px}
.score::before{content:"";position:absolute;inset:-30%;background:radial-gradient(closest-side,rgba(194,122,71,.2),transparent);opacity:.5;z-index:-1}
.live .score::before{animation:glow-pulse 6s ease-in-out infinite;animation-delay:-2s}
@keyframes glow-pulse{0%,100%{opacity:.35}50%{opacity:.85}}
.score .src{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.quotes{display:grid;gap:30px}
.quotes figure{margin:0;padding-left:26px;border-left:1px solid var(--accent-line)}
.quotes blockquote{margin:0 0 8px;font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(23px,2vw,29px);line-height:1.3}
.quotes figcaption{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary)}
.faq{max-width:860px;margin:clamp(90px,12vh,140px) auto 0}
.faq h2{font-family:var(--f-display);font-size:clamp(32px,3.4vw,46px);margin-bottom:24px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 2px;font-size:1.08em;font-weight:400}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{position:relative;width:14px;height:14px;flex:none}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.4px;background:var(--accent);transition:transform .45s var(--ease-out)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq details p{color:var(--text-secondary);padding:0 2px 22px;margin:0;max-width:64ch}
.faq details[open] p{animation:faq-in .5s var(--ease-out)}
@keyframes faq-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Réserver */
.reserver{overflow:hidden}
.reserver .bg{position:absolute;inset:0;pointer-events:none}
.reserver .bg img{position:absolute;right:0;top:0;width:min(62%,980px);height:100%;object-fit:cover;object-position:62% 50%;opacity:.85;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 46%);mask-image:linear-gradient(90deg,transparent 0,#000 46%)}
.reserver .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--canvas) 0,transparent 16%,transparent 84%,var(--canvas) 100%)}
.bigsun{position:absolute;left:22%;top:50%;width:min(1100px,130vw);aspect-ratio:1;transform:translate(-50%,-50%);color:var(--accent);opacity:.16;pointer-events:none}
.bigsun g{transform-origin:50% 50%}
.live .bigsun g{animation:turn 90s linear infinite}
@keyframes turn{to{transform:rotate(360deg)}}
.bigsun line{stroke:currentColor;stroke-width:1;stroke-linecap:round}
.reserver .wrap{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.reserver .call{margin:8px 0 40px}
.reserver .call .btn{font-size:15px;min-height:60px;padding:18px 34px}
.form{background:rgba(23,29,27,.88);border:1px solid var(--line);padding:clamp(22px,3vw,38px);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);max-width:640px}
.form h3{font-family:var(--f-display);font-size:30px;margin-bottom:20px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.field{display:flex;flex-direction:column;gap:7px}
.field.wide{grid-column:1/-1}
.field label{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:12px 14px;background:rgba(15,19,18,.85);border:1px solid rgba(241,236,227,.34);color:var(--text-primary);border-radius:0;font-weight:300;
  transition:border-color .3s var(--ease-out),background-color .3s var(--ease-out)}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);background:rgba(15,19,18,.98)}
.field input::placeholder,.field textarea::placeholder{color:rgba(163,171,166,.7)}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat}
input[type="date"]{color-scheme:dark}
.form .actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:22px}
.form .micro{font-size:14px;color:var(--text-secondary);margin:16px 0 0;max-width:52ch}
.form .ok{display:none;margin-top:18px;padding:16px 18px;border-left:2px solid var(--accent);background:rgba(194,122,71,.08);font-size:15.5px}
.form.sent .ok{display:block;animation:faq-in .6s var(--ease-out)}
.form .err{color:#E9A07A;font-size:14px;margin:10px 0 0;min-height:1em}
.infos{list-style:none;padding:0;margin:0;display:grid;gap:18px;max-width:420px}
.infos li{display:grid;gap:3px}
.infos .k{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.infos a{text-decoration:none;border-bottom:1px solid var(--line-strong)}
.infos a:hover{border-color:var(--accent)}
.fireflies{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.fireflies i{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;background:#F6C68F;box-shadow:0 0 10px 2px rgba(246,198,143,.55);opacity:0}
.live .fireflies i{animation:fly 14s linear infinite}
@keyframes fly{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:.85}80%{opacity:.6}100%{transform:translate3d(var(--dx,20px),-82vh,0);opacity:0}}

/* Pied de page */
.foot{border-top:1px solid var(--line);padding:56px var(--gutter) 40px}
.foot .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px;align-items:start}
.foot .brand .mono{width:44px;height:44px}
.foot h4{margin:0 0 12px;font-weight:500;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.foot p,.foot a{font-size:15px;color:var(--text-secondary);text-decoration:none;margin:0 0 6px;display:block}
.foot a:hover{color:var(--text-primary)}
.foot .copy{grid-column:1/-1;border-top:1px solid var(--line);padding-top:22px;margin-top:10px;font-size:13px;color:var(--text-secondary)}

/* Pause des animations : hors écran et onglet caché */
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* ---------- Petits écrans ---------- */
@media (max-width:980px){
  .famille .head,.lunch .wrap,.reserver .wrap,.avis .grid{grid-template-columns:1fr}
  .maison .below{grid-template-columns:1fr;margin-top:40px;justify-items:start}
  .maison .below .octa{justify-self:center}
  .carte .cols{grid-template-columns:1fr;gap:0}
  .foot .wrap{grid-template-columns:1fr 1fr}
  .reserver .bg img{width:100%;opacity:.28;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent)}
  .bigsun{left:50%;top:22%}
}
@media (max-width:720px){
  .plates{grid-template-columns:1fr;gap:56px}
  .posters{grid-template-columns:1fr;max-width:340px;margin:0 auto}
  .poster-card:nth-child(1),.poster-card:nth-child(3),.poster-card.reveal.in:nth-child(1),.poster-card.reveal.in:nth-child(3){transform:none}
  .fields{grid-template-columns:1fr}
  .carte .drinks{grid-template-columns:1fr}
  .foot .wrap{grid-template-columns:1fr}
  .score{justify-self:start;text-align:left;padding:0}
  .score .stars{justify-content:flex-start}
  .maison .banner::before{background:linear-gradient(to top,var(--canvas) 0,rgba(10,13,12,.78) 45%,rgba(10,13,12,.35) 100%)}
}

/* ---------- La galerie ---------- */
.galerie .top{max-width:760px;margin-bottom:clamp(40px,6vh,64px)}
.galerie .lede{margin:0}
.g-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;gap:clamp(8px,1vw,14px)}
.g-item{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--panel);border-radius:2px}
.g-item.big{grid-column:span 2;grid-row:span 2}
.g-open{display:block;position:relative;width:100%;height:100%;color:inherit;text-decoration:none;cursor:zoom-in;outline:none}
.g-open img{width:100%;height:100%;object-fit:cover;filter:brightness(.92) saturate(.95);transition:transform 1.4s var(--ease-out),filter .7s var(--ease-out)}
.g-open:hover img,.g-open:focus-visible img{transform:scale(1.045);filter:none}
.g-open:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}
.g-cap{position:absolute;left:0;right:0;bottom:0;padding:44px 16px 14px;background:linear-gradient(to top,rgba(6,9,8,.86),rgba(6,9,8,0));font-size:14px;line-height:1.35;letter-spacing:.02em;color:var(--text-primary);opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);pointer-events:none}
.g-open:hover .g-cap,.g-open:focus-visible .g-cap{opacity:1;transform:none}
.g-item.big .g-cap{font-size:16px;padding:64px 22px 18px}
@media (hover:none){.g-cap{opacity:1;transform:none;padding:34px 10px 9px;font-size:12.5px}}
@media (max-width:1023px){.g-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.g-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Grande vue d'une photo */
html.g-lock,html.g-lock body{overflow:hidden}
.g-box{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#070A09;color:var(--text-primary);overflow:hidden}
.g-box::backdrop{background:transparent}
.g-box[open]{display:flex;align-items:center;justify-content:center;animation:g-in .45s var(--ease-out)}
@keyframes g-in{from{opacity:0}}
.g-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:16px;padding:64px 92px 28px;max-width:100%}
.g-fig img{display:block;max-width:min(100%,1600px);max-height:calc(100vh - 170px);max-height:calc(100dvh - 170px);width:auto;height:auto;box-shadow:0 30px 90px rgba(0,0,0,.55)}
.g-fig figcaption{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(18px,1.6vw,22px);line-height:1.3;text-align:center}
.g-count{position:absolute;top:30px;left:30px;margin:0;font-size:12px;letter-spacing:.24em;color:var(--text-secondary)}
.g-btn{position:absolute;display:grid;place-items:center;width:52px;height:52px;padding:0;border-radius:50%;border:1px solid rgba(241,236,227,.3);background:rgba(15,19,18,.55);color:var(--text-primary);font:300 22px/1 var(--f-body);cursor:pointer;transition:border-color .3s var(--ease-out),background-color .3s var(--ease-out)}
.g-btn:hover,.g-btn:focus-visible{border-color:var(--accent);background-color:rgba(194,122,71,.18);outline:none}
.g-prev{left:22px;top:50%;margin-top:-26px}
.g-next{right:22px;top:50%;margin-top:-26px}
.g-close{top:18px;right:20px}
@media (max-width:700px){
  .g-fig{padding:70px 12px 100px}
  .g-fig img{max-height:calc(100vh - 240px);max-height:calc(100dvh - 240px)}
  .g-prev,.g-next{top:auto;bottom:24px;margin-top:0}
  .g-prev{left:calc(50% - 66px)}
  .g-next{right:calc(50% - 66px)}
}

/* ---------- Mouvement réduit : états finaux, rien ne bouge ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important}
  body::before{display:none}
  .reveal{opacity:1;transform:none}
  .burst{opacity:1;transform:none}
  .octa polygon{stroke-dashoffset:0}
  .poster-card:nth-child(1),.poster-card:nth-child(3){transform:none}
}
body.rm .reveal{opacity:1;transform:none}
body.rm .burst{opacity:1;transform:none}
body.rm .octa polygon{stroke-dashoffset:0}