@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#07080a;--panel:#101215;--fg:#f5f5f2;--muted:#98a0a4;--line:#ffffff20;--soft:#0f1820}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 Manrope,Arial,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}i,em{font-style:normal;color:#7e858a}
.progress{position:fixed;z-index:99;top:0;left:0;width:0;height:2px;background:#f6f6f2}.header{height:86px;position:absolute;z-index:20;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,94px);border-bottom:1px solid var(--line)}
.logo{font-size:17px;line-height:.9;font-weight:800;letter-spacing:-.09em}.logo span{display:block;letter-spacing:.035em}.logo small{display:block;letter-spacing:.21em;font-size:8px;color:#909699;margin-top:9px}.header nav{display:flex;gap:42px;font-size:12px}.header nav a:hover,.navcta:hover{opacity:.65}.navcta{border:1px solid #bdbdbd77;padding:13px 21px;border-radius:30px;font-size:11px}.navcta span{padding-left:18px}
.hero{min-height:920px;height:100vh;max-height:1220px;position:relative;background:#020305;overflow:visible}.hero-photo{position:absolute;width:100%;height:100%;object-fit:cover;object-position:78% center;animation:heroZoom 2.2s cubic-bezier(.16,1,.3,1) both}@keyframes heroZoom{from{transform:scale(1.06);opacity:.12}to{transform:scale(1);opacity:1}}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#050608 4%,#050608f0 31%,#0506087c 48%,transparent 73%),linear-gradient(0deg,#040507b8 2%,transparent 22%)}.hero-inner{position:relative;z-index:2;padding:clamp(190px,21vh,280px) clamp(24px,8vw,150px) 0;max-width:720px}.eyebrow,.tiny{font-size:10px;letter-spacing:.27em;font-weight:700}.eyebrow{color:#b6b8ba}.dot{display:inline-block;width:6px;height:6px;margin-right:12px;border-radius:100%;background:#e8e8e8}.hero h1{font-size:clamp(68px,9.7vw,185px);line-height:.84;letter-spacing:-.095em;font-weight:800;margin:43px 0 35px}.hero h1 em{color:#777f82}.hero-lead{font-size:clamp(14px,1.45vw,19px);line-height:1.8;color:#c0c3c5}.pill{display:inline-flex;align-items:center;gap:45px;border:1px solid #ffffffa3;border-radius:50px;padding:16px 23px;margin-top:30px;font-size:11px;letter-spacing:.03em;transition:background .3s,color .3s}.pill:hover{background:#fff;color:#101112}.pill svg{height:17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.5}.hero-bottom{position:absolute;bottom:39px;left:clamp(24px,5vw,94px);right:clamp(24px,5vw,94px);display:flex;justify-content:space-between;z-index:2;font-size:9px;letter-spacing:.2em;color:#aaa}
.manifesto{padding:160px clamp(24px,8vw,150px) 120px;background:#e7e8e5;color:#131515}.tiny{color:#858b8b}.manifesto-main{margin:90px auto 115px;max-width:1100px}.manifesto-main>p:first-child{color:#7b7f80;font-size:16px}.manifesto h2,.features h2,.closing h2{font-size:clamp(55px,9vw,143px);line-height:.91;letter-spacing:-.09em;font-weight:800;margin:35px 0}.manifesto h2 i{color:#9da3a2}.statement{font-size:clamp(17px,2vw,25px);line-height:1.65;max-width:640px;margin:50px 0 0 auto}.numbers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #bcbfbc;padding-top:28px}.numbers>div{display:flex;flex-direction:column}.numbers strong{font-size:clamp(50px,7vw,96px);letter-spacing:-.09em;line-height:1}.numbers strong small{font-size:21px;letter-spacing:-.05em}.numbers span{font-size:12px;color:#68706e;margin:15px 0}.note{font-size:10px;color:#7d8580;max-width:680px}
.design-section{display:grid;grid-template-columns:1.08fr 1fr;min-height:850px;background:#101214}.design-image{position:relative;overflow:hidden;background:#090b0d}.design-image img{width:100%;height:100%;object-fit:cover;object-position:center center;filter:brightness(.94);transform:scale(1.06)}.design-copy{padding:clamp(75px,9vw,155px) clamp(30px,7vw,130px);display:flex;flex-direction:column;justify-content:center}.design-copy h2{font-size:clamp(42px,5.3vw,88px);line-height:1.02;letter-spacing:-.075em;margin:50px 0 34px}.design-copy>p:not(.tiny){max-width:450px;color:#aeb2b3;font-size:15px;line-height:1.95}.hairline{height:1px;background:#ffffff32;margin:48px 0 10px}.specrow{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid #ffffff23;font-size:10px;letter-spacing:.13em;color:#bec2c3}
.cinema{height:290vh;background:#060708}.cinema-sticky{position:sticky;top:0;height:100vh;min-height:760px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 50%,#17202a 0%,#0a0c0f 34%,#050607 74%)}.cinema-grid{position:absolute;inset:0;background:linear-gradient(#ffffff0e 1px,transparent 1px),linear-gradient(90deg,#ffffff0e 1px,transparent 1px);background-size:120px 120px;mask-image:radial-gradient(circle at center,#000 44%,transparent 80%);opacity:.22}.cinema-glow{position:absolute;width:min(56vw,720px);height:min(56vw,720px);border-radius:50%;background:radial-gradient(circle,#9db5cd26 0%,#30485a16 45%,transparent 74%);filter:blur(24px);opacity:.9;transform:scale(.94)}.cinema-visual{position:absolute;right:13vw;top:50%;width:min(30vw,420px);transform:translate3d(0,-48%,0);will-change:transform}.cinema-caption{position:absolute;left:7vw;bottom:13%;z-index:3;max-width:520px}.cinema-caption>span{font-size:10px;letter-spacing:.24em;color:#899095}.cinema-caption strong{display:block;font-weight:800;line-height:1.01;letter-spacing:-.065em;font-size:clamp(36px,5.1vw,74px);margin-top:20px}.cinema-caption p{font-size:14px;line-height:1.8;color:#9ca4a9;max-width:420px}.detail-rail{position:absolute;right:8vw;bottom:13%;display:grid;gap:13px;z-index:4;width:min(220px,26vw)}.rail-item{padding:14px 16px;border:1px solid #ffffff1f;background:linear-gradient(145deg,#12161aee,#0c0f12d9);backdrop-filter:blur(8px)}.rail-item span{display:block;font-size:9px;letter-spacing:.18em;color:#7f878d}.rail-item strong{display:block;font-size:18px;line-height:1.05;letter-spacing:-.05em;margin-top:6px}.timeline{position:absolute;bottom:8%;right:7vw;display:flex;gap:12px;align-items:center;font-size:10px;color:#9c9c9c;z-index:4}.timeline-track{width:110px;height:2px;background:#ffffff3a}.timeline-track>div{height:100%;width:0;background:white}
.features{padding:150px clamp(24px,7vw,130px) 160px;background:#111315}.features-head{margin-bottom:65px}.features h2{font-size:clamp(49px,6.7vw,110px)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.feature{padding:44px 36px 65px;min-height:460px;border:1px solid #ffffff23;background:linear-gradient(145deg,#1c1f21,#101214);display:flex;flex-direction:column}.feature>span{font-size:9px;letter-spacing:.19em;color:#919899}.feature svg{height:98px;width:98px;fill:none;stroke:#d2d7d7;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;margin:45px 0 auto}.feature h3{font-size:clamp(25px,3vw,45px);line-height:1.06;letter-spacing:-.065em;margin:28px 0}.feature p{color:#9ca3a5;font-size:13px;line-height:1.7;margin:0}
.closing{min-height:780px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:130px 24px;position:relative;overflow:hidden}.closing-orb{position:absolute;width:600px;height:600px;border:1px solid #ffffff11;box-shadow:0 0 180px #8295a115,inset 0 0 140px #8295a110;border-radius:50%;top:60px;pointer-events:none}.closing>*:not(.closing-orb){z-index:1}.closing h2{font-size:clamp(55px,8vw,128px)}.closing>p:not(.tiny){color:#a7adaf;max-width:520px}.pill.light{background:#eee;color:#111;border:0}.pill.light:hover{background:#bbb}
footer{border-top:1px solid #ffffff24;padding:33px 7vw;display:flex;justify-content:space-between;gap:15px;font-size:9px;letter-spacing:.1em;color:#8e9596}.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s,transform .9s}.reveal.visible{opacity:1;transform:none}
@media(max-width:960px){.design-section{grid-template-columns:1fr}.design-image{height:600px}.design-copy{padding:80px 28px}.cinema{height:240vh}.cinema-sticky{min-height:720px}.cinema-visual{right:auto;left:50%;top:36%;width:min(58vw,320px);transform:translate3d(-50%,-50%,0)}.detail-rail{right:24px;bottom:15%;width:160px}.cinema-caption{left:25px;bottom:11%;max-width:70vw}.timeline{bottom:5%;right:24px}}
@media(max-width:800px){.header{height:70px;padding:0 23px}.header nav{display:none}.navcta{font-size:9px;padding:11px}.hero{height:100svh;min-height:760px}.hero-photo{object-position:68% center;opacity:.88}.hero-shade{background:linear-gradient(90deg,#040506e9 0%,#040506bd 54%,#04050642 76%),linear-gradient(0deg,#030405d1,transparent 65%)}.hero-inner{padding:210px 25px 0;max-width:100%}.hero h1{font-size:clamp(58px,14.5vw,105px)}.hero-lead{font-size:13px}.hero-bottom{left:24px;right:24px}.manifesto{padding:90px 24px}.manifesto-main{margin:65px auto}.manifesto h2{font-size:clamp(45px,11vw,85px)}.statement{margin:35px auto 0;font-size:17px}.numbers{gap:15px}.numbers strong{font-size:clamp(37px,9vw,65px)}.numbers strong small{font-size:13px}.numbers span{font-size:10px}.cinema{height:220vh}.cinema-grid{background-size:88px 88px}.cinema-visual{top:34%;width:240px}.cinema-caption{left:25px;bottom:16%;max-width:calc(100vw - 50px)}.cinema-caption strong{font-size:clamp(34px,12vw,54px)}.cinema-caption p{font-size:13px;max-width:280px}.detail-rail{display:none}.timeline{bottom:8%;right:25px}.feature-grid{grid-template-columns:1fr}.feature{min-height:350px}.feature svg{margin:25px 0 10px}.features{padding:85px 24px}.closing{min-height:700px}.closing h2{font-size:clamp(48px,12vw,80px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none;transition:none;scroll-behavior:auto}.reveal{opacity:1;transform:none}}

/* SPORT EDITION v0.4 — volumetric 3D product presentation, no flat image rotation */
.cinema-visual{right:21%;top:47%;width:340px;height:600px;transform:translateY(-50%);perspective:1300px;perspective-origin:50% 50%;pointer-events:none}
.phone-stage{position:absolute;inset:0;display:grid;place-items:center;transform-style:preserve-3d;filter:drop-shadow(25px 44px 24px #0009)}
.phone-model{--w:258px;--h:530px;--d:22px;position:relative;width:var(--w);height:var(--h);transform-style:preserve-3d;transform:rotateX(-12deg) rotateY(-24deg) rotateZ(-8deg);will-change:transform}
.phone-plane{position:absolute;backface-visibility:hidden;overflow:hidden}
.phone-front,.phone-back{inset:0;border-radius:36px/30px;border:2px solid #3f464b;box-shadow:inset 0 0 0 3px #0b0f12,0 0 0 1px #75808744}
.phone-front{background:#020305;transform:translateZ(calc(var(--d)/2));padding:7px}
.phone-bezel{height:100%;border-radius:28px;overflow:hidden;position:relative;background:#07090a;border:1px solid #30373a}
.phone-screen{position:absolute;inset:0;border-radius:26px;overflow:hidden;background:linear-gradient(#152432,#04080c)}
.phone-screen img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;filter:brightness(.84) saturate(.8)}
.front-camera{position:absolute;top:9px;left:calc(50% - 29px);height:8px;width:8px;border-radius:50%;background:radial-gradient(circle,#174762 0%,#020305 75%);z-index:2;box-shadow:0 0 0 3px #040607}
.earpiece{position:absolute;top:12px;left:calc(50% - 12px);height:3px;width:33px;border-radius:4px;background:#252e33;z-index:2}
.phone-back{transform:rotateY(180deg) translateZ(calc(var(--d)/2));background:linear-gradient(118deg,#171b1f,#303439 18%,#191e22 52%,#090b0e 100%)}
.phone-back:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(110deg,#ffffff05 0 1px,transparent 1px 3px);opacity:.45}
.back-camera{position:absolute;top:26px;left:21px;width:49px;height:49px;background:#13171b;border:4px solid #434c53;box-shadow:0 0 0 5px #101215,0 9px 14px #0008;border-radius:50%;display:grid;place-items:center}
.back-lens{width:27px;height:27px;border-radius:50%;border:3px solid #212c35;background:radial-gradient(circle at 36% 36%,#24546c,#010407 55%)}
.back-flash{position:absolute;top:40px;left:95px;width:13px;height:13px;background:#c6c0a9;border-radius:50%;box-shadow:0 0 3px 3px #9c987638}
.back-logo{position:absolute;left:28px;bottom:39px;font-size:16px;line-height:.9;letter-spacing:-.04em;font-weight:800;color:#737b8166}
.phone-side{background:linear-gradient(90deg,#090c0f,#32383d 48%,#111519);border:1px solid #4c555b;box-shadow:inset 1px 0 3px #a6b0b04d}
.left-side,.right-side{top:30px;bottom:30px;width:var(--d);border-radius:7px}
.left-side{left:0;transform-origin:left center;transform:rotateY(-90deg)}
.right-side{right:0;transform-origin:right center;transform:rotateY(90deg)}
.side-button{position:absolute;width:8px;left:6px;height:48px;border-radius:5px;background:linear-gradient(#566065,#21272b);border:1px solid #8590976b}
.button-one{top:90px}.button-two{top:152px}.power-button{top:100px;height:68px}
.phone-top,.phone-bottom{left:32px;right:32px;height:var(--d);background:linear-gradient(#1b2126,#40474b);border:1px solid #667077;border-radius:8px}
.phone-top{top:0;transform-origin:top center;transform:rotateX(90deg)}
.phone-bottom{bottom:0;transform-origin:bottom center;transform:rotateX(-90deg)}
.bottom-port{position:absolute;width:40px;height:7px;border-radius:5px;left:calc(50% - 20px);top:7px;background:#040506;border:1px solid #56616b}
.speaker-holes{position:absolute;top:9px;left:14px;width:59px;height:4px;background:repeating-linear-gradient(90deg,#040607 0 4px,transparent 4px 10px)}
.model-stage-label{position:absolute;bottom:8px;left:0;width:100%;text-align:center;color:#9ca8b1;font-size:9px;letter-spacing:.24em;font-weight:700}
@media(max-width:960px){.cinema-visual{left:50%;right:auto;top:37%;width:300px;height:560px;transform:translate(-50%,-50%)}.phone-model{--w:220px;--h:455px;--d:20px}.model-stage-label{bottom:0}}
@media(max-width:800px){.cinema-visual{top:32%;height:470px;width:260px}.phone-model{--w:174px;--h:358px;--d:17px}.phone-front,.phone-back{border-radius:26px}.phone-bezel{border-radius:21px}.phone-screen{border-radius:19px}.model-stage-label{bottom:6px}.cinema-caption{bottom:15%}}
/* SPORT EDITION v0.5 — authoritative hero WebGL stage */
.hero{height:230vh;min-height:0;max-height:none;background:#050608}
.hero-webgl-stage{position:absolute;inset:0;z-index:1;pointer-events:auto;touch-action:none;cursor:grab}
.hero-webgl-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;outline-offset:-5px}
.hero-fallback{display:none}
.no-webgl .hero-webgl-stage canvas{display:none}
.no-webgl .hero-fallback{display:block;width:100%;height:100%;object-fit:contain}
.hero-shade{z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(3,5,7,.66),rgba(3,5,7,.08) 43%,transparent 80%)}
.hero-inner{z-index:3;max-width:760px;padding-left:clamp(25px,5.5vw,108px)}
.hero h1{font-size:clamp(64px,8.4vw,148px)}
.hero-lead{max-width:420px}
.hero-bottom{z-index:4}
@media(max-width:800px){.hero{min-height:0}.hero-inner{padding:125px 22px 0}.hero h1{font-size:clamp(57px,13.2vw,92px)}.hero-shade{background:linear-gradient(180deg,#030507dc 0%,#03050780 46%,transparent 85%)}.hero-lead{max-width:280px}.hero-webgl-stage{top:18%}}

@media(min-width:801px){.hero-webgl-stage{left:44%;right:0;inset-block:0}.hero-webgl-stage canvas{width:100%;height:100%}.hero-inner{z-index:3;max-width:640px}.hero h1{font-size:clamp(64px,7.6vw,140px)}}

/* SPORT EDITION v0.6 — sticky product orbit and interactive controls */
.hero-pin{position:sticky;top:0;height:100vh;min-height:640px;overflow:hidden;isolation:isolate}
.hero-webgl-stage.is-dragging{cursor:grabbing}
.hero-webgl-stage canvas:focus-visible{outline:2px solid #aabfd3}
.model-controls{position:absolute;z-index:6;right:clamp(24px,5vw,94px);bottom:87px;display:flex;align-items:center;gap:22px;color:#eef1f3}
.model-controls-hint{display:flex;align-items:center;gap:13px;font:700 9px/1.6 Manrope,Arial,sans-serif;letter-spacing:.13em;color:#c2c9cf;white-space:nowrap}
.model-controls-hint small{font-size:8px;font-weight:500;color:#78838b;letter-spacing:.10em}
.model-controls-mark{font:600 25px/1 Manrope,Arial,sans-serif;letter-spacing:-.06em;color:#d9e2e9}
.model-controls-actions{display:flex;gap:8px}
.model-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:85px;height:39px;padding:0 12px;border:1px solid #e3eef346;background:#141c2399;border-radius:24px;color:#e8edef;cursor:pointer;font:600 9px Manrope,Arial,sans-serif;letter-spacing:.08em;backdrop-filter:blur(7px);transition:background .2s,border-color .2s}
.model-btn:hover,.model-btn:focus-visible{background:#253642;border-color:#dde7eb}
.model-btn svg{width:16px;height:16px}
@media(max-width:960px){.hero-pin{min-height:0}.model-controls{right:24px;bottom:77px}.model-controls-hint small{display:none}}
@media(max-width:800px){.hero{height:205vh}.hero-pin{height:100svh;min-height:570px}.hero-webgl-stage{top:67%;height:30%;bottom:auto;touch-action:none}.model-controls{left:24px;right:24px;bottom:70px;justify-content:space-between;gap:8px}.model-controls-hint{font-size:8px}.model-controls-mark{font-size:20px}.model-btn{min-width:40px;width:40px;padding:0}.model-btn span{display:none}}
@media(max-width:420px){.model-controls-hint{gap:6px;font-size:7px}}
@media(prefers-reduced-motion:reduce){.model-btn{transition:none}}