.rp{--rp-ink:#0e3268;--rp-blue:#234b9a;--rp-orange:#f7941d;--rp-muted:#505f73;--rp-soft:#f4f6fa;background:var(--rp-soft);color:var(--rp-ink);padding:clamp(40px,5vw,76px) 0;font-family:Poppins,Arial,sans-serif;container-type:inline-size;scroll-margin-top:16px}
.rp *{box-sizing:border-box}.rp .rp-wrap{width:min(1440px,calc(100% - 64px));margin-inline:auto}.rp h2,.rp h3,.rp p,.rp figure{margin:0}.rp .rp-heading{text-align:center;max-width:900px;margin:0 auto 40px}.rp .rp-heading h2{color:var(--rp-ink);font:800 clamp(30px,3.3vw,48px)/1.15 Poppins,Arial,sans-serif;letter-spacing:-.025em;text-wrap:balance;margin:0 0 16px}.rp .rp-heading>p{color:var(--rp-muted);font-size:17px;line-height:1.65;max-width:58ch;margin:auto}.rp .rp-project-heading{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:20px}.rp .rp-project-heading h3{font-size:23px;line-height:1.35;letter-spacing:-.015em;color:var(--rp-ink);margin:0}.rp .rp-project-heading>p{font-size:14px;line-height:1.5;color:var(--rp-muted);flex-shrink:0}.rp .rp-project-heading>p span{padding:0 6px}.rp .rp-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.rp .rp-open{display:block;position:relative;aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:#dfe4eb;text-decoration:none;cursor:zoom-in}.rp .rp-open>img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%;transition:transform .24s ease-out}.rp .rp-after>img{object-position:50% 28%}.rp .rp-open:hover>img{transform:scale(1.015)}.rp .rp-label{position:absolute;top:18px;left:18px;border-radius:6px;padding:8px 17px;background:#fff;color:var(--rp-ink);font-weight:800;font-size:17px;line-height:1.4}.rp .rp-after .rp-label{background:var(--rp-ink);color:#fff}.rp .rp-expand{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:40px;height:40px;background:#fff;color:var(--rp-ink);border-radius:50%;font-size:28px;line-height:1;box-shadow:0 2px 8px #0002}.rp figcaption{font-size:15px;font-weight:600;line-height:1.45;margin-top:12px}.rp .rp-angles{display:flex;gap:10px;align-items:center}.rp .rp-angles>span{font-size:14px;font-weight:600;margin-right:6px}.rp .rp-angles>button{width:46px;height:52px;padding:3px;background:#fff;border:2px solid transparent;border-radius:7px;cursor:pointer}.rp .rp-angles>button[aria-pressed=true]{border-color:var(--rp-blue)}.rp .rp-angles>button img{display:block;width:100%;height:100%;object-fit:cover;border-radius:2px}.rp .rp-summary{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:28px}.rp .rp-summary>p{font-size:17px;line-height:1.7;max-width:60ch;color:#2b323d;margin:0}.rp a.rp-cta{display:inline-flex;align-items:center;justify-content:center;gap:20px;flex-shrink:0;font-size:15px;line-height:1.4;font-weight:700;background:var(--rp-orange);color:#092c41;border-radius:99px;padding:17px 24px;text-decoration:none;min-height:48px}.rp .rp-cta:hover{background:#ffa62f}.rp .rp-cta span{font-size:22px}.rp button{font-family:inherit}.rp a:focus-visible,.rp button:focus-visible{outline:3px solid var(--rp-blue);outline-offset:4px}.rp .rp-dialog{width:min(820px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:0;border-radius:14px;padding:20px;background:white;color:var(--rp-ink);overflow:auto}.rp .rp-dialog::backdrop{background:rgb(7 21 41 / .86)}.rp .rp-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}.rp .rp-dialog-top h3{font-size:18px;margin:0;line-height:1.3}.rp .rp-dialog-top button{width:44px;height:44px;flex-shrink:0;border:0;background:var(--rp-soft);border-radius:50%;color:var(--rp-ink);font-size:21px;cursor:pointer}.rp .rp-dialog-switch{display:flex;justify-content:center;gap:8px;margin-bottom:14px}.rp .rp-dialog-switch button{min-width:112px;min-height:44px;padding:10px 20px;border:1px solid #c4cedc;background:#fff;color:var(--rp-ink);font-size:15px;font-weight:700;border-radius:6px;cursor:pointer}.rp .rp-dialog-switch button[aria-pressed=true]{background:var(--rp-ink);color:#fff;border-color:var(--rp-ink)}.rp .rp-dialog-image{display:block;max-width:100%;width:100%;height:min(66dvh,800px);object-fit:contain;background:var(--rp-soft);border-radius:6px}.rp .rp-dialog-caption{font-size:14px;text-align:center;line-height:1.5;margin-top:12px;color:var(--rp-muted)}
@container(max-width:760px){.rp .rp-wrap{width:calc(100% - 40px)}.rp .rp-heading{margin-bottom:28px}.rp .rp-heading h2{font-size:32px}.rp .rp-heading>p{font-size:15px;max-width:40ch}.rp .rp-desktop-break{display:none}.rp .rp-project-heading{display:block;margin-bottom:16px}.rp .rp-project-heading h3{font-size:22px;max-width:26ch;margin-bottom:8px}.rp .rp-project-heading>p{font-size:14px}.rp .rp-pair{gap:12px}.rp .rp-open{aspect-ratio:3/4;border-radius:9px}.rp .rp-label{top:10px;left:10px;font-size:14px;padding:5px 10px}.rp .rp-expand{width:30px;height:30px;right:8px;bottom:8px;font-size:24px}.rp figcaption{font-size:14px;margin-top:10px}.rp .rp-summary{display:block;margin-top:24px}.rp .rp-summary>p{font-size:16px;margin-bottom:22px}.rp a.rp-cta{width:100%;justify-content:space-between}.rp .rp-angles{gap:8px}}
@container(max-width:360px){.rp .rp-wrap{width:calc(100% - 32px)}.rp .rp-heading h2{font-size:29px}.rp .rp-pair{gap:10px}.rp .rp-label{top:8px;left:8px;padding:5px 8px}.rp .rp-project-heading h3{font-size:21px}}
@media(max-width:600px){.rp .rp-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);padding:14px}.rp .rp-dialog-image{height:59dvh}.rp .rp-dialog-top h3{font-size:16px}}
@media(prefers-reduced-motion:reduce){.rp .rp-open>img{transition:none}.rp .rp-open:hover>img{transform:none}}
/* Preserve the real portrait framing of both water-heater photos at every size. */
.rp .rp-open{aspect-ratio:3/4}
.rp .rp-pair--single{grid-template-columns:minmax(0,1fr)}
.rp .rp-pair--single .rp-open{aspect-ratio:16/9}
/* Keep project photography stable; hover only lifts the photo frame. */
.rp .rp-open{transition:transform .18s ease,box-shadow .18s ease}
.rp .rp-open:hover,.rp .rp-open:focus-visible{transform:translateY(-3px);box-shadow:0 12px 26px rgba(14,50,104,.14)}
.rp .rp-open:hover>img,.rp .rp-open:focus-visible>img{transform:none}
@media(prefers-reduced-motion:reduce){.rp .rp-open:hover,.rp .rp-open:focus-visible{transform:none}}