﻿/*   
Theme Name: burum
Author: Dmitrij Nikolaenko
Authot Email: dmitrij.nikolaenko.91@gmail.com
*/

html, body{width: 100%;min-height: 100%;}
body{
font-family: "Montserrat", sans-serif; word-break: break-word;
background: rgba(37, 41, 43, 1);    line-height: 140%;}

@font-face {
  font-family: "Square721";
  src: url("/wp-content/themes/burum/fonts/SQR721B.otf") format("opentype");
    font-style: normal;
  font-display: swap;
}

/***position foter***/
* {margin: 0;padding: 0;}
html, body {height: 100%;}
#content-sites {display: flex;flex-direction: column;height: 100%;}
#content {flex: 1 0 auto;}
#footer {flex: 0 0 auto;}
/*** end position foter***/
:root {
  --red1: #CC0605;
  --red2: #D94444;
  --red3: #960908;
  --black1: #353C42;
  --black2: #25292B;
  --black3: #1E2021;
  --white: #fff;
  --grey1: #515355;
  --grey2: #ADAFB0;
  --grey3: #898C8F;
  --green: #00C51A;
}

a, input, img, textarea{outline: none;}
a{transition: 0.3s;}
a:hover{transition: 0.3s;}
h1{font-size: 32px;padding-bottom: 24px;padding-top: 16px;}
h2{font-size: 26px;padding-bottom: 22px;padding-top: 16px;}
h3{font-size: 24px;padding-bottom: 20px;padding-top: 16px;}
h4{font-size: 20px;padding-bottom: 18px;padding-top: 16px;}
h5{font-size: 16px;padding-bottom: 16px;padding-top: 16px;}
h1, h2, h3, h4, h5{text-transform: uppercase;font-family: "Square721";line-height:140%;}
p{ font-size: 16px;padding-bottom: 24px;font-weight: 400;line-height:140%;font-weight:500;}
li{font-size: 16px;padding-bottom: 12px;font-weight: 400;line-height:140%;font-weight:500;}
ul, ol{padding-bottom: 12px;}
#go-top {position: fixed;width: 40px;height: 40px;line-height: 50px;bottom: 20px;right: 20px;z-index: 99;text-align: center;color: #fff !important;background: rgba(0, 0, 0, 0.28) url('/wp-content/themes/burum/img/to-top.png');background-position: center center;background-repeat: no-repeat;cursor: pointer;transition: 0.4s;background-size: 40%;}
#go-top:hover {background: rgba(0, 0, 0, 0.54) url('/wp-content/themes/burum/img/to-top.png');background-position: center center;background-repeat: no-repeat;transition: 0.4s;background-size: 40%;}
/***defaul for breadcrumbs**/
.breadcrumbs-page{color: rgba(255, 255, 255, 0.6) !important;}
.breadcrumbs-page a{text-decoration: none !important;color: rgba(255, 255, 255, 0.6) !important;text-shadow: none;}
.breadcrumbs-page a:hover{text-decoration: underline !important;}
/**defaul for galery wordpress**/
.gallery {float: none;display: inline-block;width: 100%;padding-bottom: 24px;}
.gallery img{    width: calc(100% - 6px);
    height: auto;
    border: none !important;
    margin-bottom: 0px;
    transition: 0.3s;
    border-radius: 8px;}
