:root{color-scheme:light}*{box-sizing:border-box}body{margin:0;background:#f6f3ec;color:#27343b;font-family:Arial,Helvetica,sans-serif}.pump-demo{--blue:#365c7b;--green:#40694f;--warm:#ae6b30;max-width:1060px;margin:auto;padding:28px 24px 50px;font-size:18px;line-height:1.5}.pump-demo h1{font-size:clamp(34px,5vw,52px);line-height:1.1;margin:26px 0 14px}.pump-demo h2{font-size:24px;line-height:1.25;margin:0}.topline{display:flex;justify-content:space-between;gap:16px;align-items:center;font-size:16px;font-weight:bold}.draft-tag{border:1px solid #ae6b30;border-radius:30px;padding:6px 12px;color:#865122;font-weight:normal}.intro{max-width:730px;color:#616864;font-size:21px}.setup{display:flex;gap:26px;align-items:center;padding:20px;border:2px solid var(--blue);border-radius:12px;margin:25px 0;background:#e8eef2}.setup label{flex:1;max-width:430px}.supply span,.supply strong{display:block}.supply span{color:#616864;font-size:17px}.pump-demo select,.pump-demo input[type=number]{display:block;width:100%;padding:12px;border:1.5px solid #738276;border-radius:7px;background:#fffdf8;color:inherit;font:inherit;min-height:48px;margin-top:7px}.pump-demo button{font:inherit;color:inherit;cursor:pointer}.pump-demo button:focus-visible,.pump-demo select:focus-visible,.pump-demo input:focus-visible,.pump-demo summary:focus-visible{outline:3px solid #ae6b30;outline-offset:3px}.instruction{margin:26px 0 12px;font-weight:bold}.diagram{position:relative;padding:0 32px 30px;isolation:isolate}.pipes{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible}.pipe-base{stroke:#365c7b;stroke-width:8;stroke-linejoin:round;stroke-linecap:round;fill:none}.pipe-flow{stroke:#a9d2e8;stroke-width:3;fill:none;stroke-dasharray:5 16;animation:water-flow 1.1s linear infinite;stroke-linecap:round}.no-flow .pipe-flow{animation:none;opacity:0}.fixtures{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:16px;row-gap:44px;padding-bottom:45px}.fixture{border:2px solid #c5cbc5;border-radius:12px;background:#f9f7f1;padding:12px 6px;min-height:154px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;position:relative;transition:background .2s,border-color .2s}.fixture.active{background:#e4eee5;border-color:var(--green);box-shadow:0 0 0 2px #40694f22}.fixture svg{width:48px;height:48px;color:var(--blue);stroke-width:2.2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.fixture b{font-size:17px;line-height:1.15;text-align:center;overflow-wrap:anywhere}.fixture .switch-label{font-size:16px;color:#616864;white-space:nowrap}.fixture.active .switch-label{color:var(--green);font-weight:bold}.fixture.active .switch-label:before{content:'● ';font-size:12px}.pump-row{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:32px;align-items:center;margin-top:26px}.gauge-box{max-width:200px;justify-self:center;text-align:center;width:100%;background:#f6f3ec}.gauge-label{font-size:19px;font-weight:bold}.gauge-box svg{display:block;width:100%;height:auto}.gauge-box strong{font-size:23px;color:var(--blue);font-variant-numeric:tabular-nums;display:block;background:#f6f3ec}.needle{transform-origin:100px 100px;transition:transform .7s ease}.pump-frame{width:100%;margin:0;border:3px solid var(--blue);background:white;border-radius:12px;padding:14px;text-align:center;box-shadow:0 8px 22px #27343b0a;z-index:1}.pump-frame img{display:block;width:100%;height:150px;object-fit:contain}.pump-frame figcaption{font-size:23px;font-weight:bold;line-height:1.2;margin-top:10px}.supply-caption{text-align:right;margin-top:26px;font-size:17px;color:var(--blue)}.heater-control{border:2px solid var(--warm);background:#f2e9dd;border-radius:12px;padding:18px;margin:20px 0}.heater-control p{margin-bottom:0}.heater-control label{font-weight:bold}.result{border:2px solid var(--blue);border-radius:14px;padding:24px;background:#fffdf8}.result-heading{display:flex;gap:15px;justify-content:space-between;align-items:center}.result-heading output{font-size:36px;font-weight:bold;white-space:nowrap;color:var(--blue)}.comfort-scale{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin:35px 0 14px;border-radius:10px}.scale-zone{padding:16px 4px;text-align:center;color:white}.scale-zone:first-child{border-radius:10px 0 0 10px}.scale-zone:last-of-type{border-radius:0 10px 10px 0}.scale-zone b,.scale-zone span{display:block}.scale-zone b{font-size:17px}.scale-zone span{font-size:17px}.low{background:#a64d3d}.normal{background:#40694f}.high{background:#ae6b30}.scale-marker{position:absolute;top:-12px;width:25px;height:25px;border:4px solid #27343b;background:#fffdf8;border-radius:50%;transform:translateX(-50%);left:0;transition:left .7s ease;box-shadow:0 2px 4px #0003}.small{font-size:17px;color:#616864}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 0;border-top:1px solid #d8d7ce;border-bottom:1px solid #d8d7ce}.metrics span,.metrics strong{display:block}.metrics strong{font-size:25px;margin-top:4px}.metrics span{font-size:17px;color:#616864}#pump-status{margin-bottom:0;font-weight:bold}.notice{padding:16px;background:#f2e9dd;border-left:4px solid #ae6b30;border-radius:4px}.actions{display:flex;gap:12px;margin:20px 0 30px}.actions button{background:#e8eef2;border:2px solid var(--blue);border-radius:8px;padding:13px 18px;min-height:48px;flex:1}.actions button:last-child{background:transparent}.pump-demo details{border-top:1px solid #c9cec7;padding:20px 0}.pump-demo summary{cursor:pointer;font-weight:bold;font-size:20px;min-height:44px}.pump-demo details p{margin:16px 0}.pump-demo a{color:var(--blue);text-underline-offset:3px}.assumption-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}.table-wrap{overflow:auto}.pump-demo table{width:100%;border-collapse:collapse;font-size:17px}.pump-demo th,.pump-demo td{text-align:left;border-bottom:1px solid #d8d7ce;padding:13px 9px}.footer-note{font-size:17px;color:#616864;margin-top:30px}#regulation{padding:15px 0}#regulation input{width:100%;min-height:44px;accent-color:var(--green)}[hidden]{display:none!important}@keyframes water-flow{to{stroke-dashoffset:-42}}@media(max-width:700px){.pump-demo{padding:20px 16px 35px}.topline{font-size:14px;align-items:start}.draft-tag{font-size:14px;max-width:160px}.intro{font-size:19px}.setup{display:block;padding:16px}.supply{margin-top:16px}.fixtures{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 28px;padding-bottom:40px}.fixture{min-height:140px;padding:10px}.fixture b{font-size:18px;overflow-wrap:normal}.fixture svg{width:45px;height:45px}.diagram{padding:0 16px 25px}.pump-row{grid-template-columns:1fr 1.1fr 1fr;gap:8px;margin-top:24px}.pump-frame{padding:5px;border-width:2px}.pump-frame img{height:78px}.pump-frame figcaption{font-size:16px;margin:4px 0}.gauge-label{font-size:17px}.gauge-box strong{font-size:18px}.result{padding:17px 12px}.result-heading h2{font-size:22px}.result-heading output{font-size:27px}.scale-zone b{font-size:14px}.scale-zone span{font-size:16px}.metrics strong{font-size:22px}.actions{flex-direction:column}.assumption-grid{grid-template-columns:1fr}.pump-demo td,.pump-demo th{padding:10px 5px}.supply-caption{font-size:16px}.scale-marker{width:22px;height:22px;border-width:3px}}@media(prefers-reduced-motion:reduce){.needle,.scale-marker{transition:none}.pipe-flow{animation:none}}

#pump-demo .assessment{border:1px solid #40694f;border-radius:12px;padding:22px;margin:24px 0}#pump-demo .quality-badge{display:inline-block;background:#e5efe5;color:#40694f;padding:10px 14px;border-radius:8px}#pump-demo .review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}#pump-demo .review-grid a{display:flex;flex-direction:column;gap:8px;border:1px solid #365c7b;border-radius:8px;padding:14px;color:#365c7b}#pump-demo .supply label{display:block}#pump-demo .supply select{width:100%}

body>main.pump-demo{margin:var(--header) auto 0;padding-top:28px;height:auto;overflow:visible}#pump-demo .fixture svg{width:64px;height:64px;stroke-width:2}#pump-demo .pump-contact{padding:24px;border:2px solid #246d6b;border-radius:12px;margin:28px 0}#pump-demo .pump-contact .button{display:block;text-align:center;white-space:normal;background:#e4efeb;color:#246d6b}#pump-demo .verdict-list>div{padding:14px 0;border-bottom:1px solid #d8d7ce}#pump-demo .verdict-list dt{font-weight:bold;color:#365c7b}#pump-demo .verdict-list dd{margin:5px 0 0}#pump-demo .hero-messengers{margin-top:18px}#pump-demo .hero-messengers a{font-size:18px;padding:14px 5px;text-align:center}#pump-demo .review-grid{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}#pump-demo .table-wrap{max-width:100%}@media(max-width:700px){#pump-demo .pump-contact,#pump-demo .assessment{padding:16px}#pump-demo h1{font-size:32px;overflow-wrap:break-word}}
/* Long model names must fit the same mobile frame and select. */
#pump-demo .setup label{min-width:0}#pump-demo .pump-frame{min-width:0}#pump-demo .pump-frame figcaption{overflow-wrap:anywhere}#pump-demo #pump-model{max-width:100%;min-width:0}#pump-demo #catalog-state{margin-bottom:0}#pump-demo #photo-source{overflow-wrap:anywhere}

/* Comparison and reference catalogue use the existing palette. */
#pump-demo .comparison{margin:28px 0;padding:20px 0;border-top:2px solid #365c7b}
#pump-demo .comparison small{display:block;color:#616864;font-size:14px;margin-top:5px}
#pump-demo .comparison button{border:1px solid #365c7b;border-radius:7px;background:#e8eef2;text-align:left;padding:10px;min-height:44px;font-weight:bold;font-size:16px;overflow-wrap:anywhere}
#pump-demo .selected-pump{background:#e4eee5}
#pump-demo .reference-card{padding:20px 0;border-bottom:1px solid #c9cec7;overflow-wrap:anywhere}
#pump-demo .reference-card img{width:100%;height:180px;object-fit:contain;background:white;border-radius:10px}
#pump-demo .reference-card h3{font-size:22px}#pump-demo .reference-card dt{font-weight:bold}#pump-demo .reference-card dd{margin:4px 0 16px}
#pump-demo .scale-range{position:absolute;top:-5px;height:7px;background:#ae6b30;border:1px solid #27343b}
@media(max-width:700px){#pump-demo .result-heading{flex-wrap:wrap}#pump-demo .gauge-box strong{font-size:15px;overflow-wrap:anywhere}#pump-demo .comparison table{font-size:14px}#pump-demo .comparison button{font-size:14px;padding:8px 5px}#pump-demo .comparison td{vertical-align:top}#pump-demo .metrics strong{font-size:20px}}