@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700&display=swap');

:root {
  --brand: #4a7ba6;
  --brand-light: #6f9cc2;
  --brand-dark: #305775;
  --brand-accent: #c7d3dc;
  --surface: #f4f8fb;
  --surface-card: #ffffff;
  --surface-border: #d9e4ec;
  --surface-hover: #e7eff5;
  --ink: #1c2a35;
  --ink-muted: #4b5f6e;
  --ink-faint: #7c8f9c;
  --page-background: #f4f8fb;
  --header-background: transparent;
  --footer-background: #e7eff5;
  --header-logo-background: var(--header-background);
  --header-menu-background: var(--header-background);
  --footer-main-background: var(--footer-background);
  --footer-legal-background: var(--footer-background);
  --banner-background: #305775;
  --on-banner: #ffffff;
  --cta-background: #e7eff5;
  --nav-link-hover-color: #305775;
  --nav-link-hover-text-decoration: none;
  --radius-sm: 0.375rem;
  --radius: 0.5rem;
  --radius-lg: 0.75rem;
  --font-family: 'Work Sans', sans-serif;
  --font-family-heading: var(--font-family);
  --prose-h1-color: var(--brand-dark);
  --prose-h1-size: 1.75rem;
  --prose-h2-color: var(--brand-dark);
  --prose-h2-size: 1.5rem;
  --prose-h3-color: var(--brand-dark);
  --prose-h3-size: 1.25rem;
  --prose-h4-color: var(--brand-dark);
  --prose-h4-size: 1.1rem;
  --on-brand-accent: var(--brand-dark);
  --donate-icon-display: inline-block;
  --bg-effect: snow;
  --snow-color: #ffffff;
  --snow-density: 60;
  --snow-speed: 0.8;
  --snow-wind: 1;
  --firework-color-1: #ffd166;
  --firework-color-2: #ef476f;
  --firework-color-3: #ffffff;
  --firework-density: 8;
  --firework-speed: 1;
  --celebration-color-1: #ff6ec7;
  --celebration-color-2: #2ec4b6;
  --celebration-color-3: #ffe066;
  --celebration-density: 16;
  --celebration-speed: 1;
}
