/* Service-page template. Shared branding, cards, forms and navigation live in styles.css. */
.breadcrumbs{padding-block:17px;font-size:13px;color:#42606a}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0}
.breadcrumbs li+li::before{content:'/';margin-right:9px;color:#72929c}
.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{text-decoration:underline}
.service-hero h1{font-size:clamp(60px,6.3vw,88px);line-height:1.05;max-width:640px}
.service-hero .hero-content{max-width:660px;padding-block:60px}
.service-hero .hero-content>p{max-width:490px}
.service-page .intro{padding-block:58px 62px}
.service-page .intro-copy h2{font-size:clamp(36px,3.4vw,47px)}
.gas-scope{padding-block:58px 64px;background:var(--navy);color:white}
.gas-scope h2{font-size:clamp(34px,3.5vw,48px);max-width:800px}
.section-lead{margin-top:14px;color:#d3e3e8;max-width:680px}
.gas-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 35px;margin-top:35px}
.gas-service-item{display:flex;gap:15px;border-top:1px solid #31515d;padding-top:23px}
.gas-service-number{font-family:var(--heading);font-size:30px;color:var(--aqua);line-height:1.1}
.gas-service-item h3{font-family:var(--body);font-size:20px;font-weight:700;line-height:1.2;margin-bottom:10px}
.gas-service-item p{font-size:16px;line-height:1.5;color:#d3e3e8}
.service-detail{padding-block:64px;background:var(--paper)}
.service-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.service-detail-image img{width:100%;height:430px;object-fit:cover}
.service-detail h2{font-size:clamp(36px,3.8vw,51px);margin-bottom:20px}
.service-detail p{margin-bottom:16px;line-height:1.5}
.service-detail p a{color:#006e83;font-weight:600}
.service-detail .button{margin-top:9px}
.gas-safety{background:#fff0e5;padding-block:28px;color:var(--navy)}
.gas-safety-inner{display:flex;gap:22px;align-items:flex-start}
.gas-safety-symbol{display:flex;align-items:center;justify-content:center;border:2px solid var(--orange);color:#9d3b09;border-radius:50%;width:44px;height:44px;flex-shrink:0;font-weight:700;font-size:25px}
.gas-safety h2{font-family:var(--body);font-size:22px;font-weight:700;margin-bottom:8px;text-transform:none}
.gas-safety p{font-size:16px;max-width:950px;line-height:1.5;margin-bottom:8px}
.gas-safety a{font-weight:600;font-size:14px;text-underline-offset:3px}
.service-page .team{padding-block:58px}
.service-page .process{padding-block:58px 62px}
.service-page .related-services{padding-block:52px 58px}
.related-services h2{margin-bottom:26px}
@media(max-width:1000px){.gas-service-grid{grid-template-columns:1fr 1fr;gap:26px}.service-detail-grid{gap:35px}.service-detail-image img{height:400px}}
@media(max-width:700px){
 .breadcrumbs{padding-block:12px;font-size:12px}
 .service-hero h1{font-size:clamp(47px,11vw,70px);line-height:1.05}
 .service-hero .hero-content{padding:0;max-width:100%}
 .service-hero .container{padding-block:38px 290px}
 .service-hero{min-height:0}
 .service-page .intro{padding-block:40px 44px}
 .service-page .intro-copy h2{font-size:38px}
 .gas-scope{padding-block:42px 46px}.gas-scope h2{font-size:37px}
 .gas-service-grid{grid-template-columns:1fr;gap:22px;margin-top:26px}
 .gas-service-item{padding-top:18px}.gas-service-item p{font-size:16px}
 .service-detail{padding-block:42px 46px}.service-detail-grid{grid-template-columns:1fr;gap:28px}
 .service-detail-image img{height:265px}.service-detail h2{font-size:40px}
 .gas-safety{padding-block:26px}.gas-safety-inner{gap:14px}.gas-safety-symbol{width:32px;height:32px;font-size:20px}
 .gas-safety h2{font-size:20px}.service-page .team{padding-block:42px}
 .service-page .related-services{padding-block:42px 46px}
 .service-page .process{padding-block:46px 50px}
}

/* Integrated breadcrumbs, alternating content and related-service carousel. */
.service-hero .breadcrumbs{color:#dfedf0;padding:0;margin-bottom:25px;font-size:13px}
.service-hero .breadcrumbs li+li::before{color:#9fc2cc}
.service-hero .hero-photo{width:68%;left:auto;object-position:center}
.service-detail-reverse{background:#edf5f5}
.related-services .service-grid{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding-bottom:12px;scrollbar-width:thin;scrollbar-color:var(--aqua) #244957}
.related-services .service-card{flex:0 0 43%;min-width:0;scroll-snap-align:start}
.related-services .service-controls{display:flex;justify-content:flex-end;align-items:center;margin-top:12px}
.related-services .service-swipe-hint{display:none}
.related-services .service-slider-nav{display:flex;align-items:center;gap:9px}
.related-services .service-slider-nav button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;border:1px solid #6e9aa8;background:transparent;color:white;cursor:pointer}
.related-services .service-slider-nav button:disabled{opacity:.35;cursor:default}
.related-services .service-prev .icon{transform:rotate(180deg)}
.related-services .service-position{min-width:36px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums}
.related-services .service-grid:focus-visible,.related-services .service-slider-nav button:focus-visible{outline:2px solid var(--aqua);outline-offset:3px}
@media(min-width:701px) and (max-width:1000px){.related-services .service-card{flex-basis:60%}}
@media(max-width:700px){.service-hero .hero-photo{width:100%;left:0;object-position:center}.service-hero .breadcrumbs{font-size:12px;margin-bottom:21px}.service-detail-reverse .service-detail-image{grid-row:1}.related-services .service-card{flex-basis:90%}}
.service-hero::after{background:linear-gradient(90deg,#001a28 0%,#001a28 30%,#001a28f5 35%,#001a28a6 48%,#001a2822 69%,transparent 90%)}
@media(max-width:700px){.service-hero::after{background:linear-gradient(180deg,#001e2c 0%,#001e2c 58%,#001e2cd9 65%,#001e2c44 75%,transparent 85%)}}

/* Full-width Google reviews widget on service pages. */
.reviews--embed .review-embed{width:100%;max-width:none;margin-top:26px;min-width:0}
.reviews--embed .review-embed>div{width:100%;max-width:none}
.reviews--embed h2{max-width:1100px}
@media(max-width:700px){.reviews--embed h2{font-size:37px}.reviews--embed .review-embed{margin-top:22px}}

/* Override the 1280px maximum set by the Elfsight embed itself. */
#reviews.reviews--embed .review-embed .elfsight-app-838eaa69-51c6-49a3-9edd-5d34fc239a72 .es-embed-root{width:100%!important;max-width:100%!important;margin:0!important}

/* Burst Pipe Repair uses a dedicated wide hero photograph. */
.service-burst-pipe .service-hero .hero-photo{width:100%;left:0;object-position:65% center}
.service-burst-pipe .service-hero h1{font-size:clamp(54px,5.6vw,78px)}
@media(max-width:700px){.service-burst-pipe .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-burst-pipe .service-hero .hero-photo{object-position:72% center}}

/* Services overview directory. */
.service-overview .service-hero .hero-photo{width:100%;left:0;object-position:70% center}
.service-overview .service-hero h1{font-size:clamp(54px,5.6vw,78px)}
.service-directory{padding-top:56px;background:#fff}
.service-directory> .container>h2{font-size:clamp(35px,3.6vw,48px);max-width:800px}
.directory-jump{display:flex;flex-wrap:wrap;gap:12px;margin-block:27px 42px}
.directory-jump a{display:inline-flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid #bedce2;font-weight:600;font-size:14px;text-decoration:none;background:#edf8fa;color:var(--navy)}
.directory-jump a:hover{border-color:var(--teal);background:#d7f3f7}
.directory-jump .icon{width:16px;height:16px;transform:rotate(90deg)}
.directory-category{padding-block:46px 52px;scroll-margin-top:100px}
.directory-category-alt{background:#edf5f5}
.directory-category-grid{display:grid;grid-template-columns:.8fr 2fr;gap:45px;align-items:start}
.directory-category-intro img{width:100%;height:155px;object-fit:cover;margin-bottom:23px}
.directory-category-intro .eyebrow{font-size:11px;color:#00768a}
.directory-category-intro h3{font-size:34px;line-height:1.12;margin-bottom:13px}
.directory-category-intro p{font-size:16px;line-height:1.45;color:#3e5964}
.directory-links{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:13px}
.directory-links li{min-width:0}
.directory-links a{height:100%;display:flex;align-items:center;justify-content:space-between;gap:17px;padding:20px;border:1px solid #cfdee2;background:#fff;text-decoration:none;color:var(--navy);transition:border-color .2s,background .2s}
.directory-links a:hover{border-color:var(--teal);background:#f4fcfd}
.directory-links strong{display:block;font-size:18px;line-height:1.2;margin-bottom:7px}
.directory-links small{display:block;font-size:14px;line-height:1.4;color:#4b646d}
.directory-links .icon{width:17px;height:17px;flex-shrink:0;color:var(--teal)}
.directory-jump a:focus-visible,.directory-links a:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
@media(max-width:1000px){.directory-category-grid{grid-template-columns:.8fr 1.7fr;gap:28px}.directory-links a{padding:17px}.directory-links strong{font-size:17px}}
@media(max-width:700px){.service-overview .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-directory{padding-top:40px}.service-directory> .container>h2{font-size:38px}.directory-jump{display:grid;grid-template-columns:1fr;gap:9px;margin-block:23px 28px}.directory-jump a{justify-content:space-between}.directory-category{padding-block:34px 40px;scroll-margin-top:85px}.directory-category-grid{grid-template-columns:1fr;gap:24px}.directory-category-intro img{height:180px;margin-bottom:20px}.directory-category-intro h3{font-size:34px}.directory-links{grid-template-columns:1fr;gap:11px}.directory-links a{padding:19px}.directory-links strong{font-size:18px}}

/* Drainage service pages reuse relevant live-site photography. */
.service-drainage .service-hero .hero-photo{width:100%;left:0;object-position:75% center}
.service-drainage .service-hero h1{font-size:clamp(54px,5.6vw,78px)}
@media(max-width:700px){.service-drainage .service-hero h1{font-size:clamp(46px,11vw,70px)}}

.service-toilet .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-toilet .service-hero h1{font-size:clamp(54px,5vw,68px)}
@media(max-width:700px){.service-toilet .service-hero .hero-photo{width:100%;left:0;object-position:center}.service-toilet .service-hero h1{font-size:clamp(46px,11vw,70px)}}

/* Hot water and tap pages retain the approved service hero layout. */
.service-water .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-water .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-heat-pump .service-hero .hero-photo{object-fit:contain;padding:25px;background:#fff}
.service-heat-pump .service-detail:not(.service-detail-reverse) .service-detail-image img{object-fit:contain;background:#fff;padding:20px}
@media(max-width:700px){.service-water .service-hero .hero-photo{width:100%;left:0}.service-water .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-heat-pump .service-hero .hero-photo{padding:12px}.service-taps .service-hero .hero-photo{object-position:center 40%}}

/* Stormwater, excavation and civil project service pages. */
.service-project .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-project .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-stormwater .service-hero .hero-photo{object-position:center 70%}
@media(max-width:700px){.service-project .service-hero .hero-photo{width:100%;left:0}.service-project .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-excavation .service-hero .hero-photo{object-position:center 65%}}

/* Roofing service pages use live client gutter and roof photography. */
.service-roofing .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-roofing .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-guttering .service-hero .hero-photo{object-position:left center}
.service-roofing .service-detail-image img[src*="gutter-install-live"]{object-position:center 20%}
@media(max-width:700px){.service-roofing .service-hero .hero-photo{width:100%;left:0}.service-roofing .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-guttering .service-hero .hero-photo{object-position:left center}.service-downpipe-replacements-repairs .service-hero .hero-photo{object-position:center 20%}}

/* Leak investigation and urgent plumbing service pages. */
.service-leak .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-leak .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-emergency-plumber .service-hero .hero-photo{object-position:left center}
@media(max-width:700px){.service-leak .service-hero .hero-photo{width:100%;left:0}.service-leak .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-emergency-plumber .service-hero .hero-photo{object-position:center}}

/* Drainage, rainwater and on-site wastewater service pages. */
.service-systems .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-systems .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-drainage-solutions .service-hero .hero-photo{object-position:center 70%}
@media(max-width:700px){.service-systems .service-hero .hero-photo{width:100%;left:0}.service-systems .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-rainwater .service-hero .hero-photo{object-position:center 35%}}

/* Kitchen appliances and filter service pages use live installation images. */
.service-appliance .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-appliance .service-hero h1{font-size:clamp(54px,5vw,68px)}
@media(max-width:700px){.service-appliance .service-hero .hero-photo{width:100%;left:0}.service-appliance .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-dishwasher-installation .service-hero .hero-photo{object-position:center 45%}}

/* Final service pages: construction, outdoor products and device testing. */
.service-final .service-hero .hero-photo{width:52%;left:48%;object-position:center}
.service-final .service-hero h1{font-size:clamp(54px,5vw,68px)}
.service-tmv .service-hero .hero-photo{object-fit:contain;background:#ddd8d1;padding:22px}
.service-sauna .service-hero .hero-photo{object-position:center 55%}
@media(max-width:700px){.service-final .service-hero .hero-photo{width:100%;left:0}.service-final .service-hero h1{font-size:clamp(46px,11vw,70px)}.service-tmv .service-hero .hero-photo{padding:10px}.service-backflow .service-hero .hero-photo{object-position:center 35%}}