/*
  Design tokens from docs/brand/brand-identity.md sections 4-6.
  Values here must not diverge from that document. Change the doc first.
*/

:root {
  /* Ink */
  --ink-900: #12100e;
  --ink-700: #2a2724;
  --ink-500: #56504a;
  --ink-300: #8c8579;

  /* Paper */
  --paper-000: #ffffff;
  --paper-050: #faf8f5;
  --paper-100: #f2eee8;
  --paper-200: #e4ded5;

  /* Brass accent */
  --brass-500: #9c7c4a;
  --brass-600: #856542;
  --brass-700: #6e5233;

  /* Type families */
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;

  /* Type scale */
  --text-display-xl: clamp(2.75rem, 6vw, 4.5rem);
  --text-display-l: clamp(1.75rem, 3.4vw, 2.5rem);
  --text-display-s: 1.5rem;
  --text-body-l: 1.0625rem;
  --text-body-s: 0.8125rem;
  --text-label: 0.75rem;

  /* Spacing scale, 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;

  /* Layout */
  --container-max: 1280px;
  --gutter: 20px;

  /* Radius */
  --radius-none: 0;
  --radius-sm: 2px;

  /* Motion */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;
}

@media (min-width: 768px) {
  :root {
    --gutter: 32px;
  }
}

@media (min-width: 1024px) {
  :root {
    --gutter: 40px;
  }
}