/* BARPLUS design tokens — CONVERSION.md 5.5 */

:root {
  /* Palette. Four colours and nothing else: no other hues, no gradients,
     no shadows. */
  --ivory: #F6F5F0;       /* every background */
  --ink: #1A1A1A;         /* headings, body text, the wordmark */
  --maroon: #7A1F2E;      /* the plus, buttons, links, prices, rules, the countdown */
  --maroon-tint: #F1E4E7; /* only "Available on" badges and hover */
  --rule: #E3E0D8;        /* card borders */

  /* Greys of --ink, for quieter text; no hue of their own. */
  --ink-soft: #4A4A48;    /* 8.1:1 on --ivory */
  --ink-faint: #5E5E5B;   /* 6.0:1 on --ivory */
  /* --maroon is 9.3:1 on --ivory and --ivory on it the same, so links,
     prices and button text all clear AA. */

  --focus: var(--maroon);

  /* Type */
  --font-heading: "Playfair Display", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --text-base: 1.0625rem; /* 17px; 16px on phones (base.css) */
  --measure: 68ch;        /* keeps line length under 75 characters */

  /* Space */
  --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: 4rem;

  /* Shape: square-ish, hairline borders */
  --radius: 2px;
  --border: 1px solid var(--rule);
  --hairline: 1px solid var(--maroon);
}