/* space-bg.css */
#space-background {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -999; /* Derrière tout le contenu */
    overflow: hidden;
}

#space-background svg {
    filter: blur(1px); /* Adoucit les étoiles pour qu'elles soient moins agressives */
    opacity: 0.8; /* Légère transparence pour mieux se fondre */
}

/* Nébuleuses */
.nebula {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    animation: drift 20s ease-in-out infinite alternate;
}

.nebula-1 {
    background: radial-gradient(circle, #9B59FF 0%, transparent 70%);
    width: 60vw;
    height: 60vh;
    top: -10%;
    left: -10%;
    opacity: 0.07;
    animation-duration: 25s;
}

.nebula-2 {
    background: radial-gradient(circle, #00C2FF 0%, transparent 70%);
    width: 50vw;
    height: 50vh;
    top: 40%;
    right: -5%;
    opacity: 0.055;
    animation-duration: 22s;
    animation-delay: -5s;
}

.nebula-3 {
    background: radial-gradient(circle, #FF6B9B 0%, transparent 70%);
    width: 70vw;
    height: 40vh;
    bottom: -10%;
    left: 20%;
    opacity: 0.04;
    animation-duration: 28s;
    animation-delay: -10s;
}

/* Animations */
@keyframes drift {
    0% { transform: translateY(0px) translateX(0px); }
    100% { transform: translateY(40px) translateX(30px); }
}

@keyframes twinkle {
    0% { opacity: 0.1; }
    100% { opacity: 1; }
}

/* Étoiles SVG */
.space-star {
    fill: #FFFFFF;
    animation: twinkle infinite ease-in-out alternate;
}