/* BloomX Méthode: scroll-driven 3D acquisition funnel (engine.js, from web-concepts/v3/moteur).
   Low-chroma blue (--traffic) = raw traffic; bright ice (--gold token) = qualified, booked, value. Classes prefixed m-. */
.methode main{position:relative;z-index:5;overflow-x:clip}
.methode .site-footer{position:relative;z-index:6;background:var(--black)}
#engine{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;background:#000}
.m-poster{position:fixed;inset:0;z-index:0;display:none;background:radial-gradient(40% 40% at 64% 46%,rgba(212,255,58,.18),transparent 70%),radial-gradient(40% 30% at 30% 50%,rgba(142,145,150,.14),transparent 70%),#000}
.no-webgl #engine{display:none}
.no-webgl .m-poster{display:block}
.m-veil{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 80% at 50% 50%,transparent 55%,rgba(0,0,0,.65) 100%),linear-gradient(180deg,rgba(0,0,0,.55) 0,transparent 18%,transparent 62%,rgba(0,0,0,.7) 100%)}
#tags{position:fixed;inset:0;z-index:3;pointer-events:none;overflow:hidden}
#tags [data-at]{position:absolute;left:0;top:0;opacity:0;will-change:transform,opacity;white-space:nowrap;font:500 12px/1 var(--font-head);letter-spacing:.02em;color:var(--traffic);font-variant-numeric:tabular-nums}
#tags .t-ring::before,#tags .t-val::before{content:"";position:absolute;left:-14px;top:50%;width:8px;height:1px;background:currentColor;opacity:.7}
#tags .t-val{color:var(--gold-hi)}
#tags .t-struck{font:600 clamp(18px,1.8vw,26px)/1 var(--font-head);color:var(--grey);text-decoration:line-through;text-decoration-color:rgba(142,145,150,.8);text-decoration-thickness:2px;letter-spacing:-.01em}
#tags .t-swap{font:600 clamp(16px,1.5vw,22px)/1 var(--font-head);color:var(--gold-hi);letter-spacing:-.01em}
#tags .t-slot{font:600 13px/1 var(--font-head);color:#000000;background:var(--accent);padding:7px 10px;border-radius:3px}
.m-rail{position:fixed;left:var(--gutter);top:50%;transform:translateY(-50%);z-index:30;opacity:0;transition:opacity .5s;pointer-events:none}
.m-rail.is-on{opacity:1;pointer-events:auto}
.m-rail:not(.is-on){visibility:hidden;transition:opacity .5s,visibility 0s .5s} /* hidden rail links stay out of the tab order */
.m-rail.is-on.is-dim{opacity:.5}
@media (max-width:1359px){.m-rail{display:none}}
.m-rail ol{display:grid;gap:2px;position:relative;padding-left:18px;list-style:none;margin:0}
.m-rail ol::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:1px;background:var(--line)}
.m-rail-fill{position:absolute;left:0;top:8px;width:1px;height:calc(100% - 16px);background:var(--accent);transform-origin:top;transform:scaleY(var(--rp,0))}
.m-rail a{display:flex;gap:10px;align-items:baseline;text-decoration:none;color:var(--grey);font:500 13px/1 var(--font-head);padding:8px 0;min-height:32px;transition:color .3s}
.m-rail a span{font:400 11px/1 var(--font-mono)}
.m-rail a[aria-current=step],.m-rail a:hover{color:var(--bone)}
.m-rail a[aria-current=step] span{color:var(--accent-light)}
/* hero = the shared inner-page hero (.page-hero, contact look) sitting over the engine; .m-hero only tunes it here */
.m-hero.page-hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;border-bottom:0;background:none}
.m-hero.page-hero > .wrap{width:100%}
.m-hero .page-hero-foot .lead{color:var(--platinum)}
.m-hero .page-title{font-size:clamp(56px,min(9.5vw,15svh),150px)}
.m-chapter{min-height:130vh;display:flex;align-items:center;padding:0 var(--gutter)}
.m-panel{position:relative;max-width:min(600px,44vw);margin-left:clamp(120px,14vw,220px)}
.m-chapter.right .m-panel{margin-left:auto;margin-right:0}
.m-panel::before{content:"";position:absolute;inset:-18% -30%;z-index:-1;background:radial-gradient(closest-side,rgba(0,0,0,.72),rgba(0,0,0,.4) 60%,transparent);pointer-events:none}
.m-stage{font:400 12px/1 var(--font-mono);color:var(--grey);display:flex;gap:12px;align-items:center}
.m-stage b{color:var(--accent-light);font-weight:500}
.m-stage::after{content:"";height:1px;width:64px;background:var(--line)}
.m-verb{font:700 calc(clamp(88px,10.8vw,186px) * .58)/0.95 var(--font-head);letter-spacing:-.035em;margin:18px 0 22px -.04em;color:var(--bone)}
.m-say{font:600 clamp(21px,1.9vw,28px)/1.22 var(--font-head);letter-spacing:-.02em;max-width:26ch}
.m-more{margin-top:16px;color:var(--grey);max-width:46ch;font-size:16px}
.m-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;list-style:none;padding:0}
.m-chips li{font:500 13px/1 var(--font-head);border:1px solid rgba(142,145,150,.3);color:var(--traffic);padding:9px 12px;border-radius:2px;background:rgba(0,0,0,.35)}
.m-solid{background:var(--black);position:relative;z-index:6}
.m-solid::before{content:"";position:absolute;left:0;right:0;top:-30vh;height:30vh;background:linear-gradient(transparent,#000);pointer-events:none}
.m-finale{min-height:120vh;display:flex;align-items:flex-end;padding:30vh 0 8vh}
.m-finale .book{border-top:0;background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(201,204,209,.35);border-radius:8px;padding:clamp(24px,3vw,48px)}
@media (max-width:820px){
  .m-rail{display:none}
  .m-chapter{min-height:120vh;align-items:flex-end;padding:0 16px 14vh}
  .m-panel,.m-chapter.right .m-panel{max-width:none;margin:0;width:100%;background:linear-gradient(180deg,transparent,rgba(0,0,0,.78) 22%);padding-top:40px}
  .m-verb{font-size:clamp(68px,21vw,120px);margin:14px 0}
  #tags .t-swap,#tags .t-ring,#tags .t-val,#tags .t-struck{display:none}
  .m-finale{padding:40vh 0 8vh}
}