@media (max-width:1440px) {
    .offers .block {    
        & .title {
            font-size: 24px;
            line-height: 32px;
        }
    
        & .price {
            font-size: 24px;
            line-height: 32px;
        }
    
        & .up {
            display: flex;
            background-color: rgba(234, 242, 251, 1);
            padding: 16px;
            gap: 12px;
            border-radius: 30px 30px 0 0;
            height: 150px;
        }
    
        & .img {
            height: 222px;
            width: 40%;
            top: -100px;
        }
    }
    .fly .block {
        height: 258px;
    }
    .fly {
        width: 80%;
        border-radius: 40px;
        padding: 24px;
    }
    .fly.form {
        width: 80%;
    }
    * {
        font-size: 20px;
        line-height: 26px;
    }
    .product .imgs {
        display: grid;
        grid-template-columns: 1.3fr 0.7fr;
        grid-template-rows: 193px 193px;
        gap: 24px;
    }
    .product .imgs img {
        border-radius: 30px;
    }
    .product .inner {
        grid-template-columns: 0.8fr 1.2fr;
    }
    .product.reverse .inner {
        grid-template-columns: 1.2fr 0.8fr;
    }
    .h3, h3 {
        font-size: 24px;
        line-height: 32px;
    }
    .product .h3 {
        margin-bottom: 24px;
    }
    .product .desc {
        margin-bottom: 24px;
    }
    .how .video {
        height: 519px;
    }
    .gif .video {
        height: 633px;
    }
    .part .img {
        padding: 20px;
        height: 90px;
    }
    .history .inner {
        background-position: 80%;
        height: 1900px;
    }

    .history .block img {
        height: 191px;
        margin-bottom: 10px;
        object-fit: contain;
    }
    .history .block[data-count='1'] {
        top: 90px;
    }
    
    .history .block[data-count='2'] {
        top: -200px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='3'] {
        top: -200px;
    }
    
    .history .block[data-count='4'] {
        top: -500px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='5'] {
        top: -500px;
    }
    
    .history .block[data-count='6'] {
        top: -900px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='7'] {
        top: -800px;
    }
    
    .history .block[data-count='8'] {
        top: -1175px;
        left: 100%;
        transform: translateX(-100%);
    }
}

@media (max-width:1024px) {
    .offers .wrapper {
        grid-row-gap: 50px;
    }
    .offers .block .up {
        flex-direction: column;
        height: auto;
    }
    .offers .block .img {
        width: 80%;
        margin:  0 auto;
        top: -150px;
    }
    .offers .block .title {
        text-align: center;
        position: relative;
        top: -150px;
    }
    .offers .block .content {
        position: relative;
        top: -150px
    }
    .offers .specs {
        margin-bottom: 40px;
    }
    .offers h2 {
        margin-bottom: 150px;
    }
    .product video,
    .product img {
        border-radius: 30px;
    }
    .product .slider {
        width: 85%;
    }
    .fly {
        width: 90%;
        border-radius: 40px;
    }
    .fly.form {
        width: 90%;
    }
    .main .video {
        height: 600px;
    }
    .main {
        max-height: 600px;
    }
    .main .inner .text {
        font-size: 32px;
        line-height: 34px;
        width: 65%;
    }
    .main .inner {
        padding-top: 40px;
    }
    h1 {
        font-size: 48px;
        line-height: 48px;
    }
    .our img {
        width: 467px;
        height: 376px;
        margin: 0 auto;
        display: block;
        object-fit: contain;
    }
    .our span {
        font-size: 20px;
        line-height: 26px;
    }
    .product .inner {
        grid-template-columns: 1fr 1fr;
    }
    .product.reverse .inner {
        grid-template-columns: 1fr 1fr;
    }
    .product .imgs {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 289px 108px;
    }
    .product .imgs .big {
        grid-row: span 1;
        grid-column: span 2;
    }
    .product .imgs img {
        border-radius: 20px;
    }
    .how .video {
        height: 436px;
    }
    .how h2:first-child {
        margin-bottom: 70px;
    }
    
    .how h2:last-child {
        margin-top: 70px;
    }
    .tz {
        height: 250px;
    }

    .tz h2 {
        font-size: 24px;
        line-height: 32px;
    }
    
    .history .inner {
        background-image: none;
    }
    .h2,
    h2 {
        font-size: 32px;
        line-height: 42px;
    }
    .gif .video {
        height: 533px;
    }
    .part .inner {
        grid-template-columns: repeat(4, 1fr);
    }
    .history .block[data-count='1'] {
        top: 90px;
    }
    
    .history .block[data-count='2'] {
        top: -175px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='3'] {
        top: -170px;
    }
    
    .history .block[data-count='4'] {
        top: -450px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='5'] {
        top: -450px;
    }
    
    .history .block[data-count='6'] {
        top: -800px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='7'] {
        top: -750px;
    }
    
    .history .block[data-count='8'] {
        top: -1075px;
        left: 100%;
        transform: translateX(-100%);
    }
    .history .inner {
        height: 1700px;
    }
}

