/*
 * Design tokens — single source of truth for color, spacing, type and grid.
 * See docs/design-system.md for the full specification.
 *
 * Color values below implement the agreed DIRECTION (black background, warm-white
 * type) but the exact final hex values were never specified and are flagged as
 * open in docs/visual-design-direction.md. Treat these as working defaults, not
 * finalized brand colors — revisit in Stage 4.
 */

:root {
  /* Color — working defaults, exact shade pending Stage 4 confirmation */
  --color-background: #000000;
  --color-text: #f2efe9; /* warm off-white, not pure #ffffff */
  --color-text-muted: #a8a49c;
  --color-border-subtle: #262626;

  /* Spacing scale — strict 8px-based tokens. No arbitrary values. */
  --space-4: 4px;
  --space-8: 8px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-128: 128px;
  --space-192: 192px;
  --space-256: 256px;

  /* Typography — Adobe Fonts kit not yet configured (see docs/design-system.md).
     First family in each stack is the intended Adobe Fonts CSS name; system
     fallbacks apply until the kit is added, with no markup/CSS changes needed. */
  --font-sans: "acumin-pro", -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif: "adobe-caslon-pro", Georgia, "Times New Roman", serif;

  /* Nav typography */
  --nav-font-size: 12px;
  --nav-letter-spacing: 0.05em;

  /* Grid */
  --grid-columns: 12;
  --grid-gutter: var(--space-32);

  /* Text measure — not part of the spacing scale by nature (it constrains line
     length for readability, not spacing between elements). 640px keeps long-form
     text (artist statements, introductions) at a comfortable reading width. */
  --measure-text: 640px;

  /* Responsive page margins (mobile-first default) */
  --page-margin: var(--space-24);

  /* Header — approved spec calls for 72-88px, which falls between spacing-scale
     tokens (64/96). 80px is used: within the requested range and still an 8px
     multiple, consistent with the spacing system's base unit even though it
     isn't one of the 11 named tokens. */
  --header-height: 80px;
}

/* Laptop-sized screens */
@media (min-width: 768px) {
  :root {
    --page-margin: var(--space-64);
  }
}

/* Large desktop screens */
@media (min-width: 1440px) {
  :root {
    --page-margin: var(--space-96);
  }
}