:root{
  --navy:#031a3d;
  --navy-2:#061f47;
  --teal:#11c8c8;
  --orange:#ff7a00;
  --white:#f8fbff;
  --muted:#9fb5ce;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at 50% 18%,rgba(11,59,116,.56),transparent 35%),
    linear-gradient(180deg,#020d22 0%,#031a3d 55%,#021126 100%);
  color:var(--white);
  overflow:hidden;
}
body::after{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 25%,rgba(0,0,0,.18));
  z-index:8;
}
#stars{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.grid{
  position:fixed;inset:45% -10% -30%;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(17,200,200,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,200,200,.09) 1px,transparent 1px);
  background-size:46px 46px;
  transform:perspective(620px) rotateX(64deg);
  transform-origin:center top;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 72%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 72%);
}
.aurora{position:fixed;border-radius:50%;filter:blur(80px);opacity:.28;z-index:0;pointer-events:none}
.aurora-a{width:38vw;height:38vw;left:-8vw;top:15vh;background:var(--teal);animation:driftA 10s ease-in-out infinite alternate}
.aurora-b{width:30vw;height:30vw;right:-6vw;top:8vh;background:var(--orange);opacity:.14;animation:driftB 13s ease-in-out infinite alternate}
.hero{
  position:relative;z-index:2;
  min-height:calc(100vh - 58px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:30px 24px 24px;
  text-align:center;isolation:isolate;
}
.brand-wrap{
  width:min(860px,78vw);
  filter:drop-shadow(0 24px 55px rgba(0,0,0,.35));
  animation:float 5s ease-in-out infinite;
  will-change:transform;
  margin-bottom:18px;
}
.brand{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.content{margin-top:0;max-width:900px;width:100%}
.badge{
  display:inline-flex;align-items:center;gap:10px;padding:9px 14px;
  border:1px solid rgba(255,255,255,.13);border-radius:999px;
  background:rgba(255,255,255,.055);backdrop-filter:blur(10px);
  font-size:12px;letter-spacing:.11em;text-transform:uppercase;color:#d8e8f8
}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 0 rgba(17,200,200,.7);animation:pulse 1.8s infinite}
h1{font-size:clamp(42px,5.5vw,78px);line-height:.98;margin:20px 0 14px;letter-spacing:-.045em}
.lead{margin:0 auto;color:var(--muted);font-size:clamp(16px,1.8vw,22px);line-height:1.4;max-width:none;white-space:nowrap}
.categories{
  margin:24px auto 0;
  display:flex;flex-wrap:nowrap;justify-content:center;gap:10px;
  max-width:none;white-space:nowrap;
}
.categories span{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:36px;padding:8px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(3,26,61,.45);
  box-shadow:0 8px 30px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(10px);
  color:#d9e8f7;font-size:12.5px;letter-spacing:.01em;
  animation:chipFloat 4.2s ease-in-out infinite;
  animation-delay:calc(var(--i) * .22s);
}
.categories span:nth-child(2n){border-color:rgba(17,200,200,.2)}
.categories span:nth-child(3n){border-color:rgba(255,122,0,.18)}
.coming-card{
  margin:24px auto 0;display:flex;align-items:center;justify-content:space-between;text-align:left;
  max-width:480px;padding:16px 18px 16px 20px;border-radius:20px;
  border:1px solid rgba(255,255,255,.13);
  background:linear-gradient(120deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  box-shadow:0 16px 60px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px)
}
.coming-card strong{display:block;font-size:18px;letter-spacing:.05em;margin-top:3px}
.eyebrow{font-size:10px;letter-spacing:.18em;color:var(--teal)}
.rocket{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--orange),#ff9a18);color:white;font-size:25px;box-shadow:0 10px 26px rgba(255,122,0,.28);animation:rocketNudge 1.8s ease-in-out infinite}
.orbit{position:absolute;border:1px solid rgba(17,200,200,.11);border-radius:50%;pointer-events:none;z-index:-1}
.orbit::before{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 20px var(--teal);top:50%;left:-4px;transform:translateY(-50%)}
.orbit-1{width:min(850px,72vw);height:min(850px,72vw);animation:spin 28s linear infinite}
.orbit-2{width:min(650px,55vw);height:min(650px,55vw);border-color:rgba(255,122,0,.08);animation:spinReverse 20s linear infinite}
.orbit-3{width:min(1050px,86vw);height:min(1050px,86vw);opacity:.38;animation:spin 42s linear infinite}
.shooting-star{position:absolute;width:130px;height:2px;background:linear-gradient(90deg,transparent,#fff);opacity:0;transform:rotate(-30deg);filter:drop-shadow(0 0 6px #fff)}
.s1{top:18%;left:-10%;animation:shoot 8s 1s infinite}.s2{top:42%;left:-20%;animation:shoot 11s 5s infinite}
footer{position:relative;z-index:3;height:58px;display:flex;justify-content:center;align-items:center;gap:8px;color:#6f8baa;font-size:12px;letter-spacing:.04em;padding:0 12px}.dot{color:var(--teal)}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes chipFloat{0%,100%{transform:translateY(0);opacity:.9}50%{transform:translateY(-5px);opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spinReverse{to{transform:rotate(-360deg)}}
@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(17,200,200,0)}100%{box-shadow:0 0 0 0 rgba(17,200,200,0)}}
@keyframes rocketNudge{0%,100%{transform:translate(0,0)}50%{transform:translate(4px,-4px)}}
@keyframes shoot{0%,74%{opacity:0;transform:translate(0,0) rotate(-30deg)}76%{opacity:1}84%{opacity:0;transform:translate(140vw,-60vh) rotate(-30deg)}100%{opacity:0}}
@keyframes driftA{to{transform:translate(12vw,-4vh) scale(1.08)}}
@keyframes driftB{to{transform:translate(-10vw,7vh) scale(.92)}}
@media (max-height:820px) and (min-width:701px){
  .hero{padding-top:22px}
  .brand-wrap{width:min(620px,58vw)}
  h1{font-size:clamp(40px,5vw,64px);margin-top:16px}
  .categories{margin-top:18px}
  .coming-card{margin-top:18px}
}
@media (max-width:700px){
  body{overflow:auto;min-height:100%}
  .hero{min-height:calc(100svh - 52px);padding:26px 18px 24px;gap:7px}
  .brand-wrap{width:min(92vw,560px);margin-bottom:14px}
  .content{margin-top:0}
  h1{font-size:clamp(40px,12vw,58px);margin-top:18px}
  .lead{font-size:15px;white-space:normal;max-width:92vw}
  .categories{gap:8px;margin-top:20px;justify-content:flex-start;overflow-x:auto;max-width:100%;padding:0 4px 6px;scrollbar-width:none}
  .categories span{font-size:12px;min-height:34px;padding:7px 12px}
  .coming-card{width:min(100%,430px);margin-top:22px}
  footer{height:52px;flex-wrap:wrap;text-align:center}
  .orbit-1{width:92vw;height:92vw}.orbit-2{width:72vw;height:72vw}.orbit-3{width:118vw;height:118vw}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}

@media (max-width:700px){.categories::-webkit-scrollbar{display:none}.categories span{flex:0 0 auto}}