/*
   Cedar Stone — Design Tokens
   ===========================
   The single source of truth for Cedar Stone's visual language. Any
   future design pass is measured against this file.

   Rules for this file:
   - Tokens only. No element selectors, no layout rules.
   - assets/style.css consumes these tokens exclusively via var(--name).
   - Raw hex values live HERE and only here; style.css must not contain
     a raw hex color outside a var() reference to one of these tokens.

   Palette: Hill Country limestone / cedar green / sky.
*/

:root {
  /* Color — limestone (neutral/background) */
  --color-limestone-50: #faf8f4;
  --color-limestone-100: #f2ede2;
  --color-limestone-300: #ddd2ba;
  --color-limestone-600: #8a7a5c;

  /* Color — cedar green (brand/accent) */
  --color-cedar-500: #4d7a63;
  --color-cedar-600: #3c5f4c;
  --color-cedar-700: #2f4a3c;

  /* Color — sky (link/secondary accent) */
  --color-sky-400: #7fa8c9;
  --color-sky-600: #4c7996;

  /* Color — ink (text) */
  --color-ink-900: #1f2421;
  --color-ink-700: #3a423e;

  --color-white: #ffffff;

  /* Type scale */
  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-md: 1.125rem;
  --font-size-lg: 1.5rem;
  --font-size-xl: 2rem;
  --font-size-xxl: 2.75rem;
  --line-height-tight: 1.2;
  --line-height-base: 1.55;

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

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;
}