/* Interactive scientific water intelligence page, THERO 2026 */
body[data-page="water"]{--water-ink:#113840;--water-blue:#147d9c;--water-moss:#3E7763;--water-coral:#BB615D;--water-sand:#D5AA64}
body[data-page="water"] .sector-impact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
body[data-page="water"] .sector-impact-stat{min-height:128px;background:linear-gradient(135deg,#f7fbfb,#e8f3f6);border-color:#cfe3e9;padding:14px}
body[data-page="water"] .sector-impact-stat:nth-child(3){grid-column:1/-1;min-height:112px;background:linear-gradient(130deg,#F2F8F6,#E1EFF2);flex-direction:row;align-items:center;gap:15px}
body[data-page="water"] .sector-impact-stat:nth-child(3) .sector-icon{width:44px;height:44px;flex:0 0 44px;margin:0;align-items:center}
body[data-page="water"] .sector-impact-stat:nth-child(3) strong{font-size:35px}
body[data-page="water"] .sector-impact-stat:nth-child(3) small{font-size:13px;margin:0 0 0 auto;max-width:44%}
body[data-page="water"] .sector-impact-stat strong{font-size:31px}
body[data-page="water"] .sector-impact-stat small{font-size:11px}
.water-lab-section{background:radial-gradient(circle at 90% 0%,#D9F0ED,transparent 26%),#F5F9F7;padding:86px 0 98px}
.water-lab-heading{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:31px}
.water-lab-heading>div{max-width:770px}
.water-lab-heading h2{font:900 clamp(32px,3.2vw,48px)/1.11 'Manrope',sans-serif;letter-spacing:-1.8px;margin:14px 0 0;color:#172329}
.water-lab-heading h2 em{font-style:normal;color:#187E8A}
.water-lab-heading>p{max-width:350px;color:#53686A;font-size:15px;line-height:1.72;margin:0}
.water-lab-board{background:#fff;border:1px solid #DBE9E7;overflow:hidden;border-radius:24px;box-shadow:0 20px 55px rgba(13,56,60,.09)}
.water-lab-visual-top{background:#14363C;color:#F5F9F8;display:flex;justify-content:space-between;align-items:center;padding:13px 26px;gap:10px;font-size:11px;letter-spacing:1.6px;font-weight:900}
.water-lab-visual-top>span:first-child{color:#D5B578}
.water-lab-visual-top i{width:9px;height:9px;border-radius:50%;display:inline-block;background:#89D0C3;margin-right:8px}
.water-lab-visual-top b{color:#DB9A7A}
.water-science-visual{background:linear-gradient(180deg,#E8F4F1,#FCFEFD);padding:17px 24px 13px}
.water-system-illustration{max-width:1150px;margin:0 auto;border:1px solid #d8e9e7;border-radius:17px;overflow:hidden}
.water-system-illustration svg{display:block;width:100%;height:auto;max-height:365px}
.water-dashed-line{animation:waterFlow 1.6s linear infinite}
@keyframes waterFlow{to{stroke-dashoffset:-30}}
.water-illustration-note{display:flex;align-items:center;justify-content:center;gap:25px;flex-wrap:wrap;margin-top:12px;font-size:11px;color:#5D7778;font-weight:800}
.water-illustration-note>span{display:inline-flex;align-items:center;gap:8px}
.water-illustration-note i{width:9px;height:9px;background:#1E8BA0;border-radius:50%;display:block}
.water-illustration-note>span:nth-child(2) i{background:#4B8A75}.water-illustration-note>span:nth-child(3) i{background:#C39B5A}
.water-flow-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#F2F7F5;padding:16px 16px 10px;gap:10px;border-top:1px solid #deebea;border-bottom:1px solid #d9e6e2}
.water-flow-step{min-width:0;display:flex;align-items:center;position:relative;gap:11px;text-align:left;padding:15px 14px;cursor:pointer;border-radius:13px;border:1px solid #d8e7e4;background:#fff;color:#203B40;transition:background .18s,transform .18s,border-color .18s,box-shadow .18s}
.water-flow-step:hover{transform:translateY(-2px);border-color:#79B8B0}
.water-flow-step:focus-visible{outline:3px solid #A75256;outline-offset:2px}
.water-flow-step.active{background:linear-gradient(125deg,#063F47,#117483);border-color:#0E7888;color:#fff;box-shadow:0 12px 27px rgba(8,79,89,.22)}
.water-step-number{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:#e6f3f1;color:#147B84;font:900 19px 'Manrope',sans-serif}
.water-flow-step.active .water-step-number{background:#F2F9F4;color:#0E6774}
.water-step-copy{display:grid;gap:4px;min-width:0}
.water-step-copy b{font:800 13px/1.3 'Manrope',sans-serif}
.water-step-copy small{font:600 10px/1.3 'DM Sans',sans-serif;color:#617B7D}
.water-flow-step.active small{color:#DBEFED}
.water-flow-arrow{position:absolute;right:-15px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:2px solid #F2F7F5;background:#d5aa63;color:#143d42;font-size:19px;z-index:2;border-radius:50%}
.water-stage-detail{display:grid;grid-template-columns:110px minmax(0,1fr) 235px;gap:26px;align-items:center;padding:28px 30px 30px;min-height:225px;background:#fff}
.water-detail-index{display:flex;flex-direction:column;align-self:stretch;align-items:flex-start;gap:7px;border-right:1px solid #D6E6E4;padding-right:18px}
.water-detail-number{font:900 66px/1 'Manrope',sans-serif;color:#147D8B}
.water-detail-type{font-size:9px;line-height:1.5;letter-spacing:1.4px;color:#AA7D40;font-weight:900}
.water-detail-body h3{font:900 clamp(23px,2.2vw,30px)/1.17 'Manrope',sans-serif;color:#15292D;letter-spacing:-.8px;margin:0 0 12px}
.water-detail-body p{font-size:14px;line-height:1.75;color:#4f6869;margin:0 0 14px;max-width:685px}
.water-detail-tags{display:flex;flex-wrap:wrap;gap:7px}
.water-detail-tags span{font-size:11px;font-weight:800;color:#22666C;border:1px solid #c8e3e0;background:#EFF8F6;padding:6px 9px;border-radius:24px}
.water-detail-output{align-self:stretch;display:flex;flex-direction:column;gap:12px;background:#123A42;color:#fff;padding:19px;border-radius:13px}
.water-detail-output>span{color:#E8C486;letter-spacing:1.5px;font-size:10px;font-weight:900}
.water-detail-output b{font:800 15px/1.5 'Manrope',sans-serif;color:#F1F7F4}
.water-detail-output a{color:#EBCB92;font-size:11px;font-weight:900;margin-top:auto}
.water-outcome-strip{display:flex;align-items:center;gap:20px;justify-content:space-between;background:#E6F0EC;border-top:1px solid #d9e7e1;padding:17px 28px}
.water-outcome-key{color:#13717D;font-weight:900;letter-spacing:1.4px;font-size:10px;white-space:nowrap}
.water-outcome-strip strong{font:800 13px/1.5 'DM Sans',sans-serif;color:#1B515B}
.water-outcome-strip strong i{font-style:normal;padding:0 7px;color:#B58247}
.water-lab-footnote{margin-top:18px;color:#4e6667;background:#E6F1ED;border-left:4px solid #A95359;padding:15px 19px;font-size:12px;line-height:1.75}
.water-lab-footnote b{color:#1e4f53}
@media(max-width:1100px){.water-stage-detail{grid-template-columns:83px minmax(0,1fr);gap:17px}.water-detail-output{grid-column:2;min-height:0}.water-flow-step{padding:12px 9px;gap:6px}.water-step-number{width:35px;height:35px;flex-basis:35px;font-size:16px}.water-step-copy b{font-size:12px}.water-step-copy small{font-size:9px}}
@media(max-width:760px){.water-lab-section{padding:60px 0}.water-lab-heading{flex-direction:column;align-items:start;gap:14px}.water-lab-heading>p{max-width:700px}.water-science-visual{padding:10px}.water-flow-track{grid-template-columns:repeat(2,minmax(0,1fr))}.water-flow-step:nth-child(2) .water-flow-arrow{display:none}.water-flow-step:nth-child(3) .water-flow-arrow{display:flex}.water-flow-step{padding:13px}.water-stage-detail{grid-template-columns:1fr;padding:22px;gap:17px}.water-detail-index{flex-direction:row;align-items:center;gap:13px;border:0;padding:0}.water-detail-number{font-size:45px}.water-detail-output{grid-column:1}.water-detail-body h3{font-size:23px}.water-outcome-strip{flex-direction:column;align-items:start;gap:6px}.water-lab-visual-top{font-size:9px}}
@media(max-width:480px){.water-lab-heading h2{font-size:30px}.water-flow-track{grid-template-columns:1fr;gap:8px}.water-flow-arrow{display:none!important}.water-step-copy b{font-size:13px}.water-step-copy small{font-size:11px}.water-flow-step{min-height:65px}.water-illustration-note{gap:9px;font-size:9px}.water-system-illustration svg{min-width:460px}.water-system-illustration{overflow:auto}.water-detail-tags span{font-size:10px}body[data-page="water"] .sector-impact-stat:nth-child(3){display:grid;grid-template-columns:36px 1fr;gap:5px 10px}body[data-page="water"] .sector-impact-stat:nth-child(3) small{grid-column:1/-1;max-width:none;margin:0}}
@media(prefers-reduced-motion:reduce){.water-dashed-line{animation:none}.water-flow-step{transition:none}}