/* L'Officine, atelier de création : direction artistique v4 (écrin du logo, Pantone 0C5059, cuivre) */
@font-face{font-family:'Bodoni Moda';src:url('/assets/fonts/bodoni-moda-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Bodoni Moda';src:url('/assets/fonts/bodoni-moda-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Bodoni Moda';src:url('/assets/fonts/bodoni-moda-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/assets/fonts/instrument-sans-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/assets/fonts/instrument-sans-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --nuit:#0C5059; --profond:#0A4750; --abysse:#06343A; --vert:#0C5059; --creme:#F1EBE0; --lin:#E6DCCB; --papier:#EDE4D4; --blanc:#FAF6EF;
  --laiton:#C48A60; --laiton-c:#E0B596; --encre:#122428; --doux:#5B6B6C; --trait:rgba(18,36,40,.14); --trait-c:rgba(241,235,224,.18); --cuivre-trait:rgba(196,138,96,.55);
  --serif:'Bodoni Moda',Didot,'Times New Roman',serif; --sans:'Instrument Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.19,1,.22,1); --ease-io:cubic-bezier(.77,0,.18,1);
  --marge:clamp(20px,4vw,64px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:var(--sans);font-size:15.5px;line-height:1.6;background:var(--creme);color:var(--encre);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.fige{overflow:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--laiton);color:var(--nuit)}
:focus-visible{outline:1px solid var(--laiton);outline-offset:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}
.cadre-l{padding-inline:var(--marge)}
.sombre{background:var(--nuit);color:var(--creme)}
.vert{background:var(--vert);color:var(--creme)}

/* ---------- Typographie ---------- */
.d1,.d2,.d3{font-family:var(--serif);font-weight:400;letter-spacing:-.02em}
.d1{font-size:clamp(52px,9vw,150px);line-height:.92}
.d2{font-size:clamp(40px,6vw,96px);line-height:.98}
.d3{font-size:clamp(28px,3.2vw,46px);line-height:1.08;letter-spacing:-.01em}
.it{font-style:italic}
.note{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--laiton)}
.lead{font-size:clamp(17px,1.35vw,20px);line-height:1.55;max-width:34em}
.doux{color:var(--doux)}
.sombre .doux,.vert .doux{color:rgba(239,232,219,.62)}
.prose p+p{margin-top:1em}
.lignes .ln{display:block;overflow:hidden;padding-bottom:.06em}
.lignes .ln>span{display:block}

/* ---------- Liens et boutons ---------- */
.cta{display:inline-flex;align-items:center;gap:14px;font-size:14px;font-weight:500;letter-spacing:.01em;padding:18px 28px;border-radius:100px;position:relative;overflow:hidden;isolation:isolate;transition:color .5s var(--ease)}
.cta::before{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;transform:translateY(101%);transition:transform .6s var(--ease)}
.cta:hover::before{transform:none}
.cta .fl{width:18px;height:10px;flex:none;transition:transform .5s var(--ease)}
.cta:hover .fl{transform:translateX(4px)}
.cta.plein{background:var(--laiton);color:var(--nuit)}
.cta.plein::before{background:var(--creme)}
.cta.encre{background:var(--nuit);color:var(--creme)}
.cta.encre::before{background:var(--vert)}
.cta.ligne{box-shadow:inset 0 0 0 1px currentColor}
.cta.ligne::before{background:var(--laiton)}
.cta.ligne:hover{color:var(--nuit);box-shadow:inset 0 0 0 1px var(--laiton)}
.cta[disabled]{opacity:.4;pointer-events:none}
.souligne{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px;transition:background-size .6s var(--ease)}
.souligne:hover{background-size:0 1px;background-position:100% 100%}

/* ---------- Curseur ---------- */
.curseur{position:fixed;top:0;left:0;z-index:600;pointer-events:none;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--laiton);display:flex;align-items:center;justify-content:center;transition:width .5s var(--ease),height .5s var(--ease),margin .5s var(--ease),background .3s,opacity .3s;opacity:0}
.curseur span{font-size:12px;font-weight:500;color:var(--nuit);opacity:0;transition:opacity .3s}
.curseur.grand{width:92px;height:92px;margin:-46px 0 0 -46px}
.curseur.grand span{opacity:1}
@media(hover:none),(pointer:coarse){.curseur{display:none}}

/* ---------- Mur d'age et rideau ---------- */
#age{position:fixed;inset:0;z-index:500;background:var(--nuit);color:var(--creme);display:flex;flex-direction:column;justify-content:space-between;padding:28px var(--marge)}
#age .haut{display:flex;justify-content:space-between;font-size:13px;color:rgba(239,232,219,.55)}
#age .centre{display:flex;flex-direction:column;align-items:center;text-align:center;gap:34px}
#age img{width:min(150px,36vw)}
#age h2{max-width:13em}
#age .choix{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
#age .bas{font-size:12.5px;color:rgba(239,232,219,.45);text-align:center}
#ageRefus{font-family:var(--serif);font-style:italic;color:var(--laiton-c);font-size:18px}
#age.part{transform:translateY(-100%);transition:transform 1.2s var(--ease-io)}
#rideau{position:fixed;inset:0;z-index:450;background:var(--nuit);pointer-events:none;transform:translateY(100%)}
#rideau.tombe{transform:none;transition:transform .7s var(--ease-io)}
#rideau.leve{transform:translateY(-100%);transition:transform .9s var(--ease-io)}
#rideau.net{transform:translateY(100%);transition:none}
#rideau .mot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--serif);font-size:clamp(30px,4vw,54px);color:var(--laiton-c);font-style:italic;opacity:0;transition:opacity .4s .25s}
#rideau.tombe .mot{opacity:1}

/* ---------- Navigation ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:22px var(--marge);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:var(--creme);transition:transform .7s var(--ease),color .4s,padding .5s var(--ease)}
.nav::before{content:'';position:absolute;inset:0;background:var(--creme);transform:translateY(-100%);transition:transform .6s var(--ease);z-index:-1;border-bottom:1px solid var(--trait)}
.nav.fond{color:var(--encre);padding-block:14px}
.nav.fond::before{transform:none}
.nav.cache{transform:translateY(-100%)}
.nav.clair{color:var(--encre)}
.logo-nav{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:22px;letter-spacing:.01em;justify-self:start}
.logo-nav svg{width:13px;height:24px}
.logo-nav svg path{stroke:var(--laiton);stroke-width:1.4;fill:none}
.menu{display:flex;gap:30px}
.menu a{font-size:14px;position:relative;padding:6px 0}
.menu a::after{content:'';position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.menu a:hover::after,.menu a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.outils{justify-self:end;display:flex;align-items:center;gap:8px}
.btn-panier{display:flex;align-items:center;gap:10px;font-size:14px;padding:9px 16px;border-radius:100px;box-shadow:inset 0 0 0 1px currentColor;transition:background .3s,color .3s}
.btn-panier:hover{background:var(--laiton);color:var(--nuit);box-shadow:inset 0 0 0 1px var(--laiton)}
.btn-panier .nb{min-width:18px;text-align:center;font-variant-numeric:tabular-nums}
.btn-panier.bump{animation:bump .6s var(--ease)}
@keyframes bump{35%{transform:scale(1.12)}}
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center}
.burger i{display:block;width:22px;height:1px;background:currentColor;box-shadow:0 6px 0 currentColor;transform:translateY(-3px)}
@media(max-width:1020px){.menu{display:none}.burger{display:flex}.nav{grid-template-columns:1fr auto}.btn-panier .mot-p{display:none}}

#menuMobile{position:fixed;inset:0;z-index:150;background:var(--nuit);color:var(--creme);padding:100px var(--marge) 40px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease-io);visibility:hidden}
#menuMobile.ouvert{clip-path:inset(0);visibility:visible}
#menuMobile nav a{display:block;font-family:var(--serif);font-size:clamp(38px,10vw,60px);line-height:1.15;overflow:hidden}
#menuMobile nav a span{display:block;transform:translateY(100%);transition:transform .9s var(--ease)}
#menuMobile.ouvert nav a span{transform:none}
#menuMobile nav a[aria-current]{color:var(--laiton-c);font-style:italic}
#menuMobile .pied-m{font-size:13px;color:rgba(239,232,219,.55)}
#menuMobile .fermer{position:absolute;top:22px;right:var(--marge);font-size:14px}

/* ---------- Panier ---------- */
#voilePanier{position:fixed;inset:0;z-index:200;background:rgba(6,52,58,.5);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.5s}
#voilePanier.ouvert{opacity:1;visibility:visible}
#panier{position:fixed;top:10px;right:10px;bottom:10px;z-index:210;width:min(460px,calc(100% - 20px));background:var(--blanc);border-radius:6px;display:flex;flex-direction:column;transform:translateX(calc(100% + 20px));visibility:hidden;transition:transform .8s var(--ease),visibility .8s}
#panier.ouvert{transform:none;visibility:visible}
.p-tete{display:flex;justify-content:space-between;align-items:baseline;padding:26px 28px 18px}
.p-tete h2{font-family:var(--serif);font-weight:400;font-size:34px}
.p-tete button{font-size:13.5px}
.p-corps{flex:1;overflow-y:auto;padding:0 28px}
.p-vide{padding:40px 0;color:var(--doux)}
.p-vide p{font-family:var(--serif);font-size:26px;color:var(--encre);line-height:1.2;margin-bottom:10px}
.p-groupe{font-family:var(--serif);font-style:italic;color:var(--laiton);margin:22px 0 2px}
.p-ligne{display:grid;grid-template-columns:52px 1fr auto;gap:0 16px;padding:16px 0;border-bottom:1px solid var(--trait);align-items:center}
.p-ligne .mini{width:52px;height:64px;border-radius:3px;background:var(--lin);display:flex;align-items:center;justify-content:center;overflow:hidden}
.p-ligne .mini svg{height:52px}
.p-ligne .mini.evt{background:var(--vert);color:var(--laiton-c);font-family:var(--serif);font-size:22px}
.p-ligne .nom{font-family:var(--serif);font-size:18px;line-height:1.2}
.p-ligne .det{font-size:12.5px;color:var(--doux)}
.p-ligne .prix{text-align:right;font-variant-numeric:tabular-nums}
.p-ctrl{display:flex;align-items:center;gap:14px;margin-top:6px;font-size:13px}
.qte{display:inline-flex;align-items:center;gap:2px}
.qte button{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--trait)}
.qte button:hover{box-shadow:inset 0 0 0 1px var(--encre)}
.qte span{min-width:24px;text-align:center}
.retirer{color:var(--doux);text-decoration:underline}
.p-pied{padding:22px 28px 28px;border-top:1px solid var(--trait)}
.p-total{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--serif);font-size:30px}
.p-info{font-size:13px;color:var(--doux);margin:6px 0 18px}
.p-pied .cta{width:100%;justify-content:center}
.bille{position:fixed;z-index:700;width:12px;height:12px;border-radius:50%;background:var(--laiton);pointer-events:none;top:0;left:0}

/* ---------- Apparitions (sans GSAP) ---------- */
.rv{opacity:0;transform:translateY(40px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease);transition-delay:var(--d,0s)}
.rv.vu{opacity:1;transform:none}
.masque{overflow:hidden}
.masque>img,.masque>video{transform:scale(1.25);transition:transform 2s var(--ease)}
.masque.vu>img,.masque.vu>video{transform:scale(1)}
.lignes .ln>span{transform:translateY(110%);transition:transform 1.3s var(--ease);transition-delay:calc(var(--i,0)*90ms + var(--d,0s))}
.lignes.vu .ln>span{transform:none}

/* ================= ACCUEIL ================= */
/* hero : la video, l'ecrin du logo, une phrase, deux portes */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;background:var(--abysse);color:var(--creme)}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 50% 40%,rgba(6,52,58,.15),rgba(6,52,58,.55) 70%),linear-gradient(180deg,rgba(6,52,58,.55) 0%,rgba(6,52,58,0) 26%,rgba(6,52,58,0) 52%,rgba(6,52,58,.92) 100%)}
.embleme{position:absolute;z-index:2;left:50%;top:44%;width:clamp(150px,15vw,230px);transform:translate(-50%,-50%);will-change:transform,opacity}
.embleme img{width:100%;height:auto;clip-path:inset(100% 0 0 0);opacity:0;transform:translateY(24px);transition:clip-path 1.9s var(--ease-io) .2s,opacity 1.2s var(--ease) .2s,transform 1.9s var(--ease) .2s}
body.entre .embleme img{clip-path:inset(0 0 0 0);opacity:1;transform:none}
.hero .couche{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding:0 var(--marge) clamp(28px,5vh,56px)}
.hero-titre{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.5vw,54px);line-height:1.04;letter-spacing:-.015em;max-width:15em}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;flex:none}
.hero .cta.ligne{color:var(--creme)}
body[data-page="/"] .nav:not(.fond) .logo-nav{opacity:0;pointer-events:none}
.logo-nav{transition:opacity .5s}
@media(max-width:760px){.hero .couche{flex-direction:column;align-items:flex-start;gap:22px}.hero-actions{justify-content:flex-start}.embleme{top:38%;width:clamp(130px,38vw,170px)}}

/* manifeste */
.manifeste{padding:clamp(100px,15vw,210px) var(--marge);display:grid;grid-template-columns:repeat(12,1fr);gap:0 20px;align-items:start}
.manifeste .note{grid-column:1/4;padding-top:.6em}
.manifeste .d2{grid-column:4/13;font-size:clamp(34px,4.6vw,74px);line-height:1.04}
.manifeste .d2 .mot{opacity:.14;transition:opacity .4s}
.manifeste .d2 .mot.lu{opacity:1}
.manifeste .vignettes{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:20px;margin-top:clamp(60px,9vw,130px)}
.manifeste .v1{grid-column:2/6;aspect-ratio:4/5;border-radius:999px 999px 4px 4px}
.manifeste .v2{grid-column:7/13;aspect-ratio:16/11;border-radius:4px;margin-top:18vh}
.manifeste .v1 img,.manifeste .v2 img{width:100%;height:118%;object-fit:cover}
.manifeste .legende{grid-column:7/11;margin-top:28px}
@media(max-width:800px){.manifeste .note,.manifeste .d2{grid-column:1/-1}.manifeste .note{margin-bottom:24px}.manifeste .v1{grid-column:1/8}.manifeste .v2{grid-column:5/13;margin-top:-14vh}.manifeste .legende{grid-column:1/-1;margin-top:24px}}

/* ecrin : la forme du logo (capsule, double filet cuivre, deux losanges) */
.cadre{position:relative;display:block;padding:7px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--cuivre-trait)}
.ecrin{position:relative;display:block;border-radius:999px;overflow:hidden;background:var(--papier);box-shadow:inset 0 0 0 1px var(--cuivre-trait);isolation:isolate}
.losange{position:absolute;top:50%;width:9px;height:9px;margin-top:-4.5px;border:1px solid var(--laiton);background:inherit;transform:rotate(45deg);z-index:3}
.losange.g{left:-4px}.losange.d{right:-4px}
.sombre .losange{background:var(--nuit)}
.ecrin img.flacon{position:absolute;bottom:7%;left:50%;height:64%;width:auto;max-width:none;mix-blend-mode:multiply;transform-origin:50% 100%}
.ecrin img.ambiance{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ecrin .veille{position:absolute;left:50%;top:50%;width:18%;height:auto;transform:translate(-50%,-50%);opacity:.5}
.ecrin.rempli .veille{display:none}

/* etagere des rayons */
.etagere{padding:clamp(90px,11vw,160px) var(--marge) clamp(90px,10vw,150px)}
.etagere .entete-r{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:clamp(50px,6vw,90px)}
.niches{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,2vw,34px)}
.niche{display:flex;flex-direction:column;align-items:center;text-align:center}
.niche .ecrin{aspect-ratio:5/8;background:var(--papier)}
.niche .cadre{width:100%;transition:box-shadow .6s}
.niche .flacon{transition:transform 1.1s var(--ease),filter .6s}
.niche .flacon.f0{transform:translateX(-50%)}
.niche .flacon.f1{transform:translateX(-96%) scale(.84);z-index:-1}
.niche .flacon.f2{transform:translateX(-4%) scale(.84);z-index:-1}
.niche:hover .flacon.f0{transform:translateX(-50%) translateY(-5%)}
.niche:hover .flacon.f1{transform:translateX(-112%) scale(.8) rotate(-4deg)}
.niche:hover .flacon.f2{transform:translateX(12%) scale(.8) rotate(4deg)}
.niche .ambiance{transition:transform 1.4s var(--ease)}
.niche:hover .ambiance{transform:scale(1.06)}
.niche:hover .cadre{box-shadow:inset 0 0 0 1px var(--laiton)}
.n-nom{font-family:var(--serif);font-size:clamp(21px,1.75vw,28px);line-height:1.1;margin-top:22px}
.n-nb{font-size:13px;color:rgba(241,235,224,.6);margin-top:6px}
@media(max-width:900px){.etagere .entete-r{flex-direction:column;align-items:flex-start}.niches{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(var(--marge)*-1);padding:0 var(--marge)}.niches::-webkit-scrollbar{display:none}.niche{flex:none;width:52vw;max-width:240px;scroll-snap-align:start}}

/* piece de l'atelier */
.piece{display:grid;grid-template-columns:repeat(12,1fr);gap:40px 20px;align-items:center;padding:clamp(100px,13vw,190px) var(--marge)}
.piece-visuel{grid-column:2/6}
.piece-visuel .ecrin{aspect-ratio:5/8}
.piece-visuel .ecrin img{position:absolute;left:0;right:0;bottom:4%;margin:auto;height:84%;width:auto;mix-blend-mode:multiply}
.piece-texte{grid-column:7/12}
.piece-marque{font-size:14px;color:var(--doux);margin-top:30px}
.piece-texte .d2{font-size:clamp(44px,5.4vw,86px);margin-top:4px}
.piece-acc{font-family:var(--serif);font-style:italic;font-size:clamp(19px,1.5vw,23px);color:var(--laiton);margin-top:14px}
.piece-desc{margin-top:26px;max-width:36em;font-size:16px;line-height:1.7}
.piece dl{display:grid;grid-template-columns:130px 1fr;gap:10px 20px;margin:30px 0 38px;padding-top:22px;border-top:1px solid var(--trait);font-size:14px;max-width:36em}
.piece dt{color:var(--doux)}
@media(max-width:860px){.piece-visuel{grid-column:3/11}.piece-texte{grid-column:1/-1}.piece dl{grid-template-columns:110px 1fr}}

/* cuvee : le chai s'ouvre depuis l'ecrin */
.ouverture{position:relative;height:300vh;background:var(--creme)}
.ouverture .scene{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.ouverture .media{position:absolute;inset:0;clip-path:inset(16% 40% 16% 40% round 10vw)}
.ouverture .media video,.ouverture .media img{width:100%;height:100%;object-fit:cover}
.ouverture .media::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(6,52,58,.78),rgba(12,80,89,.55));opacity:var(--voile,0)}
.ouverture .titres{position:relative;z-index:2;text-align:center;color:var(--creme);padding:0 var(--marge);opacity:0}
.ouverture .titres .d1{max-width:10em;margin:0 auto}
.ouverture .titres p{max-width:32em;margin:26px auto 34px;color:var(--creme);font-size:17px}
.ouverture .coins{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 var(--marge);font-family:var(--serif);font-size:clamp(24px,3vw,44px);pointer-events:none}
@media(max-width:800px){.ouverture{height:auto}.ouverture .scene{position:relative;height:90svh}.ouverture .media{clip-path:none}.ouverture .media::after{opacity:1}.ouverture .titres{opacity:1}.ouverture .coins{display:none}}

/* programme */
.programme{padding:clamp(90px,11vw,160px) var(--marge)}
.programme .haut{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.agenda{margin-top:50px;border-top:1px solid var(--trait-c)}
.evt{display:grid;grid-template-columns:150px 1fr 200px auto;gap:28px;align-items:center;padding:30px 0;border-bottom:1px solid var(--trait-c)}
.creme-bloc .agenda,.creme-bloc .evt{border-color:var(--trait)}
.evt .date{font-family:var(--serif);line-height:1}
.evt .date b{font-weight:400;font-size:56px;display:block}
.evt .date span{font-style:italic;color:var(--laiton-c)}
.creme-bloc .evt .date span{color:var(--laiton)}
.evt h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.1}
.evt .fmt{font-size:13px;color:var(--laiton-c);margin-bottom:6px}
.creme-bloc .evt .fmt{color:var(--laiton)}
.evt .desc{font-size:14px;opacity:.7;margin-top:6px;max-width:34em}
.evt .places{font-size:13.5px}
.jauge{height:2px;background:var(--trait-c);margin-top:8px}
.creme-bloc .jauge{background:var(--trait)}
.jauge i{display:block;height:100%;background:var(--laiton)}
.evt.complet{opacity:.5}
@media(max-width:900px){.evt{grid-template-columns:90px 1fr}.evt .places,.evt .cta,.evt .etat{grid-column:2}.evt .date b{font-size:42px}}
.attente{margin-top:50px;padding:60px 0;border-top:1px solid var(--trait)}
.sombre .attente{border-color:var(--trait-c)}

/* click & collect en trois temps */
.retrait{padding:clamp(100px,12vw,180px) var(--marge);background:var(--papier)}
.temps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,50px);margin:clamp(50px,6vw,90px) 0 clamp(40px,5vw,70px);position:relative;padding-top:48px}
.temps::before{content:'';position:absolute;top:18px;left:0;right:0;height:1px;background:var(--trait)}
.temps::after{content:'';position:absolute;top:18px;left:0;right:0;height:1px;background:var(--laiton);transform:scaleX(var(--fil,1));transform-origin:left}
.temps li{position:relative}
.t-n{position:absolute;top:-48px;left:0;width:37px;height:37px;border-radius:50%;background:var(--papier);box-shadow:inset 0 0 0 1px var(--laiton);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:17px;color:var(--laiton);z-index:1}
.temps h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.8vw,44px);line-height:1;margin-top:18px}
.temps p{margin-top:12px;color:var(--doux);max-width:22em}
@media(max-width:760px){.temps{grid-template-columns:1fr;padding:0 0 0 56px;gap:40px}.temps::before,.temps::after{top:0;bottom:0;left:18px;right:auto;width:1px;height:auto;transform:scaleY(var(--fil,1));transform-origin:top}.t-n{top:0;left:-56px}.temps h3{margin-top:2px}}

/* visite */
.visite{display:grid;grid-template-columns:1.1fr 1fr;min-height:90vh}
.visite .photo{position:relative;overflow:hidden}
.visite .photo img{position:absolute;inset:0;width:100%;height:120%;object-fit:cover}
.visite .infos{padding:clamp(60px,8vw,120px) var(--marge);display:flex;flex-direction:column;justify-content:space-between;gap:50px}
.infos dl{display:grid;grid-template-columns:120px 1fr;gap:18px 20px;border-top:1px solid var(--trait);padding-top:26px}
.infos dt{font-family:var(--serif);font-style:italic;color:var(--laiton)}
@media(max-width:860px){.visite{grid-template-columns:1fr}.visite .photo{height:60vh}}

/* ================= PAGES INTERIEURES ================= */
.intro{padding:clamp(130px,16vw,200px) var(--marge) clamp(50px,6vw,80px);display:grid;grid-template-columns:repeat(12,1fr);gap:0 20px;align-items:end}
.intro .fil{grid-column:1/-1;font-size:13px;color:var(--doux);margin-bottom:clamp(40px,6vw,80px)}
.intro .fil a:hover{color:var(--encre)}
.intro .d1{grid-column:1/10}
.intro .lead{grid-column:10/13;padding-bottom:1em}
@media(max-width:900px){.intro .d1,.intro .lead{grid-column:1/-1}.intro .lead{margin-top:30px}}
.bandeau-img{margin:0 var(--marge);height:clamp(320px,72vh,760px);border-radius:4px;position:relative}
.bandeau-img img,.bandeau-img video{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover}

.bloc{padding:clamp(90px,11vw,170px) var(--marge)}
.grille12{display:grid;grid-template-columns:repeat(12,1fr);gap:40px 20px;align-items:start}
.c-note{grid-column:1/4}
.c-texte{grid-column:4/10}
.c-texte-l{grid-column:4/13}
.c-img{grid-column:8/13}
.c-img2{grid-column:1/6}
.c-txt2{grid-column:7/12;align-self:center}
@media(max-width:900px){.grille12>*{grid-column:1/-1!important}}
.img-portrait{aspect-ratio:4/5;border-radius:4px;position:relative}
.img-portrait img,.img-portrait video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

.etapes{margin-top:clamp(50px,6vw,90px);display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--trait-c)}
.etape{padding:34px 26px 10px 0;border-right:1px solid var(--trait-c);margin-right:26px}
.etape:last-child{border:none}
.etape .n{font-family:var(--serif);font-size:clamp(60px,6vw,96px);line-height:1;color:var(--laiton-c)}
.etape h3{font-family:var(--serif);font-weight:400;font-size:26px;margin-top:30px}
.etape p{font-size:14.5px;color:rgba(239,232,219,.66);margin-top:8px}
@media(max-width:900px){.etapes{grid-template-columns:1fr 1fr}.etape:nth-child(2){border:none}}
@media(max-width:560px){.etapes{grid-template-columns:1fr}.etape{border:none;border-bottom:1px solid var(--trait-c);margin:0;padding-right:0;padding-bottom:30px}}

.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:60px}
.format{border-top:1px solid var(--trait-c);padding-top:26px}
.format .d3{margin-bottom:12px}
.format p{color:rgba(239,232,219,.66);font-size:15px}
@media(max-width:800px){.formats{grid-template-columns:1fr}}

.appel{position:relative;padding:clamp(120px,16vw,220px) var(--marge);text-align:center;overflow:hidden;color:var(--creme);background:var(--nuit)}
.appel img{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover;opacity:.45}
.appel .contenu{position:relative;z-index:2}
.appel .d1{max-width:11em;margin:0 auto 44px}

