/* Lead form. Kept small and dark to match the page; the phone CTA stays the











           primary path because for an electrical emergency nobody fills in a form. */











        .lead-form { max-width: 620px; margin: 34px 0 0; background: rgba(0,0,0,0.35); border: 1px solid #333; border-radius: 10px; padding: 26px 24px; }











        .lead-form h2 { color: #fff; font-size: 1.5rem; margin: 0 0 6px; }











        .lead-form .lead-sub { color: #bbb; font-size: 1rem; margin: 0 0 20px; }











        .lead-form label { display: block; color: #ddd; font-size: 0.95rem; margin: 0 0 6px; font-weight: 600; }











        .lead-form .opt { font-weight: 400; color: #888; }











        .lead-form input, .lead-form select, .lead-form textarea { width: 100%; box-sizing: border-box; background: #1b1b1b; color: #fff; border: 1px solid #444; border-radius: 6px; padding: 12px 14px; font-size: 1rem; font-family: inherit; margin: 0 0 16px; }











        .lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { outline: 2px solid var(--brand-orange, #ff6600); outline-offset: 1px; border-color: var(--brand-orange, #ff6600); }











        .lead-form textarea { min-height: 92px; resize: vertical; }











        .lead-form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }











        .lead-form button { background: var(--brand-orange, #ff6600); color: #111; border: 0; border-radius: 8px; padding: 15px 26px; font-size: 1.05rem; font-weight: 700; cursor: pointer; font-family: inherit; width: 100%; }











        .lead-form button:hover { background: var(--brand-gold, #ffcc00); }











        .lead-form button[disabled] { opacity: 0.6; cursor: progress; }











        /* Honeypot: pushed off-screen rather than display:none, which some bots test for. */











        .lead-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }











        .lead-form .form-note { color: #999; font-size: 0.9rem; margin: 14px 0 0; }











        .lead-form .form-status { margin: 14px 0 0; font-size: 0.98rem; min-height: 1.2em; }











        .lead-form .form-status.ok { color: #7ddc7d; }











        .lead-form .form-status.err { color: #ff8a8a; }











        @media (max-width: 560px) { .lead-form .row { grid-template-columns: 1fr; gap: 0; } }











            /* desk-nav-canonical-2026-09-20 - one header, one bar height, one active state */











        header { background-color: var(--brand-dark); position: sticky; top: 0; z-index: 1000; box-shadow: 0 4px 12px rgba(0,0,0,0.5); border-bottom: 2px solid var(--brand-orange); min-height: 64px; }











        .nav-container { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; }











        .nav-container a { color: #fff; padding: 12px 16px; font-size: 1rem; font-weight: 700; letter-spacing: 1px; font-family: 'Roboto Condensed', 'Roboto Fallback', sans-serif; text-decoration: none; }











        .nav-container a:hover, .nav-container a.active { color: var(--brand-orange); }

















        /* --- Call button in the sticky header (added 2026-09-28) --------------





           The audit measured a 101 px sticky bar on a 390 px viewport carrying no





           way to call. Nothing is removed from the nav (the footer carries no nav





           links on this template, so hiding an item would strand it), so the call





           button joins the same wrapping rows instead of taking a row of its own:





           measured at 390x844 the bar holds its height and one of its items is now





           the phone number. A full-width button row was tried first and made the





           bar 151 px — this is the version that does not cost screen. */





        nav.nav-container a.nav-call { display: inline-flex; align-items: center; background: var(--brand-orange); color: var(--brand-dark) !important; font-weight: 700; padding: 8px 16px; border-radius: 6px; letter-spacing: 0.5px; }





        nav.nav-container a.nav-call:hover { background: #ffaa33; }





        @media (max-width: 860px) {





            nav.nav-container { gap: 6px 8px; padding: 8px 10px; }





            nav.nav-container a { font-size: 11.5px; letter-spacing: 0.3px; }





            nav.nav-container a.nav-call { padding: 8px 12px; font-size: 12.5px; letter-spacing: 0.3px; }





        }











        /* Skip link (added 2026-09-28). The audit found no skip link on any page,





           so a keyboard or screen-reader user tabbed through the six nav items on





           every page. Off-screen until focused, then it lands in the corner. */





        .skip-link { position: absolute; left: -9999px; top: 0; z-index: 2000; background: var(--brand-orange); color: var(--brand-dark); font-weight: 700; padding: 12px 18px; border-radius: 0 0 6px 0; text-decoration: none; }





        .skip-link:focus { left: 0; outline: 3px solid #ffffff; outline-offset: 2px; }