/* ═══════════════════════════════════════
   DECODED BRAND — Dark Theme
   Primary: #000000 | Accent: #FFFFFF | Secondary: #00FF41
   Font: Montserrat (wordmark) + Space Grotesk (body)
   Vibe: Bold, minimal, dark, premium — late-night studio session
   ═══════════════════════════════════════ */

:root {
  /* Brand palette */
  --primary: #000000;
  --accent: #FFFFFF;
  --secondary: #00FF41;
  --bg: #000000;
  --bg-elevated: #0a0a0a;
  --bg-card: #111111;
  --text: #FFFFFF;
  --text-dim: rgba(255, 255, 255, 0.55);
  --border: rgba(255, 255, 255, 0.08);
  --border-bright: rgba(255, 255, 255, 0.15);

  /* Derived */
  --glow-green: rgba(0, 255, 65, 0.12);
  --glow-green-bright: rgba(0, 255, 65, 0.25);

  /* Common alias */
  --accent-green: #00FF41;
  --green: #00FF41;
  --error: #ff4466;
}

/* ── Wordmark text logo ── */
.wordmark {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text);
  text-decoration: none;
  display: inline-block;
  line-height: 1;
  transition: color 0.15s;
}
.wordmark:hover { color: var(--secondary); }

/* ── Green accent text ── */
.green,
.teal-text,
.green-text { color: var(--secondary); }

/* ── Secondary buttons/links shift to green on hover ── */
.btn-ghost:hover,
.feature-cta:hover,
.nav-sign-in:hover { color: var(--secondary); }

/* ── Primary green buttons: lift on hover ── */
.btn-primary:hover,
.nav-cta:hover { opacity: 0.88; transform: translateY(-2px); }

/* ── Underline accent ── */
.underline-green {
  text-decoration: underline;
  text-decoration-color: var(--secondary);
  text-underline-offset: 3px;
}

/* ── Tagline accent (hero eyebrow, labels) ── */
.tagline-accent { color: var(--secondary); }