/* =============================================================================
   UTILITIES + SMALL MODIFIERS — loaded LAST on every page (config.php -> css_last)
   These replace the inline style="…" attributes that used to sit in the pages.
   Spacing utilities use !important so they behave exactly like the inline
   styles they replace.
   ============================================================================= */

/* ---------- spacing ---------- */
.u-m-0      { margin:0 !important; }
.u-mt-12    { margin-top:12px !important; }
.u-mt-18    { margin-top:18px !important; }
.u-mt-28    { margin-top:28px !important; }
.u-mt-32    { margin-top:32px !important; }
.u-mb-28    { margin-bottom:28px !important; }
.u-pt-72    { padding-top:72px !important; }
.u-head-gap { margin:10px 0 14px !important; }   /* h2 under an eyebrow, in a two-column block */
.u-sec-gap  { margin:72px 0 28px !important; }   /* a second heading further down a section */

/* ---------- page banners (background photo per page) ---------- */
.nt .nt-hero.nt-hero--residential { background-image:linear-gradient(100deg,rgba(14,44,82,.94) 0%,rgba(24,69,123,.84) 55%,rgba(24,69,123,.55) 100%),url('/assets/images/banners/9.jpg'); }
.nt .nt-hero.nt-hero--commercial  { background-image:linear-gradient(100deg,rgba(14,44,82,.94) 0%,rgba(24,69,123,.84) 55%,rgba(24,69,123,.55) 100%),url('/assets/images/page-titles/3.jpg'); }
.nt .nt-hero.nt-hero--water       { background-image:linear-gradient(100deg,rgba(14,44,82,.94) 0%,rgba(24,69,123,.84) 55%,rgba(24,69,123,.55) 100%),url('/assets/images/page-titles/Solar.jpg'); }
.nt .nt-hero.nt-hero--fencing     { background-image:linear-gradient(100deg,rgba(14,44,82,.94) 0%,rgba(24,69,123,.84) 55%,rgba(24,69,123,.55) 100%),url('/assets/images/page-titles/a.jpg'); }

/* ---------- blog page banner: same size, photo and type as the service/product page banners (.nt-hero) ---------- */
.phead.phead--banner { min-height:740px; display:flex; align-items:center; box-sizing:border-box; padding:100px 0 150px; color:#fff;
  background:linear-gradient(100deg,rgba(14,44,82,.94) 0%,rgba(24,69,123,.84) 55%,rgba(24,69,123,.55) 100%),
             var(--navy-deep,#0f2f57) url('/assets/images/page-titles/4.jpg') center/cover no-repeat; }
.phead--banner > .wrap { width:100%; }
.phead--banner .crumb { font-size:14px; margin-bottom:16px; color:rgba(255,255,255,.72); }
.phead--banner .crumb a { color:inherit; }
.phead--banner .crumb a:hover { color:#fff; text-decoration:underline; }
.phead--banner .crumb span[aria-hidden] { color:rgba(255,255,255,.5); }
.phead--banner h1 { font-size:clamp(2.5rem,5vw,4.4rem); max-width:15ch; margin:12px 0 18px; color:#fff; }
.phead--banner .lead { margin-top:0; color:#d3deeb; max-width:40rem; }
@media (max-width:860px) { .phead.phead--banner { min-height:660px; } }
@media (max-width:560px) { .phead.phead--banner { min-height:680px; padding:80px 0 120px; } }

/* ---------- about page ---------- */
.sh-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.ab-rating__note { color:#cfdcec; font-size:14px; }

/* footer: space between the line under the logo and the social icons */
.fc .fc__brand .fc__soc{ margin-top:24px; }

/* header: stays in view while scrolling
   (sh-home.js adds .is-away to slide it up on the way down; this cancels the slide) */
html .hdwrap.is-away{ transform:none; }