:root{
  --bg:#071126;
  --bg-deep:#030812;
  --bg-soft:#0d1831;
  --text:#eef3ff;
  --muted:#c6d0e6;
  --line:rgba(138,174,255,.18);
  --line-strong:rgba(138,174,255,.28);
  --glow:rgba(70,126,255,.24);
  --glow-strong:rgba(112,165,255,.48);
  --card-top:rgba(10,18,39,.74);
  --card-bottom:rgba(5,11,24,.62);
  --shadow:0 34px 90px rgba(0,0,0,.44);
  --radius:34px;
}

*{box-sizing:border-box}
html,body{height:100%; overflow:hidden}
html{scroll-behavior:smooth}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}

body{
  margin:0;
  font:16px/1.6 Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 50% 28%, rgba(67,122,255,.23), transparent 34%),
    radial-gradient(circle at 50% 50%, rgba(24,54,115,.24), transparent 55%),
    linear-gradient(180deg, var(--bg-deep), var(--bg));
}
body.splash-lock{overflow:hidden}

a{color:var(--text); text-decoration:none}
a:hover{opacity:.92}

.splash{
  position:fixed; inset:0; z-index:9999;
  display:grid; place-items:center;
  background:
    radial-gradient(circle at 50% 35%, rgba(75,123,255,.20), transparent 55%),
    linear-gradient(180deg, #070a14, #0b0f1c);
  opacity:1;
  transition: opacity 700ms ease, filter 700ms ease;
}

.splash-canvas,
.maintenance-canvas{
  position:absolute; inset:0;
  width:100%; height:100%;
  opacity:.95;
  filter: blur(.2px) saturate(1.08);
}

.splash-inner{
  position:relative;
  width:min(720px, 86vw);
  display:grid;
  place-items:center;
  gap:14px;
  padding:10vh 0;
  z-index:2;
}

.splash-logo{
  width:min(720px, 88vw);
  max-height:42vh;
  height:auto;
  opacity:0;
  transform: translateY(10px) scale(.92);
  filter:
    drop-shadow(0 18px 55px rgba(0,0,0,.35))
    drop-shadow(0 0 22px rgba(75,123,255,.55));
  animation: ignitionLogoIn 900ms cubic-bezier(.2,1.05,.2,1) 520ms forwards;
}

.splash.fade-out{
  opacity:0;
  filter: blur(2px);
  pointer-events:none;
}

@keyframes ignitionLogoIn{
  0%{opacity:0; transform: translateY(10px) scale(.92)}
  60%{opacity:1; transform: translateY(0) scale(1.02)}
  100%{opacity:1; transform: translateY(0) scale(1)}
}

.comingsoon-page{
  position:relative;
  height:100vh;
  height:100svh;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 18%, rgba(66,118,255,.22), transparent 28%),
    radial-gradient(circle at 50% 50%, rgba(16,38,86,.23), transparent 58%),
    linear-gradient(180deg, #040914 0%, #071126 52%, #050d1c 100%);
}

.comingsoon-page::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(3,8,18,.28), transparent 30%, transparent 70%, rgba(3,8,18,.18)),
    radial-gradient(circle at 50% 50%, rgba(86,137,255,.06), transparent 62%);
  pointer-events:none;
  z-index:0;
}

.page-header{
  position:absolute;
  top:12px;
  left:18px;
  z-index:3;
}

.brand-logo{
  width:clamp(160px, 14vw, 300px);
  height:auto;
  opacity:.92;
  filter:
    drop-shadow(0 12px 30px rgba(0,0,0,.32))
    drop-shadow(0 0 16px rgba(82,132,255,.16));
}

.hero-shell{
  position:relative;
  z-index:2;
  height:100vh;
  height:100svh;
  display:grid;
  place-items:center;
  padding:92px 24px 72px;
}

.hero-card{
  width:min(860px, calc(100vw - 48px));
  min-height:clamp(300px, 52vh, 470px);
  padding:44px 52px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background: linear-gradient(180deg, var(--card-top), var(--card-bottom));
  box-shadow:var(--shadow);
  backdrop-filter: blur(12px);
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
}

.hero-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:
    radial-gradient(circle at 50% 0%, rgba(111,167,255,.12), transparent 42%),
    radial-gradient(circle at 100% 100%, rgba(63,110,229,.08), transparent 36%);
  pointer-events:none;
}

.hero-card > *{position:relative; z-index:1}

.card-network{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  pointer-events:none;
  transition:opacity 380ms ease;
  z-index:2;
}

.hero-card.is-transitioning .card-network,
.hero-card.is-network-visible .card-network{
  opacity:1;
}

.hero-state{
  width:100%;
  text-align:center;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:0;
  max-width:100%;
  transition:opacity 620ms ease, transform 620ms ease, filter 620ms ease;
  z-index:3;
}

