@font-face{font-family:Manrope;src:url('./manrope-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('./manrope-latin-600-normal.woff2') format('woff2');font-weight:600 800;font-display:swap}
@font-face{font-family:Barlow;src:url('./barlow-condensed-latin-800-normal.woff2') format('woff2');font-weight:800;font-display:swap}
:root{color-scheme:dark;--background:#050609;--white:#eff1f8;--muted:#9297a6;--blue:#2862ff;--line:rgba(159,174,221,.13)}
*{box-sizing:border-box}
html{background:var(--background);min-width:280px}
body{margin:0;color:var(--white);font-family:Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}
body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:3;opacity:.025;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='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.65' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid #799aff;outline-offset:7px}
::selection{background:#245dff;color:#fff}
.page{max-width:1920px;margin:auto;min-height:100svh;display:flex;flex-direction:column;padding:0 clamp(24px,4.4vw,84px);overflow:hidden;background:radial-gradient(ellipse at 50% 44%,rgba(8,24,72,.22),transparent 63%)}
.header{display:flex;align-items:center;justify-content:space-between;padding:32px 0 26px;border-bottom:1px solid var(--line);position:relative;z-index:2;gap:20px}
.brand{display:inline-flex;align-items:center;gap:11px}
.brand-mark{width:43px;height:43px}
.brand-name{font-size:13px;line-height:1.18;letter-spacing:1.8px;font-weight:800}
.brand-name>span{display:block;font-size:20px;letter-spacing:3.4px}
.brand-dot{font-size:9px;vertical-align:top;letter-spacing:0;margin-left:3px}
.header-note{display:flex;align-items:center;gap:11px;color:#a9afc2;font-size:10px;letter-spacing:2px}
.status-dot{width:5px;height:5px;border-radius:50%;background:#407aff;box-shadow:0 0 12px #2e64ff}
main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 0 46px}
.intro{display:flex;align-items:center;gap:12px;font-size:10px;font-weight:600;letter-spacing:3px;color:#b5bbca;position:relative;z-index:1}
.intro-line{width:23px;height:1px;background:var(--blue)}
.hero{position:relative;width:100%;height:clamp(280px,min(43vw,calc(100svh - 440px)),560px);margin:8px 0 -5px;display:grid;place-items:center;isolation:isolate}
.hero-glow{position:absolute;width:85%;height:85%;border-radius:50%;background:radial-gradient(ellipse,rgba(12,51,185,.14),transparent 65%);z-index:-2}
#scene{position:absolute;inset:0;z-index:1;pointer-events:none}
#scene canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .6s ease}
.scene-ready #scene canvas{opacity:1}
.hero-title{position:relative;font-family:Barlow,Impact,'Arial Narrow',sans-serif;font-size:clamp(105px,17vw,230px);font-weight:800;line-height:.84;letter-spacing:-.02em;text-align:center;margin:0;transform:perspective(1000px) rotateY(-10deg) rotateX(5deg) rotateZ(-5deg);text-shadow:1px 1px #9aabc6,2px 2px #879ab9,3px 3px #697e9f,4px 4px #486086,5px 5px #354f75,6px 6px #223b63,7px 7px #1a3155,8px 8px #152748,15px 20px 30px #000;transition:opacity .4s ease}
.hero-title span{display:block}
.hero-title span+span{color:#245dff;text-shadow:1px 1px #1744c8,2px 2px #153cb2,3px 3px #1437a1,4px 4px #122e86,5px 5px #102971,6px 6px #0e225d,7px 7px #0b1c50,8px 8px #0a1842,15px 20px 30px #000}
.scene-ready .hero-title{opacity:0}
.orbit{position:absolute;left:50%;top:50%;width:75%;height:88%;border:1px solid rgba(68,103,197,.11);border-radius:50%;transform:translate(-50%,-50%) rotate(-23deg) scaleY(.68);z-index:-1;pointer-events:none}
.orbit-two{width:85%;height:105%;transform:translate(-50%,-50%) rotate(23deg) scaleY(.68);border-color:rgba(68,103,197,.055)}
.hero-index,.hero-side{position:absolute;color:#707990;font-size:9px;letter-spacing:2px;z-index:2}
.hero-index{left:0;top:50%;writing-mode:vertical-rl;transform:rotate(180deg)}
.hero-side{right:0;top:50%;writing-mode:vertical-rl}
.message{text-align:center;position:relative;z-index:2}
.tagline{font-size:clamp(20px,2.1vw,28px);font-weight:400;letter-spacing:-.7px;line-height:1.45;margin:0 0 10px}
.description{font-size:13px;line-height:1.7;color:var(--muted);margin:0}
.coming-label{margin:25px auto 0;display:inline-flex;align-items:center;gap:11px;color:#94afff;border:1px solid rgba(72,113,246,.22);border-radius:4px;padding:10px 14px;font-size:9px;font-weight:600;letter-spacing:2px;background:rgba(25,57,143,.09)}
.equalizer{display:flex;gap:2px;align-items:center;height:14px}
.equalizer i{width:2px;background:#5083ff;height:6px;transform-origin:center}
.motion-enabled .equalizer i{animation:frequency 1.3s ease-in-out infinite alternate}
.equalizer i:nth-child(2){height:11px;animation-delay:-.9s}
.equalizer i:nth-child(3){height:14px;animation-delay:-.5s}
.equalizer i:nth-child(4){height:8px;animation-delay:-.2s}
.equalizer i:nth-child(5){height:5px;animation-delay:-.7s}
@keyframes frequency{from{transform:scaleY(.45)}to{transform:scaleY(1)}}
.footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 0 28px;font-size:8px;color:#9ba1b2;letter-spacing:1.4px}
.location{display:flex;align-items:center;gap:14px;line-height:1.8}
.location-cross{font-size:24px;font-weight:400;line-height:1;color:#5b7fd8}
.coordinates{display:block;color:#747d92;font-size:8px;letter-spacing:1px;margin-top:2px}
.footer-signoff{font-size:8px;letter-spacing:1.4px;color:#838c9f}
.motion-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 0 10px 10px;background:none;border:0;color:#aeb7cb;font-size:10px;cursor:pointer;white-space:nowrap;transition:color .2s}
.motion-toggle:hover{color:#fff}
.motion-toggle[hidden]{display:none}
.motion-icon{width:9px;height:10px;border-left:2px solid currentColor;border-right:2px solid currentColor}
.is-paused .motion-icon{width:0;height:0;border:5px solid transparent;border-right:0;border-left:7px solid currentColor}
.is-paused .equalizer i{animation-play-state:paused}
@media(min-width:1500px) and (min-height:1080px){.hero{height:640px}}
@media(max-width:700px){.header{padding:25px 0 23px}.brand-mark{width:36px;height:36px}.brand-name{font-size:10px;letter-spacing:1.5px}.brand-name>span{font-size:16px;letter-spacing:2.6px}.header-note{font-size:8px;letter-spacing:1.4px;gap:8px}main{padding:43px 0 44px}.intro{font-size:8px;letter-spacing:2px;gap:9px}.intro-line{width:17px}.hero{height:clamp(320px,74vw,450px);margin:8px -12px 2px;width:calc(100% + 24px)}.hero-title{font-size:clamp(108px,24vw,175px)}.hero-index,.hero-side{display:none}.orbit{width:110%;height:75%}.orbit-two{width:125%;height:89%}.tagline{font-size:21px;letter-spacing:-.65px}.description{font-size:11px}.coming-label{margin-top:24px;font-size:8px;padding:9px 12px}.footer{padding:20px 0;gap:10px}.footer-signoff{display:none}.location{gap:10px;font-size:7px;letter-spacing:1.2px}.coordinates{font-size:7px}.motion-toggle{font-size:9px}}
@media(max-width:360px){.page{padding:0 20px}.header-note{font-size:7px;letter-spacing:1px}.brand{gap:6px}.hero{height:295px}.hero-title{font-size:101px}.tagline{font-size:18px}.intro{font-size:7px}.description{font-size:10px}}
@media(max-height:740px) and (min-width:701px){.header{padding:22px 0 18px}main{padding:25px 0 28px}.hero{height:clamp(240px,calc(100svh - 350px),360px)}.coming-label{margin-top:18px}.footer{padding:14px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
