/* CODEC TRANSMISSION — brand tokens.
   Source of law: DESIGN-CONTRACT.md §0b (canonical dark ground) + §1 CODEC family.
   Accent = #03FB8D MGS terminal green (LOCKED 2026-05-28; NOT Atrium #03DD34).
   Ground = the canonical near-black family; panels LIFTED so cards pop (the Haven lift).
   Fonts: Inter (sans) / Manrope (display) / DM Mono (mono). Hex tier: literal. */

:root {
  --accent: #03FB8D;
  --accent-rgb: 3, 251, 141;
  --accent-mid: #02C86F;
  --accent-deep: #036B41;
  --accent-ink: #021208;            /* text on accent */
  --glow: rgba(3, 251, 141, 0.16);

  --bg: #020610;                    /* true near-black base */
  --bg-section: #0A0E16;            /* lifted dark section, NEVER white */
  --panel: #0E1320;                 /* lifted so cards visibly pop */
  --text: #F0F2FA;
  --text-muted: #A8B4C4;
  --border-light: rgba(255, 255, 255, 0.09);
  --border-accent: rgba(var(--accent-rgb), 0.20);

  --font-sans: 'Inter', system-ui, sans-serif;
  --font-display: 'Manrope', var(--font-sans);
  --font-mono: 'DM Mono', ui-monospace, monospace;

  --radius: 13px;                   /* cards / buttons / modals 12-14px */
  --radius-pill: 100px;
  --container: 1480px;
  --hex-bg-opacity: 0.6;
}

html { background: var(--bg); color: var(--text); font-family: var(--font-sans); }
body { margin: 0; min-height: 100vh; }

/* content sits above the hex field */
main, header, footer { position: relative; z-index: 1; }

.wrap { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.sec { padding: 88px 0; }
.sec-alt { background: var(--bg-section); }
@media (max-width: 760px) { .sec { padding: 64px 0; } }

.card {
  background: var(--panel);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius);
  padding: 28px;
}

.eyebrow {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
}

h1, h2, h3 { font-family: var(--font-display); letter-spacing: -0.015em; margin: 0 0 0.5em; }
h1 { font-size: clamp(2.8rem, 5vw, 4.2rem); font-weight: 700; }
h2 { font-size: clamp(2.3rem, 3.6vw, 3.2rem); font-weight: 700; }
h3 { font-size: 1.6rem; font-weight: 600; }
p  { line-height: 1.65; }
.muted { color: var(--text-muted); }

.btn {
  display: inline-block;
  font: 600 1rem var(--font-sans);
  color: var(--accent-ink);
  background: var(--accent);
  border: 0;
  border-radius: var(--radius);
  padding: 13px 26px;
  cursor: pointer;
  text-decoration: none;
}
.btn-ghost {
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--border-accent);
}
.pill { border-radius: var(--radius-pill); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}