/* ============================================================
   KODREX — Design Tokens
   Edit this file to change colors, fonts, spacing globally
   ============================================================ */

:root {
  /* ── Brand Colors ── */
  --red: #c8392b;
  --red-dark: #a82e22;
  --red-dim: rgba(200, 57, 43, 0.12);
  --red-glow: rgba(200, 57, 43, 0.2);

  /* ── Backgrounds ── */
  --bg-base: #080808; /* dominant dark */
  --bg-2: #0f0f0f; /* section contrast */
  --bg-3: #141414; /* cards */
  --bg-4: #1a1a1a; /* elevated cards */

  /* ── Text ── */
  --text-primary: #f0ece3; /* warm cream */
  --text-secondary: rgba(240, 236, 227, 0.55);
  --text-muted: rgba(240, 236, 227, 0.35);

  /* ── Borders ── */
  --border: rgba(240, 236, 227, 0.07);
  --border-light: rgba(240, 236, 227, 0.12);
  --border-red: rgba(200, 57, 43, 0.3);

  /* ── Typography ── */
  --font-heading: 'Bebas Neue', sans-serif;
  --font-body: 'Familjen Grotesk', sans-serif;

  /* ── Spacing ── */
  --section-pad: 120px;
  --section-pad-sm: 80px;
  --container: 1200px;
  --container-sm: 900px;

  /* ── Transitions ── */
  --ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* ── Radius ── */
  --radius-sm: 3px;
  --radius: 6px;
  --radius-lg: 12px;
}