/* ================= CATALOGUE ================= */
.filtres{position:sticky;top:0;z-index:30;background:rgba(239,232,219,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-block:1px solid var(--trait);padding:0 var(--marge);transition:top .7s var(--ease)}
body.nav-visible .filtres{top:var(--h-nav,68px)}
.filtres .rang{display:flex;align-items:center;gap:24px;justify-content:space-between}
.onglets-cat{display:flex;gap:28px;overflow-x:auto;scrollbar-width:none;position:relative}
.onglets-cat::-webkit-scrollbar{display:none}
.onglets-cat button{padding:20px 0;font-size:14.5px;white-space:nowrap;color:var(--doux);transition:color .3s}
.onglets-cat button sup{font-size:10px;margin-left:3px}
.onglets-cat button[aria-pressed="true"],.onglets-cat button:hover{color:var(--encre)}
.onglets-cat .barre{position:absolute;bottom:0;left:0;height:1px;background:var(--encre);transition:transform .6s var(--ease),width .6s var(--ease)}
.filtres .droite{display:flex;align-items:center;gap:16px;flex:none}
.filtres input,.filtres select{background:none;border:none;border-bottom:1px solid var(--trait);padding:8px 0;font:inherit;font-size:14px;color:var(--encre);outline:none}
.filtres input{width:190px}
.filtres input:focus{border-color:var(--encre)}
@media(max-width:800px){.filtres .rang{flex-direction:column;align-items:stretch;gap:0}.filtres .droite{padding-bottom:12px}.filtres input{flex:1;width:auto}}
.cat-infos{display:flex;justify-content:space-between;gap:20px;padding:30px var(--marge) 0;font-size:13.5px;color:var(--doux)}
.demo{padding:14px var(--marge) 0;font-size:13.5px;color:var(--laiton)}
.grille{display:grid;grid-template-columns:repeat(4,1fr);gap:50px 20px;padding:36px var(--marge) clamp(90px,10vw,150px);min-height:70vh;align-content:start}
@media(max-width:1100px){.grille{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.grille{grid-template-columns:1fr 1fr;gap:34px 12px}}
.fiche-c{display:flex;flex-direction:column}
.fiche-c .visuel{position:relative;aspect-ratio:4/5;background:var(--lin);border-radius:3px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;cursor:pointer}
.fiche-c .visuel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.fiche-c .visuel .btl{height:82%;transform:translateY(6%);transition:transform 1s var(--ease)}
.fiche-c:hover .visuel .btl{transform:translateY(2%)}
.fiche-c:hover .visuel img{transform:scale(1.04)}
.fiche-c .ajout{position:absolute;left:12px;right:12px;bottom:12px;padding:13px;border-radius:100px;background:var(--nuit);color:var(--creme);font-size:13.5px;font-weight:500;transform:translateY(calc(100% + 14px));transition:transform .6s var(--ease),background .3s}
.fiche-c .ajout:hover{background:var(--vert)}
.fiche-c:hover .ajout,.fiche-c .ajout:focus-visible{transform:none}
.fiche-c .ajout[disabled]{background:var(--lin);color:var(--doux);box-shadow:inset 0 0 0 1px var(--trait)}
.fiche-c .etiquette-r{position:absolute;top:12px;left:12px;font-size:12px;padding:4px 10px;border-radius:100px;background:var(--creme)}
.fiche-c .bas{display:flex;justify-content:space-between;gap:12px;margin-top:16px;align-items:baseline}
.fiche-c h3{font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.15}
.fiche-c .orig{font-size:13px;color:var(--doux);margin-top:4px}
.fiche-c .prix{font-variant-numeric:tabular-nums;white-space:nowrap}
@media(hover:none){.fiche-c .ajout{transform:none;left:8px;right:8px;bottom:8px;padding:10px 6px;font-size:12.5px}.fiche-c .visuel{align-items:flex-start}.fiche-c .visuel .btl{height:70%;transform:translateY(8%)!important}}
.vide-cat{grid-column:1/-1;padding:60px 0}


/* ================= CONTACT ================= */
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(40px,7vw,120px);padding:20px var(--marge) clamp(90px,10vw,150px)}
@media(max-width:900px){.contact{grid-template-columns:1fr}}
.profils{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 20px}
.profils button{padding:10px 20px;border-radius:100px;box-shadow:inset 0 0 0 1px var(--trait);font-size:14px;transition:.35s}
.profils button[aria-pressed="true"]{background:var(--nuit);color:var(--creme);box-shadow:none}
.champ{position:relative;margin-top:26px}
.champ label{display:block;font-size:13px;color:var(--doux);margin-bottom:4px}
.champ input,.champ select,.champ textarea{width:100%;background:none;border:none;border-bottom:1px solid var(--trait);padding:10px 0;font:inherit;font-size:17px;color:var(--encre);outline:none;border-radius:0;transition:border-color .3s}
.champ textarea{min-height:120px;resize:vertical}
.champ input:focus,.champ select:focus,.champ textarea:focus{border-color:var(--encre)}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
@media(max-width:560px){.deux{grid-template-columns:1fr}}
.cond{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.cond>div{overflow:hidden}
.cond.on{grid-template-rows:1fr}
.retour-form{margin-top:18px;min-height:1.5em}
.retour-form.ok{color:var(--vert)}
.retour-form.ko{color:#8E3A2C}
.carte-maps{margin-top:30px;aspect-ratio:4/3;border-radius:4px;overflow:hidden}
.carte-maps iframe{width:100%;height:100%;border:0;filter:grayscale(.7) contrast(1.05)}
/* plan Google Maps chargé seulement au clic (politique de confidentialité, article 7) */
.carte-charger{width:100%;height:100%;min-height:180px;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:20px;
  color:var(--creme);background:radial-gradient(circle at 50% 27%,var(--laiton-c) 0 4px,rgba(224,181,150,.25) 5px 12px,transparent 13px),repeating-linear-gradient(0deg,transparent 0 38px,rgba(241,235,224,.07) 38px 39px),repeating-linear-gradient(90deg,transparent 0 38px,rgba(241,235,224,.07) 38px 39px),var(--nuit);font:inherit;transition:background-color .3s}
.carte-charger b{font-family:var(--serif);font-weight:400;font-size:clamp(18px,1.6vw,22px);border-bottom:1px solid var(--laiton-c);padding-bottom:2px}
.carte-charger span{font-size:12.5px;opacity:.7}
.carte-charger:hover b,.carte-charger:focus-visible b{color:var(--laiton-c)}

/* ================= LEGAL ================= */
.legal-txt{max-width:760px;padding:0 var(--marge) clamp(90px,10vw,150px);margin-left:calc(25% - var(--marge) / 2)}
@media(max-width:900px){.legal-txt{margin-left:0}}
.legal-txt h2{font-family:var(--serif);font-weight:400;font-size:28px;margin-top:50px}
.legal-txt p,.legal-txt li{color:#3F4F51;margin-top:12px}
.a-completer{background:#F3E3B5;padding:0 4px}

/* ================= PIED ================= */
.pied{background:var(--nuit);color:var(--creme);padding:clamp(80px,9vw,130px) var(--marge) 26px}
.pied .haut{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;padding-bottom:clamp(60px,7vw,100px)}
.pied-marque{display:flex;gap:34px;align-items:center}
.pied-marque .d3{max-width:9em;font-size:clamp(24px,2.3vw,34px)}
.pied h3{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--laiton-c);font-size:17px;margin-bottom:14px}
.pied a{display:block;padding:3px 0;color:rgba(241,235,224,.75);transition:color .3s}
.pied a:hover{color:var(--creme)}
.pied .legal{display:flex;justify-content:space-between;align-items:center;gap:14px 30px;flex-wrap:wrap;font-size:12.5px;color:rgba(241,235,224,.55);padding-top:22px;border-top:1px solid var(--trait-c)}
.pied .legal b{font-weight:400;color:rgba(241,235,224,.85)}
.pied .legal a{display:inline;padding:0}
.liens-l{display:flex;gap:20px;flex-wrap:wrap}
@media(max-width:900px){.pied .haut{grid-template-columns:1fr 1fr}.pied .haut>div:first-child{grid-column:1/-1}}
@media(max-width:520px){.pied-marque{flex-direction:column;align-items:flex-start;gap:24px}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01s!important;animation:none!important}
  .rv,.lignes .ln>span,.marque-geante span{opacity:1!important;transform:none!important}
  .masque>img,.masque>video{transform:none}
  .manifeste .d2 .mot{opacity:1}
  .ouverture{height:auto}.ouverture .scene{position:relative}.ouverture .media{clip-path:none}.ouverture .titres{opacity:1}
  .embleme img{clip-path:none;opacity:1;transform:none}
}
#rideau.sans{transition:none!important}

.intro.compact{padding-bottom:40px}.intro.compact .d1{font-size:clamp(44px,6.4vw,104px)}
.p-accord{display:flex;gap:10px;align-items:flex-start;font-size:13px;margin:-6px 0 16px;cursor:pointer}
.p-accord input{margin-top:3px;accent-color:var(--nuit);width:16px;height:16px;flex:none}
/* page merci */
.recap{margin-top:40px;border-top:1px solid var(--trait);max-width:640px}
.recap .l{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--trait)}
.recap .t{font-family:var(--serif);font-size:26px}
.etapes-merci{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:60px;max-width:960px}
.etapes-merci div{border-top:1px solid var(--trait);padding-top:18px}
.etapes-merci b{font-family:var(--serif);font-weight:400;font-size:22px;display:block;margin-bottom:6px}
@media(max-width:760px){.etapes-merci{grid-template-columns:1fr}}
/* v2 : badges, offres, images d'evenements, lien equipe */
.fiche-c .pastilles,.fiche .pastilles{position:absolute;top:12px;left:12px;right:12px;display:flex;flex-wrap:wrap;gap:6px;z-index:2}
.fiche-c .pastilles .etiquette-r,.fiche .pastilles .etiquette-r{position:static}
.etiquette-r{font-size:12px;padding:4px 10px;border-radius:100px;background:var(--creme)}
.etiquette-r.offre{background:var(--laiton);color:var(--nuit);font-weight:500}
.prix s,.px s{color:var(--doux);font-size:.8em;margin-right:4px}
.offre-txt{font-family:var(--sans);font-style:normal;font-size:13px;background:var(--laiton);color:var(--nuit);padding:3px 10px;border-radius:100px;vertical-align:middle}
.desc-fiche{margin-top:24px;font-size:15px;line-height:1.65}
.evt.avec-img{grid-template-columns:120px 150px 1fr 200px auto}
.evt-img{width:120px;aspect-ratio:4/3;border-radius:3px;overflow:hidden}
.evt-img img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.evt.avec-img{grid-template-columns:90px 1fr}.evt-img{grid-column:1/-1;width:100%;aspect-ratio:16/8}}
.lien-equipe{display:inline-flex!important;align-items:center;gap:6px;opacity:.55;font-size:12.5px}
.lien-equipe:hover{opacity:1}

/* v3 : identite atelier de creation, fiches techniques */
.logo-nav img{width:13px;height:auto;filter:drop-shadow(0 0 0 transparent)}
.logo-nav span{display:flex;flex-direction:column;line-height:1}
.logo-nav small{font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-top:4px}
.logo-pied{width:96px;height:auto;flex:none}
.fiche-c .visuel.detoure,.fiche .visuel.detoure{background:#fff}
.fiche-c .visuel.detoure img,.fiche .visuel.detoure img{object-fit:contain;padding:6% 8%}
.fiche-c .marque-c{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--laiton);margin-bottom:2px}
.fiche-c .en-boutique{font-size:13px;color:var(--doux);white-space:nowrap}
.fiche-c .ajout.voir{background:var(--creme);color:var(--encre);box-shadow:inset 0 0 0 1px var(--trait)}
.p-client{display:flex;flex-direction:column;gap:8px;margin:-4px 0 14px}
.p-client input{width:100%;padding:11px 12px;border:1px solid var(--trait);border-radius:4px;background:#fff;font:inherit;font-size:14px;color:var(--encre);outline:none}
.p-client input:focus{border-color:var(--encre)}
.p-deux{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lignes .w.br{display:block;height:0}
@media(max-width:900px){.niche{width:42vw;max-width:210px}.n-nom{font-size:20px;margin-top:16px}}
.piece-visuel .ecrin img.photo{inset:-9% 0 0;width:100%;height:118%;object-fit:cover;mix-blend-mode:normal}
.niche .flacon.large{height:60%;bottom:9%}

/* ================= FICHE PRODUIT (v4 : l'écrin, panneau défilant) ================= */
.fiche-voile{position:fixed;inset:0;z-index:220;background:rgba(6,52,58,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:stretch;justify-content:center;padding:14px;opacity:0;visibility:hidden;transition:opacity .55s var(--ease),visibility .55s}
.fiche-voile.ouvert{opacity:1;visibility:visible}
.fiche{position:relative;background:var(--blanc);width:min(1200px,100%);height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border-radius:10px;display:grid;grid-template-columns:1.05fr 1fr;align-items:start;transform:translateY(34px) scale(.985);transition:transform .9s var(--ease);scrollbar-width:thin;scrollbar-color:var(--cuivre-trait) transparent}
.fiche-voile.ouvert .fiche,.fiche-voile.anime .fiche{transform:none}
.fiche-voile.anime .fiche{transition:none}
body:has(.fiche-voile.ouvert) .curseur{opacity:0!important}
body.fiche-ouverte{overflow:hidden}

/* colonne visuel : reste en place pendant que la fiche défile */
.fiche .visuel,.fiche .visuel.detoure{--cap-h:calc((100svh - 28px) * .74);--cap:1;position:sticky;top:0;height:calc(100svh - 28px);min-height:0;background:var(--papier);display:block;isolation:isolate;overflow:hidden;cursor:default}
.fiche .visuel::before{content:'';position:absolute;left:50%;top:50%;height:var(--cap-h);aspect-ratio:5/8;transform:translate(-50%,-50%) scaleY(var(--cap));opacity:var(--cap);border-radius:999px;background:#F3ECE0;box-shadow:inset 0 0 0 1px var(--cuivre-trait),0 0 0 8px var(--papier),0 0 0 9px var(--cuivre-trait);z-index:0}
.fiche .visuel::after{content:'';position:absolute;top:50%;left:calc(50% - var(--cap-h) * .3125 - 13px);width:9px;height:9px;margin-top:-4.5px;border:1px solid var(--laiton);background:var(--papier);transform:rotate(45deg) scale(var(--cap));--o:calc((var(--cap-h) * .625 + 17px) * .7071);box-shadow:var(--o) calc(var(--o) * -1) 0 -1px var(--papier),var(--o) calc(var(--o) * -1) 0 0 var(--laiton);z-index:0}
.fiche .visuel img,.fiche .visuel.detoure img{position:absolute;left:50%;top:50%;right:auto;bottom:auto;width:auto;height:calc(var(--cap-h) * .84);max-width:none;padding:0;object-fit:contain;transform:translate(-50%,-50%);mix-blend-mode:multiply;z-index:1}
.fiche .visuel:not(.detoure) img,.fiche .visuel.cadre-photo img{height:var(--cap-h);width:calc(var(--cap-h) * .625);object-fit:cover;border-radius:999px}
.fiche .visuel .btl{position:absolute;left:50%;top:50%;height:calc(var(--cap-h) * .8);transform:translate(-50%,-50%);z-index:1}
.fiche .pastilles{top:22px;left:22px;right:auto;z-index:2}
.poignee{display:none}

/* colonne texte */
.fiche .info{position:relative;min-height:calc(100svh - 28px);padding:0 clamp(28px,4vw,64px);display:flex;flex-direction:column}
.fiche .info::before{content:'';position:sticky;top:0;z-index:3;display:block;height:76px;margin:0 calc(clamp(28px,4vw,64px) * -1) -76px;background:linear-gradient(var(--blanc) 55%,rgba(250,246,239,0));pointer-events:none}
.fiche .fermer{position:sticky;top:0;z-index:4;align-self:flex-end;display:flex;align-items:center;gap:12px;margin-right:calc(clamp(28px,4vw,64px) * -1 + 18px);padding:18px 0 10px 16px;font-size:13.5px;color:var(--encre)}
.fiche .fermer i{position:relative;width:44px;height:44px;border-radius:50%;background:var(--blanc);box-shadow:inset 0 0 0 1px var(--trait);transition:background .4s,box-shadow .4s,transform .6s var(--ease)}
.fiche .fermer i::before,.fiche .fermer i::after{content:'';position:absolute;left:14px;right:14px;top:50%;height:1px;background:currentColor;transform:rotate(45deg)}
.fiche .fermer i::after{transform:rotate(-45deg)}
.fiche .fermer:hover i{background:var(--nuit);color:var(--creme);box-shadow:none;transform:rotate(90deg)}
.fiche .fermer:hover{color:var(--creme)}
.fiche .fermer span{color:var(--encre)}
.f-tete{padding-top:clamp(20px,5vh,60px)}
.fiche .marque-f{font-size:14px;letter-spacing:.01em;text-transform:none;color:var(--doux);margin:0}
.fiche .f-tete .d3{font-size:clamp(40px,4vw,66px);line-height:1;letter-spacing:-.02em;margin-top:8px}
.fiche .f-tete .note{font-size:clamp(19px,1.5vw,23px);margin-top:14px}
.f-bloc{margin-top:38px;padding-top:24px;border-top:1px solid var(--trait)}
.f-bloc h4{font-family:var(--serif);font-style:italic;font-weight:400;font-size:16px;color:var(--laiton);margin-bottom:12px}
.fiche .notes{font-family:var(--serif);font-style:normal;font-size:clamp(22px,1.9vw,28px);line-height:1.3;margin:0}
.fiche .desc-fiche{margin:0;font-size:15.5px;line-height:1.75;max-width:38em}
.fiche dl{display:grid;grid-template-columns:minmax(110px,34%) 1fr;gap:0;margin:0;padding:0;border:0;font-size:14.5px}
.fiche dl dt,.fiche dl dd{padding:11px 0;border-bottom:1px solid var(--trait)}
.fiche dl dt{color:var(--doux)}
.fiche .maison-f{margin-top:38px;padding-top:24px;border-top:1px solid var(--trait);font-size:14.5px;color:var(--doux)}
.fiche .maison-f b{display:block;font-family:var(--serif);font-weight:400;font-style:italic;color:var(--laiton);font-size:16px;margin-bottom:10px}
.fiche .actions{position:sticky;bottom:0;z-index:3;margin:auto calc(clamp(28px,4vw,64px) * -1) 0;padding:18px clamp(28px,4vw,64px) 22px;background:rgba(250,246,239,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--trait);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.fiche .f-tete+*{margin-top:34px}
.fiche .info>.f-bloc:last-of-type,.fiche .info>.maison-f{margin-bottom:48px}
.fiche .actions .px{font-family:var(--serif);font-size:clamp(28px,2.4vw,36px);line-height:1}
.fiche .boutique-f{font-size:14px;color:var(--doux);max-width:20em}
.vol-fiche{position:fixed;z-index:235;pointer-events:none;mix-blend-mode:multiply;will-change:transform}

@media(max-width:760px){
  .fiche-voile{padding:0;align-items:flex-end}
  .fiche{display:block;height:94svh;border-radius:18px 18px 0 0;transform:translateY(100%)}
  .fiche .visuel,.fiche .visuel.detoure{--cap-h:calc(48svh * .82);position:relative;height:48svh}
  .poignee{display:block;position:absolute;top:9px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(18,36,40,.22);z-index:5}
  .fiche .info{min-height:0;padding:0 22px}
  .fiche .info::before{display:none}
  .fiche .fermer{position:fixed;top:calc(6svh + 12px);right:12px;margin:0;padding:0}
  .fiche .fermer span{display:none}
  .f-tete{padding-top:28px}
  .fiche .actions{margin:auto -22px 0;padding:14px 22px calc(14px + env(safe-area-inset-bottom))}
  .fiche .actions .cta{flex:1;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.fiche{transform:none!important}}

/* cartes : la bouteille posée sur le papier, comme dans la fiche */
.fiche-c .visuel.detoure{background:var(--papier)}
.fiche-c .visuel.detoure img{mix-blend-mode:multiply}

/* ================= SELECTION v6 : en-tête court, recherche intelligente ================= */
.tete-sel{padding:clamp(104px,11vw,140px) var(--marge) clamp(22px,2.6vw,34px);display:flex;align-items:baseline;gap:18px 34px;flex-wrap:wrap}
.tete-sel .fil{font-size:13px;color:var(--doux);order:2}
.tete-sel .fil a:hover{color:var(--encre)}
.tete-sel h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.4vw,52px);line-height:1;letter-spacing:-.02em}
.filtres .droite{gap:12px}
.champ-r{position:relative;display:flex;align-items:center}
.champ-r .loupe{position:absolute;left:14px;width:16px;height:16px;color:var(--doux);pointer-events:none}
.filtres .champ-r input{width:clamp(220px,24vw,340px);padding:11px 16px 11px 40px;border:1px solid var(--trait);border-radius:100px;background:var(--blanc);transition:border-color .3s,box-shadow .3s}
.filtres .champ-r input:focus{border-color:var(--laiton);box-shadow:0 0 0 4px rgba(196,138,96,.14)}
.filtres .champ-r input::-webkit-search-cancel-button{cursor:pointer}
.sugg{position:absolute;top:calc(100% + 10px);right:0;width:min(440px,calc(100vw - 2 * var(--marge)));max-height:min(70vh,520px);overflow-y:auto;overscroll-behavior:contain;background:var(--blanc);border-radius:10px;box-shadow:0 0 0 1px var(--trait),0 24px 60px -20px rgba(6,52,58,.35);padding:8px;z-index:40;animation:sg-in .45s var(--ease)}
@keyframes sg-in{from{opacity:0;transform:translateY(-8px)}}
.sg{display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;width:100%;padding:8px 10px;border-radius:7px;text-align:left;transition:background .25s}
.sg:hover,.sg.actif{background:var(--papier)}
.sg-img{width:48px;height:60px;border-radius:24px;overflow:hidden;background:var(--papier);position:relative;isolation:isolate}
.sg-img img{width:100%;height:100%;object-fit:cover}
.sg-img.detoure img{object-fit:contain;mix-blend-mode:multiply;padding:3px}
.sg-txt{min-width:0}
.sg-txt b{display:block;font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sg-txt small{display:block;font-size:12.5px;color:var(--doux);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sg-px{font-size:13.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sg-tout{display:block;width:100%;margin-top:4px;padding:12px;border-top:1px solid var(--trait);font-size:13.5px;color:var(--vert)}
.sg-tout:hover{color:var(--laiton)}
.sg-vide{padding:14px 12px;font-size:14px;color:var(--doux)}
.sg-essai{display:inline-block;margin-top:8px;padding:7px 14px;border-radius:100px;background:var(--nuit);color:var(--creme);font-size:13px}
.vide-cat [data-essai]{font:inherit;color:var(--encre)}
@media(max-width:800px){
  .filtres .droite{padding:0 0 12px}
  .champ-r{flex:1}
  .filtres .champ-r input{width:100%}
  .sugg{left:0;right:auto;width:calc(100vw - 2 * var(--marge))}
  .tri-l select{max-width:120px}
}

/* ================= PAGES INTERIEURES v7 : bandeau d'entree ================= */
.hero-p{position:relative;height:88svh;min-height:560px;overflow:hidden;background:var(--abysse);color:var(--creme);display:flex;align-items:flex-end}
.hero-p.court{height:78svh}
.hero-p video,.hero-p .hp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 60%}
.hero-p::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,52,58,.6) 0%,rgba(6,52,58,.05) 30%,rgba(6,52,58,.3) 55%,rgba(6,52,58,.94) 100%)}
.hp-contenu{position:relative;z-index:2;width:100%;padding:0 var(--marge) clamp(30px,6vh,64px)}
.hero-p .fil{font-size:13px;color:rgba(241,235,224,.7);margin-bottom:clamp(18px,3vh,30px)}
.hero-p .fil a:hover{color:var(--creme)}
.hero-p h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5.6vw,92px);line-height:.98;letter-spacing:-.02em;max-width:12em}
.hp-bas{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap;margin-top:clamp(22px,3.5vh,40px)}
.hp-bas p{max-width:30em;color:rgba(241,235,224,.85);font-size:clamp(15px,1.15vw,18px)}
.hp-actions{display:flex;gap:10px;flex-wrap:wrap}
.hero-p .cta.ligne{color:var(--creme)}

/* cuvee : texte + preuve */
.cuvee-intro{display:grid;grid-template-columns:repeat(12,1fr);gap:50px 20px;align-items:center}
.ci-texte{grid-column:1/8}
.ci-texte .d2{margin-top:14px}
.ci-texte .prose{margin-top:34px}
.preuve{grid-column:9/13;display:flex;flex-direction:column;align-items:center;text-align:center}
.preuve .cadre{width:min(260px,70%)}
.preuve .ecrin{aspect-ratio:5/8}
.preuve .ecrin img{position:absolute;left:0;right:0;bottom:4%;margin:auto;height:84%;width:auto;mix-blend-mode:multiply;transition:transform 1.2s var(--ease)}
.preuve .ecrin img.photo{inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.preuve:hover .ecrin img{transform:scale(1.05)}
.preuve-txt{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:22px}
.preuve-txt b{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.1}
.preuve-txt>span:nth-child(3){font-size:14px;color:var(--doux)}
.preuve-txt .souligne{margin-top:8px;font-size:14px}
@media(max-width:900px){.ci-texte,.preuve{grid-column:1/-1}}

/* cuvee : methode */
.methode{padding:clamp(90px,11vw,170px) var(--marge)}
.m-corps{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,7vw,120px);margin-top:clamp(50px,6vw,90px);align-items:start}
.m-etapes{list-style:none;position:relative;--fil:0}
.m-etapes::before,.m-etapes::after{content:'';position:absolute;left:22px;top:22px;bottom:22px;width:1px;background:var(--trait-c)}
.m-etapes::after{background:var(--laiton);transform:scaleY(var(--fil));transform-origin:top}
.m-etape{display:grid;grid-template-columns:45px 1fr;gap:28px;padding:clamp(40px,9vh,90px) 0;opacity:.35;transition:opacity .7s var(--ease)}
.m-etape.actif{opacity:1}
.m-n{position:relative;z-index:1;width:45px;height:45px;border-radius:50%;background:var(--nuit);box-shadow:inset 0 0 0 1px var(--cuivre-trait);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:19px;color:var(--laiton-c);transition:background .6s,color .6s}
.m-etape.actif .m-n{background:var(--laiton);color:var(--nuit);box-shadow:none}
.m-etape h3{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.4vw,54px);line-height:1}
.m-etape p{margin-top:14px;max-width:26em;color:rgba(241,235,224,.72);font-size:16px}
.m-mini{display:none}
.m-visuel{position:sticky;top:calc(50vh - min(34vh,290px));display:flex;justify-content:center}
.m-visuel .cadre{width:min(360px,100%)}
.m-visuel .ecrin{aspect-ratio:5/8;height:min(68vh,580px);width:auto}
.m-visuel .ecrin img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity 1s var(--ease),transform 1.6s var(--ease)}
.m-visuel .ecrin img.on{opacity:1;transform:none}
@media(max-width:900px){
  .m-corps{grid-template-columns:1fr}
  .m-visuel{display:none}
  .m-etape{opacity:1;padding:34px 0;grid-template-columns:45px 1fr;grid-template-rows:auto auto}
  .m-mini{display:block;grid-column:2;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:999px 999px 4px 4px;margin-top:18px}
  .m-etapes{--fil:1}
}
.appel-sous{max-width:28em;margin:-20px auto 34px;color:rgba(241,235,224,.8)}

/* showroom : programme en billets */
.prog-info{max-width:22em;font-size:14.5px}
.evt,.evt.avec-img{grid-template-columns:96px 88px minmax(0,1fr) 200px 170px;gap:28px;padding:26px 0}
.evt-img{width:96px;height:130px;aspect-ratio:auto;border-radius:999px;overflow:hidden;background:var(--profond);display:flex;align-items:center;justify-content:center}
.creme-bloc .evt-img{background:var(--papier)}
.evt-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.evt:hover .evt-img img{transform:scale(1.07)}
.evt-img .evt-cle{width:22px;height:auto;object-fit:contain;opacity:.7}
.evt .date{display:flex;flex-direction:column}
.evt .date b{font-size:60px;line-height:.9}
.evt .date span{font-style:normal;font-size:17px;margin-top:6px;color:inherit}
.evt .date em{font-family:var(--sans);font-style:normal;font-size:13px;color:var(--laiton-c);margin-top:4px}
.creme-bloc .evt .date em{color:var(--laiton)}
.evt-corps .fmt{margin-bottom:8px}
.evt .places{display:flex;flex-direction:column;gap:4px;font-size:13.5px}
.p-prix{font-family:var(--serif);font-size:22px}
.p-reste{opacity:.7}
.evt .jauge{display:block;height:2px;margin-top:8px}
.evt .cta{justify-self:end}
.evt .etat{justify-self:end;font-size:13.5px;opacity:.7;text-align:right}
.evt.complet{opacity:1}
.evt.complet .evt-img,.evt.complet .evt-corps,.evt.complet .date{opacity:.45}
@media(max-width:1000px){
  .evt,.evt.avec-img{grid-template-columns:78px 1fr;gap:10px 20px;align-items:start}
  .evt-img{width:78px;height:106px;grid-row:1/3}
  .evt .date{flex-direction:row;align-items:baseline;gap:8px}
  .evt .date b{font-size:40px}
  .evt-corps,.evt .places,.evt .cta,.evt .etat{grid-column:2}
  .evt .places{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
  .evt .jauge{flex-basis:100%;margin-top:2px}
  .evt .cta,.evt .etat{justify-self:start;text-align:left;margin-top:6px}
}

/* showroom : formats et privatisation */
.formats{gap:clamp(20px,3vw,44px)}
.format{border-top:0;padding-top:0}
.f-img{aspect-ratio:4/5;border-radius:999px 999px 4px 4px;overflow:hidden;margin-bottom:26px}
.f-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.format:hover .f-img img{transform:scale(1.05)}
.privat{padding-top:clamp(90px,11vw,170px)}
.arche{border-radius:999px 999px 4px 4px}
@media(max-width:800px){.formats{grid-template-columns:1fr}.f-img{aspect-ratio:16/12}}
@media(max-width:1000px){
  .evt,.evt.avec-img{grid-template-columns:78px 1fr}
  .evt-img{grid-column:1;grid-row:1/span 4}
  .evt .date{grid-column:2;grid-row:1}
  .evt-corps{grid-row:2}.evt .places{grid-row:3}.evt .cta,.evt .etat{grid-row:4}
}
@media(max-width:760px){
  .hero-p,.hero-p.court{height:auto;min-height:86svh;padding-top:120px}
  .preuve .cadre{width:200px}
}
@media(max-width:760px){.hero-p::after{background:linear-gradient(180deg,rgba(6,52,58,.6) 0%,rgba(6,52,58,.35) 30%,rgba(6,52,58,.7) 55%,rgba(6,52,58,.95) 100%)}}

/* ================= v8 : La maison, contact, merci, 404, légal ================= */
.tete-p{padding:clamp(110px,12vw,150px) var(--marge) clamp(30px,4vw,56px);display:grid;grid-template-columns:repeat(12,1fr);gap:0 20px;align-items:end}
.tete-p .fil{grid-column:1/-1;font-size:13px;color:var(--doux);margin-bottom:clamp(16px,2vw,24px)}
.tete-p .fil a:hover{color:var(--encre)}
.tete-p h1{grid-column:1/8;font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,80px);line-height:1;letter-spacing:-.02em}
.tp-lead{grid-column:8/13;font-size:clamp(15px,1.15vw,18px);max-width:28em;padding-bottom:.4em}
@media(max-width:860px){.tete-p h1,.tp-lead{grid-column:1/-1}.tp-lead{margin-top:18px}}

