/* ===================================
   PARTICLES CANVAS STYLING
   =================================== */

.particles-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

/* Particle animations for different icons */
@keyframes particleFloat {
    0%, 100% {
        transform: translateY(0) translateX(0) rotate(0deg);
        opacity: 0.3;
    }
    25% {
        opacity: 0.6;
    }
    50% {
        transform: translateY(-20px) translateX(10px) rotate(180deg);
        opacity: 0.8;
    }
    75% {
        opacity: 0.4;
    }
}

@keyframes particleFloat2 {
    0%, 100% {
        transform: translateY(0) translateX(0) rotate(0deg);
        opacity: 0.2;
    }
    33% {
        opacity: 0.7;
    }
    50% {
        transform: translateY(-30px) translateX(-15px) rotate(-180deg);
        opacity: 0.5;
    }
    66% {
        opacity: 0.6;
    }
}

@keyframes particleFloat3 {
    0%, 100% {
        transform: translateY(0) translateX(0) rotate(0deg) scale(1);
        opacity: 0.4;
    }
    50% {
        transform: translateY(-25px) translateX(20px) rotate(90deg) scale(1.2);
        opacity: 0.7;
    }
}