@charset "UTF-8";
:root{--paper:#f7f8f2;--ink:#2e4b42;--muted:#829185;--line:#e1e7dc;--blue:#5aaabe;--orange:#e6a064;--heat:#d57964;--drain:#8da8a3}
*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible,label:focus-visible,.scene-scroll:focus-visible{outline:2px solid #c68b61;outline-offset:5px}::selection{background:#dce8db}svg{display:block}p,h1{margin:0}.masthead{max-width:1320px;margin:auto;padding:30px 42px;display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:1.7px;font-weight:600}.wordmark svg{width:30px;height:30px}.top-contact{font-size:12px;letter-spacing:.3px;white-space:nowrap}.top-contact span{font-size:17px;margin-left:10px;color:#b78360}main{max-width:1200px;margin:auto}.intro{text-align:center;padding:25px 20px 0}.eyebrow{font-size:9px;letter-spacing:2.5px;color:#7d9281;display:flex;justify-content:center;align-items:center;gap:8px}.eyebrow>span{width:5px;height:5px;border-radius:50%;background:#b0bd9b}h1{font-size:clamp(35px,4.3vw,59px);line-height:1.08;font-weight:400;letter-spacing:-2.7px;margin-top:20px}h1 em{font-style:normal;color:#809780}.subtitle{font-size:13px;line-height:1.6;color:var(--muted);margin-top:16px}.installation{position:relative;max-width:1030px;margin:4px auto 0}.scene-toolbar{display:flex;align-items:center;justify-content:space-between;max-width:920px;margin:0 auto;padding:18px 24px 0;position:relative;z-index:2}.live-label{font-size:9px;color:#8a9a8b;letter-spacing:.5px;display:flex;align-items:center;gap:6px}.live-label i{width:5px;height:5px;border-radius:50%;background:#91b295;box-shadow:0 0 0 3px #91b29515;animation:status 3s ease-in-out infinite}.controls{display:flex;gap:10px;align-items:center}.pause-button,.zoom-button{height:30px;border:1px solid #dae2d6;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#7c9180;cursor:pointer;user-select:none;transition:background .2s}.pause-button{gap:6px;padding:0 11px;font-size:10px;min-width:80px}.pause-button svg{width:12px;height:12px}.zoom-button{width:30px;font-size:20px;line-height:1;display:none}.pause-button:hover,.zoom-button:hover{background:#e8eee3}.control-input,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.play-icon,.play-text,.zoom-out{display:none}#pause:checked~.scene-toolbar .pause-icon,#pause:checked~.scene-toolbar .pause-text{display:none}#pause:checked~.scene-toolbar .play-icon,#pause:checked~.scene-toolbar .play-text{display:block}#pause:checked~.scene-scroll *,#pause:checked~.scene-toolbar .live-label i{animation-play-state:paused!important}#pause:focus-visible~.scene-toolbar .pause-button,#zoom:focus-visible~.scene-toolbar .zoom-button{outline:2px solid #b78360;outline-offset:4px}.scene-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#bccdb8 transparent;-webkit-overflow-scrolling:touch}.scene-canvas{width:100%;margin:auto}.house{width:100%;height:auto;max-height:650px;overflow:visible}.legend{display:flex;justify-content:center;gap:27px;flex-wrap:wrap;padding:8px 20px 0;color:#7a8a7e;font-size:10px}.legend>span{display:flex;align-items:center;gap:7px}.legend i{display:inline-block;width:17px;height:3px;border-radius:4px}.cold-key{background:var(--blue)}.hot-key{background:var(--orange)}.heat-key{background:var(--heat)}.drain-key{background:var(--drain)}.diagram-note{text-align:center;color:#9da99b;font-size:8px;letter-spacing:.5px;margin-top:13px}.signature{display:flex;justify-content:center;align-items:center;gap:56px;padding:33px 20px 31px;margin:25px 45px 0;border-top:1px solid var(--line)}.specialist{display:flex;flex-direction:column;gap:7px}.specialist strong{font-size:16px;font-weight:500;letter-spacing:-.4px}.specialist>span{font-size:10px;color:var(--muted)}.call{display:flex;align-items:center;gap:28px;background:#36564a;color:#f7f8ef;padding:15px 21px;border-radius:4px;font-size:11px;transition:background .2s,transform .2s}.call svg{width:19px;height:19px}.call:hover{background:#496c58;transform:translateY(-1px)}footer{display:flex;justify-content:space-between;max-width:1236px;margin:auto;padding:20px 28px 28px;border-top:1px solid var(--line);gap:20px;font-size:8px;letter-spacing:.2px;color:#97a390;line-height:1.7}
/* All movement is vector/CSS. Pausing stops every animation. */
.pipe{fill:none;stroke-linejoin:round;stroke-linecap:round}.pipe-bed{stroke:currentColor;stroke-width:5;opacity:.32}.pipe-flow{stroke:currentColor;stroke-width:2.5;stroke-dasharray:3 13;animation:flow 1.25s linear infinite}.cold{color:#4c9fb8}.hot{color:#e89b55}.heating{color:#d86d58}.return{color:#c09884}.drain{color:#8ba3a0}.drain .pipe-bed{stroke-width:6;opacity:.55}.drain .pipe-flow{stroke:#e4efeb;stroke-width:2;stroke-dasharray:5 20;animation-duration:2.7s}.return .pipe-flow{animation-duration:1.8s}.hot .pipe-flow{animation-duration:1.4s}.impeller{transform-origin:276px 595px;animation:pump 2.8s linear infinite}.gauge{transform-origin:295px 561px;animation:gauge 4s ease-in-out infinite}.flame{transform-box:fill-box;transform-origin:50% 100%;animation:flame 1.25s ease-in-out infinite alternate}.boiler-light{animation:light 3.5s ease-in-out infinite}.heat-haze{fill:none;stroke:#e3ac85;stroke-width:1.8;opacity:.45;animation:warmth 3.7s ease-in-out infinite}.vapor{stroke-width:5;opacity:0;animation:steam 5s ease-out infinite}.vapor-two{animation-delay:-1.7s;stroke-width:4}.vapor-three{animation-delay:-3.3s;stroke-width:6}.cloud-one{animation:cloud 18s ease-in-out infinite alternate}.cloud-two{animation:cloud 23s ease-in-out infinite alternate-reverse}.well-bubbles{animation:bubbles 2.9s linear infinite}.clean-bubbles{animation:bubbles 3.2s linear infinite}.filter-grains{animation:filter 4s linear infinite}.aquifer-wave{animation:wave 4s ease-in-out infinite alternate}.tap-stream{fill:none;stroke:#8ccad5;stroke-width:3;stroke-linecap:round;stroke-dasharray:3 5;animation:water-run .65s linear infinite}.bath-stream{animation:water-run .65s linear infinite,tap 18s ease-in-out infinite}.sink-stream{opacity:.8}.bath-level{transform-origin:0 311px;animation:bath-fill 18s ease-in-out infinite}.bath-ripple{animation:ripple 2s ease-in-out infinite alternate}.splash{animation:tap 18s ease-in-out infinite}.room-status{animation:light 5s ease-in-out infinite}
@keyframes flow{to{stroke-dashoffset:-32}}@keyframes pump{to{transform:rotate(360deg)}}@keyframes gauge{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}@keyframes flame{0%{transform:scale(.91,.86);opacity:.85}100%{transform:scale(1.04,1.04);opacity:1}}@keyframes light{0%,100%{opacity:.5}50%{opacity:1}}@keyframes warmth{0%,100%{transform:translateY(3px);opacity:.1}50%{transform:translateY(-4px);opacity:.55}}@keyframes steam{0%{transform:translateY(9px);opacity:0}25%{opacity:.4}100%{transform:translate(7px,-29px);opacity:0}}@keyframes cloud{to{transform:translateX(16px)}}@keyframes bubbles{0%{transform:translateY(8px);opacity:0}25%{opacity:.8}100%{transform:translateY(-18px);opacity:0}}@keyframes filter{0%{transform:translateY(-5px);opacity:.45}100%{transform:translateY(6px);opacity:.2}}@keyframes wave{to{transform:translateX(6px)}}@keyframes water-run{to{stroke-dashoffset:-16}}@keyframes tap{0%,59%{opacity:.85}64%,100%{opacity:0}}@keyframes bath-fill{0%,6%{transform:scaleY(.13)}60%,72%{transform:scaleY(1)}97%,100%{transform:scaleY(.13)}}@keyframes ripple{to{transform:translateX(-7px)}}@keyframes status{50%{box-shadow:0 0 0 5px #91b29508;opacity:.65}}
@media(min-width:1500px){.intro{padding-top:34px}.house{max-height:710px}.installation{max-width:1100px}}
@media(max-width:800px){.masthead{padding:23px 26px}.wordmark{font-size:9px;letter-spacing:1.2px;gap:9px}.wordmark svg{width:26px;height:26px}.intro{padding-top:27px}h1{font-size:45px;letter-spacing:-2px}.subtitle{font-size:12px}.installation{margin-top:14px}.scene-toolbar{padding:12px 27px 0}.legend{font-size:9px;gap:15px 22px}.signature{margin-top:24px;padding-block:28px;gap:38px}footer{flex-direction:column;align-items:center;text-align:center;gap:5px}.house{max-height:none}.zoom-button{display:flex}#zoom:checked~.scene-scroll .scene-canvas{width:160%;max-width:none}#zoom:checked~.scene-toolbar .zoom-in{display:none}#zoom:checked~.scene-toolbar .zoom-out{display:block}}
@media(max-width:480px){.masthead{padding:20px 19px;gap:12px}.wordmark{font-size:7px;letter-spacing:.8px;gap:7px}.wordmark svg{width:24px;height:24px}.top-contact{font-size:10px;letter-spacing:0}.top-contact span{font-size:13px;margin-left:4px}.intro{padding:31px 17px 0}.eyebrow{font-size:8px;letter-spacing:2px}h1{font-size:36px;letter-spacing:-1.7px;margin-top:19px;line-height:1.12}.subtitle{font-size:11px;margin-top:13px}.installation{margin-top:22px}.scene-toolbar{padding:0 21px 4px}.live-label{font-size:8px}.pause-button{font-size:9px;min-width:70px;padding:0 9px;height:29px}.zoom-button{width:29px;height:29px}.scene-canvas{width:116%;margin-left:-8%}#zoom:checked~.scene-scroll .scene-canvas{width:195%;margin-left:0}.scene-labels{font-size:11px}.legend{max-width:350px;margin:10px auto 0;gap:11px 21px;padding-inline:24px;font-size:9px;justify-content:flex-start}.legend>span{width:calc(50% - 11px);gap:7px}.legend i{width:14px;flex-shrink:0}.diagram-note{font-size:7px;margin-top:14px}.signature{margin:26px 22px 0;padding:24px 0;gap:20px;justify-content:space-between}.specialist strong{font-size:14px}.specialist>span{font-size:8px}.call{font-size:9px;gap:12px;padding:13px 14px}.call svg{width:16px;height:16px}footer{font-size:7px;padding:17px 20px 23px;gap:6px}.heat-haze{stroke-width:2.5}.pipe-flow{stroke-width:3}.pipe-bed{stroke-width:6}}
@media(max-width:350px){h1{font-size:31px}.wordmark{font-size:6px}.top-contact{font-size:9px}.signature{gap:12px}.specialist strong{font-size:12px}.call{font-size:8px;gap:8px;padding:12px}.specialist>span{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.bath-level{transform:scaleY(.6)}.bath-stream,.splash{opacity:0}.vapor{opacity:.2}.pause-button{display:none}}
/* The full scene fits the screen; horizontal panning is enabled only after zoom. */
.scene-scroll{overflow-x:hidden}#zoom:checked~.scene-scroll{overflow-x:auto}