:root{
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    --black: #000;
    --white: #fff;
    --gray: #707070;
    --red: #c12026;
    --orange: #e07a22;
    --yellow: #e9bf13;
    --green: #25aa5c;
    --cyan: #3392cd;
    --blue: #26537c;
    --magenta: #7c4068;
    --timer: #EAC0C1;
    --rose: #EAC0C1;
    --timer_red: #7B2224;
    --rose_button_red: #7B2224;
    --subtitle_color: #3F3A39;

    --page_width: 1360px;
    --background_main: #f8f8f5;
    --background_sub_header: #F5F7F7;
    --color_main: #000000;
    /*--background_header: #7FA4BE;*/
    --background_header: #2d2c2b;
    --color_header: #ffffff;
    /*--background_footer: #7FA4BE;*/
    --background_footer: #2d2c2b;
    --color_footer: #ffffff;
    --color_gray_text: #7A8088;
    --background_okami_block: #f2f4f3;
    --background_presenter: #f5f0eb;

    --background_input: #ffffff;
    --radius_input: 12px;

    --color_link: #2f65fd;
    --color_link_hover: #6990ff;

    --color_error: #ff2c2c;
    --border_standard: 1px solid #D8D8D3;
    /*--border_standard: #CBD5E1;*/

    --no_gradient: var(--background_footer);

    --radius_button: 1rem;
    --radius_window: 20px;
    --button_shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.16);
    --box_shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.09);
    --top_info_paddings: 0;
    --header_paddings: 28px 0;
    --footer_paddings: 40px 0;
    --breadcrumbs_paddings: 0;
    --section_paddings: 20px 0;
    --card_content_paddings: 24px 24px;
    --border_radius_button: 20px;
    --radius12: 12px;
    --radius32: 32px;
    --radius20: 20px;

    --hr_color: #D8D8D3;

    --banners_aspect_desktop: 1903 / 470;
    --gap_big: 40px;
    --gap_standard: 20px;
    --gap_small: 20px; /* cards */
    --gap_12px: 12px;
    --swiper_bullet: rgba(217, 217, 217, 50%);
    --swiper_bullet_active: rgba(217, 217, 217, 80%);
}

