.gradient-background {
    background: linear-gradient(300deg, #0A2F1F, #1B5E3A, #0A2F1F);
    background-size: 180% 180%;
    animation: gradient-animation 12s ease infinite;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

@keyframes gradient-animation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.black-cat
{
    height: 77%;
    width: 77%;
    background:url('../images/cats/rag.png') center center no-repeat;
    background-size:cover;
    position: absolute;
}
.red-cat
{
    height: 77%;
    width: 77%;
    background:url('../images/cats/sia.png') center center no-repeat;
    background-size:cover;
    position: absolute;
    top:30px;
    left:30px;
}
.cat {
    position: absolute;
    max-width: 530px;
    max-height: 530px;
    width: 50vw;
    height: 50vw;
    top: 48%;
    z-index: 2;
    left: 52%;
    transform: translate(-50%, -50%);
    transition: transform 0.5s ease-in-out;
}

/* Kot 1 - lekko przesunięty w lewo */
.cat-1 {
    transform: translate(-150%, -50%); /* Zaczyna daleko na lewo */
    animation: slideCat1 1.5s ease-out forwards;
}

/* Kot 2 - startuje poza ekranem z prawej */
.cat-2 {
    transform: translate(50%, -50%); /* Zaczyna daleko na prawo */
    animation: slideCat2 1.5s ease-out forwards;
}
.blured-bg
{
    border-radius: var(--border-radius-medium);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


/* MOBILE: większy rozmiar kotów */
@media (max-width: 768px) {
    .cat {
        width: 90vw;
        height: 90vw;
    }
}

/* Animacja dla kota 1 */
@keyframes slideCat2 {
    from {
        transform: translate(-150%, -50%);
    }
    to {
        transform: translate(calc(-50% - 10px), calc(-50% - -60px));
    }
}

/* Animacja dla kota 2 */
@keyframes slideCat1 {
    from {
        transform: translate(50%, -50%);
    }
    to {
        transform: translate(calc(-50% + 10px), calc(-50% + 10px));
    }
}

.language-selector{
    width: 84px !important;
    padding-left: 9px;
    color: #eecd54;
}
.language-selector a, .l-selector
{
    padding: 3px !important;
    margin: 0 3px !important;
    color: #eecd54 !important;
}
.l-selector.selected, .l-selector a.selected {
    border: 1px solid #eecd54;
    border-radius: 0 !important;
    padding: 3px;
}