/*
  PlumbCheck Group — relining.css
  Page-specific styles for /services/drain-relining/. Loaded after site.css. Covers the
  "how it works" cutaway explainer and the B2B booking form's item checkboxes/notices.
*/
.explain{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-top:36px}
.cutaway{border-radius:var(--radius);padding:22px}
.pipe-old{fill:var(--bg3)} .pipe-wall{stroke:var(--text2)} .pipe-damage{stroke:var(--accent-hi)}
.liner{fill:rgba(var(--accent-rgb),.18);stroke:var(--accent)} .liner-core{fill:var(--accent)}
.flow-arrow{stroke:var(--accent)} .cut-label{fill:var(--text2);font:600 12px var(--display);letter-spacing:.04em;text-transform:uppercase}
.explain h3{font-size:1.6rem;font-weight:800;font-style:italic;text-transform:uppercase;color:var(--text)}
.explain p{color:var(--text2);margin-top:10px}
.step{border-radius:var(--radius);padding:20px 16px;transition:transform .25s var(--spring),box-shadow .25s var(--ease)}
.step:hover{transform:translateY(-4px);box-shadow:var(--glow)}
.step h3{margin-top:6px;font-size:1.05rem;text-transform:uppercase;font-style:italic;color:var(--text)}
.step p{font-size:.84rem;color:var(--text2);margin-top:6px}
.trade{background:linear-gradient(180deg,transparent,rgba(var(--accent-rgb),.04))}
.group-label{font-family:var(--display);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.74rem;color:var(--text3);margin:22px 0 12px;padding-top:14px;border-top:1px solid var(--hair)}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.check{display:flex;gap:9px;align-items:flex-start;font-size:.92rem;color:var(--text2);padding:8px 10px;border:1px solid var(--glass-brd);border-radius:var(--radius-sm);cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--accent);margin-top:2px}
.slot-note{font-size:.84rem;color:var(--text3);margin:-6px 0 14px}
.notice{margin:8px 0;padding:11px 14px;border-radius:var(--radius-sm);background:rgba(var(--accent-rgb),.06);border-left:3px solid var(--accent);font-size:.88rem;color:var(--text2)}
@media(max-width:900px){.explain{grid-template-columns:1fr;gap:28px}}
@media(max-width:760px){.checks{grid-template-columns:1fr}}
