/* ══════════════════════════════════════════════════════════════
   CARDAVA DESIGN TOKENS
   Single source of truth. Every page and component reads colors,
   spacing, radii, shadows, and type sizes from here — never hardcode
   a hex value or a pixel gap in a page file.
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── COLOR ── */
  --c-primary:       #2D6A4F;
  --c-primary-dark:  #1B4332;
  --c-primary-light: #427A4E;
  --c-sage:          #D8F3DC;
  --c-sage-light:    #F0FAF2;
  --c-navy:          #1A1F2E;
  --c-charcoal:      #1A1A1A;
  --c-body-text:     #374151;
  --c-muted:         #6B7280;
  --c-border:        #E5E7EB;
  --c-white:         #FFFFFF;
  --c-off-white:     #F9FAFB;

  /* ── SPACING SCALE (4px base) ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ── RADIUS ── */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   32px;
  --radius-full: 999px;

  /* ── SHADOW ── */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.10);

  /* ── TYPE ── */
  --font: 'Inter', system-ui, sans-serif;
  --fs-xs:   12px;
  --fs-sm:   13px;
  --fs-base: 15px;
  --fs-md:   16px;
  --fs-lg:   18px;
  --fs-xl:   20px;

  /* ── LAYOUT ── */
  --max-w: 1120px;
  --nav-h: 64px;
}