/* Scroll-Triggered Animations with GSAP */

/* Initialize elements for scroll animations */
[data-animate] {
	opacity: 0;
}

/* Fade In Animation */
[data-animate="fadeIn"] {
	opacity: 0;
}

/* Slide In From Left */
[data-animate="slideInLeft"] {
	opacity: 0;
	transform: translateX(-50px);
}

/* Slide In From Right */
[data-animate="slideInRight"] {
	opacity: 0;
	transform: translateX(50px);
}

/* Slide In From Top */
[data-animate="slideInTop"] {
	opacity: 0;
	transform: translateY(-50px);
}

/* Slide In From Bottom */
[data-animate="slideInBottom"] {
	opacity: 0;
	transform: translateY(50px);
}

/* Zoom In */
[data-animate="zoomIn"] {
	opacity: 0;
	transform: scale(0.9);
}

/* Zoom Out */
[data-animate="zoomOut"] {
	opacity: 0;
	transform: scale(1.1);
}

/* Rotate In */
[data-animate="rotateIn"] {
	opacity: 0;
	transform: rotate(-10deg);
}

/* Float In */
[data-animate="floatIn"] {
	opacity: 0;
	transform: translateY(30px);
}

/* Bounce In */
[data-animate="bounceIn"] {
	opacity: 0;
	transform: scale(0.85);
}

/* Pulse */
@keyframes pulse {
	0%, 100% {
		opacity: 1;
	}
	50% {
		opacity: 0.7;
	}
}

[data-animate="pulse"] {
	animation: pulse 2s ease-in-out infinite;
}

/* Animated classes for completed animations */
.animated {
	opacity: 1;
	transform: none;
}

/* Stagger effect for multiple elements */
.stagger-item {
	--stagger-delay: 0s;
}

.stagger-item:nth-child(1) { --stagger-delay: 0s; }
.stagger-item:nth-child(2) { --stagger-delay: 0.1s; }
.stagger-item:nth-child(3) { --stagger-delay: 0.2s; }
.stagger-item:nth-child(4) { --stagger-delay: 0.3s; }
.stagger-item:nth-child(5) { --stagger-delay: 0.4s; }
.stagger-item:nth-child(n+6) { --stagger-delay: 0.5s; }

/* Section animations */
section {
	--animate-delay: 0s;
}

section:nth-of-type(1) { --animate-delay: 0s; }
section:nth-of-type(2) { --animate-delay: 0.1s; }
section:nth-of-type(3) { --animate-delay: 0.2s; }
section:nth-of-type(n+4) { --animate-delay: 0.3s; }

/* Card/post animations */
.post, .card, [data-type="card"] {
	opacity: 0;
}

/* Image animations */
img[data-animate], 
.image-container img {
	opacity: 0;
}

/* Text animations */
h1[data-animate], 
h2[data-animate], 
h3[data-animate], 
p[data-animate] {
	opacity: 0;
}

/* Button hover effects that work with scroll animations */
button[data-animate]:hover,
a.button[data-animate]:hover,
input[type="submit"][data-animate]:hover {
	transform: translateY(-2px);
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

/* List items */
li[data-animate] {
	opacity: 0;
	transform: translateX(-20px);
}

/* Auto-detect common elements for animation */
article {
	opacity: 0;
}

.post-preview {
	opacity: 0;
}

.content-block {
	opacity: 0;
}

/* Ensure animated elements have smooth transitions */
[data-animate],
.will-animate {
	will-change: opacity, transform;
}