/* Calderas reuses the home layout and CTA rules. Only service-specific additions live here. */
.boiler-approved .boiler-photo{height:auto;aspect-ratio:1536/1024}
.boiler-approved .photo-decision{background:#03274c}
.boiler-approved .boiler-photo img{width:100%;height:auto;display:block}
.boiler-approved .approved-hero-photo>.boiler-photo{height:auto;aspect-ratio:1536/1024}
.boiler-approved .approved-hero-photo:after{background:linear-gradient(90deg,#f4faff 0%,#f4fafff5 44%,#f4faffc7 52%,transparent 63%)}
.boiler-approved .approved-hero-copy{width:54%}
.boiler-approved .approved-hero-copy h1{font-size:55px}
.boiler-approved .approved-hero-copy>.lead{max-width:455px}
.boiler-approved .approved-rail .equipment-rail{grid-template-columns:repeat(5,minmax(0,1fr))}
.boiler-approved .breadcrumbs{width:100%;margin:18px 0;font-size:14px}
.boiler-approved .consultation-band:has(>.photo-boiler-banner) .banner-copy{margin-left:30%;width:70%;padding:26px 30px}
.boiler-approved .consultation-band .banner-copy h2{max-width:none}
.boiler-approved .boiler-faults .service-link{background:#fff;border:1px solid #005295;color:#002b64}
.boiler-repair .journey-blue-cta{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;min-height:68px;margin-top:22px;padding:16px 24px;border:1px solid #45b2ef;border-radius:13px;background:linear-gradient(110deg,#064477,#0064ae);box-shadow:0 8px 24px #0050922b;color:white;font-size:20px;font-weight:700;line-height:1.25;text-decoration:none}
.boiler-repair .journey-blue-cta>span{flex:1}
.boiler-repair .journey-blue-cta>svg{width:28px;height:28px;flex:none}
.boiler-repair .journey-blue-cta:hover,.boiler-repair .journey-blue-cta:focus-visible{background:#05335f;outline:2px solid #9bd9ff;outline-offset:2px}
.boiler-approved .editorial-split>.boiler-photo{width:100%;height:auto;aspect-ratio:1536/1024;align-self:center}
.boiler-index{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
.boiler-index a,.boiler-related a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid #d5e5f2;border-radius:9px;background:white;font-size:16px;min-height:46px;color:#07558d}
.boiler-index svg,.boiler-related svg{width:18px;height:18px}
.boiler-information{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.boiler-information>section{padding:25px;background:linear-gradient(white,#f1f8fd);border:1px solid #dfedf6;border-radius:14px}
.boiler-information h2{font-size:28px;line-height:1.16}
.boiler-information h3{font-size:22px;line-height:1.25;margin-top:20px}
.boiler-information p{font-size:18px;line-height:1.6;margin-top:16px}
.boiler-information a{color:#07558d;text-decoration:underline;text-underline-offset:3px}
.boiler-related{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:15px 0 30px}
.boiler-approved .boiler-review .review-card{padding:25px}
.boiler-sources .sources{padding:24px;margin:24px 0}
.boiler-sources h2{font-size:24px}.boiler-sources a{font-size:16px}
@media(max-width:767px){
 .reference-canvas .boiler-repair .journey-blue-cta{font-size:calc(17px / var(--reference-scale));min-height:calc(60px / var(--reference-scale));padding:calc(13px / var(--reference-scale));gap:calc(10px / var(--reference-scale));margin-top:calc(18px / var(--reference-scale))}
 .reference-canvas .boiler-repair .journey-blue-cta>svg{width:calc(23px / var(--reference-scale));height:calc(23px / var(--reference-scale))}
 /* Compensate the approved reference canvas scale for copy only; CTA rules stay unchanged. */
 .reference-canvas .boiler-approved .sequence-banner .banner-copy h2{font-size:calc(21px / var(--reference-scale));line-height:1.18}
 .reference-canvas .boiler-approved .sequence-banner .banner-copy p{font-size:calc(16px / var(--reference-scale));line-height:1.45}
 .reference-canvas .boiler-approved .sequence-banner .banner-copy .eyebrow{font-size:calc(10px / var(--reference-scale));line-height:1.4;letter-spacing:.08em}
 /* Expand the touch target, not the approved visual button. The reference canvas scales CSS pixels. */
 .boiler-repair .sequence-banner .action,.boiler-repair .sequence-banner .button-link{position:relative}
 .boiler-repair .sequence-banner .action::before,.boiler-repair .sequence-banner .button-link::before{content:"";position:absolute;left:0;top:50%;width:100%;height:max(100%,calc(44px / var(--reference-scale)));transform:translateY(-50%)}
 /* More readable copy needs more height; keep the complete photo at its own ratio. */
 .reference-canvas .boiler-approved .sequence-banner>.ref-photo{height:auto;aspect-ratio:var(--photo-ratio);top:50%;bottom:auto;transform:translateY(-50%)}
 /* Keep the final unpaired card readable across both mobile columns. */
 .boiler-approved .boiler-services>.sequence-card:last-child:nth-child(odd),
 .boiler-approved .boiler-faults>.sequence-card:last-child:nth-child(odd){grid-column:1 / -1;display:grid;grid-template-columns:1fr 1.25fr;align-items:center;gap:calc(8px / var(--reference-scale))}
 .reference-canvas .boiler-approved .approved-hero-copy{width:61%}
 .reference-canvas .boiler-approved .approved-hero-copy h1{font-size:calc(26px / var(--reference-scale))}
 .reference-canvas .boiler-approved .approved-hero-photo,.reference-canvas .boiler-approved .approved-hero-photo>.boiler-photo{aspect-ratio:1536/1024;height:auto}
 .boiler-approved .breadcrumbs{font-size:calc(12px / var(--reference-scale));margin:calc(10px / var(--reference-scale)) 0}
 .reference-canvas .boiler-approved .editorial-split>.boiler-photo{max-width:none}
 .boiler-approved .boiler-index,.boiler-approved .boiler-information{grid-template-columns:1fr;gap:calc(12px / var(--reference-scale))}
 .boiler-index a,.boiler-related a{font-size:var(--read-small);min-height:var(--tap);padding:calc(10px / var(--reference-scale))}
 .boiler-information>section{padding:calc(18px / var(--reference-scale))}
 .boiler-information h2{font-size:calc(21px / var(--reference-scale));line-height:1.2}
 .boiler-information h3{font-size:calc(18px / var(--reference-scale));line-height:1.3;margin-top:calc(20px / var(--reference-scale))}
 .boiler-information p{font-size:var(--read-body);line-height:1.5}
 .boiler-approved .boiler-review .review-card{padding:calc(18px / var(--reference-scale))}
 .boiler-review .text-link{font-size:var(--read-small);min-height:var(--tap)}
 .boiler-sources h2{font-size:calc(19px / var(--reference-scale))}.boiler-sources a{font-size:var(--read-small)}
 .boiler-approved .sequence>.text-link{font-size:var(--read-small);min-height:var(--tap)}
}
/* Exact mobile header rules from the approved home, scoped to this service. */
@media(max-width:520px){
 body:has(.boiler-approved) .utility-bar>.wrap{min-height:34px;padding-block:4px;gap:12px}
 body:has(.boiler-approved) .utility-bar{font-size:10px}
 body:has(.boiler-approved) .utility-bar small{font-size:9px}
 body:has(.boiler-approved) .utility-bar svg{width:17px;height:17px}
 body:has(.boiler-approved) .header-inner{min-height:64px;gap:8px}
 body:has(.boiler-approved) .header-inner .brand{display:flex;align-items:center;gap:6px;flex:1}
 body:has(.boiler-approved) .header-inner .brand-name{font-size:24px;letter-spacing:-.04em}
 body:has(.boiler-approved) .header-inner .brand-descriptor{font-size:9px;line-height:1.1;padding:0;max-width:77px}
 body:has(.boiler-approved) .menu-toggle{margin-left:0;width:32px;padding:0}
 body:has(.boiler-approved) .header-actions .action{width:40px;height:40px;min-height:40px;flex-basis:40px}
 body:has(.boiler-approved) .header-actions .actions{gap:5px}
}

/* Catalogue additions are isolated from the approved home and contact bands. */
.boiler-catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.reference-canvas .boiler-product{padding:22px;border:1px solid #d8e7f2;box-shadow:0 8px 24px #00365c08}
.boiler-product-heading{display:flex;align-items:center;gap:18px}
.boiler-product-heading img{width:150px;height:190px;object-fit:contain;flex-shrink:0}
.boiler-product-heading .eyebrow{font-size:10px;letter-spacing:.1em;margin-bottom:8px}
.reference-canvas .boiler-product h3{font-size:25px;line-height:1.16}
.reference-canvas .boiler-product-heading p{font-size:14px;line-height:1.45}
.boiler-price{padding:20px 0;border-top:1px solid #e1edf5;margin-top:18px;display:flex;flex-direction:column;align-items:flex-start}
.boiler-price>span{font-size:16px;color:#07558d}
.boiler-price>strong{font-size:40px;line-height:1.2;letter-spacing:-.035em;color:#092b50}
.reference-canvas .boiler-price p{font-size:14px;line-height:1.5;margin:10px 0 0}
.boiler-variants{border:1px solid #d8e7f2;border-radius:10px;background:white;overflow:hidden}
.boiler-variants>summary{cursor:pointer;padding:16px;font-size:16px;color:#07558d;font-weight:700;min-height:48px}
.boiler-variant{padding:18px;border-top:1px solid #d8e7f2}
.boiler-variant h4{font-size:18px;line-height:1.3;margin:0 0 12px}
.boiler-variant dl{margin:0 0 16px;font-size:15px}
.boiler-variant dl>div{display:flex;justify-content:space-between;gap:12px;padding:5px 0}
.boiler-variant dd{margin:0;white-space:nowrap}
.boiler-variant .variant-total{font-weight:700;font-size:17px;border-top:1px solid #d8e7f2;margin-top:7px;padding-top:10px}
.boiler-variant .service-link{width:100%;background:#07558d;color:white}
.boiler-installation-terms,.boiler-maintenance-offer{padding:24px!important;margin-top:20px;border:1px solid #d8e7f2;background:linear-gradient(white,#eff7fd);border-radius:14px}
.boiler-installation-terms h3{font-size:26px}.boiler-installation-terms p,.boiler-maintenance-offer>p{font-size:17px;line-height:1.5;margin-top:12px}
.boiler-installation-terms .catalog-date{font-size:14px;color:#35516b}
.boiler-maintenance-offer>.service-link{margin-top:18px;max-width:400px;background:#07558d;color:white;min-height:48px}
@media(max-width:767px){
 .boiler-catalog-grid{grid-template-columns:1fr;gap:calc(16px / var(--reference-scale))}
 .reference-canvas .boiler-product{padding:calc(18px / var(--reference-scale))}
 .boiler-product-heading{gap:calc(15px / var(--reference-scale))}
 .boiler-product-heading img{width:calc(150px / var(--reference-scale));height:calc(190px / var(--reference-scale))}
 .boiler-product-heading .eyebrow{font-size:calc(10px / var(--reference-scale))}
 .reference-canvas .boiler-product h3{font-size:calc(22px / var(--reference-scale))}
 .reference-canvas .boiler-product-heading p,.reference-canvas .boiler-price p{font-size:calc(14px / var(--reference-scale))}
 .boiler-price>span,.boiler-variants>summary{font-size:var(--read-body)}
 .boiler-price>strong{font-size:calc(36px / var(--reference-scale))}
 .boiler-price{padding:calc(15px / var(--reference-scale)) 0;margin-top:calc(14px / var(--reference-scale))}
 .boiler-variants>summary{padding:calc(14px / var(--reference-scale));min-height:var(--tap)}
 .boiler-variant{padding:calc(15px / var(--reference-scale))}
 .boiler-variant h4,.boiler-variant .variant-total{font-size:calc(17px / var(--reference-scale))}
 .boiler-variant dl{font-size:calc(15px / var(--reference-scale))}
 .boiler-variant .service-link,.boiler-maintenance-offer>.service-link{font-size:var(--read-body);min-height:var(--tap);padding:calc(12px / var(--reference-scale));max-width:none}
 .boiler-installation-terms,.boiler-maintenance-offer{padding:calc(18px / var(--reference-scale))!important}
 .boiler-installation-terms h3{font-size:calc(21px / var(--reference-scale))}
 .boiler-installation-terms p,.boiler-maintenance-offer>p{font-size:var(--read-body)}
 .boiler-installation-terms .catalog-date{font-size:var(--read-small)}
}

/* Dedicated sales page intro; catalogue cards and shared contact controls stay intact. */
.catalog-page-intro{padding:28px 18px 20px}
.catalog-page-intro>.color-stripe{display:block;width:170px;margin-bottom:20px}
.catalog-page-intro h1{font-size:46px;line-height:1.1;letter-spacing:-.035em;color:#092b50;max-width:800px}
.catalog-page-intro>p{font-size:20px;line-height:1.45;margin:18px 0 22px;max-width:750px}
.catalog-page-intro>.actions{max-width:650px}
.catalog-page-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.catalog-page-nav a{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid #d5e5f2;border-radius:9px;background:white;font-size:16px;min-height:46px;color:#07558d}
.catalog-page-nav svg{width:18px;height:18px}
@media(max-width:767px){
 .catalog-page-intro{padding:calc(20px / var(--reference-scale)) calc(10px / var(--reference-scale))}
 .catalog-page-intro h1{font-size:calc(28px / var(--reference-scale))}
 .catalog-page-intro>p{font-size:var(--read-body);margin:calc(16px / var(--reference-scale)) 0}
 .catalog-page-intro>.actions{max-width:none}
 .catalog-page-intro>.actions .action{font-size:var(--read-body);min-height:var(--tap);padding:calc(12px / var(--reference-scale))}
 .catalog-page-intro>.actions .action svg{width:calc(22px / var(--reference-scale));height:calc(22px / var(--reference-scale))}
 .catalog-page-nav{gap:calc(8px / var(--reference-scale))}
 .catalog-page-nav a{font-size:var(--read-small);min-height:var(--tap);padding:calc(10px / var(--reference-scale))}
}

/* Keep the expanded diagnostic case readable without stretching a neighbouring card. */
.boiler-information>section:has(.repair-case-heading){grid-column:1 / -1}

/* Give the four parent service heroes a real mobile layout while the approved
   941px reference canvas continues to govern the rest of each page. */
@media(max-width:767px){
 .reference-canvas .boiler-repair:not(.thermal-local)>.approved-hero{
  zoom:calc(1 / var(--reference-scale,1));width:100vw;height:auto;min-height:0;
  display:flex;flex-direction:column;overflow:hidden
 }
 .reference-canvas .boiler-repair:not(.thermal-local)>.approved-hero>.wrap{
  order:-1;width:100%;height:auto;min-height:0;padding:28px 15px 25px
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-copy{width:100%;max-width:none}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-copy .eyebrow{font-size:12px;line-height:1.4}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-copy h1{font-size:35px;line-height:1.07;max-width:none}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-copy>.lead{
  width:100%;max-width:none;margin-top:22px;font-size:17px;line-height:1.45
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .sequence-benefits{
  width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:22px 0
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .sequence-benefits>div{
  display:block;text-align:center
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .sequence-benefits svg{
  display:block;width:28px;height:28px;margin:0 auto 7px
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .sequence-benefits p,
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .sequence-benefits span{
  display:block;font-size:14px;line-height:1.3;margin:0
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .actions{
  width:100%;max-width:none;gap:11px
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .action{
  width:100%;min-height:58px;padding:13px 16px;font-size:18px
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .action svg:first-child{width:30px;height:30px}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero .reference-location{display:none}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-photo{
  position:relative;inset:auto;width:100%;height:auto;max-width:none
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-photo:after{display:none}
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-photo>.boiler-photo{
  width:100%;height:auto;aspect-ratio:1536/1024
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .approved-hero-photo img{
  display:block;width:100%;height:auto;object-fit:contain
 }
}

/* At phone widths the reference canvas otherwise forces three service columns
   into two narrow cards. Keep the approved cards, photos and buttons, but give
   each diagnosis and service enough width to read and tap. */
@media(max-width:520px){
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-services,
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-faults{
  grid-template-columns:minmax(0,1fr);gap:calc(16px / var(--reference-scale))
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-services>.sequence-card:last-child:nth-child(odd),
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-faults>.sequence-card:last-child:nth-child(odd){
  grid-column:auto;display:flex;flex-direction:column;align-items:stretch;gap:0
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-services .service-link,
 .reference-canvas .boiler-repair:not(.thermal-local) .boiler-faults .service-link{
  min-height:calc(48px / var(--reference-scale));font-size:calc(16px / var(--reference-scale))
 }
 /* The reference canvas scales intermediate banners; keep both contact buttons
    legible and full-width without changing the approved hero or sticky bar. */
 .reference-canvas .boiler-repair:not(.thermal-local) .sequence-banner .banner-copy .actions{
  display:grid;grid-template-columns:minmax(0,1fr);gap:calc(10px / var(--reference-scale));max-width:none
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .sequence-banner .banner-copy .action{
  width:100%;max-width:none;min-height:calc(52px / var(--reference-scale));
  padding:calc(12px / var(--reference-scale)) calc(16px / var(--reference-scale));
  gap:calc(8px / var(--reference-scale));font-size:calc(16px / var(--reference-scale));line-height:1.2
 }
 .reference-canvas .boiler-repair:not(.thermal-local) .sequence-banner .banner-copy .action svg:first-child{
  width:calc(24px / var(--reference-scale));height:calc(24px / var(--reference-scale))
 }
}