.illustrated-guide { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr); gap:0 clamp(24px,5vw,80px); align-items:center }
.illustrated-guide .crumb { grid-column:1/-1 }
.owner-guide .illustrated-guide h1 { max-width:18ch; font-size:clamp(2.45rem,4.75vw,4.8rem); line-height:1.03 }
.guide-jump { display:inline-block; padding:.4rem 0; font-weight:650; text-underline-offset:4px }
.plumb-plate { margin:1.25rem 0 0; max-width:540px }
.plumb-plate img { width:100%; height:auto; display:block }
.plumb-plate figcaption,.plumb-phone small,.plumb-caption { font:600 .8rem/1.5 var(--mono) }
.plumb-plate figcaption { margin-top:.65rem; color:var(--muted) }
.plumb-lab { min-width:0; margin:2rem 0; padding:clamp(14px,3vw,28px); border:1px solid #98b5b7; border-radius:8px; background:#e9f2f2; scroll-margin-top:6rem }
.plumb-lab legend { font-size:clamp(1.25rem,3vw,1.65rem); font-weight:700; padding:0 .4rem; color:#203f45; line-height:1.2 }
.plumb-lab .plumb-hint { margin:0 0 1rem; font-size:1rem; color:#35565b }
.plumb-lab > input { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden }
.plumb-lab > label { display:inline-flex; gap:8px; align-items:center; min-height:44px; border:1px solid #728c90; color:#18383d; padding:6px 12px; margin:0 3px 6px 0; border-radius:5px; cursor:pointer; font-weight:640 }
.plumb-lab > input:checked + label { color:#fff; background:#244b50; border-color:#244b50 }
.plumb-lab > input:focus-visible + label { outline:3px solid #00755e; outline-offset:3px }
.plumb-panel { display:none; grid-template-columns:minmax(0,.9fr) minmax(0,1fr); align-items:center; gap:clamp(14px,3vw,30px); padding-top:.8rem }
#plumb-leak:checked ~ .plumb-urgent,#plumb-heater:checked ~ .plumb-planned { display:grid }
.plumb-phone { background:white; border:1px solid #99b2b5; border-top:5px solid #2a5258; border-radius:8px; padding:18px; box-shadow:3px 4px 0 #cbd9da }
.plumb-phone > b { display:block; margin:.65rem 0; font-size:1.3rem; line-height:1.16; letter-spacing:-.035em }
.plumb-phone small,.plumb-caption { color:#3a595f }
.plumb-phone p,.plumb-desk p { margin:.65rem 0; color:#324c52; font-size:1rem; line-height:1.55 }
.plumb-action,.plumb-caption { display:flex; align-items:center; gap:.5rem }
.plumb-action { color:#fff; background:#28535a; width:fit-content; border-radius:5px; padding:.4rem .65rem; margin:1rem 0 .6rem; font-weight:660 }
.plumb-action svg,.plumb-caption svg { flex:none }
.plumb-studies { display:grid; gap:16px; margin:24px 0 }
.plumb-study { padding:16px 20px; border-left:3px solid #467a80; background:#edf3f4 }
.plumb-study h3 { font-size:1.2rem; margin:0; line-height:1.25 }
.plumb-study p { margin:.45rem 0; font-size:1rem }
.plumb-study a { text-underline-offset:3px }
.plumb-counts { margin:1.5rem 0; padding:1rem 1.2rem; border-radius:7px; background:#183a42; color:#fff }
.plumb-counts figcaption { font-weight:680 }
.plumb-counts dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; margin:.9rem 0 0 }
.plumb-counts dt { font-size:1.7rem; line-height:1.2; color:#a5edda; font-weight:700 }
.plumb-counts dd { margin:.35rem 0 0; font-size:.97rem }
.plumb-ticks { display:flex; gap:3px; margin:.35rem 0 .55rem }
.plumb-ticks i { flex:1; height:6px; border:1px solid #88aaa9; border-radius:2px }
.plumb-ticks .counted { background:#a5edda; border-color:#a5edda }
.plumb-decisions { margin:1rem 0 2rem; border-top:2px solid #45696d }
.plumb-decisions > div { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.3fr); gap:1rem; padding:1rem 0; border-bottom:1px solid #b8cbcc }
.plumb-decisions dt { color:#20494f; font-weight:680 }
.plumb-decisions dd { margin:0; color:var(--muted) }
@media(max-width:520px){
  .plumb-decisions > div { grid-template-columns:1fr; gap:.35rem }
  .plumb-counts dl { grid-template-columns:1fr; gap:.65rem }
  .plumb-counts dl > div { display:grid; grid-template-columns:5.2rem 1fr; align-items:center }
  .plumb-counts dd { margin:0 }
}
@media(max-width:680px){
  .illustrated-guide,.plumb-panel { grid-template-columns:minmax(0,1fr) }
  .plumb-plate { max-width:360px }
  .plumb-lab > label { padding-inline:9px; font-size:.95rem }
}
