:root {
  /* Brand */
  --blue-500: #2581c4;
  --blue-600: #1f6da6;
  --blue-700: #195888;
  --blue-400: #4f9ad2;
  --blue-300: #8dbde5;
  --blue-200: #c2dcf1;
  --blue-100: #e3eff9;
  --blue-050: #f2f8fd;
  --gray-900: #2c2b2b;
  --gray-800: #3d3c3c;
  --gray-700: #575656;
  --gray-600: #6f6e6e;
  --gray-500: #8d8c8c;
  --gray-400: #b4b3b3;
  --gray-300: #d5d4d4;
  --gray-200: #e6e5e5;
  --gray-100: #f1f0f0;
  --gray-050: #f8f8f8;
  --white: #ffffff;
  --black: #000000;
  --green-500: #3f9c5a;
  --green-100: #e7f3ea;
  --amber-500: #d59120;
  --amber-100: #fbf1de;
  --red-500: #c0392b;
  --red-100: #f8e8e6;

  --brand: var(--blue-500);
  --brand-hover: var(--blue-600);
  --brand-active: var(--blue-700);
  --brand-soft: var(--blue-100);
  --brand-tint: var(--blue-050);
  --text-heading: var(--gray-700);
  --text-body: var(--gray-700);
  --text-muted: var(--gray-500);
  --text-inverse: var(--white);
  --text-accent: var(--blue-500);
  --text-link: var(--blue-500);
  --text-link-hover: var(--blue-700);
  --surface-page: var(--white);
  --surface-card: var(--white);
  --surface-subtle: var(--gray-050);
  --surface-tint: var(--blue-050);
  --surface-invert: var(--blue-500);
  --surface-dark: var(--gray-700);
  --border-subtle: var(--gray-200);
  --border-default: var(--gray-300);
  --border-strong: var(--gray-400);
  --border-brand: var(--blue-500);
  --focus-ring: var(--blue-400);
  --overlay-scrim: rgba(44, 43, 43, 0.55);
  --hero-scrim: linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.92) 46%, rgba(255, 255, 255, 0.78) 62%, rgba(255, 255, 255, 0) 90%);

  /* Type */
  --font-core: "Config Condensed", "Oswald", "Roboto Condensed", system-ui, sans-serif;
  --font-display: var(--font-core);
  --font-body: var(--font-core);
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, monospace;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-text: 450;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;
  --fs-display-xl: 76px;
  --fs-display: 56px;
  --fs-h1: 44px;
  --fs-h2: 32px;
  --fs-h3: 24px;
  --fs-h4: 20px;
  --fs-lead: 21px;
  --fs-body: 17px;
  --fs-small: 15px;
  --fs-caption: 13px;
  --fs-eyebrow: 14px;
  --lh-tight: 1.04;
  --lh-heading: 1.14;
  --lh-snug: 1.35;
  --lh-body: 1.62;
  --ls-display: -0.01em;
  --ls-heading: 0;
  --ls-eyebrow: 0.14em;
  --ls-body: 0;

  /* Space */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --section-y: 96px;
  --section-y-tight: 64px;
  --container-max: 1180px;
  --container-narrow: 760px;
  --gutter: 24px;
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-pill: 999px;
  --border-width: 1px;
  --rule-width: 3px;

  /* Elevation */
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(44, 43, 43, 0.06);
  --shadow-card: 0 2px 10px rgba(44, 43, 43, 0.08);
  --shadow-raised: 0 8px 24px rgba(44, 43, 43, 0.10);
  --shadow-overlay: 0 18px 48px rgba(44, 43, 43, 0.18);
  --shadow-focus: 0 0 0 3px rgba(37, 129, 196, 0.35);

  /* Motion */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 400ms;
  --dur-hero: 700ms;
  --transition-color: color var(--dur-base) var(--ease-standard), background-color var(--dur-base) var(--ease-standard), border-color var(--dur-base) var(--ease-standard);

  /* Salient bridges */
  --container-width: 1180px;
  --container-padding: 24px;
}

@media (max-width: 999px) {
  :root {
    --fs-display-xl: 52px;
    --fs-display: 40px;
    --fs-h1: 34px;
    --fs-h2: 28px;
    --section-y: 64px;
  }
}

@media (max-width: 690px) {
  :root {
    --fs-display-xl: 40px;
    --fs-display: 32px;
    --fs-h1: 28px;
    --fs-h2: 24px;
    --fs-h3: 22px;
    --fs-lead: 18px;
    --section-y: 56px;
    --gutter: 20px;
    --container-padding: 20px;
  }
}
