@media screen and (max-width: 1200px) {
    :root {
        --headerBg: rgba(255,255,255,1);
        --headerHeight: 3.5rem;
    }

    header {
        padding: 0;
    }

    header .container {
        width: 100%;
    }

    .logo-mobile-box {
        width: 100%;
        justify-content: center;
        height: var(--headerHeight);
    }

    .logo-box {
        width: 100%;
    }

    .logo-link img {
        width: unset;
        height: calc(var(--headerHeight) - 1rem);
    }

    .menu {
        height: unset;
        max-height: 0;
        transition: max-height 0.5s ease-in-out;
        overflow: hidden;
    }

    .menu .link {
        font-size: 1rem;
        padding: 0 1rem;
        border-bottom: unset;
    }

    .menu .link.active {
        background: unset;
    }

    .menu .link.active a {
        color: #0a4b78;
    }

    .menu .link a {
        border-bottom: 1px solid #eee;
        padding: 1rem 0;
        width: 100%;
    }

    .sub-menu .link:first-of-type {
        margin-top: 0;
    }
}