.hero-state-primary{opacity:0;}
.hero-state-secondary{
  opacity:0;
  position:absolute;
  inset:0;
  padding:40px 46px;
  place-items:center;
  transform:translateY(10px);
}

.hero-launch-panel{
  width:min(760px, 100%);
  display:grid;
  grid-template-columns:minmax(118px, 156px) minmax(0, 1fr);
  align-items:center;
  justify-content:center;
  gap:clamp(22px, 4vw, 36px);
}

.launch-emblem{
  position:relative;
  width:clamp(118px, 16vw, 156px);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:radial-gradient(circle at 50% 45%, rgba(110,162,255,.18), rgba(6,13,29,.02) 62%, transparent 76%);
  filter:drop-shadow(0 14px 34px rgba(8,16,34,.32)) drop-shadow(0 0 24px rgba(104,156,255,.18));
}

.launch-emblem::before{
  content:"";
  position:absolute;
  inset:14%;
  border-radius:50%;
  background:radial-gradient(circle at 50% 38%, rgba(133,187,255,.12), rgba(3,8,18,0) 68%);
  box-shadow:inset 0 0 0 1px rgba(152,197,255,.08);
}

.launch-emblem-ring{
  position:absolute;
  inset:50%;
  border-radius:50%;
  border:1px solid rgba(162,205,255,.16);
  transform-origin:center;
}

.launch-emblem-ring::before,
.launch-emblem-ring::after{
  content:"";
  position:absolute;
  width:8px;
  height:8px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #f5fbff, #9cd0ff 72%);
  box-shadow:0 0 16px rgba(140,196,255,.46);
}

.launch-emblem-ring-outer{
  width:100%;
  height:100%;
  margin:-50%;
  animation:orbitSpin 18s linear infinite;
}

.launch-emblem-ring-outer::before{top:8%; left:50%; transform:translate(-50%, 0);}
.launch-emblem-ring-outer::after{right:5%; top:48%; transform:translate(0, -50%);}

.launch-emblem-ring-middle{
  width:82%;
  height:82%;
  margin:-41%;
  border-style:dashed;
  border-color:rgba(157,201,255,.2);
  animation:orbitSpinReverse 12s linear infinite;
}

.launch-emblem-ring-middle::before{left:10%; top:18%;}
.launch-emblem-ring-middle::after{left:42%; bottom:-4px;}

.launch-emblem-ring-inner{
  width:66%;
  height:66%;
  margin:-33%;
  border-color:rgba(129,182,255,.14);
  animation:corePulse 5.4s ease-in-out infinite;
}

.launch-emblem-ring-inner::before{right:10%; top:22%; width:6px; height:6px;}
.launch-emblem-ring-inner::after{left:12%; bottom:16%; width:6px; height:6px;}

.launch-emblem-svg{
  position:relative;
  width:76%;
  height:76%;
  z-index:1;
}

.launch-orbit-a{
  animation:orbitSpin 14s linear infinite;
  transform-origin:90px 90px;
}

.launch-orbit-b{
  animation:orbitSpinReverse 10s linear infinite;
  transform-origin:90px 90px;
}

.launch-core{
  transform-origin:90px 90px;
  animation:corePulse 4.8s ease-in-out infinite;
}

.hero-launch-copy{
  display:grid;
  gap:14px;
  text-align:left;
  justify-items:start;
}

.hero-launch-kicker{
  margin:0;
  font-size:12px;
  font-weight:700;
  line-height:1;
  letter-spacing:.28em;
  color:rgba(218,231,255,.7);
}

.hero-launch-subtitle{
  margin:0;
  max-width:470px;
  font-size:clamp(14px, 1.2vw, 17px);
  line-height:1.55;
  color:rgba(203,216,239,.78);
  letter-spacing:.01em;
}

@keyframes orbitSpin{
  from{transform:rotate(0deg);}
  to{transform:rotate(360deg);}
}

@keyframes orbitSpinReverse{
  from{transform:rotate(360deg);}
  to{transform:rotate(0deg);}
}

@keyframes corePulse{
  0%,100%{transform:scale(1); opacity:1;}
  50%{transform:scale(1.035); opacity:.94;}
}

.hero-state.is-visible{
  opacity:1;
  transform:translateY(0);
  filter:none;
}

.hero-state.is-leaving{
  opacity:0;
  transform:translateY(-10px);
  filter:blur(10px);
}

.hero-kicker{
  margin:0 0 22px;
  font-size:11px;
  font-weight:700;
  line-height:1;
  letter-spacing:.28em;
  color:rgba(238,243,255,.72);
}