/* la maison */
.metier{display:grid;grid-template-columns:repeat(12,1fr);gap:0 20px}
.metier .note{grid-column:1/4;padding-top:.6em}
.metier .d2{grid-column:4/13;font-size:clamp(30px,4vw,64px);line-height:1.08}
.metier .d2 .mot{opacity:.14;transition:opacity .4s}
.metier .d2 .mot.lu{opacity:1}
@media(max-width:800px){.metier .note,.metier .d2{grid-column:1/-1}.metier .note{margin-bottom:22px}}
.maisons{padding:clamp(90px,11vw,160px) var(--marge)}
.ms-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 40px;flex-wrap:wrap;margin-bottom:clamp(40px,5vw,70px)}
.ms-liste{display:grid;grid-template-columns:repeat(3,1fr);column-gap:clamp(20px,3vw,50px);border-top:1px solid var(--trait-c)}
.ms{display:flex;flex-direction:column;gap:3px;padding:18px 0;border-bottom:1px solid var(--trait-c);transition:padding .6s var(--ease)}
.ms-nom{font-family:var(--serif);font-size:clamp(22px,1.9vw,30px);line-height:1.1;transition:color .4s}
.ms-info{font-size:12.5px;color:rgba(241,235,224,.55)}
.ms:hover{padding-left:12px}
.ms:hover .ms-nom{color:var(--laiton-c)}
.ms-apercu{position:fixed;top:0;left:0;z-index:90;width:150px;pointer-events:none;opacity:0;transition:opacity .35s}
.ms-apercu.on{opacity:1}
.ms-apercu .ecrin{aspect-ratio:5/8;box-shadow:0 20px 50px -18px rgba(0,0,0,.5)}
.ms-apercu img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ms-apercu.det img{object-fit:contain;padding:10% 8%;mix-blend-mode:multiply}
@media(max-width:1000px){.ms-liste{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ms-liste{grid-template-columns:1fr}}

/* contact */
.contact{align-items:start}
.coord{position:sticky;top:100px;background:var(--papier);border-radius:10px;padding:clamp(24px,3vw,40px)}
.coord dl{border-top:0;padding-top:0;grid-template-columns:100px 1fr;gap:16px 20px}
.coord .carte-maps{border-radius:999px 999px 8px 8px;aspect-ratio:5/4;margin-top:28px}
.form-c .note{margin-bottom:4px}
.form-c .profils button{background:var(--blanc)}
.form-c .profils button[aria-pressed="true"]{background:var(--nuit)}
.form-c .champ label{transition:color .3s}
.form-c .champ:focus-within label{color:var(--laiton)}
.form-c .champ input:focus,.form-c .champ select:focus,.form-c .champ textarea:focus{border-color:var(--laiton)}
.retour-form.ok{padding:14px 18px;border-radius:8px;background:var(--papier);color:var(--vert)}
@media(max-width:900px){.coord{position:static;order:2}}

/* merci */
.merci-tete{position:relative}
.sceau{position:absolute;right:var(--marge);top:clamp(110px,12vw,150px);width:34px;height:auto;opacity:.8}
.merci-corps{padding-top:0}
.recap{margin-top:0;max-width:720px;background:var(--papier);border:0;border-radius:10px;padding:10px 28px 24px}
.recap .l{border-color:var(--trait)}
.recap .l.t{border-bottom:0;padding-top:18px}
.etapes-merci{list-style:none;position:relative;max-width:960px;margin-top:70px;padding-top:48px}
.etapes-merci::before{content:'';position:absolute;top:18px;left:0;right:0;height:1px;background:var(--laiton)}
.etapes-merci li{position:relative;border-top:0;padding-top:0}
.etapes-merci .t-n{top:-48px;background:var(--creme)}
.merci-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:60px}
@media(max-width:760px){.etapes-merci{padding:0 0 0 56px}.etapes-merci::before{top:0;bottom:0;left:18px;right:auto;width:1px;height:auto}.etapes-merci .t-n{top:0;left:-56px}.sceau{display:none}}

/* 404 */
.perdu{min-height:92svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:130px var(--marge) 80px}
.perdu .cadre{width:110px;margin-bottom:34px}
.perdu .ecrin{aspect-ratio:5/8;display:flex;align-items:center;justify-content:center}
.perdu .ecrin img{width:24%;height:auto;animation:balance 5s ease-in-out infinite;transform-origin:50% 0}
@keyframes balance{50%{transform:rotate(6deg)}}
.perdu .fil{font-size:13px;color:var(--doux);margin-bottom:18px}
.perdu h1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5vw,76px);line-height:1;max-width:12em}
.perdu .tp-lead{margin-top:20px}
.perdu-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:34px}

/* legal */
.legal-cadre{display:grid;grid-template-columns:minmax(200px,1fr) 3fr;gap:clamp(30px,5vw,90px);padding:0 var(--marge) clamp(90px,10vw,150px)}
.sommaire{position:sticky;top:100px;align-self:start;display:flex;flex-direction:column;gap:2px;padding-top:24px;border-top:1px solid var(--trait)}
.sommaire .note{margin-bottom:10px}
.sommaire a{font-size:13.5px;color:var(--doux);padding:5px 0 5px 14px;border-left:1px solid var(--trait);transition:color .3s,border-color .3s}
.sommaire a:hover{color:var(--encre)}
.sommaire a.actif{color:var(--encre);border-color:var(--laiton)}
.legal-cadre .legal-txt{margin:0;padding:0;max-width:720px}
.legal-cadre .legal-txt>p:first-child{font-size:13.5px;color:var(--doux);padding-top:24px;border-top:1px solid var(--trait)}
.legal-txt h2{scroll-margin-top:100px;font-size:clamp(24px,2vw,30px);padding-top:10px}
@media(max-width:860px){.legal-cadre{grid-template-columns:1fr}.sommaire{display:none}}
.recap:empty{display:none}
@media(max-width:560px){.ms-liste{grid-template-columns:1fr 1fr;column-gap:16px}.ms{padding:12px 0}.ms-nom{font-size:18px}.ms-info{font-size:11.5px}}

/* ================= v9 : vitrine des rayons (accueil) ================= */
.vitrine{--teinte:#9E582A;position:relative;height:clamp(560px,76vh,700px);border-radius:28px;background:linear-gradient(180deg,var(--blanc) 0%,#F1EBE0 100%);color:var(--encre);overflow:hidden;isolation:isolate;box-shadow:0 40px 90px -40px rgba(0,0,0,.55)}
.vt-forme{position:absolute;left:0;top:0;width:47%;height:74%;background:var(--teinte);border-radius:28px 46% 40% 28px / 28px 38% 62% 28px;transition:background-color 1.2s var(--ease);z-index:0}
.vt-forme::after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse 70% 60% at 30% 20%,rgba(255,255,255,.22),transparent 60%),radial-gradient(ellipse 80% 70% at 80% 100%,rgba(0,0,0,.22),transparent 60%)}
.vt-cle{position:absolute;left:clamp(24px,3vw,44px);top:clamp(22px,3vw,40px);width:14px;height:auto;z-index:2;filter:brightness(0) invert(1);opacity:.8}
.vt-nom{position:absolute;left:clamp(24px,3vw,44px);top:clamp(80px,14vh,130px);z-index:1;color:#fff;max-width:36%}
.vt-num{font-family:var(--serif);font-style:italic;font-size:16px;opacity:.75}
.vt-nom h3{font-family:var(--serif);font-weight:400;font-size:clamp(44px,5.4vw,92px);line-height:.95;letter-spacing:-.025em;overflow:hidden;padding-bottom:.08em;margin-top:6px}
.vt-nom h3 span{display:block}
.vt-scene{position:absolute;left:12%;top:0;width:44%;height:100%;z-index:3;pointer-events:none}
.vt-groupe{position:absolute;inset:0;will-change:transform}
.vt-heros{position:absolute;left:24%;bottom:17%;width:52%;height:72%;display:flex;align-items:flex-end;justify-content:center}
.vt-heros img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 30px 30px rgba(0,0,0,.28)) drop-shadow(0 6px 8px rgba(0,0,0,.18));transform-origin:50% 100%}
.vt-heros.large{left:10%;width:80%;height:60%}
.vt-ombre{position:absolute;left:30%;right:30%;bottom:15.5%;height:22px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.34),transparent 70%);filter:blur(4px)}
.vt-flot{position:absolute;display:flex;align-items:flex-end}
.vt-flot img{max-width:100%;max-height:100%;object-fit:contain}
.vt-flot.f1{left:-4%;top:6%;width:22%;height:30%;filter:blur(3px);opacity:.85;transform:rotate(-12deg)}
.vt-flot.f2{left:-8%;bottom:4%;width:28%;height:34%;filter:blur(7px);transform:rotate(14deg);z-index:2}
.vt-secours{position:absolute;left:28%;top:12%;width:40%}
.vt-secours .ecrin{aspect-ratio:5/8;box-shadow:0 30px 60px -20px rgba(0,0,0,.4)}
.vt-secours img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

.vt-liste{position:absolute;right:0;top:0;width:44%;padding:clamp(34px,5vh,60px) clamp(24px,3vw,44px) 0 0;z-index:2}
.vt-titre{font-family:var(--serif);font-size:clamp(30px,2.8vw,44px);line-height:1;margin-left:clamp(20px,3vw,40px)}
.vt-entete{display:flex;justify-content:space-between;font-size:11.5px;letter-spacing:.02em;color:var(--doux);margin:clamp(22px,4vh,40px) 0 8px clamp(20px,3vw,40px);padding-right:62px}
.vt-l{position:relative;display:grid;grid-template-columns:1fr auto 64px 34px;align-items:center;gap:14px;padding:10px 0 10px clamp(20px,3vw,40px);min-height:clamp(64px,10vh,86px);border-radius:14px 0 0 14px;transition:background .5s var(--ease)}
.vt-l:nth-child(odd){background:rgba(18,36,40,.035)}
.vt-l:hover{background:rgba(18,36,40,.07)}
.vt-ln{min-width:0}
.vt-ln b{display:block;font-weight:500;font-size:14.5px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-ln small{display:block;font-size:12px;color:var(--doux);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-ln::after{content:'';position:absolute;inset:0}
.vt-lp{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--doux)}
.vt-lv{height:clamp(52px,8vh,72px);display:flex;align-items:center;justify-content:center;transition:transform .8s var(--ease)}
.vt-lv img{max-height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(0,0,0,.18))}
.vt-l:hover .vt-lv{transform:translateY(-4px) rotate(-6deg) scale(1.06)}
.vt-plus{position:relative;z-index:2;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:19px;line-height:1;color:var(--encre);transition:background .3s,color .3s,transform .5s var(--ease)}
.vt-plus:hover{background:var(--nuit);color:var(--creme);transform:rotate(90deg)}
.vt-plus.voir::before{content:'';width:8px;height:8px;border-top:1.3px solid currentColor;border-right:1.3px solid currentColor;transform:rotate(45deg);margin-left:-3px}
.vt-plus.voir:hover{transform:none}
.vt-plus.ok{animation:vt-ok .7s var(--ease)}
@keyframes vt-ok{40%{transform:scale(1.35);background:var(--laiton);color:var(--nuit)}}
.vt-vide{margin-left:clamp(20px,3vw,40px);color:var(--doux);font-size:14px}
.vt-compte{position:absolute;left:clamp(24px,3vw,44px);bottom:clamp(26px,4vh,40px);font-size:13px;color:var(--doux);z-index:2}

.vt-barre{position:absolute;left:50%;bottom:clamp(20px,3.4vh,32px);transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:6px;padding:6px 6px 6px 8px;border-radius:100px;background:rgba(250,246,239,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 0 0 1px rgba(18,36,40,.07),0 18px 40px -18px rgba(6,52,58,.35)}
.vt-rayons{display:flex;gap:2px}
.vt-rayons a{font-size:13px;padding:9px 13px;border-radius:100px;color:var(--doux);white-space:nowrap;transition:color .3s,background .4s}
.vt-rayons a:hover{color:var(--encre)}
.vt-rayons a[aria-current]{background:#fff;color:var(--encre);box-shadow:0 2px 8px -3px rgba(0,0,0,.2)}
.vt-voir{font-size:13px;padding:9px 12px 9px 16px;border-left:1px solid var(--trait);white-space:nowrap;color:var(--encre)}
.vt-voir:hover{color:var(--laiton)}
.vt-suivant{position:relative;width:48px;height:48px;border-radius:50%;background:var(--encre);color:var(--creme);display:flex;align-items:center;justify-content:center;flex:none;transition:background .3s,transform .5s var(--ease)}
.vt-suivant:hover{background:var(--nuit);transform:scale(1.06)}
.vt-suivant .fl{width:16px}
.vt-anneau{position:absolute;inset:-4px;width:56px;height:56px;transform:rotate(-90deg);pointer-events:none}
.vt-anneau circle{fill:none;stroke:var(--laiton);stroke-width:1.5;stroke-dasharray:138.2;stroke-dashoffset:138.2}

@media(max-width:860px){
  .vitrine{height:auto;border-radius:22px;padding-bottom:96px}
  .vt-forme{width:100%;height:330px;border-radius:22px 22px 44% 22px / 22px 22px 22% 22px}
  .vt-nom{top:56px;left:22px;max-width:60%}
  .vt-nom h3{font-size:clamp(38px,11vw,54px)}
  .vt-cle{left:22px;top:24px}
  .vt-scene{left:auto;right:0;top:40px;width:62%;height:330px}
  .vt-heros{left:18%;width:64%;bottom:6%;height:86%}
  .vt-ombre{bottom:4%}
  .vt-flot.f1{left:-18%;top:auto;bottom:12%;width:26%;height:34%}
  .vt-flot.f2{display:none}
  .vt-secours{left:30%;top:6%;width:50%}
  .vt-liste{position:relative;width:100%;padding:44px 0 0}
  .vt-titre{margin-left:22px}
  .vt-entete{margin-left:22px}
  .vt-l{padding-left:22px;padding-right:12px;border-radius:0;grid-template-columns:1fr auto 48px 30px;gap:10px}
  .vt-compte{position:static;margin:18px 22px 0}
  .vt-barre{left:12px;right:12px;transform:none;bottom:16px}
  .vt-rayons{overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
  .vt-rayons::-webkit-scrollbar{display:none}
  .vt-voir{display:none}
}
@media (prefers-reduced-motion:reduce){.vt-anneau{display:none}}
@media(min-width:861px){
  .vt-scene{left:17%;width:42%}
  .vt-heros{left:30%;width:50%}
  .vt-heros.large{left:14%;width:76%}
  .vt-ombre{left:36%;right:24%}
  .vt-nom{max-width:30%}
}
@media(max-width:860px){
  .vitrine{padding-top:330px}
  .vt-liste{padding-top:34px}
}
@media(min-width:861px){
  .vt-flot.f1{left:auto;right:-4%;top:5%}
  .vt-flot.f2{left:-2%;bottom:-8%;width:24%}
  .vt-compte{left:auto;right:clamp(24px,3vw,44px)}
}
@media(max-width:860px){.vt-lignes{min-height:174px}}

/* v10 : barre des rayons plus lisible, produits jamais coupés */
.vt-barre{gap:8px;padding:7px;background:#fff;box-shadow:0 0 0 1px rgba(18,36,40,.08),0 24px 50px -20px rgba(6,52,58,.45)}
.vt-rayons{position:relative;gap:0;isolation:isolate}
.vt-curseur{position:absolute;left:0;top:0;bottom:0;border-radius:100px;z-index:-1;transition:transform .8s var(--ease),width .8s var(--ease),background-color .45s ease;box-shadow:0 6px 16px -6px rgba(0,0,0,.35)}
.vt-rayons a{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:500;padding:12px 18px;color:var(--encre);background:none!important;box-shadow:none!important;transition:color .5s var(--ease)}
.vt-rayons a i{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none;transition:transform .5s var(--ease),background .5s,box-shadow .5s}
.vt-rayons a:hover i{transform:scale(1.35)}
.vt-rayons a[aria-current]{color:#fff}
.vt-rayons a[aria-current] i{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.25)}
.vt-voir{font-size:14px;font-weight:500;padding:12px 16px 12px 18px;border-left:1px solid var(--trait)}
.vt-prec{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:inset 0 0 0 1px var(--trait);transition:background .3s,box-shadow .3s}
.vt-prec:hover{background:var(--papier);box-shadow:inset 0 0 0 1px var(--encre)}
.vt-prec .fl{width:16px;height:10px}
.vt-suivant{width:52px;height:52px}
.vt-anneau{width:60px;height:60px}
@media(min-width:861px){
  .vt-flot.f2{bottom:4%;width:20%;height:30%}
  .vt-flot.f1{top:8%}
  .vt-compte{bottom:auto;top:clamp(34px,5vh,60px);right:clamp(24px,3vw,44px);text-align:right}
  .vt-titre{padding-right:180px}
}
@media(max-width:860px){
  .vitrine{padding-bottom:104px}
  .vt-barre{padding:6px;gap:6px}
  .vt-prec{display:none}
  .vt-rayons a{padding:11px 15px;font-size:14px}
  .vt-suivant{width:48px;height:48px}
  .vt-anneau{width:56px;height:56px}
  .vt-heros{height:78%;bottom:8%}
}
@media(min-width:861px){.vt-heros.large{left:18%;width:70%;height:54%}}
@media(min-width:861px){
  .vt-heros.large{left:6%;width:74%;height:50%}
  .vt-flot.f1{right:auto;left:1%;top:4%;width:16%;height:19%}
  .vt-flot.f2{left:-4%;bottom:6%;width:19%;height:28%}
}
@media(max-width:860px){.vt-heros.large{left:6%;width:78%;height:70%}}

/* ================= v14 : accueil retravaillé ================= */
/* écran de chargement : l'écrin se remplit pendant que le site charge */
.chargement{position:fixed;inset:0;z-index:290;background:var(--nuit);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .5s}
.chargement.on{opacity:1}
.ch-centre{display:flex;flex-direction:column;align-items:center;gap:26px}
.ch-ecrin{width:clamp(90px,11vw,120px);height:auto;overflow:visible}
.ch-trait{fill:none;stroke:var(--laiton);stroke-width:1.4;stroke-dasharray:600;stroke-dashoffset:600}
.ch-trait.fin{stroke-width:.9;opacity:.6}
.ch-plein{fill:var(--laiton);opacity:.9}
.ch-cle{opacity:0;filter:brightness(0) invert(1)}
.ch-pc{font-family:var(--serif);font-size:clamp(34px,4vw,54px);line-height:1;color:var(--creme)}
.ch-pc i{font-style:normal;font-size:.42em;margin-left:.2em;color:var(--laiton-c)}
.ch-mot{font-family:var(--serif);font-style:italic;font-size:15px;color:rgba(241,235,224,.6)}
body.charge .chargement{pointer-events:none}

/* hero : une phrase, une action, trois portes */
.hero .couche{align-items:flex-end;gap:clamp(30px,5vw,80px)}
.hero-txt{max-width:36em}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.6vw,58px);line-height:1.02;letter-spacing:-.02em;max-width:13em}
.hero-lead{margin-top:16px;max-width:30em;color:rgba(241,235,224,.85);font-size:clamp(14.5px,1.1vw,17px)}
.hero-actions{margin-top:26px}
.hero-lieu{position:absolute;right:var(--marge);top:calc(var(--h-nav) + 18px);z-index:2;text-align:right;font-size:13px;line-height:1.5;color:rgba(241,235,224,.75)}
.piliers{display:flex;flex-direction:column;gap:2px;width:min(330px,34vw);flex:none;border-top:1px solid rgba(241,235,224,.22)}
.piliers a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 14px;padding:14px 0;border-bottom:1px solid rgba(241,235,224,.22);color:var(--creme);transition:padding-left .6s var(--ease),color .4s}
.piliers b{font-family:var(--serif);font-weight:400;font-size:19px}
.piliers span{grid-column:1;font-size:12.5px;color:rgba(241,235,224,.65)}
.piliers .fl{grid-row:1/3;width:17px;opacity:.6;transition:transform .6s var(--ease),opacity .4s}
.piliers a:hover{padding-left:12px;color:#fff}
.piliers a:hover .fl{transform:translateX(5px);opacity:1}
@media(max-width:860px){.hero-lieu,.piliers{display:none}.hero h1{font-size:clamp(30px,8vw,40px)}}

/* bandeau : ce qui vient d'entrer, défile en continu */
.bandeau{position:relative;background:var(--papier);padding:clamp(26px,3.5vw,44px) 0 clamp(30px,4vw,50px);overflow:hidden}
.bd-tete{padding:0 var(--marge) 18px}
.bd-piste{display:flex;gap:clamp(16px,2vw,28px);width:max-content;will-change:transform}
.bd-i{display:flex;align-items:center;gap:16px;padding:12px 26px 12px 12px;border-radius:100px;background:var(--blanc);box-shadow:0 0 0 1px rgba(18,36,40,.06);transition:box-shadow .4s,transform .6s var(--ease)}
.bd-i:hover{box-shadow:0 0 0 1px var(--laiton);transform:translateY(-3px)}
.bd-v{width:52px;height:68px;display:flex;align-items:flex-end;justify-content:center;flex:none}
.bd-v img{max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply}
.bd-i.net .bd-v img{mix-blend-mode:normal}
.bd-t b{display:block;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.1;white-space:nowrap}
.bd-t span{display:block;font-size:12px;color:var(--doux);margin-top:3px;white-space:nowrap}

/* la maison : plus court, plus tenu */
.maison{padding:clamp(80px,10vw,150px) var(--marge);display:grid;grid-template-columns:repeat(12,1fr);gap:0 20px}
.maison .note{grid-column:1/3;padding-top:.5em}
.maison .d3{grid-column:3/11;font-size:clamp(22px,2.5vw,38px);line-height:1.25;letter-spacing:-.01em}
.maison .d3 .mot{opacity:.16;transition:opacity .45s}
.maison .d3 .mot.lu{opacity:1}
.ms-photos{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:20px;margin-top:clamp(50px,7vw,100px)}
.ms-photos .p1{grid-column:1/6;aspect-ratio:5/6;border-radius:999px 999px 6px 6px;overflow:hidden;position:relative}
.ms-photos .p2{grid-column:7/13;aspect-ratio:16/11;border-radius:6px;overflow:hidden;position:relative;margin-top:12vh}
.ms-photos img{position:absolute;inset:0;width:100%;height:118%;object-fit:cover}
.ms-lien{grid-column:7/13;margin-top:28px}
@media(max-width:860px){.maison .note,.maison .d3,.ms-photos .p1,.ms-photos .p2,.ms-lien{grid-column:1/-1}.maison .note{margin-bottom:18px}.ms-photos .p2{margin-top:16px}}

/* étagère plein écran */
.etagere.plein{padding:0}
.vt-cadre{min-height:100svh;padding:clamp(20px,3vh,34px) var(--marge) clamp(24px,4vh,40px);display:flex;flex-direction:column;gap:clamp(14px,2vh,24px)}
.vt-cadre .entete-r{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0}
.vt-cadre .entete-r .d3{font-size:clamp(22px,2vw,30px)}
.plein .vitrine{flex:1;height:auto;min-height:0;border-radius:18px}
.plein .vt-nom h3{font-size:clamp(40px,4.6vw,78px)}
@media(max-width:860px){.vt-cadre{min-height:0;padding:clamp(60px,9vw,90px) var(--marge)}.plein .vitrine{min-height:640px}}

/* notre propre cuvée : bloc éditorial sombre */
.piece{position:relative;grid-template-columns:repeat(12,1fr);color:var(--creme);padding:clamp(80px,10vw,150px) var(--marge);overflow:hidden}
.pc-fond{position:absolute;inset:0;background:var(--profond)}
.pc-fond::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 22% 50%,rgba(196,138,96,.22),transparent 65%)}
.pc-visuel{position:relative;grid-column:2/6}
.pc-visuel .cadre{box-shadow:inset 0 0 0 1px rgba(196,138,96,.5)}
.pc-visuel .ecrin{aspect-ratio:5/8;background:var(--papier)}
.pc-visuel .ecrin img{position:absolute;left:0;right:0;bottom:5%;margin:auto;height:82%;width:auto;mix-blend-mode:multiply}
.pc-visuel .ecrin img.photo{inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.pc-texte{position:relative;grid-column:7/12;align-self:center}
.pc-texte .piece-marque{color:rgba(241,235,224,.7)}
.pc-texte .d2{font-size:clamp(38px,4.4vw,68px);margin-top:6px}
.pc-texte .piece-acc{color:var(--laiton-c)}
.pc-texte .piece-desc{color:rgba(241,235,224,.78)}
.pc-texte dl{border-color:rgba(241,235,224,.2)}
.pc-texte dt{color:rgba(241,235,224,.55)}
.piece .cta.encre{background:var(--creme);color:var(--nuit)}
.piece .cta.encre:hover{background:#fff}
@media(max-width:860px){.piece{display:grid;gap:34px}.pc-visuel{grid-column:2/12}.pc-texte{grid-column:1/-1}}

/* cuvée : la promesse lisible dès l'ouverture */
.ouverture .titres .note{color:var(--laiton-c);margin-bottom:14px}
.ouverture .titres .d1{font-size:clamp(38px,5.2vw,86px)}

/* programme : état d'attente utile */
.programme .haut{align-items:center}
.attente{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap;padding:clamp(34px,5vw,60px) 0 0;margin-top:34px}
.at-txt{max-width:34em}
.at-txt .doux{margin-top:10px;color:rgba(241,235,224,.7)}
.at-act{display:flex;gap:10px;flex-wrap:wrap}
.sombre .attente .cta.ligne{color:var(--creme)}

/* click & collect : plus dense */
.rt-tete{display:flex;align-items:baseline;gap:14px 30px;flex-wrap:wrap}
.retrait .d3{font-size:clamp(24px,2.4vw,36px)}
.temps{margin-top:clamp(40px,5vw,70px)}
.temps h3{font-size:clamp(24px,2.2vw,34px)}
.visite .d3{font-size:clamp(26px,2.6vw,40px)}
@media(min-width:861px){
  .hero .embleme{display:none}
  body[data-page="/"] .nav:not(.fond) .logo-nav{opacity:1;pointer-events:auto}
  .hero h1{font-size:clamp(38px,4.2vw,68px)}
  .piliers{width:min(360px,36vw)}
  .piliers a{grid-template-columns:1fr 20px}
  .piliers b{grid-column:1;grid-row:1}
  .piliers span{grid-column:1;grid-row:2}
  .piliers .fl{grid-column:2;grid-row:1/3;justify-self:end;align-self:center}
}

/* ================= v15 : cartes de la sélection ================= */
.fiche-c .visuel{background:var(--papier);border-radius:8px;transition:box-shadow .6s var(--ease)}
.fiche-c:hover .visuel{box-shadow:0 18px 40px -22px rgba(6,52,58,.45)}
.fiche-c .visuel.detoure img{padding:9% 12% 11%;transform-origin:50% 92%;transition:transform 1s var(--ease),filter .6s}
.fiche-c:hover .visuel.detoure img{transform:translateY(-8px) scale(1.035);filter:drop-shadow(0 16px 14px rgba(6,52,58,.22))}
.fiche-c .visuel.detoure.plat img{padding:14% 7%}
.fiche-c .visuel .ombre-c{pointer-events:none;position:absolute;left:28%;right:28%;bottom:9%;height:12px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(6,52,58,.22),transparent 70%);opacity:0;transition:opacity .6s var(--ease),transform .8s var(--ease)}
.fiche-c:hover .visuel .ombre-c{opacity:1;transform:scaleX(.88)}
.fiche-c .visuel.detoure.plat .ombre-c{left:16%;right:16%}
.fiche-c .ajout{display:flex;align-items:center;justify-content:center;gap:9px;overflow:hidden}
.fiche-c .ajout::after{content:'+';font-size:17px;line-height:0;transition:transform .5s var(--ease)}
.fiche-c .ajout.voir::after{content:'';width:7px;height:7px;border-top:1.3px solid currentColor;border-right:1.3px solid currentColor;transform:rotate(45deg)}
.fiche-c .ajout:hover::after{transform:rotate(90deg)}
.fiche-c .ajout.voir:hover::after{transform:rotate(45deg) translate(2px,-2px)}
.fiche-c .ajout.ok{background:var(--laiton);color:var(--nuit)}
.fiche-c .visuel::after{content:'Voir la fiche';position:absolute;left:12px;top:12px;padding:6px 12px;border-radius:100px;background:rgba(250,246,239,.9);backdrop-filter:blur(6px);font-size:12px;color:var(--encre);opacity:0;transform:translateY(-6px);transition:opacity .4s,transform .5s var(--ease);pointer-events:none}
.fiche-c:hover .visuel::after{opacity:1;transform:none}
.fiche-c .etiquette-r{z-index:2}
.fiche-c:hover .etiquette-r{opacity:0;transition:opacity .3s}
.onglets-cat button sup{display:none}
.fiche .visuel.detoure img{max-width:calc(var(--cap-h) * .56);max-height:calc(var(--cap-h) * .84);height:auto;width:auto}

/* ================= v16 : commande confirmée ================= */
.merci-haut{position:relative;color:var(--creme);display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:40px;padding:clamp(120px,13vw,170px) var(--marge) clamp(70px,8vw,110px);overflow:hidden}
.mh-fond{position:absolute;inset:0;background:var(--nuit)}
.mh-fond::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 70% at 78% 50%,rgba(196,138,96,.24),transparent 62%)}
.mh-txt{position:relative}
.merci-haut .fil{font-size:13px;color:rgba(241,235,224,.65);margin-bottom:20px}
.merci-haut .fil a:hover{color:var(--creme)}
.merci-haut h1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,4.8vw,76px);line-height:1;letter-spacing:-.02em}
.mh-lead{margin-top:18px;color:rgba(241,235,224,.8);max-width:28em}
.mh-num{position:relative;justify-self:end;width:min(280px,100%)}
.mh-num .cadre{box-shadow:inset 0 0 0 1px rgba(196,138,96,.55)}
.mh-num .ecrin{aspect-ratio:5/6;background:transparent;box-shadow:inset 0 0 0 1px rgba(196,138,96,.55);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:26px;text-align:center}
.mh-num .losange{background:var(--nuit)}
.mh-num .note{color:var(--laiton-c)}
.mh-num b{font-family:var(--serif);font-weight:400;font-size:clamp(21px,2vw,28px);line-height:1.1;letter-spacing:.02em;overflow-wrap:anywhere}
.mh-etat{font-size:12.5px;color:rgba(241,235,224,.7)}
@media(max-width:860px){.merci-haut{grid-template-columns:1fr;padding-top:120px}.mh-num{justify-self:start;width:210px;margin-top:10px}}

