/* ==========================================================================
   EP Maintain - animations.css
   Scroll reveals, water / pressure-wash effects, keyframes
   All motion is disabled under prefers-reduced-motion (see bottom of file).
   ========================================================================== */

/* ==========================================================================
   1. Scroll reveal system (driven by IntersectionObserver in theme.js)
   ========================================================================== */
[data-ep-reveal]{
	opacity:0;
	will-change:opacity,transform;
	transition:
		opacity .85s var(--ep-ease-out),
		transform .95s var(--ep-ease-out),
		filter .85s var(--ep-ease-out);
	transition-delay:var(--ep-delay,0ms);
}
[data-ep-reveal="up"]{transform:translate3d(0,42px,0);}
[data-ep-reveal="down"]{transform:translate3d(0,-32px,0);}
[data-ep-reveal="left"]{transform:translate3d(-52px,0,0);}
[data-ep-reveal="right"]{transform:translate3d(52px,0,0);}
[data-ep-reveal="zoom"]{transform:scale(.9);}
[data-ep-reveal="blur"]{filter:blur(14px);transform:translate3d(0,26px,0);}
[data-ep-reveal="rise"]{transform:translate3d(0,64px,0) rotate(1.4deg);}
[data-ep-reveal].is-revealed{opacity:1;transform:none;filter:none;}

/* Line-by-line headline reveal */
.ep-split-line{display:block;overflow:hidden;}
.ep-split-line>span{
	display:block;transform:translateY(110%);
	animation:epLineUp .95s var(--ep-ease-out) forwards;
	animation-delay:var(--ep-delay,0ms);
}
@keyframes epLineUp{to{transform:translateY(0);}}

@keyframes epUnderline{to{transform:scaleX(1);}}

@keyframes epDrawerIn{to{opacity:1;transform:translateX(0);}}

/* ==========================================================================
   2. Pressure-wash "jet" hero animation
   The jet is a CSS-only cone of spray with animated droplets layered on top
   of an optional <canvas> particle field.
   ========================================================================== */
