/* LoopLine Lab — design tokens for the public site.
   Copied from builds/sales-proposal-generator/templates/tokens.css so this build
   stays self-contained. If the palette changes, change it in both places.
   White page, black headings, #414141 body, two cream surfaces. The rule colour
   is one step darker than surface-2: a 1px line in #F2F0E8 is invisible on white. */
:root {
  --bg: #ffffff;
  --ink: #000000;
  --body: #414141;
  --surface-1: #faf9f6;
  --surface-2: #f2f0e8;
  --rule: #eae7dc;

  --font-sans: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --measure: 720px;
  --gutter: 24px;

  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 20px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-section: clamp(56px, 8vw, 96px);

  --radius: 4px;

  --size-eyebrow: 0.75rem;
  --size-small: 0.8125rem;
  --size-body: 1rem;
  --size-lede: clamp(1.0625rem, 1.6vw, 1.1875rem);
  --size-h3: 1.125rem;
  --size-h2: clamp(1.5rem, 3vw, 2rem);
  --size-h1: clamp(2rem, 5vw, 3rem);
}
