/**
 * Animations CSS + hooks pour GSAP / ScrollTrigger
 */

@keyframes djizhub-fade-up {
	from {
		opacity: 0;
		transform: translate3d(0, 24px, 0);
	}
	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes djizhub-glow-pulse {
	0%,
	100% {
		box-shadow: 0 0 20px rgba(0, 198, 255, 0.12);
	}
	50% {
		box-shadow: 0 0 36px rgba(0, 198, 255, 0.28);
	}
}

@keyframes djizhub-shimmer {
	0% {
		background-position: 200% 0;
	}
	100% {
		background-position: -200% 0;
	}
}

.djizhub-reveal {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	will-change: opacity, transform;
}

.djizhub-reveal.is-inview {
	animation: djizhub-fade-up var(--duration-slow) var(--ease-out) forwards;
}

.djizhub-glow-hover {
	transition: box-shadow var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out);
}

.djizhub-glow-hover:hover {
	box-shadow: var(--shadow-glow);
	transform: translateY(-2px);
}

.djizhub-shimmer-line {
	background: linear-gradient(
		90deg,
		transparent,
		rgba(0, 198, 255, 0.25),
		transparent
	);
	background-size: 200% 100%;
	animation: djizhub-shimmer 2.5s linear infinite;
}

.djizhub-pulse-accent {
	animation: djizhub-glow-pulse 3s ease-in-out infinite;
}

/* Réduction des mouvements (accessibilité) */
@media (prefers-reduced-motion: reduce) {
	.djizhub-reveal,
	.djizhub-reveal.is-inview {
		animation: none;
		opacity: 1;
		transform: none;
	}

	.djizhub-shimmer-line {
		animation: none;
	}

	.djizhub-pulse-accent {
		animation: none;
	}
}