/* bestaicustomerserviceagents.com — design tokens.
   Direction: the calm ops desk. A CX leader comparing billing units (per
   outcome vs per resolution vs per session vs per seat) is making a
   budget call, not reading a trade journal — so this sibling keeps the
   brief's original Plus Jakarta Sans as its one voice, warmed with a
   terracotta signal and a visibly softer corner than its two siblings.
   No separate serif for long-form copy: the register here is product
   writing, not analyst prose, so introducing a third face would read as
   borrowed authority instead of earned calm.
   Critique: the risk for a vertical this close to generic SaaS is
   defaulting to indigo-on-white. Warm paper and a terracotta that reads as
   stationery, not a brand gradient, is the whole fix.
   Every colour and every font is declared here as a :root token. No literal
   colour or font-family may appear in assets/site.css or templates/. */
:root {
  /* Colour — flat only, no gradients. */
  --color-paper: #fbf6f1;
  --color-surface: #f1e6dc;
  --color-ink: #231a14;
  --color-ink-muted: #7a6657;
  --color-line: #d2c0ac;
  --color-accent: #a8431c;
  --color-accent-ink: #ffffff;
  --color-focus: #a8431c;

  /* Type — one humanist sans throughout; the mono is the one face shared
     with the flagship and the law-firm sibling. */
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-prose: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  --text-xs: 0.8125rem;
  --text-small: 0.9375rem;
  --text-base: 1.0625rem;
  --text-h3: 1.25rem;
  --text-h2: 1.625rem;
  --text-h1: 2.5rem;
  --leading-tight: 1.2;
  --leading-base: 1.6;
  --leading-prose: 1.7;
  --tracking-display: -0.008em;

  /* Space (8px-derived scale) */
  --gutter: 1.25rem;
  --space-0: 0.25rem;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.75rem;
  --space-4: 3rem;
  --space-5: 4.5rem;

  /* Layout */
  --measure: 68rem;
  --radius: 0.5rem;
  --radius-sm: 0.25rem;

  /* Masthead geometry — one quiet hairline, nothing above it. */
  --header-rule: 1px solid var(--color-line);
  --wordmark-style: normal;
}