

/* Desktop grid - show by default */
.goods__grid--desktop {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 20px;
}

/* Mobile Swiper - hidden by default */
.goods__swiper--mobile {
    display: none !important;
}

@media (max-width: 768px) {
    /* Hide desktop grid on mobile */
    .goods__grid--desktop {
        display: none !important;
    }
    
    /* Show mobile swiper */
    .goods__swiper--mobile {
        display: block !important;
        position: relative;
        padding: 0 20px;
    }
    
    .goods__swiper--mobile .swiper-slide {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    
    .goods__swiper--mobile .goods__grid-item {
        width: 100%;
        margin: 0;
    }
    
    
    
    .goods__swiper--mobile .swiper-pagination {
        position: relative;
        margin-top: 20px;
    }
    
    
}

@media (max-width: 1220px) {
    body {
        min-width: 1101px;
    }

    .center_1140 {
        width: 1101px;
    }


}


@media (max-width: 1100px) {
    body {
        min-width: 1001px;
    }

    .center_1140 {
        width: 1001px;
    }

    .center_945 { width: 830px; }

    .kons-block {
        margin-left: 70px;
    }

    .work .block {
        display: block;
    }

    .work .block-item {
        margin: auto;
    }

    .logo {
        width: 160px;
        height: 40px;
    }



}

@media (max-width: 1000px) {
    body {
        min-width: 751px;
    }



    .center_1140 {
        width: 751px;
    }

    .center_945 { width: 751px; }


    .logo {
        width: 230px;
        height: 54px;
    }




    .work { background: none; height: auto; padding-bottom: 100px; margin-top: 0; }



    .work ul li { font-size: 15px; margin: 0px 0px 15px 0; padding: 0px 0 0px 40px; }

    .kons { height: 511px; margin-top: 0; }



    .kons .men1 { display: none; }

    .kons .inputs { margin: 0 auto; }

    .preim { height: auto; background-size: cover; padding-bottom: 60px; }

    .preim ul { justify-content: center; }

    .preim li { width: 50%; }





    .katalog .left-block { display: block; margin: 0 auto; }

    .katalog .right-block { width: 457px; display: block; margin: 0 auto; padding-left: 0; }

    .katalog h3 { margin-top: 20px; font-size: 26px; line-height: 36px; }

    .katalog .text { padding-top: 20px; }



    .help { height: 612px; margin-top: 0; }

    .help h2 { text-align: center; }



    .help .men2 { display: none; }
    .help__wrapper
    {
        margin: auto;
    }
    .help .inputs { margin: 0 auto; }




    .mobile-hide {
        display: none;
    }

    .mobile-show {
        display: block;
    }

    .kons {

        margin-top: -153px;
        /* padding-top: 290px; */
        text-align: center;
    }

    .kons h2 {
        text-align: center;
    }




}

@media (max-width: 1000px) and (min-width: 751px) {


     .top {
        display: flex;
        padding: 30px 0;
        align-items: center;
        flex-wrap: nowrap;
        gap: 30px 20px;
        justify-content: space-around;
    }

    .timer {
        margin: auto;
    }

    .logo {
        width: 208px;
        height: 51px;
        background-size: contain;
    }


    .top__right-column {
        order: 2;
    }
    .timer {
        order: 3;
    }



    .tab-content {
        top: 220px;
    }
            .slide-card img {
        object-fit: cover;
    }

        .goods__grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .kons {
        /* margin-top: -153px; */
        /* padding-top: 40px; */
        padding-top: 140px;
        text-align: center;
        margin-top: 0;
        height: auto;
        
    }

}

@media (max-width: 750px) {
    body {
        min-width: 500px;
    }


        .section {
        padding: 40px 0 40px 0;
    }
    

    h2 {
        margin-bottom: 40px;
    }

    .center_1140 {
        width: 500px;
    }

    .center_945 { width: 500px; }

    .header { height: auto; background-size: cover; padding-bottom: 40px; }



    .logo {
        width: 200px;
        height: 51px;
    }
    




    .header__buttons { display: flex; flex-direction: column;     gap: 14px;
        margin-top: 60px;}



    .header ul { padding-top: 40px; }

    .work { padding-bottom: 40px; }



    .kons { height: auto; background-size: cover; padding: 40px 0;         margin-top: 0}



    .preim { background: #fbfbfb; padding: 40px 0; }







    .help {
        height: auto;
        background-size: cover;
        padding: 40px 0;
    }



    .gar { background: #fbfbfb;
    height: auto;
    padding: 40px 0; }



    .on_map {
        height: auto;
    }



    .on_map_address {
        margin: auto;
        width: 390px;
        position: relative;
        background-color: #fff;
        box-shadow: none;
        height: auto;
        padding-left: 0;
        padding-bottom: 40px;
    }

    .on_map_address .r6 {
        padding-top: 0;
    }

    #map-canvas,
    #map-canvas2 {
        height: 300px;
        width: 100%;
    }

    .formblock2 {
        padding: 40px 0;
        background: #fbfbfb;
        height: auto;
    }



    .formblock2__phone {
        font-size: 24px;
    }


    .logo-footer p {
        padding-top: 3px;
        padding-left: 50px;
        font-size: 14px;
        line-height: 18px;
    }

    .creator p {
        font-size: 14px;
        line-height: 18px;
    }

    .footer-copyright {
        float: none;
        display: block;
        margin: auto;
        width: 160px;
    }


    .creator {
        padding-top: 10px;
        padding-right: 0;
        float: none;
        text-align: center;
        width: 100%;
    }

    .footer {
        margin-bottom: 80px;
    }

    .header__addres {
        display: none;
    }

        .slide-card img {
        object-fit: cover;
    }

    .work__grid {
        display: flex;
        flex-direction: column;
    }

    .goods__grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }

    .tabs {
        height: 670px;
    }

} 

