/* ============================================================
   Steiff Editorial — Color tokens
   Calm, editorial e-commerce palette. White canvas, black ink,
   pastel full-bleed blocks for warmth. No gradients.
   ============================================================ */

:root {
  /* ---- Neutral base ---- */
  --white: #FFFFFF;
  --black: #000000;
  --ink-heading: #0E0C0C;   /* headings */
  --ink-body: #000000;      /* body copy */
  --ink-muted: #656565;     /* secondary text, sublinks */
  --surface-page: #FFFFFF;  /* page background */
  --surface-soft: #F5F5F5;  /* neutral section / card */
  --line: #E2E2E2;          /* hairline dividers */
  --line-strong: #000000;   /* full-bleed nav rule */

  /* ---- Accent / signal ---- */
  --sale-red: #C92C30;      /* prices, sale links */
  --sale-red-bright: #D73246;

  /* ---- Pastel block fields (rotate across cards) ---- */
  --pastel-sage: #CDD7D7;   /* sage grey-green */
  --pastel-mist: #C8CDD7;   /* light dusty blue */
  --pastel-steel: #8CA0B9;  /* strong dusty blue */
  --pastel-sand: #E6D8C3;   /* sand / beige */
  --pastel-apricot: #FFD7A5;
  --pastel-peach: #FAE1D7;
  --pastel-mauve: #D7CDD7;  /* lilac / mauve */

  /* ---- Semantic aliases ---- */
  --text-heading: var(--ink-heading);
  --text-body: var(--ink-body);
  --text-muted: var(--ink-muted);
  --text-on-dark: var(--white);
  --text-price: var(--sale-red);

  --surface-card: var(--surface-soft);
  --surface-footer: var(--black);
  --surface-inverse: var(--black);

  --btn-primary-bg: var(--black);
  --btn-primary-fg: var(--white);
  --btn-secondary-bg: var(--white);
  --btn-secondary-fg: var(--ink-muted);

  --border-default: var(--line);
  --border-inverse: var(--black);
}