/* TOKENS — Kiln & Lough (demo). Hot/cold contrast: wood + lake. */
:root{
  color-scheme: light;
  --spruce:  #1f3a33;
  --steam:   #e4e8e3;
  --peat:    #3a2b22;
  --glacier: #a9cdd6;
  --ember:   #e9a23b;
  --ink:     #14201c;

  --bg: var(--steam);
  --surface: #d7ddd7;
  --fg: var(--ink);
  --muted: #4a5853;
  --line: #14201c26;
  --accent: var(--ember);
  --on-accent: var(--ink);

  --font-display: "Bricolage Grotesque", system-ui, sans-serif;
  --font-body: "Source Serif 4", Georgia, serif;

  --step--1: clamp(0.9375rem, 0.9119rem + 0.1136vw, 1rem);
  --step-0:  clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem);
  --step-1:  clamp(1.35rem, 1.2631rem + 0.3864vw, 1.5625rem);
  --step-2:  clamp(1.62rem, 1.4837rem + 0.6057vw, 1.9531rem);
  --step-3:  clamp(1.944rem, 1.7405rem + 0.9044vw, 2.4414rem);
  --step-4:  clamp(2.3328rem, 2.0387rem + 1.3072vw, 3.0518rem);
  --step-5:  clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem);
  --display: clamp(3.2rem, 1rem + 8.4vw, 10rem);

  --space-xs: clamp(0.5rem, 0.4rem + 0.5vw, 0.75rem);
  --space-s:  clamp(1rem, 0.8rem + 1vw, 1.5rem);
  --space-m:  clamp(2rem, 1.5rem + 2vw, 3rem);
  --space-l:  clamp(4rem, 3rem + 5vw, 8rem);
  --section:  clamp(5rem, 4rem + 8vw, 10rem);
  --gutter:   clamp(1rem, 0.5rem + 2vw, 2rem);
  --max: 1440px;

  --radius-s: 6px;
  --radius-l: 28px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --header-h: 72px;
}