.merci-corps{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(30px,5vw,80px);padding:clamp(60px,8vw,110px) var(--marge) clamp(90px,10vw,150px);align-items:start}
.mc-recap .d3{font-size:clamp(22px,2vw,30px);margin-bottom:24px}
.recap{margin:0;padding:0;background:none;border:0;display:flex;flex-direction:column}
.recap:empty{display:none}
.r-l{display:grid;grid-template-columns:56px 1fr auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--trait)}
.r-v{width:56px;height:72px;border-radius:28px;background:var(--papier);overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}
.r-v img{width:100%;height:100%;object-fit:cover}
.r-v.det img{object-fit:contain;padding:8% 10%;mix-blend-mode:multiply}
.r-t b{display:block;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.15}
.r-t span{display:block;font-size:12.5px;color:var(--doux);margin-top:3px}
.r-p{font-variant-numeric:tabular-nums;font-size:15px}
.r-total{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:20px 0 0;font-family:var(--serif);font-size:clamp(20px,1.8vw,26px)}
.merci-corps .etapes-merci{margin-top:56px;max-width:none}
.merci-corps .merci-actions{margin-top:44px}
.mc-retrait{position:sticky;top:100px;background:var(--papier);border-radius:12px;overflow:hidden}
.mc-retrait .carte-maps{aspect-ratio:4/3;margin:0;border-radius:0}
.mc-retrait .carte-maps iframe{width:100%;height:100%;border:0;filter:grayscale(.3) contrast(.95)}
.mc-infos{padding:clamp(22px,2.5vw,32px)}
.mc-adresse{font-family:var(--serif);font-size:clamp(19px,1.6vw,24px);line-height:1.25;margin-top:10px}
.mc-infos dl{display:grid;grid-template-columns:110px 1fr;gap:12px 18px;margin:22px 0 26px;padding-top:20px;border-top:1px solid var(--trait);font-size:14px}
.mc-infos dt{color:var(--doux)}
.mc-infos .cta{width:100%;justify-content:center}
@media(max-width:900px){.merci-corps{grid-template-columns:1fr}.mc-retrait{position:static;order:-1}}

/* ================= v17 : showroom ================= */
.evt-majeur{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,60px);align-items:center;padding:clamp(26px,3vw,40px) 0 clamp(34px,4vw,50px);border-bottom:1px solid var(--trait)}
.sombre .evt-majeur{border-color:var(--trait-c)}
.em-img{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--papier)}
.em-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.em-img .evt-cle{width:34px;height:auto;object-fit:contain;margin:auto;position:absolute;inset:0;opacity:.6}
.evt-majeur:hover .em-img img{transform:scale(1.04)}
.em-quand{position:absolute;left:18px;top:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:74px;height:74px;border-radius:50%;background:rgba(250,246,239,.94);backdrop-filter:blur(8px);font-family:var(--serif);line-height:1;color:var(--encre)}
.em-quand b{font-weight:400;font-size:30px}
.em-quand span{font-size:13px;margin-top:3px}
.em-corps .fmt{font-size:13px;color:var(--laiton);margin:16px 0 8px}
.em-corps .d2{font-size:clamp(28px,3vw,46px);line-height:1.05}
.em-corps .desc{margin-top:16px;max-width:36em;color:var(--doux)}
.em-corps .places{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:6px 22px;margin:26px 0 26px}
.em-corps .p-prix{font-size:26px}
.em-corps .jauge{flex-basis:100%;max-width:260px}
.evt-majeur.complet .em-img{opacity:.5}
@media(max-width:860px){.evt-majeur{grid-template-columns:1fr;gap:22px}.em-quand{width:62px;height:62px}.em-quand b{font-size:24px}}

.fm-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:30px 60px;flex-wrap:wrap;margin-bottom:clamp(40px,5vw,70px)}
.fm-cadre{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;padding-top:20px;border-top:1px solid var(--trait-c);font-size:14px;min-width:min(340px,100%)}
.fm-cadre dt{color:var(--laiton-c)}
.pv-liste{list-style:none;margin-top:26px;display:grid;gap:2px}
.pv-liste li{padding:12px 0 12px 22px;border-bottom:1px solid var(--trait);font-size:15px;position:relative}
.pv-liste li::before{content:'';position:absolute;left:0;top:19px;width:7px;height:7px;border:1px solid var(--laiton);transform:rotate(45deg)}
.em-corps .places{gap:10px 30px}
.em-corps .p-reste{font-size:14px}
.em-corps .places{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:10px 30px;margin:26px 0;font-size:13.5px}
.em-corps .p-prix{font-family:var(--serif);font-size:26px;line-height:1}
.em-corps .p-reste{font-size:14px;color:var(--doux)}
.em-corps .jauge{display:block;flex-basis:100%;max-width:280px;height:2px;background:var(--trait);margin-top:2px}
.em-corps .jauge i{display:block;height:100%;background:var(--laiton)}
.sombre .em-corps .jauge{background:var(--trait-c)}
.em-corps .etat{display:block;font-size:14px;color:var(--doux)}

/* ================= v18 : cuvée sur mesure et la maison ================= */
.hp-cles{position:absolute;right:var(--marge);bottom:clamp(30px,6vh,64px);z-index:3;display:flex;gap:clamp(18px,2.4vw,40px);color:var(--creme)}
.hp-cles div{padding-left:14px;border-left:1px solid rgba(241,235,224,.3)}
.hp-cles dt{font-size:12px;color:rgba(241,235,224,.6)}
.hp-cles dd{font-family:var(--serif);font-size:clamp(16px,1.4vw,20px);margin-top:4px;white-space:nowrap}
@media(max-width:1100px){.hp-cles{position:static;margin:26px var(--marge) 0;flex-wrap:wrap;gap:16px 24px}}

.cb-tete{margin-bottom:clamp(36px,4vw,60px)}
.choix{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,34px)}
.ch-i{padding-top:20px;border-top:1px solid var(--trait)}
.ch-n{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--laiton)}
.ch-i h3{font-family:var(--serif);font-weight:400;font-size:clamp(21px,1.9vw,28px);line-height:1.1;margin:12px 0 10px}
.ch-i p{font-size:14.5px;color:var(--doux);max-width:24em}
@media(max-width:860px){.choix{grid-template-columns:1fr 1fr;gap:20px}}
@media(max-width:560px){.choix{grid-template-columns:1fr}}

.cuvee-preuve{align-items:center;gap:40px 20px}
.cuvee-preuve .preuve{grid-column:2/6}
.cuvee-preuve .cp-txt{grid-column:7/13}
@media(max-width:900px){.cuvee-preuve .preuve{grid-column:3/11}.cuvee-preuve .cp-txt{grid-column:1/-1}}

.criteres{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,50px)}
.cr-i{padding-top:22px;border-top:1px solid var(--trait)}
.cr-i h3{font-family:var(--serif);font-weight:400;font-size:clamp(20px,1.8vw,26px);line-height:1.15}
.cr-i p{margin-top:12px;font-size:14.5px;color:var(--doux);max-width:26em}
@media(max-width:800px){.criteres{grid-template-columns:1fr}}
.metier .d3{font-size:clamp(22px,2.4vw,36px);line-height:1.25}
.appel .contenu .d2{font-size:clamp(30px,3.6vw,56px)}
.metier .note{grid-column:1/3}
.metier .d3{grid-column:3/11}
@media(max-width:800px){.metier .d3{grid-column:1/-1}}
.hp-cles{top:calc(var(--h-nav) + 22px);bottom:auto;flex-direction:column;align-items:flex-end;text-align:right;gap:14px}
.hp-cles div{padding:0 0 0 0;border-left:0;border-right:1px solid rgba(241,235,224,.3);padding-right:14px}
@media(max-width:1100px){.hp-cles{position:static;flex-direction:row;text-align:left;align-items:flex-start}.hp-cles div{border-right:0;border-left:1px solid rgba(241,235,224,.3);padding:0 0 0 14px}}

/* ================= v19 : contact ================= */
.coord{padding:0;overflow:hidden}
.coord .carte-maps{aspect-ratio:16/10;margin:0;border-radius:0}
.coord .carte-maps iframe{width:100%;height:100%;border:0;filter:grayscale(.3) contrast(.95)}
.cd-corps{padding:clamp(24px,3vw,38px)}
.cd-adresse{font-family:var(--serif);font-size:clamp(20px,1.7vw,26px);line-height:1.25;margin-top:10px}
.cd-corps dl{display:grid;grid-template-columns:100px 1fr;gap:12px 18px;margin:22px 0 26px;padding-top:20px;border-top:1px solid var(--trait);font-size:14.5px}
.cd-corps dt{color:var(--doux)}
.cd-corps .cta{width:100%;justify-content:center}

/* ================= v21 : accueil, rubriques plein cadre ================= */

/* ---- Rayons : la vitrine prend tout l'écran ---- */
.v5 .vt-cadre{min-height:0;padding:0;gap:0;display:block}
.v5 .vitrine{height:100svh;min-height:620px;border-radius:0;box-shadow:none;background:linear-gradient(180deg,var(--blanc),var(--creme))}
.v5 .vt-forme{width:58%;height:100%}
.v5 .vt-intro{position:absolute;left:var(--marge);top:clamp(104px,17vh,170px);width:34%;z-index:1;color:#fff}
.v5 .vt-sur{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-style:italic;font-size:17px;color:rgba(255,255,255,.86)}
.v5 .vt-sur img{width:9px;height:auto;filter:brightness(0) invert(1);opacity:.85}
.v5 .vt-nom{position:static;max-width:none;margin-top:clamp(26px,5vh,54px)}
.v5 .vt-num{font-size:15px;opacity:.8;letter-spacing:.02em}
.v5 .vt-num b{font-weight:400;font-size:22px;margin-right:2px}
.v5 .vt-nom h2{font-family:var(--serif);font-weight:400;font-size:clamp(52px,6.2vw,116px);line-height:.93;letter-spacing:-.03em;overflow:hidden;padding-bottom:.1em;margin-top:8px}
.v5 .vt-nom h2 span{display:block}
.v5 .vt-desc{margin-top:clamp(16px,2.4vh,28px);max-width:24em;font-size:clamp(15.5px,1.15vw,18px);line-height:1.55;color:rgba(255,255,255,.88);transition:opacity .45s var(--ease),transform .6s var(--ease)}
.v5 .cta.vt-voir{margin-top:clamp(22px,3.4vh,38px);border-left:0;padding:17px 26px;font-size:14px;background:var(--creme);color:var(--encre);transition:opacity .45s var(--ease),transform .6s var(--ease),color .5s var(--ease)}
.v5 .cta.vt-voir::before{background:#fff}
.v5 .cta.vt-voir:hover{color:var(--encre)}
.v5 .vitrine.change .vt-desc,.v5 .vitrine.change .cta.vt-voir{opacity:0;transform:translateY(12px)}
.v5 .vt-scene{left:30%;width:40%}
.v5 .vt-heros{left:22%;width:56%;bottom:15%;height:72%}
.v5 .vt-heros.large{left:8%;width:84%;height:56%}
.v5 .vt-ombre{left:28%;right:28%;bottom:13.6%;height:26px}
.v5 .vt-flot.f1{left:76%;right:auto;top:9%;bottom:auto;width:15%;height:21%;filter:blur(3px);opacity:.8}
.v5 .vt-flot.f2{left:2%;top:auto;bottom:-7%;width:20%;height:30%;filter:blur(8px)}
.v5 .vt-liste{width:35%;z-index:4;padding:clamp(108px,18vh,180px) var(--marge) 0 0}
.v5 .vt-liste-tete{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:0 0 clamp(18px,3vh,30px) clamp(20px,2vw,32px);font-size:14px}
.v5 .vt-titre{margin:0;padding:0;font-size:clamp(26px,2.3vw,38px)}
.v5 .vt-l{grid-template-columns:1fr auto clamp(64px,6vw,96px) 36px;min-height:clamp(84px,14vh,128px);padding-left:clamp(20px,2vw,32px);border-radius:18px 0 0 18px;margin-right:calc(var(--marge)*-1);padding-right:var(--marge)}
.v5 .vt-l:nth-child(odd){background:rgba(18,36,40,.04)}
.v5 .vt-ln b{font-size:clamp(15px,1.15vw,18px)}
.v5 .vt-ln small{font-size:13px;margin-top:4px}
.v5 .vt-lv{height:clamp(64px,11vh,104px)}
.v5 .vt-vide{margin-left:clamp(20px,2vw,32px)}
.v5 .vt-barre{bottom:clamp(22px,3.6vh,36px)}
.vt-astuce,.vt-avance{display:none}
.v5 .epingle .vt-astuce{display:flex;align-items:center;gap:12px;position:absolute;left:var(--marge);bottom:clamp(34px,5vh,50px);z-index:4;font-size:13px;color:rgba(255,255,255,.82);transition:opacity .6s var(--ease)}
.v5 .vt-astuce i{width:1px;height:34px;background:rgba(255,255,255,.35);position:relative;overflow:hidden}
.v5 .vt-astuce i::after{content:'';position:absolute;left:0;top:0;width:1px;height:14px;background:#fff;animation:vt-goutte 1.9s var(--ease-io) infinite}
@keyframes vt-goutte{from{transform:translateY(-14px)}to{transform:translateY(34px)}}
.v5 .vitrine.vu .vt-astuce{opacity:0}
.v5 .epingle .vt-avance{display:block;position:absolute;left:0;right:0;bottom:0;height:3px;z-index:6;background:var(--teinte);transform:scaleX(var(--avance,0));transform-origin:left;transition:background-color 1.2s var(--ease)}
@media(min-width:861px) and (max-height:700px){.v5 .vt-intro{top:96px}.v5 .vt-nom{margin-top:18px}.v5 .vt-nom h2{font-size:clamp(44px,5vw,80px)}.v5 .vt-liste{padding-top:96px}}
@media(max-width:1180px) and (min-width:861px){.v5 .vt-l{grid-template-columns:1fr clamp(56px,6vw,80px) 30px}.v5 .vt-lp{display:none}}
@media(max-width:860px){
  .v5 .vt-cadre{padding:0}
  .v5 .vitrine{height:auto;min-height:0;padding:0 0 100px}
  .v5 .vt-forme{width:100%;height:390px}
  .v5 .vt-intro{left:22px;top:30px;width:58%}
  .v5 .vt-sur{font-size:14.5px;gap:9px}
  .v5 .vt-nom{margin-top:18px}
  .v5 .vt-nom h2{font-size:clamp(38px,11vw,56px)}
  .v5 .vt-desc{display:none}
  .v5 .cta.vt-voir{margin-top:18px;padding:13px 18px;font-size:13px;display:inline-flex}
  .v5 .vt-scene{left:auto;right:-4%;top:60px;width:56%;height:330px}
  .v5 .vt-heros{left:14%;width:72%;bottom:4%;height:88%}
  .v5 .vt-heros.large{left:4%;width:92%;height:62%}
  .v5 .vt-ombre{bottom:2%}
  .v5 .vt-flot.f1,.v5 .vt-flot.f2{display:none}
  .v5 .vt-liste{position:relative;width:100%;padding:420px 0 0}
  .v5 .vt-liste-tete{margin:0 22px 16px}
  .v5 .vt-l{margin-right:0;padding:10px 14px 10px 22px;border-radius:0;min-height:78px;grid-template-columns:1fr auto 52px 30px}
  .v5 .vt-lv{height:58px}
}

/* ---- Création de l'atelier ---- */
.atelier{position:relative;background:var(--abysse);color:var(--creme);overflow:hidden;min-height:100svh;display:flex;align-items:center;padding:clamp(100px,11vw,160px) var(--marge)}
.atelier::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 34% 52% at 50% 52%,rgba(196,138,96,.30),transparent 70%),radial-gradient(ellipse 60% 50% at 50% 110%,rgba(12,80,89,.9),transparent 70%)}
.at-fantome{position:absolute;left:0;top:50%;transform:translateY(-54%);white-space:pre;font-family:var(--serif);font-style:italic;font-size:clamp(130px,21vw,360px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(224,181,150,.2);pointer-events:none;user-select:none}
.at-fantome span{display:inline-block;will-change:transform}
.at-grille{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(34px,6vw,110px);align-items:center}
.at-texte>*,.at-fiche>*{opacity:0;transform:translateY(26px);transition:opacity 1.1s var(--ease),transform 1.3s var(--ease)}
.atelier.entre .at-texte>*,.atelier.entre .at-fiche>*{opacity:1;transform:none}
.atelier.entre .at-texte>:nth-child(2){transition-delay:.08s}.atelier.entre .at-texte>:nth-child(3){transition-delay:.2s}.atelier.entre .at-texte>:nth-child(4){transition-delay:.26s}.atelier.entre .at-texte>:nth-child(5){transition-delay:.34s}.atelier.entre .at-texte>:nth-child(6){transition-delay:.44s}
.atelier.entre .at-fiche>:nth-child(1){transition-delay:.5s}.atelier.entre .at-fiche>:nth-child(2){transition-delay:.58s}.atelier.entre .at-fiche>:nth-child(3){transition-delay:.68s}.atelier.entre .at-fiche>:nth-child(4){transition-delay:.78s}
.at-accroche{margin-top:16px;max-width:27em;font-size:clamp(16px,1.2vw,18.5px);line-height:1.6;color:rgba(241,235,224,.82)}
.atelier .piece-marque{margin-top:clamp(30px,5vh,56px);font-size:13.5px;color:var(--laiton-c)}
.atelier .d2{font-size:clamp(42px,5vw,88px);margin-top:8px;line-height:.98}
.atelier .piece-acc{color:var(--laiton-c);margin-top:16px}
.atelier .cta{margin-top:clamp(28px,4vh,44px)}
.at-visuel{position:relative;height:min(70vh,660px);aspect-ratio:10/26;justify-self:center}
.at-halo{position:absolute;inset:-30% -90%;background:radial-gradient(ellipse at center,rgba(224,181,150,.22),transparent 62%);filter:blur(10px);opacity:0;transition:opacity 2.4s var(--ease) .4s}
.atelier.entre .at-halo{opacity:1}
.at-arche{position:absolute;inset:-16px;border-radius:999px;border:1px solid rgba(196,138,96,.6);opacity:0;transform:scale(.94);transition:opacity 1.6s var(--ease) .5s,transform 2s var(--ease) .5s}
.at-arche::after{content:'';position:absolute;inset:-14px;border-radius:999px;border:1px solid rgba(196,138,96,.22)}
.atelier.entre .at-arche{opacity:1;transform:none}
.at-ecrin{position:absolute;inset:0;border-radius:999px;overflow:hidden;background:var(--papier);clip-path:inset(100% 0 0 0 round 999px);transition:clip-path 1.9s var(--ease-io);box-shadow:0 50px 90px -30px rgba(0,0,0,.7)}
.atelier.entre .at-ecrin{clip-path:inset(0 0 0 0 round 999px)}
.at-ecrin img{position:absolute;left:0;right:0;bottom:6%;margin:auto;height:84%;width:auto;max-width:86%;object-fit:contain;mix-blend-mode:multiply}
/* photo plein écrin (cuvée à l'affiche) : un peu plus haute que l'écrin, pour que le mouvement au défilement ne découvre
   jamais un bord ; un fin liseré crème et un filet cuivré, posés par-dessus, épousent l'ovale */
.at-ecrin img.photo{inset:auto 0;top:-5%;width:100%;height:110%;max-width:none;object-fit:cover;object-position:50% 50%;mix-blend-mode:normal}
.at-ecrin.plein::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 6px var(--papier),inset 0 0 0 7px rgba(196,138,96,.55);pointer-events:none}
.at-reflet{position:absolute;inset:-20% -60%;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.34) 50%,transparent 58%);transform:translateX(-70%);animation:at-reflet 7s var(--ease-io) infinite 2.4s;pointer-events:none}
@keyframes at-reflet{0%,55%{transform:translateX(-70%)}85%,100%{transform:translateX(70%)}}
.at-cle{position:absolute;left:50%;bottom:-58px;width:10px;height:auto;margin-left:-5px;filter:brightness(0) invert(1);opacity:.55}
.at-fiche-titre{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--laiton)}
.at-fiche dl{margin-top:14px;display:grid;grid-template-columns:auto 1fr;font-size:14.5px}
.at-fiche dt,.at-fiche dd{padding:13px 0;border-top:1px solid rgba(196,138,96,.28)}
.at-fiche dt{color:rgba(241,235,224,.55);padding-right:clamp(18px,2.4vw,40px);white-space:nowrap}
.at-fiche dl>:nth-last-child(-n+2){border-bottom:1px solid rgba(196,138,96,.28)}
.at-notes{margin-top:clamp(24px,3.4vh,38px);max-width:26em}
.at-notes span{display:block;font-size:13px;color:rgba(241,235,224,.55);margin-bottom:8px}
.at-notes em{font-family:var(--serif);font-size:clamp(19px,1.55vw,24px);line-height:1.35;color:var(--creme)}
.atelier .piece-desc{margin-top:clamp(20px,3vh,30px);max-width:32em;font-size:14.5px;line-height:1.7;color:rgba(241,235,224,.68)}
@media(max-width:1100px){
  .at-grille{grid-template-columns:minmax(0,1fr) auto;gap:40px clamp(30px,5vw,60px)}
  .at-fiche{grid-column:1/-1;max-width:640px}
  .at-visuel{height:min(60vh,520px)}
}
@media(max-width:700px){
  .atelier{min-height:0;padding:90px var(--marge) 80px}
  .at-grille{grid-template-columns:1fr;gap:70px}
  .at-visuel{height:440px;margin:6px auto 0}
  .at-cle{display:none}
}
@media (prefers-reduced-motion:reduce){.at-reflet{animation:none}.at-texte>*,.at-fiche>*{opacity:1;transform:none}.at-ecrin{clip-path:none}}

/* ---- Cuvée sur mesure : grain et faits ---- */
.ouverture.v5 .media video{filter:contrast(1.1) saturate(.82) brightness(.94)}
.ouverture.v5 .media::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(6,52,58,.34),rgba(6,52,58,.08) 40%,rgba(6,52,58,.5));mix-blend-mode:multiply;pointer-events:none}
.ouverture.v5 .media::after{z-index:2;background:radial-gradient(ellipse at center,rgba(6,52,58,.84),rgba(6,40,46,.7))}
.ov-grain{position:absolute;inset:-50%;z-index:1;opacity:.2;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");animation:ov-grain 1.1s steps(6) infinite}
@keyframes ov-grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-6%,-2%)}80%{transform:translate(5%,4%)}100%{transform:translate(0,0)}}
.ov-amorce{position:absolute;left:0;right:0;bottom:clamp(40px,9vh,90px);text-align:center;font-size:15.5px;color:var(--doux);z-index:2;padding:0 var(--marge)}
.ouverture.v5 .coins{font-size:clamp(30px,4.6vw,76px);letter-spacing:-.02em;padding:0 clamp(24px,9vw,170px)}
.ouverture.v5 .titres{max-width:1100px}
.ouverture.v5 .titres .d1{font-size:clamp(44px,6.4vw,112px);max-width:9em}
.ouverture.v5 .titres .ov-lead{margin:24px auto 0;max-width:33em;font-size:clamp(16px,1.2vw,18.5px);color:rgba(241,235,224,.88)}
.ov-faits{display:flex;justify-content:center;gap:0;margin:clamp(28px,4.4vh,48px) auto 0;border-top:1px solid rgba(224,181,150,.35);border-bottom:1px solid rgba(224,181,150,.35)}
.ov-faits>div{padding:18px clamp(20px,3vw,48px);text-align:left}
.ov-faits>div+div{border-left:1px solid rgba(224,181,150,.35)}
.ov-faits dt{font-size:12.5px;color:var(--laiton-c)}
.ov-faits dd{font-family:var(--serif);font-size:clamp(19px,1.7vw,26px);line-height:1.2;margin-top:4px}
.ov-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:clamp(28px,4.4vh,46px)}
@media(max-width:800px){
  .ov-amorce{display:none}
  .ouverture.v5{height:auto}
  .ouverture.v5 .scene{position:relative;height:auto;min-height:100svh;padding:110px 0 90px}
  .ouverture.v5 .media{clip-path:none}
  .ouverture.v5 .media::after{opacity:1}
  .ouverture.v5 .titres{opacity:1}
  .ouverture.v5 .coins{display:none}
  .ov-faits{flex-direction:column;max-width:320px}
  .ov-faits>div{text-align:center}
  .ov-faits>div+div{border-left:0;border-top:1px solid rgba(224,181,150,.35)}
}
@media (prefers-reduced-motion:reduce){.ov-grain{animation:none}}

/* ---- Prochaines dates ---- */
.programme.v5{padding:clamp(100px,11vw,170px) var(--marge) clamp(90px,9vw,140px);background:var(--nuit)}
.pg-tete{display:grid;grid-template-columns:1fr minmax(0,30em);gap:30px clamp(30px,6vw,110px);align-items:end}
.pg-tete .d2{margin-top:10px;font-size:clamp(46px,6.6vw,110px)}
.pg-tete-d p{color:rgba(241,235,224,.78);font-size:15.5px}
.pg-tete-d .cta{margin-top:24px}
.programme.v5 .agenda{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(14px,1.4vw,22px);margin-top:clamp(44px,5vw,80px);border:0}
.programme.v5 .evt-majeur{grid-row:1/span 2;display:flex;flex-direction:column;gap:0;padding:0;border:0;border-radius:22px;overflow:hidden;background:var(--profond);box-shadow:inset 0 0 0 1px rgba(224,181,150,.2)}
.programme.v5 .evt-majeur:only-child{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1fr;align-items:stretch}
.programme.v5 .em-img{aspect-ratio:16/8.5;border-radius:0;background:var(--abysse)}
.programme.v5 .evt-majeur:only-child .em-img{aspect-ratio:auto;min-height:420px}
.programme.v5 .em-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(6,52,58,.55))}
.programme.v5 .em-quand{left:clamp(18px,2vw,30px);top:clamp(18px,2vw,30px);width:auto;height:auto;border-radius:16px;padding:14px 20px 12px;background:var(--creme)}
.programme.v5 .em-quand b{font-size:clamp(44px,4vw,64px);line-height:.85}
.programme.v5 .em-quand span{font-size:15px;margin-top:6px}
.programme.v5 .em-corps{padding:clamp(24px,2.6vw,42px);display:flex;flex-direction:column;flex:1}
.programme.v5 .em-corps .note{color:var(--laiton-c)}
.programme.v5 .em-corps .fmt{color:var(--laiton-c);margin:14px 0 6px}
.programme.v5 .em-corps .d2{font-size:clamp(30px,3vw,48px)}
.programme.v5 .em-corps .desc{color:rgba(241,235,224,.72)}
.programme.v5 .em-corps .places{margin:auto 0 24px;padding-top:26px}
.programme.v5 .em-corps .cta{align-self:flex-start}
.programme.v5 .evt,.programme.v5 .evt.avec-img{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto 1fr;gap:6px clamp(20px,2.2vw,36px);align-items:start;padding:clamp(22px,2.2vw,34px);border:0;border-radius:22px;background:rgba(241,235,224,.055);box-shadow:inset 0 0 0 1px rgba(241,235,224,.1);transition:background .6s var(--ease),transform .8s var(--ease)}
.programme.v5 .evt:hover{background:rgba(241,235,224,.09);transform:translateY(-3px)}
.programme.v5 .evt .evt-img{display:none}
.programme.v5 .evt .date{grid-column:1;grid-row:1/span 3;flex-direction:column;align-items:flex-start;gap:0;padding-right:clamp(20px,2.2vw,36px);border-right:1px solid rgba(224,181,150,.3);align-self:stretch;min-width:92px}
.programme.v5 .evt .date b{font-family:var(--serif);font-weight:400;font-size:clamp(50px,4.6vw,76px);line-height:.85}
.programme.v5 .evt .date span{font-family:var(--serif);font-size:17px;margin-top:8px}
.programme.v5 .evt .date em{margin-top:6px}
.programme.v5 .evt .evt-corps{grid-column:2;grid-row:1}
.programme.v5 .evt .evt-corps h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,1.9vw,30px);line-height:1.12}
.programme.v5 .evt .evt-corps .fmt{font-size:13px;color:var(--laiton-c);margin-bottom:6px}
.programme.v5 .evt .evt-corps .desc{display:none}
.programme.v5 .evt .places{grid-column:2;grid-row:2;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-top:10px}
.programme.v5 .evt .places .jauge{flex-basis:100%;max-width:220px}
.programme.v5 .evt .cta,.programme.v5 .evt .etat{grid-column:2;grid-row:3;justify-self:start;align-self:end;margin-top:16px;text-align:left}
.programme.v5 .evt .cta{padding:14px 22px}
.programme.v5 .attente{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(14px,1.4vw,22px);align-items:stretch;margin-top:clamp(44px,5vw,80px);padding:0;border:0}
.programme.v5 .at-photo{position:relative;border-radius:22px;overflow:hidden;min-height:clamp(320px,38vw,520px)}
.programme.v5 .at-photo img{position:absolute;left:0;top:-8%;width:100%;height:116%;object-fit:cover}
.programme.v5 .at-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(200deg,transparent 40%,rgba(6,52,58,.6))}
.at-pastille{position:absolute;left:clamp(18px,2vw,30px);bottom:clamp(18px,2vw,30px);z-index:2;display:flex;align-items:baseline;gap:10px;padding:14px 22px;border-radius:100px;background:var(--creme);color:var(--encre);font-size:14px}
.at-pastille b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1}
.programme.v5 .at-txt{max-width:none;display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,3.4vw,60px);border-radius:22px;background:var(--profond);box-shadow:inset 0 0 0 1px rgba(224,181,150,.2)}
.programme.v5 .at-txt .d3{font-size:clamp(32px,3.4vw,54px)}
.programme.v5 .at-txt .doux{margin-top:18px;max-width:30em;color:rgba(241,235,224,.75);font-size:15.5px}
.programme.v5 .at-act{margin-top:clamp(26px,3vw,40px)}
.pg-formats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(50px,6vw,96px);border-top:1px solid var(--trait-c)}
.pg-f{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.4vw,34px) clamp(18px,2vw,32px) 8px 0;position:relative}
.pg-f+.pg-f{padding-left:clamp(18px,2vw,32px);border-left:1px solid var(--trait-c)}
.pg-f::before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--laiton);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.pg-f:hover::before{transform:none}
.pg-f-n{font-family:var(--serif);font-size:clamp(22px,1.9vw,30px);line-height:1.1;transition:color .4s}
.pg-f:hover .pg-f-n{color:var(--laiton-c)}
.pg-f.prive .pg-f-n{font-style:italic;color:var(--laiton-c)}
.pg-f-t{font-size:14px;line-height:1.6;color:rgba(241,235,224,.66);max-width:24em}
@media(max-width:1000px){
  .pg-tete{grid-template-columns:1fr}
  .programme.v5 .agenda,.programme.v5 .attente{grid-template-columns:1fr}
  .programme.v5 .evt-majeur{grid-row:auto}
  .programme.v5 .evt-majeur:only-child{display:flex}
  .programme.v5 .evt-majeur:only-child .em-img{min-height:0;aspect-ratio:16/9}
  .pg-formats{grid-template-columns:1fr 1fr}
  .pg-f:nth-child(odd){padding-left:0;border-left:0}
  .pg-f:nth-child(n+3){border-top:1px solid var(--trait-c)}
}
@media(max-width:560px){
  .pg-formats{grid-template-columns:1fr}
  .pg-f,.pg-f+.pg-f{padding-left:0;border-left:0}
  .pg-f+.pg-f{border-top:1px solid var(--trait-c)}
  .programme.v5 .evt .date{min-width:70px}
}

