/* ============================================================
   The Orbit System — shared brand layer tethering the Orbit
   wheel (macro view) and the Instrument calculator (micro view).
   Wordmark text is a slot: change --brand-name content in HTML,
   nothing else moves. Fonts: Space Grotesk (display) + Inter.
   ============================================================ */
:root{
  --nd-ground:#070910;
  --nd-panel:rgba(13,17,26,.72);
  --nd-line:rgba(130,170,220,.14);
  --nd-ink:#ecf1f9;
  --nd-muted:#93a0b4;
  --nd-faint:#5b6577;
  --nd-core:#45d8e8;      /* the light: shared by wheel arcs and liquid */
  --nd-violet:#9d8bfa;
  --nd-gold:#f2b657;
}

/* ---------- shared header ---------- */
.nd-header{display:flex; align-items:center; gap:12px}
.nd-mark{width:30px; height:30px; flex:none; filter:drop-shadow(0 0 8px rgba(69,216,232,.5))}
.nd-wordmark{font-family:"Space Grotesk",sans-serif; font-weight:700; font-size:18px; letter-spacing:-.02em; color:var(--nd-ink)}
.nd-wordmark em{font-style:normal; color:var(--nd-core)}
.nd-header .nd-sub{font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--nd-faint); margin-left:auto}

/* ---------- tether band: each surface advertises its sibling ---------- */
.nd-tether{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  border:1px solid var(--nd-line); border-radius:16px; padding:18px 22px;
  background:linear-gradient(120deg, rgba(69,216,232,.08), rgba(157,139,250,.06) 60%, transparent);
}
.nd-tether .nd-mark{width:38px; height:38px}
.nd-tether .t-copy{flex:1; min-width:220px}
.nd-tether .t-copy b{display:block; font-family:"Space Grotesk",sans-serif; font-size:15.5px; color:var(--nd-ink); letter-spacing:-.01em}
.nd-tether .t-copy span{font-size:13px; color:var(--nd-muted)}
.nd-tether a.t-go{
  font-family:"Space Grotesk",sans-serif; font-weight:600; font-size:13.5px; text-decoration:none;
  color:var(--nd-core); border:1px solid rgba(69,216,232,.45); border-radius:999px; padding:10px 18px;
  white-space:nowrap; transition:.15s;
}
.nd-tether a.t-go:hover{background:rgba(69,216,232,.12); box-shadow:0 0 18px rgba(69,216,232,.35)}
