/* ============================================================
   DebtReliefSimple — Design Tokens
   Single source of truth for colors, type, spacing, shadows.
   Do not hardcode hex values anywhere else.
   ============================================================ */

:root {
  /* ---------- Color: Navy (primary dark) ---------- */
  --navy:        #0D1F3C;
  --navy-mid:    #162d52;
  --navy-light:  #1e3a6a;

  /* ---------- Color: Teal (primary accent) ---------- */
  --teal:        #0891B2;
  --teal-light:  #e0f2fe;
  --teal-dark:   #0e7490;

  /* ---------- Color: Green (CTA only) ---------- */
  --green:       #0E9F6E;
  --green-dark:  #0a7a55;
  --green-bg:    #ecfdf5;

  /* ---------- Color: Amber (disclosure / warning) ---------- */
  --amber:       #d97706;
  --amber-bg:    #fffbeb;

  /* ---------- Color: Neutrals ---------- */
  --white:       #F7F9FC;
  --gray-50:     #f8fafc;
  --gray-100:    #f1f5f9;
  --gray-200:    #e2e8f0;
  --gray-300:    #cbd5e1;
  --gray-400:    #94a3b8;
  --gray-500:    #64748b;
  --gray-600:    #475569;
  --gray-700:    #334155;
  --gray-800:    #1e293b;
  --gray-900:    #0f172a;

  /* ---------- Typography ---------- */
  --font-serif: 'DM Serif Display', Georgia, serif;
  --font-sans:  'Plus Jakarta Sans', system-ui, -apple-system, Segoe UI, sans-serif;

  /* ---------- Radii ---------- */
  --radius-sm: 6px;
  --radius:    10px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  /* ---------- Shadows ---------- */
  --shadow-sm: 0 1px 3px rgba(13,31,60,.08), 0 1px 2px rgba(13,31,60,.06);
  --shadow:    0 4px 16px rgba(13,31,60,.08), 0 2px 6px rgba(13,31,60,.06);
  --shadow-lg: 0 10px 40px rgba(13,31,60,.12), 0 4px 12px rgba(13,31,60,.08);

  /* ---------- Layout widths ---------- */
  --max-w:     1140px;
  --prose-w:   680px;

  /* ---------- Spacing scale (for section rhythm) ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* ---------- Motion ---------- */
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --t-fast: .15s;
  --t-med:  .3s;
  --t-slow: .6s;
}