/**
 * The site's spacing scale.
 *
 * ── WHERE THESE NUMBERS CAME FROM ─────────────────────────────────────────
 * They were not chosen. They were measured. Across the customer-facing pages
 * there were 2,280 rem values in padding, margin and gap declarations, spread
 * over 55 distinct numbers. Seven of them were used more than a hundred times
 * each, and those seven turned out to be an unbroken ascending scale:
 *
 *     .5   .75   1   1.25   1.5   2   2.5
 *
 * That is the site's spacing system. It already existed; nobody had written
 * it down. Everything else (.55rem, .6rem, .65rem, .85rem and the rest) is
 * drift around these values, and is deliberately left alone: replacing a
 * .65rem with a .75rem would move pixels, and this file moves none.
 *
 * ── WHY IT IS A SEPARATE FILE ─────────────────────────────────────────────
 * Every page carries its own :root block, so the palette is already written
 * out twenty times. Adding seven more variables to each of those would be
 * twenty more copies of one rule, which is the failure this codebase keeps
 * having. One file, linked by every page that uses it, and a build gate
 * (check-spacing-tokens.mjs) that fails if a page uses var(--s-*) without
 * linking this file. A page that used them without the link would lose all
 * its spacing at once.
 *
 * ── ADDING TO THIS ────────────────────────────────────────────────────────
 * Do not add a value because a design needs it once. Add one when it has
 * earned its place by being used, and say how many times in the comment.
 */

:root {
  --s-xs:  .5rem;
  --s-sm:  .75rem;
  --s-md:  1rem;
  --s-lg:  1.25rem;
  --s-xl:  1.5rem;
  --s-2xl: 2rem;
  --s-3xl: 2.5rem;
}

/**
 * The palette.
 *
 * ── WHY IT MOVED HERE ─────────────────────────────────────────────────────
 * It was written out in nineteen :root blocks, one per page, and twelve of
 * the thirty variables had drifted. Some of that drift is visible: the page
 * background --warm was #FBF8F3 on thirteen pages, #FFFDF9 on four, and
 * #FDF8F3 on one, so the site had three slightly different creams depending
 * which page you were on.
 *
 * ── WHAT IS HERE AND WHAT IS NOT ──────────────────────────────────────────
 * The values below are the ones the pages already agreed on, plus the
 * majority value for the five that had drifted. Moving them here changed no
 * pixel anywhere: a page that disagreed keeps its own declaration in its own
 * :root, which still wins because the page's <style> comes after this file.
 *
 * That is the point. The disagreement is not resolved here, it is made
 * visible. A page with a local --warm is now obviously overriding a default
 * rather than quietly holding the twentieth copy of one, and grepping for the
 * override finds every page that differs.
 *
 * The remaining overrides, all deliberate until someone decides otherwise:
 *
 *   --warm    contact, gift-confirmation, legal, privacy-choices (#FFFDF9)
 *             couple-types (#FDF8F3)
 *   --ink     legal, privacy-choices (#1E1610)
 *   --indigo  start (#5B6DF8)
 *   --cream   checkout, start (#FFFDFA, one digit off; probably a typo)
 *   --bfont   404 (adds system-ui to the stack)
 *
 * ── NOT HERE ON PURPOSE ───────────────────────────────────────────────────
 * admin.html, feedback.html and workbook-render.html keep their own palettes
 * entirely. They are a dashboard, a survey and a print renderer, and they are
 * meant to look different from the site rather than having drifted from it.
 */

:root {
  --hfont:  'Playfair Display',Georgia,serif;
  --bfont:  'DM Sans',sans-serif;

  --ink:    #0E0B07;
  --text:   #1E1610;
  --muted:  #8C7A68;
  --stone:  #E8DDD0;

  --warm:   #FBF8F3;
  --cream:  #FFFDF9;

  --orange: #E8673A;
  --indigo: #1B5FE8;
  --clay:   #C17F47;
  --green:  #10b981;
}

/**
 * ── HEADINGS DO NOT ITALICISE ─────────────────────────────────────────────
 * Every page hero was written as a plain half and an <em> half, which the
 * browser renders in italic serif and which several pages also coloured. It
 * read as two voices in one sentence.
 *
 * The <em> tags are left in the markup because they are how each headline is
 * broken, and pulling twelve of them out by hand is twelve chances to drop a
 * word. This turns off the styling instead, in one place, so a new page cannot
 * reintroduce it by copying an old one.
 *
 * Body prose keeps its italics. This is scoped to headings.
 */
h1 em,
h2 em,
h3 em {
  font-style: normal;
  color: inherit;
}