/* --- BACKGROUND ANIMATIONS --- */

/* Moves the grid infinitely */
@keyframes gridMove {
    0% {
        transform: perspective(500px) rotateX(60deg) translateY(0);
    }
    100% {
        /* Moves exactly one grid-tile size (60px) to create seamless loop */
        transform: perspective(500px) rotateX(60deg) translateY(60px); 
    }
}

/* Floats the glowing blobs around */
@keyframes floatBlob {
    0% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(50px, 100px) scale(1.1);
    }
    66% {
        transform: translate(-20px, 50px) scale(0.9);
    }
    100% {
        transform: translate(0, 0) scale(1);
    }
}