@media (max-width:768px) {
    .offers .block .title {
        font-size: 20px;
        line-height: 26px;
        margin-bottom: 0;
    }
    .offers .block .white {
        padding: 9.5px 24px;
        font-size: 16px;
        line-height: 21px;
    }
    .offers .block .specs span {
        font-size: 16px;
        line-height: 21px;
    }
    .our {
        padding-top: 175px!important;
        padding-bottom: 245px!important;
    }
    .container {
        padding: 0 24px;
    }
    .product .arrows button {
        width: 40px;
        height: 40px;
    }
    .fly .block img {
        height: 100px;
        width: 100px;
    }
    .fly figure {
        height: 350px;
    }
    .fly .block {
        height: 221px;
    }
    header .block {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    header button {
        grid-column: span 2;
        width: max-content;
        margin-left: auto;
    }
    h3, .h3 {
        font-size: 20px;
        line-height: 26px;
    }
    * {
        font-size: 16px;
        line-height: 21px;
    }
    .product .imgs {
        grid-template-rows: 289px 76px;
    }
    .product .imgs img {
        border-radius: 10px;
    }
    .how .video {
        height: 327px;
    }
    .tz {
        height: 230px;
    }
    .history p {
        font-size: 16px;
        line-height: 21px;
    }
    .history .block img {
        height: 173px;
    }
    .gif .video {
        height: 400px;
    }
    footer {
        height: 187px;
    }
    header .block a,
    footer .block a {
        font-size: 16px;
        line-height: 21px;
    }
    button.blue,
    a.blue {
        padding: 9.5px 24px;
        font-size: 16px;
        line-height: 21px;
    }
    header .block a::before,
    footer .block a::before {
        width: 18px;
        height: 18px;
    }
    .history .block[data-count='1'] {
        top: 90px;
    }
    
    .history .block[data-count='2'] {
        top: -100px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='3'] {
        top: -150px;
    }
    
    .history .block[data-count='4'] {
        top: -350px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='5'] {
        top: -400px;
    }
    
    .history .block[data-count='6'] {
        top: -650px;
        left: 100%;
        transform: translateX(-100%);
    }
    
    .history .block[data-count='7'] {
        top: -600px;
    }
    
    .history .block[data-count='8'] {
        top: -850px;
        left: 100%;
        transform: translateX(-100%);
    }
    .history .block {
        width: 330px;
    }
}

@media (max-width:640px) {
    .offers .wrapper {
        grid-template-columns: repeat(1, 1fr);
    }
    .offers .block .img {
        height: 180px;
    }
    .offers .block .title {
        font-size: 16px;
        list-style: 21px;
    }
    .offer .block .specs span {
        font-size: 14px;
        line-height: 21px;
    }
    .offers .specs {
        margin-bottom: 20px;
    }
    .offers h2 {
        margin-bottom: 185px;
    }
    .fly.form .mobile {
        display: flex;
    }
    .fly.form .logo {
        display: block;
    }
    .fly.form {
        width: 100%;
        height: 100%;
        border-radius: 0;
        top: 50%;
        background-color: rgba(234, 242, 251, 1);
    }
    .fly.form input {
        background-color:rgba(234, 242, 251, 1) ;
    }
    form label .phone .flag-btn {
        width: 35%;
    }
    form .slide {
        width: 45%;
    }
    form small {
        font-size: 12px;
        width: 90%;

        & span {
            font-size: 12px;
        }
    }
    form h3 {
        width: 80%;
        text-align: center;
        margin: 0 auto;
    }
    .container {
        padding: 0 16px;
    }
    .product .slider {
        width: 80%;
    }
    .fly .block {
        height: 128px;
        border-radius: 20px;
    }
    .fly {
        width: 100%;
        top: 20%;
        overflow-x: scroll;
    }
    .fly.form {
        width: 100%;
    }
    .fly figure {
        height: 200px;
    }
    .fly .block img {
        height: 60px;
        width: 60px;
    }
    .fly .player {
        gap: 12px;
    }
    header .block .tel,
    header .block .call,
    header .block .mail {
        display: none;
    }
    header .mobile {
        display: block;
    }
    header .block {
        display: flex;
        gap: 16px;
    }
    header {    
        &::after {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(180deg, rgba(158, 206, 228, 0.7) 0%, rgba(158, 206, 228, 0.7) 100%);
            filter: blur(100px);
            z-index: -1;
        }
    }
    .main .inner {    
        &::after {
            content: '';
            display: block;
            position: absolute;
            top: -20%;
            left: -30%;
            width: 100%;
            height: 100%;
            background: linear-gradient(180deg, rgba(158, 206, 228, 0.7) 0%, rgba(158, 206, 228, 0.7) 100%);
            filter: blur(100px);
            z-index: -1;
    
        }
    }
    .main .inner .text{
        font-size: 24px;
        line-height: 24px;
        text-wrap: pretty;
    }
    .main .inner .text {
        width: 90%;
    }
    .main .inner h1 {
        width: 90%;
    }
    h1 {
        font-size: 32px;
        line-height: 32px;
    }
    .our img {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: auto;
        display: none;
        /* transform: translate(-50%, -50%); */
    }
    .our {
        padding-top: 100px!important;
        padding-bottom: 100px!important;
    }
    .our .img {
        height: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .our span {
        position: static;
        display: block;
        width: 100%;
        transform: translate(0, 0)!important;

        &::after {
            display: none!important;
        }
    }
    .our h2 {
        position: static;
        grid-column: span 2;
        transform: translate(0, 0)!important;
        text-align: center;
        margin-bottom: 30px;
    }
    .product .inner {
        grid-template-columns: repeat(1, 1fr);
    }
    .product.reverse .inner {
        grid-template-columns: repeat(1, 1fr);
    }
    .product .h3 {
        text-align: center;
    }
    .product .imgs {
        grid-template-rows: 272px 111px;
    }
    .product .desc {
        text-align: center;
    }
    .how .video {
        height: 250px;
    }
    .play {
        width: 50px;
        height: 50px;
    }
    .play::after {
        width: 10px;
        height: 10px;
    }
    .history .block {
        position: relative;
        top: 0!important;
        left: 0!important;
        transform: translateX(0)!important;
        margin-left: 5px;
        margin-right: 5px;
    }
    .history .inner {
        height: auto;
    }
    .history h2 {
        margin-bottom: 30px;
    }
    .gif .video {
        height: 181px;
    }
    .h2,
    h2 {
        font-size: 24px;
        line-height: 32px;
    }
    footer .container {
        flex-direction: column;
    }
    footer .block {
        flex-direction: column-reverse;
    }
    footer {
        height: 329px;
    }
    .part {
        overflow: hidden;
    }
    .part .inner {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        height: 170px;
        gap: 16px;
        position: relative;
        left: 0;
        transition: var(--transition);
    }
    .part .img {
        height: 70px;
        padding: 10px;
        width: 120px;
    }
    .part .buttons {
        display: flex;
    }
}

@media (max-width:375px) {
    header img {
        width: 80px;
        height: auto;
    }
}