@font-face{
    font-family: 'Gilroy';
    src: local('Gilroy'),
    url('../fonts/Gilroy-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face{
    font-family: 'Gilroy';
    src: local('Gilroy'),
    url('../fonts/Gilroy-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face{
    font-family: 'Gilroy';
    src: local('Gilroy'),
    url('../fonts/Gilroy-Bold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

*{
    box-sizing: border-box;
    font-family: 'Gilroy', sans-serif;
    margin: 0;
    border: 0;
    outline: none;
    font-weight: 400;
}

html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    border: 0;
}

html {
    position: relative;
    min-height: 100vh;
    font-size: 16px;
}

body {
    position: relative;
    overflow-x: hidden;
    background-color: var(--white);
    color: var(--black);
    scroll-behavior: smooth;
}

img{
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: inherit;
}

img{
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: inherit;
}

button, .button{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-block;
    white-space: nowrap;
    word-break: keep-all;
    text-align: center;
    cursor: pointer;
}

.button40, .main_menu_item, .modification_button{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.6rem;
    font-size: 14px;
    height: 40px;
    font-weight: 500;
    text-align: center;
    text-decoration: none !important;
    color: var(--color_main);
    padding: 0 18px;
    cursor: pointer;
    white-space: nowrap;
}
.main_menu_item{
    background-color: var(--white);
    border: var(--border_standard);
    border-radius: var(--border_radius_button);
    font-size: 14px;
}
.modification_button{
    background-color: var(--white);
    border: 0;
    border-radius: var(--border_radius_button);
    font-size: 14px;
}

.button60{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.6rem;
    font-size: 24px;
    font-weight: 600;
    height: 60px;
    border-radius: 12px !important;
    text-align: center;
    text-decoration: none !important;
    color: var(--color_main);
    padding: 0 18px;
    cursor: pointer;
    white-space: nowrap;
}

.button_white {
    background-color: var(--white);
    border: var(--border_standard);
    border-radius: var(--border_radius_button);
    font-size: 14px;
}
.button_white:visited{
    color: var(--color_main);
}

.button_red {
    background-color: var(--red);
    border-radius: var(--border_radius_button);
    color: var(--white);
    font-size: 14px;
}
.button_red:visited, .button_red:active, .button_red:hover{
    color: var(--white);
}

.button_rose {
    background-color: var(--rose);
    border-radius: var(--border_radius_button);
    color: var(--rose_button_red);
    font-size: 14px;
}
.button_rose:visited, .button_rose:active, .button_rose:hover{
    color: var(--rose_button_red);
}

.button_animated {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.button_animated:hover {
    transform: translateY(-2px);
    box-shadow: var(--button_shadow);
}

form{
    position: relative;
}

input[type="text"], input[type="password"], input[type="number"], input[type="email"], select{
    line-height: 40px;
    height: 40px;
    max-width: 100%;
    background-color: var(--background_input);
    color: var(--black);
    border: none;
    border-radius: var(--radius_input);
    border: var(--border_standard);
    padding: 0 0.6rem;
    outline: none;
}

input[type="text"].margin0, input[type="number"].margin0, input[type="number"].margin0, input[type="email"].margin0, select.margin0{
    margin: 0;
}

input[type="checkbox"]{
    cursor: pointer;
}

label{
    font-size: 13px;
    cursor: pointer;
    line-height: 1.4;
}

h1, .h1{
    font-size: 3rem;
    line-height: 1.2;
}

h2, .h2{
    font-size: 2rem;
    line-height: 1.2;
}

a{
    color: var(--black);
    text-decoration: underline;
    /*transition: color 0.1s ease;*/
    cursor: pointer;
}
a:active{
    color: var(--black);
}
a:visited{
    color: var(--black);
}
a:hover{
    color: var(--black);
    text-decoration: underline;
}

a.footer_link{
    text-decoration: none;
    color: var(--color_footer);
    /*transition: color 0.1s ease;*/
    cursor: pointer;
}
a.footer_link:active{
    color: var(--color_footer);
}
a.footer_link:visited{
    color: var(--color_footer);
}
a.footer_link:hover{
    color: var(--color_footer);
    text-decoration: underline;
}

a.main_menu_item{
    text-decoration: none;
    color: var(--black);
    /*transition: color 0.1s ease;*/
    cursor: pointer;
}
a.main_menu_item:active{
    color: var(--black);
}
a.main_menu_item:visited{
    color: var(--black);
}
a.main_menu_item:hover{
    color: var(--black);
    text-decoration: underline;
}

.btn_white{
    background-color: var(--white);
    border: 1px solid var(--black);
}

.btn_blue{
    background-color: var(--blue);
    color: var(--white);
}

.btn_yellow{
    background-color: var(--yellow);
    color: var(--black);
}

.btn_black{
    background-color: var(--black);
    color: var(--white);
}

.btn_gray{
    background-color: var(--gray);
    color: var(--white);
}

.btn_wide{
    min-width: 220px;
}

.width100{
    width: 100%;
}

.w100{
    width: 100%;
}

.width50{
    width: 50%;
}

.relative{
    position: relative;
}

.margin0auto{
    margin: 0 auto;
}

.center_text{
    text-align: center;
}

.padding_vert2rem{
    padding: 2rem 0;
}

.padding_vert4rem{
    padding: 4rem 0;
}

/* flex */

.flex{
    display: flex;
}

.flex_row{
    flex-direction: row;
}

.flex_column{
    flex-direction: column;
}

.justify_content_center{
    justify-content: center;
}

.align_items_center{
    align-items: center;
}

/* flex end */

.breadcrumbs {
    margin: 20px 0 10px;
}

.breadcrumbs__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.breadcrumbs__item {
    display: inline;
}

.breadcrumbs__item:not(:last-child)::after {
    display: inline-block;
    width: .6rem;
    height: 13px;
    margin: 0 0.7em;
    background-image: url(/img/breadcrumbs_arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transform: translateY(2px);
    font-size: 13px;
}

.breadcrumbs__link {
    padding: 1.5rem 0;
    font-weight: 400;
    font-size: 13px;
}

.breadcrumbs__link--current, .breadcrumbs__link:active {
    opacity: .55;
}

.breadcrumbs__name{
    margin: 0;
}

/* checkbox + label */

.custom-checkbox {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

/* для элемента label, связанного с .custom-checkbox */
.custom-checkbox+label {
    display: block;
    user-select: none;
}

/* создание в label псевдоэлемента before со следующими стилями */
.custom-checkbox+label::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #ffffff;
    border-radius: 0.25em;
    margin-right: 0.5em;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
    transform: translateY(2px);
}

.custom-checkbox.black+label::before {
    filter: invert();
}

/* стили при наведении курсора на checkbox */
.custom-checkbox:not(:disabled):not(:checked)+label:hover::before {
    border-color: #ffffff;
}

/* стили для активного чекбокса (при нажатии на него) */
.custom-checkbox:not(:disabled):active+label::before {
    background-color: rgba(255, 255, 255, 0);
    border-color: #ffffff;
}

/* стили для чекбокса, находящегося в фокусе */
.custom-checkbox:focus+label::before {
    /*box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);*/
}

/* стили для чекбокса, находящегося в фокусе и не находящегося в состоянии checked */
.custom-checkbox:focus:not(:checked)+label::before {
    border-color: #ffffff;
}

/* стили для чекбокса, находящегося в состоянии checked */
.custom-checkbox:checked+label::before {
    border-color: #ffffff;
    background-color: rgba(11, 118, 239, 0);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}

/* стили для чекбокса, находящегося в состоянии disabled */
.custom-checkbox:disabled+label::before {
    background-color: #6f6f6f;
}

/* div в котором чекбокс и label */
.checkbox{
    margin: 1rem 0;
}

/* end checkbox + label */

/* checkbox for white bg */
.custom-checkbox2 {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

/* для элемента label, связанного с .custom-checkbox2 */
.custom-checkbox2+label {
    display: block;
    user-select: none;
    color: #000000;
}

/* создание в label псевдоэлемента before со следующими стилями */
.custom-checkbox2+label::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #000000;
    border-radius: 0.25em;
    margin-right: 0.5em;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
    transform: translateY(2px);
}

/* стили при наведении курсора на checkbox */
.custom-checkbox2:not(:disabled):not(:checked)+label:hover::before {
    border-color: #000000;
}

/* стили для активного чекбокса (при нажатии на него) */
.custom-checkbox2:not(:disabled):active+label::before {
    background-color: rgba(0, 0, 0, 0);
    border-color: #000000;
}

/* стили для чекбокса, находящегося в фокусе */
.custom-checkbox2:focus+label::before {
    /*box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);*/
}

/* стили для чекбокса, находящегося в фокусе и не находящегося в состоянии checked */
.custom-checkbox2:focus:not(:checked)+label::before {
    border-color: #000000;
}

/* стили для чекбокса, находящегося в состоянии checked */
.custom-checkbox2:checked+label::before {
    border-color: var(--red);
    background-color: var(--red);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}

/* стили для чекбокса, находящегося в состоянии disabled */
.custom-checkbox2:disabled+label::before {
    background-color: #6f6f6f;
    border-color: #6f6f6f;
}

/* modal */

.hidden_div{
    margin: 0;
    padding: 0;
    outline: none;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden;
}

.overlay_div{
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    /*cursor: pointer;*/
    z-index: 9999;
}

.modal_div{
    position: relative;
    max-width: 420px;
    width: 100%;
    max-height: 100vh;
    /*min-height: 400px;*/
    overflow-y: auto;
    padding: 2rem;
    margin: 0.5rem;
    color: var(--white);
    background-color: var(--no_gradient);
    background: radial-gradient(148.27% 162.3% at 15.08% -36.41%, rgb(140, 140, 140) 0%, var(--background_footer) 100%);
    border: 1px solid rgba(255, 255, 255, 0.53);
    border-radius: var(--radius_window);
    /*box-shadow: 0 5px 15px #aaa;*/
    transform: translateY(100%);
    transform-origin: left top;
    -webkit-transform: translateY(100%);
    -webkit-transform-origin: left top;
    opacity: 0;
    /*transition: 200ms ease;*/
    will-change: transform, opacity;
    cursor: initial;
}

.modal_active{
    transform-origin: left top;
    -webkit-transform-origin: left top;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1;
    animation: 0.3s ease show_popup;
}

.modal_hide{
    animation: 0.3s ease hide_popup;
}

.spinner_div{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(255, 255, 255);
    border: var(--border_standard);
    border-radius: 12px;
}

.spinner_img{
    width: 120px;
}

.modal_title, .thanks_title{
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 1rem;
}
.modal_title{
    margin-bottom: 0;
}

.thanks_title{
    text-align: center;
    margin: 2rem 0;
}

.thanks_text{
    font-size: 1.2rem;
    margin: 0 0 2rem 0;
    text-align: center;
}

.modal_form{
    position: relative;
    width: 100%;
}

.close_btn{
    position: absolute;
    right: 10px;
    top: 10px;
    width: 18px;
    height: 18px;
}

.close_button{
    display: block;
    filter: invert();
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.error_div{
    color: #fff;
    background-color: var(--color_error);
    padding: 1rem;
}

.error{
    background-color: #fda6a6 !important;
}

.label_error{
    color: #fda6a6 !important;
}

@keyframes show_popup {
    from {
        transform: translateY(100%);
        -webkit-transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        -webkit-transform: translateY(0);
        opacity: 1;
    }
}

@keyframes hide_popup {
    from {
        transform: translateY(0);
        -webkit-transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(100%);
        -webkit-transform: translateY(100%);
        opacity: 0;
    }
}

/* end modal */

.phone{
    white-space: nowrap;
    word-break: keep-all;
}

/* OTHER STYLES */

.app{
    position: relative;
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.header {
    position: sticky;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    min-height: 96px;
    height: auto;
    padding: var(--header_paddings);
    background-color: var(--background_header);
    z-index: 100;
}

.header_call_button{
    z-index: 10;
}

.header_inner{
    max-width: var(--page_width);
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.header_left_block, .header_right_block {
    width: 340px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.header_right_block {
    justify-content: flex-end;
    gap: 12px;
}

.content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    width: 100%;
    flex: 1;
}

.banner_main_block, .main_swiper_container{
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: var(--banners_aspect_desktop);
    overflow: hidden;
}

.swiper.main_banners {
    position: relative;
    width: 100%;
    overflow-x: hidden;
}

.image_link {
    position: relative;
    display: flex;
    margin: 0;
    width: 100%;
    aspect-ratio: var(--banners_aspect_desktop);
}

.swiper_ui_wrapper{
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    padding: 0 40px;
}

.swiper_ui_inner{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--gap_big);
    flex-wrap: nowrap;
    width: 100%;
    z-index: 10;
}

.swiper_buttons_wrapper{
    position: relative;
    display: flex;
    gap: var(--gap_12px);
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

/* main banners swiper COPY TO PREVENT REWRITE */
.swiper.main_banners{

}
.swiper.main_banners{
    position: relative;
    width: 100%;
    overflow-x: hidden;
}
.swiper-button-prev{
    border-radius: 50%;
    width: 36px;
    height: 36px;
    background-image: url("/img/arrow_left.svg");
    background-size: cover;
    background-position: 50% 50%;
    position: relative;
    top: initial;
    left: initial;
    right: initial;
    cursor: pointer;
}
.swiper-button-next{
    border-radius: 50%;
    width: 36px;
    height: 36px;
    background-image: url("/img/arrow_right.svg");
    background-size: cover;
    background-position: 50% 50%;
    position: relative;
    top: initial;
    left: initial;
    right: initial;
    cursor: pointer;
}
.swiper-button-next::after, .swiper-button-prev::after{
    content: "";
}
.swiper-pagination{
    position: relative;
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: var(--gap_12px);
    height: 9px;
}
.swiper-pagination-bullet{
    height: 9px;
    width: auto;
    flex: 1;
    border-radius: 4px;
    background: var(--swiper_bullet);
    opacity: 1;
}
.swiper-pagination-bullet-active{
    background: var(--swiper_bullet_active);
}
.swiper-button-disabled{
    position: absolute !important;
    width: 36px !important;
    height: 36px !important;
    display: none;
}
/* main banners swiper end */

.breadcrumbs_wrapper{
    position: relative;
    max-width: var(--page_width);
    padding: var(--breadcrumbs_paddings);
    width: 100%;
    margin: 0 auto;
}

.footer {
    width: 100%;
    position: relative;
    display: flex;
    min-height: 38px;
    background-color: var(--background_footer);
    color: var(--color_footer);
    padding: var(--footer_paddings);
}

.footer_inner{
    position: relative;
    width: var(--page_width);
    margin: 0 auto;
}

.footer_upper_part, .footer_bottom_part{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.footer_logo{
    display: block;
    width: 143px;
    margin: 0;
}

.official_dealer_text{
    font-size: 15px;
    font-weight: 500;
    margin-top: 12px;
}

.footer_blocks{
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 150px;
}

.list_block, .list_block_right{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
}
.list_block_right{
    align-items: flex-end;
}

.list_block_item{
    font-size: 15px;
}
.list_block_head{
    font-size: 15px;
    font-weight: 600;
}

.fs13{
    font-size: 13px;
}

.ta_right{
    text-align: right;
}

hr{
    display: block;
    border: none;
    border-top: 1px solid #D8D8D3;
    width: 100%;
    margin: 40px auto;
}

section{
    position: relative;
    width: 100%;
}

.section_inner{
    position: relative;
    padding: var(--section_paddings);
    max-width: var(--page_width);
    width: 100%;
    margin: 0 auto;
}

.article{
    position: relative;
    font-size: 15px;
}

.content_background_and_color{
    background-color: var(--background_main);
    color: var(--color_main);
}

.footer_background_and_color{
    background-color: var(--background_footer);
    color: var(--color_footer);
}

.header_background_and_color{
    background-color: var(--background_header);
    color: var(--color_header);
}

.background_and_color_dark{
    background-color: var(--black);
    color: var(--white);
}

.background_and_color_light{
    background-color: var(--white);
    color: var(--black);
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.top_info_block{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 40px;
    padding: var(--top_info_paddings);
    background-color: var(--background_sub_header);
}

.top_info_block_inner{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.top_info_block_phone, .top_info_block_address_block, .top_info_block_address_block{
    white-space: nowrap;
    font-size: 14px;
}

.main_logo{
    display: block;
    width: 164px;
    margin: 0;
}

.logo_link{
    position: relative;
    display: block;
    width: fit-content;
    z-index: 10;
}

.main_menu_container {
    position: relative;
}

.main_menu {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
}

.main_menu_item_container{
    position: relative;
}

.main_menu_submenu_container{
    display: none;
    position: absolute;
    left: 0;
}

.submenu_show {
    display: block;
}

.main_menu_submenu_item{
    display: block;
    color: var(--black);
    white-space: nowrap;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    line-height: 40px;
    width: 100%;
    padding: 0 20px;
}
.main_menu_submenu_item:hover, .main_menu_submenu_item:active{
    text-decoration: none;
}
.main_menu_submenu_item:hover{
    background-color: var(--red);
    color: var(--white) !important;
}

.main_menu_submenu_inner{
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 0.5rem;
    border: var(--border_standard);
    border-radius: var(--radius_window);
    background-color: var(--white);
    padding: 10px 0;
    overflow-x: hidden;
}

.catch_auto_block, .auto_presenter_block, .service_presenter_block, .form_presenter_block{
    position: relative;
    padding: 32px;
    border: var(--border_standard);
    border-radius: var(--radius_window);
    background-color: var(--background_presenter);
}
.auto_presenter_block, .service_presenter_block, .form_presenter_block{
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0;
    overflow: hidden;
}
.form_presenter_block{
    padding: 32px;
    gap: 32px;
}

.two_halfs_flex_block, .two_halfs_gap40_flex_block, .two_halfs_flex_block_contacts{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--gap_standard);
    width: 100%;
}
.two_halfs_gap40_flex_block{
    gap: var(--gap_big);
}

.half_flex_block, .half_flex_block_biggap, .half_flex_block_biggap1{
    position: relative;
    max-width: calc((100% - var(--gap_standard)) / 2);
    width: 100%;
}
.half_flex_block_biggap, .half_flex_block_biggap1{
    max-width: calc((100% - var(--gap_big)) / 2);
}

.radius32{
    border-radius: var(--radius32);
    overflow: hidden;
}

.gray_uppercase_text{
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    color: var(--color_gray_text);
}

.big_header{
    font-size: 50px;
    line-height: 1.1;
    font-weight: 600;
}

.big_header_subtitle, .auto_description{
    color: var(--subtitle_color);
    font-weight: 400;
    font-size: 20px;
}
.auto_description{
    min-height: 96px;
}

.text24bold{
    font-size: 24px;
    font-weight: 600;
}

.catch_auto_header_red_span{
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: var(--red);
}

.catch_auto_subheader{
    font-size: 24px;
    font-weight: 600;
}

.column_block{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
}

.flex_right_counter_block{
    position: relative;
    display: flex;
    justify-content: flex-end;
}

.catch_auto_right_part_wrapper{
    position: relative;
    max-width: 448px;
    width: 100%;
}

.timer{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
}

.timer_part{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    padding: 0.6rem 0.6rem;
    line-height: 1;
    background-color: var(--timer);
    border-radius: 10px;
    aspect-ratio: 103 / 115;
}

.timer_time{
    width: 100%;
    word-break: keep-all;
    text-align: center;
    font-weight: 600;
    font-size: 48px;
    color: var(--timer_red);
}

.timer_label{
    width: 100%;
    word-break: keep-all;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
}

.form_wrapper{
    position: relative;
    width: 100%;
    margin-top: 40px;
}

.catch_auto_form{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
}

.catch_auto_form_inner{
    position: relative;
    display: flex;
    gap: var(--gap_standard);
}

.input60{
    line-height: 60px !important;
    height: 60px !important;
}

.autos_container{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
    gap: var(--gap_standard);
}

.auto_catalog_card, .auto_feature_image_item, .auto_small_card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 0 1 calc((100% - var(--gap_small) * 2) / 3);
    width: calc((100% - var(--gap_small) * 2) / 3);
    border-radius: 20px;
    border: var(--border_standard);
    background-color: var(--white);
    overflow: hidden;
    text-decoration: none;
}
.auto_catalog_card:hover{
    text-decoration: none;
}
.auto_small_card{
    flex: 0 1 calc((100% - var(--gap_small) * 3) / 4);
    width: calc((100% - var(--gap_small) * 3) / 4);
}
.auto_small_card:active, .auto_small_card:hover, .auto_small_card:visited{
    text-decoration: none;
}

.card_animated {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.card_animated:hover {
    transform: translateY(-6px);
    box-shadow: var(--box_shadow);
}

.auto_card_image_wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    aspect-ratio: 438 / 282;
    background-image: url("/img/preloader.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    overflow: hidden;
}

.auto_card_image {
    display: block;
    width: 100%;
    transition: 0.3s ease-out;
    color: transparent;
    object-fit: cover;
    background-color: var(--white);
}

.auto_card_content {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: var(--card_content_paddings);
    border-top: var(--border_standard);
    color: var(--color_main) !important;
    background-color: var(--white);
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    text-decoration: none;
}

.auto_card_inner_div {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: var(--gap_12px);
}

.auto_card_title{
    font-weight: 600;
    font-size: 30px;
}

.auto_small_card_title{
    font-weight: 600;
    font-size: 24px;
}

.auto_card_price{
    font-size: 14px;
    color: var(--color_gray_text);
}

.span_bold{
    font-weight: 600;
    color: var(--color_main);
}

.old_price{
    font-weight: 400;
    color: var(--color_main);
    text-decoration: line-through;
}

.auto_card_features_block{
    position: relative;
    display: flex;
    gap: var(--gap_standard);
    width: 100%;
}

.auto_card_feature_div{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 0 1 calc((100% - var(--gap_small) * 2) / 3);
    width: calc((100% - var(--gap_small) * 2) / 3);
}

.auto_card_feature_value{
    font-size: 14px;
    font-weight: bold;
    color: var(--color_main);
}

.auto_card_feature_name{
    font-size: 10px;
    font-weight: 400;
    color: var(--color_gray_text);
    text-transform: uppercase;
}

.auto_advantages_block{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0.75rem 0 1.25rem;
}

.auto_advantages_item{
    font-size: 14px;
    font-weight: 400;
}

.okami_block, .okami_block_white{
    position: relative;
    width: 100%;
    border-top: var(--border_standard);
    border-bottom: var(--border_standard);
    background-color: var(--background_okami_block);
    padding: 40px 0;
}
.okami_block_white{
    background-color: var(--background_main);
    border: 0;
}

.background_autocenter, .background_service{
    background-image: url("/img/autocenter.jpg");
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
}
.background_service{
    background-image: url("/img/service.jpg");
}

.ymap_container{
    position: relative;
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    min-height: 422px;
    flex: 1;
    border: var(--border_standard);
    border-radius: var(--radius20);
    overflow: hidden;
    background-color: var(--white);
}

.yandex_reviews_wrapper{
    position: relative;
    width: 100%;
    max-width: 760px;
    height: 526px;
    margin: 0 auto;
    border-radius:var(--radius20);
    overflow: hidden;
    border: var(--border_standard);
    background-color: var(--white);
}

.contacts_block{
    border: var(--border_standard);
    border-radius: var(--radius20);
    padding: 32px;
    background-color: var(--white);
}

.contacts_flex_wrapper{
    position: relative;
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
}

.margin_bottom10px{
    margin-bottom: 10px;
}

.auto_presenter_block_left, .service_presenter_block_left{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
    max-width: 555px;
    min-width: 360px;
    width: 100%;
    padding: 32px;
}
.service_presenter_block_left{
    justify-content: space-between;
}

.service_presenter_wrapper{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
    width: 100%;
}

.auto_presenter_block_right, .service_presenter_block_right{
    position: relative;
    flex: 1;
    background-color: var(--white);
    display: flex;
    align-items: flex-start;
    justify-content: stretch;
}

.cover_image{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service_form_image_wrapper{
    position: relative;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    flex: 1;
}

.color_picker_block{
    position: absolute;
    display: flex;
    gap: var(--gap_standard);
    justify-content: space-between;
    align-items: center;
    background-color: var(--white);
    padding: 24px;
    border-radius: 36px;
    border: var(--border_standard);
    width: initial;
    overflow: hidden;
    bottom: 32px;
    left: 32px;
    right: 32px;
}

.color_picker_block_left{
    position: relative;
}

.color_picker_block_right{
    position: relative;
    display: flex;
    gap: 12px;
}

.color_picker_item{
    position: relative;
    width: 24px;
    height: 24px;
    border-radius: 100%;
    overflow: hidden;
    border: var(--border_standard);
    cursor: pointer;
}

.tech_info_block{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--gap_standard);
    flex-wrap: nowrap;
    margin-top: 24px;
}

.tech_info_block_item{
    position: relative;
    display: flex;
    height: 100px;
    border-radius: 50px;
    border: var(--border_standard);
    justify-content: flex-start;
    align-items: stretch;
    background-color: var(--white);
    overflow: hidden;
    padding: 22px;
    gap: 22px;
    flex: 1;
}

.tech_info_block_item_img_wrapper, .service_features_item_img_wrapper{
    position: relative;
    width: 56px;
    height: 56px;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--rose);
    border-radius: 50%;
}
.service_features_item_img_wrapper{
    width: 69px;
    height: 69px;
}

.tech_info_block_item_img{
    display: block;
}

.tech_info_block_item_texts, .service_features_item_texts, .credit_features_item_texts{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.service_features_item_texts{
    justify-content: flex-start;
}
.credit_features_item_texts{
    justify-content: center;
}

.tech_info_block_item_value{
    font-size: 24px;
    font-weight: 600;
}

.tech_info_block_item_title{
    font-weight: 600;
    font-size: 12px;
    color: var(--subtitle_color);
    text-transform: uppercase;
}

.auto_price{
    font-size: 50px;
    color: var(--color_main);
    margin: 20px 0 10px 0;
}

.auto_old_price{
    font-weight: 400;
    color: var(--color_main);
    text-decoration: line-through;
}

.order_car_buttons_block{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.auto_feature_image_container{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--gap_standard);
    flex-wrap: nowrap;
    width: 100%;
    margin-top: 40px;
}

.complectations_container{
    position: relative;
    width: 100%;
    margin-top: 20px;
}

.modification_buttons_block{
    position: relative;
    display: flex;
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    max-width: max-content;
    width: 100%;
    margin: 20px 0;
    overflow-x: auto;
}

.modification_button_active{
    background-color: var(--red);
    color: var(--white);
}

.options_block {
    position: relative;
    width: 100%;
}

.complectations_block{
    position: relative;
}

.complectations_block_title {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 24px;
    background-color: var(--white);
    margin-bottom: 20px;
    border-radius: var(--radius12);
    cursor: pointer;
}

.complectations_block_title_title{
    font-size: 24px;
    font-weight: 500;
}

.complectations_block_title_plus{
    font-size: 32px;
}

.complectations_block_container_wrapper{
    display: none;
    position: relative;
    width: 100%;
    overflow-x: auto;
}

.complectation_block_active{
    display: block;
}

.complectations_block_container{
    position: relative;
    font-size: 16px;
    margin-bottom: 2rem;
    padding: 0 1rem;
    min-width: 600px;
}

.c_table_item{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    padding: 0.5rem 0;
    border-bottom: var(--border_standard);
}

.c_table_item_name{
    flex: 1;
}
.c_table_item_complectation{
    max-width: 76px;
    width: 100%;
}
.c_table_item_exists{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #5b5b5b;
    margin: 0 auto;
}

.two_blocks_form_container{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--gap_big);
    flex-wrap: nowrap;
    width: 100%;
}

.two_blocks_form_container_left{
    position: relative;
    flex: 1;
}

.two_blocks_form_container_right{
    position: relative;
    max-width: 310px;
    width: 100%;
}

.vertical_form_inner{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
}

.service_form_inputs_wrapper{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--gap_standard);
}
.service_form_inputs_wrapper > * {
    flex: 0 1 calc((100% - var(--gap_standard)) / 2);
    width: calc((100% - var(--gap_standard)) / 2);
}
.service_form_inputs_wrapper > *:last-child {
    flex: 0 1 100%;
    width: 100%;
}

.service_info_block{
    position: relative;
    width: 100%;
}

.service_features_block{
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    gap: var(--gap_standard);
    flex-wrap: wrap;
    margin-top: 32px;
}

.service_features_item{
    position: relative;
    display: flex;
    border-radius: 40px;
    border: var(--border_standard);
    justify-content: flex-start;
    align-items: stretch;
    background-color: var(--white);
    overflow: hidden;
    padding: 22px;
    gap: 22px;
    flex: 0 1 calc((100% - var(--gap_standard)) / 2);
    width: calc((100% - var(--gap_standard)) / 2);
}

.service_features_item_title{
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 12px;
}

.service_features_item_text{
    font-size: 24px;
    font-weight: 400;
    color: var(--subtitle_color);
}

.service_how_to_block{
    position: relative;
    display: flex;
    gap: var(--gap_standard);
    justify-content: space-between;
    align-items: center;
    background-color: var(--white);
    padding: 24px;
    border-radius: 66px;
    border: var(--border_standard);
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.service_how_to_block_item{
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: var(--gap_standard);
}

.service_how_to_block_item_number{
    font-size: 28px;
    font-weight: 600;
    color: var(--red);
}

.service_how_to_block_item_text{
    position: relative;
    font-size: 24px;
    font-weight: 400;
}

.service_how_to_block_line{
    position: relative;
    height: 2px;
    background-color: var(--red);
    width: 100%;
    max-width: 120px;
}

.form_presenter_block_left{
    position: relative;
    border-radius: var(--radius20);
    overflow: hidden;
    flex: 1;
    display: flex;
}

.form_presenter_block_right{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap_standard);
    border-radius: var(--radius20);
    overflow: hidden;
    padding: 32px;
    background-color: var(--white);
    max-width: 772px;
}

.over_photo_okami_logo{
    display: block;
    position: absolute;
    bottom: 24px;
    right: 24px;
    width: 108px;
}

.disclaimer_important{
    font-size: 13px !important;
    color: var(--subtitle_color) !important;
    background-color: transparent !important;
}

@media screen and (max-width: 1400px){
    :root{
        --top_info_paddings: 8px 20px;
        --header_paddings: 20px 20px;
        --section_paddings: 20px 20px;
        --footer_paddings: 40px 20px;
        --breadcrumbs_paddings: 0px 20px;
    }
    .swiper_ui_wrapper{
        padding: 0 20px;
    }
    .tech_info_block_item_value{
        font-size: 20px;
    }
    .tech_info_block_item{
        padding: 12px;
        height: initial;
    }
}

@media screen and (max-width: 1180px) {
    .two_halfs_gap40_flex_block{
        flex-direction: column;
        align-items: flex-start;
    }
    .half_flex_block_biggap{
        max-width: 100%;
        order: 2;
    }
    .half_flex_block_biggap1{
        min-height: 500px;
        max-width: 100%;
        order: 1;
    }
    .tech_info_block{
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    .tech_info_block_item{
        flex: 0 1 calc((100% - var(--gap_standard) * 2) / 3);
        width: calc((100% - var(--gap_standard) * 2) / 3);
    }
    .auto_presenter_block, .service_presenter_block{
        flex-direction: column;
    }
    .auto_presenter_block_left, .service_presenter_block_left{
        max-width: 100%;
        min-width: initial;
        order: 2;
    }
    .auto_presenter_block_right, .service_presenter_block_right{
        order: 1;
    }
    .auto_description{
        min-height: initial;
    }
    .order_car_buttons_block{
        max-width: 555px;
    }
    .two_blocks_form_container{
        flex-direction: column;
    }
    .two_blocks_form_container_right{
        max-width: 555px;
        margin: 0 auto;
    }
    .form_presenter_block_left{
        aspect-ratio: 1 / 1;
        max-width: 772px;
    }
}

/*header transformation to mobile*/
@media screen and (max-width: 1000px) {
    .main_menu_container{
        position: absolute;
        left: 0;
        right: 0;
        display: flex;
        justify-content: right;
        margin-right: 0;
        height: 40px;
        align-items: center;
    }
    .mobile_menu_switcher{
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width: 32px;
        height: 32px;
        margin-right: 20px;
        cursor: pointer;
    }
    .mobile_switcher_active{
        display: block;
    }
    .mobile_menu_switcher_inner{
        position: absolute;
        width: 100%;
        height: 1px;
        background-color: var(--white);
        transform-origin: 0 50%;
        transition: all 0.2s linear;
    }
    .mobile_menu_switcher_inner:nth-child(1){
        left: 0;
        top: 4px;
    }
    .mobile_menu_switcher_inner:nth-child(2){
        left: 0;
        top: 50%;
        transform-origin: 50% 50%;
    }
    .mobile_menu_switcher_inner:nth-child(3){
        left: 0;
        bottom: 4px;
    }
    .mobile_switcher_active div:nth-child(1){
        left: 4px;
        transform: rotate(45deg);
    }
    .mobile_switcher_active div:nth-child(2){
        left: 50%;
        width: 0;
    }
    .mobile_switcher_active div:nth-child(3){
        left: 4px;
        transform: rotate(-45deg);
    }
    .main_menu{
        display: flex;
        position: absolute;
        flex-direction: column;
        top: 0;
        left: 0;
        right: 0;
        padding: calc(40px + 24px) 20px 20px 20px;
        background-color: var(--background_header);
        border-bottom: var(--border_standard);
        gap: 0;
        z-index: -1;
    }
    a.main_menu_item{
        text-decoration: none;
        color: var(--color_footer);
        transition: color 0.1s ease;
        cursor: pointer;
    }
    a.main_menu_item:active{
        color: var(--color_footer);
    }
    a.main_menu_item:visited{
        color: var(--color_footer);
    }
    a.main_menu_item:hover{
        color: var(--color_footer);
        text-decoration: underline;
    }
    .main_menu_mobile_inactive{
        display: none;
    }
    .main_menu .main_menu_item_container{
        width: 100%;
        border-bottom: 1px solid #a0a8b1;
    }
    .main_menu_item_container:last-child{
        border-bottom: none;
    }
    .main_menu_item{
        border: none;
        border-radius: 0;
        width: 100%;
        height: 40px;
        justify-content: left;
        background-color: transparent;
        color: var(--white);
    }
    .main_menu_submenu_container{
        display: flex;
        position: relative;
    }
    .main_menu_submenu_inner {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin-top: 0;
        border: none;
        border-radius: 0;
        padding: 0;
        background-color: transparent;
        width: 100%;
    }
    .main_menu_submenu_item{
        width: 100%;
        line-height: 40px;
        padding-left: 2rem;
        color: var(--white);
    }
    a.main_menu_submenu_item, a.main_menu_submenu_item:visited, a.main_menu_submenu_item:hover, a.main_menu_submenu_item:active{
        color: var(--white);
    }
    .header_inner{
        gap: 8px;
    }
    .header_call_button{
        margin-right: 52px;
    }
}

@media screen and (max-width: 1000px) {
    .main_logo{
        width: 143px;
    }
    .top_info_block_inner{
        flex-direction: column;
        gap: 0;
    }
    .footer_upper_part, .footer_bottom_part{
        flex-direction: column;
        gap: 40px;
    }
    .list_block_left{
        order: 2;
    }
    .list_block_right{
        align-items: flex-start;
        order: 1;
    }
    .footer_blocks{
        gap: 40px;
    }
    .ta_right{
        text-align: left;
    }
    .half_flex_block_biggap1{
        min-height: 420px;
    }
    .two_halfs_flex_block{
        flex-direction: column;
    }
    .half_flex_block{
        max-width: 100%;
    }
    .flex_right_counter_block{
        justify-content: flex-start;
    }
    .catch_auto_right_part_wrapper{
        max-width: 100%;
    }
    .timer{
        max-width: 448px;
        margin: 0 auto;
        width: 100%;
    }
    .catch_auto_form_inner{
        flex-direction: column;
    }
    .auto_catalog_card{
        flex: 0 1 calc((100% - var(--gap_small)) / 2);
        width: calc((100% - var(--gap_small)) / 2);
    }
    .auto_small_card{
        flex: 0 1 calc((100% - var(--gap_small)) / 2);
        width: calc((100% - var(--gap_small)) / 2);
    }
    .service_features_item{
        flex: 0 1 100%;
        width: 100%;
        border-radius: 20px;
    }
    .service_how_to_block{
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        border-radius: 20px;
    }
    .service_how_to_block_line{
        display: none;
    }
    .form_presenter_block{
        padding: 20px;
        gap: 20px;
    }
    .form_presenter_block_right{
        padding: 20px;
        max-width: 100%;
    }
    .form_presenter_block_left{
        max-width: 100%;
    }
}

@media screen and (max-width: 850px) {
    .auto_feature_image_container{
        flex-wrap: wrap;
    }
    .auto_feature_image_item{
        flex: 0 1 calc((100% - var(--gap_small)) / 2);
        width: calc((100% - var(--gap_small)) / 2);
    }
}

@media screen and (max-width: 660px) {
    .auto_catalog_card {
        flex: 0 1 100%;
        width: 100%;
    }
    .tech_info_block_item {
        flex: 0 1 100%;
        width: 100%;
    }
    .color_picker_block {
        flex-direction: column;
        align-items: flex-start;
        background-color: var(--background_presenter);
        border: 0;
        border-radius: 0;
        border-bottom: var(--border_standard);
        padding: 20px;
        bottom: 0;
        left: 0;
        right: 0;
    }
    .auto_presenter_block_left, .service_presenter_block_left{
        padding: 20px;
    }
    .auto_feature_image_item{
        flex: 0 1 100%;
        width: 100%;
    }
    .auto_presenter_block_right{
        min-height: 360px;
    }
}

@media screen and (max-width: 600px) {
    :root {
        --banners_aspect_desktop: 500 / 470;
    }
    .text24bold{
        font-size: 20px;
    }
    .big_header{
        font-size: 42px;
    }
    .auto_card_title{
        font-size: 24px;
    }
    .timer_time{
        font-size: 40px;
    }
    .half_flex_block_biggap1 {
        min-height: 300px;
    }
    .auto_presenter_block_right{
        background-size: contain;
    }
    .color_picker_block_right{
        flex-wrap: wrap;
    }
    .auto_price{
        font-size: 42px;
    }
    .complectations_block_title_title{
        font-size: 20px;
    }
    .complectations_block_title_plus {
        font-size: 27px;
    }
    .service_features_item_title{
        font-size: 20px;
    }
    .service_features_item_text{
        font-size: 20px;
    }
    .service_how_to_block_item_text{
        font-size: 20px;
    }
    .service_form_inputs_wrapper > * {
        flex: 0 1 100%;
        width: 100%;
    }
}

@media screen and (max-width: 450px) {
    .footer_blocks{
        flex-direction: column;
    }
    .main_logo, .footer_logo{
        max-width: 130px;
        width: 100%;
    }
    .modal_div{
        padding: 2rem 20px 20px 20px;
    }
    .text24bold{
        font-size: 16px;
    }
    .big_header_subtitle, .auto_description{
        font-size: 16px;
    }
    .big_header {
        font-size: 32px;
    }
    .catch_auto_subheader{
        font-size: 16px;
    }
    .timer_time {
        font-size: 32px;
    }
    .okami_block, .okami_block_white{
        padding: 20px 0;
    }
    .radius32{
        border-radius: 20px;
    }
    .catch_auto_block{
        padding: 20px;
    }
    .auto_card_content{
        padding: 20px;
    }
    .auto_price{
        font-size: 32px;
    }
    .tech_info_block_item_img_wrapper, .service_features_item_img_wrapper{
        width: 42px;
        height: 42px;
    }
    .tech_info_block_item_img{
        width: 24px;
    }
    .service_features_item_text{
        font-size: 16px;
    }
    .service_how_to_block_item_number{
        font-size: 20px;
    }
    .service_how_to_block_item_text{
        font-size: 16px;
    }
    .auto_presenter_block_right{
        min-height: 320px;
    }
    .auto_small_card{
        flex: 0 1 100%;
        width: 100%;
    }
}

@media screen and (max-width: 400px) {
    :root {
        --header_paddings: 20px 8px;
        --section_paddings: 20px 8px;
        --footer_paddings: 40px 8px;
        --breadcrumbs_paddings: 0px 8px;
    }
    .main_menu{
        padding: calc(40px + 24px) 8px 8px 8px;
        border-bottom: var(--border_standard);
    }
    .mobile_menu_switcher{
        margin-right: 8px;
    }
    .swiper_ui_wrapper{
        padding: 0 8px;
    }
    .contacts_block{
        padding: 20px;
    }
}

/* ===== начало стилей текстов акций из базы данных =====
   Классы article_* дописывает редактор админки (CKEditor) при сохранении акции,
   здесь оформляется этот html на сайте - views/pages/promo.blade.php (контент и сноска).
   Без этих правил span/b/i/u из текста акции выглядели бы как обычный текст. */

.article_h1{
    font-size: 32px;
    font-weight: 500;
}

.article_h2{
    font-size: 24px;
    font-weight: 500;
}

.article_pre{
    position: relative;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
}

.article_p{
    position: relative;
    display: block;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    margin-bottom: 0.7rem;
}

.article_link{
    color: var(--red) !important;
    text-decoration: underline;
    font-weight: 500;
    cursor: pointer;
}

.article_image{
    display: block;
    max-width: 100%;
    width: auto;
    margin: 1rem auto;
    height: auto !important;
}

.article_bold{
    font-weight: 600;
    font-size: inherit;
    font-style: inherit;
}

.article_italic{
    font-style: italic;
    font-size: inherit;
    font-weight: inherit;
}

.article_underline{
    text-decoration: underline;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
}

.article_ol{
    font-size: inherit;
    font-weight: inherit;
    margin-bottom: 0.7rem;
}

.article_ul{
    font-size: inherit;
    font-weight: inherit;
    margin-bottom: 0.7rem;
}

.article_li{
    font-size: inherit;
    font-weight: inherit;
}

.article_sup{
    font-size: smaller;
    font-weight: inherit;
    font-style: inherit;
}

/* ===== конец стилей текстов акций из базы данных ===== */