/* ==========================================================================
   TJC Design Tokens — The Jorgenson Companies
   Source of truth for all web properties. Edit here, propagate everywhere.
   ========================================================================== */

:root {
  /* ---- Color: warm monochrome core ---- */
  --tjc-ink:        #111111;
  --tjc-charcoal:   #2E2E2E;
  --tjc-slate:      #6B6864;
  --tjc-stone:      #8A857F;
  --tjc-taupe:      #CFC8BF;
  --tjc-sand:       #DDD6CC;
  --tjc-linen:      #E7E1D9;
  --tjc-parchment:  #F5F2ED;
  --tjc-paper:      #FBFAF8;
  --tjc-white:      #FFFFFF;

  /* ---- Color: rationed accents ---- */
  --tjc-evergreen:  #3F4A3B;   /* links, focus, primary hover — the only interactive color */
  --tjc-oak:        #7A5C3E;   /* rare warm accent */
  --tjc-brick:      #8C3B2E;   /* errors only */

  /* ---- Semantic aliases ---- */
  --tjc-bg:             var(--tjc-parchment);
  --tjc-surface:        var(--tjc-paper);
  --tjc-text:           var(--tjc-charcoal);
  --tjc-text-strong:    var(--tjc-ink);
  --tjc-text-muted:     var(--tjc-slate);
  --tjc-text-faint:     var(--tjc-stone);
  --tjc-border:         var(--tjc-taupe);
  --tjc-link:           var(--tjc-evergreen);

  /* ---- Typography ---- */
  --tjc-font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --tjc-font-serif:   Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --tjc-font-sans:    "Inter", -apple-system, "Segoe UI", "Aptos", Helvetica, Arial, sans-serif;

  --tjc-text-display: 3.5rem;    /* 56 */
  --tjc-text-h1:      2.5rem;    /* 40 */
  --tjc-text-h2:      1.875rem;  /* 30 */
  --tjc-text-h3:      1.4375rem; /* 23 */
  --tjc-text-lead:    1.3125rem; /* 21 */
  --tjc-text-body:    1.0625rem; /* 17 */
  --tjc-text-small:   0.90625rem;/* 14.5 */
  --tjc-text-label:   0.78125rem;/* 12.5 */

  --tjc-leading-tight: 1.1;
  --tjc-leading-heading: 1.2;
  --tjc-leading-body: 1.65;

  --tjc-tracking-caps: 0.3em;   /* the letterspaced-caps signature */

  /* ---- Space (4px base) ---- */
  --tjc-space-1: 0.25rem;
  --tjc-space-2: 0.5rem;
  --tjc-space-3: 0.75rem;
  --tjc-space-4: 1rem;
  --tjc-space-6: 1.5rem;
  --tjc-space-8: 2rem;
  --tjc-space-12: 3rem;
  --tjc-space-16: 4rem;
  --tjc-space-24: 6rem;
  --tjc-space-32: 8rem;

  /* ---- Structure ---- */
  --tjc-radius: 2px;             /* nearly square — spartan */
  --tjc-rule: 1px solid var(--tjc-taupe);
  --tjc-frame: 1px solid var(--tjc-taupe);  /* inner hairline frame device */
  --tjc-measure: 68ch;           /* editorial line length */
  --tjc-container: 1120px;
  --tjc-shadow: 0 1px 2px rgba(17, 17, 17, 0.06);  /* barely-there; prefer rules over shadows */
}

/* Dark section: invert values, never invent new ones */
.tjc-dark {
  --tjc-bg:          var(--tjc-ink);
  --tjc-surface:     #1A1A19;
  --tjc-text:        var(--tjc-parchment);
  --tjc-text-strong: var(--tjc-paper);
  --tjc-text-muted:  var(--tjc-taupe);
  --tjc-text-faint:  var(--tjc-stone);
  --tjc-border:      rgba(207, 200, 191, 0.3);
  --tjc-link:        var(--tjc-sand);
  background: var(--tjc-bg);
  color: var(--tjc-text);
}