/* Zamax Website .88 — visual conversion coherence and relevant imagery.
   This sheet is loaded after every accepted predecessor stylesheet. It fixes
   only owner-reviewed visual defects; routes, forms and runtime behaviour are
   deliberately unchanged. */

:root {
  --zmx88-ink: #102520;
  --zmx88-green: #0b443c;
  --zmx88-green-deep: #062f2a;
  --zmx88-teal: #1f766a;
  --zmx88-gold: #d2a653;
  --zmx88-cream: #f5efe0;
  --zmx88-paper: #fffdf8;
  --zmx88-final-cta-desktop: 620px;
  --zmx88-final-cta-mobile: 500px;
}

/* Detail-page vendor CSS contains unscoped details/summary rules. Reset only
   the shared navigation disclosure so FAQ styling remains route-authored. */
.zmx-global-nav .zmx-global-nav-group {
  position: relative !important;
  width: auto !important;
  min-height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.zmx-global-nav .zmx-global-nav-group > summary {
  min-height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(16,35,32,.82) !important;
  font: inherit !important;
  line-height: 1.15 !important;
}
.zmx-global-nav .zmx-global-nav-menu {
  width: 228px !important;
  min-width: 228px !important;
  max-width: min(300px, calc(100vw - 32px)) !important;
  gap: 2px !important;
  padding: 6px !important;
  border-radius: 14px !important;
}
.zmx-global-nav .zmx-global-nav-menu a {
  min-height: 36px !important;
  padding: 8px 10px !important;
  border-radius: 9px !important;
  font-size: .86rem !important;
  line-height: 1.24 !important;
}

/* The accepted light mark is alpha-cropped as a build asset so its visible
   geometry—not a transparent square canvas—sets the footer scale. */
.zmx-global-footer__identity {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
}
.zmx-global-footer__logo,
body[data-zmx-route="/about/"] .zmx-global-footer__logo {
  width: min(220px, 100%) !important;
  max-width: 220px !important;
  height: auto !important;
  max-height: none !important;
  display: block !important;
  margin: 0 auto 20px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  object-fit: contain !important;
  filter: none !important;
  box-shadow: none !important;
}

/* Non-hero headings have an editorial scale. True route heroes are excluded. */
body:not([data-zmx-audience="residential"]) main :is(section,article,aside):not(.hero):not(.solution-hero):not(.service-hero):not(.about-hero) h2 {
  font-size: clamp(1.9rem, 2.9vw, 2.85rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  text-wrap: balance;
}
/* Owner-approved homepage straddle: do not let the general editorial cap
   enlarge or reflow this already-balanced Specialist heading. */
body[data-zmx-route="/"] main .hero-wrap .specialist-copy h2 {
  max-width: 100% !important;
  font-size: clamp(1.45rem,2.7vw,2.3rem) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}
body:not([data-zmx-audience="residential"]) main :is(.card,.visual-card,.scenario-card,.scope-card,.site-card,.proof-card) h3 {
  font-size: clamp(1.08rem, 1.45vw, 1.48rem) !important;
  line-height: 1.18 !important;
  letter-spacing: -.018em !important;
  text-wrap: balance;
}
body:not([data-zmx-audience="residential"]) main :is(.cta-band,.final-card,.about-final-content,.roofing-decision-copy,.avoid-copy) h2 {
  max-width: 24ch !important;
  margin-inline: auto !important;
  font-size: clamp(1.9rem, 2.65vw, 2.55rem) !important;
  line-height: 1.1 !important;
}

/* Plain, calm process grammar. Scope icons are intentionally excluded. */
body:not([data-zmx-audience="residential"]) main :is(.process-no,.step-no,.process-number,.about-audience-number) {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: var(--zmx88-gold) !important;
  box-shadow: none !important;
  font-size: clamp(1.7rem, 2.5vw, 2.3rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
}
body:not([data-zmx-audience="residential"]) main .process-no {
  font-size: clamp(.85rem,1.05vw,1.2rem) !important;
  letter-spacing: .08em !important;
}
body:is(
  [data-zmx-route="/solutions/commercial-unit-income-upgrade/"],
  [data-zmx-route="/solutions/solar-ready-roof-power/"],
  [data-zmx-route="/solutions/commercial-property-protection-plan/"]
) main .scenario-card .num,
body[data-zmx-route="/referrals/"] main .card .icon {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: var(--zmx88-gold) !important;
  box-shadow: none !important;
  font-size: clamp(.9rem,1.05vw,1.2rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
}
/* RoofLife's compact 01-02 decisions are labels, not display numerals. */
body[data-zmx-route="/solutions/rooflife/"] main .num {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--zmx88-gold) !important;
  box-shadow: none !important;
  font-size: clamp(1.05rem,1.45vw,1.35rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
}
body:not([data-zmx-audience="residential"]) main .zmx88-scope-card--media .scope-icon {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: block !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--zmx88-gold) !important;
  font-size: clamp(1.55rem,2.2vw,2.05rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
body[data-zmx-route="/referrals/"] #main-content #who .section-head {
  max-width: 820px !important;
  display: block !important;
  margin-inline: auto !important;
  text-align: center !important;
}
body[data-zmx-route="/referrals/"] #main-content #who .section-head p { margin-inline: auto !important; }
body[data-zmx-route="/referrals/"] #main-content #who .card { text-align: center !important; }
body[data-zmx-route="/referrals/"] #main-content #who .card .icon {
  margin: 0 auto 13px !important;
  color: var(--zmx88-gold) !important;
  font-size: clamp(.9rem, 1.05vw, 1.2rem) !important;
}

/* The Focused Property Review keeps every price/credit fact but uses the
   available desktop width rather than producing an unnecessarily tall void. */
body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream > .zmx-dot82-shell {
  display: grid !important;
  grid-template-columns: minmax(250px,.62fr) minmax(520px,1.38fr) !important;
  align-items: center !important;
  gap: clamp(28px,4vw,64px) !important;
}
body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-heading { margin: 0 !important; }
body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card--compact {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(220px,.78fr) minmax(300px,1.22fr) !important;
  column-gap: 28px !important;
  align-items: center !important;
}
body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card__visual {
  grid-column: 1 !important;
  grid-row: 1 / span 6 !important;
  min-height: 330px !important;
  margin: 0 !important;
}
body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card--compact > :not(.zmx-dot82-card__visual) { grid-column: 2 !important; }

/* Four solution details finish with one photographic Zamax treatment. Their
   praised gradients remain available in the preceding decision modules. */
body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) .final-cta {
  min-height: var(--zmx88-final-cta-desktop) !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: clamp(76px,8vw,106px) 0 !important;
  background-color: var(--zmx88-green-deep) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}
body[data-zmx-route="/solutions/commercial-unit-income-upgrade/"] .final-cta {
  background-image: linear-gradient(rgba(4,29,26,.62),rgba(4,29,26,.86)),url("/assets/images/07_income_upgrade_commercial_outcome.webp") !important;
}
body[data-zmx-route="/solutions/rooflife/"] .final-cta {
  background-image: linear-gradient(rgba(4,29,26,.58),rgba(4,29,26,.86)),url("/assets/images/commercial-rooflife-final-maintained-property-dot88-r1.webp") !important;
}
body[data-zmx-route="/solutions/solar-ready-roof-power/"] .final-cta {
  background-image: linear-gradient(rgba(4,29,26,.58),rgba(4,29,26,.86)),url("/assets/images/01_homepage_hero_commercial_property.webp") !important;
}
body[data-zmx-route="/solutions/commercial-property-protection-plan/"] .final-cta {
  background-image: linear-gradient(rgba(4,29,26,.58),rgba(4,29,26,.86)),url("/assets/images/commercial-protection-final-maintained-property-dot88-r1.webp") !important;
}
body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) .final-cta .container {
  width: min(980px,calc(100% - 40px)) !important;
  margin-inline: auto !important;
}
body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) .final-cta .final-card {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  text-align: center !important;
}
body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) .final-cta .final-card :is(h2,p) { margin-inline: auto !important; color: inherit !important; }

