/* 
    Amber Nexus Scroll Animations
    Lightweight, performance-optimized, and SEO-friendly
*/

/* Initial hidden states */
.animate {
    opacity: 0;
    transition-property: opacity, transform, filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 0.8s;
    will-change: opacity, transform, filter;
}

/* Animations types */
.fade-up {
    transform: translateY(30px);
}

.fade-down {
    transform: translateY(-30px);
}

.fade-left {
    transform: translateX(30px);
}

.fade-right {
    transform: translateX(-30px);
}

.fade-in {
    transform: scale(0.98);
}

.blur-in {
    filter: blur(10px);
}

/* Active states (triggered by JS) */
.animate.animated {
    opacity: 1;
    transform: translate(0) scale(1);
    filter: blur(0);
}

/* Staggering utility (optional, JS handles custom delays) */
.stagger-items > * {
    opacity: 0;
}

/* Accessibility: Respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce) {
    .animate {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}

/* Background Parallax (Lightweight) */
.parallax-bg {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

@media (max-width: 1024px) {
    .parallax-bg {
        background-attachment: scroll; /* Performance on mobile */
    }
}