/* Elorati — canonical design tokens for the marketing site.
   ────────────────────────────────────────────────────────────
   SINGLE SOURCE OF TRUTH for palette, type stacks, and spacing on
   elorati.com. Every page links this one file (/brand-tokens.css)
   instead of redefining :root inline, so the site can't drift.

   Canonical upstream: the Marker design system at
   ~/Dev/Elorati/elorati-ds/tokens/ (claude.ai/design project
   "Elorati Design System", id eed47837). Keep this in sync with
   elorati-ds/tokens/{colors,typography,spacing}.css. Webfonts are
   loaded by each page's own <link> (preconnect + Google Fonts), so
   fonts.css is intentionally NOT mirrored here. */

:root {
  /* ---- Primary palette ---- */
  --forest:   #1B2A24;   /* primary ink, dark surfaces */
  --paper:    #F0EBE0;   /* primary surface, warm bone */
  --ochre:    #9B7842;   /* the single accent — colophon, links, focus */
  --moss:     #6F7A72;   /* captions, meta, rules */

  /* ---- Extended neutrals ---- */
  --paper-2:  #E5DED0;   /* tinted card / field surface */
  --ink:      #0D1310;   /* near-black body text, max contrast */
  --muted:    #6a6258;   /* secondary body text on paper */
  --line:     rgba(27, 42, 36, 0.16);   /* hairline rules & borders */
  --line-strong: rgba(27, 42, 36, 0.28);
  --line-paper:  rgba(240, 235, 224, 0.18); /* hairline on forest surfaces */

  /* ---- Venture / sub-brand accents ---- */
  --advisory:   #9B7842; /* ochre */
  --properties: #3A4A40; /* deeper forest */
  --capital:    #6F5A38; /* warm bronze */

  /* ---- Semantic aliases — surfaces ---- */
  --surface-page:    var(--paper);
  --surface-card:    var(--paper-2);
  --surface-inset:   #ece5d6;       /* focused field bg */
  --surface-inverse: var(--forest); /* dark callouts, footers, banners */

  /* ---- Semantic aliases — text ---- */
  --text-heading:   var(--forest);
  --text-body:      var(--ink);
  --text-secondary: var(--muted);
  --text-meta:      var(--moss);
  --text-accent:    var(--ochre);
  --text-on-forest: var(--paper);
  --text-meta-on-forest: rgba(240, 235, 224, 0.55);

  /* ---- Interactive ---- */
  --action:        var(--forest);
  --action-hover:  var(--ink);
  --action-text:   var(--paper);
  --link:          var(--forest);
  --link-underline: var(--ochre);

  /* ---- Type stacks ---- */
  --font-display: 'Source Serif 4', 'Source Serif Pro', Georgia, serif;
  --font-text:    'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* ---- Type scale ---- */
  --text-display-xl: clamp(44px, 7vw, 84px);
  --text-display-l:  clamp(40px, 6.5vw, 80px);
  --text-display-m:  clamp(30px, 4vw, 44px);
  --text-display-s:  28px;
  --text-display-xs: 22px;
  --text-lede:   clamp(17px, 1.4vw, 19px);
  --text-ui:     14.5px;
  --text-sm:     13.5px;
  --text-xs:     12.5px;
  --text-eyebrow: 11px;
  --text-label:   10.5px;

  /* ---- Tracking & leading ---- */
  --track-mono:    0.14em;
  --track-display: -0.012em;
  --track-display-tight: -0.018em;
  --leading-display: 1.0;
  --leading-snug:    1.15;
  --leading-body:    1.6;
  --leading-reading: 1.75;

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

  /* ---- Layout ---- */
  --container-max: 1120px;
  --container-prose: 760px;
  --container-narrow: 720px;
  --gutter: 32px;
  --gutter-tight: 22px;
  --section-y: 96px;

  /* ---- Radius — crisp, never pills ---- */
  --radius-0: 0px;
  --radius-sm: 2px;
  --radius: 3px;
  --radius-lg: 4px;

  /* ---- Motion — quiet, no bounce ---- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 0.18s;
  --dur: 0.2s;
  --dur-slow: 0.32s;
}