/* RoofLife keeps the full decision story while consolidating eleven competing
   cards into two decisions, one assessment list and one linear three-step rail. */
body[data-zmx-route="/solutions/rooflife/"] .scenario-grid {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(16,37,32,.1) !important;
  border-radius: 28px !important;
  background: linear-gradient(145deg,#fffdf8 0%,#f1e7d2 100%) !important;
}
body[data-zmx-route="/solutions/rooflife/"] .scenario-card {
  border: 0 !important;
  border-radius: 18px !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-zmx-route="/solutions/rooflife/"] .scenario-card + .scenario-card { border-left: 1px solid rgba(16,37,32,.1) !important; }
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-scenarios ul,
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list {
  margin: 16px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: grid !important;
  gap: 10px !important;
}
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-scenarios li,
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list li {
  position: relative;
  padding-left: 22px !important;
  color: inherit;
}
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-scenarios li::before,
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--zmx88-gold);
  font-weight: 900;
}
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  align-content: center !important;
}
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list strong {
  display: block;
  margin-bottom: 3px;
  color: var(--zmx88-ink);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body[data-zmx-route="/solutions/rooflife/"] .process-timeline,
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps {
  gap: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  padding: 10px !important;
  border: 1px solid rgba(210,166,83,.24) !important;
  border-radius: 28px !important;
  background: #0b443c !important;
}
body[data-zmx-route="/solutions/rooflife/"] .timeline-step,
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps li {
  border: 0 !important;
  border-radius: 18px !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
  padding: 22px !important;
}
body[data-zmx-route="/solutions/rooflife/"] :is(.timeline-step + .timeline-step,.zmx88-rooflife-steps li + li) { border-left: 1px solid rgba(255,255,255,.12) !important; }
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps .num { color: #f0d58a !important; }
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps h3 { margin: 0 0 8px !important; color: #fff !important; }
body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps p { margin: 0 !important; color: rgba(255,255,255,.76) !important; }
body[data-zmx-route="/solutions/rooflife/"] :is(.real-roof-frame,.difference-photo) img,
body[data-zmx-route="/solutions/solar-ready-roof-power/"] .real-energy-frame img,
body[data-zmx-route="/solutions/commercial-property-protection-plan/"] .real-protection-frame img,
body[data-zmx-route="/services/renewables-ev-charging/"] .site-card-media img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

/* One service-entry geometry and one circled-check grammar. */
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) :is(.electrical-start-section,.roof-start-section,.energy-start-section) .requirement-strip {
  display: grid !important;
  grid-template-columns: minmax(250px,.68fr) minmax(480px,1.32fr) !important;
  align-items: center !important;
  gap: 28px !important;
  padding: 30px !important;
  border-radius: 30px !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .requirement-routes {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 12px !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .requirement-routes button {
  min-height: 82px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding: 15px !important;
  font-size: .86rem !important;
  line-height: 1.32 !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) :is(.hero-checklist-note,.final-checklist-note) {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 12px !important;
  font-size: .84rem !important;
  line-height: 1.4 !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) :is(.hero-checklist-note,.final-checklist-note)::before {
  content: "✓" !important;
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  display: inline-grid !important;
  place-items: center !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: rgba(210,166,83,.22) !important;
  color: #f1d98e !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-grid--media {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  align-items: stretch !important;
  gap: 18px !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card--media {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  padding: 0 !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card__media {
  width: 100% !important;
  height: 190px !important;
  flex: 0 0 190px !important;
  margin: 0 !important;
  overflow: hidden !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card__media img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card__body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 22px !important;
}
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card__body ul { margin-top: auto !important; }

/* One coherent close height across Commercial services/details and the
   already-photographic solution/about/resource/referral families. */
body[data-zmx-route="/services/"] .final,
body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .final-cta {
  min-height: var(--zmx88-final-cta-desktop) !important;
}
body[data-zmx-route="/"] .final-cta,
body[data-zmx-route="/"] .final-cta .cta-box {
  min-height: var(--zmx88-final-cta-desktop) !important;
}

/* Commercial Resources, About and Referrals use full-width centred closes
   and a visible paper pause before the footer. */
body[data-zmx-route="/resources/"] #main-content > section:last-child,
body[data-zmx-route="/about/"] .about-final-cta,
body[data-zmx-route="/referrals/"] #main-content > .cta-band {
  width: 100% !important;
  max-width: none !important;
  min-height: var(--zmx88-final-cta-desktop) !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 0 clamp(54px,6vw,86px) !important;
  padding: clamp(76px,8vw,104px) 0 !important;
  border-radius: 0 !important;
  background-position: center !important;
  background-size: cover !important;
}
body[data-zmx-route="/resources/"] #main-content > section:last-child { padding-inline: 0 !important; }
body[data-zmx-route="/resources/"] #main-content > section:last-child > .wrap,
body[data-zmx-route="/resources/"] #main-content > section:last-child > .container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body[data-zmx-route="/resources/"] .cta-band {
  width: 100% !important;
  min-height: var(--zmx88-final-cta-desktop) !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-content: center !important;
  justify-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: clamp(70px,8vw,104px) max(24px,calc((100vw - 980px)/2)) !important;
  text-align: center !important;
}
body[data-zmx-route="/resources/"] .cta-band :is(h2,p) { margin-inline: auto !important; }
body[data-zmx-route="/resources/"] .cta-band .cta-actions { display: flex !important; justify-content: center !important; gap: 12px !important; }
body[data-zmx-route="/about/"] .about-final-cta { background: var(--zmx88-green-deep) !important; }
body[data-zmx-route="/about/"] .about-final-cta > .about-container { width: 100% !important; max-width: none !important; margin: 0 !important; }
body[data-zmx-route="/about/"] .about-final-card {
  width: 100% !important;
  min-height: var(--zmx88-final-cta-desktop) !important;
  border-radius: 0 !important;
  background-image: linear-gradient(rgba(4,29,26,.48),rgba(4,29,26,.86)),url("/assets/images/commercial-about-adviser-close-dot88-r1.webp") !important;
  background-position: center !important;
  background-size: cover !important;
}
body[data-zmx-route="/about/"] .about-final-content { margin-inline: auto !important; text-align: center !important; }
body[data-zmx-route="/about/"] .about-audience-section .about-section-head { max-width: 980px !important; }
body[data-zmx-route="/about/"] .about-audience-section .about-section-head h2 { max-width: 24ch !important; margin-inline: auto !important; }
body:not([data-zmx-audience="residential"]) main :is(.final-cta,.final,.cta-band,.about-final-content) h2 {
  max-width: 28ch !important;
  font-size: clamp(1.85rem,2.35vw,2.35rem) !important;
}
body[data-zmx-route="/about/"] .about-proof-cta { justify-content: center !important; text-align: center !important; }
body[data-zmx-route="/about/"] .about-proof-cta .primary-btn { order: 1; }
body[data-zmx-route="/about/"] .about-proof-pills { order: 2; flex: 1 1 100% !important; justify-content: center !important; }
body[data-zmx-route="/about/"] :is(.about-intro-band,.about-route-section) {
  background: linear-gradient(145deg,#fffdf8 0%,#f3ead8 52%,#e8f1eb 100%) !important;
}
body[data-zmx-route="/referrals/"] #main-content > .cta-band {
  background-image: linear-gradient(rgba(4,29,26,.62),rgba(4,29,26,.88)),url("/assets/images/06_referral_property_review.webp") !important;
}
body[data-zmx-route="/referrals/"] #main-content > .cta-band > .wrap { width: min(940px,calc(100% - 40px)) !important; }
body[data-zmx-route="/referrals/"] #main-content > .cta-band .cta-box {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  flex-direction: column !important;
  text-align: center !important;
}
body[data-zmx-route="/referrals/"] #main-content > .cta-band .cta-box :is(h2,p) { margin-inline: auto !important; }

/* Commercial guide cards share one media/action baseline without pretending
   that a guide has already been delivered. */
body[data-zmx-route="/resources/"] .zmx-dot85-resource-grid { align-items: stretch !important; }
body[data-zmx-route="/resources/"] .zmx-dot85-resource-card {
  min-height: 540px !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-zmx-route="/resources/"] .zmx-dot85-resource-card > :last-child { margin-top: auto !important; }

/* Residential: keep heroes, offers and reviews. Supporting typography and
   card geometry now follow the same calm Zamax system. */
body[data-zmx-audience="residential"] .zmx-res-section-heading h2 {
  max-width: 24ch !important;
  font-size: clamp(1.9rem,3.1vw,3rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}
body[data-zmx-audience="residential"] :is(.zmx-res-card,.zmx-res-guide-card,.zmx-res-caution,.zmx-res-decision-note) h3 {
  font-size: clamp(1.08rem,1.8vw,1.55rem) !important;
  line-height: 1.18 !important;
  text-wrap: balance;
}
body[data-zmx-audience="residential"] .zmx-res-process li > span,
body[data-zmx-audience="residential"] .zmx-res-card__number {
  font-size: clamp(1.55rem,2.6vw,2.25rem) !important;
  letter-spacing: -.035em !important;
}
body[data-zmx-audience="residential"] .zmx-res-benefit-pills {
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: stretch !important;
  gap: 10px !important;
}
body[data-zmx-audience="residential"] .zmx-res-benefit-pills li {
  width: auto !important;
  min-height: 42px !important;
  flex: 1 1 150px !important;
  justify-content: center !important;
  text-align: center !important;
}
.zmx-res-card__media {
  height: 168px;
  margin: -1px -1px 22px;
  overflow: hidden;
  border-radius: inherit;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.zmx-res-card__media img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: var(--zmx-res-card-image-position,center); }
body[data-zmx-audience="residential"] .zmx-res-service-card-grid .zmx-res-card { overflow: hidden; padding-top: 0 !important; }
body[data-zmx-audience="residential"] .zmx-res-service-card-grid {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  align-items: stretch !important;
}
body[data-zmx-audience="residential"] .zmx-res-service-card-grid .zmx-res-card--with-media {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-zmx-audience="residential"] .zmx-res-service-card-grid .zmx-res-card > :not(.zmx-res-card__media) { margin-inline: 22px; }
body[data-zmx-audience="residential"] .zmx-res-service-card-grid .zmx-res-card > :last-child { margin-bottom: 24px; }

body[data-zmx-audience="residential"] .zmx-res-home-paths { align-items: stretch !important; }
body[data-zmx-audience="residential"] .zmx-res-home-path {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
}
body[data-zmx-audience="residential"] .zmx-res-home-path > figure { height: 230px !important; flex: 0 0 230px !important; }
body[data-zmx-audience="residential"] .zmx-res-home-path > figure img { width: 100%; height: 100%; object-fit: cover; }
body[data-zmx-audience="residential"] .zmx-res-home-path > .zmx-res-button { margin-top: auto !important; align-self: flex-start !important; }
body[data-zmx-route="/residential/"] .zmx-res-home-path__guide-media { position: relative; overflow: hidden; }
body[data-zmx-route="/residential/"] .zmx-res-home-path__guide-brand {
  position: absolute;
  left: 16px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 999px;
  background: rgba(4,29,26,.84);
  color: #f4d989;
  box-shadow: 0 8px 20px rgba(0,0,0,.22);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .14em;
}
body[data-zmx-route="/residential/"] .zmx-res-home-path__guide-brand img {
  width: 28px !important;
  height: 24px !important;
  object-fit: contain !important;
}

/* Code-native Zamax Guides overlay for every guide thumbnail. */
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__media { position: relative; }
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-grid {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  align-items: stretch !important;
}
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  overflow: hidden !important;
}
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__brand {
  position: absolute;
  left: 16px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 999px;
  background: rgba(4,29,26,.82);
  color: #f4d989;
  box-shadow: 0 8px 20px rgba(0,0,0,.22);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .14em;
}
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__brand img {
  width: 28px !important;
  height: 24px !important;
  object-fit: contain !important;
}
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__media { height: 218px !important; flex: 0 0 218px !important; }
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card__body .zmx-dot86-guide-request { margin-top: auto !important; }

/* Official ONS/OS geography replaces the earlier radial coverage sketch. */
.zmx-res-coverage-map--official svg { width: 100%; height: auto; display: block; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__field { fill: #e9f0e9; stroke: rgba(16,37,32,.14); stroke-width: 2; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__region-shape { fill: #f9f4e7; stroke: #315e56; stroke-width: 2.4; stroke-linejoin: round; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__county-shape { fill: rgba(210,166,83,.52); stroke: #8b641d; stroke-width: 3.2; stroke-linejoin: round; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__place circle { fill: #0b443c; stroke: #fffdf8; stroke-width: 2; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__place text,
.zmx-res-coverage-map--official .zmx-res-coverage-map__north text,
.zmx-res-coverage-map--official :is(.zmx-res-coverage-map__region,.zmx-res-coverage-map__county) {
  fill: #102520;
  font-family: Inter,system-ui,sans-serif;
  font-size: 13px;
  font-weight: 850;
  paint-order: stroke;
  stroke: rgba(255,253,248,.94);
  stroke-width: 4px;
  stroke-linejoin: round;
}
.zmx-res-coverage-map--official .zmx-res-coverage-map__region { font-size: 18px; letter-spacing: .08em; text-transform: uppercase; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__county { fill: #684b16; font-size: 15px; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__north :is(path,text) { stroke: #0b443c; fill: #0b443c; }
.zmx-res-coverage-map--official figcaption { display: grid; gap: 6px; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__place text { display: none !important; }
.zmx-res-coverage-map--official .zmx-res-coverage-map__places {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 8px;
  margin-top: 5px;
}
.zmx-res-coverage-map--official .zmx-res-coverage-map__places span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 3px 10px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px;
  color: #fffdf8;
  font-size: .74rem;
  font-weight: 800;
}
.zmx-res-coverage-map--official .zmx-res-coverage-map__source {
  display: block !important;
  margin-top: 7px;
  color: rgba(255,255,255,.78) !important;
  font-size: .72rem !important;
  line-height: 1.45 !important;
}
.zmx-res-coverage-map--official .zmx-res-coverage-map__source a {
  color: #fffdf8 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

body[data-zmx-audience="residential"] .zmx-res-final-cta {
  min-height: var(--zmx88-final-cta-desktop) !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(78px,8vw,106px) 0 !important;
  background-position: center !important;
  background-size: cover !important;
}
body[data-zmx-audience="residential"] .zmx-res-final-cta > .zmx-res-container {
  width: min(940px,calc(100% - 40px)) !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  gap: 24px !important;
  text-align: center !important;
}
body[data-zmx-audience="residential"] .zmx-res-final-cta :is(h2,p) { margin-inline: auto !important; }
body[data-zmx-audience="residential"] .zmx-res-final-cta .zmx-res-actions { align-items: center !important; justify-content: center !important; }
body[data-zmx-audience="residential"] .zmx-res-final-cta--roofline-gradient {
  background: linear-gradient(rgba(4,29,26,.58),rgba(4,29,26,.84)),url("/assets/residential/res-roofline-final-bungalow-dot84-r1.webp") center/cover no-repeat !important;
}

body[data-zmx-route^="/residential/transformations/"] .zmx-res-guide-gate .zmx-dot86-guide-request,
body[data-zmx-route^="/residential/services/"] .zmx-res-guide-gate .zmx-dot86-guide-request {
  width: fit-content !important;
  border-color: transparent !important;
  background: var(--zmx88-gold) !important;
  color: var(--zmx88-ink) !important;
}

@media (max-width: 980px) {
  body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream > .zmx-dot82-shell,
  body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card--compact,
  body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) :is(.electrical-start-section,.roof-start-section,.energy-start-section) .requirement-strip {
    grid-template-columns: 1fr !important;
  }
  body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card__visual,
  body[data-zmx-route="/solutions/"] .zmx-dot82-context--cream .zmx-dot82-card--compact > :not(.zmx-dot82-card__visual) {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

@media (max-width: 720px) {
  .zmx-global-footer__logo,
  body[data-zmx-route="/about/"] .zmx-global-footer__logo { width: min(200px,72vw) !important; }
  body:not([data-zmx-audience="residential"]) main :is(section,article,aside):not(.hero):not(.solution-hero):not(.service-hero):not(.about-hero) h2,
  body[data-zmx-audience="residential"] .zmx-res-section-heading h2 {
    max-width: 100% !important;
    font-size: clamp(1.72rem,7.6vw,2.25rem) !important;
    line-height: 1.1 !important;
  }
  body[data-zmx-route="/services/"] .final,
  body[data-zmx-route="/"] .final-cta,
  body[data-zmx-route="/"] .final-cta .cta-box,
  body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .final-cta,
  body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) .final-cta,
  body[data-zmx-route="/resources/"] #main-content > section:last-child,
  body[data-zmx-route="/about/"] .about-final-cta,
  body[data-zmx-route="/about/"] .about-final-card,
  body[data-zmx-route="/referrals/"] #main-content > .cta-band,
  body[data-zmx-audience="residential"] .zmx-res-final-cta { min-height: var(--zmx88-final-cta-mobile) !important; }
  body[data-zmx-route="/resources/"] .cta-band { min-height: var(--zmx88-final-cta-mobile) !important; padding-inline: 20px !important; }
  body[data-zmx-route="/resources/"] .cta-band .cta-actions { width: 100%; flex-direction: column !important; align-items: stretch !important; }
  body[data-zmx-route="/resources/"] .cta-band .cta-actions > * { width: 100% !important; }
  body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .requirement-routes { grid-template-columns: 1fr !important; }
  body[data-zmx-route="/solutions/rooflife/"] :is(.scenario-card + .scenario-card,.timeline-step + .timeline-step,.zmx88-rooflife-steps li + li) {
    border-left: 0 !important;
    border-top: 1px solid rgba(16,37,32,.1) !important;
  }
  body[data-zmx-route="/solutions/rooflife/"] .timeline-step + .timeline-step { border-top-color: rgba(255,255,255,.12) !important; }
  body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps li + li { border-top-color: rgba(255,255,255,.14) !important; }
  body[data-zmx-route="/solutions/rooflife/"] .scenario-grid,
  body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-assessment-list,
  body[data-zmx-route="/solutions/rooflife/"] .zmx88-rooflife-steps { grid-template-columns: 1fr !important; }
  body[data-zmx-audience="residential"] .zmx-res-benefit-pills { flex-direction: column !important; }
  body[data-zmx-audience="residential"] .zmx-res-benefit-pills li { width: 100% !important; flex-basis: auto !important; }
  body[data-zmx-audience="residential"] .zmx-res-home-path > figure { height: 200px !important; flex-basis: 200px !important; }
  .zmx-res-card__media { height: 178px; }
  body[data-zmx-route="/residential/guides/"] .zmx-res-guide-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
  }
  body[data-zmx-route="/residential/guides/"] .zmx-res-guide-card {
    width: 100% !important;
    min-width: 0 !important;
  }
  body[data-zmx-audience="residential"] .zmx-res-service-card-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  body[data-zmx-audience="residential"] .zmx-res-service-card-grid .zmx-res-card {
    width: 100% !important;
    min-width: 0 !important;
  }
  body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-grid--media {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
  }
  body[data-zmx-route^="/services/"]:not([data-zmx-route="/services/"]) .zmx88-scope-card--media {
    width: 100% !important;
    min-width: 0 !important;
  }
  .zmx-res-coverage-map--official .zmx-res-coverage-map__place text { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .zmx-global-nav .zmx-global-nav-group > summary::after { transition: none !important; }
}

/* Final owner-review line budget. This is deliberately limited to ordinary
   supporting headings: true route heroes and the approved homepage Specialist
   straddle retain their accepted typography. */
@media (min-width: 721px) {
  body:not([data-zmx-audience="residential"]) main :is(section,article,aside):not(.hero):not(.solution-hero):not(.service-hero):not(.about-hero) h2 {
    max-width: min(38ch,100%) !important;
    font-size: clamp(1.68rem,2.05vw,2.25rem) !important;
    line-height: 1.08 !important;
  }
  body:not([data-zmx-audience="residential"]) main :is(.card,.visual-card,.scenario-card,.scope-card,.site-card,.proof-card) h3 {
    max-width: 100% !important;
    font-size: clamp(1rem,1.2vw,1.26rem) !important;
    line-height: 1.18 !important;
  }
  body:not([data-zmx-audience="residential"]) main :is(.final-cta,.final,.cta-band,.about-final-content,.bottom-cta) h2 {
    max-width: min(36ch,100%) !important;
    font-size: clamp(1.78rem,2.1vw,2.3rem) !important;
  }
  body[data-zmx-route="/"] main .hero-wrap .specialist-copy h2 {
    max-width: 100% !important;
    font-size: clamp(1.45rem,2.7vw,2.3rem) !important;
    line-height: 1 !important;
  }
  body[data-zmx-audience="residential"] main .zmx-res-section-heading h2 {
    max-width: min(38ch,100%) !important;
    font-size: clamp(1.7rem,2.15vw,2.3rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-audience="residential"] main :is(.zmx-res-split,.zmx-res-faq-layout) .zmx-res-section-heading h2 {
    max-width: 100% !important;
    font-size: clamp(1.58rem,1.9vw,2rem) !important;
  }
  body[data-zmx-audience="residential"] main :is(.zmx-res-card,.zmx-res-guide-card,.zmx-res-caution,.zmx-res-decision-note) h3 {
    max-width: 100% !important;
    font-size: clamp(1rem,1.25vw,1.28rem) !important;
  }
  body[data-zmx-audience="residential"] main .zmx-res-final-cta h2 {
    max-width: min(36ch,100%) !important;
    font-size: clamp(1.78rem,2.1vw,2.28rem) !important;
  }
}

/* Exact desktop line-budget closeout for the owner-reviewed supporting
   components. Hero type and the accepted homepage Specialist straddle are
   deliberately outside this block. */
@media (min-width: 721px) {
  body[data-zmx-route="/solutions/"] main .zmx-dot82-context--cream .zmx-dot82-heading h2 {
    max-width: 100% !important;
    font-size: clamp(1.5rem,1.85vw,1.75rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) main .value-signal h3 {
    max-width: 100% !important;
    font-size: clamp(1.4rem,1.7vw,1.7rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) main .avoid-wrap {
    grid-template-columns: .9fr 1.1fr !important;
  }
  body[data-zmx-route^="/solutions/"]:not([data-zmx-route="/solutions/"]) main .avoid-copy h2 {
    max-width: 100% !important;
    font-size: clamp(1.38rem,1.65vw,1.5rem) !important;
    line-height: 1.08 !important;
  }
  body:is(
    [data-zmx-route="/solutions/commercial-unit-income-upgrade/"],
    [data-zmx-route="/solutions/rooflife/"],
    [data-zmx-route="/solutions/solar-ready-roof-power/"]
  ) main .avoid-wrap {
    grid-template-columns: 1.15fr .85fr !important;
  }
  body:is(
    [data-zmx-route="/solutions/commercial-unit-income-upgrade/"],
    [data-zmx-route="/solutions/rooflife/"],
    [data-zmx-route="/solutions/solar-ready-roof-power/"]
  ) main .avoid-copy h2 {
    max-width: 100% !important;
    font-size: clamp(1.25rem,1.45vw,1.35rem) !important;
  }
  body[data-zmx-route="/solutions/commercial-property-protection-plan/"] main .scenario-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  body[data-zmx-route="/solutions/commercial-property-protection-plan/"] main .difference-copy h3 {
    max-width: 100% !important;
    font-size: clamp(1.5rem,1.9vw,1.75rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-route="/resources/"] main .zmx-dot85-resource-card h3 {
    max-width: 100% !important;
    font-size: clamp(1.08rem,1.45vw,1.35rem) !important;
    line-height: 1.18 !important;
  }
  body[data-zmx-route="/about/"] main .about-audience-grid article h3 {
    max-width: 100% !important;
    font-size: 1.125rem !important;
    line-height: 1.16 !important;
  }
  body[data-zmx-route="/about/"] main .about-audience-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  body:is([data-zmx-route="/residential/"],[data-zmx-route="/residential/transformations/"],[data-zmx-route="/residential/guides/"]) main .zmx-dot82-heading h2 {
    max-width: min(38ch,100%) !important;
    font-size: clamp(1.75rem,2.35vw,2.25rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-route="/residential/"] main .zmx-res-service-tiles h3 {
    max-width: 100% !important;
    font-size: clamp(1.05rem,1.2vw,1.18rem) !important;
    line-height: 1.18 !important;
  }
  body[data-zmx-route="/residential/"] main .zmx-res-area-layout .zmx-res-section-heading h2 {
    max-width: 100% !important;
    font-size: clamp(1.65rem,2vw,2rem) !important;
    line-height: 1.08 !important;
  }
  body[data-zmx-route="/residential/about/"] main .zmx-res-approach-panel h3 {
    max-width: 100% !important;
    font-size: clamp(1.3rem,1.7vw,1.5rem) !important;
    line-height: 1.12 !important;
  }
}


/* The Solutions overview already owns a functional bottom CTA. Its visual
   treatment is now a full-width, centred photographic close rather than a
   nested gradient card. */
body[data-zmx-route="/solutions/"] .bottom-cta {
  width: 100% !important;
  max-width: none !important;
  min-height: var(--zmx88-final-cta-desktop) !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 0 clamp(54px,6vw,86px) !important;
  padding: clamp(76px,8vw,104px) 0 !important;
  background: linear-gradient(rgba(4,29,26,.5),rgba(4,29,26,.86)),url("/assets/images/commercial-solutions-final-coordinated-campus-dot88-r1.webp") center/cover no-repeat !important;
}
body[data-zmx-route="/solutions/"] .bottom-cta > .wrap { width: min(940px,calc(100% - 40px)) !important; }
body[data-zmx-route="/solutions/"] .bottom-cta .cta-box {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  text-align: center !important;
}
body[data-zmx-route="/solutions/"] .bottom-cta .cta-box :is(h2,p) { margin-inline: auto !important; color: inherit !important; }

@media (max-width: 720px) {
  body:not([data-zmx-audience="residential"]) main :is(section,article,aside):not(.hero):not(.solution-hero):not(.service-hero):not(.about-hero) h2,
  body[data-zmx-audience="residential"] main .zmx-res-section-heading h2,
  body[data-zmx-audience="residential"] main .zmx-res-final-cta h2 {
    max-width: 100% !important;
    font-size: clamp(1.55rem,6.45vw,2rem) !important;
    line-height: 1.12 !important;
  }
  body:not([data-zmx-audience="residential"]) main h3,
  body[data-zmx-audience="residential"] main h3 {
    max-width: 100% !important;
    font-size: clamp(1rem,4.7vw,1.24rem) !important;
    line-height: 1.2 !important;
  }
  body[data-zmx-route="/solutions/"] .bottom-cta {
    min-height: var(--zmx88-final-cta-mobile) !important;
    padding: 64px 0 80px !important;
  }
}