/* assets/css/animations.css */

/* Base Wrapper for Backgrounds */
.bg-animated-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    pointer-events: none; /* Let clicks pass through to content */
}

/* Ensure sections containing these are positioned correctly */
.has-animated-bg {
    position: relative;
    z-index: 1; /* Content sits above the bg wrapper */
}

/* 1. Aurora Background */
.bg-aurora {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    animation: aurora_wave 20s ease-in-out infinite alternate;
}

@keyframes aurora_wave {
    0% { transform: scale(1.05) translate(0, 0); filter: brightness(1); }
    50% { transform: scale(1.1) translate(-2%, 2%); filter: brightness(1.2); }
    100% { transform: scale(1.05) translate(2%, -2%); filter: brightness(1); }
}

/* 2. Glow Pulse */
.bg-glow-pulse {
    background-size: cover;
    background-position: center;
    animation: glow_pulse 8s ease-in-out infinite alternate;
}

@keyframes glow_pulse {
    0% { filter: contrast(1) brightness(0.9); }
    100% { filter: contrast(1.1) brightness(1.1); }
}

/* 3. Slow Gradient */
.bg-slow-gradient {
    background: linear-gradient(135deg, rgba(20,20,25,1) 0%, rgba(35,30,20,1) 50%, rgba(15,15,20,1) 100%);
    background-size: 200% 200%;
    animation: slow_gradient_move 15s ease infinite;
}

@keyframes slow_gradient_move {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 4. Glass Light Pattern */
.bg-glass-pattern {
    background-size: cover;
    background-position: center;
    animation: glass_light 12s ease-in-out infinite alternate;
}

@keyframes glass_light {
    0% { transform: scale(1) translateY(0); filter: saturate(0.8); }
    100% { transform: scale(1.02) translateY(-1%); filter: saturate(1.2); }
}

/* Performance & Accessibility Rules */
@media (prefers-reduced-motion: reduce) {
    .bg-aurora,
    .bg-glow-pulse,
    .bg-slow-gradient,
    .bg-glass-pattern {
        animation: none !important;
        transform: none !important;
        filter: none !important;
    }
}