/* Trending Animations for Elementor — core styles */

.eta-box {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	--eta-accent: #7c5cff;
	--eta-duration: 800ms;
	--eta-delay: 0ms;
	transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
	will-change: transform, opacity;
}

.eta-box-inner {
	position: relative;
	z-index: 2;
}

.eta-title {
	margin: 0 0 12px;
	font-size: 26px;
	line-height: 1.3;
}

.eta-desc {
	margin: 0 0 20px;
	opacity: .8;
	line-height: 1.6;
}

.eta-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 26px;
	border-radius: 999px;
	background: var(--eta-accent);
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	position: relative;
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}

.eta-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px -8px var(--eta-accent);
}

.eta-glow {
	position: absolute;
	inset: -40%;
	background: radial-gradient(circle at var(--eta-x, 50%) var(--eta-y, 50%), var(--eta-accent) 0%, transparent 60%);
	opacity: 0;
	z-index: 1;
	pointer-events: none;
	transition: opacity .4s ease;
}

/* ---------- 1. Fade In Up (scroll) ---------- */
.eta-effect-fade-up {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity var(--eta-duration) ease var(--eta-delay), transform var(--eta-duration) cubic-bezier(.22,1,.36,1) var(--eta-delay);
}
.eta-effect-fade-up.eta-in-view {
	opacity: 1;
	transform: translateY(0);
}

/* ---------- 2. Zoom Bounce (scroll) ---------- */
.eta-effect-zoom-bounce {
	opacity: 0;
	transform: scale(.7);
	transition: opacity var(--eta-duration) ease var(--eta-delay), transform var(--eta-duration) cubic-bezier(.34,1.56,.64,1) var(--eta-delay);
}
.eta-effect-zoom-bounce.eta-in-view {
	opacity: 1;
	transform: scale(1);
}

/* ---------- 3. Reveal Mask Wipe (scroll) ---------- */
.eta-effect-reveal-mask {
	clip-path: inset(0 100% 0 0);
	transition: clip-path var(--eta-duration) cubic-bezier(.65,0,.35,1) var(--eta-delay);
}
.eta-effect-reveal-mask.eta-in-view {
	clip-path: inset(0 0 0 0);
}

/* ---------- 4. Floating Loop ---------- */
.eta-effect-float {
	animation: eta-float 4.5s ease-in-out infinite;
	animation-delay: var(--eta-delay);
}
@keyframes eta-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-14px); }
}

/* ---------- 5. Glassmorphism Hover ---------- */
.eta-effect-glass-hover {
	background: rgba(255,255,255,0.06);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border: 1px solid rgba(255,255,255,0.15);
}
.eta-effect-glass-hover:hover {
	background: rgba(255,255,255,0.1);
	border-color: rgba(255,255,255,0.3);
	transform: translateY(-6px);
	box-shadow: 0 20px 40px -20px rgba(0,0,0,.5);
}

/* ---------- 6. Neon Glow Border ---------- */
.eta-effect-neon-glow {
	border: 2px solid var(--eta-accent);
	box-shadow: 0 0 8px var(--eta-accent), inset 0 0 8px rgba(124,92,255,.2);
	transition: box-shadow .4s ease;
}
.eta-effect-neon-glow:hover {
	box-shadow: 0 0 24px var(--eta-accent), 0 0 48px var(--eta-accent), inset 0 0 16px rgba(124,92,255,.35);
}

/* ---------- 7. 3D Tilt Card ---------- */
.eta-effect-tilt-3d {
	transform-style: preserve-3d;
	perspective: 800px;
	transition: transform .15s ease-out;
}

/* ---------- 8. Animated Gradient Shift ---------- */
.eta-effect-gradient-shift {
	background: linear-gradient(120deg, var(--eta-accent), #ff5c8a, #5cc8ff, var(--eta-accent));
	background-size: 300% 300%;
	animation: eta-gradient-move 6s ease infinite;
	color: #fff;
}
@keyframes eta-gradient-move {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

/* ---------- 9. Magnetic Button Pull ---------- */
.eta-effect-magnetic .eta-btn {
	transition: transform .15s ease-out;
}

/* ---------- 10. Shimmer Sweep ---------- */
.eta-effect-shimmer {
	position: relative;
}
.eta-effect-shimmer::after {
	content: "";
	position: absolute;
	top: 0;
	left: -150%;
	width: 60%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255,255,255,.25), transparent);
	transform: skewX(-20deg);
	animation: eta-shimmer-sweep 2.8s ease-in-out infinite;
	animation-delay: var(--eta-delay);
	z-index: 3;
	pointer-events: none;
}
@keyframes eta-shimmer-sweep {
	0% { left: -150%; }
	60%, 100% { left: 150%; }
}

@media (prefers-reduced-motion: reduce) {
	.eta-box, .eta-box * {
		animation: none !important;
		transition: none !important;
	}
	.eta-effect-fade-up, .eta-effect-zoom-bounce, .eta-effect-reveal-mask {
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
	}
}
