.service-page{--service-accent:#217aca;--service-soft:#eaf5ff;--service-glow:rgb(96 167 227 / 19%)}
.service-page[data-page="sweet-water"]{--service-accent:#267dd1;--service-soft:#eaf6ff;--service-glow:rgb(107 186 242 / 21%)}
.service-page[data-page="drinking-water"]{--service-accent:#3173c7;--service-soft:#eef7ff;--service-glow:rgb(89 152 226 / 20%)}
.service-page[data-page="irrigation-water"]{--service-accent:#287bbd;--service-soft:#e8f4ff;--service-glow:rgb(75 159 214 / 21%)}
.service-page[data-page="salt-water"]{--service-accent:#2468b5;--service-soft:#e5f2ff;--service-glow:rgb(73 134 215 / 23%)}
.service-page[data-page="wastewater"]{--service-accent:#336da7;--service-soft:#e8f1fa;--service-glow:rgb(91 144 200 / 22%)}
.service-page[data-page="tank-hire"]{--service-accent:#377dbf;--service-soft:#edf7ff;--service-glow:rgb(101 170 216 / 22%)}
.service-page[data-page="mini-bus"]{--service-accent:#2a70bc;--service-soft:#edf4fc;--service-glow:rgb(89 147 207 / 18%)}
.service-page .hero{height:auto;min-height:clamp(625px,calc(92svh - 80px),860px);background:var(--service-soft)}
.service-page .hero-image{object-position:var(--image-position,33% center)}
.service-page .hero-shade{background:linear-gradient(90deg,transparent 0%,rgb(242 250 255 / 16%) 32%,rgb(241 249 255 / 76%) 52%,rgb(248 252 255 / 97%) 73%,rgb(248 252 255 / 99%) 100%),linear-gradient(0deg,rgb(9 56 111 / 16%),transparent 35%)}
.service-page .hero-content{justify-content:flex-end}
.service-page .hero-text{width:min(50%,610px);padding-left:24px}
.service-page .hero h1{font-size:clamp(3.7rem,6vw,6.9rem);max-width:640px}
.service-page .hero-description{max-width:550px}
.service-page .hero .eyebrow,.service-page .text-action,.service-page .stats-section .stat-card strong{color:var(--service-accent)}
.service-page .intro-section{background:radial-gradient(circle at 86% 24%,var(--service-glow),transparent 33%),#fff}
.service-page .intro-section h2{color:#0a3a6d}
.service-page .intro-droplet{background:var(--service-soft);color:var(--service-accent)}
.service-page .split-section{background:linear-gradient(135deg,var(--service-soft),#fafdff)}
.service-page .split-media{border-radius:24px;box-shadow:0 26px 65px rgb(40 104 173 / 14%);transform:rotate(-1.1deg);transition:transform .45s ease,box-shadow .45s ease}
.service-page .split-media:hover{transform:rotate(0) translateY(-5px);box-shadow:0 35px 80px rgb(35 105 176 / 20%)}
.service-page .split-media img{height:100%;object-fit:cover}
.service-page .stats-section{background:linear-gradient(145deg,var(--service-soft),#fff)}
.service-page .stat-card{position:relative;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}
.service-page .stat-card::after{content:"";position:absolute;right:-32px;bottom:-56px;width:150px;height:150px;border:1px solid rgb(64 140 204 / 15%);border-radius:50%;box-shadow:0 0 0 24px rgb(64 140 204 / 5%),0 0 0 50px rgb(64 140 204 / 3%)}
.service-page .stat-card:hover{transform:translateY(-5px);box-shadow:0 20px 43px rgb(32 105 174 / 12%)}
.service-page .services-section{background:#fff}
.service-page .service-card{min-height:280px;background:linear-gradient(150deg,#fff,var(--service-soft))}
.service-page .service-card-link{color:var(--service-accent)}
.service-page[data-page="tank-hire"] .hero-content{justify-content:flex-start}
.service-page[data-page="tank-hire"] .hero-text{padding-left:0}
.service-page[data-page="tank-hire"] .hero-image{object-position:var(--image-position,63% center)}
.service-page[data-page="tank-hire"] .hero-shade{background:linear-gradient(90deg,rgb(249 252 255 / 97%) 0%,rgb(244 250 255 / 83%) 33%,rgb(246 251 255 / 27%) 56%,transparent 100%)}
.service-page[data-page="drinking-water"] .split-media,.service-page[data-page="salt-water"] .split-media{order:2;transform:rotate(1.1deg)}
.service-page[data-page="drinking-water"] .split-media:hover,.service-page[data-page="salt-water"] .split-media:hover{transform:rotate(0) translateY(-5px)}
@media(max-width:960px){.service-page .hero-text{width:min(58%,610px)}.service-page .hero h1{font-size:clamp(3.8rem,7vw,6rem)}}
@media(max-width:640px){.service-page .hero{height:auto;min-height:clamp(640px,calc(100svh - 70px),790px)}.service-page .hero-image,.service-page[data-page="tank-hire"] .hero-image{object-position:var(--mobile-image-position,var(--image-position,25% center))}.service-page .hero-shade,.service-page[data-page="tank-hire"] .hero-shade{background:linear-gradient(180deg,rgb(248 252 255 / 98%) 0%,rgb(245 251 255 / 92%) 37%,rgb(240 249 255 / 47%) 60%,rgb(11 58 111 / 14%) 100%)}.service-page .hero-content,.service-page[data-page="tank-hire"] .hero-content{justify-content:flex-start}.service-page .hero-text,.service-page[data-page="tank-hire"] .hero-text{width:100%;padding:0}.service-page .hero h1{font-size:clamp(3.35rem,12vw,4.8rem)}.service-page .hero-description{max-width:540px}.service-page .split-media{transform:none}.service-page[data-page="drinking-water"] .split-media,.service-page[data-page="salt-water"] .split-media{order:0;transform:none}}
@media(max-width:410px){.service-page .hero h1{font-size:clamp(2.85rem,12vw,3.2rem)}}
@media(prefers-reduced-motion:reduce){.service-page .split-media,.service-page .stat-card{transition:none}.service-page .split-media:hover,.service-page .stat-card:hover{transform:none}}

/* Vehicle hire keeps the photographic road scene and the site's natural blue identity. */
.service-page[data-page="vehicle-rental"]{--service-accent:#1769c8;--service-soft:#edf6ff;--service-glow:rgb(78 146 215 / 17%)}
.service-page[data-page="vehicle-rental"] :is(h1,h2,h3){letter-spacing:-.035em;text-wrap:balance}
.service-page[data-page="vehicle-rental"] .hero-content{justify-content:flex-start}
.service-page[data-page="vehicle-rental"] .hero-text{width:min(49%,580px);padding-left:0}
.service-page[data-page="vehicle-rental"] .hero h1{font-size:clamp(3.4rem,5.7vw,6rem);line-height:1.02}
.service-page[data-page="vehicle-rental"] .hero-shade{background:linear-gradient(90deg,rgb(248 252 255 / 97%) 0%,rgb(244 250 255 / 93%) 28%,rgb(243 250 255 / 53%) 43%,transparent 65%)}
.service-page[data-page="vehicle-rental"] .hero-bottom{color:#284c74;text-shadow:none}
.service-page[data-page="vehicle-rental"] .transport-card{border-radius:12px;background:#f1f7fd;box-shadow:none}
.service-page[data-page="vehicle-rental"] .transport-card:hover{background:#e8f3fe;box-shadow:none}
.service-page[data-page="vehicle-rental"] .split-media{border-radius:14px;transform:none;box-shadow:none}
.service-page[data-page="vehicle-rental"] .split-media:hover{transform:translateY(-4px);box-shadow:none}
.service-page[data-page="vehicle-rental"] .stats-section .section-description{max-width:660px}
@media(max-width:960px){
  .service-page[data-page="vehicle-rental"] .hero-text{width:min(70%,600px)}
  .service-page[data-page="vehicle-rental"] .hero-content{align-items:flex-start;padding-top:65px;padding-bottom:240px}
  .service-page[data-page="vehicle-rental"] .hero-shade{background:linear-gradient(180deg,rgb(248 252 255 / 98%) 0%,rgb(245 251 255 / 91%) 40%,rgb(242 250 255 / 20%) 72%,transparent 100%)}
}
@media(max-width:640px){
  .service-page[data-page="vehicle-rental"] .hero-text{width:100%}
  .service-page[data-page="vehicle-rental"] .hero-content{padding-top:55px;padding-bottom:260px}
  .service-page[data-page="vehicle-rental"] .hero h1{font-size:clamp(2.9rem,12vw,4.5rem)}
  .service-page[data-page="vehicle-rental"] .hero-description{font-size:1rem}
  .service-page[data-page="vehicle-rental"] .hero-image{object-position:var(--mobile-image-position,68% center)}
}
@media(prefers-reduced-motion:reduce){.service-page[data-page="vehicle-rental"] .split-media:hover{transform:none}}