/* ==========================================================================
   More Than a Filter — design tokens
   Palette and type are fixed by the brand system. Derived values (marked
   "derived") exist only to meet WCAG AA contrast where the brand amber or
   sage would be too light for small text on parchment.
   ========================================================================== */

:root {
  /* --- Brand colors ------------------------------------------------------ */
  --ink: #14182a;               /* Ink navy: dark bands, header, footer */
  --parchment: #f6efdd;         /* Parchment: primary paper background */
  --parchment-deep: #efe5c8;    /* Deeper parchment: alternate paper bands */
  --amber: #c0873c;             /* Lamplight amber: accents, primary buttons */
  --amber-hover: #9c6b2b;       /* Lamplight amber, hover/pressed */
  --sage: #5f7a63;              /* Sage: calm secondary accent */
  --text: #1b1710;              /* Ink-brown: body text on paper */
  --hairline: #dfd1a6;          /* Hairline on parchment */
  --hairline-strong: #d9c89a;   /* Stronger hairline / card borders */

  /* --- Derived colors (contrast-safe) ------------------------------------ */
  --ink-raised: #1e2340;        /* derived: cards on ink */
  --ink-line: rgba(246, 239, 221, 0.16); /* derived: hairlines on ink */
  --amber-ink: #7a521c;         /* derived: amber links/labels on paper, 5.7:1 */
  --sage-deep: #3f5645;         /* derived: sage text on paper, 7:1 */
  --text-soft: #4a4233;         /* derived: secondary text on paper, 8:1 */
  --on-ink: #f6efdd;            /* text on ink */
  --on-ink-soft: rgba(246, 239, 221, 0.8);
  --paper-white: #fffdf6;       /* derived: raised surfaces on parchment */

  /* --- Semantic roles ---------------------------------------------------- */
  --bg: var(--parchment);
  --bg-alt: var(--parchment-deep);
  --fg: var(--text);
  --fg-soft: var(--text-soft);
  --link: var(--amber-ink);
  --focus: #1f4fd8;             /* derived: focus ring, visible on paper and ink */
  --focus-on-ink: #f3c775;

  /* --- Type -------------------------------------------------------------- */
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.9rem);
  --step-0: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --step-1: clamp(1.25rem, 1.15rem + 0.5vw, 1.45rem);
  --step-2: clamp(1.5rem, 1.3rem + 0.9vw, 1.9rem);
  --step-3: clamp(1.85rem, 1.5rem + 1.6vw, 2.6rem);
  --step-4: clamp(2.25rem, 1.7rem + 2.6vw, 3.6rem);

  --lh-body: 1.65;
  --lh-tight: 1.15;

  /* --- Space, shape, motion --------------------------------------------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --band-pad: clamp(3rem, 2rem + 4vw, 5.5rem);

  --measure: 68ch;
  --container: 1120px;
  --container-narrow: 760px;
  --gutter: clamp(1.25rem, 4vw, 2rem);

  --radius: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(27, 23, 16, 0.06), 0 1px 1px rgba(27, 23, 16, 0.04);
  --shadow-md: 0 6px 20px rgba(27, 23, 16, 0.08), 0 2px 4px rgba(27, 23, 16, 0.05);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}