.blur-overlay {
    position: absolute;
    inset: 0;
    backdrop-filter: blur(5px); /* Regola il valore del blur qui */
    z-index: 5;

    /* Proprietà per iOS */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    will-change: transform;
}

@keyframes move {
    100% {
        transform: translate3d(0, 0, 1px) rotate(360deg);
    }
}

.background {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #1d1838;
    overflow: hidden;
}

.background span {
    width: 20vmin;
    height: 20vmin;
    border-radius: 20vmin;
    backface-visibility: hidden;
    position: absolute;
    animation: move;
    animation-duration: 400s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


.background span:nth-child(0) {
    color: #7b68ee;
    top: 36%;
    left: 77%;
    animation-duration: 27s;
    animation-delay: -31s;
    transform-origin: -1vw -9vh;
    box-shadow: 40vmin 0 5.540096096549488vmin currentColor;
}
.background span:nth-child(1) {
    color: #e6e6fa;
    top: 69%;
    left: 24%;
    animation-duration: 9s;
    animation-delay: -15s;
    transform-origin: 21vw 15vh;
    box-shadow: -40vmin 0 5.781225628805604vmin currentColor;
}
.background span:nth-child(2) {
    color: #ffd784;
    top: 33%;
    left: 43%;
    animation-duration: 33s;
    animation-delay: -38s;
    transform-origin: -1vw -17vh;
    box-shadow: -40vmin 0 5.763789385485928vmin currentColor;
}
.background span:nth-child(3) {
    color: #ffd784;
    top: 13%;
    left: 53%;
    animation-duration: 46s;
    animation-delay: -33s;
    transform-origin: 7vw 9vh;
    box-shadow: -40vmin 0 5.662640287989426vmin currentColor;
}
.background span:nth-child(4) {
    color: #ffd784;
    top: 66%;
    left: 67%;
    animation-duration: 35s;
    animation-delay: -13s;
    transform-origin: 9vw -3vh;
    box-shadow: 40vmin 0 5.842609540439338vmin currentColor;
}
.background span:nth-child(5) {
    color: #e6e6fa;
    top: 67%;
    left: 41%;
    animation-duration: 17s;
    animation-delay: -22s;
    transform-origin: -3vw -8vh;
    box-shadow: -40vmin 0 5.239610412525262vmin currentColor;
}
.background span:nth-child(6) {
    color: #e6e6fa;
    top: 81%;
    left: 100%;
    animation-duration: 20s;
    animation-delay: -24s;
    transform-origin: 5vw -21vh;
    box-shadow: -40vmin 0 5.938254645201346vmin currentColor;
}
.background span:nth-child(7) {
    color: #ffd784;
    top: 87%;
    left: 51%;
    animation-duration: 32s;
    animation-delay: -20s;
    transform-origin: -20vw 4vh;
    box-shadow: -40vmin 0 5.1725901724700325vmin currentColor;
}
.background span:nth-child(8) {
    color: #e6e6fa;
    top: 18%;
    left: 56%;
    animation-duration: 38s;
    animation-delay: -31s;
    transform-origin: 8vw 14vh;
    box-shadow: 40vmin 0 5.581388992849791vmin currentColor;
}
.background span:nth-child(9) {
    color: #ffd784;
    top: 60%;
    left: 67%;
    animation-duration: 48s;
    animation-delay: -37s;
    transform-origin: 19vw 24vh;
    box-shadow: -40vmin 0 5.537049299071889vmin currentColor;
}
.background span:nth-child(10) {
    color: #ffd784;
    top: 65%;
    left: 68%;
    animation-duration: 15s;
    animation-delay: -6s;
    transform-origin: -9vw 16vh;
    box-shadow: -40vmin 0 5.2227118771708vmin currentColor;
}
.background span:nth-child(11) {
    color: #e6e6fa;
    top: 49%;
    left: 76%;
    animation-duration: 20s;
    animation-delay: -28s;
    transform-origin: -23vw -22vh;
    box-shadow: -40vmin 0 5.678988518826872vmin currentColor;
}
.background span:nth-child(12) {
    color: #e6e6fa;
    top: 73%;
    left: 23%;
    animation-duration: 25s;
    animation-delay: -30s;
    transform-origin: 3vw 22vh;
    box-shadow: 40vmin 0 5.915555541111049vmin currentColor;
}
.background span:nth-child(13) {
    color: #7b68ee;
    top: 60%;
    left: 96%;
    animation-duration: 12s;
    animation-delay: -42s;
    transform-origin: 13vw 7vh;
    box-shadow: -40vmin 0 5.545289848547535vmin currentColor;
}
.background span:nth-child(14) {
    color: #e6e6fa;
    top: 48%;
    left: 40%;
    animation-duration: 16s;
    animation-delay: -28s;
    transform-origin: -19vw -22vh;
    box-shadow: 40vmin 0 5.212593894120014vmin currentColor;
}
.background span:nth-child(15) {
    color: #ffd784;
    top: 53%;
    left: 95%;
    animation-duration: 44s;
    animation-delay: -5s;
    transform-origin: 12vw 25vh;
    box-shadow: -40vmin 0 5.527099119354164vmin currentColor;
}
.background span:nth-child(16) {
    color: #ffd784;
    top: 24%;
    left: 48%;
    animation-duration: 40s;
    animation-delay: -49s;
    transform-origin: -5vw 7vh;
    box-shadow: 40vmin 0 5.9584264022212565vmin currentColor;
}
.background span:nth-child(17) {
    color: #7b68ee;
    top: 29%;
    left: 20%;
    animation-duration: 44s;
    animation-delay: -40s;
    transform-origin: 0vw -5vh;
    box-shadow: -40vmin 0 5.931530262566924vmin currentColor;
}
.background span:nth-child(18) {
    color: #ffd784;
    top: 95%;
    left: 37%;
    animation-duration: 41s;
    animation-delay: -42s;
    transform-origin: 19vw -19vh;
    box-shadow: -40vmin 0 5.559896066080032vmin currentColor;
}
.background span:nth-child(19) {
    color: #ffd784;
    top: 5%;
    left: 80%;
    animation-duration: 32s;
    animation-delay: -18s;
    transform-origin: 3vw -14vh;
    box-shadow: -40vmin 0 5.723326929973467vmin currentColor;
}