/* SMH Water V14: clear hero and a six-product lineup. */
.ws-water-v13 .wn-hero-shade{display:none;background:none}
.ws-water-v13 .wn-hero-content,.ws-water-v13 .wn-hero-bottom{width:min(520px,calc(46vw - 56px));margin:0 0 0 max(28px,calc((100% - 1240px)/2))}
.ws-water-v13 .wn-hero h1{font-size:clamp(3.2rem,5.1vw,5.5rem)}
.ws-water-v13 .wn-hero h1{text-shadow:0 2px 3px #000,0 5px 16px #000b}
.ws-water-v13 .wn-hero-copy{max-width:610px;text-shadow:0 1px 1px #000,1px 0 1px #000,-1px 0 1px #000,0 -1px 1px #000,0 2px 7px #000}
.ws-water-v13 .wn-hero .wn-eyebrow,.ws-water-v13 .wn-hero-points,.ws-water-v13 .wn-hero-bottom>a{text-shadow:0 1px 1px #000,1px 0 1px #000,-1px 0 1px #000,0 -1px 1px #000,0 2px 7px #000}
.ws-water-v13 .wn-hero-backdrop>iframe{transition:opacity .45s ease;pointer-events:none}
.ws-water-v13 .wn-featuring{box-shadow:0 7px 30px #00182521}
.ws-water-v13 .wn-hero-bottom{justify-content:flex-start}
.ws-water-v13 .wn-flow{background:radial-gradient(ellipse at 85% 5%,#0a5265 0,transparent 55%),linear-gradient(145deg,#071d30,#082b40 65%,#073949)}
.ws-water-v13 .wn-flow-board{background:linear-gradient(145deg,#0c2a3e,#09273a 60%,#0a3144);border-color:#87b4c23b;border-radius:22px;box-shadow:0 24px 85px #0012225c,inset 0 1px #a9e5f016}
.wn-flow-cutaway{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 28px;border-bottom:1px solid #8ab5c51c;background:#c8f4ff04;color:#c2e0e9;font-size:.84rem;letter-spacing:.02em}
.wn-flow-cutaway>span:first-child{display:flex;align-items:center;gap:10px}
.wn-flow-cutaway>span:last-child{font-size:.73rem;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;color:#92bacb}
.wn-flow-cutaway i{width:8px;height:8px;border-radius:50%;background:#8fd9e8;box-shadow:0 0 15px #8fd9e860;flex:none}
.ws-water-v13 .wn-flow-topline{padding-top:24px;color:#bcdce8}
.ws-water-v13 .wn-flow-canvas{aspect-ratio:1200/570}
.wn-flow-scene{position:relative;isolation:isolate}
.wn-flow-scene>.wn-flow-canvas{position:relative;z-index:1}
.wn-flow-scene>.wn-flow-layer{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.wn-flow-scene>.wn-flow-layer:last-child{z-index:2}
.ws-water-v13 .wn-flow-tabs{padding:0 26px;gap:12px}
.ws-water-v13 .wn-flow-tabs button{border-radius:12px;transition:background .2s,border-color .2s,box-shadow .2s;background:#11374a}
.ws-water-v13 .wn-flow-tabs button:hover{background:#17475a;border-color:#7cc2d499}
.ws-water-v13 .wn-flow-tabs button[aria-pressed=true]{background:linear-gradient(135deg,#215368,#153d50);border-color:#9de4f1a6;box-shadow:inset 0 1px #c2efff24,0 5px 16px #00172526}
.ws-water-v13 .wn-stage-description{min-height:4.5em;color:#cae5ee;font-size:1.04rem;line-height:1.8}
@media(max-width:760px){
 .ws-water-v13 .wn-hero-copy{font-size:1.15rem}
 .wn-flow-cutaway{padding:17px 18px;font-size:.78rem;gap:10px;align-items:flex-start}
 .wn-flow-cutaway>span:last-child{font-size:.64rem;line-height:1.7}
 .wn-flow-cutaway>span:first-child{align-items:flex-start;line-height:1.6}
 .wn-flow-cutaway i{margin-top:6px;width:6px;height:6px}
 .ws-water-v13 .wn-flow-tabs{padding:0 18px;gap:9px}
 .ws-water-v13 .wn-stage-description{font-size:1rem;min-height:0}
}
@media(max-width:900px){
 /* A clear landscape frame avoids tinting or tightly cropping the video on
    phones. The readable copy sits in its own section immediately below it. */
 .ws-water-v13 .wn-hero{display:block;min-height:0;background:#081e29}
 .ws-water-v13 .wn-hero-backdrop{position:relative;inset:auto;z-index:0;width:100%;aspect-ratio:16/9;background-position:center}
 .ws-water-v13 .wn-hero-shade{display:none}
 .ws-water-v13 .wn-hero-content,.ws-water-v13 .wn-hero-bottom{width:min(640px,calc(100% - 40px));margin:0 auto}
 .ws-water-v13 .wn-hero-content{padding-top:32px;padding-bottom:32px}
 .ws-water-v13 .wn-hero h1{font-size:clamp(3rem,8.6vw,5.1rem)}
 .ws-water-v13 .wn-hero-copy{max-width:none;text-shadow:none}
 .ws-water-v13 .wn-hero-points,.ws-water-v13 .wn-hero .wn-eyebrow,.ws-water-v13 .wn-hero-bottom>a{text-shadow:none}
 .ws-water-v13 .wn-hero-bottom{padding-top:20px;padding-bottom:24px}
}
@media(prefers-reduced-motion:reduce){.ws-water-v13 .wn-hero-backdrop>iframe,.ws-water-v13 .wn-flow-tabs button{transition:none}}

/* Three whole-property systems lead the lineup. Conditioning and the two
   point-of-use options follow in the same reading order at every width. */
.ws-water-v14 .wn-product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ws-water-v14 .wn-product{min-width:0;padding:26px}
.ws-water-v14 .wn-product-image{height:240px;margin:18px 0 20px}
.ws-water-v14 .wn-product-image img{max-width:100%;max-height:240px}
.ws-water-v14 .wn-product h3{min-height:2.4em;margin:4px 0 13px;font-size:1.75rem;line-height:1.2}
.ws-water-v14 .wn-product-nanofiber{background:#e0f1f5}
.ws-water-v14 .wn-product-ro{background:#eee8fb}
.ws-water-v14 .wn-product-ro img{max-width:94%;max-height:218px;border-radius:8px}
/* Direct product links land below the fixed navigation. */
.ws-water-v14 [id="nanofiber"],.ws-water-v14 [id="reverse-osmosis"]{scroll-margin-top:120px}
@media(max-width:960px){
 .ws-water-v14 .wn-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:580px){
 .ws-water-v14 .wn-product-grid{grid-template-columns:minmax(0,1fr);gap:16px}
 .ws-water-v14 .wn-product{padding:22px}
 .ws-water-v14 .wn-product-image{height:210px;margin:10px 0}
 .ws-water-v14 .wn-product-image img{max-height:210px}
 .ws-water-v14 .wn-product h3{min-height:0;font-size:1.5rem;margin:10px 0}
 .ws-water-v14 .wn-product-ro img{max-width:100%;max-height:190px}
}
