/* =========================================================================
   East Coast Electrical & Solar — design tokens
   SINGLE SOURCE OF TRUTH. Every stylesheet and page inherits from here.
   Do not redeclare these values anywhere else; override only where a
   surface genuinely differs (e.g. the dark internal tools theme).
   ========================================================================= */
:root {
  /* --- Brand ------------------------------------------------------------
     --accent is the exact logo green (#7c9d41). At 3.11:1 against white it
     is NOT accessible for white text, so it is reserved for decorative and
     large-graphic use (borders, icon strokes, accents on navy).
     Interactive surfaces and accent text use the two accessible steps below.
     Ratios verified against WCAG 2.2 AA (4.5:1 body text, 3:1 large/UI).      */
  --navy:          #1c3a5e;
  --navy-2:        #274a70;
  --ink:           #14293f;
  --ink-deep:      #0e1e30;

  --accent:        #7c9d41;  /* brand green — decorative / large graphics    */
  --accent-strong: #5f7a2f;  /* button fills w/ white text  → 4.87:1  AA ✓   */
  --accent-dark:   #5c762d;  /* accent TEXT on light bg     → 5.14:1  AA ✓   */
  --accent-soft:   #eef3e2;  /* tinted background                            */

  --star:          #f4b400;  /* review stars (non-text, decorative)          */
  --danger:        #b5342a;  /* emergency CTA — 5.14:1 w/ white      AA ✓    */
  --danger-dark:   #97291f;

  /* --- Surfaces --------------------------------------------------------- */
  --bg:            #ffffff;
  --bg-soft:       #f4f7f1;
  --line:          #e6ece2;
  --text:          #243142;
  --muted:         #56677c;  /* 5.744:1 on --bg-soft                 AA ✓    */

  /* --- Elevation -------------------------------------------------------- */
  --shadow:        0 10px 30px -12px rgba(20, 41, 63, .22);
  --shadow-lg:     0 24px 60px -20px rgba(20, 41, 63, .33);

  /* --- Geometry ---------------------------------------------------------
     One container width for the whole site. Previously this had drifted to
     four different values (1180/1140/1120/1100) across four stylesheets.   */
  --maxw:          1140px;
  --radius:        16px;
  --radius-md:     12px;
  --radius-sm:     8px;
}