/* ============================================
   CPL Design Tokens
   Single source of truth for colour, type and spacing.
   Loaded before styles.css on every page.
   ============================================ */

/* --- Custom Properties --- */
/* Warm Human palette, using the locked CPL navy and cyan brand colours. */
:root {
  --color-accent-cta: #20a8e8;
  --color-accent-text: #20a8e8;
  --color-coral-text: #e87861;
  --color-ink: #071c63;
  --color-ink-soft: #0c2057;
  --on-ink: #ffffff;
  --on-ink-muted: rgba(255,255,255,0.78);
  --on-ink-line: rgba(255,255,255,0.14);
  --color-primary: #071c63;
  --color-primary-light: #0c2a7a;
  --color-primary-dark: #05164f;
  --color-accent: #20a8e8;
  --on-accent: #071c63;
  --color-accent-hover: #138ec7;
  --color-accent-light: #e8f6fc;
  --color-dark-blue: #05164f;
  --color-dark-blue-hover: #041044;
  --color-bg: #f7f5f1;
  --color-bg-alt: #f2eee8;
  --color-white: #fffefc;
  --color-text: #405064;
  --color-text-muted: #596879;
  --color-text-light: #aab2bb;
  --color-border: #ded8cf;
  --color-error: #bd3f3f;
  --color-success: #397354;
  --color-overlay: rgba(7, 28, 99, 0.78);
  --color-near-black: #1a1a1a;
  --color-google-blue: #4285f4;
  --color-google-yellow: #fbbc04;
  --color-coral: #e87861;
  --color-coral-dark: #bd523f;
  --color-coral-soft: #fbe9e4;
  --color-sage: #6f8875;
  --color-sage-dark: #506958;
  --color-sage-soft: #e8efea;
  --color-canvas-stone: #efeae3;

  --font-heading: 'Montserrat', 'Outfit', sans-serif;
  --font-body: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;

  --shadow-sm: 0 4px 12px rgba(7, 28, 99, 0.06);
  --shadow-md: 0 12px 30px rgba(7, 28, 99, 0.10);
  --shadow-lg: 0 16px 38px rgba(79, 67, 55, 0.12);
  --shadow-xl: 0 24px 64px rgba(7, 28, 99, 0.14);

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --max-width: 1140px;
  --type-section: clamp(2.65rem, 3.6vw, 3.25rem);
  --type-section-mobile: clamp(1.875rem, 8.4vw, 2.25rem);
  --radius-card: 18px;
  --radius-button: 999px;
  --shadow-card: 0 6px 22px rgba(7, 28, 99, 0.055);
  --space-section: clamp(64px, 6.5vw, 96px);
}