/* Interface — brand tokens (from Brand Kit §2) */

:root {
  /* Colour */
  --color-ink:           #111111;
  --color-ink-soft:      #2A2A2A;
  --color-ink-muted:     #6B6B6B;
  --color-rule:          #E5E2DC;
  --color-bone:          #F4F1EB;
  --color-paper:         #FAF8F3;
  --color-white:         #FFFFFF;
  --color-clay:          #B8543A;
  --color-clay-deep:     #8A3A25;
  --color-moss:          #4A5A3A;
  --color-sand:          #D7C9B3;
  --color-slate:         #3C4248;

  /* Semantic aliases */
  --color-bg:            var(--color-paper);
  --color-bg-alt:        var(--color-bone);
  --color-bg-inverse:    var(--color-ink);
  --color-text:          var(--color-ink);
  --color-text-inverse:  var(--color-paper);
  --color-border:        var(--color-rule);
  --color-link:          var(--color-ink);
  --color-link-hover:    var(--color-clay);
  --color-focus:         var(--color-clay);

  /* Type */
  --font-sans:    "Archivo", "Akzidenz-Grotesk Pro", "Neue Haas Grotesk", "Inter", system-ui, sans-serif;
  --font-display: var(--font-sans);
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* Layout */
  --container-max:  1440px;
  --container-pad:  clamp(20px, 4vw, 72px);
  --gutter:         24px;

  /* Spacing scale (8px base) */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;
  --space-11: 160px;

  /* Radius, borders, elevation */
  --radius-none:     0;
  --radius-xs:       2px;
  --radius-sm:       4px;
  --border-hairline: 1px solid var(--color-rule);
  --border-strong:   1px solid var(--color-ink);
  --shadow-none:     none;
  --shadow-lift:     0 1px 0 rgba(17, 17, 17, 0.06);

  /* Motion */
  --ease-standard:  cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-emphasis:  cubic-bezier(0.85, 0, 0.15, 1);
  --dur-fast:       150ms;
  --dur-base:       300ms;
  --dur-slow:       600ms;
  --dur-reveal:     900ms;
}