/* FAMM design tokens. Edit values here only, never in components. */
:root {
  /* Brand blue, sampled from the logo (#2E3D88 = 600) */
  --blue-50: #eef0f9;
  --blue-100: #dde2f3;
  --blue-200: #bbc4e6;
  --blue-300: #8e9bd0;
  --blue-400: #5f6fb5;
  --blue-500: #3f4f9e;
  --blue-600: #2e3d88;
  --blue-700: #25326f;
  --blue-800: #1c2655;
  --blue-900: #131a3b;

  /* Cool neutrals */
  --ink: #14182b;
  --ink-2: #3a4157;
  --ink-3: #5b6275;
  --line: #dde0e8;
  --line-strong: #c3c8d4;
  --surface-2: #eceef3;
  --surface: #f5f6f9;
  --white: #ffffff;
  --glass: #e6f0f8;

  /* Semantic */
  --ok: #1f7a4d;
  --ok-bg: #e4f4ec;
  --warn: #9a5b00;
  --warn-bg: #fdf1dc;
  --err: #b3261e;
  --err-bg: #fbe9e7;

  /* Roles */
  --c-bg: var(--white);
  --c-text: var(--ink);
  --c-text-soft: var(--ink-3);
  --c-brand: var(--blue-600);
  --c-brand-hover: var(--blue-700);
  --c-brand-tint: var(--blue-50);
  --c-dark: var(--blue-800);
  --c-focus: var(--blue-400);

  /* Type */
  --font-head: 'Archivo', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Public Sans', 'Segoe UI', system-ui, sans-serif;
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1rem;
  --fs-lg: clamp(1.15rem, 1.05rem + 0.4vw, 1.3rem);
  --fs-h4: clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.8vw, 1.7rem);
  --fs-h2: clamp(1.7rem, 1.3rem + 1.7vw, 2.6rem);
  --fs-h1: clamp(2.2rem, 1.5rem + 3vw, 4rem);
  --lh-tight: 1.1;
  --lh-snug: 1.25;
  --lh-body: 1.65;

  /* Space, 4px base */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;
  --section-y: clamp(3.5rem, 2rem + 6vw, 7.5rem);

  /* Layout */
  --container: 76rem;
  --container-narrow: 48rem;
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2rem);
  --header-h: 5rem;

  /* Shape and depth */
  --r-sm: 2px;
  --r-md: 4px;
  --r-lg: 8px;
  --border: 1px solid var(--line);
  --shadow-sm: 0 1px 2px rgb(20 24 43 / 0.06);
  --shadow-md: 0 8px 24px -8px rgb(20 24 43 / 0.16);
  --shadow-lg: 0 24px 48px -16px rgb(20 24 43 / 0.22);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 150ms;
  --t-base: 250ms;
}