@media (max-width: 767px)
{
    /*-------------------
        Global styles
    -------------------*/
    :root
    {
        --cont_padding: 20px;
        --font_size: 14px;
        --font_size_s: 14px;
        --font_size_title: 40px;
        --font_size_title_m: 30px;
        --font_size_title_s: 17px;
        --block_head_offset: 24px;
        --outside_gap: 60px;
    }


    .swiper-button-next,
    .swiper-button-prev
    {
        display: none;
    }



    /*------------
        Header
    ------------*/
    header
    {
        padding-top: 68px;
    }



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


    .mob_header .logo img
    {
        width: 148px;
    }


    .mob_header .phone,
    .mob_header .mob_menu_btn
    {
        width: 40px;
        height: 40px;
    }


    .mob_header .phone .icon
    {
        width: 20px;
        height: 20px;
    }


    .mob_header .mob_menu_btn span
    {
        width: 20px;
    }



    /*----------------
        Block head
    ----------------*/
    .block_head .title
    {
        font-size: var(--font_size_title_m);
    }


    .block_head .title br
    {
        display: none;
    }


    .block_head .desc
    {
        margin-top: var(--inner_gap_s);
    }



    /*------------------
        Form elements
    ------------------*/
    .form .submit_btn
    {
        font-size: 16px;
    }



    /*-------------------
        First section
    -------------------*/
    .first_section .bg:after
    {
        background: linear-gradient(180deg, rgba(20, 19, 19, .40) 0%, rgba(20, 19, 19, .90) 100%);
    }


    .first_section .cont
    {
        padding-block: 120px var(--inner_gap);
    }


    .first_section .items
    {
        width: 100%;
    }


    .first_section .items .icon
    {
        width: 24px;
        height: 24px;
    }


    .first_section .btns
    {
        width: 100%;
        margin-top: 326px;
    }



    .first_section .person
    {
        right: 0;
        bottom: 134px;

        width: 100%;
        padding: 0;
    }


    .first_section .person .image img
    {
        width: 320px;
        margin-inline: auto;
    }


    .first_section .person .info
    {
        right: calc(var(--cont_padding) * -1);

        min-height: 188px;

        gap: 6px;
    }


    .first_section .person .name
    {
        width: 100%;
    }


    .first_section .person .name br
    {
        display: none;
    }



    /*--------------
        Services
    --------------*/
    .services .list
    {
        width: calc(100% + var(--cont_padding_double));
        margin-inline: calc(var(--cont_padding) * -1);
        padding-block: var(--cont_padding);
        padding-inline: var(--cont_padding);
    }


    .services .service
    {
        padding-block: 16px;

        gap: var(--inner_gap_s);
    }


    .services .service .icon
    {
        align-self: flex-start;

        width: 24px;
        height: 24px;
    }


    .services .service .name
    {
        width: calc(100% - 36px);
        max-width: calc(100% - 36px);
    }


    .services .service .price
    {
        width: 100%;
        padding-left: 36px;

        text-align: left;
    }



    .services .spoler_btn
    {
        width: 100%;

        font-size: 16px;
    }



    /*------------------
        Action block
    ------------------*/
    .action_block .cont
    {
        padding: 0;
    }


    .action_block .bg
    {
        height: calc(100% - 272px);

        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }


    .action_block .bg:after
    {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        background: linear-gradient(180deg, rgba(20, 19, 19, .50) 0%, rgba(20, 19, 19, 1) 100%);
    }


    .action_block .data > .info
    {
        width: 100%;
        padding-block: 30px;
        padding-left: 0;
    }


    .action_block .data > .info .title,
    .action_block .data > .info .desc
    {
        text-align: center;
    }


    .action_block .data > .info .items
    {
        width: 100%;
        padding-inline: var(--cont_padding);
    }


    .action_block .data > .info .items .icon
    {
        width: 24px;
        height: 24px;
    }


    .action_block .form
    {
        width: 100%;
        padding-block: 30px 40px;
    }


    .action_block .form > .title
    {
        font-size: var(--font_size_title_m);
    }



    /*----------
        Team
    ----------*/
    .team .person
    {
        padding: var(--cont_padding);
    }


    .team .person .info
    {
        width: 100%;
    }


    .team .person .data
    {
        position: static;

        width: 100%;
        margin-top: var(--inner_gap);
    }


    .team .person .phone
    {
        width: 100%;
    }


    .team .person .quote
    {
        top: 10px;
        right: var(--cont_padding);
        bottom: auto;

        width: 54px;
        height: 40px;
        margin-bottom: 0;
    }



    /*-----------
        Steps
    -----------*/
    .steps .block_head .title
    {
        font-size: var(--font_size_title);
    }


    .steps .grid_row
    {
        --count_per_line: 2;
    }


    .steps .item
    {
        min-height: 180px;
        padding: var(--cont_padding);

        gap: var(--inner_gap_s);
    }


    .steps .item .head .icon
    {
        width: 24px;
        height: 24px;
    }


    .steps .item .head .icon + *
    {
        width: calc(100% - 36px);
    }



    /*-----------
        Cases
    -----------*/
    .cases .head
    {
        margin-bottom: var(--cont_padding);

        gap: var(--inner_gap_s);
    }


    .cases .rating
    {
        align-items: center;

        width: 100%;
    }


    .cases .likes
    {
        align-items: center;

        width: calc(50% - var(--inner_gap_s) / 2);
        padding-inline: var(--cont_padding);
    }



    .cases .case .data
    {
        width: calc(100% - 180px);
    }


    .cases .case .read_btn
    {
        width: 100%;
    }



    .cases .spoler_btn
    {
        width: 100%;

        font-size: 16px;
    }



    /*-----------
        About
    -----------*/
    .about .spoler_btn
    {
        width: 100%;

        font-size: 16px;
    }



    /*-------------------
        Contacts info
    -------------------*/
    .contacts_info .grid_row
    {
        --offset_v: var(--inner_gap_s);
        --count_per_line: 1;
    }


    .contacts_info .item
    {
        min-height: 0;
        padding-inline: var(--cont_padding);
    }


    .contacts_info .map
    {
        width: calc(100% + var(--cont_padding_double));
        height: 660px;
        margin-inline: calc(var(--cont_padding) * -1);
    }



    /*----------------
        Requisites
    ----------------*/
    .requisites .data
    {
        width: calc(100% + var(--cont_padding_double));
        margin-inline: calc(var(--cont_padding) * -1);
        padding-block: var(--cont_padding);
        padding-inline: var(--cont_padding);
    }


    .requisites .data .item
    {
        padding-block: 16px;
    }


    .requisites .data .item .label
    {
        width: 100%;
        margin-bottom: var(--inner_gap_s);
    }


    .requisites .data .item .val
    {
        width: 100%;

        text-align: left;
    }



    .requisites .btns
    {
        gap: var(--inner_gap_s);
    }


    .requisites .btns .btn
    {
        width: 100%;

        font-size: 16px;
    }



    /*------------
        Footer
    ------------*/
    footer .data
    {
        padding-block: 50px 40px;
    }



    footer .logo,
    footer .info,
    footer .links,
    footer .contacts
    {
        width: calc(50% - var(--cont_padding_half));
    }


    footer .logo,
    footer .info
    {
        margin-bottom: 40px;
    }


    footer .copyright
    {
        text-align: center;
    }


    footer .privacy_policy_link,
    footer .other
    {
        width: 100%;

        text-align: center;
    }

    .mt_200{
        margin-top: 80px;
    }
}