@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeInDown {
	from {
		opacity: 0;
		transform: translateY(-30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeInLeft {
	from {
		opacity: 0;
		transform: translateX(-30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fadeInRight {
	from {
		opacity: 0;
		transform: translateX(30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes countUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes scrollDown {
	0% {
		opacity: 0;
		transform: scaleY(0);
		transform-origin: top;
	}
	50% {
		opacity: 1;
		transform: scaleY(1);
		transform-origin: top;
	}
	51% {
		transform-origin: bottom;
	}
	100% {
		opacity: 0;
		transform: scaleY(0);
		transform-origin: bottom;
	}
}

@keyframes carouselScroll {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
	}
}

@keyframes carouselScrollReverse {
	0% {
		transform: translateX(-50%);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes pulse {
	0% {
		box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
	}
	50% {
		box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4),
		            0 0 0 12px rgba(37, 211, 102, 0.1);
	}
	100% {
		box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4),
		            0 0 0 20px rgba(37, 211, 102, 0);
	}
}

.animate-on-scroll {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s var(--ease-out-expo),
	            transform 0.6s var(--ease-out-expo);
	will-change: transform, opacity;
}

.animate-on-scroll.animated {
	opacity: 1;
	transform: none;
}

.animate-on-scroll--left {
	transform: translateX(-30px);
}

.animate-on-scroll--left.animated {
	transform: none;
}

.animate-on-scroll--right {
	transform: translateX(30px);
}

.animate-on-scroll--right.animated {
	transform: none;
}

.btn {
	transition: background-color var(--transition-fast),
	            color var(--transition-fast),
	            border-color var(--transition-fast),
	            transform var(--transition-fast),
	            box-shadow var(--transition-fast);
}

.btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.site-header {
	transition: background-color var(--transition-base),
	            height var(--transition-base),
	            box-shadow var(--transition-base);
}

.main-navigation a::after {
	transition: width var(--transition-base);
}

.mobile-menu,
.mobile-menu-overlay {
	transition: transform var(--transition-base);
}

.card {
	transition: transform var(--transition-base),
	            box-shadow var(--transition-base);
}

.product-card {
	transition: transform var(--transition-base),
	            box-shadow var(--transition-base);
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.animate-on-scroll {
		opacity: 1;
		transform: none;
		will-change: auto;
	}

	.whatsapp-float {
		animation: none;
	}
}
