.header {
    background: #fff;
    position: fixed;
    width: 100%;
    z-index: 2
}

.header__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header__logo {
    max-width: 114px;
    width: 100%
}

.header__logo img {
    width: 100%
}

.header__nav {
    margin-left: 96px;
    margin-right: auto;
    max-width: 422px;
    width: 100%
}

.header__nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px;
    list-style: none
}

.header__nav ul li {
    position: relative
}

.header__nav ul .hs-item-has-children:hover > a, .header__nav ul li a.active, .header__nav ul li a:hover {
    color: var(--accent)
}

.header__nav ul .hs-menu-depth-1 a {
    color: var(--black);
    display: block;
    font-size: 16px;
    font-weight: 400;
    line-height: 130%;
    padding: 32px 0;
    position: relative
}

.header__nav ul .hs-item-has-children > a {
    padding-right: 14px
}

.header__nav ul .hs-item-has-children > a:after {
    content: url('../images/svg/arrow-down-dark.svg');
    line-height: 0;
    position: absolute;
    right: 0;
    top: calc(50% - 3px);
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    -o-transition: transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s
}

.header__nav ul .hs-item-has-children:hover > a:after {
    -webkit-filter: invert(50%) sepia(69%) saturate(532%) hue-rotate(81deg) brightness(89%) contrast(94%);
    filter: invert(50%) sepia(69%) saturate(532%) hue-rotate(81deg) brightness(89%) contrast(94%);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media (min-width: 1153px) {
    .header__nav ul .hs-item-has-children ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        left: -40px;
        position: absolute;
        top: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        background: #fff;
        gap: 20px;
        height: 0;
        max-width: 368px;
        opacity: 0;
        padding: 0;
        -webkit-transition: visibility .2s, opacity .2s, height .2s, padding .2s;
        -o-transition: visibility .2s, opacity .2s, height .2s, padding .2s;
        transition: visibility .2s, opacity .2s, height .2s, padding .2s;
        visibility: hidden;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }

    .header__nav ul .hs-item-has-children:hover > ul {
        -webkit-box-shadow: 0 4px 12px 0 #030d2d1a;
        box-shadow: 0 4px 12px 0 #030d2d1a;
        height: auto;
        opacity: 1;
        padding: 36px 40px;
        visibility: visible
    }
}

.header__nav ul .hs-menu-children-wrapper a {
    font-size: 16px;
    line-height: 130%;
    padding: 0
}

.header__phone {
    color: var(--black);
    display: block;
    margin-left: auto;
    position: relative
}

.header__phone:hover {
    color: var(--accent)
}

.header__phone:after {
    content: url('../images/svg/phone.svg');
    left: -24px;
    position: absolute;
    top: calc(50% - 8px)
}

.header__schedule {
    color: #888
}

.header__button {
    margin-left: 24px
}

.header__burger-btn, .header__mob {
    display: none
}

@media (max-width: 1152px) {
    .header__container {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        background: #fff;
        justify-content: space-between;
        padding-bottom: 20px;
        padding-top: 20px;
        position: relative;
        z-index: 2
    }

    .header__logo {
        max-width: 110px
    }

    .header__burger-btn {
        cursor: pointer;
        height: 29px;
        margin-left: 32px;
        position: relative;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        visibility: visible;
        width: 36px;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto
    }

    .header__burger-btn, .header__burger-btn span {
        display: block;
        opacity: 1;
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    .header__burger-btn span {
        background: var(--black);
        height: 3px;
        left: 0;
        position: absolute;
        -webkit-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
        width: 100%
    }

    .header__burger-btn span:first-child {
        top: 0
    }

    .header__burger-btn span:first-child, .header__burger-btn span:nth-child(2) {
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center
    }

    .header__burger-btn span:nth-child(2) {
        top: 13px
    }

    .header__burger-btn span:nth-child(3) {
        top: 26px;
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center
    }

    .header__burger-btn.open span:first-child {
        left: 0;
        top: 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .header__burger-btn.open span:nth-child(2) {
        opacity: 0;
        width: 0
    }

    .header__burger-btn.open span:nth-child(3) {
        left: 0;
        top: 26px;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    .button-secondary.header__button, .header__info, .header__nav {
        display: none
    }

    .header__mob, .header__mob .header__nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .header__info--mob, .header__mob .button-secondary.header__button, .header__mob .header__phone {
        display: block;
        margin-left: 0
    }

    .header__phone--mob {
        padding-left: 24px
    }

    .header__phone--mob:after {
        left: 0
    }

    .header__mob {
        background: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: calc(100vh - 69px);
        max-width: 100%;
        opacity: 0;
        padding: 40px 16px;
        position: absolute;
        -webkit-transform: translate(-16px, -100vw);
        -ms-transform: translate(-16px, -100vw);
        transform: translate(-16px, -100vw);
        visibility: hidden;
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 40px;
        z-index: -1
    }

    .header__mob, .header__mob.open {
        -webkit-transition: visibility .6s, opacity .6s, -webkit-transform .6s;
        transition: visibility .6s, opacity .6s, -webkit-transform .6s;
        -o-transition: transform .6s, visibility .6s, opacity .6s;
        transition: transform .6s, visibility .6s, opacity .6s;
        transition: transform .6s, visibility .6s, opacity .6s, -webkit-transform .6s
    }

    .header__mob.open {
        opacity: 1;
        overflow-y: scroll;
        -webkit-transform: translate(-16px);
        -ms-transform: translate(-16px);
        transform: translate(-16px);
        visibility: visible
    }

    .header__nav {
        margin: 0
    }

    .header__nav ul {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .header__nav .hs-menu-depth-1.hs-item-has-children > ul {
        display: none;
        gap: 12px;
        margin: 0;
        overflow: hidden;
        padding: 0;
        -webkit-transition: height .35s ease-in-out;
        -o-transition: height .35s ease-in-out;
        transition: height .35s ease-in-out
    }

    .header__nav .hs-menu-depth-1.hs-item-has-children > ul.active {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header__nav ul .hs-menu-depth-1 a {
        padding-bottom: 0;
        padding-top: 0;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    .header__nav ul .hs-menu-depth-1 > a:not(.active) {
        color: var(--black) !important;
        margin-bottom: 0;
        transition: margin .35s ease-in-out
    }

    .header__nav ul .hs-menu-depth-1 > a.active {
        margin-bottom: 16px
    }

    .header__nav ul .hs-item-has-children > a:not(.active):after {
        -webkit-filter: unset;
        filter: unset;
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }

    .header__nav ul .hs-item-has-children > a.active:after {
        -webkit-filter: invert(50%) sepia(69%) saturate(532%) hue-rotate(81deg) brightness(89%) contrast(94%);
        filter: invert(50%) sepia(69%) saturate(532%) hue-rotate(81deg) brightness(89%) contrast(94%);
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }
}

@media (max-width: 767px) {
    .header__logo {
        max-width: 110px
    }
}