/* tokens.css — CSS custom properties only. No selectors beyond :root. */

:root {
  /* === Colors (client-approved palette — do not hardcode elsewhere) === */
  --color-primary:       #0061C2;
  --color-primary-hover: #004E9E;
  --color-accent:        #FFFFFF;
  --color-section-bg:    #EEF1F5;
  --color-text:          #1C2430;
  --color-text-muted:    #52606D;
  --color-bg:            #FFFFFF;
  --color-border:        #DCE2EA;
  --logo-bg:              var(--color-primary);
  --logo-fg:              #FFFFFF;

  /* === Typography === */
  --font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

  /* === Spacing === */
  --section-padding-y: 56px; /* mobile; redefined at 768px/1024px in components.css */
  --section-gap-title: 32px; /* section heading -> its content */
  --max-width: 1200px;
  --side-pad: 1.25rem;
  --header-height: 100px;

  /* === Footer type scale (mobile; redefined at 768px in components.css) === */
  --footer-body-size: 14px;
  --footer-legal-size: 12px;
  --footer-brand-name-size: 18px;
  --footer-logo-size: 28px;

  /* === Borders & Shadows === */
  --radius-sm: 8px;
  --radius-card: 16px;
  --shadow-card: 0 2px 12px rgba(28, 36, 48, 0.06);
  --shadow-hover: 0 10px 28px rgba(28, 36, 48, 0.12);
}