/* ---- Click & collect ---- */
.retrait.v5{padding:clamp(100px,11vw,170px) var(--marge) clamp(90px,10vw,150px);background:var(--papier)}
.retrait.v5 .rt-tete{display:grid;grid-template-columns:1fr minmax(0,30em);gap:30px clamp(30px,6vw,110px);align-items:end}
.retrait.v5 .d2{margin-top:10px;font-size:clamp(44px,6vw,104px);max-width:9.5em}
.rt-tete-d p{color:var(--doux);font-size:15.5px}
.rt-tete-d .cta{margin-top:24px}
.rt-pas{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.4vw,22px);margin-top:clamp(50px,6vw,90px)}
.rt-p{position:relative;display:flex;flex-direction:column;min-height:clamp(340px,30vw,440px);padding:clamp(24px,2.4vw,38px);border-radius:22px;background:var(--blanc);box-shadow:0 30px 60px -44px rgba(6,52,58,.5);transition:transform .9s var(--ease),box-shadow .9s var(--ease)}
.rt-p:hover{transform:translateY(-8px);box-shadow:0 44px 70px -40px rgba(6,52,58,.6)}
.rt-n{font-family:var(--serif);font-style:italic;font-size:clamp(54px,5vw,84px);line-height:.8;color:var(--laiton)}
.rt-ico{position:absolute;right:clamp(20px,2.2vw,34px);top:clamp(20px,2.2vw,34px);width:clamp(84px,8vw,124px);height:auto;color:var(--nuit);transition:color .6s var(--ease),transform 1s var(--ease)}
.rt-p:hover .rt-ico{color:var(--laiton);transform:translateY(-4px) rotate(-4deg)}
.rt-p h3{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3vw,50px);line-height:1;margin-top:auto;padding-top:40px}
.rt-p p{margin-top:14px;color:var(--doux);max-width:24em}
.rt-d{display:block;margin-top:22px;padding-top:16px;border-top:1px dashed rgba(18,36,40,.22);font-size:13px;color:var(--encre)}
.rt-p:not(.fin)::after{content:'';position:absolute;right:calc(clamp(14px,1.4vw,22px)*-.5 - 17px);top:50%;width:34px;height:34px;margin-top:-17px;border-radius:50%;z-index:2;background:var(--papier) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 10' fill='none' stroke='%23122428' stroke-width='1.3'%3E%3Cpath d='M0 5h16M12 1l4 4-4 4'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:0 0 0 1px var(--trait)}
.rt-p.fin{background:var(--nuit);color:var(--creme)}
.rt-p.fin .rt-ico{color:var(--laiton-c)}
.rt-p.fin p{color:rgba(241,235,224,.75)}
.rt-p.fin .rt-d{color:var(--creme);border-top-color:rgba(241,235,224,.35);position:relative}
.rt-p.fin .rt-d::before,.rt-p.fin .rt-d::after{content:'';position:absolute;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--papier)}
.rt-p.fin .rt-d::before{left:calc(clamp(24px,2.4vw,38px)*-1 - 11px)}
.rt-p.fin .rt-d::after{right:calc(clamp(24px,2.4vw,38px)*-1 - 11px)}
@media(max-width:900px){
  .retrait.v5 .rt-tete{grid-template-columns:1fr}
  .rt-pas{grid-template-columns:1fr}
  .rt-p{min-height:0}
  .rt-p h3{padding-top:30px}
  .rt-p:not(.fin)::after{right:auto;left:50%;margin-left:-17px;top:auto;bottom:calc(clamp(14px,1.4vw,22px)*-.5 - 17px);transform:rotate(90deg)}
  .rt-ico{width:84px}
}

/* ---- Nous rendre visite ---- */
.vs-etat{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:9px 16px 9px 13px;border-radius:100px;font-size:13.5px;background:rgba(18,36,40,.06)}
.vs-etat i{width:8px;height:8px;border-radius:50%;background:var(--doux)}
.vs-etat.ouvert i{background:#2F8C5A;box-shadow:0 0 0 0 rgba(47,140,90,.5);animation:vs-pouls 2.2s ease-out infinite}
@keyframes vs-pouls{to{box-shadow:0 0 0 9px rgba(47,140,90,0)}}
.vs-actions{display:flex;gap:10px;flex-wrap:wrap}
.visite.v5 .d3{font-size:clamp(30px,3.2vw,52px)}
.v5 .vt-ln b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.v5 .vt-pied{margin:clamp(18px,3vh,30px) 0 0 clamp(20px,2vw,32px);font-size:13.5px;line-height:1.6;color:var(--doux);max-width:30em}
@media(max-width:860px){.v5 .vt-pied{margin:18px 22px 0}}
@media(min-width:861px) and (max-height:760px){.v5 .vt-pied{display:none}}
.programme.v5 .attente{grid-template-columns:auto minmax(0,1fr)}
.programme.v5 .at-photo{width:clamp(250px,27vw,420px);min-height:0;aspect-ratio:3/4;border-radius:999px 999px 22px 22px}
.programme.v5 .at-photo::after{background:linear-gradient(180deg,transparent 55%,rgba(6,52,58,.7))}
.programme.v5 .at-pastille{left:50%;transform:translateX(-50%);white-space:nowrap}
.programme.v5 .at-txt .d3{font-size:clamp(36px,4.4vw,72px);line-height:1}
@media(max-width:1000px){.programme.v5 .attente{grid-template-columns:1fr}.programme.v5 .at-photo{width:min(100%,340px);margin:0 auto}}
.rt-ico{width:clamp(110px,10.5vw,170px);stroke-width:1.1}
.rt-p{box-shadow:0 24px 40px -34px rgba(6,52,58,.45)}
.rt-p:hover{box-shadow:0 34px 50px -34px rgba(6,52,58,.55)}
@media(max-width:900px){.rt-ico{width:96px}}
.rt-p:not(.fin){z-index:2}
.programme.v5 .p-reste{opacity:1;color:rgba(241,235,224,.72)}
.at-visuel{height:min(64vh,600px)}
@media(max-width:1320px){.v5 .epingle .vt-astuce{display:none}}

/* ================= v22 : sélection, cartes et fiche ================= */
.cat-infos #compte{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--encre);max-width:40em}
.fiche-c .visuel::after{content:none}
.fiche-c:hover .etiquette-r{opacity:1}
.fiche-c .visuel{transition:box-shadow .8s var(--ease),background-color .8s var(--ease)}
.fiche-c .visuel::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 55% at 50% 38%,rgba(255,255,255,.75),transparent 70%);opacity:0;transition:opacity .9s var(--ease);pointer-events:none}
.fiche-c:hover .visuel::before{opacity:1}
.fiche-c .visuel.detoure img{transition:transform 1.1s var(--ease),filter .8s var(--ease)}
.fiche-c:hover .visuel.detoure img{transform:translateY(-10px) rotate(-2.2deg) scale(1.04);filter:drop-shadow(0 18px 14px rgba(6,52,58,.2))}
.fiche-c:hover .visuel.detoure.plat img,.fiche-c:hover .visuel.detoure.cubi img{transform:translateY(-8px) rotate(-1.2deg) scale(1.03)}
.fiche-c h3{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;display:inline;padding-bottom:2px;transition:background-size .7s var(--ease)}
.fiche-c:hover h3{background-size:100% 1px}
.fiche-c .marque-c{display:block}
.fiche-c .orig{display:block}
.fiche-c .ajout{background:linear-gradient(var(--laiton),var(--laiton)) 0 100%/100% 0 no-repeat,var(--nuit);transition:transform .6s var(--ease),background-size .55s var(--ease),color .4s var(--ease),letter-spacing .6s var(--ease)}
.fiche-c .ajout:not(.voir):not([disabled])::before{content:'';width:15px;height:16px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 16' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round'%3E%3Cpath d='M2 5.5h11l1 9.5H1z'/%3E%3Cpath d='M4.7 5.5V4a2.8 2.8 0 0 1 5.6 0v1.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 16' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round'%3E%3Cpath d='M2 5.5h11l1 9.5H1z'/%3E%3Cpath d='M4.7 5.5V4a2.8 2.8 0 0 1 5.6 0v1.5'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .6s var(--ease)}
.fiche-c .ajout:not(.voir):not([disabled]):hover{background:linear-gradient(var(--laiton),var(--laiton)) 0 100%/100% 100% no-repeat,var(--nuit);color:var(--nuit);letter-spacing:.02em}
.fiche-c .ajout:not(.voir):hover::before{transform:translateY(-2px) rotate(-8deg)}
.fiche-c .ajout:not(.voir):hover::after{transform:rotate(180deg) scale(1.25)}
.fiche-c .ajout.ok,.fiche-c .ajout.ok:hover{background-size:100% 100%;color:var(--nuit);letter-spacing:0}
.fiche-c .ajout.ok::after{content:'';width:12px;height:7px;border-left:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg) translate(1px,-2px)!important;font-size:0}
.fiche-c .ajout.ok::before{animation:aj-saut .6s var(--ease)}
@keyframes aj-saut{40%{transform:translateY(-6px) scale(1.15)}}
.fiche-c .ajout.voir{background:var(--creme)}
/* fiche : les formats larges (cubis, coffrets) tiennent dans l'écrin comme une bouteille */
.fiche .visuel.detoure.large img{max-width:calc(var(--cap-h) * .47);max-height:calc(var(--cap-h) * .62)}
@media (prefers-reduced-motion:reduce){.fiche-c:hover .visuel.detoure img{transform:none}}

/* ================= v23 : rayons pilotés par le scroll, maisons ================= */
/* ---- Rayons : scène collée, une seule ligne de temps ---- */
@media(min-width:861px){
  #rayons.defile{height:calc(100svh + 380vh)}
  #rayons.defile .vt-cadre{position:sticky;top:0;height:100svh}
  #rayons.defile .vitrine{min-height:0}
  #rayons.defile #vtNom{display:grid}
  #rayons.defile #vtNom span{grid-area:1/1;will-change:transform}
  #rayons.defile .vt-groupe{will-change:transform,opacity}
  #rayons.defile .vt-groupe:not(.actif){pointer-events:none}
  #rayons.defile .vt-anneau{display:none}
}

/* ---- La maison et ses maisons ---- */
.mz{padding:clamp(90px,10vw,160px) var(--marge) clamp(90px,10vw,150px);background:var(--creme)}
.mz-tete{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;align-items:start}
.mz-tete .note{grid-column:1/3;padding-top:.5em}
.mz-tete .d3{grid-column:3/11;font-size:clamp(24px,2.7vw,42px);line-height:1.22;letter-spacing:-.01em}
.mz-tete .d3 .mot{opacity:.16;transition:opacity .45s}
.mz-tete .d3 .mot.lu{opacity:1}
.mz-tete .cta{grid-column:3/11;justify-self:start;margin-top:clamp(14px,2vw,26px)}
.mz-corps{margin-top:clamp(70px,9vw,140px)}
.mz-barre{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 40px;flex-wrap:wrap;padding-bottom:clamp(18px,2vw,26px);border-bottom:1px solid var(--trait)}
.mz-titre{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,46px);line-height:1.05;letter-spacing:-.015em}
.mz-filtres{display:flex;flex-wrap:wrap;gap:6px}
.mz-filtres button{font-size:13.5px;padding:9px 16px;border-radius:100px;box-shadow:inset 0 0 0 1px var(--trait);color:var(--doux);transition:background .4s var(--ease),color .4s,box-shadow .4s}
.mz-filtres button:hover{color:var(--encre);box-shadow:inset 0 0 0 1px var(--encre)}
.mz-filtres button[aria-pressed="true"]{background:var(--nuit);color:var(--creme);box-shadow:none}
.mz-mur{display:flex;flex-wrap:wrap;align-items:baseline;gap:clamp(2px,.5vw,8px) 0;margin-top:clamp(28px,3.4vw,50px)}
.mz-n{position:relative;display:inline-flex;align-items:baseline;gap:10px;padding:clamp(4px,.6vw,9px) clamp(16px,2.2vw,38px) clamp(4px,.6vw,9px) 0;text-align:left;transition:opacity .5s var(--ease)}
.mz-n::after{content:'';position:absolute;right:clamp(6px,.9vw,16px);top:50%;width:6px;height:6px;margin-top:-3px;border:1px solid var(--laiton);transform:rotate(45deg);opacity:.7}
.mz-nn{font-family:var(--serif);font-size:clamp(30px,4.3vw,72px);line-height:1.08;letter-spacing:-.025em;color:var(--encre);background:linear-gradient(var(--laiton),var(--laiton)) 0 92%/0 2px no-repeat;transition:color .45s var(--ease),background-size .7s var(--ease)}
.mz-l{font-size:12.5px;color:var(--doux);white-space:nowrap;transform:translateY(-.9em);opacity:0;transition:opacity .45s var(--ease)}
.mz-mur:hover .mz-n{opacity:.28}
.mz-mur .mz-n:hover,.mz-n:focus-visible{opacity:1}
.mz-n:hover .mz-nn,.mz-n:focus-visible .mz-nn{color:var(--nuit);background-size:100% 2px}
.mz-n:hover .mz-l,.mz-n:focus-visible .mz-l{opacity:1}
.mz-n.hors,.mz-mur:hover .mz-n.hors{opacity:.1;pointer-events:none}
.mz-aide{display:flex;align-items:center;gap:12px;margin-top:clamp(30px,3.4vw,50px);font-size:13.5px;color:var(--doux)}
.mz-aide i{width:26px;height:1px;background:var(--laiton)}
.mz-apercu{position:fixed;left:0;top:0;z-index:90;width:clamp(120px,11vw,170px);height:clamp(220px,20vw,310px);pointer-events:none;opacity:0;transition:opacity .35s var(--ease);display:flex;align-items:flex-end;justify-content:center;will-change:transform}
.mz-apercu.on{opacity:1}
.mz-apercu img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 22px 20px rgba(6,52,58,.3))}
@media(hover:none),(pointer:coarse){.mz-l{display:none}.mz-n{padding-right:26px}}
@media(max-width:860px){
  .mz-tete .note,.mz-tete .d3,.mz-tete .cta{grid-column:1/-1}
  .mz-nn{font-size:clamp(27px,8vw,40px)}
  .mz-n::after{right:9px;width:5px;height:5px}
  .mz-filtres{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(var(--marge)*-1);padding:0 var(--marge);scrollbar-width:none;width:100vw}
  .mz-filtres::-webkit-scrollbar{display:none}
  .mz-filtres button{white-space:nowrap}
}

