/* Design tokens - from getdesign.md. Every colour, font, space and radius in site.css comes from here. */
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("/assets/fonts/montserrat-latin.woff2") format("woff2");
}
:root {
  --color-primary: #0873BB;
  --color-primary-dark: #065A93;
  --color-secondary: #F5F8FB;
  --color-accent: #2BC0D8;
  --color-accent-dark: #1A9DB3;
  --color-text: #0F172A;
  --color-body: #334155;
  --color-muted: #64748B;
  --color-line: #E2E8F0;
  --color-white: #FFFFFF;
  --color-text-on-dark: #FFFFFF;
  --color-glass: rgba(255, 255, 255, 0.22);
  --color-glass-line: rgba(255, 255, 255, 0.45);
  --color-glass-field: rgba(255, 255, 255, 0.16);
  --color-shade: rgba(5, 18, 32, 0.55);
  --color-shade-soft: rgba(5, 18, 32, 0.12);
  --color-star: #FBBF24;
  --font-heading: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --space: 8px;
  --section-pad: 104px;
  --section-pad-mobile: 64px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --ease-hover: 150ms;
  --wrap: 1180px;
  --gutter: 20px;
  --header-h: 76px;
  --fs-hero: clamp(2.375rem, 6vw, 4rem);
  --fs-h2: clamp(1.75rem, 4vw, 2.5rem);
  --fs-h3: clamp(1.15rem, 2.4vw, 1.375rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.875rem;
  --shadow-card: 0 10px 30px rgba(15, 23, 42, 0.08);
  --shadow-header: 0 2px 14px rgba(15, 23, 42, 0.08);
}
