#parallax-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    z-index: -2; /* Ensure it's behind everything else but above the body background */
    pointer-events: none; /* Allow interaction with elements behind the parallax */
    background-color: var(--bg-primary-transparent); /* Add a base background color */
}

.parallax-layer {
    position: absolute;
    color: rgba(255, 255, 255, 0.05); /* Very subtle white for icons */
    transition: transform 0.1s linear; /* Smooth transition for movement */
    will-change: transform; /* Optimize for animation */
}

/* Specific styling for different icon sizes if needed */
.parallax-layer .fa-2x { font-size: 2em; }
.parallax-layer .fa-3x { font-size: 3em; }
.parallax-layer .fa-4x { font-size: 4em; }
.parallax-layer .fa-5x { font-size: 5em; }

/* Responsive adjustments */
@media (max-width: 768px) {
    .parallax-layer {
        display: none; /* Hide parallax layers on smaller screens for performance/simplicity */
    }
}