:root {
  --brand-blue: #197CE3;
  --brand-navy: #042874;
  --brand-yellow: #EFC82C;
  --brand-off-white: #EFF3F9;

  --color-page: var(--brand-off-white);
  --color-surface: var(--brand-off-white);
  --color-ink: var(--brand-navy);
  --color-muted: color-mix(in oklch, var(--brand-navy) 68%, var(--brand-off-white));
  --color-action: var(--brand-yellow);
  --color-signal: var(--brand-yellow);
  --color-focus: var(--brand-navy);
  --color-border: color-mix(in oklch, var(--brand-navy) 24%, var(--brand-off-white));
  --color-on-dark: var(--brand-off-white);
  --color-on-signal: var(--brand-navy);
  --color-dark-muted: color-mix(in oklch, var(--brand-off-white) 84%, var(--brand-blue));

  --font-brand: "proxima-nova-condensed", "Proxima Nova", "Proxima Nova Alt", "Avenir Next", "Segoe UI", sans-serif;
  --font-weight-regular: 400;
  --font-weight-semibold: 700;
  --font-weight-bold: 700;
  --font-size-body: clamp(1.1875rem, 1.05rem + 0.6vw, 1.5rem);
  --font-size-support: 1.25rem;
  --font-size-small: 1rem;

  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  --measure-copy: 68ch;
  --measure-narrow: 48ch;
  --page-gutter: clamp(1rem, 3.6vw, 4.5rem);
  /* Full bleed. Every band (manifesto, signal bars, footer) already spans the
     viewport, so capping the text sections left them floating in a narrow
     column on wide screens. Line length is held by per-element measures. */
  --page-max: 100%;
  --radius-small: 0.25rem;
  --radius-round: 999rem;

  --duration-fast: 160ms;
  --duration-medium: 240ms;
  --duration-reveal: 620ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
}
