@media (max-width: 767px)
{
    /*-------------------
        Global styles
    -------------------*/
    :root
    {
        --font_size: 12px;
        --font_size_title: 38px;
        --font_size_title_medium: 24px;
        --font_size_title_small: 18px;
    }


    .bg_grey
    {
        padding: 65px 0;
    }

    .bg_grey.small_pad_top
    {
        padding-top: 48px;
    }


    .block
    {
        margin-bottom: 65px;
    }


    .cont
    {
        padding: 0 20px;
    }



    /*------------
        Header
    ------------*/
    header
    {
        padding: 12px 0;
    }


    header .close_btn
    {
        top: 23px;
    }


    header .logo img
    {
        width: 149px;
        height: 30px;
    }



    /*-----------------
        Mob. header
    -----------------*/
    .mob_header
    {
        padding: 12px 0;
    }


    .mob_header .logo img
    {
        width: 149px;
        height: 30px;
    }



    /*---------------
        Page head
    ---------------*/
    .page_head
    {
        gap: 20px;
    }


    .page_head .image
    {
        height: 220px;
    }



    /*----------------
        Block head
    ----------------*/
    .block_head
    {
        margin-bottom: 40px;
    }


    .block_head.row
    {
        gap: 0;
    }


    .block_head .download
    {
        margin-top: 24px;
    }



    /*----------------
        Typography
    ----------------*/
    .text_block > *.margin_top
    {
        margin-top: 32px;
    }


    .text_block ul li:before
    {
        top: 7px;
    }



    /*-----------------
        First section
    -----------------*/
    .first_section .cont
    {
        min-height: 675px;
        padding-bottom: 100px;
    }


    .first_section .title
    {
        width: 100%;
    }


    .first_section .title span img
    {
        bottom: -6px;
    }


    .first_section .desc,
    .first_section .desc.small_w
    {
        font-size: 14px;

        width: 100%;
    }


    .first_section .messengers
    {
        margin-top: 60px;
    }


    .first_section .scroll_down_btn
    {
        height: 68px;
    }


    .first_section .scroll_down_btn .icon
    {
        width: 28px;
        height: 16px;
    }



    /*-----------
        Reels
    -----------*/
    .reels
    {
        right: 20px;
        bottom: 20px;
    }


    .reels .close_btn
    {
        display: flex;
    }


    .reels .item
    {
        width: 100px;
        height: 100px;

        border-radius: 50%;
        background: linear-gradient(45deg,  #ffc90c 2%,#ff8b00 27%,#fb0a15 54%,#fd00a1 78%,#e703c3 100%);
    }


    .reels .video
    {
        width: calc(100% - 6px);
        height: calc(100% - 6px);

        border: 3px solid #fff;
    }


    .reels .link
    {
        display: none;
    }


    .reels .author
    {
        display: none;
    }



    /*--------------
        Services
    --------------*/
    .services .service
    {
        min-height: 160px;
    }



    /*----------------
        About info
    ----------------*/
    .bg_grey .about_info
    {
        margin-bottom: -25px;
    }


    .about_info .advantages
    {
        margin-bottom: -20px;
        margin-left: 0;
    }


    .about_info .advantages > *
    {
        width: 100%;
        margin-bottom: 20px;
        margin-left: 0;
    }


    .about_info .advantages .icon
    {
        width: 35px;
        height: 35px;
    }


    .about_info .advantages .icon img
    {
        width: 19px;
        height: 19px;
    }


    .about_info .advantages .icon + *
    {
        width: calc(100% - 50px);
    }



    .about_info .stats
    {
        margin-top: 40px;
    }


    .about_info .stats .title
    {
        margin-bottom: 20px;

        gap: 16px;
    }


    .about_info .stats .title .icon
    {
        width: 10px;
        height: 17px;
    }


    .about_info .stats .row > *
    {
        width: calc(50% - 10px);
    }


    .about_info .stats .item
    {
        padding: 15px 10px;
    }


    .about_info .stats .val span
    {
        font-size: 30px;
    }



    /*--------------
        Projects
    --------------*/
    .projects .block_head .all_link
    {
        height: 44px;
    }



    /*-----------
        Steps
    -----------*/
    .steps .row
    {
        margin-bottom: -10px;
        margin-left: -10px;
    }


    .steps .row > *,
    .steps .row > *.tablet_big
    {
        width: calc(50% - 10px);
        margin-bottom: 10px;
        margin-left: 10px;
    }


    .steps .start,
    .steps .finish
    {
        min-height: 218px;
        padding: 15px 15px 10px;
    }


    .steps .start .desc,
    .steps .finish .desc
    {
        margin-top: 5px;
    }


    .steps .start .icon,
    .steps .finish .icon
    {
        height: 25px;
    }


    .steps .step
    {
        min-height: 218px;
        padding: 15px 15px 10px;
    }


    .steps .step .number
    {
        height: 28px;
        margin-bottom: 15px;
    }


    .steps .step .desc
    {
        font-size: 11px;
        line-height: normal;
    }


    .steps .step .arrow
    {
        width: 25px;
        height: 25px;
    }


    .steps .step .arrow .icon
    {
        width: 21px;
        height: 21px;
    }



    /*------------
        Why we
    ------------*/
    .why_we .row
    {
        margin-bottom: -15px;
        margin-left: -15px;
    }


    .why_we .row > *
    {
        width: calc(50% - 15px);
        margin-bottom: 15px;
        margin-left: 15px;
    }


    .why_we .item
    {
        min-height: 260px;
    }


    .why_we .item .link
    {
        position: absolute;
        top: 20px;
        right: 20px;

        width: 25px;
        height: 25px;
        margin: 0;
    }


    .why_we .item .link .icon
    {
        width: 21px;
        height: 21px;
    }


    .why_we .item .name
    {
        padding-right: 20px;
    }


    .why_we .item .desc
    {
        width: 275px;
        max-width: 100%;
    }


    .why_we .item .desc br
    {
        display: block;
    }


    .why_we .item .image1
    {
        bottom: -40px;
        left: -48px;
    }

    .why_we .item .image2
    {
        right: -33px;
        left: auto;
    }

    .why_we .item .image3
    {
        bottom: -8px;
        left: -26px;
    }

    .why_we .item .image4
    {
        right: -10px;
        bottom: -80px;
    }


    .why_we .item .image1 img
    {
        width: 234px;
        height: 156px;
    }

    .why_we .item .image2 img
    {
        display: block;

        width: 234px;
        height: 156px;
        margin-left: auto;

        transform: scale(-1, 1);
    }

    .why_we .item .image3 img
    {
        width: 196px;
        height: 127px;
    }

    .why_we .item .image4 img
    {
        width: 204px;
        height: 306px;
    }

    .why_we .item .image5 img
    {
        width: 116px;
        height: 117px;
    }

    .why_we .item .image6 img
    {
        width: 148px;
        height: 128px;
    }



    /*---------------
        Portfolio
    ---------------*/
    .portfolio .head
    {
        position: relative;

        margin-bottom: 40px;
    }


    .portfolio .head .block_head .title
    {
        padding-right: 79px;
    }



    .portfolio .project
    {
        padding: 10px 10px 20px;
    }


    .portfolio .project .location
    {
        font-size: 10px;
        line-height: 12px;

        top: 20px;
        left: 20px;

        padding: 4px 8px;

        gap: 4px;
    }


    .portfolio .project .location .icon
    {
        width: 11px;
        height: 11px;
    }


    .portfolio .project .images
    {
        margin-bottom: 10px;
    }


    .portfolio .project .images .big
    {
        width: 100%;
    }


    .portfolio .project .images .small
    {
        align-content: stretch;
        align-items: stretch;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;

        width: 100%;
    }


    .portfolio .project .images .image,
    .portfolio .project .images .big .image
    {
        position: relative;

        height: auto;
        padding-bottom: 77.215%;
    }


    .portfolio .project .images .big .image
    {
        padding-bottom: 58.567%;
    }


    .portfolio .project .images a
    {
        width: calc(50% - 2px);
    }


    .portfolio .project .images .big a
    {
        width: 100%;
    }


    .portfolio .project .images img
    {
        position: absolute;
        top: 0;
        left: 0;
    }


    .portfolio .project .desc
    {
        font-size: 10px;
        line-height: normal;
    }


    .portfolio .project .price
    {
        padding-top: 10px;
    }


    .portfolio .project .info .col
    {
        width: calc(100% - 150px);
    }


    .portfolio .project .link
    {
        width: 140px;
    }



    /*------------------
        Action block
    ------------------*/
    .action_block .data
    {
        min-height: 520px;
        padding: 28px;

        background-position: calc(100% + 200px) calc(50% + 108px);
    }


    .action_block .title
    {
        font-size: var(--font_size_title_medium);
    }


    .action_block .desc
    {
        width: 292px;
    }


    .action_block .messengers
    {
        position: absolute;
        bottom: 30px;
        left: 50%;

        width: 272px;
        margin: 0;

        transform: translateX(-50%);
    }


    .action_block .person
    {
        width: 100%;
    }


    .action_block .person .photo
    {
        width: 340px;
        max-width: 100%;
        margin-left: auto;
    }


    .action_block .person .info
    {
        bottom: 248px;
        left: 28px;

        width: auto;
        padding: 0;

        text-align: left;
        white-space: nowrap;

        border-radius: 0;
        background: none;
    }


    .action_block .person .name
    {
        font-size: 16px;
        line-height: 125%;
    }


    .action_block .person .phone
    {
        display: none;
    }



    /*---------------
        Excursion
    ---------------*/
    .excursion .data
    {
        width: 100%;
        margin-right: 0;
        margin-bottom: -20px;
        padding: 0;
    }


    .excursion .data .info
    {
        padding: 28px;
    }


    .excursion .data .info:before
    {
        background: rgba(255, 255, 255, .25);
    }


    .excursion .data .desc
    {
        width: 300px;
        max-width: 100%;
    }


    .excursion .data .messengers > div
    {
        margin-right: auto;
        margin-left: auto;
    }


    .excursion .data .in_progress
    {
        font-size: var(--font_size);

        position: absolute;
        z-index: 5;
        top: calc(100% + 60vw - 77px);
        left: 0;

        justify-content: flex-end;

        width: 100%;
        margin: 0;
        padding: 20px;

        color: #fff;
    }


    .excursion .data .in_progress .icon
    {
        width: 8px;
        height: 13px;
        margin-right: 2px;
    }



    .excursion .video
    {
        width: 100%;
        height: auto;
        padding-bottom: 65.294%;

        border-radius: 0 0 20px 20px;
    }


    .excursion .video video
    {
        position: absolute;
        top: 0;
        left: 0;
    }



    /*--------------
        Partners
    --------------*/
    .partners .count
    {
        width: 124px;
    }


    .partners .count .label
    {
        font-size: 12px;

        margin-bottom: 4px;
    }


    .partners .swiper
    {
        width: calc(100% - 144px);
    }


    .partners .image
    {
        height: 32px;
    }



    /*--------------------
        Portfolio item
    --------------------*/
    .portfolio_item .project_name
    {
        display: block;

        width: 100%;
        min-height: 0;

        text-align: center;
    }



    .portfolio_item .messengers
    {
        order: 2;

        margin: 40px auto 0;
    }



    .portfolio_item .location > div
    {
        margin-right: auto;
        margin-left: auto;
    }



    .portfolio_item .desc
    {
        width: 100%;
    }



    .portfolio_item .stats
    {
        width: 100%;
    }


    .portfolio_item .stats .item
    {
        padding: 15px 10px;
    }


    .portfolio_item .stats .val span
    {
        font-size: 30px;
    }


    .portfolio_item .stats .val sup
    {
        font-size: 16px;
    }



    .portfolio_item .tags
    {
        justify-content: center;
    }



    .portfolio_item .gallery
    {
        order: 3;

        margin-top: 40px;
    }


    .portfolio_item .gallery .image
    {
        height: 88px;
    }

    .portfolio_item .gallery .image.big_h
    {
        height: 176px;
    }



    /*---------------------
        Factory gallery
    ---------------------*/
    .factory_gallery .grid
    {
        grid-column-gap: 6px;
        grid-template-columns: repeat(3, 1fr);
        grid-row-gap: 6px;
    }


    .factory_gallery .grid .big1
    {
        grid-column: 1 / 3;
        grid-row: 1 / 3;
    }


    .factory_gallery .grid .big2
    {
        grid-column: 2 / 4;
        grid-row: 3 / 5;
    }


    .factory_gallery .item .thumb
    {
        height: 92px;
    }

    .factory_gallery .item.big1 .thumb,
    .factory_gallery .item.big2 .thumb
    {
        height: 190px;
    }



    /*--------------------
        Our production
    --------------------*/
    .our_production .head
    {
        padding: 28px 0;
    }



    .our_production .grid
    {
        margin-left: 0;
    }


    .our_production .grid > *:nth-child(1)
    {
        order: 1;
    }

    .our_production .grid > *:nth-child(2)
    {
        order: 2;
    }

    .our_production .grid > *:nth-child(3)
    {
        order: 3;
    }

    .our_production .grid > *:nth-child(4)
    {
        order: 5;
    }

    .our_production .grid > *:nth-child(5)
    {
        order: 6;
    }

    .our_production .grid > *:nth-child(6)
    {
        order: 4;
    }

    .our_production .grid > *:nth-child(7)
    {
        order: 8;
    }

    .our_production .grid > *:nth-child(8)
    {
        order: 7;
    }

    .our_production .grid > *:nth-child(9)
    {
        order: 9;
    }


    .our_production .item,
    .our_production .item.middle_w,
    .our_production .item.big_w
    {
        width: 100%;
        min-height: 0;
        margin-left: 0;
    }


    .our_production .item .desc
    {
        font-size: 12px;
    }


    .our_production .video,
    .our_production .video.medium_w,
    .our_production .video.small_w
    {
        width: 100%;
        min-height: 210px;
        margin-left: 0;
    }


    .our_production .video .thumb
    {
        position: relative;
    }


    .our_production .video .icon
    {
        top: 16px;
        right: 16px;
    }


    .our_production .video .name
    {
        font-size: 12px;

        padding: 16px 16px 16px 36px;
    }

    .our_production .video .name:before
    {
        top: 21px;
        left: 16px;

        width: 8px;
        height: 8px;
    }


    .our_production .image,
    .our_production .image.small_w
    {
        width: 100%;
        min-height: 210px;
        margin-left: 0;
    }


    .our_production .standarts,
    .our_production .smart_home
    {
        width: 100%;
        min-height: 210px;
        margin-left: 0;
        padding: 20px;
    }


    .our_production .standarts .logo,
    .our_production .standarts .logo img
    {
        max-height: 80px;
    }



    /*--------------
        Fittings
    --------------*/
    .fittings .brands .row
    {
        margin-bottom: -12px;
        margin-left: -12px;
    }


    .fittings .brands .row > *
    {
        width: calc(33.333% - 12px);
        margin-bottom: 12px;
        margin-left: 12px;
    }


    .fittings .brands .brand
    {
        height: 92px;
    }


    .fittings .slogan
    {
        font-size: 12px;

        margin-top: 24px;
    }


    .fittings .gallery .swiper-slide
    {
        width: 200px;
    }



    /*-----------------------------
        Interior design gallery
    -----------------------------*/
    .interior_design_gallery .grid
    {
        height: 600px;

        grid-template-columns: repeat(6, 1fr);
        grid-template-rows: repeat(8, 1fr);
    }


    .interior_design_gallery .item
    {
        padding: 15px 10px;
    }


    .interior_design_gallery .item1
    {
        grid-area: 1 / 1 / 4 / 5;
    }

    .interior_design_gallery .item2
    {
        grid-area: 4 / 3 / 7 / 7;
    }

    .interior_design_gallery .item3
    {
        grid-area: 1 / 5 / 4 / 7;
    }

    .interior_design_gallery .item4
    {
        grid-area: 7 / 4 / 9 / 7;
    }

    .interior_design_gallery .item5
    {
        grid-area: 7 / 1 / 9 / 4;
    }

    .interior_design_gallery .item6
    {
        grid-area: 4 / 1 / 7 / 3;
    }


    .interior_design_gallery .item .types
    {
        margin-top: 20px;
    }


    .interior_design_gallery .item1 .types
    {
        width: 132px;
    }

    .interior_design_gallery .item2 .types
    {
        width: 148px;
    }


    .interior_design_gallery .item .types > * > div
    {
        padding: 4px 8px;
    }


    .interior_design_gallery .item .types .icon
    {
        width: 16px;
        height: 16px;
    }


    .interior_design_gallery .item .desc
    {
        display: none;
    }


    .interior_design_gallery .item .price
    {
        padding-right: 5px;
    }



    /*-----------------
        Exact match
    -----------------*/
    .exact_match .before_after .slogan
    {
        width: 100%;
        margin-left: 0;
    }


    .exact_match .before_after .image .sticker
    {
        top: 15px;
        left: 15px;

        padding: 8px 12px;
    }

    .exact_match .before_after .image .sticker.after
    {
        right: 15px;
    }


    .exact_match .before_after .image img
    {
        height: 320px;
    }


    .exact_match .why .title
    {
        font-size: 18px;
    }


    .exact_match .why .title .icon
    {
        width: 12px;
        height: 20px;
    }


    .exact_match .why .item
    {
        height: 224px;
    }



    /*-------------------
        What included
    -------------------*/
    .what_included .block_head .col
    {
        width: 100%;
        max-width: 100%;
    }


    .what_included .item
    {
        padding: 19px 0;
    }


    .what_included .item .thumb
    {
        width: 160px;
        height: 113px;
    }


    .what_included .item .thumb + *
    {
        width: calc(100% - 180px);
        min-height: 113px;

        gap: 10px;
    }



    /*------------
        Prices
    ------------*/
    .prices .block_head .messengers
    {
        margin-top: 24px;
    }


    .prices table th.mob_hide,
    .prices table td.unit
    {
        display: none;
    }



    /*-------------------
        Sub. services
    -------------------*/
    .sub_services .row > *,
    .sub_services .row > *:nth-last-child(2)
    {
        width: calc(50% - 10px);
    }


    .sub_services .row > *:last-child
    {
        width: calc(100% - 10px);
    }


    .sub_services .item
    {
        min-height: 360px;
    }


    .sub_services .item .name
    {
        font-size: 16px;
    }


    .sub_services .item .features
    {
        gap: 8px;
    }


    .sub_services .item .features > * > *
    {
        margin-left: 0;
    }



    /*--------------------
        Control levels
    --------------------*/
    .control_levels .wheelSlider-container
    {
        width: 300px;
        padding-bottom: 40px;
    }


    .wheelSlider-container .slide.next
    {
        margin-left: -100px;
    }

    .wheelSlider-container .slide.prev
    {
        margin-left: 100px;
    }


    .wheelSlider-container .wheelSlider-arrow[data-action='prev']
    {
        display: none;
    }


    .wheelSlider-container .wheelSlider-arrow[data-action='next']
    {
        top: auto;
        right: 50%;
        bottom: 0;

        width: 52px;
        height: 52px;
        margin-right: calc((50vw - 20px) * -1);

        color: #fff;
        border-color: #333;
        background: #333;
    }


    .wheelSlider-container .dots
    {
        display: flex;
    }


    .control_levels .person .info
    {
        gap: 12px;
    }


    .control_levels .person .link
    {
        margin-top: 8px;
    }


    .control_levels .bottom
    {
        display: none;
    }



    /*-------------------
        Contacts info
    -------------------*/
    .contacts_info .list
    {
        gap: 80px;
    }


    .contacts_info .item
    {
        padding: 20px;
    }


    .contacts_info .item .city > *
    {
        font-size: 16px;

        margin: 0 auto;
        padding: 8px 16px;
    }


    .contacts_info .item .data
    {
        gap: 20px;
    }


    .contacts_info .item .label,
    .contacts_info .item .val
    {
        font-size: 14px;
    }


    .contacts_info .item .phone .icon
    {
        width: 24px;
        height: 24px;
    }


    .contacts_info .item .days
    {
        font-size: 14px;
        line-height: 20px;
    }


    .contacts_info .item .time
    {
        font-size: 14px;
        line-height: 16px;
    }


    .contacts_info .item .map
    {
        height: 280px;
    }


    .contacts_info .item .map_wrap .link a
    {
        font-size: 14px;
        line-height: 20px;

        padding: 12px 28px;
    }


    .contacts_info .requisites > div
    {
        font-size: 14px;

        justify-content: space-between;

        width: 100%;

        gap: 24px;
    }


    .contacts_info .requisites a
    {
        line-height: 20px;

        padding: 8px 16px;
    }



    /*------------
        Footer
    ------------*/
    footer
    {
        padding-top: 48px;
        padding-bottom: 32px;
    }



    footer .logo
    {
        margin-bottom: 32px;
    }


    footer .logo img
    {
        width: 149px;
        height: 30px;
    }



    footer .contacts
    {
        width: 100%;
    }



    footer .menu
    {
        width: 100%;
        margin-top: 32px;
        margin-left: 0;
    }



    footer .socials,
    footer .hr,
    footer .text
    {
        margin-top: 32px;
    }



    footer .links
    {
        flex-direction: column;

        margin-top: 32px;

        gap: 15px;
    }



    footer .copyright
    {
        display: none;
    }
}
