/* One underwater field connects every chapter, from surface to starlight. */
.story-light{opacity:var(--submerged,0);background:radial-gradient(ellipse at 18% -5%,#26536944,transparent 58%),radial-gradient(ellipse at 95% 75%,#3346703b,transparent 68%),linear-gradient(180deg,#05132088,#040c18c9);isolation:isolate}
.story-light:before{content:'';position:absolute;inset:-30% -30% -10%;background:conic-gradient(from 168deg at 35% 0%,transparent 0deg,#9ac5de0d 7deg,transparent 11deg,transparent 22deg,#82bccc0b 27deg,transparent 31deg);transform:translateY(calc(var(--ocean-descent,0)*-12vh));opacity:calc(.8 - var(--ocean-descent,0)*.45);filter:blur(22px)}
.story-light:after{content:'';position:absolute;inset:-20%;background:radial-gradient(ellipse at 68% 75%,#53668b32,transparent 48%),radial-gradient(ellipse at 15% 92%,#215d672b,transparent 45%);opacity:var(--ocean-descent,0);transform:translateY(calc(var(--ocean-descent,0)*-10vh))}
.ocean-intro{background:transparent}.ocean-depth{opacity:calc(1 - var(--intro-to-world,0))}
#ocean-dust{z-index:1;opacity:var(--dust-opacity,.04)}
#descent-particles{position:fixed;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:1}
.memory:before{opacity:.16}.future-sea{display:none}.future-aurora{opacity:.32}
.future-point{background:radial-gradient(ellipse,#081724aa 20%,transparent 68%)}
.about-visual{overflow:visible;border-radius:0;background:transparent}
.about-visual:before{content:'';position:absolute;inset:3% -15% -3%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#587d9430,transparent 68%)}
.about-visual:after{display:none}
.about-visual>img{transform:none;mask-image:radial-gradient(ellipse 50% 50% at 50% 48%,#000 38%,#000000f5 56%,#000000a6 75%,#00000033 90%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 48%,#000 38%,#000000f5 56%,#000000a6 75%,#00000033 90%,transparent 100%)}
.portrait-name{left:0;right:0;text-align:center;bottom:28px;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(62px,7vw,108px);color:#deebf0db;letter-spacing:-.025em}
.portrait-caption{inset:auto 5% -2px;color:#91a8b7;font-size:8px}
.future .section{padding-bottom:60px}
.future-journey{gap:7%;grid-template-columns:1fr 1.08fr}
.future-vision{top:100px}
.vision-art{max-width:490px;aspect-ratio:440/560}
.vision-portrait{left:50%;top:2%;width:auto;height:95%;max-width:100%;aspect-ratio:9/16;object-fit:contain;object-position:center;transform:translateX(-50%);mask-image:radial-gradient(ellipse 50% 50% at 50% 49%,#000 40%,#000000f5 58%,#000000ad 75%,#00000040 88%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 49%,#000 40%,#000000f5 58%,#000000ad 75%,#00000040 88%,transparent 100%)}
.stage-portrait{opacity:0;transition:opacity .8s ease;will-change:opacity}
.stage-portrait.is-active{opacity:.95}
.vision-stage-label{color:#b0c8d8;font-size:10px;letter-spacing:.08em;margin-top:12px;line-height:1.8}
.vision-stage-label span{margin-left:12px;letter-spacing:0}
.vision-caption{margin-top:9px;font-size:10px;color:#7794a7}
.future-step{min-height:clamp(260px,47svh,440px);padding-top:32px;padding-bottom:80px;scroll-margin-top:180px}
.future-point{top:28px}.future-steps:before,.future-steps:after{top:55px;bottom:120px}
.future-step:last-child{padding-bottom:80px}
.future-arrival{padding-top:20px}
.arrival-horizon:before{background:linear-gradient(90deg,transparent,#cae6f1aa,transparent);box-shadow:0 0 35px #a8d6f52c}
.future-arrival em{color:#d4e6ec}
.closing{position:relative;isolation:isolate;scroll-margin-top:90px}
.closing:before{content:'';position:absolute;z-index:-1;pointer-events:none;inset:-8% -15% 15%;background:radial-gradient(ellipse at 50% 45%,#577b9630,transparent 65%);opacity:.8}
.closing-star{text-shadow:0 0 28px #bce7f55c}
.closing .pill{border:1px solid #c9e6ef7a;box-shadow:0 0 35px #8dbbcb0d;transition:background .3s,box-shadow .3s,border-color .3s}
.closing .pill:hover,.closing .pill:focus-visible{border-color:#e3f2f7;box-shadow:0 0 32px #8dbbcb2b}
.motion-reduced .stage-portrait{transition:none!important;will-change:auto}
.motion-reduced .story-light:before,.motion-reduced .story-light:after{transform:none}
@media(min-width:761px) and (max-height:800px){.vision-art{max-width:400px}.future-vision{top:90px}.vision-name{font-size:25px}.vision-caption{display:none}}
@media(max-width:760px){
.about-visual{width:100%;max-width:400px}.portrait-caption{font-size:7px;inset:auto 8% -2px}.portrait-name{bottom:25px;font-size:76px}
.future-journey{display:block;margin-top:30px}
.future-vision{position:sticky;top:62px;height:238px;z-index:5;width:calc(100% + 32px);margin:0 -16px 25px;padding:0 16px 18px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto auto;align-items:center;background:transparent;border-radius:0;pointer-events:none;isolation:isolate}
.future-vision:before{content:'';position:absolute;left:50%;top:-10px;bottom:-5px;width:100vw;transform:translateX(-50%);z-index:-1;background:linear-gradient(180deg,#071422 0%,#071422 80%,#07142200 100%);pointer-events:none}
.vision-art{grid-column:1/3;grid-row:1/4;width:205px;max-width:205px;align-self:start;height:232px;margin:0 auto}
.vision-portrait{left:50%;top:0;width:auto;height:94%}
.vision-art>svg{opacity:.45}
.vision-name{grid-column:1;grid-row:2;font-size:16px;letter-spacing:.16em;text-align:left;margin:0 0 8px -2px;z-index:1}
.vision-stage-label{grid-column:2;grid-row:3;text-align:right;margin:0;font-size:9px;align-self:end;color:#cae0e9;z-index:1}
.vision-stage-label span{display:block;margin:2px 0 0;max-width:155px;text-wrap:balance}
.vision-caption{display:none}
.future-step{padding:18px 0 95px 42px;min-height:360px;scroll-margin-top:345px}
.future-step:last-child{padding-bottom:100px;min-height:390px}.future-point{top:14px}
.future-steps:before,.future-steps:after{top:39px;bottom:180px}
.future-step-copy>p:last-child{font-size:13px}.future-step h3{font-size:25px}
.future-arrival{padding-top:28px}
}
@media(max-width:760px) and (max-height:690px){.future-vision{height:188px}.vision-art{width:165px;height:185px;max-width:165px}.future-step{min-height:330px}}
@media(max-width:760px) and (max-height:480px){.future-vision{height:128px}.vision-art{width:112px;height:126px;max-width:112px}.vision-name{font-size:14px}.future-step{scroll-margin-top:230px}}