/* ---------------------------------------------------------------------------
 * Birth Blooms — design tokens.
 * Mirrors scripts/lib/brand.mjs so a shipped print and the page selling it
 * cannot drift — change one and you MUST re-run `npm run product`, or the sheets
 * and the page that sells them end up on different paper.
 *
 * Live palette: WHITE. Black ink, black buttons, no colour. Two alternates are kept ready in design/palettes/ —
 * `ink.css` (near-black CTA) and `indigo.css`. To swap, paste that file's two
 * blocks over the two below and re-run `npm run product`. Palette: ~5 deliberate values (P-01), built in HSL (P-21),
 * proportioned 60/30/10 with the accent RESERVED for the primary CTA (P-38).
 * Semantic + invertible from the start, so dark mode is a token swap, not a
 * bolt-on (P-37).
 * ------------------------------------------------------------------------- */
:root {
  /* -- 60: white. Actually white — no cast, no tint, no family. ---------- */
  --paper:        hsl(0 0% 100%);
  --paper-deep:   hsl(0 0% 96.5%);
  --paper-edge:   hsl(0 0% 88%);

  /* -- 30: ink. Neutral greys, the same ink the drawings are in. --------- */
  --ink:          hsl(0 0% 9%);
  --ink-soft:     hsl(0 0% 32%);     /* body-adjacent, must clear 4.5:1 on paper */
  --ink-faint:    hsl(0 0% 43%);     /* captions, marks, attributions — 4.5:1    */
  --stem:         hsl(0 0% 34%);

  /* -- 10: the action colour is black. There is no colour on this page. --- */
  --accent:       hsl(0 0% 11%);
  --accent-deep:  hsl(0 0% 0%);
  --accent-tint:  hsl(0 0% 95%);

  /* -- surfaces --------------------------------------------------------- */
  --surface:      var(--paper);
  --surface-2:    var(--paper-deep);
  --border:       hsl(0 0% 90%);
  --on-accent:    hsl(0 0% 100%);

  /* -- type ------------------------------------------------------------- */
  --display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --body:    "Karla", "Helvetica Neue", Arial, sans-serif;

  /* Non-linear scale, px/rem only — never em (P-19, P-22). */
  --t--1: 0.875rem;   /* 14 */
  --t-0:  1.0625rem;  /* 17 — body */
  --t-1:  1.3125rem;  /* 21 */
  --t-2:  1.625rem;   /* 26 */
  --t-3:  2.125rem;   /* 34 */
  --t-4:  2.875rem;   /* 46 */
  --t-5:  clamp(2.75rem, 6.4vw, 4.75rem);

  --lh-tight: 1.06;
  --lh-body:  1.45;
  --measure:  62ch;

  /* Spacing — no two steps closer than ~25% (P-19). */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 136px;

  /* Radii — deliberately not the uniform 16px AI-default (P-07). */
  --r-sm: 3px; --r-md: 8px; --r-lg: 14px; --r-pill: 999px;

  /* One light source, from above (P-23). */
  --lift-1: 0 1px 1px hsl(28 20% 30% / .07), 0 2px 4px hsl(28 20% 25% / .06);
  --lift-2: 0 1px 1px hsl(28 20% 30% / .10), 0 8px 22px hsl(28 20% 25% / .10);
  --lift-3: 0 1px 2px hsl(28 20% 30% / .13), 0 22px 48px hsl(28 20% 25% / .15);

  --page: 1120px;
  --ease: cubic-bezier(.2, .7, .3, 1);
  --ease-out: cubic-bezier(.22, 1, .36, 1);   /* the long, settled easing BYQ uses */
  --marquee-duration: 90s;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper:      hsl(0 0% 7%);
    --paper-deep: hsl(0 0% 11%);
    --paper-edge: hsl(0 0% 22%);
    --ink:        hsl(0 0% 96%);
    --ink-soft:   hsl(0 0% 74%);
    --ink-faint:  hsl(0 0% 64%);
    --stem:       hsl(0 0% 70%);
    --accent:     hsl(0 0% 96%);
    --accent-deep:hsl(0 0% 100%);
    --accent-tint:hsl(0 0% 16%);
    --border:     hsl(0 0% 22%);
    --on-accent:  hsl(0 0% 7%);
    --lift-1: 0 1px 1px hsl(0 0% 0% / .30), 0 2px 4px hsl(0 0% 0% / .24);
    --lift-2: 0 1px 1px hsl(0 0% 0% / .36), 0 8px 22px hsl(0 0% 0% / .34);
    --lift-3: 0 1px 2px hsl(0 0% 0% / .42), 0 22px 48px hsl(0 0% 0% / .46);
  }
}
