/**
 * SiteEngine Performance Animation Utilities
 */

/* Core Configuration Defaults */
[class*="se-animate-"] {
	--se-dur: 0.6s; /* Default execution duration */
	--se-del: 0.7s;   /* Default start delay */
}

/* 1. Fade Up Effect */
.se-animate-fade-up {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity var(--se-dur) cubic-bezier(0.16, 1, 0.3, 1), 
	            transform var(--se-dur) cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--se-del);
}
.se-animate-fade-up.in-view {
	opacity: 1;
	transform: translateY(0);
}

/* 2. Horizontal Slide In */
.se-animate-slide-left {
	opacity: 0;
	transform: translateX(-40px);
	transition: opacity var(--se-dur) cubic-bezier(0.16, 1, 0.3, 1), 
	            transform var(--se-dur) cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--se-del);
}
.se-animate-slide-left.in-view {
	opacity: 1;
	transform: translateX(0);
}

/* 3. Cover Swipe / Reveal Effect */
.se-animate-reveal {
	position: relative;
	clip-path: inset(0 100% 0 0);
	transition: clip-path var(--se-dur) cubic-bezier(0.76, 0, 0.24, 1);
	transition-delay: var(--se-del);
}
.se-animate-reveal.in-view {
	clip-path: inset(0 0 0 0);
}

/* --- TIMING MODIFIER UTILITIES --- */

/* Start Delay Modifiers */
.se-delay-100  { --se-del: 0.1s; }
.se-delay-200  { --se-del: 0.2s; }
.se-delay-300  { --se-del: 0.3s; }
.se-delay-400  { --se-del: 0.4s; }
.se-delay-500  { --se-del: 0.5s; }
.se-delay-600  { --se-del: 0.6s; }
.se-delay-800  { --se-del: 0.8s; }
.se-delay-1000 { --se-del: 1s; }

/* Execution Duration Modifiers */
.se-duration-300  { --se-dur: 0.3s; }
.se-duration-400  { --se-dur: 0.4s; }
.se-duration-600  { --se-dur: 0.6s; }
.se-duration-800  { --se-dur: 0.8s; }
.se-duration-1000 { --se-dur: 1s; }
.se-duration-1500 { --se-dur: 1.5s; }
.se-duration-2000 { --se-dur: 2s; }

/* Performance Guard: Honor OS motion limits */
@media (prefers-reduced-motion: reduce) {
	[class*="se-animate-"] {
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
		transition: none !important;
	}
}