
/* LAMADUBO — un voyage nocturne qui traverse cinq univers (Ombre, Foi, Grandir, Aimer, Aube) jusqu'au lever du jour.
   Single deliberate dark world. */
:root{
  --nuit:#07090F; --encre:#121625; --os:#EFE7D8; --brume:#A9AABB;
  --braise:#E2457A; --aube:#EBBB68; --ligne:rgba(239,231,216,.14);
  --bg1:#07090F; --bg2:#0D1020;
  --f-display:"Marcellus","Cormorant Garamond",Georgia,serif;
  --f-body:"Literata",Georgia,"Times New Roman",serif;
  --f-ui:"Jost","Avenir Next","Segoe UI",system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{background:var(--nuit);overflow-x:clip}
body{margin:0;color:var(--os);font:400 1.1rem/1.75 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--nuit)}
img{max-width:100%;display:block}
a{color:var(--aube)}
:focus-visible{outline:2px solid var(--aube);outline-offset:3px}
h1,h2,h3{font-family:var(--f-display);font-weight:400;margin:0;text-wrap:balance}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.label{font:500 .76rem/1.2 var(--f-ui);letter-spacing:.24em;text-transform:uppercase;color:var(--aube)}
.muted{color:var(--brume)}

/* Fixed atmosphere: gradient + particle canvas + grain */
#ciel{position:fixed;inset:0;z-index:-3;background:radial-gradient(120% 80% at 50% 0%,var(--bg2),var(--bg1) 70%);transition:background 1.2s}
#poussiere{position:fixed;inset:0;z-index:-2;width:100%;height:100%;pointer-events:none}
#grain{position:fixed;inset:-50%;z-index:-1;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* Top bar */
.barre{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:50;transition:background .4s}
.barre.plein{background:rgba(7,9,15,.78);backdrop-filter:blur(10px)}
.barre .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.marque{font:400 1.05rem/1 var(--f-display);letter-spacing:.3em;color:var(--os);text-decoration:none}
.barre nav{display:flex;gap:20px;align-items:center;font:500 .82rem/1 var(--f-ui);letter-spacing:.08em}
.barre nav a{color:var(--os);text-decoration:none;opacity:.8}
.barre nav a:hover{opacity:1;color:var(--aube)}
.nav-long{display:flex;gap:20px}
@media (max-width:820px){.nav-long{display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border-radius:999px;font:600 .92rem/1 var(--f-ui);letter-spacing:.06em;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .25s,background .25s,color .25s,border-color .25s}
.btn-or{background:var(--aube);color:#14100A}
.btn-or:hover{transform:translateY(-2px);background:#F4CF8C}
.btn-fin{border-color:var(--ligne);color:var(--os);background:rgba(7,9,15,.3)}
.btn-fin:hover{border-color:var(--aube);color:var(--aube)}
.barre .btn{min-height:38px;padding:0 18px;font-size:.8rem}

/* HERO — lantern reveal */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;display:flex;align-items:flex-end;--x:62%;--y:58%}
.hero .calque{position:absolute;inset:-4%;background:url(/assets/img/maison.webp) center 60%/cover no-repeat}
.hero .sombre{filter:brightness(.18) saturate(.6)}
.hero .eclaire{filter:brightness(1.05) saturate(1.1) sepia(.15);-webkit-mask-image:radial-gradient(circle 230px at var(--x) var(--y),#000 0%,rgba(0,0,0,.6) 40%,transparent 72%);mask-image:radial-gradient(circle 230px at var(--x) var(--y),#000 0%,rgba(0,0,0,.6) 40%,transparent 72%)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,15,.2),rgba(7,9,15,0) 40%,var(--nuit) 98%)}
.fenetre{position:absolute;left:50.4%;top:61%;width:10px;height:10px;border-radius:50%;background:var(--aube);box-shadow:0 0 50px 22px rgba(235,187,104,.4);animation:veille 4.5s ease-in-out infinite;z-index:1}
@keyframes veille{0%,100%{opacity:.5}50%{opacity:1}}
.hero .contenu{position:relative;z-index:2;padding-block:0 9vh;display:grid;gap:26px}
.hero h1{font-size:clamp(3.4rem,12vw,10.5rem);line-height:.9;letter-spacing:-.01em}
.hero h1 .petit{display:block;font-size:.3em;letter-spacing:.5em;text-transform:uppercase;color:var(--aube);margin-bottom:.6em}
.hero h1 .l{display:inline-block}
.hero .accroche{font-size:clamp(1.1rem,1.8vw,1.35rem);font-style:italic;max-width:32ch}
.hero .indice{position:absolute;right:max(20px,env(safe-area-inset-right,0px));bottom:6vh;z-index:2;font:500 .72rem/1 var(--f-ui);letter-spacing:.3em;text-transform:uppercase;color:var(--brume);writing-mode:vertical-rl;display:flex;align-items:center;gap:14px}
.hero .indice::after{content:"";width:1px;height:70px;background:linear-gradient(var(--aube),transparent);animation:descend 2.2s ease-in-out infinite}
@keyframes descend{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.ctas{display:flex;flex-wrap:wrap;gap:12px}

/* SEUIL — words light up as you read */
.seuil{padding-block:22vh 18vh}
.seuil p.grand{font:400 clamp(1.7rem,4.2vw,3.4rem)/1.28 var(--f-display);max-width:22ch}
.seuil .mot{opacity:1}
.seuil .signe{margin-top:40px;font:500 .8rem/1 var(--f-ui);letter-spacing:.24em;text-transform:uppercase;color:var(--brume)}
.coeur{margin-top:48px;width:min(560px,100%);height:60px}
.coeur path{fill:none;stroke:var(--braise);stroke-width:2;stroke-dasharray:900;stroke-dashoffset:0}

/* UNIVERS — stacked panels that slide over each other */
.univers{position:relative}
.panneau{position:relative;height:100svh;min-height:620px;overflow:hidden}
.panneau .interieur{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,80px);padding-block:90px 50px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));transform-origin:50% 30%;will-change:transform}
.panneau .fond{position:absolute;inset:0;z-index:-1}
.p-ombre .fond{background:radial-gradient(90% 70% at 70% 40%,#1A1424,#08070C 70%)}
.p-foi .fond{background:radial-gradient(90% 80% at 30% 20%,#2B1A45,#0D0A1C 70%)}
.p-grandir .fond{background:radial-gradient(90% 80% at 70% 60%,#0F2A33,#081218 70%)}
.p-aimer .fond{background:radial-gradient(90% 80% at 40% 60%,#3A1D1A,#120A0A 70%)}
.p-aube .fond{background:linear-gradient(180deg,#1A1630 0%,#5A2F3E 45%,#D88E55 85%,#F2C27A 100%)}
.panneau .mot-geant{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:400 clamp(5rem,22vw,20rem)/1 var(--f-display);letter-spacing:.06em;color:transparent;-webkit-text-stroke:1px rgba(239,231,216,.12);white-space:nowrap;pointer-events:none;z-index:0}
.panneau .texte{position:relative;z-index:2;display:grid;gap:22px;max-width:520px;min-width:0}
.panneau h2{font-size:clamp(2.3rem,5.4vw,4.6rem);line-height:1.02}
.panneau .texte p.corps{font-size:1.12rem;color:#DCD3C4}
.panneau .citation{font:italic 400 1.05rem/1.6 var(--f-body);color:var(--aube);border-left:1px solid var(--aube);padding-left:18px}
.panneau .vols{font:500 .76rem/1.6 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--brume)}
.panneau .visuel{position:relative;z-index:1;height:min(74svh,680px);display:flex;justify-content:center;align-items:center;min-width:0}
.panneau .visuel .cadre{position:relative;height:100%;aspect-ratio:3/4;max-width:100%;overflow:hidden;border-radius:4px;box-shadow:0 50px 120px -40px rgba(0,0,0,.9)}
.panneau .visuel .cadre img{width:100%;height:120%;object-fit:cover;will-change:transform}
.panneau .visuel .second{position:absolute;width:42%;aspect-ratio:3/4;right:-4%;bottom:-6%;border-radius:4px;overflow:hidden;box-shadow:0 30px 70px -20px rgba(0,0,0,.9);border:1px solid var(--ligne)}
.panneau .visuel .second img{width:100%;height:100%;object-fit:cover}
.p-ombre .label{color:var(--braise)}
.p-grandir .label{color:#7FC8C2}
.p-aimer .label{color:#F0987A}
.p-aube .interieur{grid-template-columns:1fr;justify-items:center;text-align:center}
.p-aube .texte{max-width:760px;justify-items:center}
.p-aube h2{color:#1C1220;font-size:clamp(2.4rem,6vw,5.4rem)}
.p-aube .texte p.corps{color:#2B1B24}
.p-aube .label{color:#5A2F3E}
.p-aube .soleil{position:absolute;left:50%;bottom:-38vmin;width:80vmin;height:80vmin;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#FFF1CF 0%,#F6C979 35%,rgba(242,194,122,0) 70%);z-index:0}
@media (max-width:820px){
  .panneau{height:auto;min-height:100svh}
  .panneau .interieur{position:relative;inset:auto;grid-template-columns:1fr;align-content:start;gap:18px;padding-block:88px 48px;min-height:100svh}
  .panneau .visuel{height:30svh;order:-1}
  .panneau .visuel .second{display:none}
  .panneau h2{font-size:clamp(2rem,9vw,2.8rem)}
  .panneau .texte p.corps{font-size:1rem}
  .panneau .texte{display:grid;gap:14px}
  .panneau .texte .btn{margin-top:4px}
}
.boussole{position:fixed;left:max(14px,env(safe-area-inset-left,0px));top:50%;transform:translateY(-50%);z-index:40;display:grid;gap:14px;opacity:0;transition:opacity .4s;pointer-events:none}
.boussole.visible{opacity:1}
.boussole span{display:flex;align-items:center;gap:10px;font:500 .64rem/1 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;color:rgba(239,231,216,.35);transition:color .3s}
.boussole span::before{content:"";width:16px;height:1px;background:currentColor;transition:width .3s}
.boussole span.actif{color:var(--aube)}
.boussole span.actif::before{width:34px}
@media (max-width:820px){.boussole{display:none}}

/* VOLUMES — horizontal travel */
.volumes{position:relative;overflow:hidden}
.volumes .tete{padding-block:11vh 4vh;display:grid;gap:12px}
.volumes h2{font-size:clamp(2.2rem,5vw,4rem)}
.glisser{display:none}
.piste{display:flex;gap:28px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:20vw;padding-bottom:7vh;width:max-content}
.vol{width:clamp(190px,min(20vw,34vh),290px);display:grid;gap:10px;align-content:start}
a.vol,a.vol:hover,a.vol:visited{text-decoration:none;color:inherit}
a.vol:hover h3{color:var(--aube)}
.vol figure{margin:0;aspect-ratio:3/4;overflow:hidden;border-radius:4px;position:relative;background:var(--encre)}
.vol figure img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1),filter 1s}
.vol:hover figure img{transform:scale(1.07);filter:brightness(1.1)}
.vol figure::after{content:attr(data-n);position:absolute;left:14px;top:10px;font:400 3rem/1 var(--f-display);color:rgba(239,231,216,.85);text-shadow:0 2px 20px rgba(0,0,0,.6);font-variant-numeric:tabular-nums}
.vol h3{font-size:1.35rem}
.vol p{font-size:.95rem;line-height:1.55;color:var(--brume)}
.vol .voix{font:500 .7rem/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--aube)}
@media (max-width:820px){.piste{overflow-x:auto;width:auto;scroll-snap-type:x mandatory;padding-right:20px}.vol{scroll-snap-align:start;flex:0 0 72%}}

/* VOIX */
.voix-sec{padding-block:16vh}
.voix-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:48px}
.carte-voix{position:relative;padding:32px;border:1px solid var(--ligne);border-radius:6px;background:rgba(18,22,37,.6);backdrop-filter:blur(6px);display:grid;gap:14px;overflow:hidden;transition:transform .5s,border-color .5s}
.carte-voix:hover{transform:translateY(-6px);border-color:rgba(235,187,104,.5)}
.carte-voix .initiale{font:400 5rem/0.8 var(--f-display);color:var(--aube)}
.carte-voix h3{font-size:1.6rem}
.carte-voix .role{font:500 .72rem/1 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--brume)}
@media (max-width:820px){.voix-grille{grid-template-columns:1fr}}

/* EXTRAIT */
.extrait{padding-block:10vh 16vh}
.page{max-width:720px;margin:0 auto;background:#EFE7D7;color:#1B1A22;padding:clamp(28px,6vw,72px);border-radius:2px;box-shadow:0 60px 120px -40px rgba(0,0,0,.9);transform-origin:50% 100%}
.page p{font-size:1.1rem;line-height:1.85}
.page p+p{margin-top:1.1em}
.page .texte p,.page .accroche-ext{text-align:justify;text-justify:inter-word;-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:7 3 3}
.page .texte p:first-child::first-letter{font-family:var(--f-display);float:left;font-size:4.4em;line-height:.8;padding:.06em .1em 0 0;color:#8E2149}
.page .label{color:#8E2149}
.page h2{font-size:2.2rem;margin:8px 0 26px;color:#1B1A22}
.page .suite{margin-top:1.6em;font-style:italic;color:#4b4655}

/* PRODUCTEURS */
.prod{padding-block:16vh;position:relative}
.prod-grille{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,90px);margin-top:44px}
.logline{font:400 clamp(1.5rem,3vw,2.3rem)/1.3 var(--f-display)}
.fiche{display:grid;margin:0}
.fiche div{display:grid;grid-template-columns:8.5rem minmax(0,1fr);gap:16px;padding:15px 0;border-bottom:1px solid var(--ligne)}
.fiche dt{font:500 .74rem/1.7 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--aube)}
.fiche dd{margin:0;font-size:1rem;line-height:1.6}
.contact-prod{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px}
.contact-prod code{font:500 1rem/1 var(--f-ui);padding:14px 18px;border:1px solid var(--ligne);border-radius:999px;user-select:all}
@media (max-width:860px){.prod-grille{grid-template-columns:1fr}.fiche div{grid-template-columns:1fr;gap:2px}}

/* AUTEUR */
.auteur{padding-block:14vh}
.auteur .bloc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(32px,6vw,90px);align-items:center}
.auteur blockquote{margin:0;font:400 clamp(1.6rem,3.2vw,2.5rem)/1.25 var(--f-display)}
.auteur blockquote::before{content:"\201C";display:block;color:var(--aube);font-size:2.4em;line-height:.6}
@media (max-width:860px){.auteur .bloc{grid-template-columns:1fr}}

/* COMMANDER */
.etapes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;margin-top:44px}
@media (max-width:900px){.etapes{grid-template-columns:1fr}}
.boite{padding:clamp(22px,3.5vw,36px);border:1px solid var(--ligne);border-radius:8px;background:rgba(18,22,37,.85);display:grid;gap:18px;align-content:start;min-width:0}
.choix{display:grid;gap:12px}
.option{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 18px;border:1px solid var(--ligne);border-radius:6px;cursor:pointer;transition:border-color .3s,background .3s}
.option:hover{border-color:rgba(235,187,104,.5)}
.option input{accent-color:#EBBB68;width:18px;height:18px;margin:0}
.option:has(input:checked){border-color:var(--aube);background:rgba(235,187,104,.07)}
.option .nom{font:500 1rem/1.3 var(--f-ui)}
.option .det{font:400 .84rem/1.4 var(--f-ui);color:var(--brume)}
.option .px{font:400 1.5rem/1 var(--f-display);color:var(--aube);font-variant-numeric:tabular-nums;text-align:right}
.option .px small{display:block;font:500 .7rem/1.4 var(--f-ui);color:var(--brume)}
.champs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:560px){.champs{grid-template-columns:1fr}}
.champ{display:grid;gap:6px;min-width:0}
.champ.large{grid-column:1/-1}
.champ label{font:500 .74rem/1.2 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--brume)}
.champ input,.champ textarea{width:100%;font:400 1rem/1.4 var(--f-ui);color:var(--os);background:#07090F;border:1px solid var(--ligne);border-radius:4px;padding:12px 14px}
.champ textarea{min-height:76px;resize:vertical}
.total{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--f-ui);padding-top:12px;border-top:1px solid var(--ligne)}
.total strong{font:400 2rem/1 var(--f-display);color:var(--aube);font-variant-numeric:tabular-nums}
.note{font:400 .84rem/1.5 var(--f-ui);color:var(--brume)}
.paiement-resultat{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;padding:18px;border:1px dashed rgba(235,187,104,.5);border-radius:8px}
.paiement-resultat[hidden]{display:none!important}
#qr{background:#fff;padding:8px;border-radius:6px;width:144px;height:144px}
#qr img,#qr canvas{width:128px!important;height:128px!important}
.badge-test{display:inline-block;font:600 .68rem/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:#14100A;background:var(--aube);padding:6px 10px;border-radius:999px}
@media (max-width:560px){.paiement-resultat{grid-template-columns:1fr}}

/* FAQ */
.faq{padding-block:12vh 16vh}
.faq details{border-bottom:1px solid var(--ligne);padding:20px 0}
.faq summary{cursor:pointer;font:400 1.3rem/1.35 var(--f-display);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--aube);font-family:var(--f-ui)}
.faq details[open] summary::after{content:"\2212"}
.faq details p{margin-top:12px;color:var(--brume)}
footer{padding-block:48px calc(40px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--ligne);font:400 .88rem/1.6 var(--f-ui);color:var(--brume)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--aube);color:#14100A;font:600 .9rem/1 var(--f-ui);padding:14px 20px;border-radius:999px;z-index:70}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== Content pages ===== */
.fil{font:500 .78rem/1.4 var(--f-ui);letter-spacing:.08em;color:var(--brume);display:flex;flex-wrap:wrap;gap:8px}
.fil a{color:var(--brume);text-decoration:none}.fil a:hover{color:var(--aube)}
.fil span[aria-hidden]{opacity:.5}
.tete-page{position:relative;padding-block:130px 70px;overflow:hidden;isolation:isolate}
.tete-page .grille{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,5vw,80px);align-items:center}
.tete-page h1{font-size:clamp(2.4rem,6vw,4.8rem);line-height:1.02;margin-top:18px}
.reponse{margin-top:24px;font-size:clamp(1.08rem,1.6vw,1.25rem);line-height:1.7;max-width:60ch;color:#E2D9C9}
.tete-page .couv{position:relative;aspect-ratio:3/4;border-radius:4px;overflow:hidden;box-shadow:0 50px 110px -40px rgba(0,0,0,.9);max-width:380px;justify-self:end;width:100%}
.tete-page .couv img{width:100%;height:115%;object-fit:cover}
/* Lanterne : la lumiere decouvre l'image sous le curseur, comme sur la page d'accueil. */
.lanterne{--x:52%;--y:55%;position:relative;isolation:isolate;background:#05060A}
.lanterne .calque{position:absolute;inset:0;width:100%;height:115%;object-fit:cover}
.lanterne .sombre{filter:brightness(.3) saturate(.6) contrast(1.05)}
.lanterne .eclaire{filter:brightness(1.06) saturate(1.12) sepia(.12);
 -webkit-mask-image:radial-gradient(circle at var(--x) var(--y),#000 0%,rgba(0,0,0,.7) 46%,transparent 80%);
 mask-image:radial-gradient(circle at var(--x) var(--y),#000 0%,rgba(0,0,0,.7) 46%,transparent 80%)}
.lanterne .lueur{position:absolute;inset:0;z-index:2;pointer-events:none;
 background:radial-gradient(circle at var(--x) var(--y),rgba(235,187,104,.22),transparent 55%);mix-blend-mode:screen}
.lanterne::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 70px 12px rgba(5,6,10,.6)}
@media (prefers-reduced-motion:reduce){.lanterne .eclaire{-webkit-mask-image:none;mask-image:none;filter:none}.lanterne .sombre{display:none}}
.tete-page .halo{position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 70% at 80% 30%,var(--halo,rgba(235,187,104,.16)),transparent 70%)}
@media (max-width:820px){.tete-page .grille{grid-template-columns:1fr}.tete-page .couv{justify-self:start;max-width:260px}}
.retenir{margin-block:10px 40px;padding:26px 28px;border:1px solid rgba(235,187,104,.4);border-radius:8px;background:rgba(235,187,104,.06)}
.retenir h2{font:600 .78rem/1.2 var(--f-ui);letter-spacing:.22em;text-transform:uppercase;color:var(--aube);margin-bottom:14px}
.retenir ul{margin:0;padding-left:1.1em;display:grid;gap:8px}
.corps-page{padding-block:20px 90px}
.corps-page .colonne{max-width:740px}
.corps-page h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:56px 0 18px;line-height:1.12}
.corps-page h3{font-size:1.35rem;margin:30px 0 10px}
.corps-page p+p{margin-top:1.05em}
.corps-page p,.corps-page li{color:#DCD3C4}
.corps-page .page p,.corps-page .page li,.corps-page .page{color:#1B1A22}
.corps-page .page .accroche-ext{color:#6b5a66}
.corps-page .page .suite{color:#4b4655}
@media (max-width:760px){.page .texte p{text-align:justify;-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:6 3 3}.page .accroche-ext{text-align:center}}
.corps-page ul{padding-left:1.1em}
.corps-page blockquote{margin:36px 0;padding:6px 0 6px 24px;border-left:2px solid var(--aube);font:italic 400 1.3rem/1.55 var(--f-body);color:var(--os)}
.corps-page blockquote cite{display:block;margin-top:10px;font:500 .78rem/1.2 var(--f-ui);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--brume)}
.etiquettes{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.etiquettes span{font:500 .78rem/1 var(--f-ui);letter-spacing:.06em;padding:9px 14px;border:1px solid var(--ligne);border-radius:999px;color:var(--brume)}
.fiche-vol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}
.fiche-vol div{padding:18px;border:1px solid var(--ligne);border-radius:6px;background:rgba(18,22,37,.55)}
.fiche-vol dt{font:500 .72rem/1.3 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--aube);margin-bottom:6px}
.fiche-vol dd{margin:0;font-size:.98rem;line-height:1.5}
@media (max-width:720px){.fiche-vol{grid-template-columns:1fr}}
.grille-vols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;margin-top:40px}
@media (max-width:1000px){.grille-vols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.grille-vols{grid-template-columns:repeat(2,minmax(0,1fr))}}
.grille-vols a{text-decoration:none;color:inherit}
.precsuiv{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:60px;padding-top:24px;border-top:1px solid var(--ligne);font-family:var(--f-ui)}
.precsuiv a{text-decoration:none;display:grid;gap:4px;max-width:46%}
.precsuiv small{color:var(--brume);letter-spacing:.14em;text-transform:uppercase;font-size:.7rem}
.suite-visite{padding-block:70px;border-top:1px solid var(--ligne)}
.suite-visite .liens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:26px}
.suite-visite a{display:grid;gap:6px;padding:22px;border:1px solid var(--ligne);border-radius:8px;text-decoration:none;color:var(--os);transition:border-color .3s,transform .3s;background:rgba(18,22,37,.5)}
.suite-visite a:hover{border-color:rgba(235,187,104,.6);transform:translateY(-4px)}
.suite-visite a span{font:500 .72rem/1.2 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--aube)}
.suite-visite a strong{font:400 1.25rem/1.25 var(--f-display)}
@media (max-width:820px){.suite-visite .liens{grid-template-columns:1fr}}
.signature{margin-top:50px;font:400 .86rem/1.6 var(--f-ui);color:var(--brume)}
.pied-liens{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:20px 30px}
.pied-liens p{font:600 .72rem/1.2 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--aube);margin-bottom:10px}
.pied-liens ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pied-liens a{color:var(--os);text-decoration:none;opacity:.8}.pied-liens a:hover{opacity:1;color:var(--aube)}
@media (max-width:820px){.pied-liens{grid-template-columns:repeat(2,minmax(0,1fr))}}
footer .wrap.bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid var(--ligne);padding-top:20px}
.lang{font:500 .8rem/1 var(--f-ui);letter-spacing:.1em}
/* order page */
.commande-page .etapes{margin-top:30px}
.pay-final{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center;padding:28px;border:1px solid rgba(235,187,104,.5);border-radius:10px;background:rgba(235,187,104,.06);margin-top:30px}
@media (max-width:620px){.pay-final{grid-template-columns:1fr}}
.reveal-up{will-change:transform}
.corps-page .colonne:has(.commande-page){max-width:none}

html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}
.panneau .interieur{backface-visibility:hidden}

.p-aube .fond{background:radial-gradient(90% 80% at 50% 40%,#141022,#07060B 75%)}
.p-aube .lumiere{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#1A1630 0%,#5A2F3E 45%,#D88E55 85%,#F2C27A 100%)}
.p-aube .soleil{z-index:-1}
.p-aube .t-lum{display:inline}

/* Voices: accordion of portraits */
.voix-sec{position:relative;overflow:hidden}
.voix-sec .filigrane{position:absolute;top:8vh;left:0;white-space:nowrap;font:400 clamp(6rem,18vw,16rem)/1 var(--f-display);color:transparent;-webkit-text-stroke:1px rgba(239,231,216,.07);pointer-events:none;z-index:0}
.voix-sec .wrap{position:relative;z-index:1}
.voix-accordeon{display:flex;gap:16px;height:min(74vh,640px);margin-top:48px}
.voix-carte{--c:235,187,104;position:relative;flex:1;min-width:0;border-radius:12px;overflow:hidden;isolation:isolate;border:1px solid var(--ligne);transition:flex .9s cubic-bezier(.2,.7,.2,1),border-color .6s}
.voix-accordeon:hover .voix-carte{flex:.75}
.voix-accordeon .voix-carte:hover{flex:2.3;border-color:rgba(var(--c),.6)}
.voix-carte .vfond{position:absolute;left:0;top:-10%;width:100%;height:120%;object-fit:cover;z-index:-3;filter:grayscale(.7) brightness(.42);transition:filter .9s,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.voix-carte:hover .vfond{filter:grayscale(0) brightness(.78);transform:scale(1.07)}
.voix-carte::after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(7,9,15,.05) 15%,rgba(7,9,15,.55) 50%,rgba(7,9,15,.95) 88%)}
.voix-carte::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .5s;background:radial-gradient(circle 260px at var(--mx,50%) var(--my,40%),rgba(var(--c),.35),transparent 70%);mix-blend-mode:screen}
.voix-carte:hover::before{opacity:1}
.voix-carte .vc-initiale{position:absolute;top:6px;left:18px;font:400 clamp(6rem,11vw,10rem)/1 var(--f-display);color:transparent;-webkit-text-stroke:1.5px rgba(var(--c),.7);transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.voix-carte:hover .vc-initiale{transform:translateY(-6px) scale(1.06)}
.voix-carte .vc-contenu{position:absolute;left:0;right:0;bottom:0;padding:26px;display:grid;gap:10px}
.voix-carte h3{font-size:clamp(1.6rem,2.6vw,2.3rem)}
.voix-carte .role{font:500 .72rem/1.3 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:rgb(var(--c))}
.voix-carte .vc-phrase{font-size:1rem;line-height:1.55;color:#E2D9C9;max-width:44ch}
.voix-carte .vc-vols{font:500 .72rem/1.4 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--brume);max-height:0;opacity:0;overflow:hidden;transition:max-height .7s,opacity .7s}
.voix-carte:hover .vc-vols{max-height:3em;opacity:1}
.voix-carte.c-ike{--c:235,187,104}.voix-carte.c-jea{--c:226,69,122}.voix-carte.c-reg{--c:127,200,194}
@media (max-width:820px){.voix-accordeon{flex-direction:column;height:auto}.voix-carte{height:440px;flex:none}.voix-accordeon:hover .voix-carte,.voix-accordeon .voix-carte:hover{flex:none}.voix-carte .vc-vols{max-height:3em;opacity:1}}

/* Excerpt reader */
.extrait .wrap{perspective:1600px}
.lecteur{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 auto 30px;max-width:900px}
.lecteur button{font:500 .78rem/1 var(--f-ui);letter-spacing:.08em;padding:11px 15px;border-radius:999px;border:1px solid var(--ligne);background:rgba(18,22,37,.6);color:var(--os);cursor:pointer;transition:background .3s,color .3s,border-color .3s,transform .3s}
.lecteur button:hover{border-color:var(--aube);transform:translateY(-2px)}
.lecteur button[aria-selected="true"]{background:var(--aube);color:#14100A;border-color:var(--aube)}
.page .accroche-ext{font-style:italic;color:#6b5a66;margin:-10px 0 24px;font-size:1.02rem}
.ext-intro{text-align:center;max-width:56ch;margin:0 auto 26px;color:var(--brume)}

/* Shop cards (home) */
.commander{position:relative;padding-block:18vh 16vh;isolation:isolate;overflow:hidden;background:radial-gradient(80% 55% at 50% 108%,rgba(243,208,138,.34),rgba(226,69,122,.14) 45%,transparent 75%),radial-gradient(40% 30% at 15% 20%,rgba(226,69,122,.08),transparent 70%),linear-gradient(180deg,var(--nuit),#110D19 55%,#1B1220)}
.commander::before{content:"";position:absolute;left:0;right:0;bottom:24%;height:1px;background:linear-gradient(90deg,transparent,rgba(243,208,138,.55),transparent);z-index:-1}
.commander::after{content:"";position:absolute;left:50%;bottom:-30vh;width:min(1100px,140vw);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(243,208,138,.22),transparent 60%);filter:blur(30px);z-index:-1;animation:leve 9s ease-in-out infinite alternate}
@keyframes leve{to{transform:translate(-50%,-6vh) scale(1.06)}}
.commander .entete{text-align:center;max-width:760px;margin:0 auto;display:grid;gap:14px;justify-items:center}
.commander .entete h2{font-size:clamp(2.4rem,6vw,4.6rem)}
.commander .entete p{color:rgba(239,231,216,.78)}
.boutique{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:26px;align-items:center;margin-top:60px}
.offre-carte{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:520px;border-radius:22px;overflow:hidden;text-decoration:none;color:var(--os);isolation:isolate;background:#0B0911;box-shadow:0 40px 90px -40px rgba(0,0,0,.95);transition:transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .7s}
.offre-carte::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(160deg,rgba(243,208,138,.75),rgba(239,231,216,.08) 42%,rgba(226,69,122,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:3;pointer-events:none}
.offre-carte::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,9,17,0) 22%,rgba(11,9,17,.7) 52%,#0B0911 86%)}
.oc-fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:saturate(1.1) brightness(.9);transition:transform 1.6s cubic-bezier(.2,.7,.2,1),filter .8s}
.oc-reflet{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,240,210,.16) 50%,transparent 65%);transform:translateX(-120%);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.offre-carte:hover{transform:translateY(-10px);box-shadow:0 60px 120px -40px rgba(243,208,138,.45)}
.offre-carte:hover .oc-fond{transform:scale(1.07);filter:saturate(1.25) brightness(1.02)}
.offre-carte:hover .oc-reflet{transform:translateX(120%)}
.offre-carte.vedette{min-height:590px;box-shadow:0 0 0 1px rgba(243,208,138,.18),0 60px 130px -30px rgba(243,208,138,.5)}
.offre-carte.vedette::before{padding:1.5px;background:linear-gradient(160deg,#F7DCA0,rgba(243,208,138,.25) 45%,#E2457A)}
.oc-badge{position:absolute;top:20px;left:50%;transform:translateX(-50%);z-index:4;white-space:nowrap;font:600 .68rem/1 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;color:#1A1208;background:linear-gradient(90deg,#F7DCA0,#EBBB68);padding:9px 16px;border-radius:999px;box-shadow:0 10px 30px -8px rgba(243,208,138,.7)}
.oc-txt{display:grid;gap:10px;padding:28px 28px 30px}
.oc-type{font:600 .7rem/1 var(--f-ui);letter-spacing:.26em;text-transform:uppercase;color:var(--aube)}
.oc-nom{font:400 clamp(1.6rem,2.2vw,1.95rem)/1.15 var(--f-display)}
.oc-det{font:400 .95rem/1.5 var(--f-ui);color:rgba(239,231,216,.75)}
.oc-bas{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;padding-top:18px;border-top:1px solid rgba(239,231,216,.14)}
.oc-prix{font:400 2.5rem/1 var(--f-display);color:#F7DCA0;font-variant-numeric:tabular-nums;white-space:nowrap}
.oc-prix small{display:block;margin-top:6px;font:500 .74rem/1 var(--f-ui);letter-spacing:.08em;color:var(--brume)}
.oc-cta{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:999px;font:600 .84rem/1 var(--f-ui);letter-spacing:.05em;color:var(--aube);border:1px solid rgba(235,187,104,.55);transition:background .4s,color .4s,border-color .4s,gap .4s;white-space:nowrap}
.offre-carte.vedette .oc-cta,.offre-carte:hover .oc-cta{background:linear-gradient(90deg,#F7DCA0,#EBBB68);color:#1A1208;border-color:transparent}
.offre-carte:hover .oc-cta{gap:14px}
.paiements{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:46px}
.paiements span{display:inline-flex;align-items:center;gap:8px;font:500 .8rem/1 var(--f-ui);letter-spacing:.06em;color:rgba(239,231,216,.8);border:1px solid rgba(239,231,216,.14);padding:11px 16px;border-radius:999px;background:rgba(7,9,15,.45);backdrop-filter:blur(6px)}
.paiements span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--aube);box-shadow:0 0 10px var(--aube)}
@media (max-width:900px){.boutique{grid-template-columns:1fr;gap:20px;max-width:480px;margin-inline:auto}.offre-carte{min-height:430px}.offre-carte.vedette{order:-1;min-height:470px}}
@media (prefers-reduced-motion:reduce){.commander::after{animation:none}}
/* Volume picker (order page) */
.tomes-grille{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
@media (max-width:620px){.tomes-grille{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tome{position:relative;display:grid;gap:6px;cursor:pointer;font:500 .72rem/1.3 var(--f-ui);color:var(--brume)}
.tome input{position:absolute;opacity:0}
.tome img{aspect-ratio:3/4;width:100%;object-fit:cover;border-radius:6px;border:2px solid transparent;filter:grayscale(.6) brightness(.7);transition:.3s}
.tome input:checked+img{border-color:var(--aube);filter:none;box-shadow:0 0 0 3px rgba(235,187,104,.25)}
.tome input:focus-visible+img{outline:2px solid var(--aube);outline-offset:2px}
.tome input:checked~span{color:var(--aube)}

/* Floating buttons */
.flottants{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:55;display:grid;gap:10px;opacity:0;pointer-events:none;transition:opacity .45s ease}
.flottants.visible{opacity:1;pointer-events:auto}
.flot{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(18,22,37,.85);border:1px solid var(--ligne);color:var(--os);backdrop-filter:blur(8px);transition:transform .3s,border-color .3s,color .3s,opacity .4s}
.flot:hover{transform:translateY(-3px);border-color:var(--aube);color:var(--aube)}
#haut-page{opacity:0;pointer-events:none}
#haut-page.visible{opacity:1;pointer-events:auto}

.option .indispo{display:none;margin-top:6px;font:500 .8rem/1.4 var(--f-ui);color:var(--braise)}
.option.off{opacity:.5}
.option.off .indispo{display:block}
.commande-page .option input:disabled+span .nom{text-decoration:line-through;text-decoration-thickness:1px}

[hidden]{display:none!important}

/* ---- Telephone : cibles tactiles et lisibilite ---- */
@media (max-width:820px){
  .barre nav{gap:8px}
  .barre nav a{padding:10px 8px;display:inline-flex;align-items:center;min-height:44px}
  .barre .marque{padding-block:10px}
  .fil a,.fil span{display:inline-flex;align-items:center;min-height:36px}
  .pied-liens a{display:inline-flex;align-items:center;min-height:40px}
  .pied-liens p{font-size:.86rem}
  .faq summary,details summary{min-height:52px;display:flex;align-items:center}
  .precsuiv a,.suite-visite .liens a{min-height:64px}
  .vol .voix,.voix-vol,.label,.panneau .vols{font-size:.8rem}
  .seuil .signe,.hero .indice{font-size:.78rem}
  .oc-det,.oc-type{font-size:.92rem}
  .signature{font-size:.86rem}
  .som button{min-height:50px}
  /* Couloir des volumes : une carte entiere tient dans l'ecran. */
  .piste{padding-bottom:4vh}
  .vol p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .vol figure{aspect-ratio:3/3.4}
  .volumes .wrap>p.muted{margin-bottom:6px}
  .glisser{display:flex;align-items:center;gap:8px;font:500 .78rem/1 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--brume);margin:10px 0 2px}
  .glisser::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(235,187,104,.5),transparent)}
  /* Aucun texte sous 12,5 px sur un telephone. */
  .role,.vc-vols,.oc-badge,.fiche-vol dt,.etiquettes span,.precsuiv small,.suite-visite .liens span,small{font-size:.8rem}
  .voix-carte .role,.voix-carte .vc-vols,.carte-voix .role,.hero .indice{font-size:.8rem}
  .pied-liens li a,.bas a{min-height:40px;display:inline-flex;align-items:center}
  .corps-page .colonne a,.suite p a{line-height:2}
}

.cta-liseuse{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 26px}
.cta-liseuse span{font:400 .92rem/1.5 var(--f-ui);color:var(--brume);max-width:34ch}

/* ---- Liens vers les reseaux ---- */
.reseaux-pied{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.reseaux-pied .reseau{display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;opacity:.9;min-height:44px}
.reseaux-pied .reseau:hover{opacity:1;color:var(--or)}
.reseaux-pied .reseau svg{flex:none}
