/* ============================================================
   ORBIT LABS — tokens, reset, base
   Palette: void navy / signal cyan / warm white / amber burn
   ============================================================ */
:root{
  --void:#04070f;
  --void-2:#070d1c;
  --panel:#0b1226;
  --line:rgba(125,211,252,.12);
  --line-soft:rgba(125,211,252,.07);
  --ink:#eef4ff;
  --ink-dim:#9fb0cc;
  --ink-faint:#5c6c8c;
  --signal:#22d3ee;
  --signal-soft:rgba(34,211,238,.14);
  --burn:#fbbf24;
  --danger:#fb7185;
  --mono:"IBM Plex Mono","DejaVu Sans Mono",ui-monospace,monospace;
  --sans:"Space Grotesk","Liberation Sans","Helvetica Neue",Arial,sans-serif;
  --r-sm:6px; --r-md:12px; --r-lg:20px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--void);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--signal);color:var(--void)}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:2px}

/* canvas starfield sits behind everything */
#stars{position:fixed;inset:0;z-index:0;pointer-events:none}

main{position:relative;z-index:1}
.wrap{width:min(1180px,92vw);margin-inline:auto}

/* type scale —
   display = mission-patch lettering: condensed via font-stretch + scaleY,
   uppercase, wide tracking, stroke text. Body = plain sans for readability.
   Mono = telemetry. Three distinct voices, not one family at three sizes. */
.eyebrow{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.32em;
  text-transform:uppercase;color:var(--signal);
}
.display{
  font-family:var(--sans);
  font-weight:700;
  text-transform:uppercase;
  line-height:.92;
  letter-spacing:.005em;
  /* Space Grotesk is already distinctive — no distortion needed, just
     tight leading + the hollow-stroke accents below */
}
/* hollow stroke variant — the "patch" look */
.display .stroke{
  color:transparent;
  -webkit-text-stroke:2px var(--ink);
  text-stroke:2px var(--ink);
}
.display .accent{color:var(--signal)}
.display .accent.stroke{
  color:transparent;
  -webkit-text-stroke:2px var(--signal);
}
.h-xl{font-size:clamp(2.7rem,7.6vw,6rem);letter-spacing:.005em}
.h-lg{font-size:clamp(1.7rem,3.8vw,2.7rem);letter-spacing:.015em}
.h-md{
  font-family:var(--sans);font-weight:700;text-transform:uppercase;
  font-size:clamp(1.05rem,2.2vw,1.45rem);letter-spacing:.04em;line-height:1.12;
}
.lede{color:var(--ink-dim);font-size:clamp(1rem,1.4vw,1.15rem);max-width:60ch}
.mono{font-family:var(--mono)}
.dim{color:var(--ink-dim)}
.faint{color:var(--ink-faint)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
