/* ============================================================
   Complifield — Color System
   Three tiers. Copper is the single consumer-facing accent.
   Navy is the institutional/B2B secondary — never competes with copper.
   Grade colors are SEMANTIC and IMMUTABLE — do not alter.
   ============================================================ */

:root {
  /* ---------- TIER 1 · CORE ---------- */
  --slate-teal:   #35484E; /* primary page background, nav, dark surfaces, hero */
  --copper:       #C07850; /* SOLE UI accent — logo, primary CTAs, homeowner moments */
  --warm-cream:   #E8E4DE; /* body text on dark surfaces — off-white, never pure white */
  --charcoal:     #1E2022; /* footer, deepest surfaces, copper-on-dark pairing */

  /* Copper interaction states (derived) */
  --copper-hover: #CB855E; /* lighter copper for hover */
  --copper-press: #A9663F; /* darker copper for active/press */
  --copper-12:    rgba(192,120,80,0.12);
  --copper-18:    rgba(192,120,80,0.18);
  --copper-25:    rgba(192,120,80,0.25);
  --copper-32:    rgba(192,120,80,0.32);

  /* ---------- TIER 2 · INSTITUTIONAL (B2B only) ---------- */
  --navy:         #1F3864; /* enterprise surfaces: GC view, /docs, /methodology, PDFs */
  --navy-hover:   #294679;
  --navy-press:   #16294A;
  --navy-12:      rgba(31,56,100,0.12);
  --navy-25:      rgba(31,56,100,0.25);

  /* ---------- TIER 3 · NEUTRALS (light / paper surfaces) ---------- */
  --graphite:     #444444; /* body text on light/paper surfaces */
  --slate-gray:   #555555; /* secondary text, captions, metadata */
  --paper:        #FAF8F5; /* light document backgrounds (PDFs, docs pages) */
  --paper-line:   #E4DED5; /* hairline rules on paper */

  /* ---------- DARK SURFACES (derived working palette) ---------- */
  --surface:      #3D5560; /* raised card surface on slate teal */
  --surface-2:    #425E6A; /* second-level raised surface */
  --deep-teal:    #243640; /* recessed / deepest teal panel */
  --ink-soft:     rgba(232,228,222,0.62); /* muted cream text on dark */
  --ink-faint:    rgba(232,228,222,0.38); /* faintest cream — captions on dark */

  /* ---------- HAIRLINES ---------- */
  --line:         rgba(192,120,80,0.18); /* default 1px border on dark */
  --line-strong:  rgba(192,120,80,0.32); /* emphasized 1px border on dark */
  --line-navy:    rgba(31,56,100,0.30);  /* institutional hairline */

  /* ---------- GRADE SYSTEM · IMMUTABLE ---------- */
  --grade-a-fg: #32AB44; /* A · 90–100 · Hire with confidence */
  --grade-b-fg: #D4A017; /* B · 70–89  · Minor issues — ask questions */
  --grade-c-fg: #D6906E; /* C · 50–69  · Proceed carefully */
  --grade-d-fg: #DC501E; /* D · 30–49  · Significant concerns */
  --grade-f-fg: #C42828; /* F · 0–29   · Failed safety report */

  --grade-a-bg: rgba(50,171,68,0.15);
  --grade-b-bg: rgba(255,183,3,0.12);
  --grade-c-bg: rgba(214,144,110,0.15);
  --grade-d-bg: rgba(220,80,30,0.15);
  --grade-f-bg: rgba(185,40,40,0.15);

  /* ---------- VIOLATION SEVERITY (derives from grade scale) ---------- */
  --viol-willful: var(--grade-f-fg); /* W — Willful */
  --viol-repeat:  var(--grade-f-fg); /* R — Repeat */
  --viol-serious: var(--grade-d-fg); /* S — Serious */
  --viol-other:   var(--grade-b-fg); /* O — Other */
}