/* ============================================================
   LE SOUFFLE VIVANT — Style commun v4
   Noir mordoré · Bleu nuit · Fraunces + Montserrat
   ============================================================ */
:root{
  --night:#050810;--deep:#0A0F1E;--mid:#111830;
  --gold:#E0B566;--gold2:#C68B36;
  --champagne:#F2E7C8;--sapphire:#3A7BD5;
  --cream:#EDE4D0;--soft:rgba(224,181,102,.82);
  --line:rgba(224,181,102,.14);--linen:rgba(237,228,208,.72);
  --cormorant:'Fraunces',serif;--mont:'Montserrat',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{font-family:var(--mont);font-weight:300;color:var(--cream);
  background:var(--night);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
::selection{background:var(--gold);color:var(--night)}

/* ===== PRÉCHARGEUR ===== */
#preloader{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:2rem;
  background:radial-gradient(ellipse 80% 60% at 50% 40%,#0D1428 0%,#060914 55%,#020408 100%);
  transition:opacity 1.2s ease,visibility 1.2s}
#preloader.done{opacity:0;visibility:hidden;pointer-events:none}
.pl-name{font-family:var(--cormorant);font-style:italic;font-weight:300;
  font-size:clamp(2.2rem,5vw,3.8rem);letter-spacing:.04em;
  background:linear-gradient(160deg,#F2E7C8,#E0B566 55%,#C68B36);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.pl-sub{font-size:.68rem;letter-spacing:.4em;text-transform:uppercase;color:var(--soft)}
.pl-track{width:min(280px,70vw);height:1px;background:rgba(224,181,102,.15)}
.pl-fill{height:100%;width:0%;background:linear-gradient(90deg,transparent,var(--gold),var(--champagne));
  box-shadow:0 0 12px rgba(224,181,102,.5);transition:width .12s ease}
.pl-num{font-size:.72rem;letter-spacing:.3em;color:var(--soft);font-weight:400}

/* ===== NAV ===== */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;
  justify-content:space-between;padding:1.6rem clamp(1.2rem,5vw,4rem);
  background:rgba(5,8,16,.55);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(224,181,102,.08)}
.logo{font-family:var(--cormorant);font-style:italic;font-size:1.35rem;color:var(--champagne);
  letter-spacing:.02em;transition:color .3s;cursor:pointer}
.logo:hover{color:var(--gold)}
.nlinks{display:flex;gap:.3rem;align-items:center}
.nlinks a{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(237,228,208,.65);transition:all .35s;padding:.55rem 1rem;
  position:relative;border:1px solid transparent;border-radius:2px;cursor:pointer}
.nlinks a:hover,.nlinks a.active{color:var(--champagne);
  border-color:rgba(224,181,102,.22);background:rgba(224,181,102,.06)}
.nav-right{display:flex;align-items:center;gap:1rem}
.sound-btn{display:flex;align-items:flex-end;gap:2.5px;height:14px;background:none;border:0;
  padding:0;cursor:pointer}
.sound-btn span{width:2.5px;border-radius:2px;background:var(--soft);
  animation:eq 1.2s ease-in-out infinite}
.sound-btn span:nth-child(1){height:6px}
.sound-btn span:nth-child(2){height:14px;animation-delay:.2s}
.sound-btn span:nth-child(3){height:9px;animation-delay:.4s}
.sound-btn.muted span{animation-play-state:paused;height:5px!important;opacity:.35}
@keyframes eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer}
.burger span{width:24px;height:1.5px;background:var(--cream);display:block}

/* ===== PAGES ===== */
.page{position:fixed;inset:0;opacity:0;visibility:hidden;pointer-events:none;overflow:hidden;z-index:1;
  transition:opacity .9s cubic-bezier(.22,.61,.36,1),visibility .9s}
.page.active{opacity:1;visibility:visible;pointer-events:all;z-index:2}
canvas.bg{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.page-inner{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:6rem clamp(1.5rem,6vw,5rem) 3rem;pointer-events:none}
.page-inner.left{align-items:flex-start;text-align:left;pointer-events:auto}
.page-inner.scroll{position:absolute;inset:0;overflow-y:auto;justify-content:flex-start;padding-top:7rem;
  pointer-events:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.page-inner.scroll::-webkit-scrollbar{width:3px}
.page-inner.scroll::-webkit-scrollbar-track{background:transparent}
.page-inner.scroll::-webkit-scrollbar-thumb{background:var(--line)}
.vignette{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 42%,rgba(5,8,16,.6) 100%)}
.page-inner.scroll ~ .vignette,.page-inner.scroll{}
.page #pg-pourqui .vignette,.page #pg-ateliers .vignette,
.page #pg-stages .vignette,.page #pg-participer .vignette{}
.content-wrap{position:relative}
.content-wrap::before{content:"";position:absolute;inset:-1.5rem -2rem;z-index:-1;
  background:radial-gradient(60% 55% at 50% 30%,rgba(5,8,16,.55),rgba(5,8,16,.18) 70%,transparent 100%)}

/* ===== TYPOGRAPHIE ===== */
.kicker{font-size:.67rem;letter-spacing:.44em;text-transform:uppercase;
  color:var(--soft);font-weight:400;display:block;margin-bottom:1.2rem}
.hero-title{font-family:var(--cormorant);font-style:italic;font-weight:300;
  font-size:clamp(3.2rem,9vw,7.5rem);line-height:1.02;
  background:linear-gradient(170deg,#F8EDD4 0%,#E0B566 48%,#C68B36 78%,#3A7BD5 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 80px rgba(224,181,102,.18);margin:.9rem 0 .7rem}
.hero-sub{font-family:var(--cormorant);font-style:italic;
  font-size:clamp(1.1rem,2vw,1.5rem);color:rgba(237,228,208,.88);margin-bottom:.8rem}
.hero-tag{font-size:clamp(.9rem,1.3vw,1.05rem);color:rgba(237,228,208,.58);
  max-width:36rem;line-height:1.8;margin-bottom:2rem}
.pg-title{font-family:var(--cormorant);font-weight:300;
  font-size:clamp(2rem,5vw,3.8rem);line-height:1.12;color:var(--champagne);
  margin-bottom:1.2rem}
.pg-title em{font-style:italic;color:var(--gold)}
.pg-sub{font-size:clamp(.92rem,1.3vw,1.05rem);color:var(--linen);
  max-width:42rem;line-height:1.82;margin-bottom:2rem}
.divider{width:1px;height:56px;background:linear-gradient(var(--gold),transparent);
  margin:0 auto 2rem}

/* ===== RESPIRATION ===== */
.breath-word{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:5;font-family:var(--cormorant);font-style:italic;
  font-size:clamp(2.4rem,5vw,4rem);color:var(--gold);
  text-shadow:0 0 50px rgba(224,181,102,.5);letter-spacing:.06em;
  opacity:0;transition:opacity .9s;pointer-events:none}
.breath-word.on{opacity:1}
.page-inner.breathing .hero-title,.page-inner.breathing .hero-sub,
.page-inner.breathing .hero-tag{opacity:.08!important;transition:opacity .9s}

/* ===== CONTENU PAGES ===== */
.content-wrap{max-width:820px;width:100%;margin:0 auto}
.forwho{display:grid;grid-template-columns:1fr 1fr;gap:.5rem 3rem;margin:1.5rem 0 2rem}
.forwho li{list-style:none;padding:.65rem 0;border-bottom:1px solid rgba(224,181,102,.08);
  color:var(--linen);font-size:.95rem;line-height:1.6;display:flex;gap:.8rem;align-items:flex-start}
.forwho li::before{content:"—";color:var(--gold);flex-shrink:0}
.atel-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin:1.5rem 0}
.atel-item{background:var(--night);padding:1.5rem 1.8rem;display:grid;
  grid-template-columns:auto 1fr;gap:1.2rem;align-items:start;transition:background .4s}
.atel-item:hover{background:#0D1428}
.atel-num{font-family:var(--cormorant);font-style:italic;color:var(--gold);font-size:1.4rem;line-height:1}
.atel-name{font-family:var(--cormorant);font-weight:300;font-size:1.3rem;color:var(--champagne);margin-bottom:.3rem}
.atel-desc{color:rgba(237,228,208,.6);font-size:.88rem;line-height:1.7}
.atel-tag{display:inline-block;margin-top:.6rem;font-size:.62rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--soft);border:1px solid var(--line);padding:.28rem .7rem}
.tarif-row{display:flex;justify-content:space-between;padding:.65rem 0;
  border-bottom:1px solid rgba(224,181,102,.08);font-size:.9rem}
.tarif-row:last-child{border-bottom:0}
.tarif-row span:first-child{color:var(--soft)}
.tarif-row span:last-child{color:var(--champagne)}
.stage-block{padding:1.6rem 0;border-bottom:1px solid var(--line)}
.stage-block:last-child{border-bottom:0}
.stage-label{font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--sapphire);margin-bottom:.4rem;display:block}
.stage-name{font-family:var(--cormorant);font-weight:300;font-size:1.4rem;
  color:var(--champagne);margin-bottom:.5rem}
.stage-desc{color:var(--linen);font-size:.9rem;line-height:1.72;margin-bottom:.5rem}
.stage-meta{font-size:.8rem;color:rgba(237,228,208,.4);margin-bottom:.4rem}
.stage-price{font-family:var(--cormorant);font-style:italic;color:var(--gold);font-size:1.1rem}
.cadre-list{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin:1.5rem 0}
.cadre-item{background:rgba(58,123,213,.05);border:1px solid rgba(58,123,213,.14);
  padding:.9rem 1rem;font-size:.88rem;color:var(--linen);line-height:1.6}
.cadre-item::before{content:"✦ ";color:var(--sapphire);font-size:.7rem}
.step-row{display:grid;grid-template-columns:2.2rem 1fr;gap:1rem;
  padding:1rem 0;border-top:1px solid var(--line)}
.step-row:last-child{border-bottom:1px solid var(--line)}
.step-n{font-family:var(--cormorant);font-style:italic;color:var(--gold);font-size:1.4rem;line-height:1.1}
.step-t{font-family:var(--cormorant);font-size:1.1rem;color:var(--champagne);margin-bottom:.2rem}
.step-d{font-size:.88rem;color:rgba(237,228,208,.6);line-height:1.65}
.warning-box{border:1px solid rgba(58,123,213,.2);background:rgba(58,123,213,.04);
  padding:1.2rem 1.5rem;margin:1.5rem 0}
.warning-box p{font-size:.85rem;color:rgba(237,228,208,.62);line-height:1.78}
.info-row{display:flex;justify-content:space-between;padding:.6rem 0;
  border-bottom:1px solid rgba(224,181,102,.08);font-size:.88rem}
.info-row:last-child{border-bottom:0}
.info-row span:first-child{color:var(--soft)}
.info-row span:last-child{color:var(--champagne)}
.fondatrice{border-left:2px solid var(--gold);background:rgba(224,181,102,.04);
  padding:1rem 1.4rem;margin:1rem 0;font-size:.92rem;color:var(--linen);line-height:1.75}
.sec-block{margin-bottom:2.4rem}
.sec-block h3{font-family:var(--cormorant);font-weight:300;font-size:1.5rem;
  color:var(--champagne);margin-bottom:.6rem}
h4.sub-head{font-family:var(--cormorant);font-weight:300;font-size:1.15rem;
  color:var(--gold);margin:1.2rem 0 .4rem}

/* ===== BOUTONS ===== */
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-top:1.6rem}
.btn{display:inline-block;font-family:var(--mont);font-weight:400;font-size:.68rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--cream);
  border:1px solid var(--soft);padding:.9rem 2.2rem;transition:all .4s;cursor:pointer}
.btn:hover{background:var(--gold);color:var(--night);border-color:var(--gold)}
.btn.blue{border-color:rgba(58,123,213,.5);color:rgba(140,180,240,.9)}
.btn.blue:hover{background:var(--sapphire);color:#fff;border-color:var(--sapphire)}
.btn.ghost{border-color:rgba(237,228,208,.28)}
.btn.ghost:hover{background:rgba(237,228,208,.08);color:var(--champagne)}

/* ===== FOOTER MINI ===== */
.page-footer{position:absolute;bottom:0;left:0;right:0;z-index:3;
  padding:.8rem clamp(1.2rem,5vw,4rem);
  display:flex;justify-content:space-between;align-items:center;
  background:rgba(5,8,16,.45);backdrop-filter:blur(8px);
  border-top:1px solid rgba(224,181,102,.08);font-size:.68rem;
  letter-spacing:.06em;color:rgba(237,228,208,.35)}
.page-footer a{color:rgba(237,228,208,.35);transition:color .3s}
.page-footer a:hover{color:var(--gold)}

/* ===== CURSEUR ===== */
#cursorfx{position:fixed;inset:0;pointer-events:none;z-index:9998}
.cursor-dot,.cursor-ring{position:fixed;border-radius:50%;pointer-events:none;
  z-index:9999;transform:translate(-50%,-50%)}
.cursor-dot{width:6px;height:6px;background:var(--gold);
  box-shadow:0 0 10px rgba(224,181,102,.8)}
.cursor-ring{width:32px;height:32px;border:1px solid rgba(224,181,102,.5);
  transition:width .35s cubic-bezier(.22,.61,.36,1),height .35s,border-color .35s,background .35s}
.cursor-ring.hover{width:54px;height:54px;border-color:var(--gold);background:rgba(224,181,102,.08)}
.cursor-ring.down{width:22px;height:22px}

/* ===== REVEAL ===== */
.rv{opacity:0;transform:translateY(24px);
  transition:opacity 1.1s cubic-bezier(.22,.61,.36,1),transform 1.1s cubic-bezier(.22,.61,.36,1)}
.rv.in{opacity:1;transform:none}

/* ===== SCROLL CUE ===== */
.scroll-cue{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--soft);display:flex;flex-direction:column;align-items:center;gap:.6rem;margin-top:1rem}
.scroll-cue::after{content:"";width:1px;height:38px;
  background:linear-gradient(var(--soft),transparent);
  animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.3;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}

/* BREATH BTN */
.breath-btn{pointer-events:auto;font-family:var(--mont);font-weight:400;font-size:.68rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--cream);background:transparent;
  border:1px solid var(--soft);padding:.8rem 1.8rem;border-radius:40px;
  cursor:pointer;transition:all .4s;margin-top:1rem}
