.background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}

.background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/img/background2.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    animation: imageFilter 20s ease-in-out infinite;
}

.background-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9); /* 90% затемнение */
    transition: background 1s ease-in-out; /* Плавное изменение фона */
    z-index: 1;
}

@keyframes imageFilter {
    0% {
        filter: hue-rotate(0deg) saturate(1) brightness(0.8);
    }
    25% {
        filter: hue-rotate(15deg) saturate(1.1) brightness(0.85);
    }
    50% {
        filter: hue-rotate(-10deg) saturate(1.2) brightness(0.9);
    }
    75% {
        filter: hue-rotate(20deg) saturate(0.9) brightness(0.75);
    }
    100% {
        filter: hue-rotate(0deg) saturate(1) brightness(0.8);
    }
}