/* la fiche d'une maison */
.mzf{position:fixed;inset:0;z-index:300;background:var(--abysse);color:var(--creme);display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);overflow:hidden}
.mzf-fond{position:absolute;inset:0;background:radial-gradient(ellipse 38% 56% at 23% 54%,rgba(196,138,96,.3),transparent 70%),radial-gradient(ellipse 70% 60% at 80% 120%,rgba(12,80,89,.95),transparent 70%);pointer-events:none}
.mzf-fermer{position:absolute;right:var(--marge);top:26px;z-index:5;display:flex;align-items:center;gap:12px;font-size:14px;color:var(--creme)}
.mzf-fermer i{position:relative;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(241,235,224,.35);transition:background .4s var(--ease),transform .6s var(--ease)}
.mzf-fermer i::before,.mzf-fermer i::after{content:'';position:absolute;left:50%;top:50%;width:14px;height:1.3px;margin:-.65px 0 0 -7px;background:currentColor;transform:rotate(45deg)}
.mzf-fermer i::after{transform:rotate(-45deg)}
.mzf-fermer:hover i{background:var(--laiton);color:var(--nuit);transform:rotate(90deg)}
.mzf-scene{position:relative;height:100svh}
.mzf-arche{position:absolute;left:50%;top:50%;height:74%;aspect-ratio:5/8;transform:translate(-50%,-50%);border-radius:999px;border:1px solid rgba(196,138,96,.55)}
.mzf-arche::after{content:'';position:absolute;inset:-12px;border-radius:999px;border:1px solid rgba(196,138,96,.2)}
.mzf-b{position:absolute;display:flex;align-items:flex-end;justify-content:center}
.mzf-b img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 34px 30px rgba(0,0,0,.5))}
.mzf-b.b1{left:30%;width:40%;bottom:15%;height:66%;z-index:3}
.mzf-b.b2{left:6%;width:28%;bottom:17%;height:46%;z-index:2;filter:brightness(.82)}
.mzf-b.b3{right:6%;width:28%;bottom:17%;height:46%;z-index:2;filter:brightness(.82)}
.mzf-b.large.b1{left:22%;width:56%;height:50%;bottom:22%}
.mzf-b.large.b2,.mzf-b.large.b3{height:34%}
.mzf-cle{position:absolute;left:50%;top:50%;width:34px;height:auto;transform:translate(-50%,-50%);filter:brightness(0) invert(1);opacity:.5}
.mzf-texte{position:relative;align-self:center;max-height:100svh;overflow-y:auto;padding:110px var(--marge) 130px clamp(10px,3vw,50px);scrollbar-width:none}
.mzf-texte::-webkit-scrollbar{display:none}
.mzf-texte .note{color:var(--laiton-c)}
.mzf-logo{margin-top:22px;height:clamp(40px,4.4vw,64px)}
.mzf-logo img{height:100%;width:auto;max-width:260px;object-fit:contain;object-position:left center;filter:brightness(0) invert(1);opacity:.92}
.mzf-texte .d2{margin-top:12px;font-size:clamp(44px,6vw,104px);line-height:.95}
.mzf-texte.avec-logo .d2{font-size:clamp(30px,3.2vw,52px);margin-top:18px}
.mzf-meta{display:flex;flex-wrap:wrap;margin-top:clamp(24px,3vw,40px);border-top:1px solid rgba(196,138,96,.32);border-bottom:1px solid rgba(196,138,96,.32)}
.mzf-meta>div{padding:15px clamp(18px,2.4vw,38px) 15px 0}
.mzf-meta>div+div{padding-left:clamp(18px,2.4vw,38px);border-left:1px solid rgba(196,138,96,.32)}
.mzf-meta dt{font-size:12.5px;color:var(--laiton-c)}
.mzf-meta dd{font-family:var(--serif);font-size:clamp(18px,1.5vw,23px);margin-top:3px}
.mzf-hist{margin-top:clamp(24px,3vw,38px);max-width:34em;font-size:clamp(16px,1.25vw,19px);line-height:1.65;color:rgba(241,235,224,.86)}
.mzf-refs{list-style:none;margin-top:clamp(22px,2.6vw,34px);max-width:36em}
.mzf-refs a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:12px 0;border-bottom:1px solid rgba(241,235,224,.14);transition:padding .6s var(--ease),color .4s}
.mzf-refs a span{font-family:var(--serif);font-size:19px}
.mzf-refs a em{font-style:normal;font-size:13px;color:rgba(241,235,224,.55);text-align:right}
.mzf-refs a:hover{padding-left:12px;color:var(--laiton-c)}
.mzf-texte .cta{margin-top:clamp(26px,3vw,40px)}
.mzf-nav{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px var(--marge);background:linear-gradient(180deg,transparent,rgba(6,52,58,.92) 45%)}
.mzf-nav button{display:flex;align-items:center;gap:14px;font-family:var(--serif);font-size:clamp(16px,1.4vw,21px);color:rgba(241,235,224,.75);transition:color .4s}
.mzf-nav button:hover{color:var(--laiton-c)}
.mzf-nav .fl{width:18px;height:10px;transition:transform .5s var(--ease)}
.mzf-nav #mzPrec:hover .fl{transform:translateX(-5px)}
.mzf-nav #mzSuiv:hover .fl{transform:translateX(5px)}
.mzf-nav p{font-size:13px;color:rgba(241,235,224,.5)}
@media(max-width:900px){
  .mzf{display:block;overflow-y:auto}
  .mzf-scene{height:46svh;min-height:330px}
  .mzf-fond{background:radial-gradient(ellipse 70% 30% at 50% 24%,rgba(196,138,96,.3),transparent 70%)}
  .mzf-texte{max-height:none;overflow:visible;padding:10px var(--marge) 120px}
  .mzf-fermer span{display:none}
  .mzf-fermer{top:16px}
  .mzf-nav{position:fixed}
  .mzf-nav button span{max-width:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
.mz-l{display:none}
.mz-apercu{flex-direction:column;align-items:center;justify-content:flex-end;gap:12px;height:auto}
.mz-apercu img{height:clamp(200px,19vw,290px);width:auto;max-width:none}
.mz-apercu span{font-size:12.5px;white-space:nowrap;padding:6px 12px;border-radius:100px;background:var(--nuit);color:var(--creme)}
.mz-apercu span:empty{display:none}
.mzf-b.b1{bottom:19%;height:60%}
.mzf-b.b2,.mzf-b.b3{bottom:21%;height:40%}
.mzf-texte{padding-top:96px;padding-bottom:110px}
.mzf-texte .d2{font-size:clamp(40px,5.2vw,88px)}
.mzf-refs a{padding:10px 0}
@media(min-width:901px) and (max-height:780px){.mzf-refs{display:none}.mzf-texte .d2{font-size:clamp(36px,4.4vw,64px)}}
@media(max-width:560px){.mzf-meta>div:nth-child(3){flex-basis:100%;border-left:0;padding-left:0;border-top:1px solid rgba(196,138,96,.32)}}

/* ================= v24 : logos des maisons, une seule teinte ================= */
.mz-logos{margin:clamp(40px,5vw,80px) calc(var(--marge)*-1) 0;padding:clamp(22px,2.4vw,34px) 0;border-top:1px solid var(--trait);border-bottom:1px solid var(--trait);overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mz-piste{display:flex;align-items:center;width:max-content;animation:mz-defile var(--duree,110s) linear infinite}
.mz-logos:hover .mz-piste,.mz-logos:focus-within .mz-piste{animation-play-state:paused}
@keyframes mz-defile{to{transform:translateX(-50%)}}
.mz-lg{flex:none;display:flex;align-items:center;justify-content:center;height:clamp(54px,5.4vw,78px);padding:0 clamp(22px,2.8vw,46px)}
.mz-lg img{height:100%;width:auto;max-width:clamp(120px,12vw,190px);object-fit:contain;filter:brightness(0);opacity:.5;transition:opacity .5s var(--ease),transform .7s var(--ease)}
.mz-lg:hover img,.mz-lg:focus-visible img{opacity:1;transform:scale(1.06)}
@media (prefers-reduced-motion:reduce){.mz-piste{animation:none}.mz-logos{overflow-x:auto}}
.mzf-logo{height:clamp(54px,5.6vw,84px)}
.mzf-logo img{max-width:300px}
.mzf-b.seul{left:32%;width:36%;bottom:30%;height:40%;align-items:center}
.mzf-b.seul img{filter:brightness(0) invert(1);opacity:.9;max-height:100%}
.mzf-texte.avec-logo.sans-flacon .mzf-logo{display:none}

/* ================= v25 : commande confirmée, flacons cliquables ================= */
.cf-haut{position:relative;background:var(--nuit);color:var(--creme);padding:clamp(120px,13vw,190px) var(--marge) clamp(110px,11vw,170px);overflow:hidden}
.cf-fond{position:absolute;inset:0;background:radial-gradient(ellipse 50% 90% at 82% 30%,rgba(196,138,96,.26),transparent 70%),radial-gradient(ellipse 60% 70% at 0% 110%,rgba(6,52,58,.9),transparent 70%)}
.cf-haut .fil{position:relative;font-size:13px;color:rgba(241,235,224,.6)}
.cf-titre{position:relative;display:flex;align-items:center;gap:clamp(20px,3vw,44px);margin-top:clamp(18px,2vw,28px)}
.cf-coche{flex:none;width:clamp(64px,7vw,104px);height:auto;color:var(--laiton-c)}
.cf-coche circle{stroke-dasharray:1;stroke-dashoffset:1;animation:cf-trait 1.3s var(--ease-io) .5s forwards}
.cf-coche path{stroke-dasharray:1;stroke-dashoffset:1;animation:cf-trait .7s var(--ease) 1.45s forwards}
@keyframes cf-trait{to{stroke-dashoffset:0}}
.cf-haut h1{font-family:var(--serif);font-weight:400;font-size:clamp(44px,6.6vw,112px);line-height:.96;letter-spacing:-.025em}
.cf-lead{margin-top:16px;font-size:clamp(15.5px,1.2vw,18px);color:rgba(241,235,224,.8)}
.cf-corps{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,4vw,70px);align-items:start;padding:0 var(--marge) clamp(70px,8vw,120px);background:linear-gradient(180deg,var(--nuit) 0,var(--nuit) clamp(60px,6vw,90px),var(--creme) clamp(60px,6vw,90px))}
.cf-ticket{position:relative;background:var(--blanc);border-radius:22px;box-shadow:0 40px 80px -50px rgba(6,52,58,.7);margin-top:calc(clamp(60px,6vw,90px)*-1 + clamp(20px,2vw,30px));transform:translateY(calc(clamp(40px,4vw,60px)*-1))}
.cf-t-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;padding:clamp(24px,2.6vw,40px) clamp(22px,2.6vw,42px) clamp(20px,2.2vw,32px)}
.cf-num{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.cf-num b{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.4vw,54px);line-height:1;letter-spacing:-.01em;font-variant-numeric:lining-nums}
.cf-copier{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;padding:8px 13px;border-radius:100px;box-shadow:inset 0 0 0 1px var(--trait);color:var(--doux);transition:color .3s,box-shadow .3s,background .3s}
.cf-copier svg{width:14px;height:14px}
.cf-copier:hover{color:var(--encre);box-shadow:inset 0 0 0 1px var(--encre)}
.cf-copier.ok{background:var(--nuit);color:var(--creme);box-shadow:none}
.cf-etat{font-size:13px;padding:9px 16px;border-radius:100px;background:var(--papier);color:var(--encre);white-space:nowrap}
.cf-etat.paye{background:rgba(47,140,90,.14);color:#1F6A43}
.cf-lignes{position:relative;padding:6px clamp(22px,2.6vw,42px) clamp(22px,2.4vw,34px)!important;border-top:1px dashed rgba(18,36,40,.25)!important}
.cf-lignes::before,.cf-lignes::after{content:'';position:absolute;top:-12px;width:24px;height:24px;border-radius:50%;background:var(--creme)}
.cf-lignes::before{left:-12px}.cf-lignes::after{right:-12px}
.cf-l{grid-template-columns:72px 1fr auto;gap:20px;padding:16px 0}
.cf-v{width:72px;height:92px;border-radius:36px}
.cf-v .cf-cle{width:14px;height:auto;object-fit:contain;opacity:.55}
.cf-tx b{font-size:clamp(17px,1.4vw,21px)}
.cf-tx span{font-size:13px}
.cf-p{font-size:16px}
.cf-total{padding-top:22px;font-size:clamp(22px,2vw,30px)}
.cf-l{opacity:0;transform:translateY(14px)}
.cf-ticket.pret .cf-l{opacity:1;transform:none;transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
.cf-ticket.pret .cf-l:nth-child(2){transition-delay:.08s}.cf-ticket.pret .cf-l:nth-child(3){transition-delay:.16s}.cf-ticket.pret .cf-l:nth-child(4){transition-delay:.24s}.cf-ticket.pret .cf-l:nth-child(n+5){transition-delay:.32s}
.cf-t-pied{display:flex;justify-content:space-between;align-items:center;gap:14px 30px;flex-wrap:wrap;padding:clamp(18px,2vw,26px) clamp(22px,2.6vw,42px);border-top:1px solid var(--trait);font-size:13px;color:var(--doux);border-radius:0 0 22px 22px;background:rgba(237,228,212,.45)}
.cf-t-pied p{max-width:34em}
.cf-t-pied button{color:var(--encre);white-space:nowrap}
.cf-cote{display:grid;gap:clamp(30px,4vw,60px);padding-top:clamp(90px,9vw,130px)}
.cf-suite ol{list-style:none;margin-top:clamp(20px,2.4vw,32px);position:relative}
.cf-suite li{position:relative;padding:0 0 clamp(20px,2.2vw,30px) 40px}
.cf-suite li::before{content:'';position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--laiton);background:var(--creme);z-index:1}
.cf-suite li::after{content:'';position:absolute;left:7px;top:10px;bottom:-6px;width:1px;background:var(--trait)}
.cf-suite li:last-child::after{display:none}
.cf-suite li.fait::before{background:var(--laiton);box-shadow:none}
.cf-suite li.fait::after{background:var(--laiton)}
.cf-suite li.encours::before{background:var(--nuit);box-shadow:0 0 0 0 rgba(12,80,89,.45);animation:cf-pouls 2.2s ease-out infinite}
@keyframes cf-pouls{to{box-shadow:0 0 0 10px rgba(12,80,89,0)}}
.cf-suite b{font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.6vw,24px);line-height:1.15}
.cf-suite li:not(.fait):not(.encours) b{color:var(--doux)}
.cf-suite li p{margin-top:5px;font-size:14px;color:var(--doux);max-width:30em}
.cf-lieu{border-radius:22px;overflow:hidden;background:var(--papier)}
.cf-lieu .carte-maps{margin:0;aspect-ratio:16/8;border-radius:0}
.cf-lieu .carte-maps iframe{width:100%;height:100%;border:0;filter:grayscale(.35) contrast(.96)}
.cf-lieu-txt{padding:clamp(22px,2.4vw,36px)}
.cf-adresse{font-family:var(--serif);font-size:clamp(21px,1.8vw,27px);line-height:1.2;margin-top:8px}
.cf-lieu-txt .vs-etat{margin-top:14px;background:rgba(18,36,40,.07)}
.cf-lieu-txt dl{display:grid;grid-template-columns:auto 1fr;gap:8px 22px;margin:20px 0 26px;font-size:14px}
.cf-lieu-txt dt{color:var(--doux)}
.cf-apres{display:flex;justify-content:space-between;align-items:center;gap:24px 40px;flex-wrap:wrap;padding:clamp(40px,5vw,70px) var(--marge) clamp(80px,9vw,130px);border-top:1px solid var(--trait);margin:0}
.cf-apres div{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:900px){
  .cf-corps{grid-template-columns:1fr}
  .cf-cote{padding-top:0}
  .cf-titre{align-items:flex-start}
  .cf-l{grid-template-columns:56px 1fr auto;gap:14px}
  .cf-v{width:56px;height:72px;border-radius:28px}
}
@media print{
  .nav,#menuMobile,#panier,#voilePanier,.curseur,.pied,.cf-apres,.cf-cote,.cf-copier,#imprimer,#age,#rideau,.chargement{display:none!important}
  .cf-haut{padding:20px 0;background:none;color:#000}.cf-fond,.cf-coche{display:none}
  .cf-corps{display:block;background:none;padding:0}
  .cf-ticket{box-shadow:none;transform:none;margin:0;border:1px solid #999}
}

/* rayons : le flacon mène à sa fiche dans la sélection */
.vt-scene a.vt-heros,.vt-scene a.vt-flot{pointer-events:auto;cursor:pointer}
#rayons.defile .vt-groupe:not(.actif) a{pointer-events:none}
.vt-scene a.vt-heros img{transition:filter .6s var(--ease)}
.vt-scene a.vt-heros:hover img{filter:drop-shadow(0 38px 34px rgba(0,0,0,.34)) drop-shadow(0 6px 8px rgba(0,0,0,.18)) brightness(1.04)}
.vt-scene a.vt-flot{transition:opacity .5s var(--ease)}
.vt-scene a.vt-flot:hover{opacity:1}
.cf-v img.cf-cle{width:13px;height:auto;object-fit:contain;padding:0;filter:brightness(0);opacity:.35;mix-blend-mode:normal}

/* ================= v26 : les flacons de côté passent devant ================= */
a.mzf-b{cursor:pointer;transition:filter .9s var(--ease)}
a.mzf-b.b2:hover,a.mzf-b.b3:hover{filter:brightness(1)}
a.mzf-b.b2 img,a.mzf-b.b3 img{transition:transform .8s var(--ease)}
a.mzf-b.b2:hover img,a.mzf-b.b3:hover img{transform:translateY(-8px)}
.mzf-legende{position:absolute;left:0;right:0;bottom:12.5%;text-align:center;font-family:var(--serif);font-style:italic;font-size:16px;color:var(--laiton-c);z-index:4;padding:0 20px}
@media(max-width:900px){.mzf-legende{bottom:4%;font-size:14.5px}}
.mzf-texte .cta{margin-top:clamp(22px,2.6vw,34px)}
.mzf-texte .cta+.mzf-refs{margin-top:clamp(20px,2.4vw,30px)}

/* ================= v27 : plus de curseur personnalisé, le survol des flacons parle de lui-même ================= */
.curseur{display:none!important}

/* rayons : le grand flacon */
.vt-corps{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;transform-origin:50% 100%;transition:transform 1s var(--ease)}
.vt-corps img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.vt-eclat,.mzf-eclat,.eclat-c{position:absolute;inset:0;pointer-events:none;-webkit-mask:var(--m) center bottom/contain no-repeat;mask:var(--m) center bottom/contain no-repeat;background:linear-gradient(108deg,transparent 38%,rgba(255,255,255,.0) 42%,rgba(255,255,255,.75) 50%,rgba(255,255,255,0) 58%,transparent 62%) no-repeat;background-size:260% 100%;background-position:96% 0;opacity:0}
a.vt-heros:hover .vt-corps{transform:translateY(-16px) rotate(-2.4deg) scale(1.035)}
a.vt-heros:hover .vt-eclat,a.mzf-b.b1:hover .mzf-eclat,.fiche-c:hover .eclat-c{opacity:1;background-position:4% 0;transition:background-position 1.05s cubic-bezier(.45,.05,.3,1) .05s,opacity .15s}
.vt-ombre{transition:transform 1s var(--ease),opacity 1s var(--ease)}
.vt-groupe:has(a.vt-heros:hover) .vt-ombre{transform:scaleX(.78);opacity:.7}
.vt-cartel{position:absolute;left:50%;bottom:-46px;transform:translate(-50%,10px);white-space:nowrap;max-width:150%;overflow:hidden;text-overflow:ellipsis;font-family:var(--serif);font-style:italic;font-size:clamp(16px,1.3vw,20px);color:var(--encre);padding-bottom:5px;background:linear-gradient(var(--laiton),var(--laiton)) 50% 100%/0 1px no-repeat;opacity:0;transition:opacity .5s var(--ease),transform .8s var(--ease),background-size .9s var(--ease) .1s;pointer-events:none}
a.vt-heros:hover .vt-cartel{opacity:1;transform:translate(-50%,0);background-size:100% 1px}
.v5 .vt-l.vu{background:rgba(18,36,40,.09)}
.v5 .vt-l.vu .vt-lv{transform:translateY(-4px) rotate(-6deg) scale(1.06)}
/* rayons : un flacon de côté se met au net et s'avance */
.v5 a.vt-flot{transition:filter .7s var(--ease),opacity .7s var(--ease)}
.v5 a.vt-flot img{transition:transform .9s var(--ease)}
.v5 a.vt-flot:hover{filter:blur(0);opacity:1}
.v5 a.vt-flot:hover img{transform:scale(1.1)}
@media(max-width:860px){.vt-cartel{display:none}}

/* fiche d'une maison : même langage */
a.mzf-b{position:absolute}
a.mzf-b.b1 img{transition:transform 1s var(--ease)}
a.mzf-b.b1:hover img{transform:translateY(-14px) rotate(-2deg) scale(1.03);transform-origin:50% 100%}
a.mzf-b.b1:hover .mzf-eclat{transform:translateY(-14px) rotate(-2deg) scale(1.03);transform-origin:50% 100%}
.mzf-eclat{transition:transform 1s var(--ease)}
a.mzf-b:not(.b1) .mzf-eclat{display:none}
.mzf-legende{transition:color .5s}
.mzf-scene:has(a.mzf-b.b1:hover) .mzf-legende{color:var(--creme)}

/* sélection : l'éclat passe sur le produit survolé */
.eclat-c{inset:0;-webkit-mask:var(--m) center/contain no-repeat content-box;mask:var(--m) center/contain no-repeat content-box;padding:9% 12% 11%;transform-origin:50% 92%;transition:transform 1.1s var(--ease);z-index:1}
.fiche-c .visuel.detoure.plat .eclat-c{padding:14% 7%}
.fiche-c:hover .eclat-c{transform:translateY(-10px) rotate(-2.2deg) scale(1.04)}
.fiche-c:hover .visuel.detoure.plat .eclat-c{transform:translateY(-8px) rotate(-1.2deg) scale(1.03)}
@media (prefers-reduced-motion:reduce){.vt-eclat,.mzf-eclat,.eclat-c{display:none}a.vt-heros:hover .vt-corps{transform:none}}
.fiche-c .ajout{z-index:3}.fiche-c .pastilles{z-index:3}

/* ================= v28 : « Entré récemment », les bouteilles posées sur l'étagère ================= */
.bandeau.et{background:var(--papier);padding:clamp(60px,7vw,110px) 0 clamp(60px,7vw,100px)}
.et-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap;padding:0 var(--marge)}
.et-tete .d3{font-size:clamp(34px,4.4vw,72px);line-height:1;letter-spacing:-.02em}
.et-sous{margin-top:14px;color:var(--doux);font-size:15.5px;max-width:34em}
.et-rail{position:relative;margin-top:clamp(30px,4vw,56px);--h:clamp(210px,21vw,300px)}
.et-planche{position:absolute;left:0;right:0;top:calc(var(--h) + 18px);height:1px;background:var(--laiton);opacity:.8}
.et-planche::after{content:'';position:absolute;left:0;right:0;top:1px;height:22px;background:linear-gradient(180deg,rgba(18,36,40,.07),transparent)}
.et-piste{gap:0;align-items:flex-start;padding-top:18px}
.et-i{flex:none;display:flex;flex-direction:column;width:clamp(210px,19vw,280px);padding:0 clamp(16px,1.8vw,30px)}
.et-v{position:relative;height:var(--h);display:flex;align-items:flex-end;justify-content:center;transform-origin:50% 100%;transition:transform 1s var(--ease)}
.et-v img{max-width:96%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 14px 12px rgba(6,52,58,.16))}
.et-eclat{position:absolute;left:9%;right:9%;top:0;bottom:0;pointer-events:none;-webkit-mask:var(--m) center bottom/contain no-repeat;mask:var(--m) center bottom/contain no-repeat;background:linear-gradient(108deg,transparent 38%,rgba(255,255,255,0) 42%,rgba(255,255,255,.75) 50%,rgba(255,255,255,0) 58%,transparent 62%) no-repeat;background-size:260% 100%;background-position:96% 0;opacity:0}
.et-i:hover .et-eclat{opacity:1;background-position:4% 0;transition:background-position 1.05s cubic-bezier(.45,.05,.3,1) .05s,opacity .15s}
.et-i:hover .et-v{transform:translateY(-12px) rotate(-2deg)}
.et-ombre{position:absolute;left:24%;right:24%;bottom:-7px;height:12px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(6,52,58,.26),transparent 70%);transition:transform 1s var(--ease),opacity 1s var(--ease)}
.et-i:hover .et-ombre{transform:translateY(12px) scaleX(.7);opacity:.6}
.et-badge{position:absolute;left:50%;top:-4px;transform:translateX(-50%);z-index:2;font-style:normal;font-size:11.5px;white-space:nowrap;padding:4px 11px;border-radius:100px;background:var(--nuit);color:var(--creme)}
.et-t{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:clamp(30px,2.8vw,40px)}
.et-m{font-size:12.5px;color:var(--laiton);letter-spacing:.02em}
.et-t b{font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.55vw,24px);line-height:1.14;letter-spacing:-.01em;margin-top:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.et-t b{background:none}
.et-d{font-size:12.5px;line-height:1.45;color:var(--doux);margin-top:7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.et-i:hover .et-t b{color:var(--nuit)}
.et-t::after{content:'';width:0;height:1px;background:var(--laiton);margin-top:12px;transition:width .8s var(--ease)}
.et-i:hover .et-t::after{width:44px}
@media(max-width:700px){
  .et-i{width:56vw;max-width:230px;padding:0 14px}
  .et-rail{--h:200px}
  .et-tete .cta{display:none}
}
@media (prefers-reduced-motion:reduce){.et-rail{overflow-x:auto}.et-eclat{display:none}}
.et-i.opaque .et-v img{mix-blend-mode:multiply;filter:none}
.et-i.opaque .et-eclat{display:none}
.et-planche{background:var(--laiton);opacity:.55}

/* ================= v29 : rayons en photos (produits sans fond transparent) : des arches encadrées, pas des flacons flottants ================= */
.vt-scene a.vt-photo{position:absolute;display:block;pointer-events:auto;cursor:pointer;transition:filter .8s var(--ease)}
#rayons.defile .vt-groupe:not(.actif) a.vt-photo{pointer-events:none}
.vt-arche{position:absolute;inset:0;display:block;overflow:hidden;border-radius:999px 999px 16px 16px;background:var(--papier);box-shadow:0 0 0 1px rgba(196,138,96,.0),0 40px 70px -34px rgba(0,0,0,.55);transition:box-shadow .8s var(--ease)}
.vt-zoom{position:absolute;inset:0;display:block;transition:transform 1.4s var(--ease)}
.vt-zoom img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vt-photo.p1{left:20%;width:60%;bottom:15%;height:68%;z-index:3}
.vt-photo.p2{left:-4%;width:30%;top:12%;height:34%;z-index:2;filter:brightness(.86) saturate(.9)}
.vt-photo.p3{right:-6%;width:32%;bottom:9%;height:36%;z-index:4;filter:brightness(.86) saturate(.9)}
.vt-photo.p1::after{content:'';position:absolute;inset:-12px;border-radius:999px 999px 26px 26px;border:1px solid rgba(255,255,255,.55);opacity:0;transform:scale(.97);transition:opacity .7s var(--ease),transform 1s var(--ease);pointer-events:none}
.vt-photo.p1:hover::after{opacity:1;transform:none}
.vt-photo.p1:hover .vt-zoom{transform:scale(1.07)}
.vt-photo.p1:hover .vt-arche{box-shadow:0 0 0 1px rgba(196,138,96,.6),0 54px 80px -34px rgba(0,0,0,.6)}
.vt-photo:not(.p1):hover{filter:brightness(1) saturate(1)}
.vt-photo:not(.p1):hover .vt-zoom{transform:scale(1.1)}
.v5 .vt-l.photo .vt-lv img{width:clamp(52px,4.6vw,70px);height:clamp(52px,4.6vw,70px);max-height:none;border-radius:50%;object-fit:cover;filter:none;box-shadow:0 8px 16px -8px rgba(6,52,58,.5)}
@media(max-width:860px){
  .vt-photo.p1{left:26%;width:56%;bottom:6%;height:84%}
  .vt-photo.p2{left:2%;width:26%;top:auto;bottom:10%;height:40%}
  .vt-photo.p3{display:none}
}
.vt-photo.p3{right:9%;width:30%;bottom:8%;height:34%}
.v5 .vt-liste{z-index:5}
.vt-photo.p3{bottom:14%}

/* ================= v30 : les maisons en grille de logos (remplace le mur de noms) ================= */
.mz-mur.mzg{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;margin-top:clamp(28px,3.4vw,50px);background:rgba(18,36,40,.13);border:1px solid rgba(18,36,40,.13);border-radius:22px;overflow:hidden}
.mz-c{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;background:var(--creme);overflow:hidden;isolation:isolate;color:var(--encre);transition:opacity .6s var(--ease)}
.mz-c-fond{position:absolute;inset:0;z-index:-1;background:var(--t);transform:translateY(101%);transition:transform .75s var(--ease)}
.mz-c-fond::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 25% 15%,rgba(255,255,255,.2),transparent 60%),radial-gradient(ellipse 80% 70% at 90% 110%,rgba(0,0,0,.28),transparent 60%)}
.mz-c-logo{display:flex;align-items:center;justify-content:center;width:62%;height:46%;transition:transform .85s var(--ease)}
.mz-c-logo img{max-width:100%;max-height:100%;object-fit:contain;filter:brightness(0);opacity:.62;transition:filter .5s var(--ease),opacity .5s var(--ease)}
.mz-c-logo b{font-family:var(--serif);font-weight:400;font-size:clamp(17px,1.6vw,25px);line-height:1.05;letter-spacing:-.01em;text-align:center;transition:color .5s var(--ease)}
.mz-c-b{position:absolute;right:7%;bottom:-6%;width:30%;height:86%;display:flex;align-items:flex-end;justify-content:center;transform:translateY(112%) rotate(10deg);transform-origin:50% 100%;transition:transform .95s var(--ease)}
.mz-c-b img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 14px 14px rgba(0,0,0,.35))}
.mz-c-t{position:absolute;left:9%;bottom:9%;right:42%;display:flex;flex-direction:column;gap:2px;text-align:left;color:#fff;opacity:0;transform:translateY(10px);transition:opacity .5s var(--ease),transform .7s var(--ease)}
.mz-c-t b{font-family:var(--serif);font-weight:400;font-size:clamp(14px,1.1vw,17px);line-height:1.1}
.mz-c-t i{font-style:normal;font-size:11.5px;opacity:.8;line-height:1.3}
@media(hover:hover){
  button.mz-c:hover .mz-c-fond,button.mz-c:focus-visible .mz-c-fond{transform:none}
  button.mz-c:hover .mz-c-logo,button.mz-c:focus-visible .mz-c-logo{transform:translate(-17%,-22%) scale(.82)}
  button.mz-c:hover .mz-c-logo img,button.mz-c:focus-visible .mz-c-logo img{filter:brightness(0) invert(1);opacity:1}
  button.mz-c:hover .mz-c-logo b,button.mz-c:focus-visible .mz-c-logo b{color:#fff}
  button.mz-c:hover .mz-c-b,button.mz-c:focus-visible .mz-c-b{transform:translateY(0) rotate(7deg);transition-delay:.06s}
  button.mz-c:hover .mz-c-t,button.mz-c:focus-visible .mz-c-t{opacity:1;transform:none;transition-delay:.16s}
  button.mz-c.sans-logo:hover .mz-c-t b{display:none}
}
.mz-c:focus-visible{outline:2px solid var(--laiton);outline-offset:-2px}
button.mz-c.hors{opacity:.16;pointer-events:none}
.mz-c-fin{aspect-ratio:auto;justify-content:space-between;gap:20px;padding:0 clamp(20px,2.6vw,44px);background:var(--nuit);color:var(--creme);transition:background .5s var(--ease)}
.mz-c-fin-t{font-family:var(--serif);font-size:clamp(18px,1.7vw,27px);line-height:1.15;text-align:left}
.mz-c-fin .fl{width:22px;height:12px;flex:none;transition:transform .6s var(--ease)}
.mz-c-fin:hover{background:var(--abysse)}
.mz-c-fin:hover .fl{transform:translateX(8px)}
.mz-plus{display:none;margin-top:22px}
@media(max-width:1100px){.mz-mur.mzg{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:700px){
  .mz-mur.mzg{grid-template-columns:repeat(3,minmax(0,1fr));border-radius:16px}
  .mz-c-logo{width:70%;height:50%}
  .mz-mur.replie button.mz-c:nth-child(n+13),.mz-mur.replie .mz-c-fin{display:none}
  .mz-mur.replie+.mz-plus{display:inline-flex}
  .mz-c-fin{min-height:84px}
}
.mz-mur.mzg{align-items:stretch;gap:1px;padding:0}
.mz-mur.mzg>.mz-c{width:100%;min-width:0;height:auto;align-self:stretch;justify-self:stretch;margin:0;padding:0}
.mz-mur.mzg>.mz-c-fin{padding:0 clamp(20px,2.6vw,44px)}
button.mz-c.hors{opacity:1}
button.mz-c.hors .mz-c-logo{opacity:.14;transition:opacity .6s var(--ease)}
.mz-c-logo{transition:transform .85s var(--ease),opacity .6s var(--ease)}
.mz-c-t{left:10%;right:40%;bottom:auto;top:50%;gap:5px;transform:translateY(calc(-50% + 12px))}
.mz-c-t b{font-size:clamp(16px,1.45vw,23px);line-height:1.06;letter-spacing:-.01em}
.mz-c-t i{font-size:12px}
.mz-c-t::after{content:'';width:0;height:1px;background:rgba(255,255,255,.7);margin-top:6px;transition:width .8s var(--ease) .2s}
@media(hover:hover){
  button.mz-c:hover .mz-c-logo,button.mz-c:focus-visible .mz-c-logo{transform:translateY(-16px) scale(.94);opacity:0}
  button.mz-c:hover .mz-c-t,button.mz-c:focus-visible .mz-c-t{transform:translateY(-50%)}
  button.mz-c:hover .mz-c-t::after,button.mz-c:focus-visible .mz-c-t::after{width:34px}
  button.mz-c.sans-logo:hover .mz-c-t b{display:block}
  button.mz-c:not(:has(.mz-c-b)) .mz-c-t{right:10%}
}

/* ================= v31 : offres (sceau de remise, prix remisé, page Offres, lien du menu) ================= */
.etiquette-r.offre.sceau,.fiche-c .pastilles .etiquette-r.offre.sceau,.fiche .pastilles .etiquette-r.offre.sceau{position:absolute;right:0;top:0;left:auto;display:flex;align-items:center;justify-content:center;width:62px;height:62px;padding:0;border-radius:50%;background:var(--laiton);color:var(--nuit);font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.02em;line-height:1;transform:rotate(-9deg);box-shadow:0 0 0 3px var(--laiton),inset 0 0 0 1px rgba(12,80,89,.55),0 10px 18px -8px rgba(6,52,58,.5);transition:transform .8s var(--ease)}
.fiche-c:hover .etiquette-r.offre.sceau{transform:rotate(0deg) scale(1.06)}
.fiche-c .etiquette-r.offre:not(.sceau){background:var(--nuit);color:var(--creme);font-weight:400}
.fiche .pastilles .etiquette-r.offre.sceau{width:78px;height:78px;font-size:22px}
.fiche-c .prix.promo{display:flex;flex-direction:column;align-items:flex-end;gap:1px;line-height:1.1}
.fiche-c .prix.promo s{font-size:12.5px;color:var(--doux);margin:0;text-decoration-thickness:1px}
.fiche-c .prix.promo b{font-weight:500;font-size:16.5px;color:#9A5A2E}
.lien-offres{position:relative}
.lien-offres::after{content:'';position:absolute;right:-9px;top:1px;width:5px;height:5px;border-radius:50%;background:var(--laiton)}

.of-haut{position:relative;background:var(--nuit);color:var(--creme);padding:clamp(130px,14vw,200px) var(--marge) clamp(60px,7vw,100px);overflow:hidden}
.of-fond{position:absolute;inset:0;background:radial-gradient(ellipse 46% 90% at 86% 20%,rgba(196,138,96,.3),transparent 70%),radial-gradient(ellipse 60% 70% at 0% 110%,rgba(6,52,58,.9),transparent 70%)}
.of-haut .fil{position:relative;font-size:13px;color:rgba(241,235,224,.6)}
.of-haut h1{position:relative;margin-top:16px;font-family:var(--serif);font-weight:400;font-size:clamp(46px,7.4vw,124px);line-height:.95;letter-spacing:-.03em}
.of-lead{position:relative;margin-top:20px;max-width:34em;font-size:clamp(16px,1.25vw,19px);color:rgba(241,235,224,.82)}
.of-corps{padding:clamp(50px,6vw,90px) var(--marge) clamp(90px,10vw,150px)}
.of-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.8vw,28px)}
.of-grille.peu{grid-template-columns:minmax(0,1fr)}
.of-c{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);background:var(--blanc);border-radius:22px;overflow:hidden;box-shadow:0 30px 60px -48px rgba(6,52,58,.6);transition:transform .9s var(--ease),box-shadow .9s var(--ease)}
.of-c:hover{transform:translateY(-6px);box-shadow:0 44px 70px -46px rgba(6,52,58,.7)}
.of-v{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:clamp(300px,30vw,440px);background:var(--papier);overflow:hidden;isolation:isolate}
.of-v::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 55% at 50% 40%,rgba(255,255,255,.8),transparent 70%)}
.of-v img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:10% 14% 9%;mix-blend-mode:multiply;transform-origin:50% 92%;transition:transform 1.1s var(--ease)}
.of-c:hover .of-v img{transform:translateY(-8px) rotate(-2deg) scale(1.04)}
.of-v.photo img{object-fit:cover;padding:0;mix-blend-mode:normal}
.of-c:hover .of-v.photo img{transform:scale(1.05)}
.of-v .etiquette-r{z-index:2}
.of-v .etiquette-r.offre.sceau{right:18px;top:18px;width:82px;height:82px;font-size:24px}
.of-v .etiquette-r.offre:not(.sceau){position:absolute;left:18px;top:18px;background:var(--nuit);color:var(--creme);font-size:13px;padding:6px 14px;border-radius:100px}
.of-t{display:flex;flex-direction:column;padding:clamp(24px,2.8vw,46px)}
.of-m{font-size:13px;color:var(--laiton)}
.of-t h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,42px);line-height:1.04;letter-spacing:-.02em;margin-top:6px}
.of-a{margin-top:10px;font-size:14px;color:var(--doux)}
.of-prix{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-top:auto;padding-top:clamp(26px,3vw,44px)}
.of-prix s{color:var(--doux);font-size:16px}
.of-prix b{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.2vw,50px);line-height:1;color:var(--encre)}
.of-prix span{font-size:12.5px;padding:5px 11px;border-radius:100px;background:rgba(196,138,96,.18);color:#7A4520}
.of-fin{margin-top:10px;font-size:13px;color:var(--doux)}
.of-act{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px;margin-top:22px}
.of-pied{margin-top:clamp(40px,5vw,70px);text-align:center}
.of-grille.peu .of-c{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.of-grille.peu .of-v{min-height:clamp(340px,36vw,520px)}
@media(max-width:1100px){.of-grille{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.of-c,.of-grille.peu .of-c{grid-template-columns:1fr}.of-v,.of-grille.peu .of-v{min-height:300px}}

/* ================= v32 : accueil réordonné, héro tourné vers la commande, brillance retirée ================= */
.vt-eclat,.mzf-eclat,.eclat-c,.et-eclat{display:none!important}
.hero-cta .ico-sac{width:15px;height:16px;margin-right:2px}
.hero-actions{align-items:center}
.hero-evt{display:flex;align-items:center;gap:14px;margin-top:22px;padding:10px 18px 10px 10px;border-radius:100px;background:rgba(6,52,58,.55);backdrop-filter:blur(8px);color:var(--creme);box-shadow:inset 0 0 0 1px rgba(241,235,224,.22);max-width:100%;transition:background .4s var(--ease)}
.hero-evt:hover{background:rgba(6,52,58,.8)}
.he-q{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--creme);color:var(--nuit);line-height:1}
.he-q b{font-family:var(--serif);font-weight:400;font-size:19px}
.he-q i{font-style:normal;font-size:10px;margin-top:1px}
.he-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.he-t small{font-size:11.5px;opacity:.7}
.he-t strong{font-family:var(--serif);font-weight:400;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero-evt .fl{width:16px;height:9px;flex:none;margin-left:4px}
.hero .couche .hero-txt{max-width:640px}
.hero-txt .hero-evt{justify-self:end}
@media(max-width:760px){.hero-evt{margin-top:16px}}
/* maisons : le titre porte la rubrique, le manifeste est en bas de page */
.mz-corps.sans-tete{margin-top:0}
.mz-sous{margin-top:12px;max-width:34em;font-size:15px;color:var(--doux)}
.mz-barre .note{margin-bottom:10px}
.mot-fin{padding:clamp(80px,9vw,140px) var(--marge);text-align:center;background:var(--papier);border-top:1px solid var(--trait)}
.mot-fin .d2{margin:14px auto 0;max-width:14em;font-size:clamp(30px,4vw,62px);line-height:1.08}
.mot-fin .d2 .mot{opacity:.16;transition:opacity .45s}
.mot-fin .d2 .mot.lu{opacity:1}
.mot-fin .cta{margin-top:28px}
/* fiche maison : acheter directement */
.mzf-refs li{display:flex;align-items:center;gap:14px;border-bottom:1px solid rgba(241,235,224,.14)}
.mzf-refs li a{flex:1;border-bottom:0;min-width:0}
.mzf-refs a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mzf-achat{flex:none;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:100px;font-size:12.5px;color:var(--creme);box-shadow:inset 0 0 0 1px rgba(224,181,150,.5);transition:background .4s var(--ease),color .4s,box-shadow .4s}
.mzf-achat svg{width:13px;height:14px}
.mzf-achat:hover{background:var(--laiton);color:var(--nuit);box-shadow:none}
.mzf-achat.ok{background:var(--laiton);color:var(--nuit);box-shadow:none}
.mzf-r-etat{flex:none;font-size:12px;color:rgba(241,235,224,.5);white-space:nowrap}
/* dates juste sous les rayons : on enchaîne sombre sur sombre, un filet cuivre marque la couture */
#rayons+#dates{border-top:1px solid rgba(224,181,150,.35)}
/* pages Cuvée / À propos : le bloc d'appel final, titre et texte se chevauchaient */
.appel .contenu .d2{margin:0 auto;max-width:14em}
.appel-sous{margin:22px auto 34px}

/* ================= v33 : code promo dans le panier ================= */
.p-promo{margin-bottom:14px;padding-bottom:14px;border-bottom:1px dashed rgba(18,36,40,.22)}
.p-promo-ouvrir{font-size:13.5px;color:var(--doux);text-decoration:underline;text-underline-offset:3px}
.p-promo-ouvrir:hover{color:var(--encre)}
.p-promo-form{display:flex;gap:8px}
.p-promo-form input{flex:1;min-width:0;padding:11px 14px;border-radius:10px;border:1px solid var(--trait);background:var(--blanc);font:inherit;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.p-promo-form input:focus{outline:none;border-color:var(--nuit)}
.b-appliquer{padding:0 16px;border-radius:10px;background:var(--nuit);color:var(--creme);font-size:13.5px;transition:background .3s}
.b-appliquer:hover{background:var(--abysse)}
.p-promo-msg{margin-top:8px;font-size:13px;color:#8A3A2A}
.p-promo-ok{display:flex;align-items:center;gap:12px;font-size:13.5px}
.p-promo-ok>span:first-child{flex:1;display:flex;align-items:baseline;gap:8px;min-width:0}
.p-promo-ok b{font-weight:500;letter-spacing:.06em;padding:4px 10px;border-radius:6px;background:rgba(196,138,96,.18);color:#7A4520}
.p-promo-ok em{font-style:normal;color:var(--doux);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-promo-rem{font-weight:500;color:#7A4520;white-space:nowrap}
.p-sous{display:flex;justify-content:space-between;font-size:13.5px;color:var(--doux);margin-bottom:6px}
.r-remise{display:flex;justify-content:space-between;padding:12px 0 0;font-size:14px;color:#7A4520}

/* ================= v34 : entrée courte, passages de page fluides ================= */
/* le voile entre deux pages : il monte vite, sans mot, avec la clé au centre */
#rideau{background:var(--nuit);will-change:transform}
#rideau.tombe{transform:none;transition:transform .46s cubic-bezier(.7,0,.3,1)}
#rideau.leve{transform:translateY(-100%);transition:transform .7s cubic-bezier(.7,0,.2,1)}
#rideau .mot{font-size:0;width:14px;height:30px;background:url("/img/symbole-cle.png") center/contain no-repeat;filter:brightness(0) invert(1);opacity:0;transition:opacity .3s .2s}
#rideau.tombe .mot{opacity:.7}
#rideau.leve .mot{opacity:0;transition:opacity .15s}
/* la page qui s'en va s'efface légèrement pendant que le voile monte */

/* l'écran d'entrée */
.chargement{clip-path:inset(0 0 0 0)}
.ch-centre{gap:22px}
.ch-mot{font-family:var(--serif);font-style:normal;font-size:clamp(22px,2.4vw,30px);letter-spacing:.04em;color:var(--creme);opacity:0}

/* ================= v35 : page Cuvée sur mesure ================= */
.hero-p .hp-actions{display:flex;gap:10px;flex-wrap:wrap}
.compo{padding:clamp(90px,10vw,150px) var(--marge);background:var(--creme)}
.cp-tete{display:grid;grid-template-columns:1fr minmax(0,30em);gap:24px clamp(30px,6vw,110px);align-items:end}
.cp-tete .d2{font-size:clamp(40px,5.2vw,86px);max-width:11em}
.cp-lead{color:var(--doux);font-size:15.5px;line-height:1.6}
.cp-corps{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,40%);gap:clamp(30px,5vw,90px);margin-top:clamp(50px,6vw,90px);align-items:start}
.cp-e{padding:clamp(28px,3vw,44px) 0;border-top:1px solid var(--trait)}
.cp-num{font-size:13px;color:var(--laiton);letter-spacing:.04em}
.cp-num i{font-style:italic;font-family:var(--serif);font-size:16px;letter-spacing:0;margin-left:6px}
.cp-q{font-family:var(--serif);font-size:clamp(24px,2.2vw,34px);line-height:1.1;margin-top:10px}
.cp-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin-top:20px}
.cp-opts button{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px 16px;border-radius:14px;background:var(--blanc);box-shadow:inset 0 0 0 1px var(--trait);text-align:left;transition:box-shadow .3s var(--ease),background .3s var(--ease),transform .5s var(--ease)}
.cp-opts button b{font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.1}
.cp-opts button span{font-size:12.5px;color:var(--doux);line-height:1.35}
.cp-opts button:hover{box-shadow:inset 0 0 0 1px var(--encre);transform:translateY(-2px)}
.cp-opts button[aria-pressed="true"]{background:var(--nuit);color:var(--creme);box-shadow:none}
.cp-opts button[aria-pressed="true"] span{color:rgba(241,235,224,.7)}
.cp-opts-s{grid-template-columns:repeat(3,1fr);margin-top:14px}
.cp-champs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.cp-champs label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--doux)}
.cp-champs input{padding:12px 14px;border-radius:10px;border:1px solid var(--trait);background:var(--blanc);font:inherit;font-size:15px;color:var(--encre)}
.cp-champs input:focus{outline:none;border-color:var(--nuit)}
.cp-fin{border-top:1px solid var(--trait)}
.cp-qte{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:14px;color:var(--doux)}
.cp-qte button{width:38px;height:38px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--trait);font-size:18px;transition:background .3s,color .3s}
.cp-qte button:hover{background:var(--nuit);color:var(--creme)}
.cp-qte output{font-family:var(--serif);font-size:32px;min-width:2.2em;text-align:center;color:var(--encre)}
.cp-fin .cta{margin-top:26px}
.cp-note{margin-top:14px;font-size:13px;color:var(--doux);max-width:30em}
.cp-scene{position:relative}
.cp-colle{position:sticky;top:100px;display:flex;flex-direction:column;align-items:center;padding:clamp(20px,3vw,50px) 0;border-radius:24px;background:radial-gradient(ellipse 70% 50% at 50% 45%,rgba(255,255,255,.9),var(--papier) 75%)}
.cp-bouteille{width:min(100%,300px);height:auto;filter:drop-shadow(0 30px 28px rgba(6,52,58,.28))}
.cp-ombre{fill:rgba(6,52,58,.16)}
.cp-legende{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:16px;color:var(--doux);text-align:center;padding:0 20px}
.preuve-at{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,5vw,90px);align-items:center;padding:clamp(80px,9vw,140px) var(--marge);background:var(--abysse);color:var(--creme)}
.pa-visuel .at-ecrin{position:relative;display:block;width:clamp(170px,16vw,230px);aspect-ratio:10/26;clip-path:none;transition:none}
.pa-visuel .at-ecrin img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:normal;max-width:none}
.pa-txt .d3{margin-top:10px;font-size:clamp(30px,3.4vw,52px)}
.pa-acc{margin-top:10px;font-family:var(--serif);font-style:italic;color:var(--laiton-c);font-size:18px}
.pa-desc{margin-top:16px;color:rgba(241,235,224,.75);font-size:14.5px;line-height:1.65;max-width:32em}
.pa-txt .cta{margin-top:24px}
.pa-occ .pv-liste{margin-top:14px}
.preuve-at .pv-liste li{color:rgba(241,235,224,.85);border-color:rgba(241,235,224,.15)}
@media(max-width:1000px){
  .cp-tete,.preuve-at{grid-template-columns:1fr}
  .cp-corps{grid-template-columns:1fr}
  .cp-scene{order:-1}
  .cp-colle{position:relative;top:0}
  .cp-bouteille{width:min(60vw,260px)}
  .pa-visuel{justify-self:center}
}
@media(max-width:600px){.cp-champs,.cp-opts-s{grid-template-columns:1fr}}

/* ================= v36 : page Showroom et dates ================= */
.programme.v5.pleine{padding-top:clamp(70px,8vw,120px)}
.programme.v5.pleine .agenda{grid-template-columns:repeat(2,minmax(0,1fr))}
.programme.v5.pleine .evt-majeur{grid-column:1/-1;grid-row:auto;display:grid;grid-template-columns:1.15fr 1fr;align-items:stretch}
.programme.v5.pleine .evt-majeur .em-img{aspect-ratio:auto;min-height:380px}
.programme.v5.pleine .evt{min-height:200px}
.programme.v5.pleine .attente{grid-template-columns:auto minmax(0,1fr)}
@media(max-width:1000px){.programme.v5.pleine .agenda{grid-template-columns:1fr}.programme.v5.pleine .evt-majeur{display:flex}.programme.v5.pleine .evt-majeur .em-img{min-height:0;aspect-ratio:16/9}}
.hero-p.court .hp-actions{display:flex;gap:10px;flex-wrap:wrap}

/* ================= v37 : page À propos ================= */
.chiffres{display:flex;flex-wrap:wrap;margin-top:clamp(40px,5vw,70px);border-top:1px solid var(--trait)}
.chiffres>div{flex:1 1 160px;padding:clamp(20px,2.4vw,34px) clamp(18px,2.4vw,40px) clamp(20px,2.4vw,34px) 0;border-bottom:1px solid var(--trait)}
.chiffres>div+div{padding-left:clamp(18px,2.4vw,40px);border-left:1px solid var(--trait)}
.chiffres dd{font-family:var(--serif);font-size:clamp(42px,4.6vw,76px);line-height:.95;letter-spacing:-.02em}
.chiffres dt{margin-top:8px;font-size:13.5px;color:var(--doux)}
.cr-i{position:relative;padding-top:22px}
.cr-n{display:block;font-family:var(--serif);font-style:italic;font-size:clamp(28px,2.6vw,40px);color:var(--laiton);line-height:1;margin-bottom:14px}
.visite.v5.ap-lieu{background:var(--creme)}
@media(max-width:600px){.chiffres>div{flex-basis:50%}.chiffres>div:nth-child(odd){padding-left:0;border-left:0}}
.metier .chiffres{grid-column:4/13}@media(max-width:900px){.metier .chiffres{grid-column:1/-1}}
.ag-mois{grid-column:1/-1;margin-top:clamp(10px,1.4vw,22px);padding-bottom:10px;border-bottom:1px solid rgba(224,181,150,.3);font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.8vw,28px);color:var(--laiton-c);text-transform:capitalize}

/* ================= v38 : page Contact ================= */
.tete-p .vs-etat{margin-top:18px}
.ct-raccourcis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:0 var(--marge) clamp(40px,5vw,70px);background:var(--trait);border:1px solid var(--trait);border-radius:18px;overflow:hidden}
.ct-raccourcis a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:4px 14px;align-items:center;padding:clamp(18px,2vw,28px) clamp(18px,2vw,28px);background:var(--blanc);transition:background .4s var(--ease)}
.ct-raccourcis a:hover{background:var(--papier)}
.ct-r-n{font-family:var(--serif);font-size:clamp(18px,1.6vw,23px);line-height:1.1}
.ct-r-t{grid-column:1;font-size:12.5px;color:var(--doux)}
.ct-raccourcis .fl{grid-column:2;grid-row:1/3;width:20px;height:11px;transition:transform .5s var(--ease)}
.ct-raccourcis a:hover .fl{transform:translateX(6px)}
.cd-retrait{margin-top:12px;font-size:13.5px;color:var(--doux);max-width:26em}
@media(max-width:1000px){.ct-raccourcis{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ct-raccourcis{grid-template-columns:1fr}}
.tete-p .vs-etat{grid-column:1/-1;justify-self:start;width:auto;white-space:nowrap}.tete-p{align-items:start}
/* sélection : l'onglet « En offre » */
#chips .chip-offres{color:#9A5A2E}
#chips .chip-offres i{font-style:normal;display:inline-block;margin-left:7px;padding:1px 7px;border-radius:100px;background:var(--laiton);color:var(--nuit);font-size:11px;vertical-align:1px}
#chips .chip-offres[aria-pressed="true"]{color:var(--encre)}
/* cuvée sur mesure : la photo de l'atelier remplace la vidéo, avec un lent zoom */
.ouverture.v5 .media img{filter:contrast(1.04) saturate(.9) brightness(.92);animation:ov-zoom 24s ease-in-out infinite alternate}
@keyframes ov-zoom{from{transform:scale(1)}to{transform:scale(1.08)}}
.ouverture.v5 .ov-grain{opacity:.12}
.fondateur .img-portrait img{object-position:50% 20%}
@media (prefers-reduced-motion:reduce){.ouverture.v5 .media img{animation:none}}
.hero-p.court .hp-img{object-position:50% 12%}

/* ================= v41 : passages de page sans voile ================= */
/* Deux documents enchaînés en une seule animation (View Transitions) : la page qui part s'efface
   en glissant, celle qui arrive se pose ; la barre de navigation garde sa place (groupe « nav »). */
@view-transition{navigation:auto}
::view-transition{background:var(--creme)}
.nav{view-transition-name:nav}
::view-transition-group(nav){z-index:10}
::view-transition-old(nav){animation:vt-nav-old .28s ease both}
::view-transition-new(nav){animation:vt-nav-new .28s ease both}
::view-transition-old(root){animation:vt-sortie .34s cubic-bezier(.65,0,.35,1) both;mix-blend-mode:normal}
::view-transition-new(root){animation:vt-entree .62s cubic-bezier(.16,1,.3,1) .1s both;mix-blend-mode:normal}
html:active-view-transition-type(arriere)::view-transition-old(root){animation-name:vt-sortie-bas}
html:active-view-transition-type(arriere)::view-transition-new(root){animation-name:vt-entree-haut}
@keyframes vt-sortie{to{opacity:0;transform:translateY(-4vh) scale(.985)}}
@keyframes vt-entree{from{opacity:0;transform:translateY(5vh) scale(1.012)}}
@keyframes vt-sortie-bas{to{opacity:0;transform:translateY(4vh) scale(.985)}}
@keyframes vt-entree-haut{from{opacity:0;transform:translateY(-5vh) scale(1.012)}}
@keyframes vt-nav-old{to{opacity:0}}
@keyframes vt-nav-new{from{opacity:0}}
/* repli (Firefox et anciens Safari) : fondu court au départ, arrivée en douceur */
html.part main,html.part .pied{opacity:0;transform:translateY(-14px);transition:opacity .24s ease,transform .26s cubic-bezier(.65,0,.35,1)}
html.arrive main{animation:vt-fondu .55s ease both}
@keyframes vt-fondu{from{opacity:0}}
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation-duration:.01s!important}
  html.part main,html.part .pied{transition:none}
  html.arrive main{animation:none}
}

