/* Long-form outdoor narrative. Each chapter holds before the camera moves on. */
html{scroll-padding-top:0}
#world{contain:strict;transition:none}
.grain{contain:strict;transform:translateZ(0)}
#world canvas{opacity:0;transition:opacity 1.15s ease}
.webgl-ready #world canvas{opacity:1}
.scene-loading{position:absolute;left:67%;top:43%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:19px;text-align:center;transition:opacity .5s;max-width:260px;width:80%;color:#fff9;font:8px/1.7 var(--mono);letter-spacing:1.2px}
.scene-loading small{display:block;font:10px var(--sans);letter-spacing:1.4px;margin-top:7px}
.loading-particles{display:flex;gap:7px;height:24px;align-items:center}
.loading-particles i{width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 9px #ffc7f5;animation:assemble-dot 1.7s ease-in-out infinite}
.loading-particles i:nth-child(2){animation-delay:.15s}.loading-particles i:nth-child(3){animation-delay:.3s}.loading-particles i:nth-child(4){animation-delay:.45s}.loading-particles i:nth-child(5){animation-delay:.6s}
.webgl-ready .scene-loading{opacity:0;pointer-events:none}
.webgl-ready .loading-particles i{animation:none}
.scene-error .scene-loading{opacity:1;color:#fff}
.scene-error .loading-particles{display:none}
.scene-error #world canvas{opacity:0}
@keyframes assemble-dot{0%,100%{transform:translateY(0);opacity:.25}50%{transform:translateY(-8px);opacity:1}}

.story-chapter{height:220svh;min-height:1500px;position:relative;padding:0;scroll-margin-top:0}
.story-chapter#idea,.story-chapter#seat{height:240svh}
.story-chapter#proof{height:190svh}
.story-chapter>.chapter-frame{position:sticky;top:0;height:100svh;min-height:0;width:100%;display:grid;grid-template-columns:46% 54%;grid-template-rows:auto 1fr auto;padding:clamp(36px,8svh,88px) 6% clamp(24px,4.5svh,48px)}
.hero.story-chapter{height:230svh;padding:0}
.hero.story-chapter>.chapter-frame{display:block;padding:0}
.hero h1{font-size:clamp(65px,min(8.1vw,13svh),140px)}
.chapter-heading{position:relative;grid-column:1;max-width:none;min-width:0}
.chapter-heading .pill-label{margin-bottom:clamp(14px,2.6svh,28px);font-size:10px}
.chapter-heading h2{font:400 clamp(48px,min(7.2vw,12svh),128px)/.94 var(--serif);letter-spacing:-.045em}
.chapter-detail{position:relative;grid-column:1;align-self:center;display:flex;gap:clamp(12px,1.7vw,24px);max-width:550px;width:100%;padding:18px 0}
.chapter-detail>div{min-width:0}
.chapter-detail>.line-arrow{font-size:42px;flex-shrink:0}
.chapter-detail h3{font-size:18px;font-weight:400;line-height:1.65;letter-spacing:.5px;margin-bottom:17px}
.chapter-detail p{font-size:12px;line-height:1.9;color:#fffdf9dc;margin-bottom:14px}
.chapter-footer{position:relative;grid-column:1/-1;display:flex;align-items:end;justify-content:space-between;font:8px/1.8 var(--mono);letter-spacing:.75px}
.chapter-footer p{text-align:right}
.chapter-detail .text-link{padding:4px 0 8px;margin-top:0}
.story-flow{display:flex;align-items:center;gap:13px;margin:19px 0;font-size:12px}
.story-flow span{border-bottom:1px solid #ffffff50;padding-bottom:8px}
.story-flow b{font-weight:400;opacity:.65}
.chapter-nav{position:fixed;right:17px;top:50%;transform:translateY(-50%);z-index:8;display:flex;flex-direction:column;gap:8px;transition:opacity .25s}
.chapter-nav[hidden]{display:none}
.chapter-nav>a{display:flex;align-items:center;justify-content:end;gap:11px;min-height:24px;position:relative}
.chapter-nav i{width:25px;height:25px;display:flex;align-items:center;justify-content:center;font:7px var(--mono);font-style:normal;border:1px solid #fff0;color:#ffffff65;border-radius:50%;transition:border-color .25s,color .25s,background .25s}
.chapter-nav span{position:absolute;right:37px;white-space:nowrap;font-size:10px;letter-spacing:.5px;opacity:0;transform:translateX(5px);transition:.2s}
.chapter-nav a:hover span,.chapter-nav a:focus-visible span{opacity:1;transform:none}
.chapter-nav a[aria-current=step] i{color:#fff;border-color:#ffffff6b;background:#d658dc1c}
.chapter-progress{height:67px;width:1px;background:#ffffff25;margin:10px auto 0}
.chapter-progress>i{display:block;width:1px;height:100%;background:#fff;transform:scaleY(0);transform-origin:top}
@media(min-width:1800px){.chapter-detail{font-size:14px;max-width:630px}.chapter-detail p{font-size:14px}}
@media(min-width:601px) and (max-width:1024px){
  .chapter-heading h2{font-size:clamp(45px,min(7.4vw,11svh),76px)}
  .chapter-detail{gap:12px}.chapter-detail h3{font-size:16px}.chapter-detail p{font-size:11px}.chapter-detail br.desktop-break{display:none}
  .hero-copy{top:36%}.hero h1{font-size:clamp(60px,min(8.5vw,13svh),90px)}.chapter-nav{right:8px}
}
@media(max-width:600px){
  .scene-loading{left:50%;top:32%;font-size:7px}.scene-loading small{font-size:9px}
  .story-chapter,.story-chapter#idea,.story-chapter#seat{height:235svh;min-height:1540px}
  .hero.story-chapter{height:230svh}.story-chapter#proof{height:205svh}
  .story-chapter>.chapter-frame{height:100svh;min-height:0;grid-template-columns:1fr;grid-template-rows:auto minmax(120px,1fr) auto auto;padding:24px 6% 58px}
  .hero.story-chapter>.chapter-frame{min-height:0}
  .hero h1{font-size:clamp(57px,min(17vw,10.8svh),86px)}
  .hero-copy{bottom:115px}.hero-description{margin-top:20px}
  .chapter-heading{grid-row:1;max-width:none}
  .chapter-heading .pill-label{font-size:8px;margin-bottom:14px;padding:7px 11px}
  .chapter-heading h2{font-size:clamp(40px,min(13.8vw,7.9svh),64px);line-height:.94}
  .chapter-detail{grid-row:3;align-self:end;width:100%;max-width:none;gap:12px;padding:14px 0}
  .chapter-detail>.line-arrow{font-size:29px}
  .chapter-detail h3{font-size:15px;line-height:1.7;margin-bottom:12px;letter-spacing:.1px}
  .chapter-detail p{font-size:11px;line-height:1.85;margin-bottom:10px}
  .chapter-detail br.desktop-break{display:none}
  .chapter-detail .text-link{font-size:10px;gap:23px;margin-top:1px;padding-bottom:7px}
  .story-flow{font-size:10px;gap:10px;margin:13px 0}.story-flow span{padding-bottom:5px}
  .chapter-footer{grid-row:4;font-size:6px;letter-spacing:.3px}
  .chapter-nav{top:auto;bottom:13px;left:50%;right:auto;transform:translateX(-50%);flex-direction:row;gap:1px;background:#58416dcc;border:1px solid #ffffff20;border-radius:30px;padding:3px 5px}
  .chapter-nav a{min-height:22px}.chapter-nav i{width:23px;height:23px;font-size:6px}.chapter-nav span,.chapter-progress{display:none}
  .chapter-nav.at-start{opacity:0;pointer-events:none}
}
@media(max-height:740px) and (min-width:601px){.chapter-detail h3{font-size:15px;margin-bottom:10px}.chapter-detail p{font-size:11px;margin-bottom:10px}.chapter-heading .pill-label{margin-bottom:16px}.hero-description{margin-top:24px}}
@media(max-height:690px) and (max-width:600px){.chapter-detail h3{font-size:13px;margin-bottom:8px}.chapter-detail p{font-size:10px;line-height:1.75;margin-bottom:8px}.chapter-detail{padding:10px 0}.chapter-heading h2{font-size:42px}.hero-copy{bottom:100px}.hero-description{margin-top:15px}}
@media(max-height:520px){.story-chapter>.chapter-frame{position:relative;height:auto;min-height:100svh}.story-chapter:not(.hero)>.chapter-frame{padding-top:32px;padding-bottom:52px}.hero.story-chapter>.chapter-frame{min-height:540px}.chapter-detail{padding-top:24px;padding-bottom:24px}}
@media(prefers-reduced-motion:reduce){#world canvas,.scene-loading,.chapter-nav i{transition:none}.loading-particles i{animation:none}}