/* ============================================
   NEURAL NETWORK ANIMATION
   Matrix-style graph with spreading activation
   ============================================ */

.neural-network-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    background: linear-gradient(160deg, 
        #050d18 0%, 
        #0a1628 30%,
        #0d1f3c 60%,
        #102a4c 100%);
}

.neural-network-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Subtle depth gradient overlay */
.neural-network-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 60%;
    height: 100%;
    background: radial-gradient(ellipse at 20% 30%, 
        rgba(0, 119, 182, 0.12) 0%, 
        transparent 50%);
    pointer-events: none;
    z-index: 1;
}

.neural-network-container::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    height: 60%;
    background: radial-gradient(ellipse at 80% 70%, 
        rgba(72, 202, 228, 0.08) 0%, 
        transparent 50%);
    pointer-events: none;
    z-index: 1;
}

/* Ensure content is above */
.neural-network-vignette {
    display: none;
}

/* Responsive */
@media (max-width: 768px) {
    .neural-network-canvas {
        opacity: 0.8;
    }
}

/* Reduced motion - show static state */
@media (prefers-reduced-motion: reduce) {
    .neural-network-container {
        background: linear-gradient(160deg, 
            #050d18 0%, 
            #0a1628 50%,
            #0d1f3c 100%);
    }
}