/* ================= v42 : fluidité générale ================= */
/* apparitions plus vives : plus courtes, démarrées un peu plus tôt, même courbe */
.rv{transition-duration:.9s,.9s}
.lignes .ln>span{transition-duration:1s;transition-delay:calc(var(--i,0)*70ms + var(--d,0s))}
/* la grille de la Sélection : les fiches hors écran ne sont ni dessinées ni mises en page tant qu'on n'y arrive pas */
.fiche-c{content-visibility:auto;contain-intrinsic-size:auto 300px auto 460px}
/* ce qui bouge au scroll reste sur sa propre couche : le navigateur ne le redessine pas, il le déplace */
.hero video,.hero .poster,.hp-img,.vt-scene,.vt-groupe,.vt-flot,.vt-heros,.rv,.lignes .ln>span{will-change:transform}
.rv.vu,.lignes.vu .ln>span{will-change:auto}

/* ================= v43 : mobile repris proprement ================= */
/* Garde-fou : plus aucun débordement horizontal, quelle que soit la page */
html,body{overflow-x:clip}
img,video,svg{max-width:100%}

/* Sélection : la grille ne se laisse plus élargir par ses fiches (cause du zoom arrière sur téléphone) */
.grille>*{min-width:0}
@media(max-width:760px){
  .grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px;padding-left:16px;padding-right:16px}
  .fiche-c{contain-intrinsic-size:auto 170px auto 320px}
  .fiche-c h3{font-size:17px;line-height:1.2}
  .fiche-c .bas{flex-direction:column;gap:2px;margin-top:12px}
  .fiche-c .orig{font-size:12px}
}

/* En-têtes de pages intérieures : le texte et les repères s'empilent au lieu de se serrer côte à côte */
@media(max-width:1100px){
  .hero-p{flex-direction:column;align-items:stretch;justify-content:flex-end}
  .hero-p .hp-cles{position:relative;z-index:3;margin:26px var(--marge) 0;padding-bottom:clamp(26px,5vh,40px);display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px 20px}
  .hero-p .hp-cles dd{white-space:normal}
}

/* Showroom et dates : le bloc « en attente de dates » passe sur une colonne */
@media(max-width:1000px){
  .programme.v5 .attente,.programme.v5.pleine .attente{grid-template-columns:minmax(0,1fr)}
  .programme.v5 .at-photo{width:min(100%,340px);margin:0 auto}
}

/* ---------- Accueil : la sélection rayon par rayon, version téléphone ----------
   Une carte couleur (rayon, bouteille, phrase, bouton), puis les onglets des rayons,
   puis la liste « à la une » en fiches lisibles. Même idée qu'au bureau, rangée pour le pouce. */
@media(max-width:860px){
  #rayons{background:var(--creme)}
  #rayons .vt-cadre{padding:0}
  #rayons .vitrine{--vt-h:clamp(470px,132vw,560px);display:flex;flex-direction:column;height:auto;min-height:0;padding:14px 0 34px;border-radius:0;box-shadow:none;background:var(--creme);overflow:hidden}

  /* la carte couleur */
  #rayons .vt-forme{position:absolute;left:14px;right:14px;top:14px;width:auto;height:var(--vt-h);border-radius:26px!important;background:var(--teinte)}
  #rayons .vt-forme::after{background:radial-gradient(ellipse 90% 60% at 85% 18%,rgba(255,255,255,.22),transparent 62%),linear-gradient(180deg,transparent 45%,rgba(0,0,0,.28))}
  #rayons .vt-intro{position:relative;order:1;left:auto;top:auto;width:auto;height:var(--vt-h);margin:0 14px;padding:26px 22px 24px;display:flex;flex-direction:column;align-items:flex-start;z-index:4;pointer-events:none}
  #rayons .vt-intro a{pointer-events:auto}
  #rayons .vt-sur{font-size:14.5px;gap:9px}
  #rayons .vt-nom{margin-top:22px;max-width:70%}
  #rayons .vt-num{font-size:14px}
  #rayons .vt-num b{font-size:19px}
  #rayons .vt-nom h2{font-size:clamp(30px,8.4vw,42px);line-height:1;letter-spacing:-.02em;margin-top:4px;padding-top:.1em}
  #rayons .vt-desc{display:block;margin-top:auto;max-width:none;font-size:15px;line-height:1.5;color:rgba(255,255,255,.92);text-wrap:pretty}
  #rayons .cta.vt-voir{display:inline-flex;margin-top:16px;padding:15px 22px;font-size:14px}

  /* la bouteille, à droite dans la carte */
  #rayons .vt-scene{position:absolute;left:auto;right:14px;top:44px;width:42%;height:calc(var(--vt-h) - 200px);z-index:3}
  #rayons .vt-heros,#rayons .vt-heros.large{left:6%;width:88%;bottom:4%;height:92%}
  #rayons .vt-heros.large{left:-12%;width:98%;height:58%}
  #rayons .vt-ombre{left:24%;right:24%;bottom:1%}
  #rayons .vt-flot{display:none}

  /* les onglets des rayons : une barre qui défile au doigt, l'onglet actif se recentre tout seul */
  #rayons .vt-barre{order:2;position:relative;left:auto;right:auto;bottom:auto;transform:none;margin:14px 14px 0;padding:6px;gap:6px;background:#fff;border-radius:100px;box-shadow:0 0 0 1px rgba(18,36,40,.07),0 14px 30px -18px rgba(6,52,58,.4);backdrop-filter:none;-webkit-backdrop-filter:none}
  #rayons .vt-prec{display:none}
  #rayons .vt-rayons{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  #rayons .vt-rayons::-webkit-scrollbar{display:none}
  #rayons .vt-rayons a{padding:11px 15px;font-size:14px;gap:8px}
  #rayons .vt-rayons a:last-of-type{margin-right:28px}
  #rayons .vt-suivant{width:44px;height:44px}
  #rayons .vt-anneau{width:52px;height:52px}

  /* la liste « à la une » : de vraies fiches, visuel à gauche, prix et action à droite */
  #rayons .vt-liste{order:3;position:relative;width:auto;padding:30px 0 0;z-index:2}
  #rayons .vt-liste-tete{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:0 20px 14px}
  #rayons .vt-titre{margin:0;font-size:clamp(21px,6vw,25px);line-height:1.05;white-space:nowrap}
  #rayons .vt-liste-tete .souligne{white-space:nowrap;font-size:13.5px}
  #rayons .vt-lignes{min-height:0;display:flex;flex-direction:column;gap:8px;padding:0 14px}
  #rayons .vt-l{display:grid;grid-template-columns:58px minmax(0,1fr) auto;grid-template-areas:"v n p" "v n a";column-gap:14px;row-gap:6px;align-items:center;min-height:0;margin:0;padding:12px 12px 12px 10px;border-radius:18px;background:#fff!important;box-shadow:0 0 0 1px rgba(18,36,40,.05),0 10px 24px -20px rgba(6,52,58,.5)}
  #rayons .vt-lv{grid-area:v;height:72px;background:var(--papier,#F1EBE0);border-radius:12px;padding:6px 0}
  #rayons .vt-ln{grid-area:n}
  #rayons .vt-ln b{font-size:15px;line-height:1.25}
  #rayons .vt-ln small{font-size:12.5px;margin-top:3px;white-space:normal}
  #rayons .vt-lp{grid-area:p;justify-self:end;align-self:end;font-size:13px;color:var(--encre)}
  #rayons .vt-plus{grid-area:a;justify-self:end;align-self:start;width:32px;height:32px;background:var(--encre);color:var(--creme)}
  #rayons .vt-plus.voir{background:none;color:var(--encre);box-shadow:inset 0 0 0 1px var(--trait)}
  #rayons .vt-vide{margin:0 6px}
  #rayons .vt-pied{margin:18px 20px 0;font-size:13.5px}
  #rayons .vt-astuce,#rayons .vt-avance{display:none}
}
@media(max-width:360px){
  #rayons .vt-scene{width:40%}
  #rayons .vt-rayons a{padding:10px 12px;font-size:13.5px}
}