.gallery img:hover{-webkit-filter: sepia(100%);transition: 0.3s;}
.gallery-item{margin-top: 0px;}
/**defaul for img***/
img.alignleft{max-width: 50%;height: auto;margin-right: 25px;margin-bottom: 25px;margin-top: 25px;float: left;}
img.aligncenter{max-width: 100%;height: auto;margin-bottom: 25px;margin-top: 25px;float: none;}
img.alignright{max-width: 50%;height: auto;margin-left: 25px;margin-bottom: 25px;margin-top: 25px;float: right;}
.active-img {position: fixed !important;z-index: 999 !important;overflow: unset !important;top: 50% !important;left: 50% !important;transform: translate(-50%, -50%) !important;max-width: 80% !important;box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.38) !important;}
.close-img{position: fixed;z-index: 999;width: 30px;height: 30px;top: 8px;right: 8px;background: url('/wp-content/themes/burum/img/close-img.png');background-size: contain;cursor: pointer;display: none;}
/**end default**/
/* Класс для блокировки прокрутки */
.no-scroll {
  overflow: hidden;
}
/****footer***/
footer {background: rgba(53, 60, 66, 1);padding: 45px 0px 0px 0px;color: #fff;display: inline-block;width: 100%;z-index: 2;bottom: 0px;}
.footer-box{display: flex;flex-direction: row;flex-wrap: wrap; align-items: flex-start;justify-content: space-between;	}
.box-content-footer{ width: 50%; padding: 15px 0px; box-sizing: border-box;	}
.box-content-footer a{
	text-decoration: none; color: #fff;
}
.box-content-footer ul{
	list-style-type: none; margin: 0px;
}
.box-content-footer ul > li{font-size: 14px; font-weight: 500;padding-bottom: 10px;}
.box-content-footer a:hover{color:rgba(217, 68, 68, 1);}
.date-site{    text-align: center;
    padding: 24px 0px;
    border-top: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;}
.list_socials_footer{
	display: flex; justify-content: space-between; align-items: center; width: 225px; 
}
.list_socials_footer a:hover{
	opacity: 0.2; transition: 0.3s;
}	
.logo_footer{width: 320px; margin-bottom: 25px;}
a.post_social{}
.text_after_footer_logo{max-width: 320px; font-size: 14px; font-weight: 500;padding-bottom: 20px;}
.row_contact{
	display: flex; align-items: center; justify-content: flex-start;
}
.row_contact span{   
	font-size: 14px;
    font-weight: 500;
}
.row_contact img{
	width: 20px; margin-right: 12px;
}
.footer_menu_contacts{
	display: flex; justify-content: space-between; align-items: flex-start;
}
.box-footer-menu{
	width: calc(50% - 20px);
}
.title_column_footer{
font-size: 10px;
    font-family: "Square721";
    padding-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 6px;
}
.post_contact_block{
	padding-bottom: 16px;
}
.title_post_contact_block{
	font-size: 12px; font-weight: 500; color: rgb(255 255 255 / 60%); padding-bottom: 12px;
}
/*** end footer style***/
/***header style***/
.header{
    width: 100%;
    background:rgba(30, 32, 33, 1);
	margin:0px;
	padding:0px;
	box-sizing:border-box;
}
.box-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 18px;
    padding-top: 18px;	
}
.menu-top-site{
	width: calc(100% - 340px);
}
.menu-top-site > ul{
display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.menu-top-site ul{
    list-style-type: none;
    margin: 0px;		
	padding:0px;
}
.menu-top-site li{padding:0px 5px;}
.menu-top-site a{
    text-decoration: none;
    font-size: 14px;
    color: #fff;
    padding: 10px 10px;
    display: block;
    font-weight: 500;
    font-family: "Square721";
}
.menu-top-site a:hover{color:rgba(217, 68, 68, 1);}
.logo-header img{
	    height: auto;
    width: 271px;
}
	
/*** end header style***/


/* 1) Родитель с подменю — якорь для absolute */
.main-menu li.menu-item-has-children{
  position: relative;
}

/* 2) Поднимаем слой при наведении, чтобы submenu было поверх */
.main-menu li.menu-item-has-children:hover,
.main-menu li.menu-item-has-children:focus-within{
  z-index: 9999;
}

/* 3) Делаем "шапку" (родительский пункт) как часть общего блока */
.main-menu li.menu-item-has-children > a{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  border-radius: 14px;                 /* базово */
}

/* Когда открыт dropdown — превращаем в верхнюю часть общего блока */
.main-menu li a{border: 1px solid transparent;}
.main-menu li.menu-item-has-children:hover > a,
.main-menu li.menu-item-has-children:focus-within > a{
	position: relative; z-index: 3;
}
.main-menu li.menu-item-has-children:hover > ul.sub-menu:after,
.main-menu li.menu-item-has-children:focus-within > ul.sub-menu:after{
	content:'';
	position: absolute; top: -40px; right:0px; left: 0px; bottom: 0px; background: rgba(30, 32, 33, 1);
  border: 1px solid rgba(81, 83, 85, 1); border-radius: 14px;
	z-index: -1;
}

/* 4) Стилизация dropdown */
.main-menu li.menu-item-has-children > ul.sub-menu{
  position: absolute;
  top: 44px;
  left: -33px;
  width: 219px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  box-sizing: border-box;
  pointer-events: none;
  transition: .18s ease;
}
.main-menu li.menu-item-has-children > ul.sub-menu:after{
	content:'';
}
/* 5) Показ по hover/focus */
.main-menu li.menu-item-has-children:hover > ul.sub-menu,
.main-menu li.menu-item-has-children:focus-within > ul.sub-menu{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.main-menu li.menu-item-has-children > a{position: relative;}
.main-menu li.menu-item-has-children > a:before{
	content:''; position: absolute; width: 14px; height:14px; background: url(/wp-content/uploads/2026/02/arrow-down.svg); right: -3px;
	background-position: center; background-size: contain; background-repeat: no-repeat;
}
/* 6) Пункты внутри dropdown */
.main-menu ul.sub-menu li a{
  text-decoration: none;
}
.sub-menu li a{position: relative; padding: 4px 0px 4px 24px;}
.sub-menu li a:before{
    position: absolute;
    content: '';
    left: 0px;
    top: 8px;
    width: 12px;
    height: 12px;
    border: 1px solid rgba(81, 83, 85, 1);
    border-radius: 50%;
}
.main-menu ul.sub-menu li a:hover{color: rgba(217, 68, 68, 1);}
.main-menu ul.sub-menu li a:hover:before{border: 1px solid rgba(217, 68, 68, 1);}
/* 7) Если нужно, чтобы submenu перекрывало "соседей" по высоте/ширине */
.main-menu{ position: relative;}
ul.sub-menu li > a{font-size: 12px;font-family: "Montserrat", sans-serif;}
ul.sub-menu li{padding: 0px;}
ul.sub-menu{padding: 0px 12px 12px 12px;}

	.arrow-bottom, .arrow-top{
		position: relative;
	}
	.arrow-bottom:before, .arrow-top:before{
		content: '';
        position: absolute;
        width: 14px;
        height: 14px;
        background: url(/wp-content/uploads/2026/02/arrow-down.svg);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        left: -23px; transform: rotate(0deg);
        top: 6px; transition: 0.3s;
	}
.arrow-top:before{transform: rotate(-180deg);transition: 0.3s;}
.footer-menu .arrow-bottom:before, .footer-menu .arrow-top:before{top: 2px;}
.footer-menu .sub-menu li a:before{width: 9px; height: 9px; top: 6px;}
.footer-menu ul.sub-menu{padding: 0px 12px 12px 0px;}
.footer-menu .sub-menu a:hover:before{border: 1px solid rgba(217, 68, 68, 1);}

/*** end ul & ol down style ****/
/*******/
/****mobile***/
.mobile-menu{display:none;}
.mobile-buttons{
	display: none;
	position:relative;
	width: 50px;
    height: 50px;
}
/****end mobile style***/
/***other styles****/
.button-pages{
    font-size: 12px;
    background: var(--red1);
    padding: 25px 32px;
    color: #fff;
    cursor: pointer;
    text-transform: uppercase;
    font-family: "Square721";
    border-radius: 8px;
    display: inline-block;
    text-decoration: none;
    line-height: 140%;
}
.btn_border_white{
    font-size: 12px;
    background: transparent;
    padding: 25px 32px;
    color: #fff;
    cursor: pointer;
	border: 1px solid #fff;
    text-transform: uppercase;
    font-family: "Square721";
    border-radius: 8px;
    display: inline-block;
    text-decoration: none;
    line-height: 140%;
}
.button-pages:hover{ background: var(--red2); transition:0.3s;}
.button-pages:active{ background: rgba(150, 9, 8, 1); }
.box-before-header{width:100%;}
.button-top-modal{display:none;}
/***end other styles****/
span.wpcf7-not-valid-tip, .ajax-loader, .wpcf7 br{ display: none!important;}
input.wpcf7-not-valid {
    border: 1px solid red !important;
}
.wpcf7 form.invalid .wpcf7-response-output {
    border-color: #ff0000 !important;
    color: #ff0000;
    font-size: 16px;
    font-weight: 600;
    padding: 12px;
    text-align: center;
    background: #fff;
}
.box-monitor1{
padding-top: 100px;
    padding-bottom: 100px;
    display: flex;     box-sizing: border-box;
    flex-direction: column;
    align-items: center;
    position: relative;
    justify-content: center;
    min-height: 760px;	
}
.container-box-monitor1{
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    justify-content: center;
}
.list_socials_mon1{
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    position: absolute;
    left: 35px;
    width: auto;
}
.list_socials_mon1 a.post_social{
	margin-bottom: 16px;
}
.title_mon1{
	text-align: center; 
	text-transform: uppercase;
	font-size: 40px; 
	padding-bottom: 40px;     
	line-height: 140%;
}
.title_mon1 span{
	color: var(--red1); 
}
.row_list_mon1{display: flex; align-items: center; justify-content: flex-start;    padding-bottom: 20px;}
.row_list_mon1 img{margin-right: 16px;}
.row_list_mon1 span{font-size: 20px; font-weight: 500; font-family: "Square721";}
.list_option_monitor1{padding-bottom: 30px;}
.box_our_services, .box-padding{
    padding: 80px 0px;
    display: inline-block;
    width: 100%;
}
.box_our_services h3{text-align: center; font-size: 32px; text-transform: uppercase;}
.container_our_services{
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr;	
}
.post_our_service{
    box-sizing: border-box;
    border: 1px solid rgba(53, 60, 66, 1);
    display: flex;
    align-items: flex-start;
    padding: 22px;     justify-content: space-between;
    border-radius: 8px;
}
.post_our_service img{width:48px;}
.post_our_service section{width: calc(100% - 72px);}
.post_our_service section > p{color: rgb(255 255 255 / 80%);}
.post_our_service h4{font-size: 24px; text-transform: uppercase;}
.box-for_catalog_power{text-align: center; background-image: url(/wp-content/uploads/2026/01/font-scaled.webp);
    background-position: center;
    background-size: cover; position: relative;
    background-repeat: no-repeat;
}
.box-for_catalog_power:before{
	position: absolute;
	    background: linear-gradient(270deg, rgb(0 0 0 / 67%), rgba(30, 32, 33, 1));
	content: '';
	top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1;
}	
.container_for_catalog_power{position: relative; z-index: 3;}
.min-whidth-btn{    display: block;
    max-width: 230px;
    margin: auto;}
.title_block, .container_for_catalog_power h3{
	    text-align: center;
    font-size: 32px;
    text-transform: uppercase;
}
.title_block_adwantages{	    text-align: center;

    text-transform: uppercase;}
.container_why_choose_us{
    display: block;	
}
.post_why_choose_us{ transition:0.3s;
    box-sizing: border-box;
    display: flex;  flex-wrap: wrap;
    align-items: flex-start; position: relative;
    padding: 24px 24px 12px 24px;     justify-content: space-between;
    border-radius: 8px;	 margin-bottom: 20px; background: rgba(49, 54, 57, 1);
}
.post_why_choose_us h3{ font-size: 32px; letter-spacing:1px;
    text-transform: uppercase;    padding-bottom: 14px;}
.post_why_choose_us h4{ font-size: 13px; letter-spacing:1px;
    text-transform: uppercase;    padding-bottom: 14px;}
.post_why_choose_us:nth-child(1){
	    width: calc(66.66% - 20px);
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}
.post_why_choose_us:nth-child(1) img{
	    width: 220px;
    position: absolute;
    bottom: 0px;
    right: 0px;
}
.post_why_choose_us:nth-child(1) h3{color: rgba(204, 6, 5, 1);transition:0.3s;}
.post_why_choose_us:nth-child(1) section{
    width: calc(100% - 240px);
    padding-bottom: 50px;	 
}
.post_why_choose_us:nth-child(2){
    width: calc(33.33% - 0px);
    float: right;
    height: 100%;
    display: block;
    min-height: 571px;
}
.post_why_choose_us:nth-child(2) section{width:100%; padding-bottom: 20px;}
.post_why_choose_us:nth-child(2) img{    
	width: calc(100% - 40px);
    position: absolute;
    bottom: 0px;
    right: 20px;
    left: 20px;}
.post_why_choose_us:hover{background: rgba(204, 6, 5, 1); transition:0.3s;}
.post_why_choose_us:nth-child(3){
    width: calc(33.33% - 20px);
    float: left;
    color: #fff;
    margin-right: 20px;     min-height: 245px;
}
.post_why_choose_us:nth-child(3) h3{
	    width: calc(100% - 60px); padding-top: 20px;
}
.post_why_choose_us:nth-child(3) img{
    position: absolute;
    top: 16px;
    right: 16px;
    width: 64px;
    height: 64px;
    object-fit: contain;
    object-position: center;
}
.post_why_choose_us:nth-child(4){
    width: calc(33.33% - 20px);
    float: left;
    margin-right: 20px;     min-height: 274px;
}
.post_why_choose_us:nth-child(4) h3{
	    width: calc(100% - 60px); padding-top: 20px;
}
.post_why_choose_us:nth-child(4) img{
    position: absolute;
    top: 16px;
    right: 16px;
    width: 64px;
    height: 64px;
    object-fit: contain;
    object-position: center;
}
.post_why_choose_us:hover h3{color: #fff !important; transition:0.3s;}
.container_posts_portfolio{
	display: flex; justify-content: space-around; align-items: stretch;
	flex-wrap: wrap;
}
.post_portfolio{
	    width: calc(33.333% - 3px);
    margin-bottom: 5px;
    border-radius: 8px;
    aspect-ratio: 10 / 7;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    text-align: center;
}
.post_portfolio section{
    background: rgba(37, 41, 43, 0.85);
    padding: 12px;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    text-align: center;
    box-sizing: border-box;
}
.post_portfolio h4{
    font-size: 10px;
    text-align: center;
    width: 100%;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.before_upstage, .after_upstage{ width: calc(50% - 5px); font-size: 12px;}
.box-portfolio-index{background: rgba(53, 60, 66, 1);}
.container_list_contacts{
    border-top: 1px solid rgba(81, 83, 85, 1);
    border-bottom: 1px solid rgba(81, 83, 85, 1);
    padding-bottom: 12px;
    padding-top: 12px;
    margin-bottom: 32px;
}
.post_contact_block{
	padding-bottom: 12px; padding-top: 12px;
}
.title_post_contact_block{
	text-transform: uppercase; font-family: "Square721";
	letter-spacing: 3px; font-size: 10px; font-weight: 400;
}
.title_post_contact_block_footer{
	text-transform: uppercase; color: rgba(255, 255, 255, 0.6);
	letter-spacing: 3px; font-size: 12px; font-weight: 400;	display: block; padding-bottom: 12px;
}
.link_post_contact_block{
	color: #fff; font-size: 14px; font-weight: 600; text-decoration: none;
}
.left_contacts{width: calc(30% - 10px);}
.right_contacts{width: calc(70% - 10px); position: relative;}
.right_contacts iframe{width:100%; aspect-ratio: 10 / 7.6; border-radius: 8px;}
.box-container-contact{
	display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;
}
.box-contacts-pages{
	position: relative;
	    z-index: 3;
	background: url(/wp-content/uploads/2026/01/fon_map.webp);
	background-position: center; background-repeat: no-repeat; background-size: cover;
}
.box-contacts-pages:before{
	position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background: rgb(22 24 24 / 94%); z-index: -1; content: '';
}
.box-container-contact{position: relative; z-index: 2;}
.page_form_border{ max-width: 984px;
	border: 1px solid rgba(53, 60, 66, 1);
	padding: 32px; box-sizing: border-box;
	background: rgba(37, 41, 43, 1); border-radius:8px;	
}
.box-container-contact-pages{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;	
}
.map_btn_block_contact{ float: right;}
.map_btn_block_contact:hover{opacity: 0.2;}
.block_btn_load_more{margin-top: 48px;}
.adwantages_services_pages{padding-bottom: 50px;}
.container_text_about_us img.alignright, .container_text_about_us img.alignleft{
	max-width: 30%; border-radius: 8px;
}
.container_our_services_vertical{    padding-top: 20px;
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
    flex-wrap: wrap;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    align-items: stretch;
}
.container_our_services_vertical_red_1_6{
	grid-template-columns: repeat(3, 1fr);
}
.post_our_service_vertical{
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    display: flex;
    flex-direction: column;
    height: 100%;	
}
.icon_post_our_service_vertical{ transition:0.3s;
    background: rgba(49, 54, 57, 1);
    border-radius: 8px;
    padding: 24px 20px;
    box-sizing: border-box;
    width: calc(100% - 60px);
    text-align: center;
    margin-bottom: 23px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
	    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; /* центрирует контент */
    flex: 1; /* ← магия */
    text-align: center;
}
.icon_post_our_service_vertical img{max-width: 100%;}
.icon_post_our_service_vertical span{
	font-size: 14px; text-align: center; display: block; padding-top: 8px; text-transform: uppercase;
    font-family: "Square721";
}
.post_our_service_vertical:hover > .icon_post_our_service_vertical{
	background: rgba(204, 6, 5, 1); transition:0.3s;
}
.container_our_services_vertical_red_1_6 section{width: calc(100% - 60px);}
.post_our_service_vertical p{color: rgba(255, 255, 255, 0.8);}
.text_list_micro_chips ul{
	list-style-type: none; margin: 0px;
}
.text_list_micro_chips li{
    position: relative;
    padding-left: 26px;
}
.text_list_micro_chips li:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 1px;
	background: url(/wp-content/uploads/2026/02/cpu.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
	width: 20px; height: 20px;
}
.list_adwantages li{
    position: relative;
    padding-left: 26px;
}
.list_adwantages li:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 1px;
	background: url(/wp-content/uploads/2026/02/verify.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
	width: 20px; height: 20px;
}
.list_offers li{
    position: relative;
    padding-left: 26px;
}
.list_offers li:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 1px;
	background: url(/wp-content/uploads/2026/02/triangle.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
	width: 20px; height: 20px;
}
.list_points_offer li{
    position: relative;
    padding-left: 26px;
}
.list_points_offer li:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 1px;
	background: url(/wp-content/uploads/2026/02/add-square.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
	width: 20px; height: 20px;
}
.youtube-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;     padding-bottom: 24px;
}

.youtube-grid iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}
.container_mon1_stage{max-width: 1000px;}
.container_other_info{
	padding-top: 75px; padding-bottom: 75px;
}
.container_other_info table{
	    text-transform: uppercase;
    font-family: "Square721";
	background: rgba(53, 60, 66, 1);
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border-radius: 10px;
  overflow: hidden;
}
.container_other_info td, .container_other_info th{
	padding: 24px 32px; font-size:20px;
}
/* Таблица без внешних рамок */
.container_other_info table{
  border-collapse: separate;
  border-spacing: 0;
  border: none;
}

/* Базовые стили ячеек */
.container_other_info th,
.container_other_info td{
  border: none;
  background: #333b40;
}

/* ───── Вертикальные разделители (ТОЛЬКО между колонками) ───── */
.container_other_info th + th,
.container_other_info td + td{
  border-left: 1px solid rgba(255,255,255,.18);
}

/* ───── Горизонтальные разделители (ТОЛЬКО между строками) ───── */
.container_other_info tr + tr td,
.container_other_info tr + tr th{
  border-top: 1px solid rgba(255,255,255,.18);
}
.box_slider{
	padding-top: 40px;
	padding-bottom: 80px;
	background: #3a4147;
}
/***slider***/

/*********************/
/* контейнер на всю ширину родителя */
.coverflow {
  width: 100%;
  overflow: hidden;          /* сам блок не вылезает */
  padding: 30px 0 80px 0px;           /* чтобы тени не резались */
}

/* сам swiper должен показывать выступающие слайды */
.coverflow .swiper{
  width: 100%;
  overflow: visible;
}

.coverflow .swiper-wrapper{
  align-items: center;
}

/* ВАЖНО: ширина слайда задаётся тут */
.coverflow .swiper-slide{
  width: clamp(340px, 58vw, 640px); /* подстройка размера карточки */
  aspect-ratio: 10 / 8;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}

.coverflow .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}



/* активный чуть “поп” */
.coverflow .swiper-slide-active{

}
.coverflow .swiper-3d {
    perspective: 239px !important;
}


.coverflow-viewport{
  /* сколько показывать “крыло” с каждой стороны (настройка) */
  --wing: clamp(200px, 18vw, 420px);

  position: relative;
  overflow: hidden;

  /* вот это главное: даём окну “расширение” по бокам,
     чтобы 2 слайда помещались, но 3-й всё равно резался */
  padding-left: var(--wing);
  padding-right: var(--wing);

  /* компенсация, чтобы контент не сдвигался из-за padding */
  margin-left: calc(var(--wing) * -1);
  margin-right: calc(var(--wing) * -1);
}


.swiper-button-next:after, .swiper-button-prev:after{content: '';}
.swiper-button-next{    right: calc(50% - 430px);}
.swiper-button-prev{ left: calc(50% - 430px);}
.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: -74px !important;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
    width: 20px;
    height: 20px;
    border-radius: 3px;
    border: 1px solid #fff;	transition:0.3s;
}
.swiper-pagination-bullet-active, .swiper-pagination-bullet:hover{
	transition:0.3s; background: #fff;
}
/***slider***/
.box-before-header{display: none;}
.title_cat img{margin-bottom: -2px; margin-left: 5px;}
.title_cat{text-transform: none;}
ul.cat-parrent-catalog{
	display: grid;
    gap: 20px;     padding-top: 20px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	list-style-type:none; margin: 0px;
}
ul.cat-parrent-catalog li{text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;}
ul.cat-parrent-catalog li > a{text-decoration: none;}
ul.cat-parrent-catalog li > a:hover{text-decoration: none; opacity: 0.4;}
ul.cat-parrent-catalog li > a > img{
	width: 80px; height:80px; object-fit: contain; object-position: center;
}
.container_lists_model_years{
	display: grid;
    gap: 20px;     padding-top: 20px;
    grid-template-columns: 1fr 1fr 1fr;
	list-style-type:none; margin: 0px;	
}
.list_catalog_cat{
	background: rgba(49, 54, 57, 1); border-radius: 8px; margin-bottom:17px;
}
.header_list_catalog_cat{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid rgba(37, 41, 43, 1);
    padding: 16px 20px 16px 12px;
    box-sizing: border-box;
}
.header_list_catalog_cat_generations{
	padding: 16px 20px 16px 32px;
}
.link_img_returne{
    display: flex;	
}
.content_info{padding: 20px;}
.garanti_info{width:340px;}
.content_info p, .content_info li{font-size:14px;}
.header_list_catalog_cat > span{width: calc(100% - 60px); font-size:18px; font-weight:600; color: #fff;padding-left:10px;padding-right: 8px; box-sizing: border-box;}
.logo_header_list{
	width:40px; height:40px; object-fit:contain; object-position: center;
}
.list_child_cat_models{ padding: 25px 40px 20px 40px;
	list-style-type: none; margin: 0px;
}
.post_child_cat_models a{text-decoration: none; color: #fff9;display: flex; justify-content: space-between; align-items: center;}
.post_child_cat_models a:hover{color: #fff;}
ul.cat-posts-list{
	list-style-type:none; margin:0px; padding-top: 14px;
}
.block_tabs_bnts{
	width: 180px; background: rgba(49, 54, 57, 1); box-sizing: border-box;
    border-radius: 8px; padding: 20px 20px 10px 20px; margin-bottom:17px;
}
.table_results{
	background: rgba(49, 54, 57, 1);
    box-sizing: border-box;
    border-radius: 8px;
    margin-bottom: 17px;
    width: calc(100% - 357px);
}
.container_post_catalog, .tab_content_single_catalog{display: flex; align-items: flex-start; justify-content: space-between; flex-wrap:wrap;}
.block_tabs_content{width: calc(100% - 197px);}
ul.list_tabs_bnts{list-style-type:none;margin:0px;padding-bottom: 0px;}
.list_tabs_bnts li{position: relative; font-size:18px; color:#fff9;     padding-left: 32px;cursor:pointer; transition:0.3s;}
.list_tabs_bnts li:hover, .active_tab_btn{color:#fff !important; transition:0.3s;}
.list_tabs_bnts li:before{
    content: '';
    position: absolute;
    left: 0px;
    width: 20px;
    height: 20px; transition:0.3s;
    border: 1px solid; background:transparent;
    border-radius: 50%;
}
.list_tabs_bnts li:hover:before, .active_tab_btn:before{background:#fff !important;}
.list_tabs_bnts li:after{
    content: '';
    position: absolute;
    left: 8px;
    width: 4px; background:rgba(49, 54, 57, 1);
    height: 4px;
    border: 1px solid;
    border-radius: 50%;
    top: 8px;
}
.content_info_list ul{
	list-style-type:none; margin:0px;
}
.content_info_list li{position:relative; padding-left: 28px;}
.content_info_list li:before{
    content: '';
    position: absolute;
    left: 0px;
    width: 16px; background:url(/wp-content/uploads/2026/02/tag-right.svg);
    height: 16px; background-position: center; background-repeat: no-repeat; background-size:contain;
}
/***table table_results****/
/* === TABLE LIKE SCREENSHOT === */
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:#2f3438;                 /* общий фон блока */
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* сетка */
table th,
table td{
  border:1px solid rgba(0,0,0,.35);
  padding:16px 18px;
}

/* убрать двойные рамки по краям */
table thead tr th:first-child,
table tbody tr td:first-child,
table tfoot tr td:first-child{border-left:0;}
table thead tr th:last-child,
table tbody tr td:last-child,
table tfoot tr td:last-child{border-right:0;}
table thead tr th{border-top:0;}
table tfoot tr td{border-bottom:0;}

/* THEAD */
table thead th{
  background:#252a2e;
  color:#e9eef2;
  font-size:16px;
  text-align:center;
  letter-spacing:.2px;
}
table thead th:first-child{
  text-align:left;
}
table thead th a.more_popup{
  color:#ff3b3b;                       /* красный "Детальніше" */
  text-decoration:none;
}
table thead th a.more_popup:hover{
  text-decoration:underline;
}
/* TBODY */
table tbody td{
	background:#2f3438;
	color:#aeb6bd;                        /* серые значения "Оригінал" */
	font-size:16px;
	text-align:center;
}
table tbody td:first-child{
	text-align:left;
	color:#ffffff;                         /* названия строк белые */
}
/* "Після тюнингу" (3-я колонка) — белым и жирным */
table tbody td.red:nth-child(3){
	color:#ffffff;
}
/* "Приріст" (4-я колонка) — зелёным */
table tbody td.red:nth-child(4){
	color:#27d34d;
}
/* TFOOT (цена) */
table tfoot td{
	background:#2f3438;
	padding:20px 18px;
}
table tfoot .price{
	display:inline-block;
	color:#ffffff;
	font-size: 18px;     
	font-family: "Square721";
}
table tfoot .total{
	display:inline-block;
	width:100%;     
	font-family: "Square721";
	text-align:center;
	color:#ffffff;
	font-size: 18px;
	letter-spacing: 0.5px;
}

.price-hide-desctop{display: none;}

/***end table table_results****/
.btn_send_rewiev{cursor:pointer;}
.btn_send_rewiev .header_list_catalog_cat{border-bottom: 0px solid rgba(37, 41, 43, 1);}
.modal_info{max-height: 90vh;overflow: auto;}
.options-text{padding: 20px; box-sizing: border-box;}
.table-statistic tfoot td:has(span.total){
	padding: 20px 8px;vertical-align: middle;
}

/* optional: если используешь hidden-xs как в примере */
@media (max-width:767px){
  table th, table td{padding:8px 4px; font-size:14px;}
  table tbody td:first-child{font-size:14px;}
  table tfoot .price{font-size:14px;}
  table tfoot .total{font-size:14px;}
  table tfoot td{padding: 6px 5px;}
  table thead th{font-size:14px;}
}

@media(max-width:960px){
	.logo-header img {
		height: auto;
		width: 150px;
	}
	.content_info {
		padding: 15px;
	}
	.logo_header_list{ width: 30px; height: 30px;}
	.header_list_catalog_cat > span{width: calc(100% - 40px); font-size: 15px;}
	.container_lists_model_years{grid-template-columns: 1fr;}
	.block_tabs_bnts, .block_tabs_content, .table_results, .garanti_info{width:100%;}
	.icon_post_our_service_vertical{margin-bottom:4px;}
	.box-before-header{display: block; height: 73px;}
	.modal-form-pages-big{
		    padding: 20px 20px;     width: 88%;
	}
	.page_form{padding-bottom: 20px;}
	.box-monitor1{    padding-top: 60px;
    padding-bottom: 50px;min-height: auto;}
	.list_socials_mon1{left: 3px;}
	.list_socials_mon1 img{width:20px;}
	.list_socials_mon1 a.post_social { margin-bottom: 12px;}
	.row_list_mon1{padding-bottom: 12px;}
	.row_list_mon1 span{font-size: 16px;}
	.row_list_mon1 img { margin-right: 8px; width: 15px;}
	.title_mon1{font-size: 26px; padding-bottom: 30px;}
	.box_our_services h3{font-size: 22px;}
	.post_our_service section { width: calc(100% - 50px);}
	.box_our_services, .box-padding{padding: 60px 0px;}
	.title_block, .container_for_catalog_power h3{font-size: 24px;}
	.post_why_choose_us:nth-child(1), .post_why_choose_us:nth-child(2), .post_why_choose_us:nth-child(3), .post_why_choose_us:nth-child(4){ width: 100%;}
	.post_why_choose_us:nth-child(1) section {
		width: 100%;
		padding-bottom: 10px;
	}
	.post_why_choose_us:nth-child(2) img{position: relative;}
	.post_why_choose_us:nth-child(1) img{width: 100%; position: relative;}
	.post_why_choose_us h3{font-size:24px;}
	.post_portfolio section{padding: 6px;}
	.post_portfolio, .left_contacts, .box-footer-menu{width:100%;}
	.map_btn_block_contact{display:none;}
	.page_form form > p{width: 100%;    max-width: 100%;}
	.block_btn_load_more { margin-top: 32px;}
	.btn_border_white{padding: 20px 24px;     font-size: 10px;}
	.button-pages{padding: 20px 24px; font-size: 10px;}
	input.wpcf7-submit{font-size: 10px; padding: 20px 16px;}
	.modal-form input, .page_form input, .modal-form-pages-big input{padding: 20px 20px;}
	.post_our_service h4{    font-size: 18px;}
	h1{font-size:22px;}
	h2{font-size:21px;}
	h3{font-size:20px;}
	h4{font-size:19px;}
	h5{font-size:18px;}
	p{font-size:14px;}
	.logo_footer {
		max-width: 260px;
		margin-bottom: 25px;
		width: 80%;
	}
	.footer_menu_contacts{flex-wrap: wrap;}
	.text_after_footer_logo{        
		width: 100%;
        text-align: left;
	}
	.post_our_service h4 {
        font-size: 18px;
        padding-top: 7px;
        padding-bottom: 12px;
    }
	.container_other_info td, .container_other_info th {
		padding: 16px 12px;
		font-size: 10px;
	}
	.page_form_border{padding:20px;}
	.right_contacts{width:100%;}
	.container_our_services{grid-template-columns: 1fr;}
	.post_our_service{padding: 18px;}
	.post_our_service img{width: 36px;}
	ul.children-ul {
		position: relative !important;
		top: 0px;
		background: transparent;
		padding: 3px 2px 4px 0px !important;
		left: 0px;
		z-index: 6;
		border: 0px solid rgba(81, 83, 85, 1);
		border-radius: 0px;
		width: auto;
		transform: translate(0px, 0px);
	}
	.mobile-menu ul{width:100%;}
	.mobile-menu > ul > li{padding: 3px 2px 4px 20px;}
	.mobile-menu{
        display: block;
                position: fixed;
        z-index: 99;
        background: #1e2021;
        width: 100%;
        box-sizing: border-box;
        padding: 20px;
        box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.3);
        border-top: 1px solid rgba(136, 136, 136, 0.15);
        top: 74px;
        bottom: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
	}
	.mobile-menu::-webkit-scrollbar-button {background-image:url('');background-repeat:no-repeat;width:6px;height:0px}
	.mobile-menu::-webkit-scrollbar-track {background-color:#ecedee}
	.mobile-menu::-webkit-scrollbar-thumb {-webkit-border-radius: 0px;border-radius: 2px;background-color:#9ba8dd;transition: 0.3s;}
	.mobile-menu::-webkit-scrollbar-thumb:hover{background-color:#808dc3;transition: 0.3s;}
	.mobile-menu::-webkit-resizer{background-image:url('');background-repeat:no-repeat;width:6px;height:0px}
	.mobile-menu::-webkit-scrollbar{width: 6px;}	
	
	.mobile-menu ul{
	    list-style-type: none;
		margin: 0px;
		padding: 0px;	
	}
	.mobile-menu ul.sub-menu li > a{    padding: 4px 4px 4px 24px;}
	.mobile-menu li{
		padding-bottom: 5px;
	}
	.mobile-menu ul a{
text-decoration: none;
        font-size: 15px;
        color: #fff;
        padding: 4px 0px;
        display: block;
        font-weight: 400;
        font-family: "Square721";	
	}
	.children-ul {
		position: relative !important;
		top: 4px;
		white-space: normal;
		background: transparent;
		box-shadow: none;
		padding: 8px 8px 8px 20px !important;
		left: 0px;
		z-index: 99;
		width: 100%;
		box-sizing: border-box;
	}
	.children-ul li{
		position:relative; text-align: left;
	}
	.mobile-menu .children-ul li > a{
		padding: 4px 6px 8px 24px; font-size: 13px;
	}
	.menu-top-site{display:none;}
	.open-mobile-menu, .mobile-buttons{
		display: block;
	}
	.open-mobile-menu, .close-mobile-menu{
		position: absolute;
		top:0px;
		left:0px;
		right:0px;
		bottom:0px;
		cursor:pointer;
	}
	.header{position: fixed;
    top: 0px;
    z-index: 999;}
	.box-header{padding-bottom: 12px; padding-top: 12px;}
	.open-mobile-menu:hover, .close-mobile-menu:hover{
		background-color: #D94444;
	}
	.open-mobile-menu{
        background: url(/wp-content/uploads/2020/03/menu_button.png);
        background-position: center;
        background-size: 39%;
        background-repeat: no-repeat;
        background-color: #cc0605;
        border-radius: 8px;
	}
	.close-mobile-menu{
		background:url('/wp-content/uploads/2020/03/close-img-min.png');
		background-position: center;
		background-size: 31%;
		background-repeat: no-repeat;
		background-color: #cc0605;
        border-radius: 8px;
		display:none;
	}
	.footer-box{justify-content: center;}
	.box-content-footer{width:50%;}
	.box-footer-contact{    align-items: center;}
	.box-footer-menu{text-align:left;}
	.box-footer-menu ul.children-ul{
		    position: relative !important;
    top: 0px;
    background: transparent;
    padding: 12px 12px 12px 24px !important;
    left: 0px;
    z-index: 6;
    border: 0px solid rgba(81, 83, 85, 1);
    border-radius: 0px;
    width: 100%;
    transform: translate(0px, 0px);
	}
	.date-site{flex-wrap: wrap;}
	.date-site .list_socials_footer{order: 1;width:100%;padding-bottom: 24px;}
	.date-site .compas_link{order: 3;width:100%;}
	.date-site .name_site_footer{order: 2;width:100%; padding-bottom: 16px;}
	.container_our_services_vertical{    grid-template-columns: repeat(2, 1fr);}
	
}
@media(max-width:740px){
	.icon_post_our_service_vertical{min-height:170px;}
	.button-top-modal{display:block;margin-bottom:15px}
	    .youtube-grid {
        grid-template-columns: 1fr;
    }
	.list_socials_mon1{display: none;}
	.container_our_services_vertical{    grid-template-columns: repeat(1, 1fr);}
	.box-content-footer{width:100%;}
}
@media(max-width:420px){

}
/**for js**/
#answer-top-modal-form-order-call-back, #answer-modal-form-ok{
	position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    font-size: 22px;
    font-weight: 300;
    background: #fff;
    padding: 25px;
    z-index: 999;
    box-shadow: 0px 0px 8px 1px #000;
    line-height: 150%;	
	display:none;
}
.display-none{
	display: none !important;
}
.display-block{
	display: block !important;
}