@import url('./vendor/fonts.css');
:root{--paper:#f1f0e8;--accent:#f39531;--muted:#a3a39a;--bg:#11110f}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--paper);font-family:Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}header{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:absolute;inset:0 0 auto;z-index:10;border-bottom:1px solid #ffffff18}.brand{font-size:17px;font-weight:800;letter-spacing:3px;display:flex;align-items:center;gap:12px}.brand-icon{display:grid;place-items:center;width:35px;height:35px;background:var(--accent);color:#161612;font-size:26px;letter-spacing:-2px;border-radius:8px}nav{display:flex;gap:36px;font-size:11px;text-transform:uppercase;letter-spacing:1px}.studio-link{font-size:10px;letter-spacing:2px}.experience{position:relative}.stage{position:sticky;top:0;height:100svh;min-height:650px;overflow:hidden;margin-bottom:-100svh;pointer-events:none}.stage canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;pointer-events:auto}.stage-glow{position:absolute;left:33%;top:0;width:67%;height:100%;background:radial-gradient(ellipse,#6c552630,transparent 63%)}.stage-label{position:absolute;right:10%;bottom:15%;font-size:9px;letter-spacing:3px;color:#87877a}.orbit{position:absolute;border:1px solid #c99e5520;border-radius:50%;left:35%;top:12%;width:65%;height:70%;transform:rotate(-28deg)}.orbit-two{transform:rotate(45deg);height:55%;top:22%}.chapter{height:110svh;min-height:700px;position:relative;display:flex;align-items:center;padding:120px 7% 90px;pointer-events:none}.chapter-copy{width:50%;max-width:620px;position:relative;z-index:2;pointer-events:auto}h1,h2{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:-1.5px;line-height:.94;font-weight:600;margin:30px 0}h1{font-size:clamp(66px,7.7vw,126px)}h2{font-size:clamp(68px,7.4vw,116px)}em{font-style:normal;color:var(--accent)}.eyebrow{font-size:10px;letter-spacing:2.5px;font-weight:700;display:flex;align-items:center;gap:10px}.eyebrow i{height:6px;width:6px;border-radius:50%;background:var(--accent)}.description{font-size:14px;line-height:1.9;color:var(--muted);margin:24px 0 30px}.button{display:inline-flex;align-items:center;gap:35px;color:#171713;background:var(--accent);border:0;padding:17px 20px;font-size:10px;letter-spacing:1px;font-weight:800;clip-path:polygon(0 0,95% 0,100% 30%,100% 100%,0 100%)}.button span{font-size:17px}.button:hover{background:#ffc178}.chapter-foot{position:absolute;bottom:48px;left:7%;right:7%;display:flex;justify-content:space-between;color:#96968a;font-size:9px;letter-spacing:2px}.scene-nav{position:fixed;right:2.5%;top:45%;z-index:6;display:flex;flex-direction:column;gap:22px}.scene-nav a{font-size:9px;color:#77796c;display:flex;align-items:center;gap:8px}.scene-nav a:after{content:'';width:4px;height:4px;border-radius:50%;background:currentColor}.scene-nav .active{color:var(--accent)}.material-note{display:flex;gap:16px;align-items:center;border-top:1px solid #ffffff22;width:240px;font-size:12px;line-height:1.7}.material-note>span{color:var(--accent);font-size:32px;font-family:'Barlow Condensed',sans-serif}.sound-word{position:absolute;left:49%;top:22%;font-family:'Barlow Condensed',sans-serif;font-size:clamp(100px,12vw,210px);line-height:.92;color:transparent;-webkit-text-stroke:1px #ffffff17;letter-spacing:-5px}.sound-caption{max-width:280px;font-size:9px;line-height:1.8;color:#8c8d82}.swatches{display:flex;gap:15px;margin-top:25px}.swatch{width:33px;height:33px;border-radius:50%;background:var(--swatch);border:3px solid #11110f;outline:1px solid #646457}.swatch.selected{outline:2px solid var(--accent)}.finish-name{font-size:10px;letter-spacing:2px;color:var(--muted);margin:20px 0 30px}.outro{position:relative;text-align:center;padding:130px 6%;border-top:1px solid #ffffff1a;background:#e6e3d7;color:#171713}.outro .eyebrow{justify-content:center}.outro h2{font-size:clamp(56px,7vw,110px)}.outro em{color:#8d5428}.outro>a{font-size:11px;font-weight:800;border-bottom:1px solid;padding-bottom:10px;letter-spacing:1px}footer{padding:45px 6%;display:flex;justify-content:space-between;align-items:center;gap:30px}footer p{font-size:10px;line-height:1.8;color:var(--muted)}footer>a:last-child{font-size:9px;letter-spacing:1px}.equalizer{display:flex;align-items:center;height:18px;gap:4px}.equalizer i{width:2px;height:5px;background:var(--accent)}body.playing .equalizer i{animation:equalize .7s ease-in-out infinite alternate}body.playing .equalizer i:nth-child(2n){animation-delay:-.4s}body.playing .equalizer i:nth-child(3n){animation-delay:-.2s}@keyframes equalize{to{height:18px}}.fallback-speaker{position:absolute;left:59%;top:27%;width:200px;height:350px;border-radius:50px;background:repeating-radial-gradient(#10100f 0 1px,#34352f 1px 3px);box-shadow:inset -30px 0 30px #000,15px 35px 50px #0009;transform:rotate(-8deg);border:2px solid #4c4d3f}.fallback-speaker span{display:block;margin:-5px -2px;height:45px;border-radius:50%;background:#282923;border:2px solid var(--accent)}.fallback-speaker b{position:absolute;top:30%;left:45%;font-size:26px;color:#99998b}.webgl-ready .fallback-speaker{display:none}.skip{position:absolute;top:-80px;padding:14px;background:var(--accent);color:#111;z-index:100}.skip:focus{top:0}
@media(max-width:760px){header{height:74px;padding:0 6%}nav{display:none}.brand{font-size:14px}.studio-link{font-size:8px}.stage{min-height:680px}.chapter{min-height:760px;height:115svh;padding:110px 7% 70px;align-items:flex-start}.chapter-copy{width:100%;max-width:420px}h1{font-size:62px;line-height:.9;margin:22px 0}h2{font-size:64px;line-height:.94;margin:22px 0}.description{font-size:12px;margin:18px 0;line-height:1.65;max-width:290px}.eyebrow{font-size:8px;letter-spacing:1.5px}.button{font-size:8px;padding:13px 16px;gap:20px}.stage-label{bottom:8%;right:20%;font-size:8px}.scene-nav{right:3%;top:65%}.chapter-foot{bottom:28px;font-size:7px;letter-spacing:1px}.orbit{top:50%;left:10%;width:100%;height:38%}.sound-word{left:5%;top:55%;font-size:120px}.sound-caption{font-size:8px;max-width:210px}.material-note{width:200px}.swatches{margin:20px 0 0}.finish-name{margin:17px 0 22px}.outro{padding:90px 6%}.outro h2{font-size:58px}footer{flex-wrap:wrap;padding:32px 7%}footer p{flex:1;min-width:180px}.fallback-speaker{left:40%;top:55%;width:130px;height:220px;border-radius:35px}.fallback-speaker span{height:32px}.stage-glow{left:10%;top:20%;width:90%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.stage{position:absolute;height:100svh}.chapter:not(.intro){height:auto;min-height:500px;background:#11110f;padding-top:90px}.sound-word,.scene-nav{display:none}.chapter:not(.intro) .chapter-copy{width:100%;max-width:800px}}


#motion-toggle{color:#b7b7a9;border:1px solid #77776a;background:#171813;border-radius:50%;width:24px;height:24px;font-size:10px;padding:0}