/* ------------------------------------------------------------------
   DESIGN TOKENS — numera. Single source of truth.
   Light, minimalist B2B SaaS; mint/teal accent on near-black ink.
   ------------------------------------------------------------------ */
:root {
  /* color */
  --color-bg: #ffffff;
  --color-surface: #f4f7f6;
  --color-surface-2: #eaf2ef;
  --color-ink: #0e1b17;
  --color-text: #0e1b17;
  --color-text-muted: #51625c;
  --color-accent: #79e0c3;          /* mint */
  --color-accent-deep: #0f8a68;     /* teal for text/links on light */
  --color-accent-ink: #0e1b17;      /* ink on mint buttons */
  --color-border: #e2e9e6;
  --color-white: #ffffff;
  --color-footer-bg: #0e1b17;
  --color-footer-text: #c7d4cf;

  /* badges (hero floating pills) */
  --badge-mint: #99e6cb;
  --badge-pink: #f4b6ba;
  --badge-yellow: #ead784;
  --badge-lavender: #c3c6f4;
  --badge-gray: #edeee9;

  /* dark section */
  --color-dark-bg: #111412;
  --color-dark-text: #f2f4f0;
  --color-dark-muted: #9aa39e;
  --color-dark-line: rgb(255 255 255 / 0.18);

  /* type — serif display, sans text */
  --font-display: "Source Serif 4", "Tiempos Headline", Georgia, "Times New Roman", serif;
  --font-text: "Inter", system-ui, -apple-system, sans-serif;
  --text-xs: 0.78rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.3rem;
  --text-2xl: 1.7rem;
  --text-3xl: 2.4rem;
  --text-4xl: 3.6rem;

  /* space — 4px grid */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  /* shape + depth */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgb(14 27 23 / 0.05);
  --shadow-md: 0 10px 30px rgb(14 27 23 / 0.08);

  /* motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 150ms;
  --dur-reveal: 600ms;

  /* layout */
  --container: 1160px;
}