
/* ---- responsive layer (added at compile time; the design was drawn at 1440px) ---- */
@media (max-width:1023px){
  [data-screen-label="Nav"] nav,[data-screen-label="Nav"] .ds-btn{display:none!important}
  .nav-burger{display:inline-flex}
}
@media (max-width:900px){
  [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [style*="grid-template-columns"]>*{min-width:0}
  select,textarea{max-width:100%}
  footer [style*="grid-template-columns"]{grid-template-columns:1fr 1fr!important}
  [style*="position:sticky;top:100px"],[style*="position:sticky;top:96px"]{position:relative!important;top:auto!important}
  .svc-panel{height:420px!important}
  /* Our Guarantee (v3): promise rows, agreement clauses and the remedy box are row grids, not column layouts */
  [data-screen-label="The Guarantee"] [style*="grid-template-columns:auto 40px 1fr auto"]{grid-template-columns:auto 40px 1fr auto!important}
  [data-screen-label="The Guarantee"] [style*="grid-template-columns:34px 1fr"]{grid-template-columns:34px 1fr!important}
  [data-screen-label="The Guarantee"] [style*="grid-template-columns:auto 1fr;"]{grid-template-columns:auto 1fr!important}
  [data-screen-label="The Guarantee"] [style*="grid-template-columns:repeat(3,minmax(0,1fr))"]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  [data-screen-label="Final CTA"]>div[style*="display:grid"]{padding-top:96px!important;padding-bottom:72px!important}
}
/* reviews carousel on phones (every page; the design only wrote a phone branch for the Homepage) */
@media (max-width:759px){
  [data-sty="revWrapStyle"]{display:flex!important;flex-direction:column!important;position:static!important}
  [data-sty="revPanelStyle"]{position:static!important;transform:none!important;width:auto!important;padding:24px var(--container-pad) 6px!important;text-align:center!important;background:transparent!important;z-index:auto!important}
  [data-sty="revViewportStyle"]{margin-left:0!important;padding:10px 0 10px var(--container-pad)!important;position:relative!important}
  [data-sty="revPrevBtnStyle"]{left:4px!important}
  [data-sty="revNextBtnStyle"]{right:8px!important}
  [data-sty="revCardStyle"]{width:max(240px,min(300px,calc(100vw - 96px)))!important}
}
/* master service pages on phones: desktop compositions re-flowed (2026-09-16) */
@media (max-width:900px){
  /* split-background sections: the angled colour panel, the tinted right strip and the giant watermark word are desktop composition */
  [style*="width:46%"][style*="clip-path"]{display:none!important}
  [style*="font-size:200px"]{display:none!important}
  [style*="width:38%"][style*="linear-gradient(90deg,rgba(234,245,248,0)"]{display:none!important}
  /* floating badges pinned outside a photo card sit inside it */
  [style*="top:-22px;left:-22px"]{top:12px!important;left:12px!important}
  [style*="right:-22px;top:38%"]{right:12px!important}
  /* gallery: a taller slide so the caption fits, thumbnails three-up */
  [style*="aspect-ratio:21/9"]{aspect-ratio:auto!important;min-height:400px}
  [style*="aspect-ratio:21/9"] [style*="left:36px;right:36px;bottom:32px"]{left:18px!important;right:18px!important;bottom:18px!important}
  [style*="aspect-ratio:21/9"] h3{font-size:22px!important}
  [style*="grid-template-columns:repeat(6,minmax(0,1fr))"]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  /* design process: the ten phase tabs become a swipeable row, the phase panel stacks photo over text */
  [style*="grid-template-columns:repeat(10,minmax(0,1fr))"]{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-left:calc(-1 * var(--container-pad));margin-right:calc(-1 * var(--container-pad));padding:0 var(--container-pad) 8px}
  [style*="grid-template-columns:repeat(10,minmax(0,1fr))"]::-webkit-scrollbar{display:none}
  [style*="grid-template-columns:repeat(10,minmax(0,1fr))"]>button{flex:0 0 132px;scroll-snap-align:start}
  [style*="min-height:440px"]{min-height:260px!important}
  [style*="padding:52px 56px"]{padding:28px 20px!important}
  /* feature explorer: shorter photo, no pin labels, caption stacked, tighter rows */
  [data-ft] [style*="min-height:620px"]{min-height:440px!important}
  [data-ft-pin] [data-sty="labelStyle"]{display:none!important}
  [data-ft] [style*="left:28px;right:28px;bottom:26px"]{left:16px!important;right:16px!important;bottom:16px!important;flex-direction:column;align-items:flex-start!important;gap:10px!important}
  [data-ft] [style*="left:28px;right:28px;bottom:26px"]>div[style*="text-align:right"]{text-align:left!important}
  [data-ft-row]{padding:12px 16px!important}
  [data-ft] [style*="left:28px;right:28px;bottom:26px"] p:last-child{display:none}
  [data-ft] [style*="left:28px;right:28px;bottom:26px"]{flex-direction:row;align-items:flex-end!important;justify-content:space-between}
  [data-ft-pin] [data-sty="ringStyle"],[data-ft-pin] [data-sty="dotStyle"]{width:32px!important;height:32px!important}
  [data-ft] [style*="min-height:620px"]{min-height:400px!important}
  /* warranty: term tiles two-up, the cross-section diagram is desktop-only, its coverage panel and note flow in the page */
  [data-screen-label="Warranty"] [style*="grid-template-columns:repeat(5,minmax(0,1fr))"]{grid-template-columns:1fr 1fr!important}
  [data-screen-label="Warranty"] [style*="min-height:170px"]{min-height:0!important}
  [data-screen-label="Warranty"] [style*="font-size:34px"]{font-size:26px!important}
  [data-screen-label="Warranty"] [style*="margin-top:-36px"]>svg,[data-screen-label="Warranty"] [style*="margin-top:-36px"]>button{display:none!important}
  [data-screen-label="Warranty"] [style*="margin-top:-36px"]{margin-top:0!important;padding:28px var(--container-pad) 0}
  [data-screen-label="Warranty"] [style*="margin-top:-36px"]>div[style*="position:absolute"]{position:static!important;width:auto!important}
  [data-screen-label="Warranty"] [style*="margin-top:-36px"]>p[style*="position:absolute"]{position:static!important;padding:14px 0 28px;text-align:center}
  /* logo strips: capped logo height and a tighter gap so a row holds two or three marks */
  img[src*="/assets/logo-"]:not([src*="kingfisher-mark"]){max-height:52px!important;width:auto}
  div[style*="gap:72px"]{gap:24px 36px!important}
  /* row grids (icon | text): these are rows, not column layouts - the broad collapse above must not stack them */
  [style*="grid-template-columns:44px 1fr"]{grid-template-columns:44px 1fr!important}
  [style*="grid-template-columns:40px 1fr"]{grid-template-columns:40px 1fr!important}
  [style*="grid-template-columns:14px 1fr auto"]{grid-template-columns:14px 1fr auto!important}
  /* pricing's cost-driver table (icon | factor | level | note): level and note wrap under the factor */
  [style*="grid-template-columns:40px 1.15fr .9fr 1fr"]{grid-template-columns:40px 1fr!important;row-gap:2px!important}
  [style*="grid-template-columns:40px 1.15fr .9fr 1fr"]>:nth-child(n+3){grid-column:2}
  /* section rhythm: desktop paddings of 88-120px read as dead space on a phone */
  [data-screen-label][style*="padding:112px 0"],[data-screen-label][style*="padding:120px 0"],[data-screen-label][style*="padding:96px 0"],[data-screen-label][style*="padding:88px 0"]{padding-top:64px!important}
  [data-screen-label][style*="padding:112px 0;"],[data-screen-label][style*="padding:120px 0;"],[data-screen-label][style*="padding:96px 0;"],[data-screen-label][style*="padding:88px 0;"],[data-screen-label][style$="padding:112px 0"],[data-screen-label][style$="padding:120px 0"],[data-screen-label][style$="padding:96px 0"],[data-screen-label][style$="padding:88px 0"]{padding-bottom:64px!important}
  [data-screen-label][style*="padding:88px 0 104px"],[data-screen-label][style*="padding:96px 0 120px"],[data-screen-label][style*="padding:88px 0 96px"]{padding-bottom:72px!important}
  /* service areas: the region panel sits below the map instead of covering it */
  div:has(>iframe[src="/service-areas/map"]){height:auto!important;display:flex;flex-direction:column}
  iframe[src="/service-areas/map"]{position:relative!important;height:340px!important;flex:none}
  iframe[src="/service-areas/map"]+div{position:static!important;width:auto!important;box-shadow:none!important;border-radius:0!important}
  /* services explorer: the side-by-side table stays a table; panel paddings tighten */
  [style*="grid-template-columns:1.2fr 1fr 1fr 1fr"]{grid-template-columns:1.2fr 1fr 1fr 1fr!important;font-size:11.5px!important}
  [style*="grid-template-columns:1.2fr 1fr 1fr 1fr"]>div{padding:8px 7px!important}
  [style*="padding:28px 32px 8px"],[style*="padding:24px 32px 6px"],[style*="padding:24px 32px 32px"]{padding-left:18px!important;padding-right:18px!important}
  [style*="left:32px;right:32px;bottom:24px"]{left:18px!important;right:18px!important}
}
@media (max-width:979px){
  [style*="width:880px;margin:0 auto;position:relative;height:480px"]{width:100%!important;height:auto!important;aspect-ratio:880/480}
  input[type=range][style*="width:880px"]{width:100%!important}
}
@media (max-width:640px){
  :root{--container-pad:20px;--text-h1:36px;--text-h2:30px;--text-h3:22px;--text-h4:19px;--section-pad:64px}
  footer [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [data-screen-label="Top Bar"]>div{font-size:12px!important;padding-left:14px!important;padding-right:14px!important}
  [data-screen-label="Nav"]>div{height:64px!important;gap:12px!important}
  [data-screen-label="Nav"]>div>a:first-child{font-size:17px!important;gap:8px!important}
  [data-screen-label="Nav"]>div>a:first-child img{width:32px!important;height:32px!important}
  [data-screen-label="Hero"]>div[style*="z-index:1"]{padding-top:56px!important;padding-bottom:56px!important}
  [data-screen-label="Hero"] .eyebrow{font-size:11px!important;letter-spacing:.12em!important;white-space:nowrap} /* one line on phones (John, 2026-09-08) */
  [data-sty="ansWrapStyle"] p{padding:0 4px 24px 0!important}
  [data-action="faqToggle"]{gap:14px!important;padding:20px 2px!important}
  [data-action="faqToggle"] h3{font-size:17px!important}
  [data-action="faqToggle"]>span:nth-child(2){display:none!important}
  [data-screen-label="Final CTA"] [style*="padding:82px 26px 24px"]{padding:74px 16px 18px!important}
  [style*="right:-22px"]{right:6px!important}
  /* large buttons and button pairs: full width, one per line */
  .ds-btn-lg{padding:14px 22px!important;font-size:16px!important}
  div[style*="display:flex"]:has(>.ds-btn+.ds-btn),div[style*="display:flex"]:has(>.ds-btn+a[style*="height:54px"]){flex-direction:column;align-items:stretch}
  div[style*="display:flex"]:has(>.ds-btn+.ds-btn)>.ds-btn,div[style*="display:flex"]:has(>.ds-btn+a[style*="height:54px"])>a{width:100%;text-align:center}
}
