
:root{
  --paper:#ffffff;
  --paper-tint:#fbfbfa;
  --ink:#1c1e1f;
  --ink-soft:#63676a;
  --line:#e4e2dc;
  --brass:#9c6f34;
  --brass-deep:#7d5825;
  --flame:#b8461f;
  --flame-ink:#ffffff;
  --focus:#2f6f8f;
}

*{box-sizing:border-box;}
/* The HTML `hidden` attribute is only a UA-stylesheet default, so any author rule
   with a `display` value silently overrides it. Several elements here are flex, so
   hidden elements (e.g. the Google Reviews links before a review URL is configured)
   were still rendering — as dead links. This makes `hidden` mean hidden. */
[hidden]{display:none !important;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter', system-ui, sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Montserrat', 'Arial Narrow', sans-serif;
  text-transform:uppercase;
  letter-spacing:0.02em;
  text-wrap:balance;
  margin:0;
  color:var(--ink);
}
.eyebrow{
  font-family:'Inter', sans-serif;
  font-size:0.7rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--brass-deep);
}
a{color:inherit;}
.wrap{max-width:1032px;margin:0 auto;padding-inline:24px;}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;}
.logo-svg{height:100%;width:auto;display:block;color:inherit;}
.logo{display:inline-block;}

.skip-link{
  position:absolute;left:-999px;top:auto;background:var(--flame);color:#fff;
  padding:10px 16px;z-index:100;text-decoration:none;
}
.skip-link:focus{left:16px;top:16px;}

