/* ============================================================
   Bethune & Associates - Design Tokens
   Source of truth: Brand Identity System (Upscale Final)
   Prepared by Mike DeBoard / The Operating Standard
   ------------------------------------------------------------
   These CSS custom properties are the canonical values every
   component and section reads from. Change a value here and it
   flows everywhere.
   ============================================================ */

/* Brand typefaces - EB Garamond (display) + Roboto (body). */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;700;800&family=Roboto:wght@400;500;700&display=swap');

:root {
  /* ---- Color · Primary ---- */
  --ba-burgundy:        #78202B; /* Bethune Burgundy - logo, headlines, hero, primary buttons, table headers */
  --ba-burgundy-deep:   #4F141B; /* Deep Burgundy - hover/active states, depth, gradients over photography */

  /* ---- Color · Secondary (accent only) ---- */
  --ba-gold:            #C8B291; /* Champagne Gold - eyebrows, icons, rules, dividers. NEVER body text on white. */

  /* ---- Color · Neutrals ---- */
  --ba-charcoal:        #272626; /* Charcoal Ink - body text and dark UI (warmer than pure black) */
  --ba-slate:           #2F2E42; /* Deep Slate - alternate dark sections, footers, feature bands */
  --ba-gray-100:        #F4F4F4; /* Light Gray - section backgrounds, cards, table striping */
  --ba-white:           #FFFFFF; /* White - primary background; text on burgundy/slate */

  /* Convenience aliases (semantic) */
  --ba-bg:              var(--ba-white);
  --ba-bg-subtle:       var(--ba-gray-100);
  --ba-text:            var(--ba-charcoal);
  --ba-text-muted:      #6b6b6b;        /* muted gray for captions */
  --ba-text-on-dark:    var(--ba-white);
  --ba-accent:          var(--ba-gold);
  --ba-primary:         var(--ba-burgundy);
  --ba-primary-hover:   var(--ba-burgundy-deep);

  /* ---- Typography · Families ---- */
  --ba-font-display: 'EB Garamond', 'Cormorant Garamond', Garamond, Georgia, 'Times New Roman', serif;
  --ba-font-body:    'Roboto', Arial, Helvetica, system-ui, sans-serif;

  /* ---- Typography · Scale (web) ---- */
  --ba-fs-h1:      56px;  /* Hero        48–60px  Garamond heavy */
  --ba-fs-h2:      38px;  /* Section     36–40px  Garamond heavy */
  --ba-fs-h3:      26px;  /* Subhead     24–28px  Garamond / Roboto bold */
  --ba-fs-eyebrow: 13px;  /* Overline    12–14px  Roboto bold, uppercase, tracked */
  --ba-fs-body:    17px;  /* Body        16–18px  Roboto regular */
  --ba-fs-small:   13px;  /* Caption     13–14px  Roboto, muted */

  --ba-lh-tight:   1.15;
  --ba-lh-body:    1.6;
  --ba-tracking-eyebrow: 0.12em;

  --ba-fw-body:     400;
  --ba-fw-bold:     700;
  --ba-fw-display:  700;  /* "heavy" weights for H1/H2 */

  /* ---- Spacing (4px base) ---- */
  --ba-space-1: 4px;
  --ba-space-2: 8px;
  --ba-space-3: 12px;
  --ba-space-4: 16px;
  --ba-space-5: 24px;
  --ba-space-6: 32px;
  --ba-space-7: 48px;
  --ba-space-8: 64px;

  /* ---- Radius & Rules ---- */
  --ba-radius:      4px;  /* "small radius" per brand - buttons, cards */
  --ba-radius-lg:   8px;
  --ba-rule:        2px;  /* section-title rules: 2–3px gold or burgundy */
  --ba-rule-thick:  3px;

  /* ---- Elevation (restrained) ---- */
  --ba-shadow-sm: 0 1px 2px rgba(39, 38, 38, 0.08);
  --ba-shadow-md: 0 4px 14px rgba(39, 38, 38, 0.10);
}