/* An eight-chapter scroll film. All travel remains native browser scrolling. */
.home-page .header{position:fixed;background:#101010e8;backdrop-filter:blur(12px);height:76px}
.home-page .experience{height:auto;min-height:0}
.home-page .hero{height:auto;min-height:100svh;padding:0;background:#101010;overflow:hidden}
.story-panel{padding:160px 6% 100px;min-height:90svh;position:relative}
.story-copy{position:relative;z-index:2;max-width:760px}
.story-copy h1,.story-copy h2{font-weight:400;letter-spacing:-.06em;font-size:clamp(64px,7.2vw,118px);line-height:1.02;margin:22px 0 30px}
.story-copy h1{font-size:clamp(68px,6.8vw,110px);margin-top:0}
.story-copy h1 .dot-word{width:5.55em;margin-top:18px}
.story-copy h2 em{font-style:normal;color:var(--accent)}
.story-copy p{color:#b4b3ac;font-size:16px;line-height:1.7;margin:0 0 28px;max-width:470px}
.story-copy .eyebrow{font-size:10px;letter-spacing:.12em;color:#b5b3a9}
.story-copy .story-note{display:block;color:#928e83;font-size:9px;margin-top:34px}
.story-copy .dot-word[data-dot="human"]{width:3.4em;vertical-align:baseline;margin-top:8px}
.story-ready .home-page .experience{height:2000svh;min-height:12500px}
.story-ready .home-page .hero{height:100svh;min-height:640px;position:sticky;top:0;overflow:clip;background:radial-gradient(ellipse at 70% 48%,var(--accent-halo) 0%,#101010 60%)}
.home-page .hero-top{position:absolute;z-index:4;top:111px;left:4.5%;right:4.5%;pointer-events:none}
.story-ready .story-panels{position:absolute;inset:0;z-index:2;pointer-events:none}
.story-ready .story-panel{position:absolute;inset:0;padding:0;min-height:0;display:flex;align-items:center;opacity:0;visibility:hidden;will-change:transform,opacity;pointer-events:none}
.story-ready .story-panel .story-copy{margin-left:4.5%;padding-top:20px;pointer-events:auto}
.story-ready .story-panel:first-child{opacity:1;visibility:visible}
.home-page .object-stage{position:absolute;inset:0;width:100%;height:100%;opacity:1}
.home-page .object-coordinate{right:4.5%;bottom:110px;font-size:9px;line-height:1.8}
.home-page .orbit{width:43%;left:51%;top:27%;opacity:.6}
.home-page .cross-one{right:10%;top:23%}.home-page .cross-two{left:51%;bottom:20%}
.home-page .hero-bottom{bottom:24px;align-items:center}
.home-page .scroll-cue{font-size:9px}.home-page .scroll-cue small{font-size:7px;color:#96928b;letter-spacing:.07em}
.chapter-nav{display:flex;gap:6px;align-items:center}
.chapter-nav a{font:9px var(--font-text);color:#a29b91;display:grid;place-items:center;min-width:32px;height:38px;position:relative}
.chapter-nav a:after{content:'';position:absolute;bottom:0;left:5px;right:5px;height:2px;background:#494138}
.chapter-nav a[aria-current]{color:var(--accent)}.chapter-nav a[aria-current]:after{background:var(--accent)}
.chapter-nav a:hover{color:#fff}.story-progress{position:absolute;z-index:5;bottom:0;left:0;right:0;height:2px;background:#2d2822}.story-progress i{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.chapter-marker{position:absolute;top:calc((100% - 100svh) * var(--chapter) / 7.7);width:1px;height:1px;pointer-events:none;scroll-margin-top:-15px}
.story-ready .scene-right .story-copy{margin-left:52%;max-width:45%}
.scene-right h2{font-size:clamp(50px,5.8vw,96px)}
.scene-play h2>span{display:block;transform:translateX(calc(var(--text-drift,0px) * -1));will-change:transform}
.scene-play h2>span:nth-child(2){transform:translateX(calc(var(--text-drift,0px) * .65));margin-left:14%}
.scene-play h2>span:nth-child(3){transform:translateX(calc(var(--text-drift,0px) * -.4))}
.scene-play h2{font-size:clamp(65px,7.8vw,120px);line-height:.95}
.ghost-word{position:absolute;right:3%;top:40%;font-size:24vw;font-weight:600;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px #ffffff12;z-index:-1;transform:translateX(calc(var(--text-drift,0px) * -.7))}
.story-ready .scene-center .story-copy{margin:0 auto;text-align:center;max-width:95%;padding:50px 25px;background:radial-gradient(ellipse,#101010ea 15%,#10101090 48%,transparent 73%)}
.scene-center h2{font-size:clamp(60px,7vw,112px)}.scene-center p{margin-left:auto;margin-right:auto}
.flow-words{position:absolute;left:-10%;right:-10%;bottom:15%;font-size:clamp(24px,4vw,60px);letter-spacing:-.04em;font-weight:500;white-space:nowrap;color:#ffffff0b;z-index:-1;transform:rotate(-7deg)}
.flow-words span{display:block;transform:translateX(var(--text-drift,0px))}.flow-words span+span{transform:translateX(calc(var(--text-drift,0px) * -1));margin-left:12%}
.component-list{display:flex;align-items:center;gap:15px;font-size:9px;margin-top:35px}.component-list span{border:1px solid #615143;padding:10px 14px}.component-list i{font-style:normal;color:var(--accent)}
.process-ticker{display:grid;grid-template-columns:auto auto;gap:18px 30px;max-width:300px;font-size:10px;margin-top:35px}.process-ticker span{border-left:2px solid var(--accent);padding-left:12px}
.story-actions{display:flex;gap:28px;align-items:center;margin-top:35px}.story-actions>.mono{font-size:9px;color:#b6b2a7}
.home-page .studio{position:relative;z-index:3;background:#101010}
.home-page .contact{position:relative;z-index:3}
.home-page .motion-button{font-size:9px;min-width:124px}
.home-page .motion-button:disabled{cursor:default;color:#aaa}
.experience[data-chapter="3"] .orbit,.experience[data-chapter="4"] .orbit,.experience[data-chapter="6"] .orbit{opacity:0}
.experience[data-chapter="3"] .cross,.experience[data-chapter="4"] .cross,.experience[data-chapter="6"] .cross{opacity:0}
@media(min-width:1600px){.story-ready .story-panel .story-copy{margin-left:max(4.5%,calc((100vw - 1480px)/2))}.story-ready .scene-right .story-copy{margin-left:52%}.story-ready .scene-center .story-copy{margin-left:auto}}
@media(max-width:1000px){.story-copy h1{font-size:7.3vw}.story-copy h2{font-size:8vw}.scene-play h2{font-size:10vw}.story-copy p{font-size:14px}.story-copy .story-note{font-size:8px}.chapter-nav{gap:1px}.chapter-nav a{min-width:27px}.home-page .scroll-cue small{display:none}.scene-right h2{font-size:5.8vw}.story-actions{gap:15px}.story-actions>.mono{font-size:8px}}
@media(max-width:600px){
  .home-page .header{height:68px}.home-page .header nav{gap:16px}
  .story-ready .home-page .experience{height:1900svh;min-height:12500px}
  .story-ready .home-page .hero{height:100svh;min-height:700px}
  .home-page .hero-top{top:94px;left:6%;right:6%}
  .story-ready .story-panel{align-items:flex-start}
  .story-ready .story-panel .story-copy,.story-ready .scene-right .story-copy{margin:0;padding-top:156px;margin-left:6%;max-width:88%}
  .story-copy h1{font-size:14.5vw;line-height:.99;margin-bottom:22px}
  .story-copy h2,.scene-right h2{font-size:12vw;line-height:1.04;margin:18px 0 20px;letter-spacing:-.055em}
  .story-copy p{font-size:13px;line-height:1.6;margin-bottom:15px;max-width:320px}
  .story-copy .eyebrow{font-size:8px;letter-spacing:.04em}
  .story-copy .story-note{font-size:7px;letter-spacing:.025em;margin-top:20px}
  .scene-play h2{font-size:13vw;line-height:.98;display:flex;gap:10px;flex-wrap:wrap;max-width:85%}
  .scene-play h2>span:nth-child(2){margin-left:0}.scene-play h2>span:nth-child(3){flex-basis:100%}
  .story-ready .scene-center .story-copy{padding:170px 0 0;margin:0 5%;max-width:90%;background:none}
  .scene-center h2{font-size:11.5vw}.scene-center p{background:#1010108c;width:fit-content;padding:5px 12px}
  .home-page .object-stage{inset:0;width:100%;height:100%}
  .home-page .object-coordinate{font-size:7px;right:6%;bottom:120px}
  .home-page .orbit{top:50%;left:12%;width:84%}
  .home-page .cross-one{top:53%;right:8%}.home-page .cross-two{bottom:23%;left:11%}
  .home-page .hero-bottom{left:6%;right:6%;bottom:48px;align-items:center}
  .home-page .scroll-cue{font-size:8px;gap:8px}.home-page .scroll-circle{width:28px;height:28px}
  .home-page .motion-button{font-size:8px;min-width:110px}
  .chapter-nav{position:absolute;left:0;right:0;bottom:-37px;justify-content:center;gap:10px}.chapter-nav a{height:28px;min-width:26px;font-size:8px}
  .ghost-word{top:63%;font-size:38vw;right:4%}
  .flow-words{bottom:25%;font-size:26px}
  .component-list{gap:9px;margin-top:22px;font-size:7px}.component-list span{padding:8px 10px}
  .process-ticker{margin-top:23px;font-size:8px;gap:12px 18px;max-width:245px}
  .story-actions{gap:20px;flex-wrap:wrap;margin-top:22px}.story-actions .text-link{font-size:12px;gap:20px}
}
@media(prefers-reduced-motion:reduce){
  .story-ready .home-page .experience{height:auto;min-height:0}
  .story-ready .home-page .hero{height:auto;position:relative;min-height:0;overflow:hidden}
  .story-ready .story-panels{position:relative;inset:auto;pointer-events:auto}
  .story-ready .story-panel{position:relative;display:block;inset:auto;opacity:1!important;visibility:visible!important;transform:none!important;padding:80px 6%;min-height:65svh;border-bottom:1px solid #323230}
  .story-ready .story-panel:first-child{padding-top:170px}
  .story-ready .story-panel .story-copy,.story-ready .scene-right .story-copy,.story-ready .scene-center .story-copy{margin:0;padding:0;max-width:100%;text-align:left;background:none}
  .scene-center p{margin-left:0}.home-page .object-stage,.home-page .hero-bottom,.chapter-marker,.ghost-word,.flow-words,.story-progress{display:none}
  .scene-play h2>span{transform:none!important}.story-copy .story-note{margin-top:25px}
}

@media(min-width:601px){.story-panel[data-scene="1"] h2,.story-panel[data-scene="7"] h2{font-size:clamp(52px,6.3vw,106px)}}
