/* UniformSig design tokens — the single source of truth for color, type,
   spacing, radius, and elevation. Copied verbatim from the marketing site's
   design system (uniformsig/website: docs/design-system.md → src/styles/global.css).
   Tokens are the contract: re-copy this :root block when the design system changes.
   Load this BEFORE app.css. */
:root {
  /* Brand — primary blue ramp */
  --brand-50: #eef4ff;
  --brand-100: #d9e6ff;
  --brand-200: #b8d0ff;
  --brand-500: #2f6bff;
  --brand-600: #1f54e0; /* primary action */
  --brand-700: #1842b4; /* hover / emphasis */

  /* Neutrals */
  --ink: #0f1729; /* headings, primary text */
  --ink-soft: #38415a; /* body text */
  --muted: #5b6478; /* secondary / captions */
  --line: #e3e7ef; /* borders, dividers */
  --surface: #ffffff; /* base background / cards */
  --surface-2: #f6f8fc; /* alternating section bg */
  --surface-3: #eef1f7; /* inset chips / placeholders */

  /* Accent — success / trust highlights (use sparingly) */
  --accent: #0fb27a;

  /* Type */
  --font-sans:
    system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji', sans-serif;
  --fs-300: 0.875rem; /* small / captions */
  --fs-400: 1rem; /* body */
  --fs-500: 1.125rem; /* lead / large body */
  --fs-600: clamp(1.25rem, 1rem + 1vw, 1.5rem); /* card titles / h3 */
  --fs-700: clamp(1.5rem, 1rem + 2.2vw, 2.25rem); /* section headings / h2 */
  --fs-800: clamp(2.1rem, 1.2rem + 3.6vw, 3.5rem); /* page hero / h1 */

  /* Spacing scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;

  /* Radii */
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 22px;

  /* Elevation (cool-tinted, low-spread) */
  --shadow-sm: 0 1px 2px rgba(15, 23, 41, 0.06);
  --shadow: 0 10px 30px -12px rgba(15, 23, 41, 0.18);
  --shadow-lg: 0 30px 60px -20px rgba(15, 23, 41, 0.28);

  /* Layout widths */
  --container: 1120px;
  --container-narrow: 760px;
}