/* Language Switch */

.sticky .top-header {
    display: none;
}
.top-header .wrapper > a:after {
    width: 6px;
    height: 9px;
    left: 5px;
}
.top-header .wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: var(--font-size-14);
    line-height: var(--line-height-16);
    height: 60px;
}
.top-header .wrapper > a,
.lang-switch {
    color: var(--color-secondary-80);
}
.lang-switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
}
.top-header .wrapper > a {
    margin-right: 32px;
}
.languages {
    margin-left: 10px;
    padding: 2px 0;
    display: -moz-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    background-color: var(--color-secondary-10);
    border-radius: 50px;
}
.languages .active a {
    background-color: var(--color-secondary-40);
    color: var(--color-white);
}
.languages a {
    padding: 3px 5px;
    border-radius: 50px;
    font-weight: 500;
    color: var(--color-secondary-40);
    display: block;
}
.languages li:not(.active) a:hover,
.languages li:not(.active) a:focus {
    background-color: var(--color-primary-1);
    color: var(--color-white);
}

/* Header */

.main-menu-active .header,
.mobile.search-popup-open .header {
    background-color: var(--color-secondary-10);
}
.search-popup-open,
.menu-open,
.mobile.main-menu-active {
    overflow: hidden;
}
.header {
    position: fixed;
    width: 100%;
    z-index: 99;
    top: 0;
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-secondary-15);
    padding-bottom: 15px;
    padding-top: 15px;
}
header .header-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    height: 135px;
    gap: 1rem;
}
.sticky header .header-wrapper {
    height: 65px;
}

/* Logo */

.sticky header #logo-text {
    display: none;
}
.wrap-logo {
    position: relative;
}
.wrap-logo svg {
    height: 90px;
}
.sticky .wrap-logo svg {
    height: 60px;
}
.sticky .wrap-logo {
    height: 65px;
}
.sticky.main-menu-active .wrap-logo a,
.sticky.search-popup-open .wrap-logo a {
    background: transparent;
}
.sticky header #logo-bg,
.sticky header .logo-bg {
    height: 104px;
}
.svg-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: flex-end;
}
.img-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin-top: 1rem;
    align-items: flex-end;
}
.wrap-logo a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    transition: all 0.1s ease-in-out;
    max-width: 190px;
    height: 100%;
}
.main-menu-active .img-wrapper img {
    filter: grayscale(1);
}
.sticky .img-wrapper {
    max-height: 160px;
}

/* For Desktop */

@media (min-width: 992px) {
    .sticky .header-wrapper {
        height: 67px;
    }
    .wrap-logo {
        max-width: 190px;
    }
}
.wrap-logo img {
    height: auto;
}
.sticky .wrap-logo img {
    width: auto;
    height: 100%;
}

/* Especially for Mobile */

@media (max-width: 991px) {
    .top-header {
        display: none;
    }
    .header header .wrap-logo a {
        padding: 10px 6px 20px 6px;
    }
    .wrap-logo a {
        margin-inline: auto;
    }
    .main-menu-active #logo,
    .main-menu-active .logo-bg,
    .search-popup-open #logo,
    .search-popup-open .logo-bg {
        fill: transparent;
    }
    .main-menu-active .logo-text,
    .search-popup-open .logo-text {
        fill: var(--color-secondary-40);
    }
    .header-wrapper {
        justify-content: space-between;
        align-items: center;
    }
    .svg-wrapper {
        position: relative;
        top: -4px;
    }
}