.ep-jet{
	position:absolute;z-index:1;pointer-events:none;
	width:min(720px,78vw);height:min(520px,58vw);
	right:-6%;bottom:-4%;
	mask-image:linear-gradient(100deg,transparent 0%,#000 22%,#000 78%,transparent 100%);
}
.ep-jet__cone{
	position:absolute;inset:0;
	background:conic-gradient(from 190deg at 92% 88%,
		transparent 0deg,
		rgba(99,220,238,.00) 4deg,
		rgba(99,220,238,.16) 10deg,
		rgba(163,240,250,.30) 16deg,
		rgba(99,220,238,.14) 22deg,
		transparent 28deg);
	filter:blur(6px);
	transform-origin:92% 88%;
	animation:epJetSweep 7s var(--ep-ease) infinite;
	opacity:.85;
}
.ep-jet__core{
	position:absolute;right:8%;bottom:12%;
	width:64%;height:3px;border-radius:3px;transform-origin:right center;
	background:linear-gradient(270deg,rgba(190,248,255,.95),rgba(99,220,238,.5) 42%,transparent 100%);
	filter:blur(1px);
	animation:epJetSweep 7s var(--ep-ease) infinite,epJetPulse 1.1s ease-in-out infinite;
}
.ep-jet__nozzle{
	position:absolute;right:6%;bottom:9%;width:22px;height:22px;border-radius:50%;
	background:radial-gradient(circle,rgba(190,248,255,.95) 0%,rgba(53,185,206,.35) 55%,transparent 72%);
	filter:blur(2px);
	animation:epNozzleGlow 1.6s ease-in-out infinite;
}
@keyframes epJetSweep{
	0%,100%{transform:rotate(-9deg);}
	50%{transform:rotate(7deg);}
}
@keyframes epJetPulse{
	0%,100%{opacity:.75;height:3px;}
	50%{opacity:1;height:4px;}
}
@keyframes epNozzleGlow{
	0%,100%{opacity:.6;transform:scale(1);}
	50%{opacity:1;transform:scale(1.25);}
}

/* Droplet field */
.ep-drops{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;}
.ep-drop{
	position:absolute;top:-10%;
	width:2px;height:14px;border-radius:2px;
	background:linear-gradient(rgba(190,248,255,0),rgba(190,248,255,.85));
	opacity:0;
	animation:epDropFall linear infinite;
}
@keyframes epDropFall{
	0%{transform:translate3d(0,-10vh,0) scaleY(.6);opacity:0;}
	8%{opacity:.85;}
	80%{opacity:.6;}
	100%{transform:translate3d(-40px,110vh,0) scaleY(1.5);opacity:0;}
}

/* Mist / steam clouds */
.ep-mist{position:absolute;inset:auto 0 -10% 0;height:46%;pointer-events:none;z-index:1;overflow:hidden;}
.ep-mist span{
	position:absolute;bottom:0;border-radius:50%;
	background:radial-gradient(circle,rgba(190,248,255,.16) 0%,transparent 70%);
	filter:blur(14px);
	animation:epMistDrift linear infinite;
}
@keyframes epMistDrift{
	0%{transform:translate3d(0,20%,0) scale(.85);opacity:0;}
	20%{opacity:.7;}
	100%{transform:translate3d(-160px,-70%,0) scale(1.45);opacity:0;}
}

/* Water ripple ring pulses */
.ep-ripple{
	position:absolute;border-radius:50%;pointer-events:none;
	border:1px solid rgba(99,220,238,.4);
	animation:epRipple 3.6s var(--ep-ease-out) infinite;
}
@keyframes epRipple{
	0%{transform:scale(.4);opacity:.8;}
	100%{transform:scale(2.4);opacity:0;}
}

/* Animated wave path */
.ep-wave svg path{animation:epWaveShift 12s ease-in-out infinite alternate;}
@keyframes epWaveShift{
	0%{transform:translateX(0);}
	100%{transform:translateX(-3%);}
}

/* Marquee */
@keyframes epMarquee{
	from{transform:translate3d(0,0,0);}
	to{transform:translate3d(-50%,0,0);}
}

/* ==========================================================================
   3. Grime-reveal panel (hover / drag to "wash" the surface clean)
   ========================================================================== */
.ep-reveal-panel{--ep-wash-x:-30%;--ep-wash-y:50%;}
.ep-reveal-panel__layer--clean{
	transition:-webkit-mask-position .35s var(--ep-ease-out),mask-position .35s var(--ep-ease-out);
}
.ep-reveal-panel.is-auto .ep-reveal-panel__layer--clean{
	animation:epWashSweep 9s var(--ep-ease) infinite;
	transition:none;
}
@keyframes epWashSweep{
	0%{-webkit-mask-position:-40% 50%;mask-position:-40% 50%;}
	45%{-webkit-mask-position:130% 50%;mask-position:130% 50%;}
	55%{-webkit-mask-position:130% 50%;mask-position:130% 50%;}
	100%{-webkit-mask-position:-40% 50%;mask-position:-40% 50%;}
}
.ep-reveal-panel__jet{
	position:absolute;z-index:2;width:120px;height:120px;pointer-events:none;
	left:var(--ep-jet-x,10%);top:var(--ep-jet-y,50%);transform:translate(-50%,-50%);
	background:radial-gradient(circle,rgba(190,248,255,.55) 0%,rgba(99,220,238,.18) 40%,transparent 70%);
	filter:blur(4px);opacity:0;transition:opacity .3s var(--ep-ease);
}
.ep-reveal-panel:hover .ep-reveal-panel__jet{opacity:1;}

/* ==========================================================================
   4. Micro-interactions
   ========================================================================== */
.ep-float{animation:epFloat 6s ease-in-out infinite;}
@keyframes epFloat{
	0%,100%{transform:translateY(0);}
	50%{transform:translateY(-14px);}
}

.ep-pulse-ring{position:relative;}
.ep-pulse-ring::after{
	content:"";position:absolute;inset:-6px;border-radius:inherit;
	border:2px solid var(--ep-aqua);opacity:0;
	animation:epPulseRing 2.4s var(--ep-ease-out) infinite;
}
@keyframes epPulseRing{
	0%{transform:scale(.94);opacity:.7;}
	70%{transform:scale(1.14);opacity:0;}
	100%{opacity:0;}
}

.ep-shine{position:relative;overflow:hidden;}
.ep-shine::after{
	content:"";position:absolute;top:0;bottom:0;width:60%;
	background:var(--ep-grad-sheen);transform:translateX(-160%) skewX(-18deg);
	animation:epShine 5.5s var(--ep-ease-out) infinite;
}
@keyframes epShine{
	0%,72%{transform:translateX(-160%) skewX(-18deg);}
	100%{transform:translateX(230%) skewX(-18deg);}
}

/* Icon draw-on */
.ep-draw path,.ep-draw circle,.ep-draw line,.ep-draw polyline,.ep-draw rect{
	stroke-dasharray:var(--len,300);stroke-dashoffset:var(--len,300);
}
.is-revealed .ep-draw path,.is-revealed .ep-draw circle,.is-revealed .ep-draw line,
.is-revealed .ep-draw polyline,.is-revealed .ep-draw rect{
	animation:epDraw 1.4s var(--ep-ease-out) forwards;
}
@keyframes epDraw{to{stroke-dashoffset:0;}}

/* Number counter */
.ep-count{font-variant-numeric:tabular-nums;}

/* Parallax layers */
[data-ep-parallax]{will-change:transform;}

/* Cursor-follow glow on hero */
.ep-glow{
	position:absolute;inset:0;z-index:-1;pointer-events:none;
	background:radial-gradient(340px circle at var(--ep-mx,50%) var(--ep-my,50%),rgba(99,220,238,.16),transparent 62%);
	opacity:0;transition:opacity .6s var(--ep-ease);
}
.ep-hero:hover .ep-glow{opacity:1;}

/* Page load bar */
.ep-page-loader{
	position:fixed;inset:0;z-index:9999;background:var(--ep-navy-ink);
	display:grid;place-items:center;
	transition:opacity .6s var(--ep-ease),visibility .6s;
}
.ep-page-loader.is-done{opacity:0;visibility:hidden;}
.ep-page-loader__mark{width:min(240px,60vw);animation:epFloat 3s ease-in-out infinite;}

/* ==========================================================================
   5. Reduced motion
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{
		animation-duration:.001ms!important;
		animation-iteration-count:1!important;
		transition-duration:.001ms!important;
		scroll-behavior:auto!important;
	}
	[data-ep-reveal]{opacity:1!important;transform:none!important;filter:none!important;}
	.ep-split-line>span{transform:none!important;}
	.ep-jet,.ep-drops,.ep-mist,.ep-hero__canvas{display:none!important;}
	.ep-hero h1 .ep-hl::after{transform:scaleX(1)!important;}
}
