/* theme.css — swappable design tokens only. Retheme here, never in markup.
   Direction: bright white, Swiss-editorial, subdued, distinct, with color accents. */
:root {
  /* Ink is a deep indigo, not neutral black. Body copy is a slate-indigo. */
  --ink:        #1B1E3B;  /* deep indigo-ink: headings + strong text */
  --ink-soft:   #4C5170;  /* slate-indigo: body copy */
  --ink-faint:  #8A8FA8;  /* captions, meta, hairline labels */
  --paper:      #FFFFFF;  /* bright white base */
  --paper-2:    #F7F7FB;  /* faint cool off-white for alternate sections */
  --line:       #E7E7EF;  /* hairline rules and borders */

  /* Accent set — one primary plus two supporting hues, used in small touches */
  --accent:     #3A46D9;  /* indigo, primary accent */
  --accent-dk:  #2A34B0;  /* indigo hover */
  --accent-tint:#EEF0FC;  /* faint indigo wash */
  --c-teal:     #12A594;  /* supporting */
  --c-coral:    #F0654A;  /* supporting */

  --on-ink:     #FFFFFF;  /* text on the deep-indigo block */
  --on-ink-soft:#AEB2CC;  /* muted text on the deep-indigo block */
  --focus:      #3A46D9;

  /* Type — all sans, editorial grotesk feel via a clean system stack */
  --font-sans: "Helvetica Neue", Helvetica, Arial, "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, "Cascadia Mono", monospace;

  --fs-eyebrow: 0.75rem;
  --fs-body:    1.0625rem;
  --fs-lead:    1.375rem;
  --fs-h3:      1.25rem;
  --fs-h2:      2.25rem;
  --fs-h1:      3rem;
  --fs-display: 3.5rem;

  /* Space — generous */
  --sp-1: 0.5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2rem;
  --sp-5: 3rem;
  --sp-6: 5rem;
  --sp-7: 7rem;

  --maxw-wide: 74rem;
  --maxw-prose: 42rem;

  --radius: 4px;
  --border: 1px solid var(--line);
  --transition: 200ms ease;
}

@media (min-width: 900px) {
  :root {
    --fs-display: 5rem;
    --fs-h1: 3.5rem;
    --fs-h2: 2.75rem;
    --fs-lead: 1.5rem;
  }
}