/* Menu mobile : liens séparés et lisibles, une taille qui tient sur les petits écrans */
@media(max-width:860px){
  #menuMobile{padding:88px var(--marge) calc(28px + env(safe-area-inset-bottom))}
  #menuMobile nav{display:flex;flex-direction:column;counter-reset:m}
  #menuMobile nav a{position:relative;display:flex;align-items:baseline;gap:14px;font-size:clamp(30px,8.4vw,44px);line-height:1.1;padding:12px 0;border-bottom:1px solid rgba(239,232,219,.12);counter-increment:m}
  #menuMobile nav a::before{content:counter(m,upper-roman);font-family:var(--serif);font-style:italic;font-size:14px;color:var(--laiton-c);min-width:22px;opacity:.8}
  #menuMobile nav a:first-child{border-top:1px solid rgba(239,232,219,.12)}
  #menuMobile .pied-m{font-size:13.5px;line-height:1.6;color:rgba(239,232,219,.65)}
}
/* rayons : petites largeurs, la bouteille laisse passer le surtitre ; tablette, la liste passe sur deux colonnes */
@media(max-width:380px){#rayons .vt-scene{top:74px;height:calc(var(--vt-h) - 230px)}}
@media(min-width:600px) and (max-width:860px){
  #rayons .vitrine{--vt-h:470px}
  #rayons .vt-scene{width:40%;right:40px}
  #rayons .vt-desc{max-width:34em}
  #rayons .vt-lignes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ================= v44 : fluidité ================= */
/* Règle : au scroll, seuls transform et opacity bougent. Plus aucun filtre (flou, ombre portée, flou d'arrière-plan) recalculé
   image par image, plus de repeint plein écran, et le navigateur ne garde en mémoire que les couches qui bougent vraiment. */

/* 1. Couches GPU : seulement ce qui est réellement animé au scroll, plus les centaines d'éléments en attente d'apparition */
.rv,.lignes .ln>span,.vt-flot,.vt-heros,.vt-scene{will-change:auto}
.hero video,.hero .poster,.hp-img,#rayons.defile .vt-groupe{will-change:transform}

/* 2. Rayons : le grand flacon porte une ombre posée (ellipse), plus d'ombre portée calculée sur l'image ; au survol il se soulève */
.vt-heros img,.vt-scene a.vt-heros img,.vt-scene a.vt-heros:hover img{filter:none;transition:none}
.vt-scene a.vt-heros .vt-corps{transition:transform .9s var(--ease)}
.vt-scene a.vt-heros:hover .vt-corps{transform:translateY(-8px)}
.v5 .vt-ombre{opacity:.9}

/* 3. Rayons : les flacons de côté sont floutés une fois pour toutes (image calculée), plus de filtre en continu */
.vt-flot.f1,.vt-flot.f2,.v5 .vt-flot.f1,.v5 .vt-flot.f2,.v5 a.vt-flot:hover{filter:none}
.v5 a.vt-flot{transition:opacity .7s var(--ease)}
.vt-flot{position:absolute}
.vt-flot img.flou{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transition:opacity .6s var(--ease)}
.vt-flot img.net{opacity:0;transition:opacity .6s var(--ease)}
.v5 a.vt-flot:hover img.net{opacity:1}
.v5 a.vt-flot:hover img.flou{opacity:0}

/* 4. Rayons : la carte couleur garde une seule forme ; seule sa couleur change, par transition, au changement de rayon */
.vt-forme{transition:background-color .9s var(--ease)}

/* 5. Plus de flou d'arrière-plan sur les barres et voiles (le plus coûteux de tous les effets, surtout au scroll) : fonds pleins */
.filtres{background:rgba(239,232,219,.96);backdrop-filter:none;-webkit-backdrop-filter:none}
.vt-barre{backdrop-filter:none;-webkit-backdrop-filter:none}
.fiche .actions{background:rgba(250,246,239,.97);backdrop-filter:none;-webkit-backdrop-filter:none}
.em-quand{backdrop-filter:none;-webkit-backdrop-filter:none}
.hero-evt{background:rgba(6,52,58,.72);backdrop-filter:none;-webkit-backdrop-filter:none}
.fiche-voile{background:rgba(6,52,58,.62);backdrop-filter:none;-webkit-backdrop-filter:none}
#voilePanier{background:rgba(6,52,58,.58);backdrop-filter:none;-webkit-backdrop-filter:none}
.fiche-c .visuel::after{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(250,246,239,.96)}

/* 6. Sélection : au survol, la bouteille se soulève (transform) au lieu de recevoir une ombre portée calculée */
.fiche-c .visuel.detoure img{transition:transform 1s var(--ease)}
.fiche-c:hover .visuel.detoure img{filter:none;transform:translateY(-6px) scale(1.03)}

/* 7. Cuvée sur mesure : la vidéo et la photo ne passent plus par un filtre couleur (recalculé à chaque image) ; le voile teinté fait le travail */
.ouverture.v5 .media video,.ouverture.v5 .media img{filter:none}

/* 8. Halo de la pièce de l'atelier : dégradé doux sans flou */
.at-halo{filter:none;background:radial-gradient(ellipse at center,rgba(224,181,150,.2),rgba(224,181,150,.08) 40%,transparent 66%)}

/* 9. Le mouvement se fait discret pour qui l'a demandé au système */
@media (prefers-reduced-motion:reduce){
  .vt-flot img.flou{display:none}.vt-flot img.net{opacity:1}
}

/* ================= v45 : conformité et accessibilité ================= */
/* case de consentement du formulaire de contact */
.accord-c{display:flex;align-items:flex-start;gap:12px;margin-top:22px;font-size:14px;line-height:1.55;color:var(--doux)}
.accord-c input{flex:none;width:18px;height:18px;margin-top:2px;accent-color:var(--vert)}
.accord-c span{max-width:52em}
/* contrastes (WCAG AA) : texte secondaire un peu plus encré, petits libellés dorés en cuivre profond sur fond clair et en laiton clair sur fond sombre */
:root{--doux:#4F5F60;--laiton-txt:#8A5430}
.marque-c,.of-m,.et-m,.note,.fil,.chip-offres,.evt .fmt,.creme-bloc .evt .fmt,.creme-bloc .evt .date span,.fiche .maison-f b,.vt-l small,.mz-c small{color:var(--laiton-txt)}
.sombre .note,.pied .note,.hero .note,.programme .note,.atelier .note,.ouverture .note,.mot-fin .note,.appel .note,.hero-p .note,.tete-p.sombre .note,.methode .note,.preuve-at .note,.fiche-voile .note,.evt .fmt,.evt .date span,.creme-bloc .note{color:var(--laiton-c)}
.creme-bloc .evt .fmt,.creme-bloc .evt .date span,.creme-bloc .note{color:var(--laiton-txt)}
.pied .legal{color:rgba(241,235,224,.78)}
.pied .legal a,.pied .legal .lien-equipe{color:rgba(241,235,224,.82)}
.m-etape{opacity:.74}
.m-etape.actif{opacity:1}
.vt-sur,.vt-num,.vt-desc,.v5 .vt-sur,.v5 .vt-num,.v5 .vt-desc{color:#FFFDF9}
.et-sous{color:var(--doux)}
/* la zone photo des cartes : le bouton d'ajout est à côté de la zone cliquable, plus dedans */
.fiche-c .v-zone{position:relative}
.fiche-c .v-zone .ajout{transform:translateY(10px);opacity:0;visibility:hidden;transition:transform .5s var(--ease),opacity .4s,visibility .4s,background .3s}
.fiche-c:hover .v-zone .ajout,.fiche-c .v-zone .ajout:focus-visible{transform:none;opacity:1;visibility:visible}
.lien-equipe{opacity:.85}
.fiche-c .marque-c{color:var(--laiton-txt)}
#chips .chip-offres{color:var(--laiton-txt)}
.manifeste .d2 .mot,.metier .d2 .mot,.maison .d3 .mot,.mz-tete .d3 .mot,.mot-fin .d2 .mot{opacity:.52}
.manifeste .d2 .mot.lu,.metier .d2 .mot.lu,.maison .d3 .mot.lu,.mz-tete .d3 .mot.lu,.mot-fin .d2 .mot.lu{opacity:1}
.m-etape{opacity:.86}
.m-etape p{color:rgba(241,235,224,.9)}
.v5 .vt-desc,#rayons .vt-desc{color:#FFFDF9}
/* héro : photo Écho du Silence ; sur téléphone le cadrage suit la bouteille ; au doigt, pas d'anneau de lecture automatique dans les rayons */
.hero .poster{object-position:50% 50%}
@media(max-width:760px){.hero .poster{object-position:42% 50%}}
@media(hover:none),(pointer:coarse){.vt-anneau{display:none}}
/* fiche produit : la photo apparaît directement dans son écrin (plus de départ décalé), et à la fermeture le voile ne retient plus le défilement */
.fiche-voile:not(.ouvert){pointer-events:none;transition:opacity .35s var(--ease),visibility .35s}
.fiche-voile.ouvert .visuel img{animation:fiche-img .8s var(--ease) both}
@keyframes fiche-img{from{opacity:0;transform:translate(-50%,-50%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.fiche-voile.ouvert .visuel img{animation:none}}

/* ================= v49 : écrans tactiles ================= */
/* Au doigt, le survol « colle » après un tap (et au retour d'une page) : les petites vignettes penchaient,
   les cartes restaient soulevées. Sur écran tactile, aucun effet de survol ne bouge plus rien. */
html{-webkit-tap-highlight-color:transparent}
.vt-voile-t{position:absolute;inset:0;display:block;border-radius:inherit;pointer-events:none}
@media(max-width:860px){#rayons .vt-forme{transition:none}}
@media (hover:none),(pointer:coarse){
  .vt-l:hover .vt-lv,.v5 .vt-l.vu .vt-lv,.vt-plus:hover,.vt-suivant:hover,.vt-rayons a:hover i,
  .fiche-c:hover .visuel img,.fiche-c:hover .visuel.detoure img,.fiche-c:hover .visuel.detoure.plat img,.fiche-c:hover .visuel.detoure.cubi img,
  .fiche-c:hover .eclat-c,.fiche-c:hover .visuel.detoure.plat .eclat-c,.fiche-c .ajout:hover::after,.fiche-c .ajout:not(.voir):hover::after,
  .evt:hover .evt-img img,.format:hover .f-img img,.preuve:hover .ecrin img,.bd-i:hover,.programme.v5 .evt:hover,
  .rt-p:hover,.rt-p:hover .rt-ico,.of-c:hover,.of-c:hover .of-v img,.of-c:hover .of-v.photo img,.evt-majeur:hover .em-img img,
  .et-i:hover .et-v,.cp-opts button:hover,a.vt-heros:hover .vt-corps,.vt-scene a.vt-heros:hover .vt-corps,
  .vt-photo.p1:hover .vt-zoom,.vt-photo:not(.p1):hover .vt-zoom,.v5 a.vt-flot:hover img,.mz-lg:hover img,
  a.mzf-b.b2:hover img,a.mzf-b.b3:hover img,a.mzf-b.b1:hover img,a.mzf-b.b1:hover .mzf-eclat{transform:none}
  .fiche-c .ajout.voir:hover::after{transform:rotate(45deg)}
  .fiche-c:hover .etiquette-r.offre.sceau{transform:rotate(-9deg)}
  .fiche-c:hover .visuel .ombre-c{opacity:0;transform:none}
  .et-i:hover .et-ombre{transform:none;opacity:1}
  .vt-groupe:has(a.vt-heros:hover) .vt-ombre{transform:none;opacity:.9}
  a.vt-heros:hover .vt-cartel{opacity:0;transform:translate(-50%,10px);background-size:0 1px}
  /* Sélection : au doigt, la carte entière ouvre la fiche ; le bouton qui n'apparaissait qu'au survol
     s'affichait sur une carte au hasard (celle touchée en dernier). Il reste caché, la fiche porte l'ajout au panier. */
  .fiche-c:hover .v-zone .ajout{transform:translateY(10px);opacity:0;visibility:hidden}
  .fiche-c .v-zone .ajout:focus-visible{transform:none;opacity:1;visibility:visible}
}

/* Pastilles : une remise ET « Revient bientôt » sur le même produit se chevauchaient.
   Carte : l'étiquette s'arrête avant le sceau. Fiche : le sceau d'abord, l'étiquette dessous. */
.fiche-c .pastilles:has(.sceau) .etiquette-r:not(.sceau){max-width:calc(100% - 70px);white-space:normal;line-height:1.25}
.fiche .pastilles:has(.sceau){min-width:78px;flex-direction:column;align-items:flex-start}
.fiche .pastilles .etiquette-r.offre.sceau{left:0;right:auto}
.fiche .pastilles:has(.sceau) .etiquette-r:not(.sceau){margin-top:88px}

/* ================= v50 : retours de L'Officine (29 septembre) ================= */

/* Logo officiel : le logotype L'OFFICINE dessiné par la maison (image en masque, il prend la couleur du texte),
   « Atelier de création » dessous entre deux filets, comme sur le logo complet */
.lg-mot{display:block;aspect-ratio:382/62;background:currentColor;-webkit-mask:url(/img/logo-officine.png) center/100% 100% no-repeat;mask:url(/img/logo-officine.png) center/100% 100% no-repeat}
.logo-nav{gap:0;font-size:inherit;letter-spacing:0;line-height:1}
.logo-nav .lg{display:flex;flex-direction:column;width:clamp(128px,10.6vw,156px)}
.logo-nav .lg-mot{width:100%}
.logo-nav .lg-sous{display:flex;align-items:center;gap:7px;margin-top:6px;font-family:var(--sans);font-size:9.5px;letter-spacing:.08em;line-height:1;white-space:nowrap;text-transform:none;opacity:.85}
.logo-nav .lg-sous::before,.logo-nav .lg-sous::after{content:'';flex:1;height:1px;background:currentColor;opacity:.5}
@media(max-width:760px){.logo-nav .lg{width:120px}.logo-nav .lg-sous{font-size:8.5px;margin-top:5px;gap:6px}}
/* écran d'ouverture : le logotype à la place du nom écrit */
.ch-mot .lg-mot{width:clamp(160px,15vw,210px);color:var(--creme)}

/* Accueil, création de L'Officine : la cuvée et toutes les cuvées */
.piece-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(28px,4vh,44px)}
.atelier .piece-act .cta{margin-top:0}
.atelier .piece-act .cta.ligne{color:var(--creme)}

/* Cuvée sur mesure, « Déjà sorti de l'atelier » : l'étiquette de la cuvée tant que sa photo n'est pas là */
.pa-visuel .sortie-etiq{background:var(--papier)}
.se-cadre{position:absolute;inset:10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--cuivre-trait);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:0 16px;text-align:center;color:var(--encre)}
.pa-visuel .sortie-etiq .se-cadre img{position:static;inset:auto;width:15px;height:auto;max-width:none;margin:0 0 10px;object-fit:contain;opacity:.9}
.se-cadre i{font-family:var(--serif);font-style:italic;font-size:13px;color:#9A5A2E}
.se-cadre b{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2vw,28px);line-height:1.08;letter-spacing:-.01em}
.se-cadre em{display:block;width:34px;height:1px;background:var(--laiton)}
.se-cadre small{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#5B6668}

/* Formats : le prix « dès » d'un produit en plusieurs contenances */
.fiche-c .prix .des,.vt-lp .des{font-size:.78em;color:var(--doux);font-weight:400}
/* fiche : le choix du format au-dessus du prix et du bouton */
.fiche .actions .achat{flex:1 1 100%;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.fiche .actions.avec-formats{flex-direction:column;align-items:stretch;gap:14px}
.formats-l{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--doux);margin-bottom:9px}
.formats-c{display:flex;flex-wrap:wrap;gap:8px}
.formats-c button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:84px;padding:9px 14px 10px;border-radius:12px;background:var(--blanc);box-shadow:inset 0 0 0 1px var(--trait);font-size:14.5px;line-height:1.1;text-align:left;color:var(--encre);transition:box-shadow .3s var(--ease),background .3s var(--ease),color .3s var(--ease)}
.formats-c button b{font-weight:500}
.formats-c button small{font-size:12px;color:var(--doux);font-variant-numeric:tabular-nums}
.formats-c button:hover{box-shadow:inset 0 0 0 1px var(--encre)}
.formats-c button:focus-visible{outline:2px solid var(--laiton);outline-offset:2px}
.formats-c button[aria-checked="true"]{background:var(--nuit);color:var(--creme);box-shadow:none}
.formats-c button[aria-checked="true"] small{color:var(--laiton-c)}
.formats-c button.indispo:not([aria-checked="true"]) b{opacity:.5}
@media(max-width:760px){.formats-c button{min-width:0;flex:1 1 calc(25% - 8px);padding:8px 10px 9px}}

/* Packshots : le site ne recadre plus jamais une photo produit.
   Une photo avec décor s'affiche entière ; un flacon coupé à la prise de vue est posé sur le bas du cadre,
   sa coupe se confond avec le bord au lieu de flotter au milieu de la carte. */
.fiche-c .visuel:not(.detoure) img{object-fit:contain;object-position:50% 100%}
.fiche .visuel:not(.detoure) img,.fiche .visuel.cadre-photo img{object-position:50% 0}
.vt-zoom img{object-position:50% 0}
.p-ligne .mini img{max-height:100%;width:auto;height:auto;object-fit:contain}
.r-v:not(.det) img{object-fit:contain;object-position:50% 100%}
.of-v.photo img{object-fit:contain;object-position:50% 100%}
/* fiche produit, photo avec son décor ou flacon coupé à la prise de vue : la photo entière, à sa proportion,
   dans une arche (haut arrondi, bas droit) cerclée de cuivre ; plus aucun recadrage */
.fiche .visuel:not(.detoure)::before,.fiche .visuel:not(.detoure)::after,.fiche .visuel.cadre-photo::before,.fiche .visuel.cadre-photo::after{display:none}
.fiche .visuel:not(.detoure) img,.fiche .visuel.cadre-photo img{width:auto;height:auto;max-width:min(86%,calc(var(--cap-h) * .9));max-height:calc(var(--cap-h) * 1.04);object-fit:contain;object-position:50% 50%;border-radius:999px 999px 14px 14px;box-shadow:0 0 0 1px var(--cuivre-trait),0 0 0 8px var(--papier),0 0 0 9px var(--cuivre-trait);mix-blend-mode:normal}
.fiche .actions{background:var(--blanc)}
/* fiche d'une maison : « Choisir » (produit en plusieurs formats) garde l'allure du bouton « Acheter » */
.mzf-refs li a.mzf-achat{flex:none;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-bottom:0;font-family:var(--sans);font-size:12.5px;white-space:nowrap}
.mzf-refs li a.mzf-achat span{font-family:var(--sans);font-size:12.5px;overflow:visible}
.mzf-refs li a.mzf-achat:hover{padding-left:14px;color:var(--nuit)}
/* titre du rayon (ordinateur) : l'accent de « Épicerie » n'est plus rogné par le cadre du titre */
@media(min-width:861px){.v5 .vt-nom h2{padding-top:.14em;margin-top:calc(8px - .14em)}}
/* suggestions de recherche et liste « À la une » : une photo produit s'affiche entière, jamais recadrée */
.sg-img:not(.detoure) img{object-fit:contain}
.v5 .vt-l.photo .vt-lv img{width:auto;height:100%;max-width:100%;border-radius:6px;object-fit:contain;box-shadow:none;filter:drop-shadow(0 6px 6px rgba(0,0,0,.18))}
/* logo de la navigation : la clé du logo officiel, puis le logotype L'OFFICINE et « Atelier de création » */
.logo-nav{gap:12px}
.logo-nav .lg-cle{width:19px;height:auto;flex:none}
@media(max-width:760px){.logo-nav{gap:10px}.logo-nav .lg-cle{width:13px}}

/* ================= v52 : vitrine fixe au téléphone, nouvelles étiquettes d'offre ================= */

/* Accueil, « La sélection, rayon par rayon », au téléphone : plus aucune animation.
   La bouteille est posée, on la touche pour ouvrir sa fiche ; un autre rayon remplace tout d'un coup
   (couleur, bouteille, texte, liste des trois références). L'onglet actif porte sa couleur lui-même. */
.vitrine.fixe,.vitrine.fixe *,.vitrine.fixe *::before,.vitrine.fixe *::after{transition:none!important;animation:none!important}
.vitrine.fixe .vt-groupe,.vitrine.fixe .vt-heros,.vitrine.fixe .vt-scene{will-change:auto}
.vitrine.fixe .vt-curseur,.vitrine.fixe .vt-eclat,.vitrine.fixe .vt-cartel,.vitrine.fixe .vt-voile-t,.vitrine.fixe .cta::before{display:none}
.vitrine.fixe .vt-rayons a[aria-current]{background:var(--c)!important;color:#fff;border-radius:100px}
.vitrine.fixe a.vt-heros:hover .vt-corps,.vitrine.fixe .vt-l:hover .vt-lv,.vitrine.fixe .vt-l.vu .vt-lv,.vitrine.fixe .vt-plus:hover,
.vitrine.fixe .vt-rayons a:hover i,.vitrine.fixe .vt-photo.p1:hover .vt-zoom{transform:none!important}
.vitrine.fixe .vt-plus.voir:hover{background:none;color:var(--encre)}
.vitrine.fixe .vt-groupe:has(a.vt-heros:hover) .vt-ombre{transform:none;opacity:.9}
.vitrine.fixe.change .vt-desc,.vitrine.fixe.change .cta.vt-voir{opacity:1;transform:none}
.vitrine.fixe .vt-l.vu{background:#fff}
/* vignettes de la liste : une hauteur fixe, la bouteille entière dedans, quel que soit le navigateur */
@media(max-width:860px){
  #rayons .vitrine.fixe .vt-lv{display:flex;align-items:center;justify-content:center;height:72px;padding:6px 0;overflow:hidden}
  #rayons .vitrine.fixe .vt-lv img,#rayons .vitrine.fixe .vt-l.photo .vt-lv img{display:block;width:auto;height:60px;max-width:52px;max-height:none;object-fit:contain;border-radius:0}
  #rayons .vitrine.fixe .vt-l.photo .vt-lv img{border-radius:4px}
}

/* Offres : une seule étiquette, partout la même.
   Le sceau cuivré posé sur la photo porte la remise, toujours recalculée sur les deux prix ;
   le nom de l'offre et sa date de fin s'écrivent sous le produit ; le prix habituel est barré à côté du prix de l'offre. */
.sceau-o{position:absolute;top:12px;right:12px;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;background:var(--laiton);color:var(--nuit);text-align:center;line-height:1;box-shadow:inset 0 0 0 3px var(--laiton),inset 0 0 0 4px rgba(6,52,58,.3),0 12px 22px -12px rgba(6,52,58,.6);pointer-events:none}
.sceau-o small{display:block;font-family:var(--sans);font-size:7.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin:0 0 3px .2em;opacity:.8}
.sceau-o b{display:flex;align-items:baseline;justify-content:center;font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:-.02em}
.sceau-o b i{font-style:normal;font-size:.6em;margin-left:.08em;letter-spacing:0}
.sceau-o b.mot{font-size:14px;font-style:italic;font-weight:400;letter-spacing:.01em}
.sceau-o.grand{top:18px;right:18px;width:80px;height:80px}
.sceau-o.grand small{font-size:9px;margin-bottom:4px}
.sceau-o.grand b{font-size:27px}
.sceau-o.grand b.mot{font-size:19px}
/* carte : les badges (« Cuvée maison », « Revient bientôt ») restent à gauche et s'arrêtent avant le sceau */
.fiche-c .visuel:has(.sceau-o) .pastilles{right:80px}
.fiche-c .visuel:has(.sceau-o) .pastilles .etiquette-r{white-space:normal;line-height:1.25}
.fiche-c .prix.promo{display:flex;flex-direction:column;align-items:flex-end;gap:2px;line-height:1.1}
.fiche-c .prix.promo s{font-size:12.5px;color:var(--doux);margin:0;text-decoration-thickness:1px}
.fiche-c .prix.promo b{font-weight:500;font-size:16.5px;color:var(--laiton-txt)}
.fiche-c .prix.promo b .des{color:var(--laiton-txt);opacity:.8}
.o-ligne{margin-top:7px;font-size:12.5px;line-height:1.35;color:var(--laiton-txt)}
.o-ligne b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.14em}
@media(max-width:760px){
  .fiche-c .sceau-o{top:8px;right:8px;width:50px;height:50px}
  .fiche-c .sceau-o b{font-size:16.5px}
  .fiche-c .sceau-o small{font-size:6.5px;margin-bottom:2px}
  .fiche-c .visuel:has(.sceau-o) .pastilles{left:8px;top:8px;right:62px}
  /* le prix passe sous le nom : prix de l'offre d'abord, prix habituel barré à côté */
  .fiche-c .prix.promo{flex-direction:row-reverse;justify-content:flex-end;align-items:baseline;gap:8px}
  .o-ligne{margin-top:5px;font-size:12px}
}
/* fiche produit : le sceau sur la photo, l'offre du format choisi au-dessus du prix */
.fiche .visuel .sceau-o{top:22px;right:22px;width:76px;height:76px}
.fiche .visuel .sceau-o small{font-size:8.5px;margin-bottom:4px}
.fiche .visuel .sceau-o b{font-size:25px}
.fiche .actions .px-b{display:flex;flex-direction:column;gap:6px;min-width:0}
.fiche .actions .o-ligne{margin:0;font-size:13.5px}
.fiche .actions .px.promo{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px}
.fiche .actions .px.promo s{font-size:.55em;color:var(--doux);margin:0}
.fiche .actions .px .o-pct{align-self:center;font-family:var(--sans);font-style:normal;font-size:12.5px;font-weight:600;letter-spacing:.02em;line-height:1;padding:6px 10px;border-radius:100px;background:var(--laiton);color:var(--nuit)}
@media(max-width:760px){
  /* au téléphone, la croix de fermeture est en haut à droite : le sceau descend en bas de la photo */
  .fiche .visuel .sceau-o{top:auto;bottom:16px;right:16px;width:66px;height:66px}
  .fiche .visuel .sceau-o b{font-size:22px}
}
/* page Offres */
.of-bas{margin-top:auto;padding-top:clamp(26px,3vw,44px)}
.of-nom{font-family:var(--serif);font-style:italic;font-size:clamp(19px,1.6vw,24px);line-height:1.2;color:var(--laiton-txt);margin-bottom:10px}
.of-bas .of-prix{margin-top:0;padding-top:0;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px}
.of-bas .of-prix b{order:1}
.of-bas .of-prix s{order:2;font-size:17px;color:var(--doux)}
.of-bas .of-fin{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:14px;font-size:13px;color:var(--doux)}
.of-bas .of-fin span{font-size:12.5px;padding:5px 11px;border-radius:100px;background:rgba(196,138,96,.18);color:#7A4520}
.of-bas .of-fin em{font-style:normal}
@media(max-width:640px){.sceau-o.grand{top:14px;right:14px;width:70px;height:70px}.sceau-o.grand b{font-size:23px}}
/* accueil, liste « À la une » : la remise sur la vignette, le prix habituel barré */
.vt-lv{position:relative}
.vt-o{position:absolute;left:0;top:0;z-index:1;font-style:normal;font-family:var(--sans);font-size:10px;font-weight:600;line-height:1;padding:4px 6px;border-radius:100px;background:var(--laiton);color:var(--nuit);white-space:nowrap;pointer-events:none}
.vt-lp.promo{color:var(--laiton-txt);font-weight:500}
.vt-lp.promo s{color:var(--doux);font-weight:400;font-size:.9em;margin-right:4px}
@media(max-width:860px){
  #rayons .vt-o{left:3px;top:3px}
  #rayons .vt-lp.promo{display:flex;flex-direction:column;align-items:flex-end;gap:1px;color:var(--laiton-txt);line-height:1.15}
  #rayons .vt-lp.promo s{margin:0;font-size:12px}
}
/* suggestions de recherche : le prix d'une offre en cuivre */
.sg-px.o{color:var(--laiton-txt);font-weight:500}
.formats-c button.en-offre small{color:var(--laiton-txt)}
.formats-c button small i{font-style:normal;font-weight:600;color:var(--laiton-txt)}
.formats-c button[aria-checked="true"] small i{color:var(--laiton-c)}
@media(max-width:760px){.fiche .actions .px-b{flex:1 1 100%}}
.formats-c button.en-offre[aria-checked="true"] small{color:var(--laiton-c)}
@media(max-width:360px){
  .fiche-c .sceau-o{width:44px;height:44px}
  .fiche-c .sceau-o b{font-size:14.5px}
  .fiche-c .sceau-o small{font-size:6px;letter-spacing:.14em}
  .fiche-c .visuel:has(.sceau-o) .pastilles{right:56px}
}

/* Cuvées de L'Officine à l'affiche : plusieurs cuvées, un sélecteur sobre (v53) */
.piece-choix{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(24px,4vh,40px)}
.piece-choix button{font:inherit;font-size:13.5px;letter-spacing:.01em;color:rgba(241,235,224,.8);background:transparent;border:1px solid rgba(224,181,150,.38);border-radius:100px;padding:8px 16px;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.piece-choix button:hover{border-color:var(--laiton-c);color:var(--creme)}
.piece-choix button[aria-pressed="true"]{background:var(--laiton-c);border-color:var(--laiton-c);color:var(--abysse)}
.piece-choix+.d2{margin-top:clamp(18px,3vh,28px)}
@media (hover:none){.piece-choix button:hover{border-color:rgba(224,181,150,.38);color:rgba(241,235,224,.8)}.piece-choix button[aria-pressed="true"]:hover{border-color:var(--laiton-c);color:var(--abysse)}}

/* ================= v54 : ateliers en entrée libre ================= */
/* Atelier à 0 € : « Entrée libre », bouton « Je m'inscris », inscription dans une petite fenêtre, sans panier ni paiement */
.insc-voile{position:fixed;inset:0;z-index:230;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(6,52,58,.55);opacity:0;transition:opacity .35s var(--ease)}
.insc-voile.ouvert{opacity:1}
.insc{position:relative;width:min(100%,560px);max-height:calc(100svh - 32px);overflow:auto;overscroll-behavior:contain;background:var(--blanc);color:var(--encre);border-radius:18px;box-shadow:0 40px 80px -40px rgba(6,52,58,.6);transform:translateY(14px);transition:transform .45s var(--ease)}
.insc-voile.ouvert .insc{transform:none}
.insc-corps{padding:clamp(26px,4vw,40px)}
.insc .note{margin:0;font-size:16px}
.insc h3{font-size:clamp(28px,3vw,38px);line-height:1.05;margin-top:8px;padding-right:44px}
.insc-quand{margin-top:10px;font-size:14.5px;color:var(--doux)}
.insc-f{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.insc-f label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--doux)}
.insc-f input:not([type=checkbox]),.insc-f select{width:100%;padding:12px 13px;border:1px solid var(--trait);border-radius:6px;background:#fff;font:inherit;font-size:16px;color:var(--encre);outline:none}
.insc-f input:not([type=checkbox]):focus,.insc-f select:focus{border-color:var(--encre)}
.insc-deux{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.insc-f .insc-accord{flex-direction:row;align-items:flex-start;gap:10px;margin-top:2px;font-size:13px;line-height:1.5;color:var(--encre);cursor:pointer}
.insc-accord input{margin-top:2px;width:16px;height:16px;flex:none;accent-color:var(--nuit)}
.insc-msg{font-size:13.5px;line-height:1.5;color:#9A3A2E}
.insc-msg:empty{display:none}
.insc-f .cta{justify-content:center;margin-top:4px}
.insc-f .cta[disabled]{opacity:.6;cursor:wait}
.insc .piege{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.insc-fermer{position:absolute;top:14px;right:14px;z-index:2;width:42px;height:42px;border-radius:50%;background:var(--blanc);color:var(--encre);box-shadow:inset 0 0 0 1px var(--trait)}
.insc-fermer i::before,.insc-fermer i::after{content:'';position:absolute;left:13px;right:13px;top:50%;height:1px;background:currentColor;transform:rotate(45deg)}
.insc-fermer i::after{transform:rotate(-45deg)}
.insc-fermer:hover{background:var(--nuit);color:var(--creme);box-shadow:none}
.insc-ok p:not(.note):not(.insc-num){margin-top:12px;font-size:15px;line-height:1.6}
.insc-ok .insc-num{margin-top:14px;font-size:13px;color:var(--doux)}
.insc-ok .cta{margin-top:22px}
@media(max-width:600px){
  .insc-voile{align-items:flex-end;padding:0}
  .insc{width:100%;max-height:94svh;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom)}
  .insc-deux{grid-template-columns:1fr}
}
@media (hover:none),(pointer:coarse){.insc-fermer:hover{background:var(--blanc);color:var(--encre);box-shadow:inset 0 0 0 1px var(--trait)}}
@media(prefers-reduced-motion:reduce){.insc-voile,.insc{transition:none}}

/* ---------- Recette du 1er octobre ---------- */
/* petits écrans en hauteur (iPhone SE, téléphone en paysage) : le tiroir du panier défile en entier, la liste n'est plus écrasée
   et le bouton de paiement (ou de validation) reste toujours accessible */
@media (max-height: 760px) and (max-width: 760px), (max-height: 480px){
  #panier{overflow-y:auto;overscroll-behavior:contain}
  #panier .p-corps{flex:1 0 auto;overflow:visible}
}
/* écrans tactiles : les champs à moins de 16 px font zoomer Safari (iPhone) à la saisie, et le panier sort de l'écran */
@media (hover: none) and (pointer: coarse){
  .filtres input,.filtres select,.p-client input,.p-client textarea,.p-promo-form input,.cp-champs input,.cp-champs textarea{font-size:16px}
}
