@media (max-width: 1309px){
    .primary__btn, .secondary__btn{
        width: 156px;
	    height: 40px;
        font-size: 18px;
    }
    .primary__btn-svg, .secondary__btn-svg, .header__btn-mob{
        width: 35px;
        height: 34px;
        border-radius: 72.917px;
    }
    .primary__btn-svg svg, .secondary__btn-svg svg{
        width: 17.5px;
        height: 17.5px;
        flex-shrink: 0;
        aspect-ratio: 1/1;
    }
    .live__chat {
        width: 60px;
        height: 60px;
        border-radius: 150px;
        box-shadow: 0 10.667px 26.667px 0 rgba(33, 45, 61, 0.20);

        &:hover {
            width: 62px;
            height: 62px;
            box-shadow: 0 11.022px 27.556px 0 rgba(33, 45, 61, 0.20);
        }
    }
    .chat__wrapper svg{
        width: 27px;
        height: 27px;
        transition: 0.3s;

        &:hover{
            width: 27.9px;
            height: 27.9px;
        }
    }
    .b-mobile {
        display: block;
    }
    .menu-icon {
        display: block;
        cursor: pointer;
        width: 32px;
        height: 32px;
        transition: 0.3s;
    }
    .header__right {
        display: flex;
        flex-direction: column;
        background:  #221E1B;
        position: fixed;
        top: 36px;
        right: 0;
        width: 100%;
        height: 100vh;
        opacity: 0;
        visibility: hidden;
        transform: translateX(100%);
        transition: 0.3s;
        z-index: 999999;
    }
    .header__right .header__menu .container{
        display: flex;
        justify-content: space-between;
        padding-top: 12px;
    }
    .header__right.active {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        z-index: 999999;
    }
    .header__menu .header__right.active{
        background: #DBE5DA;
    }
    .header__menu-logo img{
        width: auto;
        height: 44px;
    }
    .header__menu-btns{
        display: flex;
        align-items: center;
        gap: 30px;
    }
    .primary__btn-tab{
        width: 139px;
        height: 40px;
    }
    .nav__mob{
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .nav__mob-title{
        color:  #777;
        font-family: Montserrat;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.40; 
    }
    .nav__mob ul {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .header__right-row{
        display: flex;
        flex-direction: column;
        gap: 40px;
        padding: 60px 40px;
    }
    .header__right-row .nav__mob ul li a {
        display: block;
        color: #FFF;
        font-size: 36px;
        font-weight: 500;
        line-height: 1.10;
        transition: 0.3s;

        &:hover{
            color: #D3D3D3;
        }
    }
    .mob__contact{
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 60px 0 0 0;
    }
    .mob-menu__btn{
        display: flex;
    }
   
    .primary__btn-mob{
        display: none;
    }
    .mob__contact-wrap{
        display: flex;
        flex-direction: column;
    }
    .mob__contact-text{
        color:  #777;
        font-family: Montserrat;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.40;
    }
    .mob__contact a {
        color:  #FFF;
        font-size: 18px;
        font-weight: 500;
        line-height: 1.40;
    }
    .hero__block {
        padding: 0 0 50px 0;
    }
    .hero__content-left{
        max-width: 340px;
        gap: 30px;
    }
    .hero__title{
        font-size: 60px;
        line-height: 1.05; 
        letter-spacing: -1.2px;
    }
    .hero__text{
        font-size: 22px;
    }
    .hero__item svg {
        width: 36px;
        height: 36px;
    }
    .hero__item-block h3{
        font-size: 18px;
    }
    .hero__item-block p {
        max-width: 281px;
        font-size: 15px;
    }
    .header__nav{
        display: none;
    }
    .advantages {
        padding: 50px 0;
    }
    .advantages__title {
        max-width: 460px;
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .advantages__list{
        gap: 20px;
        animation: marqueeScroll-2 10s linear infinite;
    }

    @keyframes marqueeScroll-2 {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-120%);
	}
    }
    .advantages__item-1,
    .advantages__item-2,
    .advantages__item-3,
    .advantages__item-4,
    .advantages__item-5 {
        width: 340px;
        height: 410px;
    }
    .advantages__item-top-svg {
        padding: 14px;
    }
    .advantages__item-top-svg svg{
        width: 24px;
        height: 24px;
    }
    .advantages__item-top h4 {
        font-size: 18px;
    }
    .advantages__item-text{
        font-size: 15px;
    }
    .essence{
        padding: 50px 0 0 0;
    }
    .essence__top .container{
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }
    .essence__top-left {
        max-width: 460px;
    }
    .essence__title{
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .essence__top-right{
        max-width: 460px;
    }
    .essence__top-right p{
        font-size: 18px;
    }
    .essence__list{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 0;
    }
    .essence__item{
        padding: 50px 0 50px 0;
        display: flex;
        flex-direction: column;
        gap: 60px;
        border-bottom: 1px dashed #B1AFAF;
        padding-left: 40px;
    }
    .essence__item:nth-child(2){
        border-right: none;
    }
    .essence__item:nth-child(3),
    .essence__item:nth-child(4){
        border-bottom: none;
    }
    .essence__item:nth-child(1),
    .essence__item:nth-child(3){
        padding-left: 0;
    }
    .essence__item-bottom h4{
        font-size: 22px;
    }
    .essence__item-bottom p{
        font-size: 18px;
    }
    .info .container__bg{
        gap: 0px;
    }
    .info__right{
        padding: 30px 40px 30px 30px;
    }
    .info__right-top {
        gap: 40px;
    }
    .info__title{
        font-size: 51px;
        font-weight: 500;
        line-height: 1.05; 
        letter-spacing: -1.02px;
    }
    .info__right-bottom{
        display: flex;
        flex-direction: column;
        gap: 30px;
    }
    .info__text{
        font-size: 26px;
        letter-spacing: -0.52px;
    }
    .balance{
        padding: 50px 0;
    }
    .balance__top .container{
        max-width: 564px;
        gap: 24px;
    }
    .balance__title{
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .balance__text{
        font-size: 21px;
        line-height: 1.20; 
    }
    .balance__bottom .container{
        max-width: 700px;
        position: relative;
    }
    .balance__bottom-text{
        max-width: 526px;
        font-size: 26px;
        letter-spacing: -0.52px;
    }
    .reviews{
        padding: 50px 0;    
    }
    .reviews__text {
        font-size: 40px;
        letter-spacing: -0.8px;
    }
    .footer{
        padding: 40px 0;
    }
    .footer__list{
        gap: 36px;
    }
    .about__hero__block {
        gap: 50px;
    }
    .about__hero__content {
        gap: 80px;
    }
    .about__hero__content-top-wrap{
        max-width: 340px;
        gap: 24px;
    }
    .about__hero__title{
        font-size: 60px;
        letter-spacing: -1.2px;
    }
    .about__hero__text{
        font-size: 22px;
        line-height: 1.10;
    }
    .care{
        padding: 80px 0 50px 0;
    }
    .care__title{
        max-width: 460px;
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .care__line{
        margin: 40px 0;
    }
    .care__block-left{
        max-width: 145.2px;
    }
    .care__block-center {
        max-width: 253px;
    }
    .care__block-center ul{
        gap: 12px;
    }
    .care__block-center ul li{
        gap: 12px;
    }
    .care__block-center ul li svg{
        width: 16px;
        height: 16px;
    }
    .care__block-center-item {
        padding: 12px 0;
    }
    .care__block-center-item p{
        font-size: 15px;
    }
    .care__block-right{
        max-width: 224.39999px;
    }
    .benefits{
        padding: 50px 0;
    }
    .benefits__block{
        gap: 30px;
    }
    .benefits__title {
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .benefits__list{
        gap: 36px;
    }
    .benefits__item{
        gap: 16px;
    }
    .benefits__item-svg{
        padding: 16px;
        width: 50px;
        height: 50px;
        border-radius: 800px;
    }
    .benefits__item-svg svg{
        width: 18px;
        height: 18px;
    }
    .benefits__item-wrap {
        gap: 12px;
    }
    .benefits__item-wrap h4{
        font-size: 22px;
    }
    .benefits__item-wrap p{
        font-size: 18px;
    }
    .harmony{
        padding: 50px 0;
    }
    .harmony__top {
        gap: 24px;
    }
    .harmony__title {
        max-width: 476px;
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .harmony__text{
        max-width: 564px;
        font-size: 21px;
        line-height: 1.20; 
    }
    .harmony__bottom ul {
        gap: 20px;
    }
    .contact__hero__content {
        padding: 50px 0 60px 0;
    }
    .contact__hero__content .container {
        gap: 50px;
    }
    .contact__hero-block{
        gap: 37.91px;
    }
    .contact__hero-title{
        font-size: 60px;
        letter-spacing: -1.2px;
    }
    .contact__hero-text{
        max-width: 322px;
        font-size: 18px;
    }
    .contact{
        padding: 80px 0;
    }
    .contact .container{
        gap: 20px;
    }
    .contact__right {
        gap: 30px;
    }
    .contact__right-title{
        max-width: 340px;
        font-size: 40px;
        letter-spacing: -0.8px;
    }
    .contact__item{
        gap: 14px;
    }
    .contact__item-block{
        padding: 12px 0;
        gap: 12px;
    }
    .contact__item-block a{
        gap: 4px;
        font-size: 18px;
    }
    .contact__item-block a span svg{
        width: 20px;
        height: 20px;
        aspect-ratio: 1/1;
    }
    .contact__item-block p{
        max-width: 300px;
        font-size: 15px;
    }
    .check__order{
        padding: 50px 0;
    }
    .check__order-left{
        max-width: 330px;
        gap: 24px;
    }
    .check__order-left h2{
        font-size: 51px;
        letter-spacing: -1.02px;
    }
    .check__order-left p {
        font-size: 21px;
        line-height: 1.20; 
    }
    .check__order-right{
        width: 340px;
    }
    .check__order-right-title{
        font-size: 22px;
    }
    .check__order__form form{
        gap: 20px;
    }
    .check__order__form form label{
        font-size: 15px;
    }

}

@media (max-width:780px) {
    .hero__bg {
        background-image: url('../images/hero_bg-tab-1x.jpg');
        background-size: cover;
    }
    .hero__block {
        height: 571px;
    }
    .about__hero__bg {
        background-image: url('../images/about__hero_bg-tab-1x.jpg');
        background-size: cover;
    }
}

@media (max-width:730px){
    .header__menu-logo img{
        width: auto;
        height: 33.99976px;
    }
    .header__right-row{
        padding: 40px 24px;
    }
    .secondary__btn{
        width: 193px;
	    height: 54px;
        font-size: 20px;
    }
    .secondary__btn-svg{
        width: 48px;
        height: 48px;
        border-radius: 100px;
    }
   .secondary__btn-svg svg{
        width: 24px;
        height: 24px;
        flex-shrink: 0;
        aspect-ratio: 1/1;
    }
    .nav__mob-title{
        padding: 0 0 20px 0;
        border-bottom: 1px dashed #4C4C4C;
    }
    .nav__mob ul li{
        padding: 0 0 20px 0;
        border-bottom: 1px dashed #4C4C4C;
    }
    .nav__mob ul li{
        font-size: 30px;
    }
    .mob__contact{
        padding: 104px 0 0 0;
    }

    .contact__top a {
        font-size: 12px;
    }
    .hero__block {
        height: 560px;
        padding: 0 0 24px 0;
    }
    .hero__content .container{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }
    .hero__content-left{
        max-width: 100%;
        gap: 16px;
    }
    .hero__title{
        font-size: 44px;
        letter-spacing: -1.32px;
    }
    .hero__text{
        font-size: 20px;
    }
        .hero__content-right{
            width: 100%;
        }
    .hero__list{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        padding: 16px 0 0 0;
        border-top: 1px solid rgba(255, 255, 255, 0.24);
    }
    .hero__item{
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .hero__item svg {
        width: 20px;
        height: 20px;
    }
    .hero__item-block h3{
        font-size: 16px;
    }
    .hero__item-block p {
        display: none;
    }
    .header__nav{
        display: none;
    }
    .header__btns{
        gap: 20px;
    }
    .header__btn-mob{
        display: flex;
    }
    .header__btns .primary__btn{
        display: none;
    }
    .header__btns .secondary__btn{
        display: none;
    }
    .advantages {
        padding: 40px 0;
    }
    .advantages__wrap{
        gap: 40px;
    }
    .advantages__block .container{
        gap: 40px;
    }

    .advantages__subtitle{
        font-size: 13px;
    }
    .advantages__title {
        max-width: 322px;
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .advantages__list{
        gap: 12px;
    }
    .advantages__item-1,
    .advantages__item-2,
    .advantages__item-3,
    .advantages__item-4,
    .advantages__item-5 {
        width: 199px;
        height: 240px;
    }
    .advantages__item-top-svg {
        padding: 10px;
    }
    .advantages__item-top-svg svg{
        width: 16px;
        height: 16px;
    }
    .advantages__item-top h4 {
        font-size: 16px;
        padding: 10px;
    }
    .advantages__item-text{
        font-size: 14px;
        padding: 0 16px 16px 16px;
    }
    .essence{
        padding: 40px 0;
    }
    .essence__top .container{
        gap: 16px;
        padding-bottom: 40px;
    }
    .essence__top-left{
        max-width: 800px;
        display: flex;
        flex-direction: column;
        gap: 41px;
    }
    .essence__subtitle{
        font-size: 13px;
    }
    .essence__title{
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .essence__top-right{
        max-width: 460px;
    }
    .essence__top-right p{
        font-size: 16px;
    }
    .essence__line{
        display: none;
    }
    .essence__list{
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .essence__item{
        padding: 24px 0;
        border-top: 1px dashed #B1AFAF;
        border-bottom: none;
        border-right: none;
        padding-left: 0;
        gap: 30px;
    }
    .essence__item-svg{
        width: 36px;
        height: 36px;
        padding: 11.613px;
        border-radius: 580.645px;
    }
    .essence__item-svg svg{
        width: 12.774px;
        height: 12.774px;
    }
    .essence__item-bottom{
        gap: 8px;
    }
    .essence__item-bottom h4{
        font-size: 20px;
    }
    .essence__item-bottom p{
        font-size: 16px;
    }
    .info .container__bg{
        display: flex;
        flex-direction: column;
    }
    .info__right{
        padding: 40px 15px;
        gap: 60px;
    }
    .info__subtitle{
       font-size: 13px;
    }
    .info__title{
        font-size: 34px;
        letter-spacing: -.68px;
    }
    .info__right-bottom{
        gap: 24px;
    }
    .info__text{
        font-size: 22px;
    }
    .balance{
        padding: 50px 0 0 0;
    }
    .balance__top .container{
        max-width: 100%;
        gap: 16px;
    }
    .balance__title{
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .balance__text{
        font-size: 18px;
    }
    .balance__bottom .container{
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .balance__bottom-text{
        max-width: 270px;
        font-size: 22px;
    }
    .reviews__subtitle {
        font-size: 13px;
    }
    .reviews .container{
        gap: 50px;
    }
    .swiper2 {
        gap: 50px;
    }
    .reviews__text{
        font-size: 28px;
        letter-spacing: -0.56px;
        margin: 0 0 50px 0;
    }
    .swiper__bottom{
        flex-direction: column;
    }
    .swiper-pagination2 {
        display: none;
    }
    .footer{
        padding: 40px 0 20px 0;
    }
    .footer .container{
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 30px;
    }
    .footer__logo{
        width: auto;
    }
    .footer__list{
        gap: 40px;
    }
    .about__hero__block {
        gap: 107px;
    }
    .about__hero__content {
        gap: 131px;
    }
    .about__hero__content-top-wrap{
        max-width: 90%;
        gap: 16px;
    }
    .about__hero__title{
        font-size: 44px;
        letter-spacing: -1.32px;
    }
    .about__hero__text{
        max-width: 80%;    
    }
    .about__hero__content-bottom{
        padding: 24px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.25);
    }
    .about__scroll a {
        font-size: 13px;
    }
    .about__about {
        font-size: 13px;
    }
    .care{
        padding: 60px 0 24px 0;
    }
    .care__title{
        max-width: 322px;
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .care__block .container{
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
    .care__block-left{
        max-width: 153px;
    }
    .care__block-center {
        max-width: 100%;
    }
    .care__block-center ul li svg{
        width: 11px;
        height: 12px;
    }
    .care__block-center-item p{
        font-size: 14px;
    }
    .care__block-right{
        max-width: 100%;
    }
    .benefits{
        padding: 40px 0;
    }
    .benefits .container{
        gap: 40px;
    }
    .benefits__subtitle{
        font-size: 13px;
    }
    .benefits__block{
        display: flex;
        flex-direction: column;
        gap: 40px;
    }
    .benefits__left{
        gap: 24px;
    }
    .benefits__title {
        max-width: 90%;
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .benefits__list{
        gap: 36px;
    }
    .benefits__item{
        gap: 16px;
    }
    .benefits__item-svg{
        padding: 14.08px;
        width: 44px;
        height: 44px;
        border-radius: 704px;
    }
    .benefits__item-svg svg{
        width: 15.785px;
        height: 15.84px;
    }
    .benefits__item-wrap {
        gap: 8px;
    }
    .benefits__item-wrap h4{
        font-size: 20px;
    }
    .benefits__item-wrap p{
        font-size: 16px;
    }
    .harmony__top {
        gap: 16px;
    }
    .harmony__title {
        max-width: 476px;
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .harmony__text{
        max-width: 100%;
        font-size: 18px;
    }
    .harmony__bottom ul {
        flex-direction: column;
    }
    .contact__hero__content {
        padding: 41px 0 60px 0;
    }
    .contact__hero__content .container {
        gap: 41px;
    }
    .contact__subtitle{
        font-size: 13px;
    }
    .contact__hero-block{
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .contact__hero-title{
        font-size: 44px;
        letter-spacing: -1.32px;
    }
    .contact__hero-text{
        max-width: 100%;
    }
    .contact{
        padding: 50px 0;
    }
    .contact .container{
        display: flex;
        flex-direction: column;
        gap: 40px;
    }
    .contact__right {
        gap: 16px;
    }
    .contact__right-title{
        max-width:100%;
        font-size: 28px;
        letter-spacing: -0.56px;
    }
    .contact__item-block p{
        max-width: 100%;
        font-size: 14px;
    }
    .check__order-left{
        max-width: 100%;
    }
    .check__order .container{
        flex-direction: column;
        gap: 40px;
    }
    .check__order-left h2{
        font-size: 34px;
        letter-spacing: -0.68px;
    }
    .check__order-left p {
        font-size: 18px;
    }
    .check__order-right{
        width: 100%;
    }
    .check__order-right-title{
        font-size: 20px;
    }
    .check__order__form form{
        gap: 12px;
    }







}


@media (max-width: 470px) {
        .hero__bg{
            background-image: url('../images/hero_bg-mob-1x.jpg');
        }
        .about__hero__bg {
            background-image: url('../images/about__hero_bg-mob-1x.jpg');
        }

}
@media (max-width: 350px) {
    .container{
        padding: 0 15px;
    }
}