/* TitleShield Design System — CSS Custom Properties */

:root {
  /* ── Colours ── */
  --color-navy: #1B3A6B;
  --color-navy-dark: #142d54;
  --color-navy-light: #244d8f;
  --color-gold: #C9A84C;
  --color-gold-dark: #b3922e;
  --color-gold-light: #d9bb6e;
  --color-forest: #0D2B1A;

  --color-warm-white: #FAF8F4;
  --color-stone: #F2EDE6;
  --color-slate: #E8E4DF;
  --color-charcoal: #1A1A1A;
  --color-grey-mid: #6B6B6B;
  --color-grey-light: #9B9B9B;

  --color-success: #1A7A4A;
  --color-success-bg: #E8F5EE;
  --color-warning: #D4820A;
  --color-warning-bg: #FEF3E2;
  --color-danger: #C0392B;
  --color-danger-bg: #FDEAEA;
  --color-info: #1E6B9B;
  --color-info-bg: #E5F1F9;

  /* Category badge colours */
  --badge-legal: #1B3A6B;
  --badge-template: #1A5C2E;
  --badge-onboarding: #B8620A;
  --badge-policy: #5B2D8E;
  --badge-sop: #0E7B6B;
  --badge-investor: #B8860A;
  --badge-dd: #8B2318;
  --badge-governance: #3D4B5C;
  --badge-exit: #C05218;
  --badge-mkc: #1A3B30;
  --badge-compliance: #5A5A5A;

  /* ── Typography ── */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'DM Mono', 'Courier New', Courier, monospace;

  /* Type scale */
  --text-hero: clamp(36px, 5vw, 72px);
  --text-h1: clamp(32px, 4vw, 64px);
  --text-h2: clamp(28px, 3.5vw, 48px);
  --text-h3: clamp(20px, 2.5vw, 28px);
  --text-h4: clamp(18px, 2vw, 22px);
  --text-body-lg: 18px;
  --text-body: 16px;
  --text-caption: 13px;
  --text-mono: 14px;
  --text-micro: 12px;

  /* ── Spacing (8px grid) ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;
  --space-9: 128px;

  /* ── Border radius ── */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-btn: 6px;
  --radius-lg: 12px;

  /* ── Shadows ── */
  --shadow-card: 0 1px 3px rgba(27,58,107,0.06), 0 4px 12px rgba(27,58,107,0.04);
  --shadow-card-hover: 0 4px 16px rgba(27,58,107,0.12), 0 8px 24px rgba(27,58,107,0.08);
  --shadow-nav: 0 2px 8px rgba(27,58,107,0.08);
  --shadow-btn: 0 4px 14px rgba(27,58,107,0.25);

  /* ── Transitions ── */
  --transition-fast: 150ms ease;
  --transition-mid: 200ms ease;
  --transition-slow: 400ms ease-out;

  /* ── Layout ── */
  --container-max: 1280px;
  --container-mid: 960px;
  --container-narrow: 760px;
  --nav-height: 72px;
}