/* Design tokens — FIT Assurance & Patrimoine brand system. Do not use raw hex values outside this file. */
:root {
  /* Colors — the 6 official brand colors, plus white reserved for elevated surfaces */
  --color-accent: #3DDEC8;      /* CTAs, progress bars, logo dot — never as background fill or body text */
  --color-primary: #0B2240;     /* Navigation, footer, H1, main text */
  --color-secondary: #1A5A8A;   /* Italic titles, active links, interactive elements */
  --color-tertiary: #84A6C8;    /* Icons, secondary text (large sizes only for AA contrast), light borders */
  --color-hero-bg: #D8E8F5;     /* Hero background, soft gradients */
  --color-neutral: #F0F4F8;     /* Global page background — never pure white */
  --color-surface: #FFFFFF;     /* Cards and elevated surfaces only */

  --color-text: var(--color-primary);
  --color-text-muted: var(--color-tertiary);
  --color-border: #C9DCEC;

  /* Typography */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-data: 'DM Sans', -apple-system, sans-serif;
  --font-mono: 'DM Mono', 'Courier New', monospace;

  /* Type scale */
  --size-hero: clamp(30px, 5vw, 52px);
  --size-h2: clamp(18px, 2.2vw, 26px);
  --size-h3: clamp(15px, 1.6vw, 18px);
  --size-body: 16px;
  --size-nav: 12px;
  --size-label: 10px;
  --size-stat: clamp(24px, 3.5vw, 36px);

  /* Spacing */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 48px;
  --space-xl: 80px;
  --space-2xl: 120px;

  /* Shape & elevation */
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;
  --shadow-card: 0 4px 24px rgba(11, 34, 64, 0.08);
  --shadow-card-hover: 0 8px 32px rgba(11, 34, 64, 0.14);

  --container-width: 1200px;
}
