/* Fade-In Animations */
.fade-in { opacity: 0; transition: opacity 1.5s ease-in-out; }
.fade-in.visible { opacity: 1; }

.fade-in-scale { opacity: 0; transform: scale(0.95); transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out; }
.fade-in-scale.visible { opacity: 1; transform: scale(1); }

.fade-in-left { opacity: 0; transform: translateX(-50px); transition: opacity 1.5s ease-out, transform 1.5s ease-out; }
.fade-in-left.visible { opacity: 1; transform: translateX(0); }

.fade-in-right { opacity: 0; transform: translateX(50px); transition: opacity 1.5s ease-out, transform 1.5s ease-out; }
.fade-in-right.visible { opacity: 1; transform: translateX(0); }

.fade-in-rotate { opacity: 0; transform: rotate(-15deg); transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out; }
.fade-in-rotate.visible { opacity: 1; transform: rotate(0); }

.fade-in-up { opacity: 0; transform: translateY(30px); transition: opacity 1.5s ease-out, transform 1.5s ease-out; }
.fade-in-up.visible { opacity: 1; transform: translateY(0); }

.fade-in-skew { opacity: 0; transform: skew(-10deg); transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out; }
.fade-in-skew.visible { opacity: 1; transform: skew(0); }