/* Design tokens — generated from the Figma marketing design system export.
   Shared by every variant; edit here to restyle all landing pages at once. */
:root {
  /* color */
  --black: #000000;
  --white: #ffffff;
  --gray-e6: #e6e6e6;
  --gray-f7: #f7f7f5;
  --lime: #dceeb1;
  --lilac: #c5b0f4;
  --cream: #f4ecd6;
  --pink: #efd4d4;
  --mint: #c8e6cd;
  --coral: #f3c9b6;
  --navy: #1f1d3d;
  --brand: #91a992; /* sage accent used for headline highlights, stat numbers, hover state */

  --ink: var(--black);
  --canvas: var(--white);
  --inverse-ink: var(--white);
  --hairline: var(--gray-e6);
  --surface-soft: var(--gray-f7);
  --border-card: var(--hairline);

  --block-lime: var(--lime);
  --block-lilac: var(--lilac);
  --block-cream: var(--cream);
  --block-pink: var(--pink);
  --block-mint: var(--mint);
  --block-coral: var(--coral);
  --block-navy: var(--navy);

  /* type */
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;

  --fs-display-lg: 64px; --lh-display-lg: 1.1; --ls-display-lg: -0.96px; --fw-display-lg: 700;
  --fs-headline: 26px; --lh-headline: 1.3; --ls-headline: -0.26px; --fw-headline: 600;
  --fs-subhead: 26px; --lh-subhead: 1.35; --ls-subhead: -0.26px; --fw-subhead: 450;
  --fs-card-title: 24px;
  --fs-body-lg: 20px; --lh-body-lg: 1.4; --ls-body-lg: -0.14px; --fw-body-lg: 400;
  --fs-body: 18px; --lh-body: 1.45; --ls-body: -0.26px; --fw-body: 400;
  --fs-body-sm: 16px; --lh-body-sm: 1.45; --ls-body-sm: -0.14px;
  --fs-button: 18px; --lh-button: 1.4; --ls-button: -0.1px; --fw-button: 500;
  --fs-eyebrow: 18px; --ls-eyebrow: 0.54px;
  --fs-caption: 12px; --ls-caption: 0.6px;

  /* space */
  --space-hair: 1px; --space-xxs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px;
  --space-lg: 24px; --space-xl: 32px; --space-xxl: 48px; --space-section: 96px;

  --container-max: 1280px;
  --gutter-desktop: 48px;
  --gutter-mobile: 20px;
  --pad-block: 48px;
  --pad-card: 24px;

  /* shape / motion */
  --radius-md: 8px;
  --radius-lg: 24px;
  --radius-pill: 50px;
  --radius-full: 9999px;
  --ease-out: cubic-bezier(.2, .6, .2, 1);
  --dur-fast: 160ms;
  --dur-base: 280ms;

  /* breakpoint value for JS (kept in sync with the media query below) */
  --bp-mobile: 720px;
}