/* WOW desktop-only refinements — 09 October 2026, revision 2.
   Mobile and tablet at 1023px or less retain their exact previous CSS.
   This is a stylesheet override, not a visual overlay. */
@media screen and (min-width:1024px) {
  /* Make the ORIGINAL banner full width, uncropped and undistorted,
     exactly as its intrinsic 1179:283 aspect ratio requires. */
  html { scroll-padding-top:74px !important; }
  body { padding-top:0 !important; }
  .site-header {
    position:sticky !important;
    top:calc(-100vw * 283 / 1179) !important;
    inset-inline:0 !important;
    z-index:1000 !important;
  }
  .site-header .header-banner {
    display:block !important;
    width:100% !important;
    height:auto !important;
    line-height:0 !important;
    overflow:visible !important;
    background:#fff !important;
  }
  .site-header .header-banner img {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center !important;
    transform:none !important;
  }
  /* Navigation remains visible as the visitor scrolls down. */
  .site-header .main-nav.wrap {
    width:min(1140px,calc(100% - 70px)) !important;
    height:60px !important;
    gap:clamp(18px,2.5vw,34px) !important;
  }
  .site-header .main-nav a:not(.header-call){font-size:clamp(13px,1vw,15px) !important;}
  .site-header .header-call {font-size:14px !important; padding:12px 16px !important;white-space:nowrap;}
  /* Keep the exact same hero artwork, proportions, and clickable hotspots
     as the mobile layout, but scale the entire unit into comfortable bounds. */
  body.wow-home .hero.hero-restored {
    padding:20px 0 24px !important;
    background:#071d30 !important;
  }
  body.wow-home .hero-restored .hero-image-wrap {
    width:min(1160px,calc(100% - 64px)) !important;
    max-width:1160px !important;
    margin:0 auto !important;
    border-radius:0 !important;
    overflow:visible !important;
    box-shadow:none !important;
  }
  body.wow-home .hero-restored .hero-image-wrap>img {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
    max-height:none !important;
    object-fit:contain !important;
    transform:none !important;
  }
  /* Scale page typography more like the compact mobile design, while
     giving sections generous room instead of crowding the content. */
  body.upgrade-page .wrap:not(.main-nav) { width:min(1100px,calc(100% - 80px)) !important; }
  body.upgrade-page .section:not(.hero):not(.hero-restored) {padding-block:68px !important;}
  body.upgrade-page .section-title {max-width:760px !important;margin-bottom:38px !important;}
  body.upgrade-page .section-title h2,
  body.upgrade-page .about-heading h2,
  body.upgrade-page .quote-copy h2,
  body.upgrade-page .service-hero-copy h1 {
    font-size:clamp(32px,3vw,42px) !important;
    line-height:1.14 !important;
  }
  body.upgrade-page .section-intro{max-width:740px;line-height:1.65;font-size:16px !important;margin-inline:auto;}
  body.upgrade-page .service-grid {gap:24px !important;}
  body.upgrade-page .service-hero-grid {gap:clamp(26px,4vw,60px) !important;}
  body.upgrade-page .wow-location-service-grid {gap:24px !important;}
  /* Interior hero pages: compact the oversized desktop headings and
     maintain the familiar centred mobile hierarchy. */
  body.upgrade-page .page-hero-upgrade { padding-block:52px !important; }
  body.upgrade-page .page-hero-upgrade h1 {
    font-size:clamp(34px,3.2vw,44px) !important;
    line-height:1.12 !important;
    max-width:800px !important;
    margin-inline:auto !important;
  }
  body.upgrade-page .page-hero-upgrade>.wrap>p {
    font-size:17px !important;
    line-height:1.6 !important;
    max-width:760px !important;
  }
  body.upgrade-page .wow-location-hero h1 {
    font-size:clamp(34px,3.2vw,44px) !important;
    line-height:1.14 !important;
  }
  body.upgrade-page .wow-location-hero .local-lead {
    font-size:17px !important;
    line-height:1.6 !important;
  }
}


/* WOW R3: Desktop content reflow — 9 October 2026.
   Only adds real multi-column document layout at >=1024px.
   Does not touch image artwork, mobile/tablet styles, HTML contents,
   form functionality, SEO, footer or the approved full-width banner. */
