:root{
  --slate:#3F5468;--slate-d:#2C3D4D;--citrus:#F2860E;--citrus-d:#D66E00;
  --ink:#1E2833;--bg:#fff;--soft:#F2F5F7;--gray:#5A6672;--line:#DEE5EB;
  --nav-h:78px;--topbar-h:38px;--breakpoint-mobile:768px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;font-size:16px}
h1,h2,h3,h4{font-family:'Manrope',sans-serif;letter-spacing:-.02em}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:999}
.skip-link:focus{left:12px;top:12px}

.btn{display:inline-flex;align-items:center;gap:8px;background:var(--citrus);color:#fff;font-weight:700;font-size:16px;padding:15px 28px;text-decoration:none;border-radius:10px;box-shadow:0 10px 22px rgba(242,134,14,.32);border:none;cursor:pointer}
.btn:hover{background:var(--citrus-d)}
.btn.ghost{background:#fff;color:var(--ink);border:2px solid var(--line);box-shadow:none}

.topbar{background:var(--ink);color:#B7C1CA;font-size:13.5px;padding:9px 0;height:var(--topbar-h);display:flex;align-items:center}
.topbar .wrap{display:flex;justify-content:space-between;width:100%}
.topbar-tel{color:#fff;text-decoration:none}
.topbar b{color:var(--citrus)}

/* ---------- NAV ---------- */
header{position:sticky;top:0;z-index:50}
nav{background:#fff;box-shadow:0 1px 0 var(--line)}
.navwrap{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);position:relative}
.logo{font-family:'Manrope';font-weight:800;font-size:19px;color:var(--ink);text-decoration:none;white-space:nowrap;display:flex;align-items:center}
.logo span{color:var(--citrus)}
.logo img{height:40px;width:auto;display:block}
@media(max-width:480px){.logo img{height:34px}}
.navlinks{display:flex;align-items:center;gap:22px}
.navlinks > a{color:var(--ink);text-decoration:none;font-weight:600;font-size:14.5px}
.navlinks > a:hover{color:var(--citrus-d)}
.navcall{font-size:14px;padding:11px 20px}

.dropdown{position:relative}
.drop-trigger{color:var(--ink);text-decoration:none;font-weight:600;font-size:14.5px;display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.drop-trigger:hover{color:var(--citrus-d)}
.caret{font-size:10px}
.dropmenu{list-style:none;display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 44px rgba(30,40,51,.14);padding:10px;min-width:260px;z-index:60}
.dropmenu a{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:14px;font-weight:600}
.dropmenu a:hover{background:var(--soft);color:var(--citrus-d)}
.dropmenu a.drop-all{color:var(--citrus-d);border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.dropdown:hover .dropmenu,.dropdown:focus-within .dropmenu{display:block}

.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:none;border:none;cursor:pointer;padding:0}
.hamburger span{display:block;height:2px;width:26px;background:var(--ink);border-radius:2px;transition:.2s}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-menu{display:none;flex-direction:column;background:#fff;border-top:1px solid var(--line);padding:14px 24px 24px;max-height:calc(100vh - var(--nav-h) - var(--topbar-h));overflow-y:auto;overflow-x:hidden}
.mobile-menu.open{display:flex}
.mobile-menu a{color:var(--ink);text-decoration:none;font-weight:600;font-size:15.5px;padding:11px 0;border-bottom:1px solid var(--line)}
.mm-heading{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--gray);font-weight:700;margin-top:14px;padding-top:10px}
.mm-all{color:var(--citrus-d)}
.mm-call{margin-top:16px;justify-content:center;border-bottom:none}

/* ---------- HERO ---------- */
.hero{background:#fff;padding:0}
.herowrap{display:grid;grid-template-columns:1.05fr .95fr;gap:0;align-items:stretch;min-height:520px;padding-top:0;padding-bottom:0}
.hero-l{padding:56px 40px 56px 0;display:flex;flex-direction:column;justify-content:center}
.hero-r{background:linear-gradient(160deg,var(--slate),var(--slate-d));border-radius:28px;margin:36px 0;padding:36px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.badge{display:inline-flex;align-items:center;gap:7px;background:var(--soft);color:var(--slate-d);font-weight:700;font-size:13px;padding:8px 15px;border-radius:8px;margin-bottom:18px}
.badge:before{content:"\25cf";color:var(--citrus);font-size:10px}
.hero h1{font-size:clamp(28px,4.2vw,46px);line-height:1.1;margin-bottom:16px;color:var(--ink)}
.hero-r-title{font-family:'Manrope',sans-serif;font-size:17px;margin-bottom:16px;opacity:.9;font-weight:700}
.hero h1 span{color:var(--citrus)}
.hero p{color:var(--gray);font-size:17px;max-width:470px;margin-bottom:24px}
.hero-r .hero-r-title{color:#fff;max-width:none;margin-bottom:16px}
.cta-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:22px}
.trustrow{display:flex;gap:20px;flex-wrap:wrap;color:var(--gray);font-size:13.5px;font-weight:600}
.trustrow span:before{content:"\2713 ";color:var(--citrus);font-weight:800}
.hero-r h3{font-size:17px;margin-bottom:16px;opacity:.9}
.hrow{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.15);font-size:14px}
.hrow:last-child{border-bottom:none}
.hrow b{font-family:'Manrope';font-size:17px;color:var(--citrus)}

.strip{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.strip .wrap{display:flex;justify-content:space-between;padding:16px 24px;flex-wrap:wrap;gap:10px}
.stripitem{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px;color:var(--ink)}

.emergency{background:linear-gradient(90deg,var(--slate),var(--slate-d));color:#fff;padding:22px 0}
.emergency .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.emergency-title{font-family:'Manrope',sans-serif;font-size:21px;font-weight:800}
.emergency p{font-size:14px;opacity:.85}
.emergency .btn{background:var(--citrus);box-shadow:none}

/* ---------- SECTIONS ---------- */
.sec{padding:64px 0}
.sec.soft{background:var(--soft)}
.kick{color:var(--citrus-d);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.sec h2{font-size:34px;margin:10px 0 30px;color:var(--ink)}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px}
.card .ic{width:50px;height:50px;background:var(--soft);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:14px}
.card h3{font-size:18.5px;margin-bottom:8px}
.card p{font-size:14.5px;color:var(--gray);margin-bottom:14px}
.card a{color:var(--citrus-d);font-weight:700;font-size:14px;text-decoration:none}

.why{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:whyctr}
.whycard{background:#fff;border-radius:16px;padding:22px;text-align:center;box-shadow:0 10px 30px rgba(30,40,51,.06);counter-increment:whyctr}
.whycard .num{width:42px;height:42px;background:var(--slate);color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:'Manrope';font-weight:800;margin:0 auto 12px;font-size:17px}
.whycard .num:before{content:counter(whyctr)}
.whycard h3{font-size:16px;margin-bottom:6px}
.whycard p{font-size:13.5px;color:var(--gray)}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;counter-reset:stepctr}
.steps:before{content:"";position:absolute;top:28px;left:12%;right:12%;height:2px;background:var(--line)}
.step{text-align:center;padding:0 14px;position:relative;counter-increment:stepctr}
.step .n{width:56px;height:56px;border-radius:14px;background:var(--citrus);color:#fff;font-family:'Manrope';font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;position:relative;z-index:2}
.step .n:before{content:counter(stepctr)}
.step h3{font-size:16.5px;margin-bottom:6px}
.step p{font-size:13.5px;color:var(--gray)}

.signgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.sign{background:#fff;border-radius:14px;padding:20px}
.sec.soft .sign{background:#fff}
.sign h3{font-size:16px;margin-bottom:5px;color:var(--ink)}
.sign p{font-size:14px;color:var(--gray)}
.signnote{margin-top:24px;font-size:14.5px;color:var(--gray);max-width:820px}

.areas{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.areas a{background:#fff;border:1px solid var(--line);padding:14px 16px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600;font-size:14.5px;display:flex;justify-content:space-between}
.areas a:after{content:"\2192";color:var(--citrus)}
.areas a:hover{border-color:var(--citrus);color:var(--citrus-d)}

.brands{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;opacity:.75}
.brands span{font-family:'Manrope';font-weight:700;font-size:17px;color:var(--gray)}

.ctaband{background:linear-gradient(120deg,var(--ink),#2C3944);color:#fff;padding:52px 0;text-align:center}
.ctaband h2{font-size:36px;margin-bottom:8px}
.ctaband p{font-size:17px;opacity:.8;margin-bottom:22px}

.sitemap-embed{line-height:0}
.sitemap-embed iframe{width:100%;height:340px;border:0;display:block}
.page-byline{text-align:center;font-size:12.5px;color:var(--gray);padding:16px 24px}

/* ---------- FOOTER ---------- */
footer{background:#fff;border-top:1px solid var(--line);padding:44px 0 0;font-size:14px}
.footwrap{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;padding-bottom:36px}
.footwrap>div p{margin-top:8px}
footer h3{color:var(--ink);font-family:'Manrope';font-size:16px;margin-bottom:12px}
footer a{color:var(--gray);text-decoration:none;display:block;margin-bottom:7px}
footer a:hover{color:var(--citrus-d)}
footer p{color:var(--gray);margin-bottom:6px}
.footbottom{border-top:1px solid var(--line);padding:18px 24px;font-size:12.5px;color:var(--gray)}

/* ---------- STICKY MOBILE CTA ---------- */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--citrus);z-index:80}
.sticky-cta a{display:block;text-align:center;color:#fff;font-weight:700;padding:14px 0;text-decoration:none;font-size:15px}

@media(max-width:900px){
  .herowrap{grid-template-columns:1fr;min-height:auto}
  .hero-r{margin:0 0 28px}
  .signgrid,.cards,.why{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .steps:before{display:none}
  .areas{grid-template-columns:1fr 1fr}
  .hero h1{font-size:34px}
  .footwrap{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .navlinks{display:none}
  .hamburger{display:flex}
  .sticky-cta{display:block}
  body{padding-bottom:52px}
}
@media(max-width:480px){
  .cards,.why,.footwrap,.signgrid{grid-template-columns:1fr}
  .areas{grid-template-columns:1fr}
  .wrap{padding:0 16px}
  .hero h1{font-size:28px}
}

/* ---------- INTERIOR PAGE COMPONENTS (service/location pages) ---------- */
.pagehead{background:var(--soft);padding:44px 0}
.pageheadwrap{display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center}
.crumb{color:var(--gray);font-size:13px;margin-bottom:12px}
.crumb a{color:var(--citrus-d);text-decoration:none}
.pagehead h1{font-size:36px;color:var(--ink);margin-bottom:10px}
.pagehead p{color:var(--gray);max-width:600px;font-size:16.5px}
.chips{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.chip{background:#fff;border:1px solid var(--line);color:var(--citrus-d);font-size:13px;font-weight:700;padding:7px 14px;border-radius:8px}
.chip:before{content:"\2713 "}
.herocall{background:#fff;border-radius:16px;padding:24px;text-align:center;min-width:250px;box-shadow:0 20px 44px rgba(30,40,51,.12)}
.herocall .lbl{color:var(--gray);font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.herocall .num{font-family:'Manrope';font-weight:800;font-size:24px;color:var(--citrus-d);margin:6px 0 12px;display:block}

.twocol{display:grid;grid-template-columns:1fr 330px;gap:40px;align-items:start;padding:56px 0}
.sidecard{background:var(--slate-d);color:#fff;border-radius:18px;padding:26px;position:sticky;top:calc(var(--nav-h) + var(--topbar-h) + 20px)}
.sidecard h3{font-size:19px;margin-bottom:6px}
.sidecard p{color:#B7C1CA;font-size:14px;margin-bottom:14px}
.sidecard .btn{width:100%;justify-content:center}
.sidecard ul{list-style:none;margin-top:14px;border-top:1px solid #47606E;padding-top:12px}
.sidecard li{font-size:14px;padding:5px 0}
.sidecard li:before{content:"\2713 ";color:var(--citrus)}
.sidecard .mini{margin-top:14px;background:#324555;border-radius:10px;padding:12px;font-size:12.5px;color:#B7C1CA}
.sidecard .mini b{color:var(--citrus)}

.pagekick{color:var(--citrus-d);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.pagebody h2{font-size:28px;margin:36px 0 16px;color:var(--ink)}
.pagebody h2:first-child{margin-top:0}
.pagebody p{margin-bottom:14px;color:var(--ink);font-size:15.5px}
.pagebody a{color:var(--citrus-d);font-weight:600;text-decoration:underline}

.midcta{background:linear-gradient(90deg,var(--citrus),var(--citrus-d));border-radius:16px;color:#fff;padding:26px 30px;display:flex;justify-content:space-between;align-items:center;gap:18px;margin:30px 0;flex-wrap:wrap}
.midcta h3{font-size:20px;font-family:'Manrope'}
.midcta p{font-size:14px;opacity:.9;margin:0}
.midcta .btn{background:var(--ink)}

.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}
.comp{border-radius:16px;padding:24px}
.comp.diy{background:var(--soft)}
.comp.pro{background:var(--slate-d);color:#fff}
.comp h3{font-size:18px;margin-bottom:12px;font-family:'Manrope'}
.comp.pro h3{color:var(--citrus)}
.comp ul{list-style:none}
.comp li{font-size:14px;padding:6px 0}
.comp.diy li:before{content:"\2715 ";color:#C0392B;font-weight:700}
.comp.pro li{color:#D2DAE1}
.comp.pro li:before{content:"\2713 ";color:var(--citrus);font-weight:700}

.pricebox{background:var(--soft);border-radius:16px;padding:20px 24px;margin:20px 0}
.pricebox p{margin-bottom:0}
.factors{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.factor{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;font-size:13.5px;color:var(--gray)}
.factor b{display:block;font-family:'Manrope';font-size:14px;color:var(--ink);margin-bottom:3px}

.pagefaq{margin:20px 0}
.pagefaq details{border-bottom:1px solid var(--line);padding:14px 0}
.pagefaq summary{font-weight:700;font-size:15.5px;cursor:pointer;color:var(--ink)}
.pagefaq p{margin-top:8px;color:var(--gray)}

@media(max-width:900px){
  .twocol{grid-template-columns:1fr}
  .sidecard{position:static}
  .pageheadwrap{grid-template-columns:1fr}
  .compare,.factors{grid-template-columns:1fr}
}

/* ---------- LOCATION PAGE COMPONENTS ---------- */
.boxgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}
.locsign{background:var(--soft);border-radius:14px;padding:20px}
.locsign h3{font-size:16.5px;margin-bottom:5px;color:var(--ink)}
.locsign p{font-size:14px;color:var(--gray)}
.ziprow{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.zipchip{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 13px;font-weight:700;font-size:13px;color:var(--citrus-d)}
.localgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}
.localcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px}
.localcard h3{font-size:17.5px;margin-bottom:5px}
.localcard p{font-size:14px;color:var(--gray);margin-bottom:10px}
.localcard a{color:var(--citrus-d);font-weight:700;font-size:14px;text-decoration:none}
@media(max-width:900px){
  .boxgrid,.localgrid{grid-template-columns:1fr}
}

/* ---------- EMERGENCY + ZIP RETROFIT COMPONENTS ---------- */
.badge-emergency{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;font-weight:700;font-size:13.5px;padding:9px 16px;border-radius:999px;margin-bottom:14px}
.badge-emergency .dot{width:8px;height:8px;border-radius:50%;background:#3DDC5A;display:inline-block;flex-shrink:0}
.prepgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:16px 0}
.prepstep{background:#FFF4E9;border:1px solid #F5D9B8;border-radius:14px;padding:18px 20px;display:flex;gap:12px;align-items:flex-start}
.prepstep .num{background:var(--citrus);color:#fff;font-weight:800;font-family:'Manrope';width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px}
.prepstep b{display:block;margin-bottom:4px;font-size:15px;color:var(--ink)}
.prepstep p{margin:0;font-size:14px;color:var(--gray)}
@media(max-width:700px){.prepgrid{grid-template-columns:1fr}}

/* ---------- PAGE PHOTO BANNER ---------- */
.pagephoto{width:100%;overflow:hidden;background:var(--soft)}
.pagephoto img{width:100%;height:380px;object-fit:cover;display:block}
@media(max-width:700px){.pagephoto img{height:220px}}

/* ---------- BLOG COMPONENTS ---------- */
.blog-meta{color:var(--gray);font-size:13.5px;margin-bottom:6px}
.blog-meta b{color:var(--ink)}