/* ======= Логотип ======= */
.logo {
    position: absolute;
    width: 700px;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: transform 2s ease, width 2s ease, top 2s ease, left 2.5s ease; /* Плавний перехід */
    z-index: 3;
    opacity: 1;
}

/* Зменшений стан логотипа після початкової анімації */
.logo.mini {

    width: 280px;
    height: auto;
    top: 20px;
    left: 20px;
    transform: translate(0, 0); /* Логотип переміщується у верхній лівий кут */
    opacity: 1;
}

.logo img {
    width: 100%;
    height: auto;
}

/* ======= Адаптивність ======= */
@media (max-width: 370px) {
    .logo.mini {
        width: 200px; /* Плавне зменшення логотипа */


    }
}


@media (max-width: 270px) {
    .logo.mini {
        width: 150px; /* Ще менше для вузьких екранів */

    }
}