.journey-section{height:4200svh;position:relative;isolation:isolate;background:var(--paper,#f0f1fa);--journey-zoom:0;--journey-copy-opacity:1;--journey-editorial-y:0px}
.journey-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--paper,#f0f1fa)}
.journey-slow-hint{display:none}
.journey-entry-background{display:none}
@media(min-width:813px){
  .journey-slow-hint{position:absolute;z-index:5;left:50%;bottom:clamp(28px,4.5vh,64px);display:flex;align-items:center;gap:.8em;white-space:nowrap;font-size:clamp(12px,1vw,26px);font-weight:400;line-height:1;letter-spacing:.065em;color:#16191b;opacity:0;visibility:hidden;transform:translate(-50%,8px);pointer-events:none;transition:opacity .45s ease,transform .45s ease,color .25s ease,visibility 0s .45s}
  .journey-slow-hint-mouse{display:block;flex:none;width:1.5em;height:2em}
  /* Pulse the contents together; the container retains its entry/exit fade. */
  .journey-slow-hint>*{animation:journey-slow-hint-breathe 3s ease-in-out infinite;animation-play-state:paused}
  .journey-section[data-dark=true] .journey-slow-hint{color:#fff;text-shadow:0 1px 2px #000,0 0 8px #000c}
  .journey-section[data-dark=true] .journey-slow-hint-mouse{filter:drop-shadow(0 1px 2px #000)}
  .journey-section[data-slow-hint-visible=true] .journey-slow-hint{opacity:.88;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
  .journey-section[data-slow-hint-visible=true] .journey-slow-hint>*{animation-play-state:running}
  /* Shorten only the final waiting span; earlier phase distances stay fixed. */
  .journey-section{height:4050svh}
  /* This surface sits below the global pointer field; the device and type
   * retain their own foreground layers above that field. */
  .journey-entry-background{display:block;position:absolute;left:0;width:100%;height:0;z-index:0;pointer-events:none;background-color:#000;background-image:linear-gradient(to bottom,var(--paper,#f0f1fa) 0%,#e9eaf3 10%,#d7d8e0 20%,#bcbdc4 30%,#9c9ca2 40%,#78797d 50%,#545558 60%,#343436 70%,#19191a 80%,#070707 90%,#000 100%);background-size:100% var(--journey-gradient-height,0px);background-repeat:no-repeat}
  .journey-section[data-contact-backdrop=true] .journey-stage{position:fixed;inset:0;width:100%;pointer-events:none}
  .homepage-dom-ready .journey-section[data-contact-backdrop=true]+.contact-section{background:transparent;z-index:3}
  .homepage-dom-ready:not(.dom-motion-reduced) .journey-section[data-ready=true]:not([data-fallback=true])+.contact-section{background:transparent;z-index:3}
}
@keyframes journey-slow-hint-breathe{0%,100%{opacity:1}50%{opacity:.25}}
.journey-editorial{position:absolute;inset:0;z-index:1;transform:translateY(var(--journey-editorial-y));opacity:var(--journey-copy-opacity);will-change:transform,opacity;pointer-events:none}
.journey-title{position:absolute;top:16vh;left:var(--pad,5vw);right:var(--pad,5vw);font-size:7.25vw;line-height:1.02;letter-spacing:-.045em;font-weight:400;color:#050505;z-index:2}
.journey-copy{position:absolute;left:58.7%;right:7.5%;top:max(41vh,calc(24vh + 21vw));font-size:clamp(17px,min(1.9vw,2.7vh),32px);line-height:1.4;letter-spacing:-.022em;z-index:2}
.journey-copy p+p{margin-top:1.1em}
.journey-ribbon{position:absolute;left:32%;top:-10vh;width:72vw;height:74vw;border:4.3vw solid #57e7ed;border-radius:44% 49% 42% 47%;transform:rotate(21deg);z-index:0}
.journey-viewport{position:absolute;z-index:3;left:5vw;top:max(46vh,calc(26vh + 22.2vw));width:46vw;height:32.65vw;overflow:visible;will-change:left,top,width,height}
.journey-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;background:#020508;border-radius:calc(22px * (1 - var(--journey-zoom)));overflow:hidden;outline:none}
.journey-tablet-frame{position:absolute;inset:-14px;z-index:4;border:14px solid #080a0b;border-radius:calc(34px * (1 - var(--journey-zoom)));box-shadow:0 0 0 2px #555759,0 0 0 4px #bbbcc1,0 8px 30px #1112;pointer-events:none;opacity:calc(1 - var(--journey-zoom));will-change:opacity}
.journey-tablet-frame:after{content:'';position:absolute;inset:-10px;border:1px solid #8a8b8e;border-radius:27px;opacity:.8}
.journey-camera-dot{position:absolute;left:-9px;top:42%;height:7px;width:7px;border-radius:50%;background:#020304;box-shadow:0 24px 0 #020304,0 43px 0 #020304}
.journey-caption{position:absolute;bottom:24px;left:var(--pad,5vw);right:var(--pad,5vw);display:flex;justify-content:space-between;align-items:center;z-index:5;font-family:Mono,monospace;font-size:10px;letter-spacing:.06em;color:#30313a;opacity:var(--journey-caption-opacity,0);pointer-events:none}
.journey-section[data-dark=true] .journey-caption{color:#d7f4f4}
.journey-fallback{position:absolute;inset:0;z-index:2;background:#010506 url('./assets/journey/earth_landscape.jpg') center/cover;border-radius:22px;display:flex;align-items:center;justify-content:center;color:white;font-size:clamp(24px,3vw,52px);opacity:1;transition:opacity .4s;pointer-events:none}
.journey-section[data-ready=true] .journey-fallback{opacity:0}
.journey-section[data-fallback=true] .journey-fallback{opacity:1}
.journey-section[data-fallback=true] .journey-canvas{opacity:0}
@media(min-width:1800px){.journey-title{font-size:6.3vw}.journey-copy{font-size:1.45vw;top:55vh}.journey-viewport{top:58vh}}
@media(max-width:900px){.journey-title{font-size:8.8vw;top:19vh}.journey-copy{left:57%;right:5%;top:57vh;font-size:18px}.journey-viewport{top:65vh;width:45vw;height:32vw}.journey-ribbon{left:22%;width:88vw;height:94vw;border-width:5vw}}
@media(max-width:600px){.journey-section{height:1500svh}.journey-title{top:15vh;font-size:10.1vw;line-height:1.07;left:20px;right:16px}.journey-copy{top:42vh;left:20px;right:20px;font-size:17px;line-height:1.43;max-width:450px}.journey-copy p+p{margin-top:.9em}.journey-viewport{left:6vw;top:77vh;width:88vw;height:62.5vw}.journey-tablet-frame{border-width:10px;inset:-10px;border-radius:26px}.journey-camera-dot{left:-7px;height:5px;width:5px}.journey-title br:nth-of-type(1){display:none}.journey-ribbon{left:23%;top:2vh;width:120vw;height:180vw;border-width:7vw}.journey-caption{font-size:9px;bottom:18px}}
@media(prefers-reduced-motion:reduce){.journey-section{height:500svh}.journey-viewport,.journey-editorial,.journey-tablet-frame{will-change:auto}.journey-fallback{transition:none}.journey-slow-hint{display:none}}

.journey-tunnel-title{position:absolute;top:50%;left:5%;width:90%;z-index:4;text-align:center;font-size:6vw;line-height:1.12;font-weight:400;letter-spacing:-.015em;color:#fff;text-transform:uppercase;pointer-events:none;transform-origin:50% 50%;visibility:hidden}
.journey-tunnel-title-line{position:relative;white-space:nowrap}
.journey-tunnel-title-line span{display:inline-block;position:relative;margin:0 .25ch}
@media(max-width:600px){.journey-tunnel-title{font-size:6.7vw;left:4%;width:92%}}
.journey-section[data-ready=true]:not([data-fallback=true]) .journey-tablet-frame{opacity:0}

@media(min-width:601px){.journey-editorial{z-index:4}}

/* GoalSection desktop typography and grid from the reference stylesheet. */
@media(min-width:813px){
  /* Source .section top padding plus #home-goal-title's 2.2em margin.
   * em follows the title's 8vw / 21:9 5.3vw size; its JS scroll transform
   * remains independent of this document-layout baseline. */
  .journey-title{top:calc(var(--desktop-section-padding-y,clamp(30px,4vw,50px)) + 2.2em);left:calc(max(5vw,40px) - .068em);right:auto;width:11em;font-size:8vw;line-height:1;letter-spacing:-.01em;color:#000}
  .journey-editorial-title-line{position:relative;overflow:hidden}
  .journey-editorial-title-word{display:inline-block;position:relative;bottom:.135em;will-change:transform}
  .journey-copy{left:58.6666666667%;right:12.6666666667%;font-size:clamp(1.3125rem,1.5vw,3rem);line-height:1.4;letter-spacing:normal;color:#000}
  .journey-copy p+p{margin-top:1em}
  .journey-tunnel-title{line-height:1.15;letter-spacing:normal}
}
@media(min-width:813px) and (min-aspect-ratio:21/9){
  .journey-title{left:calc(max(6vw,60px) - .068em);font-size:5.3vw}
  .journey-copy{left:58.5%;right:21%;font-size:clamp(.7875rem,1.5vw,1.8rem)}
}
@media(min-width:813px){
  .journey-section,.journey-stage,.journey-canvas{background:transparent}
  .journey-title{color:#fff}
  .journey-copy{color:#f0f1fa}
  .journey-section[data-fullscreen-entry=true] .journey-tablet-frame{display:none}
  .journey-section[data-fullscreen-entry=true] .journey-fallback{border-radius:0}
}

/* Failed WebGL/resources retain the existing image as an ordinary section,
 * rather than leaving dozens of empty cinematic scroll screens. Recovery
 * removes this attribute and restores the original responsive timeline. */
.journey-section[data-fallback=true]{height:100svh;background:#010506}
.journey-section[data-fallback=true] .journey-stage{position:relative;background:#010506}
.journey-section[data-fallback=true] .journey-fallback{border-radius:0}
.journey-section[data-fallback=true] .journey-editorial,
.journey-section[data-fallback=true] .journey-tablet-frame,
.journey-section[data-fallback=true] .journey-tunnel-title{display:none}
