/* ─── AURORA BACKGROUND ─────────────────────────────────────── */
.aurora-layer {
    position: fixed;
    inset: 0;
    z-index: -2; /* Sotto al network-canvas */
    overflow: hidden;
    pointer-events: none;
}

.orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0;
    animation: orbFloat linear infinite;
    will-change: transform, opacity;
}

.orb-1 {
    width: 900px; height: 900px;
    background: radial-gradient(circle, rgba(255,255,255,0.7) 0%, transparent 75%);
    top: -20%; left: -15%;
    animation-duration: 18s;
    animation-delay: 0s;
}

.orb-2 {
    width: 800px; height: 800px;
    background: radial-gradient(circle, rgba(255,255,255,0.6) 0%, transparent 75%);
    top: 20%; right: -15%;
    animation-duration: 24s;
    animation-delay: -8s;
}

.orb-3 {
    width: 750px; height: 750px;
    background: radial-gradient(circle, rgba(200,220,255,0.5) 0%, transparent 75%);
    bottom: -15%; left: 25%;
    animation-duration: 16s;
    animation-delay: -14s;
}

@keyframes orbFloat {
    0%   { opacity: 0; transform: translate(0px, 0px) scale(1); }
    15%  { opacity: 1; }
    50%  { transform: translate(60px, -40px) scale(1.08); }
    85%  { opacity: 1; }
    100% { opacity: 0; transform: translate(0px, 0px) scale(1); }
}

/* Mobile adjustments to make background darker */
@media (max-width: 768px) {
    .aurora-layer {
        opacity: 0.25;
    }
}