/* Bovarius Capital — design tokens
   Single source of truth for color, type, spacing.
   Update tokens here, never inline. */

:root {
  /* Brand palette: Light stone canvas + graphite + brass accent */
  --color-paper:    #D8D3C8;   /* page background */
  --color-surface:  #C5BFB2;   /* card / secondary surface */
  --color-ink:      #383838;   /* primary type, dark sections */
  --color-stone:    #6E6960;   /* secondary text, borders */
  --color-cream:    #F1ECE0;   /* text on dark sections */
  --color-brass:    #B08A4A;   /* single accent — small surface area */
  --color-brass-deep: #5A4520; /* brass text on light tints */

  /* Aliases */
  --color-bg:     var(--color-paper);
  --color-text:   var(--color-ink);
  --color-accent: var(--color-brass);

  /* Borders */
  --border-soft:   rgba(56, 56, 56, 0.10);
  --border-medium: rgba(56, 56, 56, 0.15);
  --border-strong: rgba(56, 56, 56, 0.30);

  /* Typography */
  --font-body:    'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-heading: 'Instrument Serif', Georgia, "Times New Roman", serif;

  /* Type scale (mobile baseline; desktop overrides via media query) */
  --fs-hero:    40px;
  --fs-h2:      28px;
  --fs-h3:      20px;
  --fs-body:    15px;
  --fs-small:   13px;
  --fs-label:   11px;
  --fs-fineprint: 11px;

  /* Spacing */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  4rem;
  --space-xl:  6rem;

  /* Layout */
  --max-width: 1100px;
  --gutter:    1.5rem;

  /* Misc */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;
}

@media (min-width: 720px) {
  :root {
    --fs-hero:  64px;
    --fs-h2:    40px;
    --fs-h3:    24px;
    --fs-body:  16px;
    --fs-small: 14px;
    --gutter:   2.5rem;
  }
}

@media (min-width: 1100px) {
  :root {
    --fs-hero:  76px;
    --fs-h2:    44px;
  }
}