/* The hero is typography-led; the spatial journey starts after the areas. */
.hero{min-height:760px;height:min(850px,100svh)}
.hero .sticker-coral{bottom:115px}
.hero .sticker-mint{bottom:145px}
.hero-explore{font-size:12px;color:#d0d0d0;text-decoration:underline;text-underline-offset:5px}
.tunnel-section{--tunnel-accent:#ff5043;position:relative;height:430vh;height:430svh;background:#090b10;color:#fff}
.tunnel-stage{position:sticky;top:0;height:100vh;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:#090b10}
.tunnel-visual{position:absolute;inset:0;z-index:-2}
.tunnel-visual canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .5s ease}
.tunnel-ready .tunnel-visual canvas{opacity:1}
.tunnel-vignette{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#090b10c9 0%,#090b1020 28%,#090b1000 52%,#090b1070 72%,#090b10f2 100%)}
.tunnel-heading{position:absolute;left:var(--pad);right:var(--pad);top:45px;display:flex;justify-content:space-between;gap:30px;align-items:start}
.tunnel-heading h2{font-size:clamp(28px,3.1vw,48px);line-height:1.08;font-weight:500}
.tunnel-instruction{max-width:235px;font-size:14px;line-height:1.5;color:#c6c8cc;text-align:right;margin-top:6px}
.tunnel-caption{position:absolute;left:var(--pad);bottom:135px;max-width:450px;padding-left:20px;border-left:3px solid var(--tunnel-accent);text-shadow:0 2px 15px #090b10}
.tunnel-topic{font-size:24px;font-weight:500;display:block;line-height:1.2;margin-bottom:13px;color:var(--tunnel-accent)}
.tunnel-description{font-size:15px;line-height:1.5;white-space:pre-line;color:#e1e3e6}
.tunnel-footer{position:absolute;left:var(--pad);right:var(--pad);bottom:37px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.tunnel-stops{display:flex;gap:12px}
.tunnel-stops button{font:inherit;font-size:13px;min-height:44px;padding:12px 19px;border:1px solid #ffffff35;background:#090b10bb;border-radius:100px;color:#ced1d7;transition:background .2s,color .2s,border-color .2s}
.tunnel-stops button:hover{background:#ffffff18;color:#fff}
.tunnel-stops button[aria-current=step]{color:var(--tunnel-accent);border-color:var(--tunnel-accent)}
.tunnel-skip{font-size:13px;color:#c6c8cc;text-decoration:underline;text-underline-offset:6px;padding:10px 0;white-space:nowrap}
.tunnel-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff12}
.tunnel-progress span{display:block;height:100%;width:100%;background:var(--tunnel-accent);transform:scaleX(0);transform-origin:left center}
.tunnel-static{display:none}
.motion-off .tunnel-section,.tunnel-no-webgl{height:auto}
.motion-off .tunnel-stage,.tunnel-no-webgl .tunnel-stage{position:relative;height:auto;min-height:640px;padding:210px var(--pad) 140px}
.motion-off .tunnel-visual,.tunnel-no-webgl .tunnel-visual{opacity:.14}
.motion-off .tunnel-static,.tunnel-no-webgl .tunnel-static{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;position:relative;z-index:2}
.motion-off .tunnel-caption,.motion-off .tunnel-stops,.motion-off .tunnel-instruction,.motion-off .tunnel-progress,.tunnel-no-webgl .tunnel-caption,.tunnel-no-webgl .tunnel-stops,.tunnel-no-webgl .tunnel-instruction,.tunnel-no-webgl .tunnel-progress{display:none}
.tunnel-static article{border-top:2px solid #ff5043;padding-top:22px}
.tunnel-static article:nth-child(2){border-color:#7ed377}.tunnel-static article:nth-child(3){border-color:#a3abff}
.tunnel-static h3{font-size:25px;line-height:1.2;font-weight:500;margin-bottom:20px}
.tunnel-static p{color:#c6c8cc;font-size:15px;line-height:1.5}
@media(max-width:1050px){.hero{min-height:750px;height:100svh}.tunnel-caption{bottom:145px}.tunnel-heading{top:38px}}
@media(max-width:740px){
  .hero{height:690px;min-height:690px}.hero-copy{padding-top:140px}.hero .sticker-coral{bottom:105px}.hero .sticker-mint{bottom:129px}
  .hero-explore{font-size:11px;padding:4px 0}.hero-bottom p{max-width:180px}
  .tunnel-section{height:390vh;height:390svh}.tunnel-stage{min-height:600px}
  .tunnel-heading{left:24px;right:24px;top:32px;display:block}.tunnel-heading h2{font-size:31px}
  .tunnel-instruction{font-size:12px;text-align:left;max-width:230px;margin-top:16px}
  .tunnel-caption{left:24px;right:24px;bottom:155px;padding-left:15px;max-width:370px}.tunnel-topic{font-size:21px;margin-bottom:10px}.tunnel-description{font-size:13px;line-height:1.5}
  .tunnel-footer{left:24px;right:24px;bottom:24px;align-items:start;flex-direction:column;gap:12px}.tunnel-stops{gap:7px;max-width:100%}.tunnel-stops button{font-size:12px;min-height:44px;padding:11px 13px}.tunnel-skip{font-size:12px;padding:7px 0}
  .motion-off .tunnel-stage,.tunnel-no-webgl .tunnel-stage{padding:180px 24px 100px;min-height:0}
  .motion-off .tunnel-static,.tunnel-no-webgl .tunnel-static{grid-template-columns:1fr;gap:32px}
  .tunnel-static h3{font-size:23px;margin-bottom:12px}.tunnel-static p{font-size:14px}
}
@media(max-width:360px){.hero{height:670px;min-height:670px}.hero .sticker-coral{bottom:100px;font-size:12px}.hero .sticker-mint{bottom:110px;font-size:12px}.hero-bottom p{max-width:150px}.tunnel-heading,.tunnel-footer{left:20px;right:20px}.tunnel-caption{left:20px;right:20px;bottom:155px}.tunnel-stops button{font-size:11px;padding:10px 11px}.tunnel-description{font-size:12px}.tunnel-topic{font-size:19px}}
