/*
 * Design System — Tokens
 * Owner: Architect Agent
 * -----------------------------------------------
 * This file is the single source of truth for all
 * visual values in the website. No other file may
 * define colors, fonts, or spacing outside of these
 * custom properties.
 *
 * To add or change a token: invoke the Architect agent.
 * Do NOT edit this file directly during page builds.
 */

:root {

  /* ─── Color palette — primary tokens ──────────── */
  --color-bg:               #F4F1EA;
  --color-bg-alt:           #EBE8E0;
  --color-bg-card:          #ffffff;

  --color-primary:          #1F3A34;
  --color-primary-hover:    #2d4a42;
  --color-primary-light:    #3d5f54;

  --color-accent:           #c9a84c;
  --color-accent-light:     #e0c76a;
  --color-accent-dim:       rgba(201, 168, 76, 0.15);

  --color-highlight:        #c17842;

  --color-text:             #1F3A34;
  --color-text-secondary:   #5c5c5c;
  --color-text-muted:       #8a8a8a;
  --color-text-on-primary:         rgba(244, 241, 234, 1.0);   /* light text on dark green bg */
  --color-text-on-primary-muted:   rgba(244, 241, 234, 0.75);  /* secondary text on dark green bg */
  --color-text-on-primary-subtle:  rgba(244, 241, 234, 0.45);  /* tertiary / disabled on dark green bg */

  --color-border:           rgba(31, 58, 52, 0.1);
  --color-border-hover:     rgba(31, 58, 52, 0.2);

  /* ─── Legacy aliases (keep until all pages migrated) ── */
  --bg:           var(--color-bg);
  --bg-alt:       var(--color-bg-alt);
  --bg-card:      var(--color-bg-card);
  --green-dark:   var(--color-primary);
  --green:        var(--color-primary-hover);
  --green-light:  var(--color-primary-light);
  --gold:         var(--color-accent);
  --gold-light:   var(--color-accent-light);
  --gold-dim:     var(--color-accent-dim);
  --copper:       var(--color-highlight);
  --text-primary:   var(--color-text);
  --text-secondary: var(--color-text-secondary);
  --text-muted:     var(--color-text-muted);
  --border:         var(--color-border);
  --border-hover:   var(--color-border-hover);

  /* ─── Typography ──────────────────────────────── */
  --font-family-heading:  'Source Serif 4', serif;
  --font-family-body:     'Inter', -apple-system, sans-serif;
  --font-family-mono:     monospace;

  --font-size-xs:   0.75rem;   /*  12px */
  --font-size-sm:   0.875rem;  /*  14px */
  --font-size-base: 1rem;      /*  16px */
  --font-size-md:   1.125rem;  /*  18px */
  --font-size-lg:   1.25rem;   /*  20px */
  --font-size-xl:   1.5rem;    /*  24px */
  --font-size-2xl:  2rem;      /*  32px */
  --font-size-3xl:  2.5rem;    /*  40px */
  --font-size-4xl:  3rem;      /*  48px */

  --font-weight-light:    300;
  --font-weight-normal:   400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;

  --line-height-tight:    1.2;
  --line-height-snug:     1.4;
  --line-height-normal:   1.6;
  --line-height-relaxed:  1.8;

  --letter-spacing-tight:  -0.02em;
  --letter-spacing-normal:  0em;
  --letter-spacing-wide:    0.05em;

  /* ─── Spacing scale ───────────────────────────── */
  --space-1:   0.25rem;   /*  4px */
  --space-2:   0.5rem;    /*  8px */
  --space-3:   0.75rem;   /* 12px */
  --space-4:   1rem;      /* 16px */
  --space-5:   1.25rem;   /* 20px */
  --space-6:   1.5rem;    /* 24px */
  --space-8:   2rem;      /* 32px */
  --space-10:  2.5rem;    /* 40px */
  --space-12:  3rem;      /* 48px */
  --space-16:  4rem;      /* 64px */
  --space-20:  5rem;      /* 80px */
  --space-24:  6rem;      /* 96px */

  /* ─── Layout ──────────────────────────────────── */
  --max-width-content: 720px;
  --max-width-wide:    1100px;
  --max-width-full:    100%;

  /* ─── Border radius ───────────────────────────── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-full: 9999px;

  /* ─── Shadows ─────────────────────────────────── */
  --shadow-sm:  0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md:  0 4px 12px rgba(0, 0, 0, 0.10);
  --shadow-lg:  0 8px 24px rgba(0, 0, 0, 0.12);

  /* ─── Transitions ─────────────────────────────── */
  --transition-fast:   150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow:   400ms ease;

  /* ─── Z-index scale ───────────────────────────── */
  --z-below:   -1;
  --z-base:     0;
  --z-raised:   10;
  --z-overlay:  100;
  --z-modal:    200;
  --z-toast:    300;
}