/* ============================================
   Private FLITE – Page section animations
   Fade + slide: right-to-left, left-to-right, top-to-bottom, bottom-to-top
   Triggers on view (Intersection Observer) – works without scroll
   ============================================ */

/* Base: hidden until .pf-ani-in is added */
.pf-ani {
	opacity: 0;
	transform: translateZ(0);
	will-change: opacity, transform;
	transition-property: opacity, transform;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.pf-ani.pf-ani-in {
	opacity: 1;
}

/* Duration variants */
.pf-ani.pf-ani-duration-1 { transition-duration: 0.5s; }
.pf-ani.pf-ani-duration-2 { transition-duration: 0.65s; }
.pf-ani.pf-ani-duration-3 { transition-duration: 0.85s; }
.pf-ani.pf-ani-duration-4 { transition-duration: 1s; }

/* Delay variants (stagger children) */
.pf-ani.pf-ani-delay-0 { transition-delay: 0s; }
.pf-ani.pf-ani-delay-1 { transition-delay: 0.1s; }
.pf-ani.pf-ani-delay-2 { transition-delay: 0.2s; }
.pf-ani.pf-ani-delay-3 { transition-delay: 0.3s; }
.pf-ani.pf-ani-delay-4 { transition-delay: 0.4s; }
.pf-ani.pf-ani-delay-5 { transition-delay: 0.5s; }
.pf-ani.pf-ani-delay-6 { transition-delay: 0.6s; }

/* ---- Right to left (element enters from right, moves left) ---- */
.pf-ani-fade-left {
	transform: translate(60px, 0) translateZ(0);
}
.pf-ani-fade-left.pf-ani-in {
	transform: translate(0, 0) translateZ(0);
}

/* ---- Left to right (element enters from left, moves right) ---- */
.pf-ani-fade-right {
	transform: translate(-60px, 0) translateZ(0);
}
.pf-ani-fade-right.pf-ani-in {
	transform: translate(0, 0) translateZ(0);
}

/* ---- Top to bottom (element enters from top, moves down) ---- */
.pf-ani-fade-down {
	transform: translate(0, -50px) translateZ(0);
}
.pf-ani-fade-down.pf-ani-in {
	transform: translate(0, 0) translateZ(0);
}

/* ---- Bottom to top (element enters from bottom, moves up) ---- */
.pf-ani-fade-up {
	transform: translate(0, 50px) translateZ(0);
}
.pf-ani-fade-up.pf-ani-in {
	transform: translate(0, 0) translateZ(0);
}

/* ---- Simple fade ---- */
.pf-ani-fade {
	transform: translateZ(0);
}
.pf-ani-fade.pf-ani-in {
	transform: translateZ(0);
}

/* Slightly stronger motion for visibility (Panamera-style) */
.pf-ani-strong.pf-ani-fade-left { transform: translate(80px, 0) translateZ(0); }
.pf-ani-strong.pf-ani-fade-right { transform: translate(-80px, 0) translateZ(0); }
.pf-ani-strong.pf-ani-fade-down { transform: translate(0, -70px) translateZ(0); }
.pf-ani-strong.pf-ani-fade-up { transform: translate(0, 70px) translateZ(0); }

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
	.pf-ani {
		transition-duration: 0.01ms !important;
		transform: none !important;
	}
	.pf-ani.pf-ani-in { transform: none !important; }
}