@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{--ink:#070a18;--panel:#10152a;--paper:#f5f4ed;--yellow:#ffcb05;--muted:#9aa0af;--line:rgba(255,255,255,.17);--pad:clamp(24px,5vw,78px)}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font-family:Manrope,Arial,sans-serif;overflow-x:hidden}
.grain{pointer-events:none;position:fixed;inset:0;opacity:.06;z-index:9;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}
.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);position:absolute;top:0;width:100%;z-index:5}
.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;font-size:20px;font-weight:800;letter-spacing:-.8px}
.brand-logo{width:32px;height:32px;object-fit:cover;border-radius:9px;box-shadow:0 3px 12px rgba(0,0,0,.32)}
.brand-mark{height:29px;width:29px;border:2px solid var(--yellow);border-radius:50%;display:grid;place-items:center;position:relative}
.brand-mark i{position:absolute;height:2px;width:2px;background:var(--yellow);border-radius:50%}
.brand-mark i:nth-child(1){transform:translate(-6px,-4px)}
.brand-mark i:nth-child(2){transform:translate(6px,0)}
.brand-mark i:nth-child(3){transform:translate(-2px,6px)}
nav{display:flex;gap:32px}
nav a,.header-download,footer>a:last-child{font:500 11px/1 'DM Mono',monospace;letter-spacing:.05em;text-transform:uppercase;color:#c8cbd3;text-decoration:none}
.header-download{color:var(--ink);background:var(--yellow);padding:13px 16px}
.header-download span{font-size:14px;margin-left:8px}
.hero{min-height:815px;padding:188px var(--pad) 40px;position:relative;isolation:isolate;background:radial-gradient(ellipse 65% 57% at 75% 58%,#252c54 0%,#11162e 39%,#070a18 75%);overflow:hidden}
.hero-content{max-width:610px;position:relative;z-index:2}
.eyebrow{font:500 11px/1.2 'DM Mono',monospace;letter-spacing:.13em;color:#bdc0cb;margin:0 0 23px;display:flex;align-items:center;gap:10px}
.eyebrow span{width:22px;height:1px;background:var(--yellow);display:block}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(52px,6vw,98px);letter-spacing:-.075em;line-height:.94;margin:0 0 29px;font-weight:800}
h1 em,h2 em{font-style:normal;color:var(--yellow)}
.hero-copy{color:#bbc0cf;line-height:1.65;font-size:17px;max-width:460px;margin-bottom:35px}
.hero-actions{display:flex;align-items:center;gap:25px}
.app-button{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;background:#fff;color:#0b0e18;padding:10px 16px 10px 13px;min-width:162px;transition:transform .25s,background .25s}
.app-button:hover{transform:translateY(-3px);background:var(--yellow)}
.app-button svg{width:24px;height:28px;fill:currentColor}
.app-button span{display:grid;font-weight:700;font-size:16px;line-height:1.05}
.app-button small{font-size:8px;font-weight:500;letter-spacing:.02em}
.text-link{color:white;text-decoration:none;font:500 11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em}
.text-link span{color:var(--yellow);font-size:17px;margin-left:7px}
.hero-device-wrap{position:absolute;right:8%;bottom:-380px;width:min(31vw,430px);z-index:2}
.device{background:#161616;border-radius:42px;padding:9px;box-shadow:0 22px 70px rgba(0,0,0,.55);position:relative}
.device:before{content:"";position:absolute;z-index:1;top:15px;left:50%;transform:translateX(-50%);width:31%;height:25px;border-radius:18px;background:#111}
.device img{display:block;width:100%;height:auto;border-radius:34px}
.zoom-chip{position:absolute;z-index:3;background:rgba(11,14,30,.75);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);padding:12px 15px;display:grid;gap:3px}
.zoom-chip b{font-size:22px;color:var(--yellow)}
.zoom-chip span{font:9px 'DM Mono',monospace;color:#d0d3de}
.chip-left{left:-28px;top:43%}
.chip-right{right:-30px;top:17%}
.hero-halo{position:absolute;inset:20% -15% 0 0;border:1px solid rgba(255,255,255,.11);border-radius:50%;transform:rotate(-24deg)}
.hero-orbit{position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:50%;z-index:-1}
.orbit-a{width:900px;height:900px;right:-300px;top:122px}
.orbit-b{width:1140px;height:1140px;right:-410px;top:4px}
.hero-bottom{position:absolute;bottom:33px;left:var(--pad);right:var(--pad);display:flex;align-items:center;gap:15px;color:#a4a9b9;font:10px 'DM Mono',monospace;letter-spacing:.1em}
.hero-bottom p{margin:0}
.hero-bottom span{height:1px;flex:1;background:var(--line)}
.statement{padding:160px var(--pad) 130px;display:grid;grid-template-columns:1.1fr .7fr;align-items:end;gap:60px;background:var(--paper);color:var(--ink)}
.statement .eyebrow{grid-column:1/-1;color:#5d6270}
.statement h2,.feature h2,.controls h2,.moments h2,.download h2{font-size:clamp(43px,5.4vw,76px);font-weight:800;line-height:.98;letter-spacing:-.07em;margin:0}
.statement h2{max-width:630px}
.statement-copy{font-size:17px;line-height:1.7;max-width:410px;margin:0;color:#494d5a}
.feature{min-height:760px;padding:95px var(--pad);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;overflow:hidden}
.feature-copy{max-width:500px}
.feature-index{font:500 11px 'DM Mono',monospace;letter-spacing:.12em;color:var(--yellow);margin-bottom:60px}
.feature h2{margin-bottom:29px}
.feature h2 mark{background:transparent;color:var(--yellow)}
.feature-copy>p:not(.feature-index):not(.eyebrow){font-size:16px;line-height:1.72;color:#b4b9c7;max-width:420px;margin-bottom:32px}
.spec-row{border-top:1px solid var(--line);padding-top:15px;display:flex;justify-content:space-between;gap:20px;font:10px 'DM Mono',monospace;letter-spacing:.09em}
.spec-row span{color:#9298aa}
.spec-row b{color:#fff}
.feature-art{height:570px;position:relative;display:grid;place-items:center}
.moon-art{background:#12162b}
.moon-art:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 43%,rgba(255,203,5,.23) 43.1%,transparent 43.3%)}
.moon-art .feature-device{width:335px;transform:rotate(5deg);z-index:2}
.moon-glow{position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.23),transparent 67%);filter:blur(16px)}
.moon-lines i{position:absolute;display:block;background:rgba(255,255,255,.24)}
.moon-lines i:nth-child(1){width:1px;height:100%;left:15%}
.moon-lines i:nth-child(2){width:1px;height:100%;right:12%}
.moon-lines i:nth-child(3){height:1px;width:100%;top:24%}
.angle-meter{position:absolute;bottom:0;right:0;left:0;height:130px;background:rgba(7,10,24,.75);z-index:3;clip-path:polygon(0 100%,0 52%,50% 0,100% 52%,100% 100%);display:flex;align-items:end;justify-content:center;gap:35px;padding-bottom:19px;font:12px 'DM Mono',monospace}
.angle-meter b{font-size:24px;color:var(--yellow);margin-bottom:-3px}
.feature-video{background:#0c1020}
.sport-art{order:-1;background:#142b3b}
.sport-art .feature-device{width:330px;transform:rotate(-5deg);z-index:2}
.target-lines i{position:absolute;background:rgba(255,255,255,.32)}
.target-lines i:nth-child(1),.target-lines i:nth-child(3){height:1px;width:150%;left:-25%}
.target-lines i:nth-child(1){top:28%}
.target-lines i:nth-child(3){top:69%}
.target-lines i:nth-child(2),.target-lines i:nth-child(4){width:1px;height:130%;top:-15%}
.target-lines i:nth-child(2){left:22%}
.target-lines i:nth-child(4){right:17%}
.record-badge{position:absolute;z-index:4;top:42px;right:42px;background:#ff4650;padding:10px 12px;font:10px 'DM Mono',monospace;letter-spacing:.07em}
.record-badge i{display:inline-block;width:6px;height:6px;background:white;border-radius:50%;margin-right:6px}
.record-badge b{margin-left:7px}
.controls{background:var(--yellow);color:var(--ink);padding:125px var(--pad)}
.controls-head{display:flex;justify-content:space-between;gap:70px;align-items:end;margin-bottom:65px}
.controls .eyebrow{color:#4d4104}
.controls .eyebrow span{background:#171504}
.controls-head>p{margin:0;max-width:390px;font-size:16px;line-height:1.7}
.control-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(0,0,0,.28)}
.control-grid article{padding:31px 32px 5px 0;border-right:1px solid rgba(0,0,0,.28);margin-right:32px}
.control-grid article:last-child{border:0}
.control-icon{height:56px;width:56px;border:2px solid var(--ink);display:grid;place-items:center;margin-bottom:51px;font:600 14px 'DM Mono',monospace}
.control-icon.focus{position:relative;border-radius:50%}
.control-icon.focus:before,.control-icon.focus:after{content:"";position:absolute;background:var(--ink)}
.control-icon.focus:before{width:21px;height:2px}
.control-icon.focus:after{width:2px;height:21px}
.control-icon.focus i{width:8px;height:8px;border:2px solid var(--ink);border-radius:50%}
.control-icon.format{font-size:12px}
.control-grid h3{font-size:21px;letter-spacing:-.04em;margin-bottom:12px}
.control-grid p{font-size:14px;line-height:1.65;max-width:270px}
.moments{padding:150px var(--pad) 130px;background:var(--paper);color:var(--ink)}
.moments .eyebrow{color:#666a73}
.moments h2{max-width:800px;margin-bottom:78px}
.moments h2 em{color:#525867}
.moments-list{border-top:1px solid #bec0bc}
.moments-list span{display:block;font-weight:800;font-size:clamp(28px,4vw,58px);letter-spacing:-.065em;padding:21px 0;border-bottom:1px solid #bec0bc;transition:color .25s,padding-left .25s}
.moments-list span:hover{color:#797f8f;padding-left:18px}
.download{min-height:590px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px var(--pad);position:relative;overflow:hidden;background:radial-gradient(circle at center,#262d55,#080b19 63%)}
.download>*{position:relative;z-index:1}
.download .eyebrow{color:#d9dbe2}
.download h2{margin-bottom:25px}
.download>p:not(.eyebrow){color:#b9bdca;max-width:360px;line-height:1.65;margin-bottom:30px}
.download-orbit{position:absolute!important;z-index:0!important;width:760px;height:760px;border-radius:50%;border:1px solid rgba(255,255,255,.17);box-shadow:0 0 0 70px rgba(255,255,255,.03),0 0 0 140px rgba(255,255,255,.02)}
footer{padding:28px var(--pad);display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);gap:20px}
footer .brand{font-size:16px}
footer .brand-logo{width:25px;height:25px;border-radius:7px}
footer .brand-mark{height:23px;width:23px}
footer p{margin:0;color:#9095a4;font:10px 'DM Mono',monospace;letter-spacing:.03em}

@media(max-width:780px){.site-header{height:68px}
.site-header nav{display:none}
.header-download{font-size:9px;padding:11px 12px}
.hero{min-height:970px;padding-top:145px}
.hero-content{max-width:100%}
.hero-copy{font-size:15px;max-width:330px}
.hero-device-wrap{width:300px;right:50%;transform:translateX(50%);bottom:-225px}
.device{border-radius:28px;padding:6px}
.device img{border-radius:23px}
.chip-left{left:-7px}
.chip-right{right:-10px}
.hero-bottom{display:none}
.statement{padding-top:105px;padding-bottom:85px;display:block}
.statement .eyebrow{margin-bottom:35px}
.statement h2{margin-bottom:30px}
.feature{padding-top:78px;padding-bottom:78px;grid-template-columns:1fr;gap:50px;min-height:auto}
.feature-copy{max-width:none}
.feature-index{margin-bottom:35px}
.feature-art{height:440px;width:calc(100% + 12px)}
.moon-art .feature-device,.sport-art .feature-device{width:260px}
.feature-video .feature-art{order:0}
.controls{padding-top:85px;padding-bottom:85px}
.controls-head{display:block;margin-bottom:44px}
.controls-head h2{margin-bottom:28px}
.control-grid{grid-template-columns:1fr}
.control-grid article{margin:0;padding:25px 0;border-right:0;border-bottom:1px solid rgba(0,0,0,.28);display:grid;grid-template-columns:76px 1fr;column-gap:15px}
.control-grid article:last-child{border-bottom:0}
.control-icon{margin:0;grid-row:span 2;height:48px;width:48px}
.control-grid h3{margin:0 0 6px}
.control-grid p{margin:0}
.moments{padding-top:95px;padding-bottom:80px}
.moments h2{margin-bottom:45px}
.download{min-height:530px}
footer{flex-wrap:wrap;padding-top:24px;padding-bottom:24px}
footer p{order:3;width:100%}
.app-button{min-width:156px}
h1{letter-spacing:-.07em}
}