.hero-card h1{
  margin:0;
  max-width:780px;
  font-weight:745;
  letter-spacing:-.042em;
  line-height:1.02;
  font-size:clamp(30px, 4.2vw, 54px);
  text-wrap:balance;
}


.hero-lead{
  width:min(740px, 100%);
  margin:28px auto 0;
  font-size:clamp(15px, 1.32vw, 18px);
  line-height:1.45;
  color:rgba(198,208,230,.84);
  letter-spacing:.015em;
  white-space:nowrap;
}


.hero-final-message{
  margin:0;
  max-width:900px;
  font-size:clamp(20px, 3.55vw, 36px);
  line-height:1.08;
  letter-spacing:-.038em;
  font-weight:600;
  color:rgba(245,249,255,.98);
}

.hero-final-message-text{
  display:block;
}

.hero-final-line{
  display:inline-flex;
  align-items:baseline;
  gap:.34em;
  white-space:nowrap;
}

.hero-final-soon{
  display:inline-block;
}

.hero-final-dots{
  display:inline-flex;
  align-items:baseline;
  gap:10px;
  transform:translateY(-0.02em);
}

.hero-final-dot{
  width:.36em;
  height:.36em;
  border-radius:50%;
  display:inline-block;
  opacity:.42;
  transform:scale(.9);
  box-shadow:0 0 0 0 rgba(255,255,255,.04);
  animation:heroDotPulse 1.8s infinite ease-in-out;
}

.hero-final-dot-red{
  background:#b92c3c;
  animation-delay:0s;
}

.hero-final-dot-white{
  background:#e7edf8;
  animation-delay:.28s;
}

.hero-final-dot-green{
  background:#0d7f57;
  animation-delay:.56s;
}

@keyframes heroDotPulse{
  0%,100%{opacity:.38; transform:scale(.9); box-shadow:0 0 0 0 rgba(255,255,255,.02);}
  28%{opacity:1; transform:scale(1.18); box-shadow:0 0 16px 1px rgba(255,255,255,.12);}
  42%{opacity:.74; transform:scale(1);}
}

.page-footer{
  position:absolute;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px 10px;
  width:min(1100px, calc(100vw - 28px));
  font-size:12px;
  letter-spacing:.09em;
  color:rgba(214,225,246,.7);
  text-align:center;
}

.page-footer span,
.page-footer a{
  white-space:nowrap;
}

.page-footer a{
  color:rgba(231,241,255,.86);
}

.page-footer a:hover{
  color:rgba(248,251,255,1);
}

.footer-separator{
  color:rgba(133,171,229,.48);
}

@media (max-width: 900px){
  .page-header{
    top:10px;
    left:12px;
  }

  .hero-shell{
    padding:94px 16px 66px;
  }

  .hero-card{
    width:min(860px, calc(100vw - 32px));
    min-height:clamp(290px, 50vh, 450px);
    padding:30px 24px;
    border-radius:26px;
  }

  .hero-state-secondary{
    padding:30px 24px;
  }

  .hero-launch-panel{
    grid-template-columns:minmax(104px, 132px) minmax(0, 1fr);
    gap:20px;
  }

  .hero-launch-kicker{
    font-size:11px;
    letter-spacing:.22em;
  }

  .hero-kicker{
    font-size:10px;
    letter-spacing:.2em;
    margin-bottom:18px;
  }


  .hero-lead{
    margin-top:22px;
    font-size:14px;
    line-height:1.48;
    white-space:normal;
  }
}

@media (max-width: 560px){
  .brand-logo{
    width:136px;
  }

  .hero-shell{
    padding-top:88px;
    padding-bottom:60px;
  }

  .hero-card{
    min-height:clamp(270px, 46vh, 400px);
    padding:24px 18px;
  }

  .hero-state-secondary{
    padding:24px 18px;
  }

  .hero-launch-panel{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    gap:18px;
  }

  .launch-emblem{
    width:108px;
  }

  .hero-launch-copy{
    justify-items:center;
    text-align:center;
    gap:12px;
  }

  .hero-final-line{
    justify-content:center;
  }

  .hero-launch-kicker{
    font-size:10px;
    letter-spacing:.18em;
  }

  .hero-launch-subtitle{
    max-width:100%;
    font-size:13px;
    line-height:1.5;
  }

  .hero-kicker{
    font-size:9px;
    letter-spacing:.16em;
  }

  .hero-card h1{
    line-height:1.04;
    font-size:clamp(28px, 8.8vw, 42px);
  }


  .hero-lead{
    margin-top:18px;
    font-size:13px;
    line-height:1.5;
    white-space:normal;
  }

  .page-footer{
    bottom:14px;
    gap:4px 8px;
    font-size:10px;
    letter-spacing:.06em;
  }
}