/* ==========================================================================
   Design tokens — Brian Sculley Real Estate redesign
   Source: client PDF Step 1 (approved palette, fonts, buttons) + live-site
   measurements (container 1280px, section padding 112px, button metrics).
   Every component reads from these variables; no raw hex in components.
   ========================================================================== */
:root {
  /* Color — PDF Step 1 */
  --c-text: #111111;          /* main text + header text */
  --c-muted: #6B6B6B;         /* secondary text */
  --c-bg: #FFFFFF;            /* main background */
  --c-alt: #F7F4EF;           /* alternating warm sections */
  --c-accent: #1E6B73;        /* deep teal — "Book a Coffee Chat" + landing-page primary only */
  --c-accent-hover: #17545B;  /* darker teal for hover (derived, 8.6:1 on white) */
  --c-line: #E1DDD7;          /* existing form/field border measured on live site */
  --c-line-strong: #111111;
  --c-footer-bg: #111111;     /* existing footer background (preserved) */
  --c-footer-text: #CACACA;   /* existing footer body text (preserved) */
  --c-on-dark: #FFFFFF;
  --c-error: #A12A1E;         /* form errors only (not a brand color) */
  --c-focus: #1E6B73;
  --c-pending-bg: #E9E4DC;
  --c-pending-text: #5A554E;

  /* Backup accents — documented, NOT active (PDF Step 1, need approval)
     terracotta #B5482F · forest green #2F5D50 */

  /* Type — PDF Step 1: Playfair Display headings, DM Sans body */
  --f-head: "Playfair Display", Georgia, "Times New Roman", serif;
  --f-body: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Type scale — proportions taken from the live site (72 / 48 / 36 / 28 / 18) */
  --t-hero: clamp(2.5rem, 1.6rem + 4vw, 4.5rem);      /* 40 → 72 */
  --t-h1: clamp(2.25rem, 1.6rem + 2.8vw, 3.5rem);     /* 36 → 56 */
  --t-h2: clamp(2rem, 1.55rem + 1.9vw, 3rem);         /* 32 → 48 */
  --t-h3: clamp(1.625rem, 1.4rem + 0.9vw, 2.25rem);   /* 26 → 36 */
  --t-h4: clamp(1.375rem, 1.25rem + 0.5vw, 1.75rem);  /* 22 → 28 */
  --t-lead: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem); /* 18 → 21 */
  --t-body: 1.125rem;   /* 18px — live body size */
  --t-small: 0.9375rem; /* 15px */
  --t-label: 0.75rem;   /* 12px — buttons/nav, uppercase, matches live */

  /* Layout */
  --container: 1280px;
  --container-narrow: 760px;
  --gutter: clamp(1rem, 0.6rem + 1.6vw, 1.5rem);
  --sp-section: clamp(4rem, 2.6rem + 5.6vw, 7rem); /* 64 → 112 */
  --sp-1: 0.5rem; --sp-2: 1rem; --sp-3: 1.5rem; --sp-4: 2rem;
  --sp-5: 3rem; --sp-6: 4rem;
  --header-h: 90px;

  /* Buttons — live metrics: 12px / 600 / uppercase / 1.2px tracking / 16px 32px / square */
  --btn-pad-y: 1rem;
  --btn-pad-x: 2rem;
  --btn-track: 0.1em;
  --radius: 0;

  --ease: cubic-bezier(.2,.6,.2,1);
  --dur: 160ms;
}

@media (max-width: 1099px) { :root { --header-h: 76px; } }
@media (max-width: 480px)  { :root { --header-h: 68px; --btn-pad-x: 1.25rem; } }
