/* ============================================================
   COLOR TOKENS — New Image Roofing
   Rule of thumb: gold ALWAYS carries black text; black bands
   carry white text; never more than two surface backgrounds
   per page (--paper + --paper-2).
   ============================================================ */
:root{
  --accent:#FFB612;
  --accent-press:#E6A50A;
  --link:#7A5C00;
  --ink-900:#000000;
  --ink-800:#2E2E2E;
  --ink-700:#333333;
  --paper:#FFFFFF;
  --paper-2:#F4F4F4;
  --line:#E5E5E5;
  --line-dark:#3A3A3A;
  --steel:#9C9C9C;
  --txt:#333333;
  --txt-dim:#666666;
  --txt-inv:#FFFFFF;
  --txt-inv-dim:#B9B9B9;
  --surface-page:var(--paper);
  --surface-alt:var(--paper-2);
  --surface-card:#FAFAFA;
  --surface-card-border:#EFEFEF;
  --surface-ink:var(--ink-900);
  --text-heading:var(--ink-700);
  --text-body:var(--txt);
  --text-muted:var(--txt-dim);
  --text-on-accent:#000000;
  --border-subtle:var(--line);
  --focus-ring:var(--accent);
}
/* TYPOGRAPHY — Public Sans only */
:root{
  --f-display:'Public Sans', system-ui, -apple-system, Segoe UI, sans-serif;
  --f-body:'Public Sans', system-ui, -apple-system, Segoe UI, sans-serif;
  --f-mono:'Public Sans', ui-monospace, monospace;
  --fw-regular:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;
  --fw-extrabold:800;
  --fs-h1:clamp(36px, 4.6vw, 58px);
  --fs-h2:clamp(27px, 3.2vw, 40px);
  --fs-h3:clamp(19px, 2.1vw, 23px);
  --fs-lede:18.5px;
  --fs-body:16.5px;
  --fs-ui:15.5px;
  --fs-small:14px;
  --fs-eyebrow:12.5px;
  --lh-tight:1.15;
  --lh-snug:1.5;
  --lh-body:1.65;
  --ls-tight:-.015em;
  --ls-eyebrow:.16em;
  --ls-label:.08em;
  --text-display-family:var(--f-display);
  --text-body-family:var(--f-body);
  --weight-heading:var(--fw-bold);
  --weight-hero:var(--fw-extrabold);
}
/* SPACING — 4px base, 96px sections, 1200px max */
:root{
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  --maxw:1200px;
  --gutter:var(--s-6);
  --space-section:var(--s-9);
  --space-section-tight:var(--s-8);
  --space-card:var(--s-7);
  --space-stack:var(--s-4);
  --space-inline:var(--s-3);
}
/* RADIUS / SHADOW / MOTION */
:root{
  --r:8px; --r-lg:14px; --r-xl:20px; --r-pill:999px;
  --bw:1.5px;
  --shadow-card:0 2px 10px rgba(0,0,0,.04);
  --shadow-card-hover:0 16px 32px rgba(0,0,0,.10);
  --shadow-menu:0 18px 40px rgba(0,0,0,.10);
  --shadow-float:0 30px 60px rgba(0,0,0,.35);
  --shadow-fab:0 8px 20px rgba(0,0,0,.25);
  --ease:cubic-bezier(.4,0,.2,1);
  --dur-fast:.15s;
  --dur-base:.2s;
}