:root{
  --void-indigo:#090125;
  --nebula-violet:#3D0E4D;
  --rim-violet:#6A36BE;
  --ignition-gold:#F9A738;
  --thruster-orange:#F17D27;
  --cape-magenta:#DC3A89;
  --core-white:#FBF2F1;
  --console-white:#F2F6FF;
  --slate-blue:#6B7A99;
  --cruise-cyan:#4DD0E1;

  --bg:var(--void-indigo);
  --ink:var(--console-white);
  --muted:#9aa3bd;

  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --display:"Space Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;

  --maxw:1160px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:
    radial-gradient(1200px 800px at 78% -8%, rgba(106,54,190,.28), transparent 60%),
    radial-gradient(900px 700px at 0% 108%, rgba(220,58,137,.16), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family:var(--display);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}

.skip{position:absolute;left:-999px;top:0;background:var(--core-white);color:#111;padding:.6rem 1rem;z-index:10;border-radius:6px}
.skip:focus{left:12px;top:12px}

:focus-visible{outline:2px solid var(--cruise-cyan);outline-offset:3px;border-radius:4px}

/* ---- shared ---- */
.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--slate-blue);
  margin:0 0 1rem;
}

/* ---- topbar ---- */
.topbar{
  max-width:var(--maxw);
  margin:0 auto;
  padding:1.4rem 1.5rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.brand{display:flex;align-items:center;gap:.7rem}
.brand-mark{border-radius:9px}
.brand-word{
  font-family:var(--mono);font-weight:700;
  font-size:.9rem;letter-spacing:.16em;
}
.status-chip{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.2em;
  color:var(--muted);
  border:1px solid rgba(155,163,189,.28);
  padding:.4rem .7rem;border-radius:100px;
  display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;
}
.pip{
  width:7px;height:7px;border-radius:50%;
  background:var(--ignition-gold);
  box-shadow:0 0 10px var(--ignition-gold);
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:1}}

/* ---- hero ---- */
.hero{
  max-width:var(--maxw);
  margin:2rem auto 0;
  padding:0 1.5rem;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:2.5rem;
  align-items:center;
  min-height:66vh;
}
.hero-copy{max-width:34rem}
.headline{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(2.6rem,6vw,4.6rem);
  line-height:1.02;
  letter-spacing:-.02em;
  margin:.2rem 0 1.1rem;
}
.lede{
  color:var(--muted);
  font-size:clamp(1rem,1.4vw,1.12rem);
  max-width:32rem;
  margin:0 0 1.8rem;
}
.telemetry{
  display:flex;flex-wrap:wrap;gap:1.6rem;
  margin:0 0 2rem;padding:1rem 0;
  border-top:1px solid rgba(155,163,189,.16);
  border-bottom:1px solid rgba(155,163,189,.16);
}
.telemetry div{display:flex;flex-direction:column;gap:.25rem}
.telemetry dt{
  font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--slate-blue);
}
.telemetry dd{
  margin:0;font-family:var(--mono);font-weight:500;
  font-size:.9rem;color:var(--console-white);
  font-variant-numeric:tabular-nums;
}

.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.btn{
  font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;
  padding:.85rem 1.4rem;border-radius:100px;
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{
  color:#1a0b02;font-weight:700;
  background:linear-gradient(100deg,var(--ignition-gold),var(--cape-magenta));
  box-shadow:0 6px 26px rgba(220,58,137,.32);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 34px rgba(220,58,137,.45)}
.btn-primary.is-soon{
  background:transparent;color:var(--muted);font-weight:500;
  border:1px solid rgba(155,163,189,.3);box-shadow:none;cursor:default;
}
.btn-ghost{
  color:var(--muted);
  border:1px solid rgba(155,163,189,.28);
  cursor:default;
}

.hero-art{position:relative}
.hero-art img{
  width:100%;border-radius:18px;
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}

/* ---- signature trace line ---- */
.trace{
  display:block;width:100%;height:110px;margin:3.5rem 0 1rem;
  opacity:.9;
}
.trace-path{
  filter:drop-shadow(0 0 6px rgba(249,167,56,.5));
  stroke-dasharray:2000;stroke-dashoffset:2000;
  animation:draw 2.6s ease forwards .3s;
}
@keyframes draw{to{stroke-dashoffset:0}}

/* ---- mission band ---- */
.band{
  max-width:760px;margin:1rem auto;padding:3rem 1.5rem;text-align:center;
}
.band-head{
  font-family:var(--display);font-weight:600;
  font-size:clamp(1.7rem,3.4vw,2.5rem);
  letter-spacing:-.015em;line-height:1.12;margin:0 0 1.1rem;
}
.band-copy{color:var(--muted);font-size:1.05rem;margin:0 auto;max-width:34rem}

/* ---- ship ---- */
.ship{
  max-width:var(--maxw);margin:2rem auto 4rem;padding:0 1.5rem;
  display:grid;grid-template-columns:.9fr 1.1fr;gap:2.5rem;align-items:center;
}
.ship-art img{
  width:100%;max-width:380px;margin:0 auto;
  filter:drop-shadow(0 20px 50px rgba(0,0,0,.6));
}
.ship-copy .band-head,.ship-copy .band-copy{text-align:left}
.ship-copy .band-copy{margin:0}

/* ---- footer ---- */
.foot{
  border-top:1px solid rgba(155,163,189,.14);
  padding:2.6rem 1.5rem;text-align:center;
}
.foot-mark{margin:0 auto .9rem;border-radius:10px;opacity:.9}
.foot-line{
  font-family:var(--display);font-weight:500;font-size:1.05rem;margin:0 0 .4rem;
}
.foot-fine{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--slate-blue);margin:0;
}

/* ---- responsive ---- */
@media (max-width:860px){
  .hero{grid-template-columns:1fr;gap:2rem;margin-top:1rem;min-height:0;text-align:left}
  .hero-art{order:-1}
  .hero-art img{max-width:420px;margin:0 auto}
  .ship{grid-template-columns:1fr;gap:1.5rem}
  .ship-art{order:-1}
  .ship-copy .band-head,.ship-copy .band-copy{text-align:center}
  .ship-copy .band-copy{margin:0 auto}
  .trace{height:80px;margin:2rem 0 .5rem}
}
@media (max-width:520px){
  .status-chip{display:none}
  .telemetry{gap:1.1rem}
}

@media (prefers-reduced-motion:reduce){
  .trace-path{animation:none;stroke-dashoffset:0}
  .pip{animation:none;opacity:.9}
  .btn{transition:none}
}