/* ---- header: 3 bars ---- */
.topbar{background:var(--ink);color:#cfccc3;}
.topbar-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 24px;font-size:0.78rem;gap:16px;flex-wrap:wrap;
}
.topbar-left{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.topbar-left a{text-decoration:none;color:inherit;display:inline-flex;align-items:center;gap:6px;}
.topbar-left a:hover{color:#fff;}
.topbar-icon{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;flex:none;}
.topbar-right{display:flex;align-items:center;gap:14px;}
.topbar-google{text-decoration:none;color:inherit;display:inline-flex;align-items:center;gap:6px;}
.topbar-google:hover{color:#fff;}
/* WhatsApp brand green (#25D366) with white text is only 1.98:1 contrast — well
   under the 4.5:1 AA minimum. Darkened to #12823f, which keeps it recognisably
   WhatsApp green while reaching 4.5:1+ against white text. */
.topbar-whatsapp{
  display:inline-flex;align-items:center;gap:6px;background:#12823f;color:#fff;
  padding:8px 14px;border-radius:14px;text-decoration:none;font-weight:600;font-size:0.78rem;
  min-height:32px;
}
.topbar-whatsapp:hover{background:#0d6630;}
.topbar-whatsapp svg{width:14px;height:14px;fill:#fff;flex:none;}

.emergency-trigger{position:relative;}
.emergency-btn{
  background:var(--flame);color:#fff;font-weight:700;font-size:0.84rem;
  font-family:'Montserrat',sans-serif;
  padding:9px 18px;border-radius:2px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;
  letter-spacing:0.02em;
}
.emergency-btn:hover{background:#9c3c1a;}
.emergency-btn svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2;flex:none;}
.emergency-panel{
  position:absolute;top:100%;right:0;left:auto;background:var(--paper);border:1px solid var(--line);
  display:none;flex-direction:column;min-width:250px;padding:16px;z-index:30;text-align:left;
  box-shadow:0 12px 28px rgba(0,0,0,0.18);
}
.emergency-trigger:hover .emergency-panel, .emergency-trigger:focus-within .emergency-panel{display:flex;}
.emergency-panel-phone{
  font-family:'Inter',sans-serif;font-size:1.15rem;font-weight:600;color:var(--ink);
  text-decoration:none;margin-bottom:10px;display:block;
}
.emergency-panel-phone:hover{color:var(--flame);}
.emergency-panel a.emergency-link{font-size:0.86rem;font-weight:600;color:var(--brass-deep);text-decoration:none;}
.emergency-panel a.emergency-link:hover{color:var(--flame);}
@media (max-width:600px){.topbar-left span.topbar-email{display:none;}}

.brandbar{background:var(--paper);border-bottom:1px solid var(--line);}
.brandbar-inner{
  max-width:1032px;margin:0 auto;padding:26px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;text-decoration:none;color:var(--ink);}
.brand .logo{height:58px;width:auto;flex:none;max-width:100%;}
/* Below ~360px (older/smaller handsets) the fixed-height wordmark was wider
   than the viewport and pushed the whole page sideways, so it steps down. */
@media (max-width:360px){.brand .logo{height:46px;}}
.brandbar-meta{
  font-family:'Inter',sans-serif;font-size:0.78rem;color:var(--ink-soft);
  display:flex;gap:20px;flex-wrap:wrap;
}
.brandbar-meta a{text-decoration:none;color:inherit;}
.brandbar-meta a:hover{color:var(--ink);}

.menubar{background:var(--ink);position:relative;z-index:20;}
.menubar-inner{
  max-width:1032px;margin:0 auto;padding:0 24px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.mainnav{display:flex;align-items:stretch;gap:6px;flex-wrap:wrap;}
.nav-item{position:relative;display:flex;align-items:center;}
.mainnav > a, .nav-item > a{
  color:#cfccc3;text-decoration:none;font-size:0.88rem;font-weight:500;
  padding:15px 14px;display:inline-block;
}
.mainnav > a:hover, .nav-item > a:hover, .nav-item.active > a, .mainnav > a.active{color:#fff;}
.nav-item.active > a{box-shadow:inset 0 -2px 0 var(--brass);}
.mega-menu{
  position:absolute;top:100%;left:0;background:var(--paper);border:1px solid var(--line);
  display:none;flex-direction:column;min-width:230px;padding:8px 0;
  box-shadow:0 12px 28px rgba(0,0,0,0.18);
}
.nav-item:hover .mega-menu, .nav-item:focus-within .mega-menu{display:flex;}
.mega-menu a{padding:10px 18px;color:var(--ink-soft);font-size:0.87rem;text-decoration:none;}
.mega-menu a:hover{background:var(--paper-tint);color:var(--ink);}
.menubar-cta{padding:12px 0;display:flex;align-items:center;gap:12px;}
.quote-link{
  color:#fff;border:1px solid rgba(255,255,255,0.4);padding:9px 18px;font-size:0.84rem;
  font-weight:600;text-decoration:none;border-radius:2px;white-space:nowrap;display:inline-block;
}
.quote-link:hover{background:#fff;color:var(--ink);}

/* ---- grey utility bar (Pricing / Our Work / FAQs) ---- */
.utilitybar{background:#efece4;border-bottom:1px solid var(--line);}
.utilitybar-inner{max-width:1032px;margin:0 auto;padding:8px 24px;display:flex;justify-content:flex-end;}
.utility-links{display:flex;gap:10px;}
.utility-links a{
  font-family:'Inter',sans-serif;font-size:0.78rem;font-weight:600;color:var(--ink);
  border:1px solid var(--line);background:var(--paper);padding:5px 12px;border-radius:2px;text-decoration:none;
}
.utility-links a:hover{border-color:var(--brass-deep);color:var(--brass-deep);}

/* ---- Locations hover preview ---- */
.loc-preview{
  position:absolute;top:100%;left:0;background:var(--paper);border:1px solid var(--line);
  display:none;flex-direction:row;min-width:380px;padding:14px 0;
  box-shadow:0 12px 28px rgba(0,0,0,0.18);
}
.nav-item:hover .loc-preview, .nav-item:focus-within .loc-preview{display:flex;}
.loc-preview-col{flex:1;padding:0 20px;}
.loc-preview-col + .loc-preview-col{border-left:1px solid var(--line);}
.loc-preview-col a.loc-heading{
  display:block;font-family:'Inter',sans-serif;font-size:0.76rem;font-weight:700;letter-spacing:0.06em;
  text-transform:uppercase;color:#9c6f34;text-decoration:none;margin-bottom:8px;
}
.loc-preview-col a.loc-heading:hover{color:var(--flame);}
.loc-preview-col a.loc-town{display:block;padding:6px 0;color:var(--ink);font-size:0.88rem;text-decoration:none;}
.loc-preview-col a.loc-town:hover{color:var(--brass-deep);}
.loc-preview-col a.loc-more{display:block;padding:6px 0;color:var(--ink-soft);font-size:0.85rem;font-weight:600;text-decoration:none;}
.loc-preview-col a.loc-more:hover{color:var(--flame);}

/* ---- mobile nav (hamburger, hidden on desktop) ---- */
.hamburger{
  display:none;background:none;border:1px solid var(--line);border-radius:2px;width:46px;height:44px;
  flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;flex:none;
}
.hamburger span{display:block;width:20px;height:2px;background:var(--ink);transition:transform .2s,opacity .2s;}
.hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

.btn-quote{
  text-align:center;padding:12px;border:1px solid var(--ink);background:var(--ink);color:#fff;text-decoration:none;
  font-family:'Montserrat',sans-serif;font-weight:600;font-size:0.9rem;border-radius:2px;
}
.btn-quote:hover{background:#000;}
.btn-emergency{
  text-align:center;padding:12px;background:var(--flame);color:#fff;text-decoration:none;
  font-family:'Montserrat',sans-serif;font-weight:700;font-size:0.9rem;border-radius:2px;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.btn-emergency:hover{background:#9c3c1a;}
.btn-emergency svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2;flex:none;}

/* Sticky on mobile so a customer with a dead boiler always has a tap-to-call
   button in reach. Previously this bar was position:static and scrolled out of
   sight within the first ~500px of a 6,200px homepage, leaving no visible phone
   number for the rest of the page. */
.m-ctas-persistent{
  display:none;padding:8px 12px;gap:8px;border-top:1px solid var(--line);
  background:var(--paper);
}
.m-ctas-persistent a{flex:1;padding:11px 8px;font-size:0.84rem;min-height:44px;}
/* Three buttons: Call white, Emergency red, Quote black. */
.m-ctas-persistent .btn-call{
  display:flex;align-items:center;justify-content:center;gap:7px;text-align:center;
  background:#fff;color:var(--ink);text-decoration:none;border-radius:2px;
  border:1px solid var(--line);
  font-family:'Montserrat',sans-serif;font-weight:700;white-space:nowrap;
}
.m-ctas-persistent .btn-call:hover{background:#f4f1ea;}
.m-ctas-persistent .btn-call svg{width:15px;height:15px;stroke:var(--ink);fill:none;stroke-width:2;flex:none;}
.m-ctas-persistent .btn-emergency{
  background:var(--flame);color:#fff;border:1px solid var(--flame);
  font-size:0.8rem;gap:5px;
}
.m-ctas-persistent .btn-emergency:hover{background:#9c3c1a;}
.m-ctas-persistent .btn-emergency svg{width:14px;height:14px;stroke:#fff;}
.m-ctas-persistent .btn-quote{display:flex;align-items:center;justify-content:center;}


.mobile-nav-panel{display:none;border-bottom:1px solid var(--line);}
.mobile-nav-panel.open{display:block;}
.m-nav-list{list-style:none;margin:0;padding:0;font-family:'Inter',sans-serif;}
.m-nav-list > li{border-bottom:1px solid var(--line);}
.m-nav-list > li > a, .m-acc-trigger{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:14px 16px;font-size:0.98rem;font-weight:600;color:var(--ink);text-decoration:none;
  background:none;border:none;text-align:left;font-family:'Inter',sans-serif;cursor:pointer;
}
.m-acc-trigger svg{width:16px;height:16px;stroke:var(--ink-soft);fill:none;stroke-width:2;transition:transform .2s;flex:none;}
.m-acc-trigger.open svg{transform:rotate(180deg);}
.m-acc-panel{display:none;padding:0 16px 12px 28px;}
.m-acc-panel.open{display:block;}
.m-acc-panel a{display:block;padding:7px 0;font-size:0.9rem;color:var(--ink-soft);text-decoration:none;}
.m-acc-panel a:hover{color:var(--brass-deep);}
.m-acc-group-label{font-size:0.72rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:#9c6f34;margin:10px 0 4px;}
.m-acc-more{font-weight:600;color:var(--ink-soft);}
.m-foot-buttons{display:flex;gap:8px;padding:14px 16px;flex-wrap:wrap;}
.m-foot-buttons a{
  flex:1;min-width:100px;text-align:center;padding:9px 8px;border:1px solid var(--line);border-radius:2px;
  background:#efece4;font-family:'Inter',sans-serif;font-size:0.8rem;font-weight:600;color:var(--ink);text-decoration:none;
}
.m-foot-buttons a:hover{border-color:var(--brass-deep);color:var(--brass-deep);}
/* Town links on service pages — internal linking, kept compact. */
.town-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.town-links a{
  display:block;padding:8px 13px;border:1px solid var(--line);border-radius:2px;background:#fff;
  font-size:0.86rem;font-weight:600;color:var(--ink);text-decoration:none;
}
.town-links a:hover{border-color:var(--brass-deep);color:var(--brass-deep);}
/* Emergency is the first row of the mobile menu, in the same red as the
   desktop header button — on a phone it is the reason most people open the
   menu at all. */
.m-nav-list > li.m-nav-emergency > a{background:var(--flame);color:#fff;}
.m-nav-emergency a span{display:flex;align-items:center;gap:9px;}
.m-nav-emergency svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:2;flex:none;}
.m-nav-emergency .m-nav-chev{width:15px;height:15px;}

@media (max-width:760px){
  .brandbar-meta{display:none;}
  .menubar{display:none;}
  .utilitybar{display:none;}
  .hamburger{display:flex;}
  /* Fixed to the bottom of the viewport so the phone number is reachable at any
     scroll depth — previously this bar sat in the header and was gone after the
     first ~500px of a 6,200px page. */
  .m-ctas-persistent{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;
    box-shadow:0 -2px 14px rgba(0,0,0,0.14);
  }
  body{padding-bottom:74px;}
}

/* ---- page sections ---- */
section{padding-block:56px;border-bottom:1px solid var(--line);}
main>section:last-of-type{border-bottom:none;}
.section-head{margin-bottom:30px;max-width:60ch;}
.section-head h1,.section-head h2{font-size:clamp(1.5rem,2.8vw,2.1rem);margin-top:8px;}
.section-head p{color:var(--ink-soft);margin-top:12px;}

.hero h1{font-size:clamp(2.1rem,4.6vw,3.2rem);line-height:1.06;margin-top:14px;max-width:23ch;}
.hero p.lede{font-size:1.06rem;color:var(--ink-soft);max-width:46ch;margin-top:16px;}
.hero-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;}

.btn{
  display:inline-flex;align-items:center;gap:8px;flex:none;
  font-family:'Montserrat',sans-serif;font-weight:600;font-size:0.86rem;
  letter-spacing:0.01em;
  padding:13px 20px;border-radius:2px;text-decoration:none;
  border:1px solid transparent;cursor:pointer;white-space:nowrap;min-height:44px;
}
.btn-primary{background:var(--ink);color:#fff !important;}
.btn-primary:hover{background:#000;}
.btn-ghost{border-color:var(--line);color:var(--ink);background:transparent;}
.btn-ghost:hover{border-color:var(--ink-soft);}

.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:860px){.services{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.services{grid-template-columns:1fr;}}
.service{background:var(--paper);padding:26px 22px;display:flex;flex-direction:column;color:inherit;text-decoration:none;box-shadow:inset 0 0 0 0 var(--brass-deep);transition:box-shadow .15s ease;}
.service:hover,.service:focus-visible{box-shadow:inset 0 0 0 2px var(--brass-deep);}
.service svg{width:28px;height:28px;stroke:var(--brass);fill:none;stroke-width:1.6;margin-bottom:14px;}
.service h3{font-size:0.98rem;}
.service p{color:var(--ink-soft);font-size:0.9rem;margin-top:8px;flex:1;}
.service .learn-more{margin-top:14px;font-size:0.82rem;font-weight:600;color:var(--brass-deep);text-decoration:none;}
.service:hover .learn-more,.service:focus-visible .learn-more{color:var(--flame);}

.service-detail{scroll-margin-top:20px;padding-block:44px;border-bottom:1px solid var(--line);}
.service-detail:last-of-type{border-bottom:none;}
.service-detail-inner{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;}
.service-detail svg{width:36px;height:36px;stroke:var(--brass);fill:none;stroke-width:1.5;margin-top:4px;}
.service-detail h2{font-size:clamp(1.25rem,2.2vw,1.55rem);}
.service-detail p{color:var(--ink-soft);margin-top:10px;max-width:62ch;}
.service-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.service-tags span{
  font-family:'Inter',sans-serif;font-size:0.72rem;letter-spacing:0.05em;
  color:var(--brass-deep);border:1px solid var(--line);padding:5px 10px;
}

.boiler-flow{margin-top:6px;}
.boiler-sub{
  font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;
  font-weight:700;font-size:0.98rem;color:var(--ink);
  margin-top:30px;
}
.boiler-flow > .boiler-sub:first-child{margin-top:0;}
.boiler-flow p{color:var(--ink-soft);font-size:0.9rem;margin-top:8px;max-width:60ch;}
.boiler-flow .quote-list{margin-top:14px;}

.cta-callout-wrap{padding:0 24px;}
.cta-callout{
  max-width:984px;margin:0 auto;background:#fdece2;border:1px solid #f3c9a8;
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding:30px 36px;
}
.cta-callout h2{font-size:1.25rem;}
.cta-callout p{color:#7d5825;margin-top:6px;}
.cta-callout a.btn-call{
  display:inline-flex;align-items:center;gap:10px;flex:none;white-space:nowrap;
  background:var(--flame);color:#fff;font-weight:700;font-size:1.1rem;
  padding:14px 26px;border-radius:2px;text-decoration:none;
}
.cta-callout a.btn-call:hover{background:#9c3c1a;}

.other-services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
/* Eight tiles: four across, or two across on narrow screens. Three across
   would leave a blank cell on the second row, which is what this replaced. */
@media (max-width:860px){.other-services-grid{grid-template-columns:1fr 1fr;}}
.other-service-link{
  background:var(--paper);padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;
  text-align:center;text-decoration:none;color:var(--ink);font-size:0.86rem;font-weight:600;
}
.other-service-link:hover{background:var(--paper-tint);color:var(--brass-deep);}
.other-service-link svg{width:22px;height:22px;stroke:var(--brass);fill:none;stroke-width:1.6;}

.about p{color:var(--ink-soft);max-width:56ch;font-size:1rem;}
.about-line{
  display:flex;gap:24px;margin-top:22px;flex-wrap:wrap;
  font-family:'Inter',sans-serif;font-size:0.8rem;color:var(--brass-deep);
}

.testimonial-section{background:var(--paper-tint);}
.testimonial{
  display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;
}
.testimonial blockquote{
  margin:0;flex:1 1 480px;font-family:'Montserrat',sans-serif;
  font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.5;color:var(--ink);
  font-weight:600;letter-spacing:0.01em;
}
.testimonial-person{
  display:flex;align-items:center;gap:14px;flex:0 0 auto;
}
.avatar-initials{
  width:56px;height:56px;border-radius:50%;background:var(--ink);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  font-family:'Inter',sans-serif;font-weight:600;font-size:0.95rem;letter-spacing:0.02em;
}
.avatar-photo{
  width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none;
}

.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){.team-grid{grid-template-columns:1fr;}}
.team-card{background:var(--paper);padding:32px;display:flex;flex-direction:column;}
.team-card-top{display:flex;align-items:center;gap:16px;margin-bottom:18px;}
.team-avatar{
  width:76px;height:76px;border-radius:50%;background:var(--ink);color:#fff;flex:none;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Inter',sans-serif;font-weight:600;font-size:1.2rem;letter-spacing:0.02em;
}
.team-name{font-size:1.1rem;font-weight:700;color:var(--ink);}
.team-role{
  display:block;margin-top:3px;font-family:'Inter',sans-serif;font-size:0.74rem;
  color:var(--brass-deep);text-transform:uppercase;letter-spacing:0.04em;
}
.team-card p{color:var(--ink-soft);font-size:0.94rem;margin:0 0 16px;}
.team-creds{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);}
.team-creds div{display:flex;justify-content:space-between;gap:12px;font-size:0.84rem;}
.team-creds span:first-child{color:var(--ink-soft);}
.team-creds span:last-child{font-weight:600;color:var(--ink);text-align:right;}
.team-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.team-tags span{
  font-family:'Inter',sans-serif;font-size:0.7rem;letter-spacing:0.03em;
  color:var(--brass-deep);border:1px solid var(--line);padding:5px 9px;
}
.testimonial-name{font-size:0.94rem;font-weight:600;color:var(--ink);line-height:1.5;white-space:nowrap;}
.testimonial-role{
  font-family:'Inter',sans-serif;font-size:0.76rem;font-weight:500;
  letter-spacing:0.04em;text-transform:uppercase;color:var(--brass-deep);
}
@media (max-width:640px){
  .testimonial{flex-direction:column;align-items:flex-start;}
  .testimonial-person{margin-top:4px;}
}

.google-review-cta{margin-top:18px;font-size:0.9rem;}
.google-review-cta a{color:var(--brass-deep);font-weight:600;text-decoration:none;}
.google-review-cta a:hover{text-decoration:underline;}

.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:820px){.review-grid{grid-template-columns:1fr;}}
.review-card{background:var(--paper);padding:26px;display:flex;flex-direction:column;justify-content:space-between;}
.review-card blockquote{margin:0 0 18px;font-size:0.94rem;line-height:1.55;color:var(--ink);}
.review-attribution{display:flex;flex-direction:column;gap:2px;font-family:'Inter',sans-serif;font-size:0.74rem;}
.review-name{color:var(--ink-soft);font-style:italic;}
.review-town{color:var(--brass-deep);text-transform:uppercase;letter-spacing:0.04em;}

.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:820px){.project-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.project-grid{grid-template-columns:1fr;}}
.project-card{background:var(--paper);}
a.project-card{display:flex;flex-direction:column;color:inherit;text-decoration:none;cursor:pointer;transition:background-color .15s;}
a.project-card:hover{background-color:var(--paper-tint);}
a.project-card:hover .project-info h3{color:var(--brass-deep);}
.project-thumb{
  aspect-ratio:4/3;background:var(--paper-tint);display:flex;align-items:center;justify-content:center;position:relative;
}
.project-thumb svg{width:32px;height:32px;stroke:var(--brass-deep);fill:none;stroke-width:1.5;}
.project-info{padding:16px 18px;}
.project-info h3{font-size:0.98rem;text-transform:none;letter-spacing:0;font-family:'Inter',sans-serif;font-weight:600;transition:color .15s;}
.project-info .project-town{
  display:block;margin-top:4px;font-family:'Inter',sans-serif;font-size:0.74rem;
  color:var(--ink-soft);text-transform:uppercase;letter-spacing:0.04em;
}
.project-info .project-date{color:var(--ink-soft);}

.job-detail-back{display:inline-flex;align-items:center;gap:6px;font-size:0.85rem;font-weight:600;color:var(--brass-deep);text-decoration:none;margin-bottom:18px;}
.job-detail-back svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
.job-detail-meta{color:var(--ink-soft);font-size:0.88rem;margin-top:4px;}
.job-detail-desc{margin-top:18px;max-width:64ch;color:var(--ink);}
.job-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:22px;}
.job-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line);display:block;}
.job-detail-cover{width:100%;max-height:420px;object-fit:cover;border:1px solid var(--line);display:block;margin-top:18px;}

.areas-van-photo{
  display:block;max-width:360px;width:100%;height:auto;margin:28px auto 0;
  border:1px solid var(--line);
}
.areas-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){.areas-grid{grid-template-columns:1fr;}}
.areas-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:900px){.areas-grid-3{grid-template-columns:1fr;}}
.area-card{background:var(--paper);padding:26px;}
.area-card .eyebrow{display:block;margin-bottom:6px;}
.area-card h2,.area-card h3{font-size:1.2rem;}
.area-card p{color:var(--ink-soft);margin-top:8px;font-size:0.92rem;}
.area-card ul{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px;}
.area-card li{
  font-family:'Inter',sans-serif;font-size:0.76rem;color:var(--ink-soft);
  border:1px solid var(--line);padding:5px 10px;
}
.area-card li a{color:inherit;text-decoration:none;}
.area-card li a:hover{color:var(--brass-deep);}
.route{grid-column:1 / -1;background:var(--paper);padding:20px 26px 26px;}
.route svg{width:100%;height:auto;display:block;margin-top:4px;}
.route-label{font-family:'Inter',sans-serif;font-size:0.75rem;fill:var(--ink-soft);}
.route-town{font-family:'Montserrat',sans-serif;font-size:0.9rem;fill:var(--ink);text-transform:uppercase;letter-spacing:0.03em;}
.area-map{grid-column:1 / -1;background:var(--paper);padding:20px 26px 26px;}
.area-map-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:4px;}
@media (max-width:700px){.area-map-pair{grid-template-columns:1fr;}}
.area-map-pin{display:flex;flex-direction:column;gap:6px;}
.area-map-pin span{font-family:'Inter',sans-serif;font-size:0.78rem;font-weight:600;color:var(--ink);}
.area-map iframe{width:100%;height:280px;border:1px solid var(--line);display:block;filter:grayscale(0.15) contrast(1.02);}


.quote-wrap{display:grid;grid-template-columns:0.9fr 1.1fr;gap:44px;}
@media (max-width:820px){.quote-wrap{grid-template-columns:1fr;}}
.quote-info p{color:var(--ink-soft);margin-top:12px;max-width:36ch;}
.quote-list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;}
.quote-list li{display:flex;gap:10px;font-size:0.9rem;color:var(--ink-soft);align-items:flex-start;}
.quote-list svg{width:16px;height:16px;flex:none;margin-top:3px;stroke:var(--brass);fill:none;stroke-width:2;}

.quote-emergency{
  margin-top:22px;background:#fdece2;border:1px solid #f3c9a8;padding:16px 18px;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;max-width:36ch;
}
.quote-emergency p{color:#7d5825;font-size:0.82rem;margin:0;}
.quote-emergency a.quote-emergency-phone{font-weight:700;color:var(--flame);text-decoration:none;font-size:1.05rem;}
.quote-emergency a.quote-emergency-link{font-size:0.8rem;font-weight:600;color:#7d5825;text-decoration:none;margin-top:4px;}
.quote-emergency a.quote-emergency-link:hover{color:var(--flame);}

.whatwedo-label{font-size:0.9rem;font-weight:700;color:var(--ink);margin:0;}
.our-work-link{
  display:inline-flex;align-items:center;gap:6px;margin-top:26px;
  font-size:0.9rem;font-weight:600;color:var(--brass-deep);text-decoration:none;
}
.our-work-link:hover{color:var(--flame);}
.our-work-link svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;}
.our-work-link + .our-work-link{margin-left:28px;padding-left:28px;border-left:1px solid var(--line);}
form{background:var(--paper-tint);border:1px solid var(--line);padding:24px;display:grid;gap:14px;}
form > div{display:grid;gap:14px;}
.field{display:grid;gap:6px;}
.field label{font-size:0.8rem;font-weight:600;color:var(--ink-soft);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:520px){.two-col{grid-template-columns:1fr;}}
/* 16px minimum on form controls: anything smaller makes iOS Safari zoom the page
   in on focus and leave the customer stuck at that zoom level mid-form. */
input,select,textarea{
  font:inherit;font-size:16px;padding:12px;background:var(--paper);
  border:1px solid var(--line);color:var(--ink);border-radius:2px;
  font-family:'Inter',sans-serif;min-height:44px;
}
textarea{min-height:96px;}
input[type="checkbox"]{width:20px;height:20px;min-height:20px;flex:none;accent-color:var(--flame);}
textarea{resize:vertical;min-height:80px;}
input:focus,select:focus,textarea:focus{border-color:var(--brass);}
.form-status{font-size:0.92rem;padding:12px 14px;border:1px solid var(--line);display:none;margin-bottom:16px;border-radius:2px;}
.form-status.show{display:block;}
.form-status.success{background:#eaf7ee;border-color:#bfe3c9;color:#1c1e1f;font-weight:700;}
.form-status.error{background:#fbecec;border-color:#e6b8b8;color:#1c1e1f;font-weight:700;}
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;}

.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:720px){.contact-grid{grid-template-columns:1fr;}}
.contact-card{background:var(--paper);padding:22px;}
.contact-card .eyebrow{display:block;margin-bottom:8px;}
.contact-card a.big-link{
  font-family:'Inter',sans-serif;font-size:0.98rem;text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:2px;
}
.contact-card a.big-link:hover{border-color:var(--brass);}
.social-row{display:flex;gap:10px;margin-top:2px;}
.social-row a{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border:1px solid var(--line);color:var(--ink);
  text-decoration:none;
}
.social-row a:hover{border-color:var(--brass);color:var(--brass);}
.social-row svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;}

/* ---- emergency page ---- */
/* The band is a <section>, so it also picked up the sitewide 56px padding-block on
   top of its own — 156px of dead space above and below the content. Zeroed here so
   the inner padding is the only spacing, and the gap above the eyebrow matches the
   gap below the call button. */
.emergency-hero{background:var(--flame);color:#fff;padding-block:0;}
.emergency-hero-inner{padding-block:22px;}
.emergency-hero .eyebrow{color:#ffd9c9;margin-top:0;display:block;}
.emergency-hero h1{color:#fff;margin-top:6px;font-size:clamp(1.5rem,3vw,2rem);}
.emergency-hero p{color:#ffe4d8;margin-top:8px;max-width:64ch;font-size:0.95rem;}
.emergency-hero-phone{
  display:flex;width:fit-content;align-items:center;gap:10px;margin-top:14px;
  background:#fff;color:var(--ink);padding:13px 22px;font-weight:700;
  font-family:'Inter',sans-serif;font-size:1.1rem;text-decoration:none;border-radius:2px;
}
.emergency-hero-phone:hover{background:#f2ede4;}
.emergency-hero-phone svg{width:18px;height:18px;stroke:var(--flame);fill:none;stroke-width:2;}

.emergency-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){.emergency-grid{grid-template-columns:1fr;}}
.emergency-item{background:var(--paper);padding:26px;}
.emergency-item h2{font-size:1.1rem;}
.emergency-item ol{margin:14px 0 0;padding-left:20px;color:var(--ink-soft);font-size:0.92rem;line-height:1.7;}
.emergency-item ol li{margin-bottom:4px;}
.emergency-item .call-out{
  margin-top:14px;font-size:0.86rem;font-weight:600;color:var(--flame);
}

/* ---- big footer ---- */
footer{background:var(--ink);color:#c9c6bd;}
.foot-wrap{max-width:1032px;margin:0 auto;padding:44px 24px 22px;}
.foot-cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;}
@media (max-width:760px){.foot-cols{grid-template-columns:1fr 1fr;}}
@media (max-width:480px){.foot-cols{grid-template-columns:1fr;}}
.foot-cols h2{font-family:'Inter',sans-serif;font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:#8f8c83;margin:0 0 14px;font-weight:500;}
.foot-cols p{font-size:0.85rem;line-height:1.6;margin:0 0 14px;color:#c9c6bd;max-width:34ch;}
.foot-cols a{display:block;font-size:0.85rem;color:#c9c6bd;text-decoration:none;padding:6px 0;margin-bottom:2px;min-height:32px;}
.foot-cols a:hover{color:#fff;}
.foot-logo{display:inline-block;height:28px;width:auto;color:#ffffff;flex:none;margin-bottom:14px;}
.foot-social{display:flex;gap:10px;margin-top:6px;}
.foot-social a{width:30px;height:30px;border:1px solid #45443f;display:inline-flex;align-items:center;justify-content:center;margin:0;}
.foot-social svg{width:14px;height:14px;stroke:#c9c6bd;fill:none;stroke-width:1.6;}
.foot-social a.foot-whatsapp{background:#12823f;border-color:#12823f;}
.foot-social a.foot-whatsapp:hover{background:#0d6630;border-color:#0d6630;}
.foot-bottom{
  max-width:1032px;margin:28px auto 0;padding:20px 24px 0;border-top:1px solid #33322e;
}
/* #76746c on the dark footer was 3.57:1 — under AA. #9a978e reaches 4.6:1. */
.foot-legal{font-size:0.76rem;line-height:1.6;color:#9a978e;margin:0 0 14px;max-width:72ch;}
.foot-bottom-row{display:flex;justify-content:space-between;font-size:0.78rem;color:#8f8c83;flex-wrap:wrap;gap:8px;}

@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

/* ---- emergency: who to call, in order ---- */
.whocall{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){.whocall{grid-template-columns:1fr;}}
.whocall>div{background:var(--paper);padding:22px;}
.whocall h3{font-family:'Inter',sans-serif;font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;font-weight:600;}
.whocall .num{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.25rem;color:var(--ink);display:block;margin-bottom:4px;}
.whocall .num.flame{color:var(--flame);}
.whocall .num a{text-decoration:none;color:inherit;}
.whocall p{color:var(--ink-soft);font-size:0.88rem;margin-top:6px;}

/* ---- About page: lead engineer block ---- */
.who{display:grid;grid-template-columns:300px 1fr;gap:34px;align-items:start;}
/* No photo yet — run the text full width rather than leaving an empty column. */
.who-nophoto{grid-template-columns:1fr;max-width:70ch;}
@media (max-width:760px){.who{grid-template-columns:1fr;}}
.who img{width:100%;border:1px solid var(--line);display:block;}
.creds{display:grid;gap:9px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);}
.creds div{display:flex;justify-content:space-between;gap:14px;font-size:0.85rem;}
.creds span:first-child{color:var(--ink-soft);}
.creds span:last-child{font-weight:600;text-align:right;}

/* ---- accreditation logos (About page) ---- */
.accred-strip{display:flex;flex-wrap:wrap;gap:16px;}
.accred-logo{
  flex:1;min-width:150px;height:84px;border:1px solid var(--line);background:#fff;
  display:flex;align-items:center;justify-content:center;text-align:center;padding:10px 16px;
}
.accred-logo img{max-width:100%;max-height:52px;object-fit:contain;}

/* ---- trust strip ---- */
.trust-strip{display:flex;flex-wrap:wrap;gap:18px 24px;align-items:center;justify-content:center;padding:20px 22px;background:var(--paper-tint);border:1px solid var(--line);margin-top:36px;}
.trust-badge{display:flex;align-items:center;gap:10px;font-family:'Inter',sans-serif;font-size:0.85rem;font-weight:600;color:var(--ink);}
.trust-badge svg{width:28px;height:28px;stroke:var(--brass);fill:none;stroke-width:1.5;flex:none;}
.trust-badge .gas-safe{width:34px;height:34px;border-radius:50%;background:#0072ce;color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-weight:800;font-size:0.62rem;text-align:center;line-height:1.05;flex:none;}

/* ---- FAQ ---- */
.faq-nav{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 6px;}
.faq-nav a{font-size:0.82rem;font-weight:600;padding:9px 14px;border:1px solid var(--line);
 border-radius:2px;text-decoration:none;color:var(--ink);background:var(--paper);min-height:auto;}
.faq-nav a:hover{border-color:var(--brass-deep);color:var(--brass-deep);}
.faq-nav .count{color:var(--ink-soft);font-weight:400;}
.faq-group{scroll-margin-top:16px;}
.faq-group>h2{font-size:1.15rem;margin-bottom:4px;}
details.faq-item{border-bottom:1px solid var(--line);padding:0;}
details.faq-item summary{list-style:none;cursor:pointer;padding:16px 34px 16px 0;position:relative;
 font-family:'Inter',sans-serif;font-weight:700;font-size:1rem;color:var(--ink);}
details.faq-item summary::-webkit-details-marker{display:none;}
details.faq-item summary::after{content:"";position:absolute;right:6px;top:22px;width:9px;height:9px;
 border-right:2px solid var(--brass);border-bottom:2px solid var(--brass);transform:rotate(45deg);transition:transform .15s;}
details.faq-item[open] summary::after{transform:rotate(-135deg);}
details.faq-item summary:hover{color:var(--brass-deep);}
details.faq-item p{color:var(--ink-soft);font-size:0.92rem;margin:0 0 18px;max-width:66ch;}

.faq-item{border-bottom:1px solid var(--line);padding:18px 0;}
.faq-item:first-child{padding-top:0;}
.faq-item h3{font-size:1rem;text-transform:none;letter-spacing:0;font-family:'Inter',sans-serif;font-weight:700;}
.faq-item p{color:var(--ink-soft);font-size:0.9rem;margin-top:8px;max-width:64ch;}

/* ---- Pricing ---- */
.pricing-table{border:1px solid var(--line);}
.pricing-row{display:grid;grid-template-columns:1fr;gap:16px;padding:14px 20px;border-bottom:1px solid var(--line);align-items:baseline;}
.pricing-row:last-child{border-bottom:none;}
.pricing-row h4{font-family:'Inter',sans-serif;font-weight:700;font-size:0.92rem;text-transform:none;letter-spacing:0;}
.pricing-row p{color:var(--ink-soft);font-size:0.82rem;margin-top:3px;}
.pricing-row .price{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1rem;color:var(--brass-deep);white-space:nowrap;}
.pricing-note{font-size:0.8rem;color:var(--ink-soft);margin-top:14px;font-style:italic;}
.pricing-group-label{font-size:0.85rem;font-weight:700;color:var(--ink);margin:30px 0 10px;font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;}
.pricing-how{background:var(--paper-tint);border:1px solid var(--line);padding:26px 28px;margin-top:8px;}
.pricing-how h2{font-size:1.15rem;}
.pricing-how .quote-list li{font-size:0.92rem;color:var(--ink-soft);}
.pricing-how .quote-list strong{color:var(--ink);}
.pricing-group-label:first-child{margin-top:0;}
