/* ═══════════════════════════════════════════════════════════
   ILLYA GRYTSYK — Impasto Analógico Digital
   Earthy · Textured · Debossed · No pure white
   ═══════════════════════════════════════════════════════════ */

:root {
  /* Layer 1 — Earthy Palette (70% base) */
  --ds-umber:        oklch(0.18 0.025 65);
  --ds-clay:         oklch(0.28 0.04 55);
  --ds-chocolate:    oklch(0.22 0.035 45);
  --ds-asphalt:      oklch(0.10 0.005 260);
  --ds-brown-deep:   oklch(0.15 0.03 50);

  /* Layer 1 — Accents (20%) */
  --ds-cadmium-red:  oklch(0.42 0.18 25);
  --ds-olive-green:  oklch(0.38 0.08 135);

  /* Layer 1 — UI Elements (10%) */
  --ds-cream:        oklch(0.92 0.01 85);
  --ds-silver:       oklch(0.75 0.005 240);

  /* Typography */
  --font-display: 'Archivo Black', 'Montserrat', system-ui, sans-serif;
  --font-body: 'Inter', 'Plus Jakarta Sans', system-ui, sans-serif;

  /* Spacing */
  --ds-space-1: 0.25rem; --ds-space-2: 0.5rem; --ds-space-3: 0.75rem;
  --ds-space-4: 1rem; --ds-space-6: 1.5rem; --ds-space-8: 2rem;
  --ds-space-12: 3rem; --ds-space-16: 4rem; --ds-space-24: 6rem; --ds-space-32: 8rem;

  /* Misc */
  --radius-sm: 2px; --radius-md: 4px;
  --shadow-deboss: inset 0 1px 3px rgba(0,0,0,0.6), inset 0 -1px 1px rgba(255,255,255,0.04);
  --shadow-engrave: inset 0 2px 4px rgba(0,0,0,0.5);
}

:root {
  /* Layer 2 — Semantic */
  --color-bg: var(--ds-asphalt);
  --color-surface: var(--ds-umber);
  --color-text: var(--ds-cream);
  --color-text-secondary: var(--ds-silver);
  --color-accent: var(--ds-cadmium-red);
  --color-accent-alt: var(--ds-olive-green);
  --color-border: oklch(0.92 0.01 85 / 0.08);
  --color-border-subtle: oklch(0.92 0.01 85 / 0.04);

  --shadow-card: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-card-hover: 0 8px 24px rgba(0,0,0,0.5);

  --space-section: var(--ds-space-32);
  --space-block: var(--ds-space-16);
  --space-element: var(--ds-space-8);
  --space-inline: var(--ds-space-4);
}