/* GENERATED FILE — do not edit by hand.
   Source: brand/tokens.json   Regenerate: python3 brand/build-tokens.py */

:root {
  /* Color */
  --color-primary: #1F1F1F;  /* Charcoal — Headlines, wordmark, primary text */
  --color-secondary: #6E6A63;  /* Stone — Secondary text, muted UI, borders */
  --color-accent: #AA753F;  /* Brass — Tagline, WORKS band, buttons, links, spark */
  --color-accent-deep: #8A5D31;  /* Antique Brass — Accent hover / pressed state */
  --color-neutral-dark: #14161A;  /* Ink — Dark section backgrounds, footer */
  --color-neutral-light: #F7F5F1;  /* Warm White — Page background, light sections */
  --color-surface: #FFFFFF;  /* White — Cards, product tiles */
  --color-hairline: #E5E1D8;  /* Hairline — Dividers, subtle borders */

  /* Logo — each SVG paints charcoal from --logo-ink, brass from --logo-accent. */
  --logo-ink: #1F1F1F;
  --logo-accent: #AA753F;

  /* Type */
  --font-heading: "Archivo", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Spacing — 4px scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
}

/* Dark ground: flip the ink, keep brass as brass. One logo file serves both. */
.on-dark {
  --logo-ink: #F7F5F1;
  color: #F7F5F1;
  background: #14161A;
}
