/* Trois univers, dans le défilement naturel de la page. */
.hero-scroll,.hero-theatre{display:contents}
.stage-stack{height:calc(100% - 76px);position:relative;isolation:isolate}
.stage-stack>.stage{position:absolute;inset:0;height:100%;width:100%;will-change:clip-path}
.stage-stack>.stage[aria-hidden=true]{pointer-events:none}
.hero-scroll-ready .journey{height:230svh;min-height:0}
.hero-scroll-ready .hero{height:100svh;min-height:620px}
.hero-scroll-ready .stage-wrap{top:calc(21% - var(--scroll)*13%);height:calc(61% + var(--scroll)*14%)}
.hero-scroll-ready .worlds{opacity:1;transform:none;bottom:6%;left:calc(7% + var(--scroll)*1%);right:8%;gap:24px}
.hero-scroll-ready .world-label{font-size:11px;max-width:185px;line-height:1.5;letter-spacing:1px}
.hero-scroll-ready .world{flex:1;max-width:190px;position:relative;border-top-color:#ffffff20}
.hero-scroll-ready .world:before{content:'';position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--red);transform:scaleX(var(--chapter,0));transform-origin:left}
.hero-scroll-ready .expanded-caption{bottom:2.5%;font-size:11px;letter-spacing:1px;opacity:clamp(0,calc(var(--scroll)*3 - 2),1)}
.hero-scroll-ready .expanded-caption a{font-size:12px}
.hero-scroll-ready .scroll-cue{bottom:3%;font-size:11px}
.hero-scroll-ready .stage-bottom{flex-wrap:nowrap}
.hero-scroll-ready .stage-bottom>span{max-width:none}
.hero-scroll-ready .stage-stack .scan{display:none}
.hero-scroll-ready .stage-stack>.stage{transition:transform 1.8s var(--ease);background:#141510}
.hero-scroll-ready .stage-stack>.stage[data-world=architecture]{background:#191a17}
.hero-scroll-ready .stage-stack>.stage[data-world=commerce]{background:#161412}
@media(max-width:1100px){.hero-scroll-ready .world-label{display:none}}
@media(max-width:900px){
 .hero-scroll-ready .journey{height:auto}
 .hero-scroll-ready .hero{height:auto;min-height:0;overflow:visible;padding-bottom:0;display:block}
 .hero-scroll-ready .ambient{display:none}
 .hero-scroll-ready .hero-scroll{display:block;position:relative;height:150svh;margin-top:36px}
 .hero-scroll-ready .hero-theatre{display:flex;position:sticky;top:20px;height:auto;min-height:0;flex-direction:column;justify-content:flex-start;padding:12px 0 24px}
 .hero-scroll-ready .stage-wrap{position:relative;left:auto;top:auto;width:100%;height:auto;margin:0;order:2}
 .hero-scroll-ready .stage-stack{height:auto;aspect-ratio:1.24;max-height:60svh}
 .hero-scroll-ready .stage-stack>.stage{aspect-ratio:auto}
 .hero-scroll-ready .stage-caption{font-size:11px}
 .hero-scroll-ready .stage-bottom{font-size:11px;gap:8px;letter-spacing:0}
 .hero-scroll-ready .worlds{position:relative;left:auto;right:auto;bottom:auto;order:1;margin:0 0 24px;gap:14px;display:grid}
 .hero-scroll-ready .world{font-size:14px;max-width:none;min-height:44px}
 .hero-scroll-ready .world span{font-size:11px}
 .hero-scroll-ready .scroll-cue{display:none}
 .hero-scroll-ready .expanded-caption{display:flex;position:relative;left:auto;right:auto;bottom:auto;order:3;opacity:1;margin-top:22px;gap:15px;align-items:center;font-size:11px;letter-spacing:.3px}
 .hero-scroll-ready .expanded-caption a{font-size:11px;white-space:nowrap}
 .hero-scroll-ready .expanded-caption a span{margin-left:8px}
}
@media(max-width:380px){.hero-scroll-ready .stage-bottom>span{max-width:140px}.hero-scroll-ready .worlds{gap:10px}.hero-scroll-ready .world{font-size:13px}.hero-scroll-ready .expanded-caption{font-size:11px;letter-spacing:0;flex-wrap:wrap;gap:8px}.hero-scroll-ready .expanded-caption a{font-size:11px}}
@media(prefers-reduced-motion:reduce){
 .hero-scroll-ready .journey{height:auto;min-height:0}
 .hero-scroll-ready .hero{position:relative}
 .hero-scroll-ready .hero-scroll{height:auto}
 .hero-scroll-ready .hero-theatre{position:relative;top:auto;height:auto;min-height:0;padding-bottom:35px}
 .hero-scroll-ready .stage-stack>.stage{translate:none!important}
 .hero-scroll-ready .expanded-caption{opacity:1}
}

/* Le texte et les sélecteurs partagent le flux : leur séparation ne dépend plus
   de deux positions absolues indépendantes. La scène reste superposée à droite. */
@media(min-width:901px){
 .hero-scroll-ready .hero{display:grid;grid-template-columns:46% 1fr;grid-template-rows:1fr auto;align-items:center;gap:28px 24px;padding:110px 7% 44px;height:auto;min-height:100svh}
 .hero-scroll-ready .hero-copy{position:relative;top:auto;left:auto;grid-column:1;grid-row:1;align-self:center}
 .hero-scroll-ready .worlds{position:relative;left:auto;right:auto;bottom:auto;grid-column:1/-1;grid-row:2;align-self:end}
}
.hero-scroll-ready .hero-copy .fine{font-size:13px;max-width:440px}
@media(max-height:680px) and (min-width:901px){.hero-scroll-ready .hero{padding-top:100px}.hero-scroll-ready .hero h1.signature-title{font-size:60px}.hero-scroll-ready .hero-copy .lede{font-size:15px;margin:20px 0}.hero-scroll-ready .hero-copy .primary{padding:13px 19px}}
