/* Winchester Electrician design system, wh- prefix (shared Winchester DBA kit). Palette from the logo set: charcoal, amber, cream, slate. v1 2026-09-20.
   --wh-teal is the PRIMARY role (slate here), --wh-orange is the ACCENT role (amber). White on amber fails contrast, amber surfaces carry charcoal text. */
:root{
  --wh-teal:#2C3844; --wh-teal-dk:#1D2630; --wh-teal-lt:#FCEFD2;
  --wh-orange:#F4A420; --wh-orange-dk:#C47F0E; --wh-amber-tx:#8A5A0F;
  --wh-ink:#282420; --wh-slate:#2C3844; --wh-text:#2E2B27; --wh-muted:#66615A;
  --wh-cream:#F4ECD8; --wh-line:#E6E2DA; --wh-white:#ffffff;
  --wh-radius:14px;
}
body .wh-page{ color:var(--wh-text); font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:17px; line-height:1.65; }
body .wh-page *{ box-sizing:border-box; }
body .wh-page h1,body .wh-page h2,body .wh-page h3,body .wh-page h4{ font-family:"Rubik","Inter",system-ui,sans-serif; color:var(--wh-ink); letter-spacing:-.01em; margin:0; }
body .wh-page h2{ font-size:clamp(1.7rem,3.2vw,2.5rem); font-weight:800; line-height:1.08; margin:0 0 .5em; }
body .wh-page h3{ font-size:1.22rem; font-weight:700; line-height:1.25; }
body .wh-page p{ margin:0 0 1em; }
body .wh-page a{ color:var(--wh-amber-tx); }
body .wh-page .lead{ font-size:1.18rem; line-height:1.6; color:#45403A; }
body .wh-page ul,body .wh-page ol{ padding-left:1.2em; margin:0 0 1em; }
body .wh-page li{ margin:.3em 0; }

/* release YOOtheme's 1200 container, the wh-wrap carries the measure */
body main.tm-main.uk-section{ padding-top:0; padding-bottom:0; }
body .tm-main > .uk-container{ max-width:none; padding-left:0; padding-right:0; }

/* rhythm */
.wh-wrap{ max-width:1200px; margin:0 auto; padding:0 24px; }
.wh-narrow{ max-width:780px; }
.wh-sec{ padding:84px 0; }
.wh-sec-sm{ padding:42px 0; }
@media (max-width:640px){ .wh-sec{ padding:56px 0; } }
.wh-alt{ background:#F8F6F2; }
.wh-cream{ background:var(--wh-cream); }

/* signature eyebrow: orange dotted dash, from the logo's dot rows */
.wh-label{ display:inline-flex; align-items:center; gap:12px; font-weight:800; text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; color:var(--wh-amber-tx); font-family:"Rubik","Inter",sans-serif; margin-bottom:14px; }
.wh-label::before{ content:""; width:28px; height:3px; border-radius:2px; background:var(--wh-orange); flex-shrink:0; }
.wh-label.on-dark{ color:var(--wh-cream); }
.wh-rule{ position:relative; height:2px; background:var(--wh-line); margin:24px 0; }
.wh-rule::before{ content:""; position:absolute; left:0; top:0; height:2px; width:90px; background:var(--wh-orange); }

/* buttons */
.wh-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:54px; padding:0 28px; border-radius:999px; font-family:"Rubik","Inter",sans-serif; font-weight:800; font-size:1rem; letter-spacing:.02em; text-decoration:none!important; transition:transform .15s,background .2s,box-shadow .2s,color .2s; border:2px solid transparent; cursor:pointer; }
.wh-btn-primary{ background:var(--wh-orange); color:var(--wh-ink)!important; }
.wh-btn-primary:hover,.wh-btn-primary:focus{ background:#FFB634; color:var(--wh-ink)!important; transform:translateY(-2px); box-shadow:0 10px 24px rgba(244,164,32,.32); }
.wh-btn-ghost{ background:transparent; color:#fff!important; border-color:rgba(255,255,255,.45); }
.wh-btn-ghost:hover,.wh-btn-ghost:focus{ background:#fff; color:var(--wh-ink)!important; border-color:#fff; transform:translateY(-2px); }
.wh-btn-teal{ background:var(--wh-teal); color:#fff!important; }
.wh-btn-teal:hover,.wh-btn-teal:focus{ background:var(--wh-teal-dk); color:#fff!important; transform:translateY(-2px); }
.wh-btn-outline{ background:transparent; color:var(--wh-ink)!important; border-color:var(--wh-ink); }
.wh-btn-outline:hover,.wh-btn-outline:focus{ background:var(--wh-ink); color:#fff!important; }
.wh-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:2em; }

/* hero */
.wh-hero{ position:relative; overflow:hidden; background:var(--wh-ink); background-image:linear-gradient(115deg,#1A222B 0%,var(--wh-teal) 55%,#3B4B5C 100%); padding:110px 0 0; color:#fff; }
.wh-hero::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(244,236,216,.16) 1.4px,transparent 1.6px); background-size:26px 26px; opacity:.55; pointer-events:none; }
.wh-hero::after{ content:""; position:absolute; right:-140px; top:-80px; width:640px; height:640px; background:url('/wp-content/uploads/wh/winchester-electrician-badge-transparent.png') center/contain no-repeat; opacity:.13; pointer-events:none; }
.wh-hero .wh-wrap{ position:relative; z-index:1; }
.wh-hero .wh-label{ color:var(--wh-cream); }
.wh-hero h1{ color:#fff; margin:0; line-height:1; letter-spacing:-.02em; }
.wh-hero h1 .l1{ display:block; font-weight:900; font-size:clamp(2.4rem,6.2vw,4.6rem); }
.wh-hero h1 .l2{ display:block; font-weight:800; font-size:clamp(1.15rem,2.6vw,1.8rem); color:var(--wh-orange); margin-top:.3em; }
.wh-hero p{ color:#EEF1F4; max-width:620px; margin:1.4em 0 0; font-size:1.15rem; line-height:1.6; }
.wh-hero .wh-btn-ghost{ border-color:rgba(244,236,216,.55); }
.wh-ticker{ position:relative; z-index:1; margin-top:56px; border-top:1px solid rgba(255,255,255,.18); display:flex; flex-wrap:wrap; gap:10px 28px; padding:22px 0 30px; }
.wh-ticker span,.wh-ticker a{ color:#DDE3EA; font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.76rem; display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.wh-ticker span::before,.wh-ticker a::before{ content:""; width:7px; height:7px; background:var(--wh-orange); border-radius:50%; }
.wh-hero.sm{ padding:84px 0 64px; }
.wh-hero.sm h1 .l1{ font-size:clamp(2rem,4.8vw,3.4rem); }
.wh-hero.sm::after{ width:460px; height:460px; right:-120px; top:-40px; }
.wh-crumb{ display:flex; gap:8px; flex-wrap:wrap; font-size:.82rem; color:#C5CED8; margin-bottom:18px; }
.wh-crumb a{ color:#C5CED8; text-decoration:none; }
.wh-crumb span::before{ content:"/"; margin-right:8px; color:var(--wh-orange); }

/* promise band */
.wh-band{ background:var(--wh-ink); color:#fff; }
.wh-band .row{ display:grid; grid-template-columns:repeat(3,1fr); }
.wh-band .cell{ padding:30px 26px; border-left:1px solid rgba(255,255,255,.1); }
.wh-band .cell:first-child{ border-left:0; }
.wh-band .k{ font-family:"Rubik","Inter",sans-serif; font-weight:800; font-size:1.15rem; color:#fff; display:flex; align-items:center; gap:10px; }
.wh-band .k::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--wh-orange); flex:0 0 auto; }
.wh-band .d{ color:#BDB6A9; margin-top:.4em; font-size:.95rem; }
@media (max-width:760px){ .wh-band .row{ grid-template-columns:1fr; } .wh-band .cell{ border-left:0; border-top:1px solid rgba(255,255,255,.1); padding:20px 24px; } .wh-band .cell:first-child{ border-top:0; } }

/* two column */
.wh-two{ display:grid; grid-template-columns:1.4fr 1fr; gap:48px; align-items:start; }
@media (max-width:900px){ .wh-two{ grid-template-columns:1fr; gap:32px; } }
.wh-card{ background:#fff; border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:28px; }
.wh-card.teal{ background:var(--wh-teal); border-color:var(--wh-teal); color:#fff; }
.wh-card.teal h3{ color:#fff; }
.wh-card.teal p{ color:#DDE3EA; }
.wh-card.teal .wh-phone{ color:#fff; }
.wh-card.cream{ background:var(--wh-cream); border-color:#E8DCBE; }
.wh-phone{ display:inline-block; font-family:"Rubik","Inter",sans-serif; font-weight:900; font-size:1.7rem; color:var(--wh-ink); text-decoration:none!important; line-height:1.1; margin:.2em 0 .5em; }
.wh-phone:hover{ color:var(--wh-amber-tx); }

/* check list */
.wh-checks{ list-style:none; padding:0; margin:18px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:12px 28px; }
.wh-checks li{ position:relative; padding-left:32px; margin:0; }
.wh-checks li::before{ content:""; position:absolute; left:0; top:4px; width:20px; height:20px; border-radius:50%; background:var(--wh-orange); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23282420' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M5 10.5l3.2 3.2L15 7'/%3E%3C/svg%3E"); background-size:14px; background-position:center; background-repeat:no-repeat; }
.wh-checks.one{ grid-template-columns:1fr; }
@media (max-width:640px){ .wh-checks{ grid-template-columns:1fr; } }

/* services grid */
.wh-svc{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:36px; }
.wh-svc a{ display:flex; flex-direction:column; gap:10px; background:#fff; border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:26px 24px 24px; text-decoration:none!important; color:var(--wh-text); transition:transform .18s,box-shadow .2s,border-color .2s; position:relative; overflow:hidden; }
.wh-svc a::before{ content:""; position:absolute; left:0; top:0; width:100%; height:4px; background:var(--wh-orange); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.wh-svc a:hover{ transform:translateY(-4px); box-shadow:0 16px 34px rgba(40,36,32,.12); border-color:#E3D9C4; }
.wh-svc a:hover::before{ transform:scaleX(1); }
.wh-svc .ic{ width:46px; height:46px; border-radius:12px; background:var(--wh-teal-lt); display:flex; align-items:center; justify-content:center; color:var(--wh-teal); }
.wh-svc .ic svg{ width:26px; height:26px; }
.wh-svc h3{ font-size:1.08rem; }
.wh-svc .desc{ color:var(--wh-muted); font-size:.95rem; line-height:1.5; }
.wh-svc .arw{ margin-top:auto; color:var(--wh-amber-tx); font-weight:800; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; font-family:"Rubik","Inter",sans-serif; }
@media (max-width:1000px){ .wh-svc{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .wh-svc{ grid-template-columns:1fr; } }

/* why us dark */
.wh-why{ background:var(--wh-ink); color:#DDD7CC; position:relative; overflow:hidden; }
.wh-why::after{ content:""; position:absolute; left:-160px; bottom:-200px; width:560px; height:560px; background:url('/wp-content/uploads/wh/winchester-electrician-badge-transparent.png') center/contain no-repeat; opacity:.07; pointer-events:none; }
.wh-why .wh-wrap{ position:relative; z-index:1; }
.wh-why h2,.wh-why h3{ color:#fff; }
.wh-why .grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px 40px; margin-top:36px; }
.wh-why .item{ display:grid; grid-template-columns:44px 1fr; gap:16px; }
.wh-why .tick{ width:44px; height:44px; border-radius:12px; background:rgba(244,164,32,.16); border:1px solid rgba(244,164,32,.4); display:flex; align-items:center; justify-content:center; color:var(--wh-orange); font-family:"Rubik","Inter",sans-serif; font-weight:900; }
.wh-why p{ color:#BDB6A9; margin:.4em 0 0; }
@media (max-width:760px){ .wh-why .grid{ grid-template-columns:1fr; } }

/* steps */
.wh-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:36px; counter-reset:step; }
.wh-steps .st{ background:#fff; border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:28px 24px; }
.wh-steps .st::before{ counter-increment:step; content:"0" counter(step); display:block; font-family:"Rubik","Inter",sans-serif; font-weight:900; font-size:2rem; color:var(--wh-orange-dk); line-height:1; margin-bottom:12px; }
@media (max-width:800px){ .wh-steps{ grid-template-columns:1fr; } }

/* area pills */
.wh-areas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.wh-areas a{ display:inline-flex; align-items:center; gap:10px; padding:12px 20px; border-radius:999px; background:#fff; border:1px solid var(--wh-line); color:var(--wh-ink); font-weight:700; text-decoration:none!important; transition:all .2s; }
.wh-areas a::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--wh-orange); }
.wh-areas a:hover{ background:var(--wh-teal); border-color:var(--wh-teal); color:#fff; }
.wh-areas a.now{ background:var(--wh-ink); border-color:var(--wh-ink); color:#fff; }

/* town cards */
.wh-towns{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:36px; }
.wh-towns a{ display:block; background:#fff; border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:26px; text-decoration:none!important; color:var(--wh-text); transition:transform .18s,box-shadow .2s; }
.wh-towns a:hover{ transform:translateY(-4px); box-shadow:0 16px 34px rgba(40,36,32,.12); }
.wh-towns .st{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--wh-amber-tx); font-weight:800; font-family:"Rubik","Inter",sans-serif; }
.wh-towns h3{ margin:.3em 0 .4em; }
.wh-towns p{ color:var(--wh-muted); font-size:.95rem; margin:0; }
@media (max-width:900px){ .wh-towns{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .wh-towns{ grid-template-columns:1fr; } }

/* FAQ, restyled UIkit accordion */
.wh-faq .uk-accordion{ margin-top:28px; border-top:1px solid var(--wh-line); }
.wh-faq .uk-accordion > li{ margin:0; border-bottom:1px solid var(--wh-line); }
.wh-faq .uk-accordion-title{ font-family:"Rubik","Inter",sans-serif; font-weight:700; font-size:1.08rem; color:var(--wh-ink); padding:20px 44px 20px 0; position:relative; text-decoration:none; }
.wh-faq .uk-accordion-title::before{ content:""; position:absolute; right:0; top:50%; width:22px; height:22px; margin-top:-11px; border-radius:50%; background:var(--wh-teal-lt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23282420' stroke-width='2.2' stroke-linecap='round' d='M10 5v10M5 10h10'/%3E%3C/svg%3E") center/12px no-repeat; }
.wh-faq .uk-open > .uk-accordion-title::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23282420' stroke-width='2.2' stroke-linecap='round' d='M5 10h10'/%3E%3C/svg%3E"); }
.wh-faq .uk-accordion-content{ margin:0; padding:0 0 22px; color:var(--wh-text); }

/* CTA band */
.wh-cta{ background:var(--wh-orange); color:var(--wh-ink); text-align:center; position:relative; overflow:hidden; }
.wh-cta .wh-wrap{ position:relative; z-index:1; }
.wh-cta h2{ color:var(--wh-ink); font-size:clamp(1.8rem,3.6vw,2.7rem); }
.wh-cta p{ color:#3A332A; font-size:1.15rem; max-width:640px; margin:0 auto; }
.wh-cta .wh-actions{ justify-content:center; }
.wh-cta .wh-btn-primary{ background:var(--wh-ink); color:#fff!important; }
.wh-cta .wh-btn-primary:hover,.wh-cta .wh-btn-primary:focus{ background:#14110E; color:#fff!important; box-shadow:0 10px 24px rgba(0,0,0,.25); }
.wh-cta .wh-btn-ghost{ border-color:var(--wh-ink); color:var(--wh-ink)!important; }
.wh-cta .wh-btn-ghost:hover,.wh-cta .wh-btn-ghost:focus{ background:var(--wh-ink); border-color:var(--wh-ink); color:#fff!important; }

/* estimate: form + info */
.wh-estimate .wh-two{ grid-template-columns:1.15fr 1fr; }
.wh-formwrap{ background:#fff; border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:18px; min-height:640px; }
.wh-formwrap iframe{ min-height:600px; display:block; }
.wh-info h3{ margin-bottom:.4em; }
.wh-info .row{ display:grid; grid-template-columns:1fr; gap:18px; margin-top:20px; }
.wh-info .it{ display:grid; grid-template-columns:42px 1fr; gap:14px; align-items:start; }
.wh-info .it .ic{ width:42px; height:42px; border-radius:11px; background:var(--wh-teal-lt); color:var(--wh-teal); display:flex; align-items:center; justify-content:center; }
.wh-info .it .ic svg{ width:22px; height:22px; }
.wh-info .it b{ display:block; color:var(--wh-ink); font-family:"Rubik","Inter",sans-serif; }
.wh-info .it p{ margin:0; color:var(--wh-muted); font-size:.95rem; }

/* prose */
.wh-prose h2{ font-size:clamp(1.45rem,2.6vw,2rem); margin-top:1.6em; }
.wh-prose h2:first-child{ margin-top:0; }
.wh-prose h3{ margin:1.4em 0 .5em; }

/* related list */
.wh-related{ list-style:none; padding:0; margin:18px 0 0; display:grid; grid-template-columns:1fr; gap:8px; }
.wh-related a{ display:flex; justify-content:space-between; align-items:center; padding:14px 18px; border:1px solid var(--wh-line); border-radius:10px; text-decoration:none!important; color:var(--wh-ink); font-weight:700; background:#fff; }
.wh-related a::after{ content:"\2192"; color:var(--wh-orange-dk); }
.wh-related a:hover{ border-color:var(--wh-orange); color:var(--wh-amber-tx); }

/* notice */
.wh-notice{ background:var(--wh-cream); border:1px solid #E8DCBE; border-radius:var(--wh-radius); padding:24px 28px; }
.wh-notice b{ color:var(--wh-ink); }

/* header chrome */
body .tm-toolbar.tm-toolbar-default{ background:var(--wh-ink)!important; background-image:none!important; color:#fff; }
body .tm-toolbar .uk-container{ max-width:none; padding-left:40px; padding-right:40px; }
.wh-tb{ display:flex; align-items:center; gap:22px; font-size:.86rem; color:#DDD7CC; }
.wh-tb a{ color:#fff; text-decoration:none; font-weight:700; }
.wh-tb a:hover{ color:var(--wh-orange); }
.wh-tb .wh-btn{ min-height:38px; padding:0 18px; font-size:.82rem; }
.wh-tb .dot::before{ content:""; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--wh-orange); margin-right:8px; vertical-align:middle; }
body .tm-header .uk-navbar-container{ background:#fff; }
body .tm-header .uk-navbar-nav > li > a{ font-family:"Rubik","Inter",sans-serif; font-weight:700; color:var(--wh-ink); text-transform:none; font-size:.98rem; letter-spacing:0; min-height:88px; }
body .tm-header .uk-navbar-nav > li:hover > a,body .tm-header .uk-navbar-nav > li.uk-active > a{ color:var(--wh-amber-tx); }
body .tm-header .uk-drop,body .tm-header .uk-navbar-dropdown,body .uk-navbar-container .uk-navbar-dropdown{ position:absolute!important; }
body .uk-navbar-dropdown{ background:#fff; border-radius:12px; box-shadow:0 18px 40px rgba(40,36,32,.16); padding:18px 22px; width:300px; }
body .uk-navbar-dropdown-nav > li > a{ color:var(--wh-ink); font-weight:600; padding:7px 0; }
body .uk-navbar-dropdown-nav > li > a:hover{ color:var(--wh-amber-tx); }
body .uk-logo img{ max-height:64px; width:auto; }
body .uk-logo{ flex-shrink:0; }
body .uk-offcanvas-bar{ background:var(--wh-ink); }
body .uk-offcanvas-bar .uk-nav > li > a{ color:#fff; font-family:"Rubik","Inter",sans-serif; font-weight:700; font-size:1.05rem; }
body .uk-offcanvas-bar .uk-nav-sub a{ color:#BDB6A9; }
body .uk-offcanvas-bar .uk-nav-parent-icon > a::after{ filter:invert(1); }

/* mobile sticky call bar (HFCM Mobile Buttons) */
body .mobile-buttons{ display:none; }
@media (max-width:1099px){
  body .mobile-buttons{ display:flex!important; position:fixed; top:0; left:0; right:0; z-index:1000!important; width:100%; }
  body .mobile-buttons ul{ display:grid!important; grid-template-columns:1fr 1fr; width:100%; margin:0; padding:0; list-style:none; }
  body .mobile-buttons li{ margin:0; }
  body .mobile-buttons a{ display:flex; align-items:center; justify-content:center; height:60px; font-family:"Rubik","Inter",sans-serif; font-weight:800; font-size:.95rem; text-decoration:none; color:#fff; letter-spacing:.02em; }
  body .mobile-buttons .button-left{ background:var(--wh-orange); }
  body .mobile-buttons .button-right{ background:var(--wh-teal); }
  body .tm-page{ padding-top:60px; }
}

/* footer */
body footer.tm-footer,body .tm-footer .uk-section-default{ background:var(--wh-ink); }
body .tm-footer .uk-container.uk-container-expand,body footer .uk-container{ padding-left:0!important; padding-right:0!important; max-width:none!important; }
body footer .uk-grid.tm-grid-expand{ margin-left:0!important; }
body footer .uk-grid.tm-grid-expand > *{ padding-left:0!important; }
body footer .uk-section{ padding:0; }
.wh-footer{ background:var(--wh-ink); color:#BDB6A9; font-family:"Inter",system-ui,sans-serif; font-size:.95rem; }
.wh-footer .top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding:64px 0 48px; }
.wh-footer h4{ color:#fff; font-family:"Rubik","Inter",sans-serif; font-weight:800; font-size:.86rem; letter-spacing:.14em; text-transform:uppercase; margin:0 0 16px; }
.wh-footer ul{ list-style:none; padding:0; margin:0; }
.wh-footer li{ margin:0 0 9px; }
.wh-footer a{ color:#DDD7CC; text-decoration:none; }
.wh-footer a:hover{ color:var(--wh-orange); }
.wh-footer .mark{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.wh-footer .mark img{ width:64px; height:64px; display:block; }
.wh-footer .mark b{ display:block; color:#fff; font-family:"Rubik","Inter",sans-serif; font-weight:900; font-size:1.25rem; line-height:1.05; letter-spacing:-.01em; }
.wh-footer .mark span{ display:block; color:var(--wh-orange); font-family:"Rubik","Inter",sans-serif; font-weight:700; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; margin-top:4px; }
.wh-footer .brand p{ max-width:340px; margin:0 0 14px; }
.wh-footer .brand .wh-phone{ color:#fff; font-size:1.4rem; }
.wh-footer .bottom{ border-top:1px solid rgba(255,255,255,.1); padding:22px 0; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.85rem; color:#9A9385; }
.wh-footer .bottom a{ color:#9A9385; }
@media (max-width:900px){ .wh-footer .top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .wh-footer .top{ grid-template-columns:1fr; padding:48px 0 32px; } }
@media (max-width:1099px){ body{ padding-bottom:0; } }

/* ---- v2 specificity fixes (theme h1/h3/a rules were winning) ---- */
body .wh-page .wh-hero h1,body .wh-page .wh-hero h1 .l1{ color:#fff; }
body .wh-page .wh-hero h1 .l2{ color:var(--wh-orange); }
body .wh-page .wh-hero .wh-label{ color:var(--wh-cream); }
body .wh-page .wh-ticker a,body .wh-page .wh-ticker span{ color:#DDE3EA; }
body .wh-page .wh-crumb a{ color:#C5CED8; }
body .wh-page .wh-crumb a:hover{ color:#fff; }
body .wh-page .wh-why h2,body .wh-page .wh-why h3{ color:#fff; }
body .wh-page .wh-why p{ color:#BDB6A9; }
body .wh-page .wh-card.teal h3,body .wh-page .wh-card.teal .wh-phone{ color:#fff; }
body .wh-page .wh-card.teal p{ color:#DDE3EA; }
body .wh-page .wh-cta h2{ color:var(--wh-ink); }
body .wh-page .wh-cta p{ color:#3A332A; }
body .wh-page .wh-band .k{ color:#fff; }
body .wh-page .wh-label.on-dark{ color:var(--wh-cream); }
body .wh-page .wh-svc a,body .wh-page .wh-towns a,body .wh-page .wh-areas a,body .wh-page .wh-related a{ color:var(--wh-ink); }
body .wh-page .wh-svc h3,body .wh-page .wh-towns h3{ color:var(--wh-ink); }
body .wh-page .wh-areas a:hover,body .wh-page .wh-areas a.now{ color:#fff; }
body .wh-page .wh-related a:hover{ color:var(--wh-amber-tx); }
body .wh-page .wh-svc .arw,body .wh-page .wh-towns .st{ color:var(--wh-amber-tx); }
body .wh-page .wh-svc .desc,body .wh-page .wh-towns p{ color:var(--wh-muted); }
@media (max-width:900px){ body .wh-page .wh-estimate .wh-two{ grid-template-columns:1fr; } }
body .uk-logo img{ max-height:80px; }
@media (max-width:1099px){
  body .mobile-buttons .button-left{ background:var(--wh-orange)!important; color:var(--wh-ink)!important; }
  body .mobile-buttons .button-right{ background:var(--wh-teal)!important; color:#fff!important; }
}

@media (prefers-reduced-motion:reduce){ .wh-page *{ transition:none!important; } }

/* v3 phone pass. mobile header is a separate YOOtheme header (tm-header-mobile), style it like the desktop one */
body .tm-header-mobile .uk-navbar-container{ background:#fff; border-bottom:1px solid var(--wh-line); }
body .tm-header-mobile .uk-container{ padding-left:24px!important; padding-right:24px!important; }
body .tm-header-mobile .uk-logo img{ max-height:56px; }
body .tm-header-mobile .uk-navbar-toggle{ color:var(--wh-ink); }
/* hero on phones: badge as a real element, no ghost watermark, tighter top */
.wh-hero-badge{ display:none; }
@media (max-width:760px){
  .wh-hero{ padding-top:56px; }
  .wh-hero::after,.wh-hero.sm::after{ display:none; }
  .wh-hero-badge{ display:block; width:88px; height:88px; margin:0 0 20px; filter:drop-shadow(0 6px 14px rgba(0,0,0,.25)); }
  .wh-label{ letter-spacing:.14em; font-size:.7rem; }
  .wh-hero h1 .l1{ font-size:2.35rem; }
  .wh-hero p{ font-size:1.05rem; }
  .wh-ticker{ margin-top:36px; gap:8px 18px; }
  .wh-actions{ gap:10px; }
  .wh-actions .wh-btn{ width:100%; }
}
/* towns on phones: two even columns instead of a ragged pill stack */
@media (max-width:640px){
  .wh-areas{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .wh-areas a{ padding:11px 10px; font-size:.86rem; justify-content:flex-start; white-space:nowrap; gap:8px; }
  .wh-formwrap{ padding:10px; }
  .wh-cta{ text-align:left; }
  .wh-cta p{ margin:0; }
  .wh-cta .wh-actions{ justify-content:flex-start; }
  .wh-footer .top{ gap:28px; }
}

/* v4: the 60px the page reserves for the fixed call bar showed the theme's grey html background, paint it white.
   footer lists sit two up on phones so the footer is half as tall. */
@media (max-width:1099px){ html,body{ background:#fff!important; } }

/* v5: footer centered on phones, Zack: "I like keeping things centered on that" */
@media (max-width:560px){
  .wh-footer .top{ grid-template-columns:1fr 1fr; gap:28px 16px; text-align:center; padding:44px 0 28px; }
  .wh-footer .brand{ grid-column:1 / -1; display:flex; flex-direction:column; align-items:center; }
  .wh-footer .mark{ flex-direction:column; gap:10px; text-align:center; }
  .wh-footer .brand p{ max-width:320px; margin:0 auto 12px; }
  .wh-footer h4{ margin-bottom:12px; }
  .wh-footer .bottom{ justify-content:center; text-align:center; flex-direction:column; gap:6px; }
  .wh-footer .top > div:last-child{ grid-column:1 / -1; }  /* Company alone on the second row, centered across both columns */
}
/* v5: the call bar. The template's snippet CSS pushed body down 70px on top of the 60px the page reserves,
   so the header floated 130px down with a white hole above it. One reservation, the bar's own height. */
@media (max-width:1099px){
  html{ padding-top:0!important; margin-top:0!important; }
  body{ margin-top:0!important; padding-top:0!important; }
  body .tm-page{ padding-top:56px!important; margin-top:0!important; }  /* the template's mobile bar snippet sets .tm-page margin-top:70px, it collapsed through body and read as a body offset */
  body .mobile-buttons a{ height:56px; font-size:.92rem; letter-spacing:.01em; }
  body .tm-header-mobile .uk-navbar-container{ box-shadow:0 1px 0 var(--wh-line); }
}
/* v5: compact hero for the contact page, the form is the point of that page */
.wh-hero.compact{ padding:64px 0 48px; }
.wh-hero.compact::after{ display:none; }
.wh-hero.compact .wh-hero-badge{ display:none; }
@media (max-width:760px){
  .wh-hero.compact{ padding:36px 0 32px; }
  .wh-hero.compact h1 .l1{ font-size:2rem; }
  .wh-hero.compact p{ margin-top:.9em; }
  .wh-estimate.first{ padding-top:36px; }
}

/* reviews band */
.wh-reviews{ background:#fff; }
.wh-reviews-slot{ margin-top:10px; min-height:0; }
.wh-notice .wh-reviews-slot{ margin-top:14px; }

/* QA 2026-09-08: the fixed call bar's anchors were content-box, 2px taller and wider than their slot */
@media (max-width:1099px){ body .mobile-buttons a{ box-sizing:border-box; border:0; } }
/* the hero paragraph gap lost to body .wh-page p (0,1,2) */
body .wh-page .wh-hero p{ margin:1.4em 0 0; }
@media (max-width:760px){ body .wh-page .wh-hero.compact p{ margin-top:.9em; } }
.wh-tel{ white-space:nowrap; font-weight:700; }

/* v2 2026-09-20 render QA. 1) unpainted sections showed the theme's grey main (#e8e8e8), paint the page white.
   2) links inside the slate hero were dark amber on slate, unreadable. 3) the template theme.css forces a 1px border in
   its own secondary colour (green) on the call bar buttons. 4) the active nav underline was the theme's blue. */
body .wh-page{ background:#fff; }
body .wh-page .wh-hero p a,body .wh-page .wh-hero p a.wh-tel{ color:var(--wh-orange); }
@media (max-width:1099px){ body .mobile-buttons a,body .mobile-buttons .button-left,body .mobile-buttons .button-right{ border:0!important; } }
body .tm-header .uk-navbar-nav > li > a::before{ background-color:var(--wh-orange)!important; }
/* v3: the closing CTA paragraph lost its auto margins to body .wh-page p, so a centred 640px block sat left of the centred heading */
body .wh-page .wh-cta p{ margin:0 auto; }
/* v4: body .wh-page ul (0,1,2) beat the list resets (0,1,0), so the check lists and related lists sat 1.2em in from their headings */
body .wh-page ul.wh-checks,body .wh-page ul.wh-related{ padding-left:0; }

/* ---- where we work, 2026-09-20 (Zack on the Electrician site: "should be kind of centered, those little things there. Maybe add some maps") ---- */
/* the service area block is centered: label, heading, lead and the town pills */
body .wh-page .wh-sec:has(.wh-areas){ text-align:center; }
body .wh-page .wh-sec:has(.wh-areas) .wh-label{ justify-content:center; }
body .wh-page .wh-sec:has(.wh-areas) .lead{ margin-left:auto; margin-right:auto; }
body .wh-page .wh-areas{ justify-content:center; }
@media (max-width:640px){ body .wh-page .wh-areas a{ justify-content:center; } }
/* service area map: our own inline SVG, towns plotted from their coordinates, palette from the site variables */
.wh-map{ max-width:720px; margin:34px auto 0; background:var(--wh-cream); border:1px solid var(--wh-line); border-radius:var(--wh-radius); padding:10px; overflow:hidden; }
.wh-map svg{ display:block; width:100%; height:auto; }
/* Google Maps embed (Zack 2026-09-20, he wanted a Google map, not the drawn one) */
.wh-map.wh-gmap{ max-width:960px; padding:0; background:#fff; }
.wh-map.wh-gmap iframe{ display:block; width:100%; height:440px; border:0; }
@media (max-width:640px){ .wh-map.wh-gmap iframe{ height:320px; } }
.wh-map .arg{ opacity:.13; }
.wh-map .arg polygon{ fill:var(--wh-teal); stroke:var(--wh-teal); stroke-width:96; stroke-linejoin:round; }
.wh-map .lg .sw{ fill:var(--wh-teal); fill-opacity:.2; }
.wh-map .rc{ fill:none; stroke:var(--wh-line); stroke-width:10; stroke-linecap:round; stroke-linejoin:round; }
.wh-map .rd{ fill:none; stroke:#fff; stroke-width:6; stroke-linecap:round; stroke-linejoin:round; }
.wh-map .sh rect{ fill:#fff; stroke:var(--wh-line); stroke-width:1.5; }
.wh-map .sh text{ font:700 11px "Inter",system-ui,sans-serif; fill:var(--wh-muted); letter-spacing:.04em; }
.wh-map .td{ fill:var(--wh-orange); stroke:#fff; stroke-width:3; }
.wh-map .hd{ fill:var(--wh-teal); stroke:#fff; stroke-width:3; }
.wh-map .hr{ fill:var(--wh-teal); fill-opacity:.16; }
.wh-map .tl{ font:800 16px "Rubik","Inter",system-ui,sans-serif; fill:var(--wh-ink); paint-order:stroke; stroke:var(--wh-cream); stroke-width:4px; stroke-linejoin:round; }
.wh-map .tl.hl{ font-size:18px; }
.wh-map .ts{ font:700 10px "Inter",system-ui,sans-serif; fill:var(--wh-muted); text-transform:uppercase; letter-spacing:.14em; paint-order:stroke; stroke:var(--wh-cream); stroke-width:3px; }
.wh-map .lg text{ font:700 12px "Inter",system-ui,sans-serif; fill:var(--wh-muted); }
.wh-map a{ text-decoration:none!important; cursor:pointer; }
.wh-map a:hover .tl,.wh-map a:focus .tl{ fill:var(--wh-teal); text-decoration:underline; }
.wh-map a:hover .td,.wh-map a:focus .td{ fill:var(--wh-teal); }
@media (max-width:640px){ .wh-map{ margin-top:26px; padding:6px; } .wh-map .tl{ font-size:22px; } .wh-map .tl.hl{ font-size:24px; } .wh-map .ts{ font-size:14px; } .wh-map .sh text{ font-size:14px; } .wh-map .lg text{ font-size:17px; } }