.orb {
    position: fixed;
    width: 15px;  /* Ridotto rispetto alla dimensione precedente */
    height: 15px;  /* Ridotto rispetto alla dimensione precedente */
    background: radial-gradient(circle, rgba(255, 255, 255, 0.8), transparent 70%);
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.7);
    animation: float 6s ease-in-out infinite;
}

/* Animazione del movimento dell'orb */
@keyframes float {
    0% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(80px, -100px) scale(1.1);
    }
    50% {
        transform: translate(-150px, 50px) scale(0.9);
    }
    75% {
        transform: translate(100px, -30px) scale(1.2);
    }
    100% {
        transform: translate(0, 0) scale(1);
    }
}

/* Media Query per schermi più piccoli (max-width: 768px) */
@media screen and (max-width: 768px) {
    .orb {
        width: 15px;  /* Diminuisce la dimensione */
        height: 15px; /* Diminuisce la dimensione */
        animation-duration: 8s; /* Aumenta la durata dell'animazione */
    }
}

/* Media Query per schermi ancora più piccoli (max-width: 480px) */
@media screen and (max-width: 480px) {
    .orb {
        width: 10px;  /* Ancora più piccole per dispositivi molto piccoli */
        height: 10px; /* Ancora più piccole per dispositivi molto piccoli */
        animation-duration: 10s; /* Animazione più lenta */
    }
}

/* Media Query per schermi molto grandi (max-width: 1200px) */
@media screen and (min-width: 1200px) {
    .orb {
        width: 30px;  /* Aumenta la dimensione per schermi grandi */
        height: 30px; /* Aumenta la dimensione per schermi grandi */
        animation-duration: 5s; /* Velocizza l'animazione */
    }
}