@media print,
(max-width: 1023px)
{
    /*--------------
        ButtonUp
    --------------*/
    .buttonUp
    {
        margin-bottom: var(--cont_padding_half);
    }


    .buttonUp .btn
    {
        width: 48px;
        height: 48px;
    }



    /*----------
        Tabs
    ----------*/
    .tabs .btn
    {
        min-width: 120px;
    }



    /*--------------
        All link
    --------------*/
    .all_link a
    {
        padding: 16px var(--cont_padding_double);
    }



    /*------------
        Header
    ------------*/
    header
    {
        position: fixed;
        z-index: 101;
        top: 0;
        right: 100%;
        left: auto;

        width: 325px;
        height: 100%;
        min-height: -moz-available;
        min-height: -webkit-fill-available;
        min-height:         fill-available;
        margin: 0;
        padding: 0;

        transition: transform .3s linear;

        background: var(--white_color);
    }

    header.show
    {
        transform: translateX(100%);
    }


    header .scroll
    {
        display: flex;
        overflow: auto;
        flex-direction: column;

        height: 100%;
        min-height: -moz-available;
        min-height: -webkit-fill-available;
        min-height:         fill-available;

        overscroll-behavior-y: contain;
    }


    header .top
    {
        order: 3;

        margin-top: auto;
    }


    header .data
    {
        order: 2;
    }


    header .bottom
    {
        padding-block: var(--cont_padding);
    }


    header .sites
    {
        width: 100%;
    }


    header .links
    {
        margin-top: var(--cont_padding_half);
        margin-left: 0;
    }


    header .socials
    {
        margin-top: var(--cont_padding_half);
    }


    header .logo
    {
        display: none;
    }


    header .search
    {
        width: 100%;
        margin-bottom: var(--cont_padding);
    }


    header .contacts
    {
        gap: 8px;
    }


    header .request_btn
    {
        width: 100%;
        margin-top: var(--cont_padding);
    }


    header .menu
    {
        align-content: flex-start;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
    }


    header .menu_item
    {
        width: 100%;
    }


    header .menu_item > a
    {
        display: block;

        min-height: 0;

        font-size: 14px;

        text-align: left;
    }


    header .menu_item > a.sub_link
    {
        position: relative;

        padding-right: 20px;
    }


    header .menu_item > a.sub_link:after
    {
        position: absolute;
        top: -4px;
        right: 4px;
        bottom: 0;

        display: block;

        width: 8px;
        height: 8px;
        margin-block: auto;

        content: '';
        transition: .2s linear;
        transform: rotate(-135deg);

        border-top: 2px solid;
        border-left: 2px solid;
    }


    header .menu_item > a br
    {
        display: none;
    }


    header .menu_item > a.sub_link:hover:after
    {
        top: 4px;

        transform: rotate(45deg);
    }


    header .menu_item .sub_menu,
    header .menu_item:hover .sub_menu
    {
        position: relative;
        top: 0;

        display: none;

        width: 100%;
        margin-top: var(--cont_padding_half);

        pointer-events: auto;

        opacity: 1;
    }


    header .menu_item > a.touch_link + .sub_menu.show
    {
        display: block;
        visibility: visible;
    }


    header .sub_menu .items
    {
        max-height: none;
    }


    header .sub_menu a
    {
        font-size: var(--font_size);
    }



    /*-----------------
        Mob. header
    -----------------*/
    .mob_header
    {
        display: block;
    }



    /*----------------
        Typography
    ----------------*/
    .text_block h4
    {
        font-size: 18px;
    }


    .text_block table th.big
    {
        width: 280px;
    }


    .text_block table th.small
    {
        width: 80px;
    }


    .text_block table td .row
    {
        gap: var(--cont_padding_half);
    }



    /*-----------------
        Main slider
    -----------------*/
    .main_slider .cont
    {
        min-height: 550px;
    }


    .main_slider .link a
    {
        padding: 16px var(--cont_padding_double);
    }



    /*-----------------
        Main pluses
    -----------------*/
    .main_pluses .item
    {
        width: 50%;
    }



    /*-------------
        Catalog
    -------------*/
    .catalog .row > *
    {
        width: calc(50% - var(--cont_padding));
    }



    /*-------------------------
        Invite to cooperate
    -------------------------*/
    .invite_to_cooperate .data
    {
        width: 100%;
    }


    .invite_to_cooperate .data .desc
    {
        font-size: var(--font_size);

        gap: var(--cont_padding_half);
    }


    .invite_to_cooperate .data .link
    {
        display: none;
    }


    .invite_to_cooperate .data .link a
    {
        padding: 16px var(--cont_padding_double);
    }


    .invite_to_cooperate .items
    {
        width: 100%;
        margin-top: var(--cont_padding);
    }


    .invite_to_cooperate .all_link
    {
        display: block;
    }



    /*--------------------
        Articles block
    --------------------*/
    .articles_block .swiper
    {
        width: 560px;
    }



    /*----------------
        About info
    ----------------*/
    .about_info .data
    {
        width: calc(100% - 308px);
    }


    .about_info .link a
    {
        padding: 16px var(--cont_padding_double);
    }


    .about_info .boss
    {
        width: 280px;
    }


    .about_info .boss .name
    {
        font-size: 18px;
    }



    /*--------------
        Articles
    --------------*/
    .articles .row > *
    {
        width: calc(50% - var(--cont_padding));
    }



    /*-----------
        Blog
    -----------*/
    .blog .row > *
    {
        width: calc(50% - 20px);
    }


    .blog .row > *.big
    {
        width: calc(100% - 20px);
    }



    /*-------------------
        Contacts info
    -------------------*/
    .contacts_info .data
    {
        width: 272px;
    }


    .contacts_info .map
    {
        width: calc(100% - 320px);
        height: 400px;
    }



    /*----------------
        Production
    ----------------*/
    .production .item:before
    {
        bottom: -168px;

        width: 400px;
        height: 400px;
    }


    .production .item .name
    {
        font-size: 20px;
    }


    .production .item .thumb
    {
        height: 200px;
    }



    /*----------------
        Advantages
    ----------------*/
    .advantages .item .icon
    {
        height: 64px;
    }


    .advantages .item .desc
    {
        font-size: var(--font_size);
    }



    /*-------------
        Products
    -------------*/
    .products .row:before
    {
        width: 400px;
        height: 400px;
    }


    .products .row.bubles:before
    {
        top: 100px;

        width: 300px;
        height: 300px;
    }


    .products .row.bubles:after
    {
        bottom: 100px;

        width: 300px;
        height: 300px;
    }


    .products .row.bubles2:before
    {
        top: 100px;

        width: 300px;
        height: 300px;
    }


    .products .row > *
    {
        width: calc(50% - var(--cont_padding));
    }


    .products .row > *.big
    {
        width: calc(100% - var(--cont_padding));
    }


    .products .category:before
    {
        bottom: -240px;
        left: -100px;

        width: 400px;
        height: 400px;
    }


    .products .category .name
    {
        font-size: 20px;
    }


    .products .category.big
    {
        min-height: 180px;
        padding-right: 180px;
    }



    /*------------------
        Advantages 2
    ------------------*/
    .advantages2 .grid
    {
        grid-template-columns: repeat(2, 1fr);
    }



    /*----------------
        Info block
    ----------------*/
    .info_block .data.big
    {
        width: calc(100% - 264px);
    }


    .info_block .image.small
    {
        width: 240px;
    }



    /*--------------
        For whom
    --------------*/
    .for_whom .grid
    {
        grid-template-columns: repeat(2, 1fr);
    }



    /*------------------
        Service info
    ------------------*/
    .service_info .item .name
    {
        font-size: 20px;
    }


    .service_info .image:before,
    .service_info .image:after
    {
        width: 220px;
        height: 220px;
    }



    /*---------
        Why
    ---------*/
    .why .grid
    {
        grid-template-columns: repeat(2, 1fr);
    }



    /*-----------
        Steps
    -----------*/
    .steps .row:before
    {
        top: 30px;

        width: calc(100% - 120px);
    }


    .steps .item .number
    {
        width: 60px;
        height: 60px;

        font-size: 16px;
    }


    .steps .item .line
    {
        margin-inline: 28px;
    }


    .steps .item .name
    {
        font-size: 20px;
    }


    .steps .item:last-child .info > *
    {
        width: 180px;
    }



    /*---------
        How
    ---------*/
    .how .grid
    {
        grid-template-columns: repeat(1, 1fr);
    }


    .how .item.big_h
    {
        grid-row: auto;
    }

    .how .item.big_w
    {
        grid-column: auto;
    }



    /*------------------
        Product info
    ------------------*/
    .product_info .images
    {
        width: 100%;
        margin-bottom: var(--cont_padding_double);
    }


    .product_info .images .thumbs .image
    {
        height: 100px;
    }



    .product_info .data
    {
        width: 100%;
    }


    .product_info .btns
    {
        display: none;
    }


    .product_info .mob_btns
    {
        display: flex;
    }


    .product_info .paroduct_name
    {
        display: none;

        margin-bottom: var(--cont_padding);
    }


    .product_info .mob_paroduct_name
    {
        display: block;
    }


    .product_info .flavor .vals label
    {
        width: calc(12.485% - 8px);
    }


    .product_info .pluses > *
    {
        padding: 20px;

        font-size: 13px;
    }



    /*------------------
        Request calc
    ------------------*/
    .request_calc .form .line
    {
        width: calc(50% - var(--cont_padding_half));
        margin-bottom: var(--cont_padding);
    }


    .request_calc .form .submit_btn
    {
        width: 100%;
    }



    /*------------------
        Product data
    ------------------*/
    .product_data .item .head .title
    {
        width: calc(100% - 48px);

        font-size: 20px;
    }


    .product_data .item .head .icon
    {
        width: 30px;
        height: 30px;
    }


    .product_data .item .head .icon svg
    {
        width: 22px;
        height: 21px;
    }



    /*---------------------
        Contacts block3
    ---------------------*/
    .contacts_block3 .data
    {
        width: 280px;
    }


    .contacts_block3 .item
    {
        font-size: 16px;
    }


    .contacts_block3 .item .icon
    {
        width: 40px;
        height: 40px;
    }


    .contacts_block3 .item .icon svg
    {
        width: 18px;
        height: 18px;
    }


    .contacts_block3 .item .icon svg.big
    {
        width: 20px;
        height: 20px;
    }


    .contacts_block3 .btn
    {
        padding: 16px var(--cont_padding_double);
    }


    .contacts_block3 .map
    {
        width: calc(100% - 304px);
        height: 440px;
    }



    /*-------------
        Mission
    -------------*/
    .mission .image
    {
        width: 280px;
        margin-right: 0;
    }


    .mission .data
    {
        width: calc(100% - 304px);
        margin-right: 0;

        font-size: var(--font_size);
    }



    /*------------
        Values
    ------------*/
    .values .item
    {
        font-size: var(--font_size);
    }


    .values .item .name
    {
        font-size: 18px;
    }



    /*----------------------
        About production
    ----------------------*/
    .about_production .data
    {
        width: 100%;
    }


    .about_production .video
    {
        width: 100%;
        margin-top: var(--cont_padding);
    }



    /*-------------
        History
    -------------*/
    .history .row:before
    {
        top: 30px;

        width: calc(100% - 120px);
    }


    .history .item .number
    {
        width: 60px;
        height: 60px;

        font-size: 16px;
    }


    .history .item .line
    {
        margin-inline: 28px;
    }


    .history .item .year
    {
        font-size: 20px;
    }


    .history .item .info > *
    {
        width: 170px;
        min-width: 0;
    }


    .history .item .info br
    {
        display: none;
    }



    /*-----------
        Files
    -----------*/
    .files .row > *
    {
        width: calc(33.333% - 20px);
    }


    .files .file
    {
        min-height: 168px;
    }


    .files .file .btn
    {
        font-size: var(--font_size);
    }



    /*-----------------------
        For partners info
    -----------------------*/
    .for_partners_info .data
    {
        width: calc(100% - 344px);
    }


    .for_partners_info .items
    {
        font-size: var(--font_size);
    }


    .for_partners_info .image
    {
        width: 320px;
    }



    /*-------------------------
        Partnership formats
    -------------------------*/
    .partnership_formats .item .image
    {
        min-height: 180px;
    }


    .partnership_formats .item .name
    {
        font-size: 18px;
    }


    .partnership_formats .item .label,
    .partnership_formats .item .val
    {
        font-size: var(--font_size);
    }



    /*--------------------
        We looking for
    --------------------*/
    .we_looking_for .item .head
    {
        flex-wrap: wrap;

        gap: var(--cont_padding_half);
    }


    .we_looking_for .item .desc
    {
        width: 100%;
    }



    /*---------------------
        Partnership why
    ---------------------*/
    .partnership_why .row > *
    {
        width: calc(50% - var(--cont_padding));
    }



    /*---------------------
        Contacts block2
    ---------------------*/
    .contacts_block2 .text
    {
        font-size: var(--font_size);
    }



    /*------------
        Footer
    ------------*/
    footer .logo img
    {
        width: 200px;
 
    }


    footer .links
    {
        display: none;
    }
}