@media (max-width: 750px) and (min-width: 576px) {

    .top {
        display: flex;
        padding: 30px 0;
        align-items: center;
        flex-wrap: wrap;
        gap: 30px 20px;
        justify-content: space-around;
    }

    .top__center-column {
        order: 3;
    }

    .logo {
        width: 208px;
        height: 51px;
        background-size: contain;
    }

    .splitter {
        display: none;
    }

    .top__right-column {
        order: 2;
    }
    .timer {
        order: 3;
        margin: auto;
    }


    .header__offer {
        margin-top: 42px;
    }

    .header__button {
        margin: 55px auto 95px auto;
    }


    .present-grid {
        display: flex;
        flex-direction: column;
    }

    .header__addres {
        display: none;
    }

    .slide-card img {
        object-fit: cover;
    }
    .tab-content {
        top: 200px;
    }


    .work ul { width: 100%; }

    .goods__grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }

    .contr-radio {
        background: white;
        padding: 10px 10px;
        gap: 2px;
     }

    .contr-radio img {
        display: inline-block;
    }
}

/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {

    :root {
    --main-color: #c01218;
    --main-darker-color:  #b9191f;
    --main-text-color: #1f1f1f;
    --secondary-text-color: rgb(156, 156, 156);

    --font-size-xl: 22px; /* очень крупный, hero/баннер */
    --font-size-lg: 20px; /* заголовки h2-h3 */
    --font-size-md: 16px; /* основной текст */
    --font-size-sm: 15px; /* подписи */
    --font-size-xs: 14px; /* мелкие комментарии */
    --font-size-xxs: 12x; /* мелкие комментарии */
    }

    body {
        min-width: 320px;
    }

    .section {
        padding: 40px 0 40px 0;
    }
    

    h2 {
        margin-bottom: 40px;
    }
    .center_1140 {
        width: 320px;
        height: auto;
    }

    .center_945 { width: 320px; height: auto; }

    .zv {
        font-size: 10px !important;
    }



    .logo {
        width: 230px;
        height: 54px;
            background-size: contain;
    }
    


    .top {
        flex-direction: column;
        align-items: center;
        gap: 30px
    }
    .top__left-column {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        align-content: center;
    } 


    .splitter {
        display: none;
    }

    .top__left-column {
        order: 1;
    }

    .top__right-column {
        order:2;
    }

    
    .top__center-column {
        order: 3;
    }

    .header__offer {
        margin-top: 20px;
    }


    .header__button {
        text-align: center;
        margin: 30px auto 53px auto;
        width: 310px;
    }

    .work ul { width: 100%; }

    .request_callback .inputs {
        padding-top: 20px;
    }

    .input_text {
        margin-bottom: 7px;
        width: 100%;
        height: 48px!important;
    }

    .input_text input::-webkit-input-placeholder,
    .input_text input::-moz-placeholder,
    .input_text input:-ms-input-placeholder 
    {
        font-size: 12px;
        color: #212121;
    }


    .request_callback .inputs {
        width: 100%;
        margin: 0 auto;
        position: relative;
        overflow: hidden;
    }

    .input_text input,
    input[type="text"],
    select {
        height: 48px !important;
        font-size: 12px !important;
        padding-left: 20px !important;
    }

    .submit {
        font-size: 10px;
        height: 48px;
        line-height: 48px;
        margin-bottom: 15px;
    }

    .submit__arrow {
        width: 10px;
        height: 10px;
    }


    .submit .button-offer { font-size: 24px!important; vertical-align: 3px; }

    .header .submit .circle { margin-top: 3px; }

    .header .submit .button-offer { margin-top: 3px; }

    .header__buttons { display: flex; flex-direction: column;     gap: 14px;
        margin-top: 40px;}



    .preim li { width: 100%; margin-bottom: 20px; }

    .katalog { margin-bottom: 40px; }



    .katalog .left-block { width: 320px;  }


    .tabs { height: 600px; }

    .katalog .right-block { width: 100%; }

   
    .katalog h3 { font-size: 18px; line-height: 30px; }

    .katalog .text { font-size: 13px; }

    .katalog .submit { width: 100%; }



    #map-canvas {
        /* background: url(/images/map-mobile.jpg) top center; */
    }


    .on_map_address {
        width: 100%;
    }

    .on_map_address .r6 { padding-top: 0; font-size: 16px; }


    .on_map_address .r1 {
        background: url(../images/pin.png) -8px 0px no-repeat;
        background-size: 43px;
    }



    .formblock2__phone {
        font-size: 19px;
    }

    .creator { font-size: 13px; }


    .form-top {
        width: 100%;
    }

    .flip-clock-wrapper {
        width: 341px;
        margin: 0 auto;
        display: block;
    }

    .header .request_callback {
        display: block;
        margin: 0 auto;
        width: 300px;
    }

    .katalog .request_callback {
        display: block;
        margin: 0 auto;
        width: 300px;
    }

    /* Custom dialog window */
    .popup-title {
        font-size: 15px;
    }

    .popup-body {
        font-size: 11px;
        padding-top: 22px;
    }

    #popup-title-accepted {
        font-size: 20px;
    }

    #popup-body-accepted {
        font-size: 11px;
        padding-top: 22px;
    }


    .work__grid {
        display: flex;
        flex-direction: column;
    }


        .swipper {
        margin-top: 200px;
    }

    .tabs {
        gap: 6px
    }
    .tab-title,
    .tab :checked+.tab-title {
        height: 40px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .tab-title p {
        font-size: 16px;
        line-height: 16px;
        padding-top: 6px;
    }

    .tab-title p span {
        font-size: 12px;

    }

    .tab :checked+.tab-title p {
        font-size: 16px;
        line-height: 16px;
        padding-top: 6px;
    }

    .tab :checked+.tab-title p span {
        opacity: 0.6;
        font-size: 12px;
        font-weight: 400;
    }
.tab-content {
    position: absolute;
    top: 150px;
}

.goods__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.trigger__grid-item {
    width: 50%;
    margin-bottom: 70px;
}

.form__soc {
    gap: 2px;
}

.contr-radio {
    font-size: 13px;
    background: white;
    padding: 4px 4px;
    gap: 2px;
}

.contr-radio img {
    display: inline-block;
}
    /*Ускорение загрузки мобильной версии*/
}