.breath-btn:hover{background:var(--gold);color:var(--night);border-color:var(--gold)}

@media(max-width:820px){
  .nlinks{position:fixed;inset:0;background:rgba(5,8,16,.97);
    flex-direction:column;justify-content:center;align-items:center;gap:2.1rem;
    transform:translateX(100%);transition:transform .5s;z-index:99}
  .nlinks.open{transform:none}
  .nlinks a{font-family:'Cormorant Garamond',serif;font-style:italic;
    font-size:2rem;letter-spacing:.02em;text-transform:none;
    color:var(--cream);position:relative;padding:.1em 0}
  .nlinks a::after{content:'';position:absolute;left:50%;bottom:-.18em;
    width:0;height:1px;background:var(--champagne);
    transition:width .4s,left .4s;opacity:.9}
  .nlinks a:hover,.nlinks a.active{color:var(--champagne)}
  .nlinks a.active::after{width:1.6em;left:calc(50% - .8em)}
  .burger{display:flex;z-index:101}
  .forwho,.cadre-list{grid-template-columns:1fr}
  html,body{overflow:hidden}
}
@media(hover:hover) and (pointer:fine){
  body,a,button,.btn,.logo,.nlinks a,.breath-btn,.burger,.sound-btn{cursor:none!important}
}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}*{animation:none!important}}

