/* Hallmark · macrostructure: Marquee Hero · tone: utilitarian-craftsman · anchor hue: amber 55°
 * custom theme: Timber & Steel · vibe: raw-oak framing, poured concrete, NE Oklahoma trades
 * paper-band: light · display-style: condensed-heavy · accent-hue: warm (amber)
 * P5 H5 E5 S5 R4 V4 */

:root {
  /* ── Color ───────────────────────────────────────────────────── */
  --color-paper:          oklch(97.5% 0.005  75);
  --color-paper-2:        oklch(93%   0.009  75);
  --color-paper-3:        oklch(87%   0.012  72);
  --color-surface-dark:   oklch(14%   0.012  65);
  --color-surface-mid:    oklch(20%   0.010  65);
  --color-surface-mid-2:  oklch(26%   0.010  65);
  --color-ink:            oklch(12%   0.012  60);
  --color-ink-2:          oklch(28%   0.012  60);
  --color-ink-muted:      oklch(48%   0.014  60);
  --color-ink-light:      oklch(72%   0.010  65);
  --color-ink-xlight:     oklch(88%   0.006  70);
  --color-accent:         oklch(64%   0.138  55);
  --color-accent-hover:   oklch(57%   0.142  55);
  --color-accent-light:   oklch(88%   0.060  70);
  --color-accent-fg:      oklch(14%   0.012  65);
  --color-focus:          oklch(64%   0.138  55);
  --color-border:         oklch(84%   0.012  75);
  --color-border-dark:    oklch(30%   0.010  65);
  --color-white:          oklch(100%  0      0);

  /* ── Typography ──────────────────────────────────────────────── */
  --font-display: 'Barlow Condensed', sans-serif;
  --font-body:    'Barlow', sans-serif;

  --text-xs:        0.6875rem;
  --text-sm:        0.8125rem;
  --text-base:      1rem;
  --text-lg:        1.125rem;
  --text-xl:        1.25rem;
  --text-2xl:       1.5rem;
  --text-3xl:       1.875rem;
  --text-4xl:       2.25rem;
  --text-5xl:       3rem;
  --text-display-s: 3.75rem;
  --text-display:   clamp(2.75rem, 7vw,  5rem);
  --text-display-l: clamp(3.25rem, 11vw, 7.5rem);

  /* ── Spacing (4pt scale) ─────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  --space-xs:      var(--space-2);
  --space-sm:      var(--space-4);
  --space-md:      var(--space-8);
  --space-lg:      var(--space-16);
  --space-xl:      var(--space-24);
  --space-section: clamp(3rem, 8vw, 5rem);

  /* ── Motion ──────────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:     cubic-bezier(0.64, 0, 0.78, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    120ms;
  --dur-base:    220ms;
  --dur-slow:    380ms;

  /* ── Shape ───────────────────────────────────────────────────── */
  --radius-sm:     2px;
  --radius-md:     4px;
  --radius-lg:     8px;
  --rule-hairline: 1px;
  --rule-thin:     2px;
  --rule-thick:    4px;

  /* ── Layout ──────────────────────────────────────────────────── */
  --max-w-text:    68ch;
  --max-w-content: 1200px;
  --max-w-wide:    1440px;
  --container-px:  clamp(1rem, 4vw, 4rem);
}