/* artist.partners — design tokens: the type ladder, the atom, the palette
   Load order is tokens -> base -> layout -> components -> responsive;
   the media queries come last so they can override component rules.
   See README.md for the rules this system holds to. */

/* ============================================================
   artist.partners — design system prototype v3

   THE LAWS THIS FILE ENCODES
   · one type ladder — 12/14/16/22/34/56/96, nothing off it
   · the 96 step appears at most ONCE per page
   · one 16px atom is gutter, page-margin unit and vertical rhythm
   · three spacing tokens only — 16 / 64 / 160
   · red is the only accent, at most once per screen, at scale
   · rules and space. no boxes, no shadows, no tinted cards
   · the wordmark is SVG outlines, never live text
   · colour imagery = the client's world. monochrome = the
     engineering. never both in one frame.

   ONE PALETTE ADDITION, MADE ON REQUEST
   The 2024 swatch sheet has no white. White is now the ground and
   Bone #ECEBE7 is the hover highlight. Everything else is the
   sanctioned palette untouched.
   ============================================================ */

:root {
  --t-12: 12px; --t-14: 14px; --t-16: 16px; --t-22: 22px;
  --t-34: 34px; --t-56: 56px; --t-96: 96px;

  --atom: 16px;
  --margin: calc(var(--atom) * 3);
  --cols: 12;

  --s-1: 16px; --s-2: 64px; --s-3: 160px;

  --measure: 34em;
  --lh-prose: 1.55;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --nav-h: 58px;

  --font-display: "Rhymes Display", Didot, "Bodoni 72", "Times New Roman", Georgia, serif;
  --font-sans: "PP Neue Montreal", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, monospace;
}

:root {
  --ground: #FFFFFF;
  --highlight: #ECEBE7;      /* Bone, now the highlight */
  --ground-deep: #000000;
  --ink: #000000;
  --ink-on-deep: #D0D0D0;
  --muted: #5A5A5A;
  --accent: #DD3D37;
  --rule: rgba(0, 0, 0, 0.14);
  --rule-deep: rgba(255, 255, 255, 0.18);
  --logo-blend: multiply;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ground: #0E0E0E;
    --highlight: #1D1D1C;
    --ink: #D0D0D0;
    --muted: #8A8A8A;
    --accent: #E8564F;
    --rule: rgba(255, 255, 255, 0.16);
    --logo-blend: screen;    /* logos are dark-on-white artwork */
  }
}
:root[data-theme="light"] {
  --ground: #FFFFFF; --highlight: #ECEBE7; --ink: #000000;
  --muted: #5A5A5A; --accent: #DD3D37; --rule: rgba(0,0,0,.14);
  --logo-blend: multiply;
}
:root[data-theme="dark"] {
  --ground: #0E0E0E; --highlight: #1D1D1C; --ink: #D0D0D0;
  --muted: #8A8A8A; --accent: #E8564F; --rule: rgba(255,255,255,.16);
  --logo-blend: screen;
}