/* ===== Effluent Works: oomph layer (v10, Oct 2026) =====
   Bolder light, depth and motion over the v2 site. Screen only; print and reduced-motion are left alone. */
@property --ew-a{syntax:'<angle>';initial-value:0deg;inherits:false}
@media screen{
:root{--ew-grad:linear-gradient(90deg,#8e1bf5,#5b22e6 35%,#0a84ff 70%,#2eea4a);--ew-conic:conic-gradient(from var(--ew-a),#8e1bf5,#0a84ff,#2eea4a,#5b22e6,#8e1bf5)}

/* ---------- Hero: taller, slow push-in on the photo, punchier headline ---------- */
.hero:not(.hero-sub) .hero-img{height:clamp(230px,34vw,480px)}
.hero-img picture{animation:ewKen 30s ease-in-out infinite alternate;transform-origin:62% 70%}
@keyframes ewKen{from{transform:scale(1.02)}to{transform:scale(1.13) translate3d(-1.2%,-.8%,0)}}
.hero-img::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,5,8,.18) 0%,rgba(5,5,8,0) 30%,rgba(11,6,24,0) 62%,rgba(11,6,24,.6) 100%),radial-gradient(60% 80% at 50% 120%,rgba(142,27,245,.35),transparent 70%)}
.hero h1{font-size:clamp(1.55rem,3.9vw,2.75rem);text-shadow:0 6px 30px rgba(142,27,245,.35)}
.hero h1 span{background:linear-gradient(90deg,#b77cff,#5bb0ff 30%,#4df07a 50%,#b77cff 70%,#5bb0ff);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;animation:ewShim 9s linear infinite;text-shadow:none;filter:drop-shadow(0 4px 22px rgba(91,176,255,.35))}
@keyframes ewShim{to{background-position:-250% 0}}
.hero .eyebrow{display:inline-flex;align-items:center;gap:10px}
.hero .eyebrow::before{content:"";width:26px;height:2px;border-radius:2px;background:var(--ew-grad)}

/* ---------- Buttons: light sweep, deeper glow, ring pulse on the hero call ---------- */
.btn-call{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(90deg,#8e1bf5,#5b22e6 55%,#3a4bff)}
.btn-call::before{content:"";position:absolute;top:-2px;bottom:-2px;left:-45%;width:32%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);animation:ewSheen 6s ease-in-out infinite;pointer-events:none}
@keyframes ewSheen{0%,72%{left:-45%}100%{left:135%}}
.btn-call:hover{transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(142,27,245,1),0 0 0 4px rgba(142,27,245,.2)}
.hero .btn-row .btn-call,.cta .btn-call{animation:ewRing 3.2s ease-out infinite}
@keyframes ewRing{0%{box-shadow:0 10px 24px -12px rgba(142,27,245,.9),0 0 0 0 rgba(142,27,245,.55)}70%,100%{box-shadow:0 10px 24px -12px rgba(142,27,245,.9),0 0 0 16px rgba(142,27,245,0)}}
.btn-ghost{transition:transform .15s,background .2s,border-color .2s,box-shadow .2s}
.btn-ghost:hover{transform:translateY(-2px);border-color:#b77cff;box-shadow:0 0 0 4px rgba(142,27,245,.15),0 12px 28px -14px rgba(142,27,245,.8)}

/* ---------- Spinning gradient edge on the cards that matter ---------- */
.glance,.price.feature,.ff-bar{border:1.5px solid transparent!important;animation:ewSpin 7s linear infinite}
@keyframes ewSpin{to{--ew-a:360deg}}
.glance{background:linear-gradient(#0c0919,#0c0919) padding-box,var(--ew-conic) border-box;box-shadow:0 30px 70px -30px rgba(142,27,245,.75),0 0 0 1px rgba(255,255,255,.03)}
.price.feature{background:linear-gradient(var(--card),var(--card)) padding-box,var(--ew-conic) border-box;box-shadow:0 34px 80px -34px rgba(142,27,245,.9),var(--shadow)}
.ff-bar{background:radial-gradient(120% 140% at 100% 0%,#2a0f5e 0%,#0b0620 55%,#07070c 100%) padding-box,var(--ew-conic) border-box;box-shadow:0 30px 80px -36px rgba(142,27,245,.85),var(--shadow)}
.glance dd,.price .amt,.price b{text-shadow:0 0 18px rgba(109,181,255,.25)}

/* ---------- Cards: lift, cursor spotlight, glowing icons ---------- */
.card,.price,.stats li{--mx:50%;--my:-30%}
.card{transition:transform .28s cubic-bezier(.2,.7,.2,1),border-color .28s,box-shadow .28s;overflow:hidden}
.card::after,.price::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(380px circle at var(--mx) var(--my),rgba(142,27,245,.2),rgba(10,132,255,.06) 40%,transparent 62%)}
.price{position:relative}
.card:hover::after,.price:hover::after{opacity:1}
.link-card:hover,.card.step:hover{transform:translateY(-6px);border-color:rgba(162,75,255,.5);box-shadow:0 34px 70px -34px rgba(142,27,245,.75),var(--shadow)}
.ico{box-shadow:0 0 0 6px rgba(142,27,245,.1),0 12px 26px -8px rgba(91,34,230,.8),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.link-card:hover .ico{transform:translateY(-3px) rotate(-6deg) scale(1.08)}
.link-card .more svg{transition:transform .25s}
.link-card:hover .more svg{transform:translateX(5px)}
.price{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.price:hover{transform:translateY(-6px)}

/* ---------- Stats: the numbers were rendering as solid bars; gradient text restored, bigger ---------- */
.stats li{position:relative;overflow:hidden;transition:transform .3s,border-color .3s}
.stats li:hover{transform:translateY(-4px);border-color:rgba(162,75,255,.45)}
.stats b{background:linear-gradient(90deg,#ead8ff,#8fc6ff 55%,#7df07a)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent;color:transparent;font-size:clamp(2.3rem,4.8vw,3.3rem)!important;filter:drop-shadow(0 6px 18px rgba(142,27,245,.4))}
.stats li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--ew-grad);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.stats li.ew-in::after{transform:scaleX(1)}
.stats li:nth-child(2)::after{transition-delay:.12s}.stats li:nth-child(3)::after{transition-delay:.24s}.stats li:nth-child(4)::after{transition-delay:.36s}

/* ---------- Section labels: a gradient tick before each kicker ---------- */
.kicker{display:inline-flex;align-items:center;gap:10px}
.kicker::before{content:"";width:26px;height:2px;border-radius:2px;background:var(--ew-grad);flex:none}

/* ---------- Call to action band: moving aurora ---------- */
.cta::after{content:"";position:absolute;inset:-40% -20%;pointer-events:none;background:conic-gradient(from 200deg at 30% 50%,transparent 0deg,rgba(142,27,245,.28) 60deg,transparent 120deg,rgba(10,132,255,.22) 200deg,transparent 260deg,rgba(46,234,74,.14) 320deg,transparent 360deg);filter:blur(40px);animation:ewAur 22s linear infinite;opacity:.9}
@keyframes ewAur{to{transform:rotate(360deg)}}
.cta>.wrap{position:relative;z-index:1}

/* ---------- Big moving strip of services under the hero ---------- */
.ew-marq{position:relative;overflow:hidden;background:#050508;border-block:1px solid rgba(255,255,255,.07);padding:18px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ew-marq .t{display:flex;width:max-content;gap:0;animation:ewMarq 48s linear infinite}
.ew-marq:hover .t{animation-play-state:paused}
.ew-marq span{font-family:"EW Wide","EW Display",Inter,sans-serif;font-style:italic;font-weight:900;text-transform:uppercase;font-size:clamp(1.3rem,3.4vw,2.4rem);line-height:1.05;letter-spacing:.01em;white-space:nowrap;padding:0 .55em;display:inline-flex;align-items:center;gap:.55em;color:#ECE8FF;text-shadow:0 1px 14px rgba(142,27,245,.35)}
.ew-marq span:nth-child(odd){color:transparent;text-shadow:none;background:linear-gradient(90deg,#b77cff,#5bb0ff 60%,#4df07a);-webkit-background-clip:text;background-clip:text}
.ew-marq span::after{content:"";width:.42em;height:.55em;flex:none;background:url(/assets/ew-drop.svg) center/contain no-repeat;opacity:.9}
@keyframes ewMarq{to{transform:translate3d(-50%,0,0)}}

/* ---------- Towns ticker in the service areas section ---------- */
.ew-towns{overflow:hidden;margin:0 0 18px;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ew-towns .t{display:flex;width:max-content;animation:ewMarq 70s linear infinite}
.ew-towns span{white-space:nowrap;padding:8px 16px;margin-right:10px;border-radius:999px;border:1px solid rgba(160,190,255,.18);background:rgba(142,27,245,.08);color:#d8dcf0;font-size:14px;font-weight:600}

/* ---------- Inside your treatment plant (home page diagram) ---------- */
.ew-plant .sec-head{margin-bottom:22px}
.ew-plant-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:22px;align-items:start}
.ew-fig{position:relative;margin:0;border-radius:var(--r);padding:clamp(10px,2vw,22px);background:radial-gradient(90% 90% at 70% 0%,rgba(91,34,230,.22),transparent 70%),linear-gradient(180deg,#0b0a18,#07070d);border:1px solid rgba(160,190,255,.16);box-shadow:0 40px 90px -50px rgba(142,27,245,.9),var(--shadow);overflow:hidden}
.ew-fig svg{display:block;width:100%;height:auto}
.ew-fig figcaption{font-size:13px;color:var(--muted);margin-top:8px;padding:0 4px}
.ew-stages{display:flex;flex-direction:column;gap:10px}
.ew-stage{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:start;text-align:left;width:100%;border-radius:16px;padding:14px 16px;background:var(--card);border:1px solid var(--line);color:var(--text);font:inherit;cursor:pointer;transition:border-color .25s,background .25s,transform .25s,box-shadow .25s}
.ew-stage:hover{border-color:rgba(162,75,255,.45)}
.ew-stage:focus-visible{outline:2px solid #b77cff;outline-offset:2px}
.ew-stage .n{grid-row:span 2;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,#8e1bf5,#0a84ff);box-shadow:0 8px 18px -8px rgba(142,27,245,.9)}
.ew-stage b{color:#fff;font-size:16px}
.ew-stage .d{display:none;color:var(--text);font-size:14.5px;line-height:1.5}
.ew-stage .d em{display:block;font-style:normal;color:var(--muted);margin-bottom:4px}
.ew-stage[aria-expanded="true"]{background:linear-gradient(160deg,rgba(142,27,245,.24),rgba(10,132,255,.08)) padding-box,linear-gradient(#0f0d1d,#0f0d1d) padding-box,var(--ew-conic) border-box;border:1.5px solid transparent;animation:ewSpin 7s linear infinite;box-shadow:0 22px 50px -30px rgba(142,27,245,.9)}
.ew-stage[aria-expanded="true"] .d{display:block}
.ew-after{margin:4px 0 0;font-size:14.5px;color:#d3d9ea;display:flex;gap:10px;align-items:center}
.ew-after::before{content:"";width:10px;height:10px;border-radius:50%;flex:none;background:#2eea4a;box-shadow:0 0 0 4px rgba(46,234,74,.18)}
/* diagram moving parts */
.ew-fig .flow{stroke-dasharray:6 10;animation:ewFlow 1.4s linear infinite}
.ew-fig .flow.slow{animation-duration:2.6s}
@keyframes ewFlow{to{stroke-dashoffset:-32}}
.ew-fig .bub{animation:ewBub var(--d,3.2s) linear infinite;animation-delay:var(--e,0s);transform-box:fill-box}
@keyframes ewBub{0%{transform:translate(0,0);opacity:0}10%{opacity:.95}85%{opacity:.8}100%{transform:translate(var(--x,4px),-178px);opacity:0}}
.ew-fig .surf{animation:ewSurf 6s ease-in-out infinite alternate}
@keyframes ewSurf{to{transform:translateX(-40px)}}
.ew-fig .spray{stroke-dasharray:3 9;animation:ewFlow 1s linear infinite}
.ew-fig .alarm{animation:ewBlink 2.4s ease-in-out infinite}
@keyframes ewBlink{0%,100%{opacity:.35}50%{opacity:1}}
.ew-fig .zone{fill:rgba(142,27,245,0);stroke:rgba(183,124,255,0);stroke-width:3;transition:fill .4s,stroke .4s}
.ew-fig .zone.on{fill:rgba(142,27,245,.12);stroke:rgba(183,124,255,.85);filter:drop-shadow(0 0 10px rgba(142,27,245,.8))}
.ew-fig .pin{cursor:pointer}
.ew-fig .pin circle.r{animation:ewPin 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}
.ew-fig .pin.on circle.c{fill:#fff}.ew-fig .pin.on text{fill:#3a1490}
@keyframes ewPin{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.1);opacity:0}}
@media (max-width:860px){.ew-plant-grid{grid-template-columns:1fr}}
@media (max-width:560px){.hero .eyebrow::before{display:none}}
}
@media screen and (prefers-reduced-motion:reduce){
.hero-img picture,.hero h1 span,.btn-call::before,.hero .btn-row .btn-call,.cta .btn-call,.glance,.price.feature,.ff-bar,.cta::after,.ew-marq .t,.ew-towns .t,.ew-stage[aria-expanded="true"],.ew-fig .flow,.ew-fig .bub,.ew-fig .surf,.ew-fig .spray,.ew-fig .alarm,.ew-fig .pin circle.r{animation:none!important}
.ew-marq,.ew-towns{-webkit-mask:none;mask:none}
.ew-marq .t,.ew-towns .t{flex-wrap:wrap;width:auto;justify-content:center}
.ew-marq .dup,.ew-towns .dup{display:none}
.ew-fig .bub{opacity:.6}
}
@media screen{.ew-fig .b1{--d:3s;--e:-.2s;--x:6px}.ew-fig .b2{--d:2.6s;--e:-1.1s;--x:-4px}.ew-fig .b3{--d:3.4s;--e:-2s;--x:8px}.ew-fig .b4{--d:2.8s;--e:-.6s;--x:-6px}.ew-fig .b5{--d:3.1s;--e:-1.7s;--x:5px}.ew-fig .b6{--d:2.5s;--e:-.9s;--x:-3px}.ew-fig .b7{--d:3.5s;--e:-2.6s;--x:7px}.ew-fig .b8{--d:2.7s;--e:-.3s;--x:-5px}.ew-fig .b9{--d:3.2s;--e:-1.4s;--x:4px}.ew-fig .b10{--d:2.4s;--e:-2.2s;--x:3px}.ew-fig .b11{--d:2.2s;--e:-.5s;--x:-2px}.ew-fig .b12{--d:2.9s;--e:-1.9s;--x:2px}.ew-fig .s2{animation-delay:-.4s}.ew-fig .s3{animation-delay:-.7s}}
