/* One viewport contains the character, the wordmark, then the strategy opening. */
.social-journey { height:auto; background:#131312; }
.journey-sticky { position:relative; }
.journey-room, .brand-portal { display:none; pointer-events:none; }
.social-journey .social-stage { position:relative; height:100vh; height:100dvh; min-height:0; max-height:none; }
.brand-interlude, .strategy-stage { position:relative; min-height:100vh; min-height:100dvh; overflow:hidden; }
.brand-interlude { display:grid; place-items:center; background:transparent; }
.brand-wordmark { position:relative; width:min(90vw,280dvh); aspect-ratio:3214 / 929; transform-origin:97.4331% 64.9085%; }
.brand-wordmark svg { display:block; width:100%; height:100%; overflow:visible; }
.brand-zoom { display:none; position:absolute; inset:0; width:100%; height:100%; overflow:hidden; pointer-events:none; }
.strategy-stage { display:flex; flex-direction:column; justify-content:center; gap:clamp(38px,8vh,96px); background:#171717; padding:clamp(36px,7vh,100px) var(--pad); }
.strategy-stage .section-top { flex:none; }
.strategy-stage .services-heading { margin:0; display:block; }
.strategy-stage .services-heading h2 { font-size:clamp(52px,7.4vw,140px); line-height:1.02; max-width:15ch; margin:0 0 36px; }
.strategy-stage .services-heading p { margin:0; font-size:clamp(16px,1.35vw,23px); line-height:1.55; max-width:43ch; }
.strategy-stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at center,#ff572815,transparent 68%); opacity:var(--portal-warmth,0); }
.social-journey + .services { padding-top:clamp(24px,4vh,56px); }

@media (prefers-reduced-motion:no-preference) {
  .journey-enhanced { height:var(--journey-height,610dvh); }
  .journey-enhanced .journey-sticky { position:sticky; top:0; height:100vh; height:100dvh; overflow:hidden; isolation:isolate; }
  /* Continue the empty right side of the approved studio across both scenes.
     The source stays at the character's exact vertical scale and floor level. */
  .journey-enhanced .journey-room { display:block; position:absolute; inset:0 -12% 0 0; z-index:0; background:#131312; }
  .journey-enhanced .journey-room::before { content:""; position:absolute; left:0; right:0; top:var(--room-art-top,0px); height:var(--room-art-height,90%); background:url("assets/seedance-25/desktop/frame-0001.webp") right top / 300% 100% no-repeat; mask-image:linear-gradient(#000 88%,transparent); }
  .journey-enhanced .social-stage,
  .journey-enhanced .brand-interlude,
  .journey-enhanced .strategy-stage { position:absolute; inset:0; width:100%; height:100%; min-height:0; max-height:none; }
  .journey-enhanced .social-stage { z-index:1; background:transparent; mask-image:linear-gradient(to right,#000 70%,rgb(0 0 0 / var(--edge-middle,1)) 87%,rgb(0 0 0 / var(--edge-alpha,1)) 100%); }
  .journey-enhanced .social-stage .scene-light { display:none; }
  .journey-enhanced .brand-interlude { z-index:2; transform:translate3d(100%,0,0); }
  .journey-enhanced .brand-portal { display:block; position:absolute; width:200px; height:200px; left:0; top:0; border-radius:50%; z-index:3; background:linear-gradient(115deg,#ff4b32,#ff7045); opacity:0; transform-origin:center; }
  .journey-enhanced .strategy-stage { z-index:4; clip-path:circle(0 at 50% 50%); visibility:hidden; }
  .journey-enhanced.journey-near :is(.social-stage,.brand-interlude,.journey-room,.brand-portal) { will-change:transform; }
  .journey-enhanced.wordmark-moving .brand-wordmark { will-change:transform,opacity; }
}
@media (max-width:700px) {
  .journey-enhanced .journey-room::before { mask-image:linear-gradient(transparent,#000 10%,#000 88%,transparent); }
  .strategy-stage { gap:42px; }
  .strategy-stage .services-heading h2 { font-size:clamp(45px,10.6vw,72px); margin-bottom:28px; }
  .strategy-stage .services-heading p br { display:none; }
  .brand-wordmark { width:90vw; }
}
@media (max-height:560px) and (min-width:701px) {
  .journey-enhanced .journey-room::before { mask-image:linear-gradient(transparent,#000 10%,#000 88%,transparent); }
  .strategy-stage { gap:24px; padding-top:28px; padding-bottom:28px; }
  .strategy-stage .services-heading h2 { font-size:clamp(46px,10vh,70px); margin-bottom:20px; }
  .strategy-stage .services-heading p br { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .social-journey, .journey-sticky { height:auto!important; }
  .social-journey .social-stage { height:auto; min-height:0; }
  .brand-interlude, .strategy-stage { transform:none!important; border-radius:0!important; }
  .brand-wordmark { opacity:1!important; filter:none!important; transform:none!important; }
}