@media screen and (min-width:1024px) {
  /* Fixed / hourly explanations on Home, Leak Detection, Pricing and service pages.
     These were long one-column text blocks on desktop. */
  body.upgrade-page .fixed-price-section .wow-copy-flow {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
    gap:24px;
    width:min(1080px,100%);
    max-width:1080px;
    margin:30px auto 0;
  }
  body.upgrade-page .fixed-price-section .wow-copy-flow > .wow-copy-block {
    min-width:0;
    margin:0;
    padding:24px 26px;
    border:1px solid rgba(225,237,247,.2);
    border-radius:16px;
    background:rgba(255,255,255,.065);
  }
  body.upgrade-page .fixed-price-section .wow-copy-flow > .wow-info-excluded {
    min-width:0;
    margin:0 !important;
    align-self:start;
  }
  body.upgrade-page .fixed-price-section .wow-copy-flow > .section-link {
    grid-column:1/-1;
    justify-self:center;
    margin-top:0;
  }

  /* FAQ answers use two readable columns instead of a long vertical list.
     Each native <details> remains keyboard accessible and independently expandable. */
  body.upgrade-page main .faq-list,
  body.wow-local-page main .local-faq {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px 20px;
    align-items:start;
    width:100%;
    max-width:none;
  }
  body.upgrade-page main .faq-list > details,
  body.wow-local-page main .local-faq > details {
    min-width:0;
    margin:0;
  }

  /* Leak Detection service: the hourly and fixed options sit side by side.
     Targets only the service hero containing a direct hourly alternative. */
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:26px;
    row-gap:14px;
    align-items:start;
    max-width:1100px;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .eyebrow,
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > h1,
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > p:first-of-type {
    grid-column:1/-1;
    justify-self:center;
    margin-inline:auto !important;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > h2 {
    grid-column:1;
    grid-row:4;
    align-self:end;
    margin:16px 0 4px;
    text-align:center;
    font-size:23px;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .price-pill-row {
    grid-column:1;
    grid-row:5;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-width:none;
    width:100%;
    margin:0 !important;
    gap:8px;
    align-self:start;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > p:nth-of-type(2) {
    grid-column:1;
    grid-row:6;
    margin:0 !important;
    max-width:100% !important;
    text-align:center;
    font-size:15px !important;
    line-height:1.55 !important;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .wow-hourly-option {
    grid-column:2;
    grid-row:4 / span 3;
    align-self:stretch;
    justify-self:stretch;
    max-width:none !important;
    width:100%;
    margin:0 !important;
    padding:21px 18px;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > p:nth-of-type(3),
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .inline-actions {
    grid-column:1/-1;
    justify-self:center;
    margin-inline:auto !important;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > p:nth-of-type(3) {
    margin-block:7px 0 !important;
    text-align:center;
    font-size:14px !important;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .inline-actions {
    margin-top:6px !important;
  }

  /* Town pages: fixed survey / hourly pricing options become a genuine
     two-column comparison without introducing duplicate text or pricing. */
  body.wow-local-page .wow-location-pricing {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:24px;
    row-gap:12px;
    max-width:980px;
    width:100%;
    padding:26px;
    align-items:start;
  }
  body.wow-local-page .wow-location-pricing > .eyebrow,
  body.wow-local-page .wow-location-pricing > .local-price-heading {
    grid-column:1/-1;
    margin-inline:auto;
    max-width:95%;
  }
  body.wow-local-page .wow-location-pricing > .local-price-heading {
    margin-block:0 6px !important;
    font-size:clamp(23px,2.3vw,30px);
    line-height:1.2;
  }
  body.wow-local-page .wow-location-pricing > .price-pill-row {
    grid-column:1;
    grid-row:3;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    max-width:none;
    width:100%;
    margin:0 !important;
    align-self:start;
  }
  body.wow-local-page .wow-location-pricing > .price-pill-row .price-pill {
    min-width:0;
    padding:12px 6px;
    text-align:center;
  }
  body.wow-local-page .wow-location-pricing > .price-pill-row .price-pill strong {
    font-size:clamp(14px,1.3vw,18px);
    white-space:normal;
  }
  body.wow-local-page .wow-location-pricing > .local-fixed-note {
    grid-column:1;
    grid-row:4;
    max-width:none !important;
    margin:0 !important;
    font-size:14px !important;
    line-height:1.6 !important;
    align-self:start;
  }
  body.wow-local-page .wow-location-pricing > .wow-hourly-option {
    grid-column:2;
    grid-row:3 / span 2;
    align-self:stretch;
    width:100%;
    min-width:0;
    max-width:none !important;
    margin:0 !important;
    padding:18px 15px;
    box-sizing:border-box;
  }
  body.wow-local-page .wow-location-pricing > .wow-hourly-option .wow-hourly-rate-tiles {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
    margin:14px auto;
  }
  body.wow-local-page .wow-location-pricing > .wow-hourly-option .wow-hourly-rate-tile {
    padding:10px 4px;
  }
  body.wow-local-page .wow-location-pricing > .wow-hourly-option .wow-hourly-rate-tile strong {
    font-size:clamp(14px,1.3vw,18px);
    white-space:normal;
  }

  /* 146 town pages have exactly two narrative paragraphs about local testing.
     Pair those paragraphs so readers can compare the explanations at a glance. */
  body.wow-local-page main .section > .local-narrow:has(> p:nth-of-type(2)) {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:26px;
    row-gap:18px;
    max-width:1080px;
    align-items:start;
  }
  body.wow-local-page main .section > .local-narrow:has(> p:nth-of-type(2)) > .eyebrow,
  body.wow-local-page main .section > .local-narrow:has(> p:nth-of-type(2)) > h2 {
    grid-column:1/-1;
    text-align:center;
    margin-inline:auto;
  }
  body.wow-local-page main .section > .local-narrow:has(> p:nth-of-type(2)) > p {
    min-width:0;
    padding:19px 22px;
    margin:0 !important;
    border:1px solid #dae7f0;
    border-top:3px solid #f47a27;
    border-radius:12px;
    background:#f8fbfe;
    color:#37536a;
    line-height:1.65;
  }

  /* Keep specialist heating guidance compact without stacking every paragraph. */
  body.wow-service-page main .heating-leak-summary {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px 28px;
    max-width:1080px;
  }
  body.wow-service-page main .heating-leak-summary > h2,
  body.wow-service-page main .heating-leak-summary > .wow-info-excluded {
    grid-column:1/-1;
  }
  body.wow-service-page main .heating-leak-summary > p {
    min-width:0;
    margin:0 !important;
    line-height:1.7;
  }
  body.wow-service-page main .heating-leak-summary > .wow-info-excluded {
    margin-top:6px;
  }

  /* Home's "About WOW" paragraphs form three even columns instead of a
     single narrow stack; heading and CTA remain centred and full width. */
  body.wow-home .about-section .about-single {
    max-width:1080px;
  }
  body.wow-home .about-section .about-single > div {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
    align-items:start;
  }
  body.wow-home .about-section .about-single > div > .about-heading,
  body.wow-home .about-section .about-single > div > .section-link {
    grid-column:1/-1;
    justify-self:center;
  }
  body.wow-home .about-section .about-single > div > p {
    min-width:0;
    margin:0;
    padding:18px 16px 0;
    border-top:3px solid #f47a27;
    font-size:16px;
    line-height:1.65;
    color:#425c72;
    text-align:center;
  }
  body.wow-home .about-section .about-single > div > .section-link {
    margin-top:4px;
  }
}
@media screen and (min-width:1024px) {
  /* Readable orange labels against the white hourly price panels. */
  body.wow-local-page .wow-location-pricing .wow-hourly-option > .eyebrow,
  body.wow-service-page .page-hero-upgrade .wow-hourly-option > .eyebrow {
    color:#984100 !important;
  }
}


/* REVISION 4 — Matching fixed-price card. The wrapper is layout-neutral
   on phones and tablets; it becomes a real card ONLY at desktop widths. */
.wow-service-page .page-hero-upgrade .wow-fixed-option { display:contents; }
@media screen and (min-width:1024px) {
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-hourly-option) > .wow-fixed-option {
    grid-column:1;
    grid-row:4 / span 3;
    display:flex;
    flex-direction:column;
    align-self:stretch;
    justify-self:stretch;
    align-items:stretch;
    gap:14px;
    box-sizing:border-box;
    min-width:0;
    width:100%;
    margin:0;
    padding:21px 18px;
    background:#fff;
    color:#10273c;
    border:1px solid #cbddea;
    border-top:3px solid #f47a27;
    border-radius:12px;
    text-align:center;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option > h2 {
    font-size:1.6rem;
    line-height:1.3;
    color:#10273c;
    margin:4px 0 7px;
    font-weight:750;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option > .price-pill-row {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    width:100%;
    max-width:none;
    margin:0 !important;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option .price-pill {
    min-width:0;
    padding:12px 5px;
    box-sizing:border-box;
    background:#fff;
    color:#10273c;
    border:1px solid #f4bd96;
    border-top:3px solid #f47a27;
    border-radius:14px;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option .price-pill span {
    color:#345168;
    font-size:.8125rem;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option .price-pill strong {
    color:#10273c;
    font-size:1.25rem;
    white-space:nowrap;
  }
  body.wow-service-page .page-hero-upgrade .wow-fixed-option > p {
    font-size:15px !important;
    line-height:1.55 !important;
    color:#345168 !important;
    margin:0 !important;
    max-width:100% !important;
  }
  /* The terms paragraph follows the two pricing cards. */
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-fixed-option) > .wow-hourly-option + p {
    grid-column:1/-1;
    grid-row:7;
    justify-self:center;
    margin:7px auto 0 !important;
    font-size:14px !important;
    text-align:center;
  }
  body.wow-service-page:not(.wow-local-page):not(.wow-area-page)
    .page-hero-upgrade > .wrap:has(> .wow-fixed-option) > .inline-actions {
    grid-row:8;
  }
}


/* WOW DESKTOP POLISH R5 — preserves full-width branding.
   The one mobile correction below restores the original centred paragraph
   after R4 introduced a desktop-only card wrapper. */
@media screen and (max-width:1023px) {
  body.wow-service-page .page-hero-upgrade .wow-fixed-option > p {
    text-align:center !important;
    margin-inline:auto !important;
  }
}
@media screen and (min-width:1024px) {
  /* Matching alignment for the two Leak Detection options. */
  body.wow-service-page .page-hero-upgrade .wow-fixed-option > p {
    text-align:center !important;
  }
  /* Use the original footer artwork twice as proportionally sized cropped
     slices so the logo and water waves remain intact, while removing the
     enormous blank desktop middle of the phone-shaped footer artwork. */
  .locked-site-footer {
    display:block !important;
    position:relative !important;
    height:clamp(920px,76vw,1550px) !important;
    min-height:0 !important;
    width:100% !important;
    background:#f4f9fd !important;
    isolation:isolate;
  }
  .locked-site-footer > .locked-footer-art { display:none !important; }
  .locked-site-footer::before,
  .locked-site-footer::after {
    content:"";
    display:block;
    position:absolute;
    left:0;right:0;
    width:100%;
    pointer-events:none;
    background-image:url('images/footer-locked-reference.jpg');
    background-repeat:no-repeat;
    background-size:100% auto;
    z-index:0;
  }
  .locked-site-footer::before {
    top:0;
    height:clamp(345px,35vw,675px);
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 85%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 85%,transparent 100%);
    background-position:center top;
  }
  .locked-site-footer::after {
    bottom:0;
    height:clamp(275px,26vw,430px);
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 100%);
    background-position:center bottom;
  }
  .locked-site-footer .locked-footer-content {
    position:relative !important;
    inset:auto !important;
    z-index:1 !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    grid-template-rows:auto auto 1fr auto !important;
    column-gap:clamp(18px,3vw,54px) !important;
    row-gap:8px !important;
    align-items:start !important;
    justify-items:stretch !important;
    width:min(1180px,100%) !important;
    height:100% !important;
    margin:0 auto !important;
    padding:clamp(345px,34vw,675px) 6.5% 32px !important;
    box-sizing:border-box !important;
    pointer-events:none !important;
  }
  .locked-site-footer .locked-footer-content .locked-footer-group,
  .locked-site-footer .locked-footer-content .locked-footer-actions {
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    min-width:0 !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    gap:8px !important;
    text-align:center !important;
    padding:0 !important;
  }
  .locked-site-footer .locked-contact { grid-column:1;grid-row:1; }
  .locked-site-footer .locked-legal { grid-column:2;grid-row:1 / span 2; }
  .locked-site-footer .locked-social { grid-column:3;grid-row:1 / span 2; }
  .locked-site-footer .locked-footer-actions { grid-column:1;grid-row:2; }
  .locked-site-footer .locked-footer-group h2 {
    font-size:clamp(20px,2vw,26px) !important;
    line-height:1.2 !important;
    margin:0 0 6px !important;
  }
  .locked-site-footer .locked-footer-group a,
  .locked-site-footer .locked-footer-group > span,
  .locked-site-footer .locked-footer-actions a,
  .locked-site-footer .locked-social .social-label {
    font-size:clamp(14px,1.25vw,17px) !important;
    line-height:1.5 !important;
    overflow-wrap:anywhere;
  }
  .locked-site-footer .locked-homecare {font-weight:750 !important;}
  .locked-site-footer .locked-unsubscribe {font-size:14px !important;}
  .locked-site-footer .locked-social a {
    display:grid !important;
    grid-template-columns:27px auto !important;
    align-items:center !important;
    gap:9px !important;
    width:max-content !important;
    max-width:100% !important;
    justify-content:center !important;
    margin:0 auto !important;
    min-height:28px !important;
  }
  .locked-site-footer .locked-social .social-icon {
    width:25px !important;height:25px !important;
  }
  .locked-site-footer .locked-footer-bottom {
    grid-column:1/-1 !important;
    grid-row:4 !important;
    align-self:end !important;
    justify-self:center !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 14px !important;
    gap:3px !important;
    font-size:clamp(11px,1.05vw,14px) !important;
    line-height:1.2 !important;
    color:#fff !important;
  }
}