/* ===== Voile de lisibilité — élégance haut de gamme ===== */
/* Halo doux derrière les grands titres : le texte se détache sans cacher le mouvement */
.hero-title,.hero-sub,.pg-title{
  text-shadow:0 2px 28px rgba(5,8,16,.85),0 1px 6px rgba(5,8,16,.7);}
.hero-tag{
  text-shadow:0 1px 18px rgba(5,8,16,.8);}

/* Le hero d'accueil : un halo radial très flou, invisible mais qui porte le texte */
.hero-inner{position:relative}
.hero-inner::before{content:'';position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);width:118%;height:150%;z-index:-1;
  background:radial-gradient(ellipse at center,
    rgba(5,8,16,.62) 0%,rgba(5,8,16,.34) 42%,transparent 72%);
  filter:blur(14px);pointer-events:none}

/* Les blocs de contenu deviennent des cartes de soie : voile satiné, bord doré ténu */
.sec-block{position:relative;background:linear-gradient(160deg,
    rgba(10,15,30,.58),rgba(5,8,16,.46));
  border:1px solid rgba(224,181,102,.16);border-radius:18px;
  padding:1.7rem 1.9rem;margin-bottom:1.9rem;
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  box-shadow:0 18px 50px -20px rgba(0,0,0,.7),
    inset 0 1px 0 rgba(242,231,200,.06)}
.sec-block h3{margin-top:0}

/* Filet doré en haut de chaque carte — touche luxe discrète */
.sec-block::before{content:'';position:absolute;left:1.9rem;top:0;
  width:42px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}

/* La liste "Pour qui" : ses lignes respirent sur un léger fond satiné */
.forwho{background:linear-gradient(160deg,rgba(10,15,30,.4),rgba(5,8,16,.3));
  border-radius:16px;padding:1.4rem 1.7rem;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(224,181,102,.1)}

/* Les puces "cadre" : un voile plus présent pour bien lire chaque garantie */
.cadre-item{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}

/* Le halo du hero s'efface aussi pendant la respiration (cohérence avec le texte) */
.page-inner.breathing .hero-inner::before{opacity:0;transition:opacity .9s}