.top-nav__full-menu {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 2;
}
.desctop-nav-menu__icon svg path {
    fill: var(--color__fill-1);
}
.top-nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background-color: white;
    z-index: 100;
}
.top-nav__menu-btn {
    width: 4.5rem;
    height: 4.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.top-nav__menu-btn-line {
    width: 1.75rem;
    height: 0.1875rem;
    border-radius: .25rem;
    background-color: #FFF;
    margin: .2rem 0;
}

.top-nav__logo {
    flex: 1 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.top-nav__logo svg {
    max-width: 8.75rem;
    width: 100%;
}

.top-nav__messenger {
    width: 4.5rem;
    height: 4.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    position: relative;
}

.top-nav__bar {
    width: 100%;
    z-index: 1;
    position: relative;
}
.top-nav.--open-top .top-nav__bar {
    z-index: 4;
}

.top-nav__bar-border {
    position: absolute;
    width: calc(100% - 2.5rem);
    left: 1.25rem;
    height: 1px;
    background-color: var(--color__border);
}
.top-nav__messenger-wrap, .desctop-nav__contacts-messenger .top-nav__messenger-wrap{
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 2.5rem;
    background-color: #67C15F !important;
    background-position: center;
    background-size: 55%;
    position: relative;
}


.top-nav__messenger-counter {
    font-size: .5rem;
    font-weight: 700;
    width: .75rem;
    height: .75rem;
    background-color: red;
    border-radius: 100%;
    text-align: center;
    color: white;
    position: absolute;
    top: 0;
    right: 0;
}

.top-nav__menu-shade {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 70%);
    z-index: 1;
    animation-duration: 240ms !important;
}

.top-nav__menu {
    z-index: 2;
    position: absolute;
    width: 15.5rem;
    background-color: #212024;
    height: 100vh;
    overflow: hidden;
    overflow-y: auto;
    border-radius: 0 1.5rem 1.5rem 0;
    padding: 1.25rem;
    padding-top: .5rem;
    animation-duration: .24s !important;
    -webkit-overflow-scrolling: touch;
}

.top-nav__close-menu {
    position: absolute;
    left: 16.5rem;
    width: 2.5rem;
    height: 2.5rem;
    background-color: #D49C5F;
    z-index: 3;
    top: 1rem;
    border-radius: 100%;
    background-position: center;
    background-size: 50%;
}

.top-nav__menu-items {}

.top-nav__menu-item {
    /* padding: 1rem 0; */
    border-bottom: 1px solid rgb(255 255 255 / 16%);
    position: relative;
}

.top-nav__menu-link {
    padding: 1rem 0;
}

.top-nav__menu-icon {
    width: 1.5rem;
    height: 1.5rem;
    display: flex;
    margin-right: 1rem;
    background-size: contain;
    background-position: center;
}
.top-nav__menu-icon svg {
    max-width: 100%;
    max-height: 100%;
}

.top-nav__menu-icon svg path {
    fill: white;
}
.top-nav__menu-name {
    color: white;
    font-weight: 600;
}

.top-nav__menu-arrow {
    height: 1.75rem;
    width: 1.75rem;
    background-size: contain;
    background-position: center;
    right: .5rem;
    top: 0.9rem;
    position: absolute;
    /* border-top: .15rem solid white; */
    /* border-right: .15rem solid white; */
    /* transform: rotate(45deg); */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 4L12 9L6 14' stroke='white' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
}
.top-nav__menu-arrow.open{
    transform: rotate(90deg);
}
.top-nav__sub-menu-item .top-nav__menu-arrow{
    top: 0.5rem;
    height: 1.2rem;
}

.top-nav__menu-sub-arrow {
    width: 1.4rem;
    height: 2rem;
    position: absolute;
    border-radius: 2rem;
    background-position: center;
    background-size: 100%;
    right: 0;
    top: .75rem;
    transition: all ease .24s;
}

.top-nav__menu-sub-arrow svg {}

.top-nav__sub-menu-items {
    display: none;
    padding-bottom: 1.5rem;
    padding-left: 2.5rem;
}

.top-nav__menu-item.is-open .top-nav__sub-menu-items {
    /* display: block; */
}

.top-nav__sub-menu-item {
}

.top-nav__sub-menu-link {
    padding: .37rem 0;
    display: flex;
    color: white;
    font-weight: 600;
}

.top-nav__menu-item.is-open {}

.top-nav__menu-item.is-open .top-nav__menu-sub-arrow {
    transform: rotate(45deg);
}

.top-nav__menu-item.is-open:after {content: "";display: block;position: absolute;left: -1.25rem;top: 0;width: calc(100% + 2.5rem);height: 100%;background-color: rgb(0 0 0 / 16%);z-index: -1;transition: all ease .24s;}

.top-nav__full-menu.is-open {
    display: block;
}

.--white-header {}

.--white-header .top-nav__menu-btn-line {
    background-color: white;
}

.--white-header .top-nav__logo svg path {
    /*fill: white;*/
}

.--white-header .top-nav__messenger-wrap {
    background-color: white !important;
    background-image: url("data:image/svg+xml;charset=utf8, %3Csvg width='23' height='23' viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.28613 5.84141C8.06314 5.30738 7.89406 5.28707 7.55624 5.27342C7.44124 5.26677 7.31312 5.26012 7.17099 5.26012C6.73147 5.26012 6.27201 5.3886 5.99475 5.6725C5.65694 6.01733 4.8187 6.82179 4.8187 8.47132C4.8187 10.121 6.02171 11.7165 6.18396 11.9398C6.35305 12.1627 8.52943 15.5972 11.9088 16.997C14.5515 18.0922 15.3357 17.9907 15.9371 17.8624C16.8157 17.6731 17.9174 17.0238 18.1947 16.2398C18.4717 15.4554 18.4717 14.7861 18.3905 14.6441C18.3095 14.5022 18.0863 14.4213 17.7485 14.2521C17.4107 14.083 15.7682 13.2717 15.4573 13.1635C15.1531 13.0487 14.8625 13.0893 14.6329 13.4138C14.3084 13.8668 13.9909 14.3266 13.7339 14.6037C13.5312 14.8201 13.1999 14.8472 12.9228 14.7322C12.551 14.5769 11.5103 14.2115 10.226 13.069C9.23237 12.1835 8.55656 11.0817 8.3607 10.7503C8.16467 10.4123 8.3404 10.2161 8.49583 10.0337C8.66492 9.82402 8.82699 9.67541 8.9959 9.47919C9.16499 9.28315 9.2595 9.18181 9.36768 8.95181C9.48268 8.72882 9.40146 8.49882 9.32042 8.32973C9.2392 8.16028 8.56339 6.51057 8.28613 5.84141ZM11.4966 0C5.15687 0 0 5.1583 0 11.4999C0 14.0148 0.811112 16.3473 2.18986 18.2403L0.756846 22.5131L5.17717 21.1004C6.99525 22.3038 9.16481 23.0001 11.5034 23.0001C17.8432 23.0001 23.0001 17.8414 23.0001 11.5002C23.0001 5.15866 17.8432 0.000359376 11.5034 0.000359376H11.4968V0H11.4966Z' fill='%2367C15E'/%3E%3C/svg%3E");
}
.desctop-nav__contacts-messenger .top-nav__messenger-wrap {
    background-color: white;
    background-image: url("data:image/svg+xml;charset=utf8, %3Csvg width='23' height='23' viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.28613 5.84141C8.06314 5.30738 7.89406 5.28707 7.55624 5.27342C7.44124 5.26677 7.31312 5.26012 7.17099 5.26012C6.73147 5.26012 6.27201 5.3886 5.99475 5.6725C5.65694 6.01733 4.8187 6.82179 4.8187 8.47132C4.8187 10.121 6.02171 11.7165 6.18396 11.9398C6.35305 12.1627 8.52943 15.5972 11.9088 16.997C14.5515 18.0922 15.3357 17.9907 15.9371 17.8624C16.8157 17.6731 17.9174 17.0238 18.1947 16.2398C18.4717 15.4554 18.4717 14.7861 18.3905 14.6441C18.3095 14.5022 18.0863 14.4213 17.7485 14.2521C17.4107 14.083 15.7682 13.2717 15.4573 13.1635C15.1531 13.0487 14.8625 13.0893 14.6329 13.4138C14.3084 13.8668 13.9909 14.3266 13.7339 14.6037C13.5312 14.8201 13.1999 14.8472 12.9228 14.7322C12.551 14.5769 11.5103 14.2115 10.226 13.069C9.23237 12.1835 8.55656 11.0817 8.3607 10.7503C8.16467 10.4123 8.3404 10.2161 8.49583 10.0337C8.66492 9.82402 8.82699 9.67541 8.9959 9.47919C9.16499 9.28315 9.2595 9.18181 9.36768 8.95181C9.48268 8.72882 9.40146 8.49882 9.32042 8.32973C9.2392 8.16028 8.56339 6.51057 8.28613 5.84141ZM11.4966 0C5.15687 0 0 5.1583 0 11.4999C0 14.0148 0.811112 16.3473 2.18986 18.2403L0.756846 22.5131L5.17717 21.1004C6.99525 22.3038 9.16481 23.0001 11.5034 23.0001C17.8432 23.0001 23.0001 17.8414 23.0001 11.5002C23.0001 5.15866 17.8432 0.000359376 11.5034 0.000359376H11.4968V0H11.4966Z' fill='%23FFF'/%3E%3C/svg%3E");
}

.--white-header .top-nav {
    background-color: transparent;
    background: linear-gradient(180deg, rgb(0 0 0 / 64%) 0%, rgba(0, 0, 0, 0) 100%);
}

.--white-header .top-nav__logo svg circle {
    /*fill: white;*/
}
.--white-header .top-nav__bar-border {
    background-color: white;
    opacity: .32;
}

.--white-header.--main-page .top-nav {
    background: unset;
}
.desctop-nav {
    display: none;
    position: fixed;
    left: 0;
    top: 2rem;
    width: 100%;
    z-index: 101;
}
.desctop-nav.is-sitcky {
    position: fixed;
}

.top-nav.--white-list {}

.top-nav.--white-list .top-nav__menu {
    background-color: white;
}

.top-nav.--white-list .top-nav__menu-item.is-open:after {
    background-color: var(--color__fill-4);
}

.top-nav.--white-list .top-nav__menu-arrow {
    border-top: .15rem solid var(--color__fill-1);
    border-right: .15rem solid var(--color__fill-1);
}

.top-nav.--white-list .top-nav__menu-icon svg path {
    fill: var(--color__fill-1);
}

.top-nav.--white-list .top-nav__menu-name {
    color: var(--color__dark);
}
.top-nav.--white-list .top-nav__menu-item {
    border-bottom: 1px solid var(--color__border);
}

.top-nav.--white-list .top-nav__menu-sub-arrow svg path {
    fill: var(--color__fill-1);
}

.top-nav.--white-list .top-nav__sub-menu-link {
    color: var(--color__dark);
    opacity: .6;
}

.top-nav__full-menu.--open-top {
    /* height: calc(100vh - 4.5rem); */
    /* top: 4.5rem; */
    /* padding-top: 4.5rem; */
}

.top-nav__full-menu.--open-top .top-nav__menu {
    width: 100%;
    /* height: calc(100vh - 4.5rem); */
    border-radius: 0;
    display: none;
    padding-top: 4.5rem;
}

.top-nav__close-menu.--open-top {left: 1rem;display: none;}

.top-nav.is-open .top-nav__close-menu.--open-top {
    display: block;
}
.top-nav.--open-top.is-open {
    position: fixed;
}

.top-nav__messengers {
    width: 4.5rem;
    height: 4.5rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.top-nav__messenger-item {
    font-size: 0;
    width: 1.75rem;
    height: 1.75rem;
    background-size: cover;
    background-position: center;
    border-radius: 100%;
    margin-right: .125rem;
}

.top-nav__messenger-item.--svg__mini-contacts--tel {
    background-size: 50%;
    background-color: #444;
}
.top-nav__messengers-items {
    display: flex;
    margin-right: .5rem;
}

.desctop-nav__info{
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 2rem;
}
.desctop-nav__tel{
    font-weight: 700;
}
.desctop-nav__tel-wrap{
    display: flex;
    flex-direction: row-reverse;
    gap: 2rem;
}

.desctop-nav-menu__item.is-active  span{
    color: #212024;
}


@media screen and (min-width: 768px) {  
    .top-nav {
        display: none;
    }
    .desctop-nav {
        display: block;
        padding: 1rem;
        top: 0;
        transition: all ease .24s;
    }
    .desctop-nav__contacts-messenger {}

    .desctop-nav__contacts-messenger .top-nav__messenger-wrap {
        width: 4rem;
        height: 4rem;
    }
    
    .desctop-nav__contacts-messenger .top-nav__messenger {
        width: 4rem;
        height: 4rem;
    }
    
    .desctop-nav__contacts-messenger .top-nav__messenger-counter {
        width: 1.25rem;
        height: 1.25rem;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: .75rem;
    }

    .desctop-nav__logo {
        /* position: absolute; */
        /* left: 2rem; */
        /* margin-top: 1rem; */
    }
    
    .desctop-nav__logo svg {
        width: 10rem;
    }
    
    .desctop-nav__wrap {


    }
    .desctop-nav__body{
        padding: 1rem;
        position: relative;
        background-color: #212024;
        border-radius: 1.5rem;
        margin-bottom: 2rem;
        /* display: flex; */
        /* align-items: center; */
        /* justify-content: space-between; */
        transition: all ease .24s;
    }
    .desctop-nav__main-content{


        width: 82rem !important;
        max-width: 95% !important;
        margin: 0 auto;
    }
    .desctop-nav__contacts {
        /* position: absolute; */
        /* right: 2rem; */
        /* margin-top: .57rem; */
        width: 100%;
    }

    .desctop-nav__block-links{
        width: 82rem !important;
        max-width: 95% !important;
        margin: 0 auto;
    }

    .desctop-nav__bar {
        width: 100%;
        border-radius: 1.5rem;
        /* background-color: white; */
        /* box-shadow: 0px 1rem 4.5rem rgb(0 0 0 / 6%); */
    }
    
    .desctop-nav__bar-wrap {
        width: 100%;
        /* padding: .75rem; */
        /* padding-left: 1.5rem; */
        justify-content: space-between;
        flex-wrap: nowrap;
        align-items: center;
        height: 100%;
    }
    .desctop-nav__info{
        color: #FFF;
    }
    .desctop-nav-menu{
        justify-content: space-between;
    }
    .desctop-nav-menu__link {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        font-weight: 650;
        text-decoration: none;
        color: var(--color__fill-1);
        border-radius: .675rem;
        transition: all ease .24s;
        width: 100%;
        filter: grayscale(1);
        cursor: pointer;
    }
    
    .desctop-nav-menu__devider {

        width: 1px;
        background-color: var(--color__border);
        opacity: .5;
    }
    .desctop-nav-menu__devider:last-child {
        display: none;
    }
    /*.desctop-nav-menu__link:hover {*/
    /*    background-color: rgb(85 183 255 / 16%);*/
    /*}*/
    .desctop-nav-menu__item {
        /* flex: 1; */
        /* border-left: 1px solid rgb(233 233 233 / 64%); */
        /* filter: grayscale(1); */
    }
    
    .desctop-nav-menu__icon {
        width: 1.5rem;
        height: 1.5rem;
        background-position: center;
        background-size: contain;
        opacity: .6;
        transition: all ease .24s;
        margin-top: .5rem;
    }
    .desctop-nav__btn {
        border-radius: .75rem;
        font-weight: 650;
    }
    .desctop-nav-menu {
        flex: 1;
        /* padding-right: 1.5rem; */
    flex-wrap: nowrap;}
    
    .desctop-nav-menu__item:first-child {
        border-left: 1px solid transparent;
    }
    
    .desctop-nav-menu__item:hover {
        /* border-left: 1px solid transparent; */
    }
    
    .desctop-nav-menu__item:hover + div {}
    
    .desctop-nav-menu__item:hover + div {}
    
    .desctop-nav-menu__item:hover + .desctop-nav-menu__item {
        /* border-left: 1px solid transparent; */
    }
    .desctop-nav-menu__item:hover {}

    .desctop-nav-menu__link:hover {}
    
    .desctop-nav-menu__link:hover .desctop-nav-menu__icon {
        opacity: 1;
    }
    
    .desctop-nav-menu__link:hover {
        opacity: 1;
    }
    
    .desctop-nav-menu__link:hover {
        color: #212024;
    }



    .desctop-nav-menu__item.is-active .desctop-nav-menu__link {
        filter: grayscale(0);
        opacity: 1;
    }
    
    .desctop-nav-menu__item.is-active .desctop-nav-menu__link .desctop-nav-menu__icon {
        opacity: 1;
    }
    .desctop-nav__time-work {
        opacity: .5;
    }
    .desctop-nav__line {
        border-top: 1px solid var(--color__border);
        width: 100%;
        display: none;
    }
    .desctop-full-nav__link {
        font-weight: 600;
    }
    .desctop-full-nav {
        padding-top: 1rem;
        padding-bottom: 1.5rem;
        padding: 0;
        grid-gap: 1rem 3rem;
    }
    
    .desctop-full-nav__word {
        color: #FF5721;
    }
    .desctop-nav__serives {
        height: 20rem;
        overflow: hidden;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        position: absolute;
        background-color: white;
        padding: 1.5rem;
        border-radius: 0 0 1.5rem 1.5rem;
        top: 6.5rem;
        margin-top: -.375rem;
        border-top: .375rem solid var(--color__fill-1);
        box-shadow: 0px 1rem 3rem rgb(0 0 0 / 12%);
    }
    .--white-header .top-nav__messenger-wrap {
        background-color: #67C15E !important;
       
    }
    .desctop-nav__messegner {
        width: 1.75rem;
        height: 1.75rem;
        margin-left: 0.25rem;
        transition: all ease .24s;
        background-size: 1.75rem;
        background-repeat: no-repeat;
        background-position: center;
    }
    .desctop-nav__logo-desc {
        border-left: 1px solid rgb(0 0 0 / 15%);
    }
    .desctop-nav__messegner:hover {
        transform: scale(1.12);
    }

    .desctop-nav__btn-call-back-icon {
        width: 1.375rem;
        height: 1.375rem;
        background-size: contain;
    }
    
    .desctop-nav__btn-call-back {
        padding: 0.875rem 1.25rem;
        border-radius: 1rem;
        font-weight: 650;
        background: #D49C5F;
    }
    .desctop-nav__adress{
        opacity: 0.4;
    }
    .desctop-nav__contacts-box{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .desctop-nav.is-sitcky {
        padding: 0;
    }
    
    .desctop-nav.is-sitcky .desctop-nav__wrap {border-radius: 0;box-shadow: 0px 1rem 3rem rgb(0 0 0 / 8%);background-color: white;padding: .5rem 1rem;}

    .desctop-nav-menu__link span {
        margin-bottom: 0.5rem;
    font-size: .8rem;}

    


    

}

@media (max-width:768px) {
    .--white-header .top-nav{
        background-color: #212024;
    }
}
.header__search-form{
    position: relative;
    margin-right: 0.75rem;
}
.header__search-label{

}
.header__search-input{
    background: rgba(162, 162, 162, 0.20);
    padding: 1rem 0.5rem 1rem 3.25rem  ;
    border-radius: 1rem;
    border: 1px solid #666;
    color: #E8E8E8;
    width: 15rem;
    /*width: 100%;*/
    /*border: transparent;*/
    /*background: transparent;*/
}
.header__search-input::placeholder{
    color: #E8E8E8;
    opacity: .4;
}
.header__search-btn{
    position: absolute;
    left: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    cursor: pointer;

}

.svg__search{
    display: block;
    width: 1.5rem;
    min-width: 1.5rem;
    height: 1.5rem;
    background-color: #A9A9A9;
    mask-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.5 17.5L13.8833 13.8833M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z" stroke="%23E8E8E8" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-position: center;
    mask-position: center
}
/* Стили для автозаполнения */
.header__search-input:-webkit-autofill,
.header__search-input:-webkit-autofill:hover,
.header__search-input:-webkit-autofill:focus,
.header__search-input:-webkit-autofill:active {
    -webkit-text-fill-color: #E8E8E8;
    -webkit-box-shadow: 0 0 0px 1000px rgba(162, 162, 162, 0.20) inset;
    -webkit-background-clip: text;
    background-clip: text;
    caret-color: #E8E8E8;
    transition: background-color 5000s ease-in-out 0s;
    border: 1px solid #666;
}

/* Для фокуса */
.header__search-input:focus {
    border-color: #888;
    background: rgba(162, 162, 162, 0.25);
}

/* Дополнительно для других браузеров */
.header__search-input:-moz-autofill,
.header__search-input:-moz-autofill:hover,
.header__search-input:-moz-autofill:focus {
    background: rgba(162, 162, 162, 0.20);
    color: #E8E8E8;
    border: 1px solid #666;
}

/* Убираем стандартные стили */
input, button, textarea, select {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
    border: none;
    outline: none;
    padding: 0;
    margin: 0;
}

@media screen and (max-width: 1200px) {
    .desctop-nav__btn-call-back {
        padding: 0.875rem .75rem;
    }

    .header__search-input{
        padding: .75rem .5rem .75rem 1.75rem;
        width: 12rem;
        font-size: 0.875rem;
    }
    .header__search-btn {
        left: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
    }
    .svg__search {
        width: 1rem;
        min-width: 1rem;
        height: 1rem;
    }
    .desctop-nav__info{
        gap: 1rem;
    }
    .special-offer__content .swiper-slide{
        min-width: 26.25rem;
    }
}
@media screen and (max-width: 768px) {
    .special-offer__content .swiper-slide{
        min-width: 100%;
    }
}
@media screen and (max-width: 768px) {
    .top-nav.is-sitcky{
        position: fixed;
        top: 0;
        background: #212024 !important;
    }
    .top-nav.is-sitcky .--main-page .top-nav__wrap{
        background: #212024 !important;
    }
}
