/* Voyage: one full-width landscape, with separate depths and a continuous road. */
.voyage-stage{--hill-back:#a8cce8;--hill-front:#8fbdb9;--ground-color:#dce8c5;--near-color:#82b9a5}
.voyage-landscape,.voyage-sky,.voyage-distant,.voyage-landmarks{position:absolute;inset:0;pointer-events:none}
.voyage-sky{width:180%;height:100%;will-change:transform}
.voyage-sky>svg{width:100%;height:100%}
.voyage-sun{position:absolute;left:48%;top:12%;width:85px;height:85px;border-radius:50%;background:#fff3ca;box-shadow:0 0 0 15px #fff3ca20}
.voyage-distant{width:290%;height:88%;will-change:transform}
.voyage-distant svg{width:100%;height:100%}
.voyage-landmarks{z-index:3;will-change:transform}
.world-destination{position:absolute;left:calc(var(--destination)*100% + 45%);width:52%;height:75%;bottom:17%;display:flex;flex-direction:column;align-items:center}
.world-destination-label{display:block;text-align:center;font-size:11px;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:var(--scene-ink);padding:8px 0;flex:none}
.landmark-illustration{width:100%;height:100%;min-height:0}
.landmark-illustration>svg{display:block;width:100%;height:100%;overflow:visible}
.voyage-ground{position:absolute;top:78%;height:22%;left:0;right:0;background:var(--ground-color);z-index:2}
.voyage-ground:before{content:'';position:absolute;top:0;left:0;right:0;height:6px;background:#ffffff27}
.voyage-road{position:absolute;top:34%;height:35%;left:0;right:0;background:#163952;border-top:4px solid #fff6d966;border-bottom:4px solid #fff6d966}
.voyage-road-marks{position:absolute;left:0;top:50%;height:3px;width:400%;background:repeating-linear-gradient(to right,#d9e4e9 0 30px,transparent 30px 68px);will-change:transform}
.voyage-foreground{position:absolute;left:0;bottom:-15px;width:300%;height:13%;z-index:4;will-change:transform}
.voyage-foreground svg{height:100%;width:100%}
.voyage-vehicle{position:absolute;bottom:7.6%;left:8%;width:240px;z-index:6;will-change:transform}
.voyage-vehicle svg{width:100%;height:auto;overflow:visible}
.voyage-wheel{fill:#102a43;stroke:#c7d9e3;stroke-width:3}
.voyage-reading-scrim{position:absolute;inset:0 auto auto 0;width:48%;height:83%;z-index:5;background:linear-gradient(to right,var(--scene-bg) 77%,transparent);mask-image:linear-gradient(to bottom,black 88%,transparent);pointer-events:none}
.voyage-stage .story-inner{z-index:7;pointer-events:none;grid-template-columns:42% 1fr;padding:35px 5% 175px}
.voyage-stage .chapter-copy:not([inert]){pointer-events:auto}
.voyage-stage .story-bottom{justify-content:flex-end;gap:27px;bottom:18px}
.voyage-stage .scroll-invitation{display:none}
.voyage-stage .chapter-copy :is(h1,h2){font-size:clamp(48px,5.15vw,82px);line-height:1.02}
.voyage-stage .hero-description{font-size:17px;max-width:420px}
.voyage-stage .chapter-insight{max-width:400px}
.landmark-leaf{transform-box:fill-box;transform-origin:50% 100%;animation:landmark-sway 7s ease-in-out infinite;animation-play-state:paused}
.landmark-leaf:nth-child(even){animation-delay:-3.5s}
.landmark-signal{animation:landmark-glow 4s ease-in-out infinite;animation-play-state:paused}
.is-settled .landmark-leaf,.is-settled .landmark-signal{animation-play-state:running}
.landmark-step{transform-box:fill-box;transform-origin:center;animation:landmark-step 10s linear infinite;animation-play-state:paused}
.landmark-step[data-step="1"]{animation-delay:2s}.landmark-step[data-step="2"]{animation-delay:4s}.landmark-step[data-step="3"]{animation-delay:6s}.landmark-step[data-step="4"]{animation-delay:8s}
.is-settled .landmark-step{animation-play-state:running}
@keyframes landmark-sway{50%{transform:rotate(2deg)}}
@keyframes landmark-glow{50%{opacity:.35}}
@keyframes landmark-step{0%,15%{filter:drop-shadow(0 0 5px #fff9);transform:translateY(-3px)}20%,100%{filter:none;transform:none}}
body[data-version=voyage] .framework-grid{grid-template-columns:1fr 1fr;gap:90px 120px;max-width:1060px;margin:0 auto;padding:30px 60px 70px}
body[data-version=voyage] .framework-grid:before{inset:-60px 0 -30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1250'%3E%3Cpath d='M680 0C1070 210 1010 405 550 395S-20 710 530 740 1000 1000 470 1190' fill='none' stroke='%23eee7d4' stroke-width='70'/%3E%3Cpath d='M680 0C1070 210 1010 405 550 395S-20 710 530 740 1000 1000 470 1190' fill='none' stroke='%23c7bb99' stroke-width='3' stroke-dasharray='14 16'/%3E%3C/svg%3E") center/100% 100% no-repeat}
body[data-version=voyage] .framework-card{padding:30px;border-radius:30px;min-height:325px;box-shadow:0 16px 26px #102a4310}
body[data-version=voyage] .framework-card:nth-child(even){transform:translateY(70px) rotate(3deg)}
body[data-version=voyage] .framework-card:last-child{grid-column:1 / -1;width:48%;justify-self:center}
body[data-version=voyage] .framework-card h3{font-size:31px}
body[data-version=voyage] .framework-card .capability{font-size:12px}
.scenic-static{height:100%;border-radius:30px;background:linear-gradient(transparent 82%,var(--static-ground) 82%);padding:5% 0 0}
.voyage-flow .flow-art{aspect-ratio:760 / 580}

/* Play Stack: the panels scroll, while the same three capsules reshape between them. */
.play-story{position:relative;isolation:isolate;overflow:clip;background:#e7f2ff}
.play-chapter{position:relative;padding:90px 6%;background:var(--scene-bg);color:var(--scene-ink);border-radius:48px 48px 0 0;min-height:max(790px,var(--stage-h))}
.play-chapter:first-child{border-radius:0}
.play-chapter:nth-child(2){box-shadow:0 -48px 0 #e7f2ff}
.play-chapter:nth-child(3){box-shadow:0 -48px 0 #245ddd}
.play-chapter:nth-child(4){box-shadow:0 -48px 0 #fff0c5}
.play-inner{display:grid;grid-template-columns:42% 54%;gap:4%;align-items:center;max-width:1460px;min-height:580px;margin:auto}
.play-chapter .chapter-copy{position:relative;inset:auto;opacity:1;height:auto;pointer-events:auto;z-index:3;will-change:auto}
.play-chapter .chapter-copy :is(h1,h2){font-size:clamp(48px,5.35vw,84px);line-height:1.02;letter-spacing:-.05em;margin:24px 0 28px}
.play-chapter .hero-description{font-size:18px;line-height:1.7;max-width:420px}
.play-chapter .chapter-insight{font-size:21px;line-height:1.5;max-width:400px}
.play-chapter .age-note{display:block;font-size:11px;line-height:1.6}
.play-dock{position:relative;aspect-ratio:620 / 490;width:100%}
.play-traveller{position:absolute;top:0;left:0;z-index:2;transform-origin:0 0;pointer-events:none;will-change:transform}
.play-scene{display:block;width:100%;height:auto;overflow:visible;font-family:Outfit,sans-serif}
.play-capsule{filter:drop-shadow(0 9px 0 #102a4308)}
.play-detail-card{filter:drop-shadow(0 4px 3px #102a4312)}
.play-columns-details .play-detail-card{animation:play-card-float 7s ease-in-out infinite;animation-play-state:paused}
.play-columns-details .play-detail-card:nth-child(even){animation-delay:-3.5s}
.play-scene.is-settled .play-detail-card{animation-play-state:running}
.play-track-dots{animation:play-track 4s ease-in-out infinite;animation-play-state:paused}
.play-scene.is-settled .play-track-dots{animation-play-state:running}
.play-section-number{position:absolute;left:6%;bottom:36px;font-size:11px;letter-spacing:.1em;opacity:.65}
.play-navigation{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:35}
.play-navigation .chapter-nav{border:0;padding:6px 10px;box-shadow:0 6px 25px #102a4320}
.play-navigation .chapter-nav button{min-height:40px}
.play-navigation .nav-dot{border-radius:3px;width:10px;height:10px}
.play-navigation .chapter-nav button[aria-current=step]{background:#102a43;color:#fff}
.play-navigation .chapter-nav button[aria-current=step] .nav-dot{background:var(--blue)}
.play-navigation .nav-label{font-size:12px}
#experience:not(.story-in-view) .play-navigation{visibility:hidden}
@keyframes play-card-float{50%{translate:0 -5px}}
@keyframes play-track{50%{translate:42px 0}}
body[data-version=stack] .framework-card{border:0;border-radius:28px;box-shadow:0 9px 0 #102a4308}
body[data-version=stack] .framework-icon{border:0;border-radius:28px;transform:rotate(-7deg)}
body[data-version=stack] .closing-star{border:0;border-radius:35px;transform:rotate(12deg)}

/* Zoom: fixed scene geometry, real nested apertures and an exactly registered camera. */
.zoom-stage .world-room{overflow:hidden;border:0;outline:0;border-radius:0;transform-origin:0 0}
.world-illustration{position:absolute;inset:0;display:block;width:100%;height:100%}
.zoom-stage .copy-stack{top:30px;left:5%;width:39%;height:calc(100% - 115px)}
.zoom-stage .chapter-copy :is(h1,h2){font-size:clamp(48px,5.15vw,82px);line-height:1.02}
.zoom-stage .hero-description{font-size:17px;line-height:1.65;max-width:420px}
.zoom-text-shield{width:47%;height:82%;background:linear-gradient(to right,var(--scene-bg) 78%,transparent);mask-image:linear-gradient(to bottom,black 90%,transparent)}
.zoom-stage .zoom-resolution{left:5%;top:18%;width:39%}
.zoom-stage .zoom-resolution p{font-size:clamp(34px,4vw,58px)}
.zoom-return-window{position:absolute;background:#e7f2ff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#245ddd;gap:12px;overflow:hidden}
.zoom-return-window span{font-family:Outfit;font-size:clamp(48px,7vw,120px);line-height:1}
.zoom-return-window p{font-family:Outfit;font-weight:600;font-size:clamp(16px,2vw,32px)}
.world-support-note{transform-box:fill-box;transform-origin:center;animation:world-note 7s ease-in-out infinite;animation-play-state:paused}
.world-room.is-settled .world-support-note{animation-play-state:running}
.world-step{animation:world-step 10s ease-in-out infinite;animation-delay:calc(var(--step)*2s);animation-play-state:paused}
.world-room.is-settled .world-step{animation-play-state:running}
@keyframes world-note{50%{translate:0 -4px}}
@keyframes world-step{0%,15%{opacity:.65}20%,100%{opacity:1}}
.zoom-flow .flow-art{border:0;padding:0;aspect-ratio:800 / 580}
.zoom-static-world{position:relative;width:100%;height:100%;border-radius:24px;overflow:hidden}
.zoom-static-preview{position:absolute;overflow:hidden}
.zoom-static-preview .world-illustration{width:100%;height:100%}

@media(max-width:1200px){
 .voyage-stage .story-inner{padding:25px 4% 145px;grid-template-columns:43% 1fr}
 .voyage-stage .chapter-copy :is(h1,h2),.zoom-stage .chapter-copy :is(h1,h2){font-size:clamp(44px,5.1vw,65px)}
 .voyage-stage .hero-description,.zoom-stage .hero-description{font-size:16px}
 .world-destination{left:calc(var(--destination)*100% + 44%);width:55%;bottom:17%;height:73%}
 .voyage-vehicle{width:205px;left:7%;bottom:7.8%}
 .world-destination-label{font-size:10px}
 .play-chapter{padding:75px 5%}
 .play-chapter .chapter-copy :is(h1,h2){font-size:clamp(43px,5.35vw,64px)}
 .play-chapter .hero-description{font-size:17px}
 body[data-version=voyage] .framework-grid{gap:75px 80px;padding:20px 35px 70px}
}
@media(min-width:761px) and (max-height:760px){
 .voyage-stage .story-inner{padding:20px 4% 110px}
 .voyage-stage .chapter-copy :is(h1,h2),.zoom-stage .chapter-copy :is(h1,h2){font-size:clamp(40px,4vw,58px);margin:16px 0}
 .voyage-stage .hero-description,.zoom-stage .hero-description{font-size:15px;line-height:1.55}
 .voyage-stage .age-note,.zoom-stage .age-note{margin-top:16px}
 .voyage-stage .chapter-insight,.zoom-stage .chapter-insight{font-size:17px;margin-top:20px}
 .voyage-vehicle{width:180px;bottom:7.4%}
 .zoom-stage .copy-stack{top:20px;height:calc(100% - 95px)}
 .zoom-stage .zoom-resolution{top:15%}
}
@media(max-width:1000px){
 .play-chapter{padding:55px 6% 75px;min-height:0}
 .play-inner{display:flex;flex-direction:column;align-items:stretch;gap:42px;min-height:0}
 .play-chapter .chapter-copy{padding-right:60px}
 .play-chapter .chapter-copy :is(h1,h2){font-size:clamp(45px,7.8vw,72px)}
 .play-dock{width:90%;max-width:660px;align-self:center}
 .play-chapter .hero-description{max-width:560px;font-size:18px}
 .play-chapter .chapter-insight{max-width:520px}
}
@media(max-width:760px){
 .voyage-stage .story-inner{display:block;padding:24px 6% 0;height:52%}
 .voyage-stage .chapter-copy :is(h1,h2),.zoom-stage .chapter-copy :is(h1,h2){font-size:clamp(36px,10.4vw,48px);line-height:1.015;margin:16px 0}
 .voyage-stage .hero-description,.zoom-stage .hero-description{font-size:15px;line-height:1.5}
 .voyage-stage .chapter-insight,.zoom-stage .chapter-insight{font-size:16px;margin-top:18px}
 .voyage-stage .hero-actions,.zoom-stage .hero-actions{margin-top:18px;gap:18px}
 .voyage-reading-scrim{width:100%;height:54%;background:linear-gradient(to bottom,var(--scene-bg) 88%,transparent);mask-image:none}
 .world-destination{left:calc(var(--destination)*100% + 11%);width:82%;height:35%;bottom:16%}
 .world-destination-label{font-size:8px;letter-spacing:.06em;padding:0 0 6px}
 .voyage-sun{width:39px;height:39px;top:49%;left:48%;box-shadow:0 0 0 8px #fff3ca20}
 .voyage-distant{height:92%}
 .voyage-vehicle{width:142px;left:5%;bottom:8.2%}
 .voyage-stage .story-bottom{left:4%;right:4%;bottom:11px;gap:8px}
 .voyage-stage .chapter-counter{min-width:37px}
 .voyage-stage .chapter-nav{padding:3px 5px}
 .voyage-stage .chapter-nav button{padding:7px 8px;gap:6px}
 body[data-version=voyage] .framework-grid{grid-template-columns:1fr;gap:38px;padding:18px 7% 45px}
 body[data-version=voyage] .framework-card,body[data-version=voyage] .framework-card:last-child{width:94%;min-height:0;padding:26px;grid-column:auto;justify-self:start}
 body[data-version=voyage] .framework-card:nth-child(even){transform:rotate(3deg);justify-self:end}
 body[data-version=voyage] .framework-card:last-child summary{display:block}
 body[data-version=voyage] .framework-card h3{font-size:29px}
 body[data-version=voyage] .framework-card .capability{font-size:12px;min-height:0}
 body[data-version=voyage] .framework-grid:before{inset:-40px -10px;background-size:cover}
 .play-chapter{padding:38px 6% 67px;border-radius:30px 30px 0 0}
 .play-chapter .chapter-copy{padding-right:48px}
 .play-chapter:first-child .chapter-copy{padding-right:0}
 .play-chapter .chapter-copy :is(h1,h2){font-size:clamp(35px,9.8vw,48px);margin:20px 0 23px}
 .play-chapter:first-child .chapter-copy h1{font-size:clamp(40px,11vw,55px)}
 .play-chapter .hero-description{font-size:17px;line-height:1.65}
 .play-chapter .chapter-insight{font-size:19px;margin-top:24px}
 .play-chapter .hero-actions{flex-wrap:wrap;margin-top:24px;gap:18px}
 .play-chapter .age-note{font-size:10px;margin-top:23px}
 .play-inner{gap:38px}
 .play-dock{width:103%}
 .play-section-number{bottom:29px;font-size:10px}
 .play-navigation{bottom:13px;max-width:96%}
 .play-navigation .chapter-nav{padding:5px 7px}
 .play-navigation .chapter-nav button{min-height:36px;padding:7px 9px}
 .play-navigation .nav-label{font-size:10px}
 .play-navigation .nav-dot{width:8px;height:8px}
 .zoom-stage .copy-stack{left:6%;top:24px;width:88%;height:49%}
 .zoom-text-shield{width:100%;height:54%;background:linear-gradient(to bottom,var(--scene-bg) 88%,transparent);mask-image:none}
 .zoom-stage .zoom-resolution{left:6%;top:6%;width:88%}
 .zoom-stage .zoom-resolution p{font-size:33px}
 .zoom-stage .resolution-mark{height:60px;width:60px;font-size:43px;margin-bottom:14px}
 .zoom-return-window span{font-size:42px}
 .zoom-return-window p{font-size:13px}
 .scenic-static{border-radius:22px}
}
.motion-paused .landmark-step{filter:none;transform:none}

.voyage-stage .chapter-counter{color:#102a43}
.zoom-world-viewport{position:absolute;inset:0;overflow:hidden}
@media(max-width:760px){
 .voyage-reading-scrim{height:49.5%}
 .zoom-world-viewport{top:45%;bottom:auto;height:48%}
 .zoom-stage .zoom-text-shield{height:45%}
}
