/* ============================================================
   Acuity Business & Tax Advisors — Design Tokens
   ============================================================
   Translated from foxterradesign.com's design language.
   Logic preserved: single accent + neutral envelope, 1px architecture,
   serif/sans pairing by role, editorial type rhythm, sharp corners.
   Logic swapped: warm-residential temperature → cool-advisory temperature.
   See research/design-language.md and research/site-spec.md §5 for
   the full translation rationale.
   ============================================================ */

:root {
  /* ---------- COLOR ---------- */
  /* Single chromatic accent (navy) on a cool warm-neutral envelope. */
  --color-paper:        #F7F8FA;  /* page background */
  --color-paper-edge:   #EFF1F4;  /* subtle alt background for striping */
  --color-ink:          #1F2A37;  /* primary text + dark fills */
  --color-ink-soft:     #2D3947;  /* secondary heading on paper */
  --color-mute:         #5A6573;  /* secondary text, captions */
  --color-rule:         #D8DCE2;  /* 1px borders, dividers */
  --color-rule-soft:    #E7EAEF;  /* lighter dividers */
  --color-accent:       #0E3A5F;  /* deep navy — links, key CTAs */
  --color-accent-hover: #0A2B47;  /* accent hover state */
  --color-overlay:      rgba(31, 42, 55, 0.78);  /* hero image overlay */
  --color-paper-on-ink: #F7F8FA;  /* reverse text */

  /* Contrast verification:
     ink (#1F2A37) on paper (#F7F8FA) = 14.2:1   (WCAG AAA: pass)
     mute (#5A6573) on paper (#F7F8FA) = 5.6:1   (WCAG AA large: pass)
     accent (#0E3A5F) on paper (#F7F8FA) = 11.1:1 (WCAG AAA: pass)
     paper-on-ink (#F7F8FA) on ink (#1F2A37) = 14.2:1 (WCAG AAA: pass) */

  /* ---------- TYPOGRAPHY ---------- */
  --font-display: "Fraunces", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;

  /* Scale (desktop). Mobile overrides in site.css media queries. */
  --fs-display-1: 60px;   /* Hero H1 */
  --fs-display-2: 40px;   /* Section H2 */
  --fs-display-3: 28px;   /* Subsection H3 */
  --fs-display-4: 22px;   /* Card heading */
  --fs-eyebrow:   14px;   /* uppercase tracked label */
  --fs-lead:      20px;   /* body lead paragraph */
  --fs-body:      16px;   /* body */
  --fs-small:     14px;   /* caption / fine print */

  --lh-display:   1.1;
  --lh-display-2: 1.15;
  --lh-display-3: 1.2;
  --lh-body:      1.55;
  --lh-tight:     1.4;

  --tracking-display: 0.01em;
  --tracking-eyebrow: 0.08em;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;

  /* ---------- SPACING (4px base) ---------- */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:  16px;
  --space-4:  24px;
  --space-5:  40px;
  --space-6:  60px;
  --space-7:  80px;
  --space-8: 120px;

  --container:        1140px;
  --container-narrow:  720px;
  --container-pad:     24px;

  /* ---------- BORDER + SHAPE ---------- */
  --radius:        0;     /* sharp corners — Foxterra rule preserved */
  --border-width:  1px;   /* 1px architecture — Foxterra rule preserved */
  --border:        var(--border-width) solid var(--color-rule);
  --border-strong: var(--border-width) solid var(--color-ink);

  /* ---------- MOTION ---------- */
  /* Restraint: opacity washes, no scale/lift. */
  --transition-base: 200ms ease-out;
  --transition-slow: 340ms ease-out;
}

/* Mobile type scale overrides */
@media (max-width: 767px) {
  :root {
    --fs-display-1: 36px;
    --fs-display-2: 28px;
    --fs-display-3: 22px;
    --fs-display-4: 20px;
    --fs-lead:      18px;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --fs-display-1: 48px;
    --fs-display-2: 34px;
  }
}

/* Reduced-motion respect */
@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-base: 0ms;
    --transition-slow: 0ms;
  }
}
