/* Town pages v2 (4 Nov 2026): Piper-pattern layout in Adelaide Hot Water's own brand (navy / yellow / red, Archivo).
   Loaded after shell.css + town.css. Sections: hx (split hero), crumbs2, svc2, loc, jobs, sys, proof, steps, reviews2, tfaq,
   t-areas (map + town chips), qcta (quote form). */
.sec2{padding:72px 0}
.sec2.paper{background:var(--grey)}
.narrow{max-width:820px}
.h2c{font-size:34px;line-height:1.1;font-weight:800;letter-spacing:-.02em;color:var(--navy);text-align:center;margin-bottom:28px}
.h2l{font-size:34px;line-height:1.1;font-weight:800;letter-spacing:-.02em;color:var(--navy);margin-bottom:16px}
.on-dark .h2c,.on-dark .h2l{color:#fff}
.kick2{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:8px}

/* hero: photo left, navy copy right (Piper's sv-hero--split flip) */
.hx{display:grid;grid-template-columns:1fr 1fr;background:var(--navy);color:#fff;min-height:520px}
.hx-photo{position:relative;margin:0;min-height:100%;background:#0d1a46}
.hx-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hx-photo figcaption{position:absolute;left:16px;bottom:16px;background:var(--yellow);color:var(--ink);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:3px}
.hx-copy{padding:56px max(32px,calc((100vw - 1216px)/2 + 32px)) 56px 56px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.hx-badge{font-size:14px;color:#dfe5f7;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:10px;align-self:flex-start}
.hx-badge b{color:var(--yellow)}
.hx .kick{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow)}
.hx-title{font-size:48px;line-height:1.02;font-weight:900;letter-spacing:-.02em;color:#fff}
.hx-title2{font-size:24px;line-height:1.2;font-weight:700;color:#fff}
.hx-sub,.hx-lead{font-size:18px;line-height:1.55;color:#e6eaf7;max-width:560px}
.hx-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.btn-ghost{border:2px solid #fff;color:#fff;background:transparent}.btn-ghost:hover{background:#fff;color:var(--navy)}
.hx-note{font-size:14px;color:#c9d1ea}

/* breadcrumb bar */
.crumbs2{border-bottom:1px solid var(--rule);background:#fff}
.crumbs2 ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:14px 0;margin:0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.crumbs2 li+li:before{content:"›";margin-right:6px;color:var(--red)}
.crumbs2 a{color:var(--navy)}.crumbs2 [aria-current]{color:var(--muted)}

/* services: ruled 3-col list */
.svc3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px;border-top:3px solid var(--navy)}
.svc3 a{display:block;padding:18px 28px 18px 0;border-bottom:1px solid var(--rule);position:relative}
.svc3 a:after{content:"→";position:absolute;right:4px;top:18px;color:var(--red);font-weight:800}
.svc3 .lbl{display:block;font-weight:800;color:var(--navy);font-size:15px;letter-spacing:.04em;text-transform:uppercase}
.svc3 .d{display:block;color:var(--muted);font-size:15px;margin-top:4px}
.svc3 a:hover .lbl{color:var(--red)}

/* local section */
.loc-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:start}
.loc-txt p{margin-bottom:14px;line-height:1.65}
.dist{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.dist span{background:var(--grey);border-left:4px solid var(--yellow);padding:8px 12px;font-size:14px;font-weight:700;color:var(--ink)}
.loc-near{background:var(--navy);color:#fff;padding:28px;border-radius:4px}
.loc-near h3{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--yellow);margin-bottom:12px}
.loc-near li{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.loc-near li:last-child{border-bottom:0}
.loc-near b{display:block;font-size:17px}.loc-near span{display:block;color:#d5dcf2;font-size:15px}

/* common jobs table */
.jtab{width:100%;border-collapse:collapse;max-width:1000px;margin:0 auto;border-top:3px solid var(--navy);border-bottom:3px solid var(--navy);background:#fff}
.jtab thead th{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);text-align:left;padding:14px 18px;border-bottom:1px solid var(--rule)}
.jtab tbody th{width:30%;text-align:left;vertical-align:top;padding:18px;color:var(--navy);font-weight:800;font-size:15px;letter-spacing:.03em;text-transform:uppercase}
.jtab td{padding:18px;border-bottom:1px solid var(--rule);color:var(--text)}
.jtab tbody th{border-bottom:1px solid var(--rule)}
.sys p{margin-bottom:14px;line-height:1.65}

/* proof: facts + real photos */
.proof{background:var(--navy-d);color:#fff}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
.facts li{border-top:3px solid var(--yellow);padding-top:14px}
.facts b{display:block;font-size:28px;font-weight:900;color:var(--yellow);letter-spacing:-.01em}
.facts span{color:#dfe5f7;font-size:15px}
.pstrip2{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pstrip2 figure{margin:0;position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:4px;background:#0d1a46}
.pstrip2 img{width:100%;height:100%;object-fit:cover}
.pstrip2 figcaption{position:absolute;left:8px;bottom:8px;background:rgba(13,19,36,.82);color:#fff;font-size:12px;font-weight:700;padding:4px 8px;border-radius:3px}
.proof-note{margin-top:16px;font-size:14px;color:#c9d1ea;text-align:center}

/* steps */
.st{list-style:none;padding:0;margin:0 auto;max-width:1000px;border-top:3px solid var(--navy);border-bottom:3px solid var(--navy)}
.st li{display:grid;grid-template-columns:56px 240px 1fr;gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--rule)}
.st li:last-child{border-bottom:0}
.st .n{font-size:32px;font-weight:900;color:var(--red);line-height:1}
.st h3{font-size:15px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--navy)}

/* reviews (pending Steve) */
.rv-pending{max-width:820px;margin:0 auto;border:2px dashed #b9c0d0;border-radius:6px;padding:24px;background:#fff}
.rv-k{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.rv-pending p{color:var(--muted)}
.rv-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}
.rv-slots span{height:72px;border-radius:4px;background:repeating-linear-gradient(135deg,#eef0f4,#eef0f4 10px,#f6f7f9 10px,#f6f7f9 20px)}

/* town FAQ */
.acc details{border-bottom:1px solid var(--rule)}
.acc{border-top:3px solid var(--navy)}
.acc summary{cursor:pointer;padding:18px 40px 18px 0;font-weight:700;color:var(--ink);list-style:none;position:relative}
.acc summary::-webkit-details-marker{display:none}
.acc summary:after{content:"+";position:absolute;right:6px;top:14px;width:26px;height:26px;border:2px solid var(--red);border-radius:50%;text-align:center;line-height:22px;color:var(--red);font-weight:800}
.acc details[open] summary:after{content:"–";background:var(--navy);border-color:var(--navy);color:#fff}
.acc p{padding:0 0 18px;color:var(--muted)}

/* map + network */
.ar2{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.map2{aspect-ratio:4/3;border-radius:4px;overflow:hidden;background:var(--grey);border:1px solid var(--rule)}
.map2 iframe{width:100%;height:100%;border:0;display:block}
.base2{margin-top:14px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}
.base2 small{width:100%;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.base2 b{color:var(--navy)}.base2 a{font-weight:800;color:var(--red)}
.ar2-list h3{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin:18px 0 10px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:block;border:2px solid var(--navy);color:var(--navy);font-weight:700;font-size:14px;padding:7px 11px;border-radius:3px}
.chips a:hover{background:var(--navy);color:#fff}
.chips .here a{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.t-areas .ar-all{margin-top:18px}.t-areas .ar-all a{font-weight:800;color:var(--navy);border-bottom:2px solid var(--yellow)}

/* quote section (Piper's closing split CTA, with the form in it) */
.q-cta{background:var(--navy);color:#fff;padding:72px 0;scroll-margin-top:90px}
.qgrid{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:start}
.q-side h2{font-size:38px;line-height:1.05;font-weight:900;letter-spacing:-.02em;margin-bottom:12px}
.q-side p{color:#e1e6f6;font-size:18px}.q-side a b{color:var(--yellow)}
.q-photo{margin:24px 0 0;position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:4px}
.q-photo img{width:100%;height:100%;object-fit:cover}
.q-photo figcaption{position:absolute;left:10px;bottom:10px;background:var(--yellow);color:var(--ink);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:5px 9px;border-radius:3px}
.q-form{background:#fff;color:var(--text);padding:28px;border-radius:6px}
.qf{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.qf .full,.dv-contact .full{grid-column:1/-1}
.req{color:var(--red)}.opt{color:var(--muted);font-weight:500}
.files .flbl{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:5px}
.file-in{position:absolute;width:1px;height:1px;opacity:0}
.file-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;border:2px dashed var(--navy);border-radius:4px;color:var(--navy);font-weight:800;cursor:pointer;margin:0}
.file-in:focus-visible+.file-btn{outline:3px solid var(--navy);outline-offset:2px}
.fhelp{font-size:13px;color:var(--muted);margin-top:6px}
/* sub-site contact section as the quote section */
.q-cta2{background:var(--navy);color:#fff;scroll-margin-top:90px}
.q-cta2 h2,.q-cta2 h4,.q-cta2 .dv-text,.q-cta2 .dv-blurb p{color:#fff}
.q-cta2 .dv-form{background:#fff;color:var(--text);padding:28px;border-radius:6px}
.q-cta2 .dv-form .form-title{color:var(--navy)}
.q-cta2 .dv-blurb a{color:var(--yellow)}

@media (max-width:1100px){.hx-title{font-size:40px}.facts{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){
  .sec2,.q-cta{padding:48px 0}
  .hx{grid-template-columns:1fr;min-height:0}
  .hx-photo{aspect-ratio:4/3;min-height:0}
  .hx-copy{padding:28px 16px 32px}
  .hx-title{font-size:34px}.hx-title2{font-size:20px}
  .h2c,.h2l{font-size:27px}
  .svc3{grid-template-columns:1fr}
  .loc-grid,.ar2,.qgrid{grid-template-columns:1fr;gap:28px}
  .pstrip2{grid-template-columns:repeat(2,1fr)}
  .st li{grid-template-columns:40px 1fr;gap:4px 12px}.st li p{grid-column:2}
  .jtab tbody th{width:38%;padding:14px 10px;font-size:13px}.jtab td{padding:14px 10px;font-size:15px}
  .qf{grid-template-columns:1fr}
  .q-form,.q-cta2 .dv-form{padding:20px 16px}
  .q-side h2{font-size:30px}
  .rv-slots{grid-template-columns:1fr}
}
.dv.q-cta2 .dv-blurb,.dv.q-cta2 .dv-col>.dv-blurb{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);box-shadow:none;color:#fff}
.dv.q-cta2 .dv-blurb h4,.dv.q-cta2 .dv-blurb p{color:#fff}
.dv.q-cta2 .dv-blurb a{color:var(--yellow);word-break:break-word}
.dv.q-cta2 .dv-text h2{color:#fff}
.dv.q-cta2 .dv-form .form-title,.dv.q-cta2 .dv-form label{color:var(--ink)}

/* ===== v3 (4 Nov 2026, Josh's feedback): service cards, sub-site photo cards, "More about" reading block ===== */
/* icon service cards (every page) */
.icards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:0}
.icards a{position:relative;display:grid;grid-template-columns:52px 1fr;grid-template-rows:auto 1fr;column-gap:16px;height:100%;
  background:#fff;border:1px solid var(--rule);border-radius:8px;padding:22px 52px 22px 22px;box-shadow:0 1px 2px rgba(13,19,36,.04);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.icards a:hover{border-color:var(--navy);box-shadow:0 10px 24px rgba(13,19,36,.10);transform:translateY(-2px)}
.sc-ico{grid-row:1/span 2;width:52px;height:52px;border-radius:12px;background:#fff8b8;color:var(--navy);display:grid;place-items:center}
.sc-ico svg{width:28px;height:28px}
.sc-t{font-size:18px;font-weight:800;color:var(--navy);line-height:1.2;align-self:end}
.sc-d{font-size:15px;color:var(--muted);line-height:1.4;margin-top:4px}
.sc-arr{position:absolute;right:18px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--grey);color:var(--red);display:grid;place-items:center;transition:background .18s ease,color .18s ease}
.sc-arr svg{width:16px;height:16px}
.icards a:hover .sc-arr{background:var(--red);color:#fff}
.icards.compact{margin-top:28px;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.icards.compact a{grid-template-columns:1fr;grid-template-rows:auto auto;padding:16px 14px 16px;text-align:left;row-gap:8px}
.icards.compact .sc-ico{grid-row:auto;width:40px;height:40px;border-radius:10px}.icards.compact .sc-ico svg{width:22px;height:22px}
.icards.compact .sc-t{font-size:15px}.icards.compact .sc-d,.icards.compact .sc-arr{display:none}
/* sub-site intro: two locked lines + three photo cards */
.sc-intro{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:-6px auto 28px;max-width:1000px}
.sc-intro h3{font-size:18px;font-weight:800;color:var(--navy);margin:0 0 6px}
.sc-intro h3 br{display:none}
.sc-intro p{color:var(--muted);margin:0;line-height:1.55}
.sci-a,.sci-b{border-left:4px solid var(--yellow);padding:4px 0 4px 16px}
.pcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.pcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-radius:8px;overflow:hidden;box-shadow:0 1px 2px rgba(13,19,36,.04)}
.pc-img{position:relative;aspect-ratio:16/10;background:var(--grey);overflow:hidden}
.pc-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pc-cap{position:absolute;left:10px;bottom:10px;background:rgba(13,19,36,.82);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:3px}
.pc-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.pc-body h3{font-size:19px;font-weight:800;color:var(--navy);line-height:1.2;letter-spacing:-.01em;margin:0 0 12px}
.pc-ticks{list-style:none;padding:0;margin:0 0 18px}
.pc-ticks li{position:relative;padding:7px 0 7px 26px;border-top:1px solid var(--rule);font-size:15px;line-height:1.45;color:var(--text)}
.pc-ticks li:before{content:"";position:absolute;left:3px;top:13px;width:10px;height:5px;border-left:2.5px solid var(--red);border-bottom:2.5px solid var(--red);transform:rotate(-45deg)}
.pc-link{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-weight:800;color:var(--navy)}
.pc-link .sc-arr{position:static;transform:none}
.pc-link:hover .sc-arr{background:var(--red);color:#fff}
/* "More about hot water systems in <town>": the locked long copy, one clean reading block (text unchanged, in the HTML) */
.more-wrap{padding:24px 0 72px}
.more{border:2px solid var(--navy);border-radius:10px;background:#fff;max-width:1000px;margin:0 auto}
.more>summary{list-style:none;cursor:pointer;padding:24px 84px 24px 28px;position:relative;display:block}
.more>summary::-webkit-details-marker{display:none}
.more-k{display:block;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.more-h{display:block;font-size:26px;font-weight:900;color:var(--navy);letter-spacing:-.01em;line-height:1.15;margin:4px 0 6px}
.more-d{display:block;color:var(--muted);font-size:15px}
.more>summary:after{content:"+";position:absolute;right:26px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:var(--yellow);color:var(--ink);font-weight:900;font-size:24px;line-height:40px;text-align:center}
.more[open]>summary:after{content:"–"}
.more>summary:hover .more-h{color:var(--red)}
.more-body{border-top:1px solid var(--rule);padding:4px 32px 24px}
.more-body .dv{padding:32px 0;background:none;color:var(--text);border-bottom:1px solid var(--rule)}
.more-body .dv:last-child{border-bottom:0}
.more-body .wrap{padding:0;max-width:none}
.more-body .dv h2{font-size:26px;color:var(--navy)}
.more-body .dv h4{color:var(--red)}
.more-body .dv p,.more-body .dv li,.more-body .dv h6{line-height:1.65}
.more-body .dv-text p{max-width:72ch}
.more-body .dv-band .dv-col{display:block;background:var(--grey);border-left:5px solid var(--yellow);border-radius:4px;padding:20px 24px}
.more-body .dv-band h2{color:var(--navy);font-size:22px;margin-bottom:6px}
.more-body .dv-band p{color:var(--text)}
.more-body .dv-band .dv-text:last-child p{font-size:20px;color:var(--red);margin-top:6px}
.more-body .dv-split .c2{grid-template-columns:4fr 7fr;gap:36px}
.more-body .dv-signs .c2 .dv-col,.more-body .dv-popular .c4 .dv-col{background:var(--grey)}
.more-body .dv-types .c1:first-child .dv-col{grid-template-columns:minmax(0,1fr) 260px;column-gap:36px}
.more-body .dv-faq .c2{grid-template-columns:4fr 7fr;gap:36px}
.more-body .b-ico,.more-body .b-dollar{background:#fff8b8}
@media (max-width:1100px){.icards.compact{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
  .icards,.pcards,.sc-intro{grid-template-columns:1fr}
  .icards.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .more>summary{padding:20px 68px 20px 18px}.more-h{font-size:21px}.more>summary:after{right:16px}
  .more-body{padding:0 16px 16px}
  .more-body .dv-split .c2,.more-body .dv-faq .c2,.more-body .dv-types .c1:first-child .dv-col{grid-template-columns:minmax(0,1fr)}
}

.map2{position:relative}.map2-l{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-weight:700}.map2 iframe{position:relative}
.icards.compact a{align-content:start}

/* ===== v4 (4 Nov 2026, Josh: icon cards "look like AI"): photo-led service section, no icons, plain text links ===== */
.tlink{display:inline-block;font-weight:800;color:var(--navy);text-decoration:none;border-bottom:2px solid var(--yellow);padding-bottom:1px;line-height:1.3}
.tlink:after{content:" \2192";color:var(--red)}
.tlink:hover{color:var(--red);border-color:var(--red)}
.svc4 .sv-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:12px 48px;align-items:end;border-bottom:1px solid var(--rule);padding-bottom:20px;margin-bottom:28px}
.svc4 .sv-head .h2l{margin:0}
.svc4 .sv-head p{color:var(--muted);font-size:17px;line-height:1.55;margin:0}
.sv-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sv-big{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1fr);background:var(--grey);border-radius:6px;overflow:hidden;min-height:300px}
.sv-img{position:relative;margin:0;background:#0d1a46;min-height:240px}
.sv-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sv-img figcaption,.pc-cap{position:absolute;left:10px;bottom:10px;right:10px;width:max-content;max-width:calc(100% - 20px);background:rgba(13,19,36,.84);color:#fff;font-size:12px;font-weight:700;line-height:1.35;padding:4px 8px;border-radius:3px}
.sv-txt{padding:28px 28px 26px;display:flex;flex-direction:column;gap:12px}
.sv-txt h3{font-size:24px;line-height:1.15;font-weight:900;letter-spacing:-.01em;color:var(--navy);margin:0}
.sv-txt p{color:var(--text);font-size:16px;line-height:1.6;margin:0}
.sv-txt .tlink{margin-top:auto;align-self:flex-start}
.ty{margin-top:40px}
.ty-h{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.ty-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ty-list a{display:flex;flex-direction:column;color:inherit;text-decoration:none;height:100%}
.ty-img{display:block;position:relative;aspect-ratio:4/3;border-radius:4px;overflow:hidden;background:var(--grey);margin-bottom:12px}
.ty-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.ty-list a:hover .ty-img img{transform:scale(1.03)}
.ty-t{font-size:19px;font-weight:900;color:var(--navy);line-height:1.2}
.ty-t:after{content:" \2192";color:var(--red);font-weight:800}
.ty-list a:hover .ty-t{color:var(--red)}
.ty-d{font-size:15px;line-height:1.5;color:var(--text);margin-top:4px}
.ty-cap{font-size:12.5px;color:var(--muted);margin-top:8px}
.sub-svc .ty{border-top:1px solid var(--rule);padding-top:28px}
.pcard .tlink{margin-top:auto;align-self:flex-start}
@media (max-width:1100px){.sv-two{grid-template-columns:1fr}.ty-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .svc4 .sv-head{grid-template-columns:1fr;align-items:start}
  .sv-big{grid-template-columns:1fr;min-height:0}
  .sv-img{aspect-ratio:16/10;min-height:0}
  .sv-txt{padding:20px 18px 22px}.sv-txt h3{font-size:21px}
  .ty-list{gap:20px 14px}
  .ty-t{font-size:17px}.ty-d{font-size:14px}
}

/* ===== v4 critic round 1 fixes ===== */
/* one heading alignment: everything left on the container edge */
.h2c{text-align:left}
.wrap.narrow{max-width:1216px}
.wrap.narrow>*{max-width:820px}
.jtab,.st,.rv-pending{margin-left:0}
.sys .h2l,.tfaq .h2c{max-width:820px}
/* hero: one quiet eyebrow, sentence case */
.hx .kick{text-transform:none;letter-spacing:0;font-size:16px;font-weight:600;color:#dfe5f7;line-height:1.4;max-width:520px}
.hx-photo figcaption,.q-photo figcaption{background:rgba(13,19,36,.84);color:#fff;text-transform:none;letter-spacing:0;font-weight:700;font-size:12px;padding:4px 8px}
/* local section */
.loc-near h3{font-size:18px;letter-spacing:0;text-transform:none;color:#fff;font-weight:800;margin-bottom:4px}
.loc-near b a{color:#fff;text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:2px;text-underline-offset:4px}
.loc-near b a:hover{color:var(--yellow)}
/* common jobs table: sentence case, stacks on phone */
.jtab thead th{color:var(--muted);letter-spacing:.04em;font-size:13px;text-transform:none}
.jtab tbody th{text-transform:none;letter-spacing:0;font-size:16px}
/* recent jobs: one lead photo + four, no stat bar */
.proof .h2c{color:#fff;margin-bottom:24px}
.pstrip2.p5{grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,250px));gap:12px}
.pstrip2.p5 figure{aspect-ratio:auto;height:100%}
.pstrip2.p5 figure:first-child{grid-row:1/span 2}
.pstrip2 figcaption{background:rgba(13,19,36,.84)}
/* steps: tighter columns, normal case labels */
.st li{grid-template-columns:48px 220px 1fr}
.st h3{text-transform:none;letter-spacing:0;font-size:17px}
/* FAQ: plain plus, no circle chip */
.acc summary:after,.acc details[open] summary:after{content:"+";border:0;background:none;width:auto;height:auto;top:50%;transform:translateY(-50%);line-height:1;font-size:26px;font-weight:600;color:var(--navy)}
.acc details[open] summary:after{content:"\2013"}
.more>summary:after{background:none;border:2px solid var(--navy);color:var(--navy);font-weight:600;line-height:36px}
/* towns list: plain links in columns */
.tlist{list-style:none;padding:0;margin:8px 0 0;columns:3;column-gap:24px}
.tlist li{break-inside:avoid;padding:6px 0;border-bottom:1px solid var(--rule)}
.tlist a{color:var(--navy);font-weight:600}
.tlist a:hover{color:var(--red)}
.tlist .here a{font-weight:800;color:var(--ink);box-shadow:inset 0 -6px 0 var(--yellow)}
.t-areas .ar-all{color:var(--muted);font-size:15px}
.t-areas .ar-all a{font-weight:700}
.base2 small{color:var(--muted);letter-spacing:.06em}
/* service cards: no dead space */
.sv-big{min-height:0}
.sv-txt{gap:10px;justify-content:center}
.sv-txt .tlink{margin-top:6px}
.ty-h{font-size:18px;letter-spacing:0;text-transform:none;color:var(--navy);font-weight:800}
.ty-cap{position:absolute;left:8px;bottom:8px;margin:0;background:rgba(13,19,36,.84);color:#fff;font-size:12px;font-weight:700;padding:3px 7px;border-radius:3px}
/* sub-site services: plain intro, photo rows instead of 3 equal tick cards */
.sub-svc .sc-intro{display:block;max-width:820px;margin:0 0 28px}
.sub-svc .sci-a,.sub-svc .sci-b{border:0;padding:0;margin-bottom:10px}
.sub-svc .sc-intro h3{font-size:16px;margin:0 0 2px;color:var(--ink)}
.sub-svc .sc-intro p{font-size:16px;color:var(--text)}
.pcards{grid-template-columns:1fr;gap:20px}
.pcard{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);border:0;background:var(--grey);box-shadow:none;border-radius:6px}
.pc-img{aspect-ratio:auto;min-height:230px}
.pc-body{padding:26px 30px}
.pc-body h3{font-size:22px;font-weight:900}
.pc-ticks{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin-bottom:14px}
.pc-ticks li{padding:8px 0;border-top:1px solid #dfe2ea;font-size:15px}
.pc-ticks li:before{display:none}
/* /plumbers/ locked copy: one link style, calm phone numbers */
.tb-main a{color:var(--navy);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.tb-main a[href^="tel:"],.tb-main strong a[href^="tel:"],.tb-main .prose a[href^="tel:"]{color:var(--navy);font-weight:700}
/* sub-site contact column: email doesn't break mid-word badly */
.dv.q-cta2 .dv-blurb a{overflow-wrap:anywhere}
@media (max-width:900px){
  .pstrip2.p5{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .pstrip2.p5 figure{aspect-ratio:3/4;height:auto}
  .pstrip2.p5 figure:first-child{grid-row:auto;grid-column:1/-1;aspect-ratio:4/3}
  .tlist{columns:2}
  .pcard{grid-template-columns:1fr}.pc-img{aspect-ratio:16/10;min-height:0}
  .pc-body{padding:20px 18px}.pc-ticks{grid-template-columns:1fr}
  .st li{grid-template-columns:36px 1fr}
}
@media (max-width:600px){
  .jtab thead{display:none}
  .jtab tr{display:block;padding:14px 0;border-bottom:1px solid var(--rule)}
  .jtab tbody th,.jtab td{display:block;width:auto;padding:0;border:0}
  .jtab tbody th{margin-bottom:4px}
  .brandrow .logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px;justify-items:center}
  .brandrow .logos img{max-height:28px}
}
.tb-main .deep_red,.tb-main [class*="red"]{color:var(--navy)!important;font-weight:700}

/* ===== v4 critic round 2 fixes ===== */
h1,h2,.hx-title{text-wrap:balance}
.crumbs2 ol{padding:16px 0}
/* nearby: suburb names only */
.loc-near li{padding:10px 0}
.loc-near li,.loc-near li a{font-size:17px;font-weight:700;color:#fff}
.loc-near li a{text-decoration:none;border-bottom:2px solid var(--yellow)}
.loc-near li a:hover{color:var(--yellow)}
.loc{padding-bottom:40px}.loc+.tbody{padding-top:24px}
/* call card: white with navy border, not a second navy box */
.callcard{background:#fff;color:var(--text);border:2px solid var(--navy)}
.callcard .cc-k{color:var(--red)}.callcard .cc-num{color:var(--navy)}
.callcard .alt{color:var(--navy)}
/* body-copy links: navy + yellow underline, as everywhere else */
.tb-main a,.prose a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:2px;text-underline-offset:3px}
.tb-main a:hover{color:var(--red)}
/* full container width for tables and steps */
.jtab,.st{max-width:none}
/* sub-site services rows: no grey boxes, rules between, alternate photo side */
.pcards{gap:0;border-top:1px solid var(--rule)}
.pcard{background:none;border-radius:0;border-bottom:1px solid var(--rule);padding:24px 0;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:32px;overflow:visible}
.pcard .pc-img{border-radius:4px;overflow:hidden;min-height:220px}
.pcard .pc-body{padding:0}
.pcard:nth-child(2){grid-template-columns:minmax(0,1fr) minmax(0,360px)}
.pcard:nth-child(2) .pc-img{order:2}
.pc-ticks li{border-top-color:var(--rule)}
/* by system type: ruled list with thumbnails, not equal cards */
.sub-svc .ty{border-top:0;padding-top:0}
.ty-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border-top:1px solid var(--rule)}
.ty-list li{border-bottom:1px solid var(--rule)}
.ty-list a{flex-direction:row;align-items:center;gap:18px;padding:14px 0;height:auto}
.ty-img{flex:0 0 132px;width:132px;margin:0;aspect-ratio:4/3}
.ty-list a>.ty-t{flex:0 0 120px}
.ty-d{margin:0;color:var(--muted)}
.ty-cap{font-size:11px;left:6px;bottom:6px;padding:2px 6px}
/* "More about" toggle: bare plus, on the grid */
.more{max-width:none;margin:0}
.more>summary:after{border:0;width:auto;height:auto;font-size:30px;line-height:1;font-weight:600}
/* contact column heading no heavier than the form */
.dv.q-cta2 .dv-col:last-child .dv-text h2{font-size:24px;line-height:1.2}
/* phone read-more on the locked /plumbers/ copy (all text stays in the page) */
.rm-in{position:absolute;opacity:0;width:1px;height:1px}
.rm-btn{display:none}
@media (max-width:767px){
  .rm-body{max-height:30em;overflow:hidden;position:relative}
  .rm-body:after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(rgba(255,255,255,0),#fff)}
  .rm-in:checked+.rm-body{max-height:none}.rm-in:checked+.rm-body:after{display:none}
  .rm-btn{display:inline-block;margin-top:12px;font-weight:800;color:var(--navy);border-bottom:2px solid var(--yellow);cursor:pointer}
  .rm-btn .rm-c,.rm-in:checked~.rm-btn .rm-o{display:none}.rm-in:checked~.rm-btn .rm-c{display:inline}
  .rm-in:focus-visible~.rm-btn{outline:3px solid var(--navy);outline-offset:3px}
  .ar2-list{order:-1}
  .tb-main .local img{max-width:240px;display:block;margin:16px auto 0}
  .hx-act .btn{width:100%;justify-content:center}
  .pstrip2 figcaption,.sv-img figcaption,.pc-cap{font-size:11.5px}
}
@media (max-width:900px){
  .pcard,.pcard:nth-child(2){grid-template-columns:1fr;gap:16px}
  .pcard:nth-child(2) .pc-img{order:0}
  .ty-list{grid-template-columns:1fr}
  .ty-img{flex-basis:104px;width:104px}
  .ty-list a>.ty-t{flex:0 0 92px}
}
/* by system type: thumb | title over brands */
.ty-list a{display:grid;grid-template-columns:132px minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;row-gap:2px;align-content:center}
.ty-list a>.ty-img{grid-row:1/span 2;align-self:center}
.ty-list a>.ty-t{align-self:end;flex:none}
.ty-list a>.ty-d{align-self:start}
@media (max-width:900px){.ty-list a{grid-template-columns:104px minmax(0,1fr)}}

/* ===== v4 critic round 3 fixes ===== */
/* one navy for every dark band */
.proof{background:var(--navy)}
/* links on white: navy underline; yellow only on navy */
.tlink,.tb-main a,.prose a,.t-areas .ar-all a{text-decoration:underline;text-decoration-color:rgba(31,54,140,.4);text-decoration-thickness:1px;text-underline-offset:3px;border-bottom:0}
.tlink{padding:0}
.tlink:hover,.tb-main a:hover,.t-areas .ar-all a:hover{text-decoration-color:currentColor}
/* one small-label style */
.callcard .cc-k,.base2 small,.dv-form .form-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
/* hero proof pill */
.hx-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:15px;color:#dfe5f7}
.hx-note span{background:#fff;color:var(--navy);font-weight:800;font-size:14px;padding:6px 12px;border-radius:999px}
.hx-act .btn{padding-left:20px;padding-right:20px}
/* steps: one strip of four, not another ruled table */
.st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;border:0}
.st li{display:block;padding:0;border:0}
.st .n{display:block;font-size:44px;margin-bottom:10px}
.st h3{font-size:18px;margin-bottom:4px}
.st p{color:var(--text)}
/* FAQ: heading left, questions right, full width */
.tfaq .wrap.narrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;align-items:start}
.tfaq .wrap.narrow>*{max-width:none}
.tfaq .h2c{margin:0}
.rv-pending{max-width:none}
/* services spacing */
.svc4,.sub-svc{padding-bottom:40px}
.svc4+.loc,.sub-svc+.loc{padding-top:40px}
.loc-grid.solo{grid-template-columns:minmax(0,820px)}
/* by system type: one compact row, small photos, no captions */
.ty{margin-top:28px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;border-top:1px solid var(--rule);padding-top:20px}
.ty-h{margin:0;font-size:16px}
.ty-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:0}
.ty-list li{border:0;border-left:1px solid var(--rule)}
.ty-list a{grid-template-columns:56px minmax(0,1fr);column-gap:12px;padding:4px 16px}
.ty-img{width:56px;height:56px;aspect-ratio:1/1;border-radius:4px}
.ty-t{font-size:16px}.ty-d{font-size:13.5px;line-height:1.35}
/* sub-site service rows: photo always left, one-column list, link straight after */
.pcard,.pcard:nth-child(2){grid-template-columns:360px minmax(0,600px);gap:32px;align-items:start}
.pcard:nth-child(2) .pc-img{order:0}
.pcard .pc-img{height:240px;min-height:0}
.pc-ticks{grid-template-columns:1fr;margin-bottom:12px}
.pcard .tlink{margin-top:0}
/* contact bands: photo fills the column */
.qgrid{align-items:stretch}
.q-side{display:flex;flex-direction:column}
.q-side .q-photo{flex:1;aspect-ratio:auto;min-height:260px}
.dv.q-cta2 .dv-row{align-items:stretch}
.dv.q-cta2 .dv-col:last-child{display:flex;flex-direction:column}
.dv.q-cta2 .q-photo{flex:1;aspect-ratio:auto;min-height:260px}
.dv-contact .file-btn{color:var(--navy)}
.dv.q-cta2 .dv-blurb a{font-size:18px;text-decoration-thickness:1px}
/* brand logos: same height */
.brandrow .logos img{height:30px;width:auto;max-width:none}
@media (max-width:1100px){.ty{grid-template-columns:1fr}.ty-list{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}.ty-list li:nth-child(3){border-left:0}}
@media (max-width:900px){
  .st{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .tfaq .wrap.narrow{grid-template-columns:1fr;gap:20px}
  .pcard,.pcard:nth-child(2){grid-template-columns:1fr}
  .pcard .pc-img{height:auto;aspect-ratio:16/10}
  .q-side .q-photo,.dv.q-cta2 .q-photo{flex:none;aspect-ratio:4/3;min-height:0}
}
@media (max-width:600px){
  .ty-list{grid-template-columns:1fr;row-gap:0}
  .ty-list li,.ty-list li:nth-child(3){border-left:0;border-bottom:1px solid var(--rule)}
  .ty-list a{padding:10px 0}
  .brandrow .logos{justify-items:center;justify-content:center}
  .brandrow .logos img{height:24px}
}
.brandrow .logos img.l-rheem{height:44px}@media (max-width:600px){.brandrow .logos img.l-rheem{height:36px}}
.rm-btn{border-bottom:1px solid rgba(31,54,140,.4)!important}@media (max-width:767px){.loc+.tbody{padding-top:8px}}
/* 5 Nov 2026 (Josh): brand logos about 23% larger (30->37px, Rheem roundel 44->54px; phone 24->30, Rheem 36->44) */
.brandrow .logos img{height:37px}.brandrow .logos img.l-rheem{height:54px}
@media (max-width:1100px){.brandrow .logos img{height:33px}.brandrow .logos img.l-rheem{height:48px}}
@media (max-width:600px){.brandrow .logos img{height:30px;max-height:none}.brandrow .logos img.l-rheem{height:44px}}
@media (max-width:380px){.brandrow .logos img{height:26px}.brandrow .logos img.l-rheem{height:38px}}
/* 5 Nov 2026: /faq/ page */
.fq-hero{background:var(--navy);color:#fff;padding:56px 0 52px}
.fq-hero .kick{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--yellow);margin-bottom:10px}
.fq-h1{font-size:48px;line-height:1.04;font-weight:900;letter-spacing:-.02em;max-width:760px}
.fq-lead{margin-top:14px;max-width:680px;font-size:18px;color:#e1e6f6}.fq-lead a b{color:var(--yellow)}
.fq-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start}
.fq-jump{position:sticky;top:100px}
.fq-jump p{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.fq-jump ul{display:grid;gap:2px}
.fq-jump a{display:block;padding:8px 0 8px 12px;border-left:3px solid var(--rule);font-weight:700;color:var(--navy);font-size:15px}
.fq-jump a:hover{border-left-color:var(--yellow);background:var(--grey)}
.fq-g{scroll-margin-top:100px}.fq-g+.fq-g{margin-top:48px}
.fq-gh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-bottom:14px}
.fq-gh p{color:var(--muted);font-size:15px}
.fqa{padding:0 0 18px;color:var(--text)}
.fqa p+p,.fqa p+ul{margin-top:8px}
.fqa ul{list-style:disc;padding-left:20px}.fqa li{padding:3px 0}
.fqa a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
@media (max-width:900px){
  .fq-hero{padding:40px 0 36px}.fq-h1{font-size:34px}.fq-lead{font-size:16.5px}
  .fq-wrap{grid-template-columns:1fr;gap:24px}
  .fq-jump{position:static}.fq-jump ul{display:flex;flex-wrap:wrap;gap:8px}
  .fq-jump a{border:2px solid var(--navy);border-radius:3px;padding:6px 10px;font-size:14px}
  .fq-g+.fq-g{margin-top:36px}
}
/* 5 Nov 2026 image check: product photos in "Popular hot water systems" were squashed (255x170 shown at 207x170); keep their shape */
.dv-prodimg img{height:auto;max-width:100%;object-fit:contain}
/* 5 Nov 2026: suburb names in "Other local areas ... include:" are links */
.local-list li a{color:var(--navy);text-decoration:underline;text-decoration-color:rgba(34,62,146,.35);text-underline-offset:3px}
.local-list li a:hover{text-decoration-color:var(--navy)}
/* 5 Nov 2026 (Josh): logos link to the brand pages */
.brandrow .logos a{display:flex;align-items:center;justify-content:center;min-width:0;line-height:0;border-radius:6px;padding:6px 4px;transition:background-color .15s}
.brandrow .logos a:hover{background:var(--grey)}
.brandrow .logos a:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.brandrow .logos a[aria-current]{box-shadow:inset 0 -3px 0 var(--red)}