@charset "UTF-8";
/* CSS Document */

/*
Theme Name: SPB Remont
Author: Sinect
Author URI: https://sinect.ru
Version: 1.0.0
*/

@font-face {
	font-family: 'Montserrat'; 
	src: local('Montserrat'), local('Montserrat'),
		 url(./fonts/Montserrat-Regular.ttf); 
}

* {
    box-sizing: border-box;
}

body {
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    font-family: 'Montserrat', sans-serif;
    color: #232428;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 400;
    overflow-x: hidden;
}

section {
    width: 100%;
    padding: 30px 0;
}

input, textarea {
    font-family: 'Montserrat', sans-serif;
}

img {
    max-width: 100%;
    height: auto;
}

.text-center {
    text-align: center;
}

.clear-right {
    clear: right;
}

.no-border {
    border: 0 !important;
}

.container {
    width: 100%;
    height: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 20px;
}

a {
    color: #000;
    text-decoration: none;
}

a:hover {
    opacity: 0.8;
}

button {
    cursor: pointer;
    border: none;
    background-color: transparent;
    font-family: inherit;
}

.btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    padding: 15px 20px;
    border-radius: 4px;
    font-weight: 700;
    text-align: center;
    transition: all 0.3s;
    cursor: pointer;
    border: 1px solid transparent;
}

.btn-primary {
    background-color: #D60000;
    color: #FFFFFF;
    border-color: #D60000;
    min-width: 220px;
    min-height: 60px;
}

.btn-primary:hover {
    background-color: #a70000;
    border-color: #a70000;
}

.btn-secondary {
    background-color: #FFFFFF;
    color: #1C1C1C;
    border: 1px solid #1C1C1C;
    font-size: 16px;
    padding: 15px 20px;
    width: 160px;
    margin: 0 auto;
}

.btn-secondary:hover {
    background-color: #1C1C1C;
    color: #FFFFFF;
}

h1, h2 {
    font-size: 58px;
    line-height: 1.1;
    font-weight: 500;
    margin: 0 0 40px;
    padding: 0;
}

h2 {
    font-size: 42px;
}



/* START HEADER */

.head-top {
    background-color: #F4F4F4;
}

.head-top .container,
.head-mid .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.head-top .geoposi {
    display: flex;
    font-size: 13px;
    font-weight: 600;
}

.head-top .geoposi img {
    margin-right: 7px;
}

.head-top .top-menu {
    display: flex;
    margin: 15px 0;
    font-size: 13px;
}

.head-top .top-menu li {
    list-style: none;
    padding: 0 15px;
    border-right: 1px solid #8B8B8B;
}

.head-top .top-menu li:last-child {
    padding-right: 0;
    border-right: none;
}

.logo {
    display: flex;
    align-items: center;
    padding: 20px 0;
}

.logo-img {
    width: 260px;
    height: auto;
}

.search-form {
    display: flex;
    align-items: center;
    /* border: 2px solid #F4F4F4; */
    border-radius: 4px;
    overflow: hidden;
    flex-grow: 1;
    max-width: 420px;
    font-size: 12px;
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
}

.search-form-input {
    border: none;
    outline: none;
    padding: 15px 20px;
    font-size: 13px;
    font-weight: 700;
    color: #8B8B8B;
    width: 100%;
}

.search-form-input::placeholder {
    color: #8B8B8B;
}

.search-form-button {
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search-form-button img {
    width: 24px;
    height: auto;
}

.contacts-header {
    display: grid;
    grid-template-areas:
        "phone social"
        "worktime social";
    gap: 0 20px;
    align-items: center;
    text-align: right;
}

.contacts-header-phone {
    grid-area: phone;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase;
    color: #1C1C1C;
    white-space: nowrap;
}

.contacts-header-worktime {
    grid-area: worktime;
    font-size: 13px;
    color: #1C1C1C;
    position: relative;
    padding-left: 12px;
    white-space: nowrap;
}

.contacts-header-worktime::before {
    content: '';
    position: absolute;
    left: 56px;
    top: 55%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    background-color: #269600;
    border-radius: 50%;
}

.contacts-header-socials {
    grid-area: social;
    display: flex;
    gap: 10px;
}

.contacts-header-social-link {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    min-width: 50px;
    max-width: 136px;
    width: auto;
    height: 50px;
    padding: 0 15px;
    background-color: #F4F4F4;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.contacts-header-social-link.whatsapp img {
    margin-right: 3px;
}

.contacts-header-social-link:hover {
    background-color: #e0e0e0;
}

.contacts-header-social-link img {
    width: 20px;
    height: auto;
}

.actions-header {
    display: flex;
    gap: 10px;
}

.actions-header-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 15px 20px;
    border: 1px solid #1C1C1C;
    border-radius: 4px;
    font-weight: 700;
    font-size: 13px;
    color: #1C1C1C;
    transition: background-color 0.3s ease, color 0.3s ease;
    white-space: nowrap;
}

.actions-header-button img {
     width: 16px;
     height: auto;
}

.actions-header-button:hover {
    background-color: #1C1C1C;
    color: #FFFFFF;
}

.actions-header-button:hover img {
    filter: brightness(0) invert(1);
}


/* ГЛАВНОЕ МЕНЮ */
.side-menu, .hamb {
    display: none;
}

.topper-mobile {
    display: none;
}

.main-menu {
    display: grid;
    grid-auto-flow: column;
    position: relative;
    background-color: #D60000;
    padding: 20px 0;
    margin: 0;
    border-radius: 10px;
    grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
}

.main-menu li {
    padding: 0 0 0 35px;
    list-style: none;
    border-right: 1px solid #fff;
    text-align: center;
}

/* Контекст позиционирования — каждый пункт верхнего уровня якорит своё сабменю */
.main-menu > li {
    position: relative;
    text-align: left;
}

.main-menu li:last-child {
    border: none;
}

.main-menu li a {
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    position: relative;
}

.menu-item-has-children > a:after {
    content: '';
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    margin-right: 15px;
    position: absolute;
    right: -36px;
    top: 1px;
    rotate: 135deg;
}

/* Показываем сабменю на ховер — только ПК */
.main-menu > li:hover > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translate(20px, 10px);
}

.main-menu .sub-menu {
    display: flex;
    position: absolute;
    height: auto;
    background: #fff;
    left: 0;
    top: 100%;
    padding: 6px 0; /* строки full-width — паддинг только сверху/снизу контейнера */
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    z-index: 99999;
    text-align: left;
    min-width: 240px;
    max-width: 340px;
    width: max-content;
    border-radius: 4px;
    box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.15);
    visibility: hidden;
    opacity: 0;
    /* transform: translateY(8px); */
    transform: translate(20px, 10px);
    transition: .25s ease-in-out;
}

/* Последние пункты — сабменю открывается вправо→влево, чтобы не уходить за экран */
.main-menu > li:last-child .sub-menu,
.main-menu > li:nth-last-child(2) .sub-menu {
    /* left: auto;
    right: 0; */
}
@media (min-width:767px) and (max-width: 1240px) {
    .main-menu .sub-menu { 
        max-width: 360px;
    }
}
.main-menu .sub-menu li {
    font-size: 14px;
    padding: 0;
    flex: 0 0 100%;
    max-width: 100%;
    text-align: left;
    border-bottom: 1px solid #f0f0f0;
}

.main-menu .sub-menu li:last-child {
    border-bottom: none;
}

.main-menu .nav-catalog .sub-menu li {
    flex: 0 0 20%;
    max-width: 20%;
    font-size: 16px;
    font-weight: 600;
}

.main-menu .nav-catalog > .sub-menu > .container > li:nth-child(3) {
    flex: 0 0 23%;
    max-width: 23%;
}

.main-menu .nav-catalog > .sub-menu > .container > li:nth-child(4) {
    flex: 0 0 17%;
    max-width: 17%;
}

.main-menu .nav-catalog > .sub-menu > .container > li:last-child {
    display: none;
}

.nav-brands > .sub-menu > .container {
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
}

/* Вложенное сабменю (3-й уровень) — флайаут вправо */
.main-menu .sub-menu li.menu-item-has-children {
    position: relative;
}

.main-menu .sub-menu .sub-menu {
    position: absolute;
    left: 100%;
    top: -6px; /* совпадает с padding: 6px 0 контейнера */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0;
    padding: 8px 0;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.20);
    min-width: 220px;
    max-width: 300px;
    width: max-content;
    visibility: hidden;
    opacity: 0;
    transform: translateX(6px);
    transition: .25s ease-in-out;
    z-index: 99999;
}

.main-menu .sub-menu .sub-menu::before {
    display: none !important;
}

/* Показываем флайаут при ховере на родительском пункте */
.main-menu .sub-menu li.menu-item-has-children:hover > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateX(0);
}

.main-menu .sub-menu a {
    display: block;
    background: none;
    padding: 10px 16px;
    color: #1D1E23;
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
    transition: background .15s;
}

.main-menu .sub-menu a:hover {
    background: #f5f5f5;
    color: #D60000;
}

/* Пункты с дочерним меню: flex-строка, стрелка прижата вправо */
.main-menu .sub-menu li.menu-item-has-children > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-right: 14px;
}

/* Стрелка вправо — inline-элемент в flex-строке, не absolute */
.main-menu .sub-menu li.menu-item-has-children > a:after {
    content: '';
    position: static;        /* выводим из absolute-потока */
    display: inline-block;
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-top: 1.5px solid #aaa;
    border-right: 1.5px solid #aaa;
    rotate: 45deg;           /* → вправо */
    margin: 0;
    transform: none;
    top: auto;
    right: auto;
    transition: border-color .15s;
}

.main-menu .sub-menu li.menu-item-has-children > a:hover:after {
    border-color: #D60000;
}

.main-menu .sub-menu .sub-menu li {
    padding: 0;
    flex: 0 0 100%;
    max-width: 100%;
    font-weight: 400;
    list-style: none;
    width: 100%;
}

.main-menu .sub-menu .sub-menu a {
    font-size: 14px;
    padding:10px 16px;
    background: none;
    color: #1D1E23;
}
.main-menu .sub-menu .sub-menu a:hover {
    background: #f5f5f5;
    color: #D60000;
}
.main-menu .nav-view {
    display: block;
    font-size: 13px;
    font-weight: 400;
    margin-top: 16px;
}

/* Кнопка-тогглер сабменю (только мобильные) */
.submenu-toggle {
    display: none; /* скрыта на десктопе */
}

/* КОНЕЦ ГЛАВНОГО МЕНЮ */

/* END HEADER */

.breadcrumbs {
    margin-top: 20px;
}

/* START HOME PAGE */
.hero .container {
    position: relative;
}

.hero-swiper {
    overflow: hidden;
    position: relative;
    border-radius: 30px;
}

.hero .swiper-slide {
    display: flex;
    justify-content: space-between;
    padding: 0;
    min-height: 432px;
    background-color: #F4F4F4;
}

.swiper-image {
    display: flex;
    line-height: 0;
    justify-content: center;
    align-items: center;
    flex: 0 0 50%;
}

.hero .swiper-image img {
    max-height: 432px;
}

.swiper-button-next, .swiper-button-prev {
    color: #fff;
    background: #000;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 0 0 10px #fff;
    margin-right: -14px;
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 20px;
    font-weight: 700;
}

.swiper-button-prev {
    margin-left: -14px;
}

.swiper-pagination-bullet {
    width: 50px;
    height: 4px;
    border-radius: 50px;
}

.swiper-pagination-bullet-active {
    background: #1C1C1C;
}

.swiper-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 0 0 5%;
    z-index: 7;
    flex: 0 0 50%;
    max-width: 50%;
}

.swiper-title {
    text-transform: uppercase;
    font-size: 62px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.noslider .swiper-title {
    font-size: 48px;
}

.swiper-subtitle {
    font-weight: 500;
    font-size: 22px;
    line-height: 150%;
    margin: 20px 0 30px;
    position: relative;
    padding-left: 40px;
}

.swiper-subtitle:before {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    left: 0;
    background-color: #269600;
    border-radius: 50%;
    margin-top: 5px;
    background-image: url(image/icon-check.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.swiper-content .btn {
    max-width: 250px;
}

.hero.service .swiper-title {
    font-size: 42px;
    line-height: 1.4;
    margin-bottom: 10px;
}

.hero.service .swiper-subtitle {
    margin: 7px 0;
}

.hero.service .btn {
    margin-top: 15px;
}

.home-intro .container {
    display: flex;
    align-items: center;
}

.home-intro img {
    padding: 0 40px 0 0;
    width: 410px;
}

.home-intro h1 {
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    margin: 0;
    text-transform: uppercase;
}

.why-us .container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 60px;
}

.why-us-video {
    width: 100%;
    max-width: 820px
}

.why-us-info {
    flex: 1 1 40%;
    max-width: 40%;
    padding-top: 20px;
}

.why-us-title {
    font-weight: 700;
    font-size: 32px;
    line-height: 1.4;
    text-transform: uppercase;
    color: #1C1C1C;
    margin-bottom: 30px;
}

.text-primary {
    color: #D60000;
    font-weight: 700;
}

.why-us-features-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-bottom: 40px;
    padding: 0;
}

.why-us-feature-item {
    display: flex;
    gap: 15px;
    line-height: 1.6;
    color: #1C1C1C;
    border-bottom: 1px dashed #E0E0E0;
    padding-bottom: 25px;
}

.why-us-feature-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.why-us-feature-icon {
    flex-shrink: 0;
    width: 28px;
    height: 48px;
    background-color: #269600;
    border-radius: 6px;
    margin-top: 3px;
    background-image: url('image/icon-check.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px;
}

.section-title {
    font-weight: 700;
    font-size: 32px;
    line-height: 1.5;
    text-transform: uppercase;
    margin-bottom: 40px;
}

.popular-services {
    padding: 80px 0 0;
}

.popular-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-bottom: 70px;
    border-bottom: 1px solid #DCDCDC;
}

.service-card {
    position: relative;
    border: 1px solid #DCDCDC;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
}

.service-card-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 20px 20px 0 0;
}

.service-card-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.service-card-info {
    flex-grow: 1;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.service-card-title {
    font-weight: 600;
    font-size: 18px;
    line-height: 1.4;
    color: #1C1C1C;
    margin: 0 0 10px;
    min-height: 50px;
    display: flex;
    align-items: end;
}

.service-card-price {
    display: inline-flex;
    align-items: center;
    background-color: #D60000;
    color: #FFFFFF;
    padding: 5px 15px 5px 10px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.5;
    position: relative;
    white-space: nowrap;
    margin-top: auto;
}

.service-card-price:before {
    content: '';
    position: absolute;
    left: 50%;
    top: -5px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 6px solid #D60000;
}

.service-card-price span {
    margin-left: 10px;
}

.service-card-content .btn {
    position: absolute;
    bottom: -25px;
    box-shadow: 0 0 0 10px #fff;
    z-index: 3;
}



/* --- Our Services Section --- */
.our-services {
    padding: 80px 0;
}

.our-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.ourserv-card {
    border: 1px solid #DCDCDC;
    border-radius: 20px;
    padding: 30px 50px;
    display: flex;
    flex-direction: column;
}

.ourserv-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.ourserv-card-icon {
    width: 60px; /* Размер иконки */
    height: 60px;
    flex-shrink: 0;
    position: relative;
}

.ourserv-card-icon img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ourserv-card-title {
    font-weight: 600;
    font-size: 22px;
    line-height: 1.4;
    color: #1C1C1C;
}

.ourserv-card-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 15px;
    margin: 0 20% 30px 0;
}

.ourserv-card-list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
    color: #1C1C1C;
}

.ourserv-card-list-item span:first-child {
    display: list-item;
}

.ourserv-card-price {
    display: inline-flex;
    align-items: center;
    background-color: #D60000;
    color: #FFFFFF;
    margin-left: 6px;
    padding: 3px 10px 3px 8px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.5;
    position: relative;
    white-space: nowrap;
}

.ourserv-card-price:before {
    content: '';
    position: absolute;
    left: -5px; /* Сдвигаем треугольник */
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 6px solid #D60000; /* Треугольник */
}

.ourserv-card-button {
    margin: 0;
}

.consultation {
    position: relative;
    padding: 75px 0;
    z-index: 1;
}

.consultation .container {
    display: flex;
    align-items: flex-start; /* Выравнивание по верху */
    justify-content: space-between;
    gap: 60px; /* Отступ между блоками */
}

.consultation-info {
    flex: 0 0 29%;
    max-width: 29%;
}

.consultation-title {
    font-weight: 800;
    font-size: 32px;
    line-height: 1.5;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.consultation-description {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.6;
}


.consultation-card-wrap {
    flex: 0 0 66%;
    max-width: 66%;
    position: relative;
}

.consultation-card {
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0px 20px 40px rgba(28, 28, 28, 0.1);
    position: relative;
    z-index: 2;
}

.consultation-card::before {
    content: '';
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-right: 20px solid #FFFFFF;
    filter: drop-shadow(-5px 0px 5px rgba(0, 0, 0, 0.05));
}

.consultation-card-title {
    font-weight: 700;
    font-size: 24px;
    line-height: 1.4;
    text-transform: uppercase;
    color: #1C1C1C;
    margin: 0;
}

.consultation-card-subtitle {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: #1C1C1C;
    margin: 0 0 30px;
}

.consultation-card-contact {
    display: flex;
    align-items: center;
    gap: 25px;
}

.consultation-phone {
    display: block;
    font-weight: 700;
    font-size: 28px;
    line-height: 1.3;
    color: #1C1C1C;
    margin-bottom: 5px;
}

.consultation-work-status {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    color: #269600; /* Зеленый цвет */
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}

.consultation-status-icon {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #269600;
    border-radius: 50%;
    flex-shrink: 0;
}

.consultation-separator {
    font-weight: 500;
    font-size: 16px;
    color: #1C1C1C;
    opacity: 0.6;
}

.consultation-button {
    min-width: 200px;
}

.consultation-image {
    position: absolute;
    right: 4%;
    bottom: -100px;
    width: 350px;
    height: auto;
    z-index: 3;
}



/* --- Benefits Section --- */
.benefits {
    position: relative;
    padding: 0 0 80px;
    background-color: #FFFFFF;
    z-index: 2;
}

.benefits-promo {
    background-color: #1C1C1C;
    border-radius: 20px;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.benefits-promo-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #FFFFFF;
    margin: 20px 0;
}

.benefits-promo-title {
    font-size: 24px;
    font-weight: 600;
    flex: 1 1 70%;
    height: 60px;
    text-transform: uppercase;
    text-align: center;
    margin: 0 20px 0 0;
    background: #1C1C1C;
    padding: 13px;
    border-radius: 10px;
}

.benefits-promo-title span {
    color: #D60000;
    font-weight: 900;
}

.benefits-promo-button {
    min-width: 280px;
    border-radius: 10px;
}

.benefits-promo-image {
    width: 100%;
}

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px; /* Увеличил gap */
    margin-bottom: 80px; /* Увеличил отступ */
}

.benefit-card {
    background-color: #F4F4F4; /* Светло-серый фон карточки */
    border-radius: 20px; /* Скругление */
    padding: 30px; /* Отступы */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.benefit-card-icon {
    width: 100px;
    height: 100px;
    position: relative;
}

.benefit-card-icon img {
    position: static; /* Убираем absolute */
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.benefit-card-title {
    font-weight: 600;
    font-size: 18px;
    line-height: 1.5;
    position: relative;
    padding-right: 32px;
}

.benefit-card-title:after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    right: 0;
    background-color: #269600;
    border-radius: 50%;
    margin-top: 2px;
    background-image: url(image/icon-check.svg);
    background-repeat: no-repeat;
    background-position: center;

}

.benefit-card-text {
    font-weight: 400; /* Тоньше шрифт */
    font-size: 14px;
    line-height: 1.6; /* Больше интерлиньяж */
    color: #1C1C1C;
    margin-top: 0;
}

.benefits-ratings {
    display: flex;
    align-items: flex-end; /* Выравнивание по низу */
    gap: 40px;
}

.benefits-ratings-info {
    text-align: right;
    position: relative;
    margin-bottom: 0;
}

.benefits-ratings-arrow {
    width: 40px; /* Ширина стрелки */
    height: auto;
}

.benefits-ratings-title {
    font-weight: 800;
    font-size: 36px;
    line-height: 1.1;
    text-transform: uppercase;
    margin-bottom: 0;
    margin: 0;
}

.benefits-ratings-cards {
    display: flex;
    gap: 30px;
    flex-grow: 1;
}

.rating-card {
    border-radius: 10px;
    display: flex;
    flex: 1;
    overflow: hidden;
    background-color: #F4F4F4;
}


.rating-card-main-info {
    background-color: #F4F4F4;
    color: #1C1C1C;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex-grow: 1;
}

.rating-card-score-block {
    background-color: #1C1C1C;
    color: #FFFFFF;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 160px;
    flex-shrink: 0;
}

.rating-card-header {
    display: grid;
    grid-template-areas:
        "rcard-logo rcard-name"
        "rcard-logo rcard-stars";
    justify-content: start;
    align-items: center;
    gap: 10px;
}

.rating-card-logo {
    grid-area: rcard-logo;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: contain;
}

.rating-card-name {
    grid-area: rcard-name;
    font-weight: 700;
    font-size: 22px;
    line-height: 1.4;
}

.rating-card-score {
    font-weight: 700;
    font-size: 48px;
    line-height: 1;
    margin-bottom: 5px;
}

.rating-card-reviews {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
}

.rating-card-stars, .review-card-stars {
    grid-area: rcard-stars;
    background-image: url('image/stars.svg');
    width: 93px;
    height: 15px;
    background-repeat: space;
}

.rating-card-stars img {
    width: 20px;
    height: auto;
}

.gray-bg {
    background-color: #F4F4F4;
}

.certificates .container {
    position: relative;
    border-bottom: 1px solid #DCDCDC;
    padding: 70px 20px;
}

.certificates-swiper {
    overflow: hidden;
    padding-bottom: 50px;
}

.certificates .swiper-pagination {
    bottom: 80px;
}

.gallery {
    padding: 50px 0 70px;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.gallery-card {
    position: relative;
    display: block;
}

.gallery-card-image {
    display: block;
    width: 100%;
    overflow: hidden;
    object-fit: cover;
    border-radius: 20px;
    transition: 0.4s ease;
}

.gallery-card:hover .gallery-card-image {
    transform: scale(1.05); /* Небольшое увеличение при наведении */
}

.gallery-card-content {
    padding: 20px 0;
    text-align: center;
}

.gallery-card-title {
    font-weight: 600;
    font-size: 18px;
    line-height: 1.5;
}

.gallery-card-button {
    display: inline-block;
    position: relative;
    background-color: #FFFFFF;
    color: #1C1C1C;
    padding: 10px 30px 10px 15px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.4;
    transition: 0.4s ease;
}

.gallery-card-button:after {
    content: '';
    width: 6px;
    height: 6px;
    border-top: 2px solid #1C1C1C;
    border-right: 2px solid #1C1C1C;
    margin-right: 15px;
    position: absolute;
    right: 0;
    top: 15px;
    rotate: 45deg;
    transition: 0.4s ease;
}

.gallery-card:hover .gallery-card-button {
    background-color: #1C1C1C;
    color: #FFFFFF;
}

.gallery-card:hover .gallery-card-button:after {
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}

.call-request {
    padding-top: 80px; /* Отступ только сверху, т.к. фон идет ниже */
    position: relative;
}

.call-request-content {
    display: flex;
    align-items: center;
    gap: 30px; /* Отступ между картинкой и формой */
    background-color: #3E3E40; /* Темно-серый фон */
    color: #FFFFFF;
    border-radius: 20px;
    padding: 40px 60px; /* Внутренние отступы */
    position: relative; /* Для позиционирования картинки */
    z-index: 2; /* Над вкладками */
    margin-bottom: -30px; /* Перекрытие со вкладками */
}

.call-request-image-wrapper {
    flex-shrink: 0;
    width: 550px;
    align-self: flex-end;
    margin-top: -75px;
    margin-bottom: -40px;
}

.call-request-image {
    display: block;
    width: 100%;
    height: auto;
}

.call-request-form-area {
    flex-grow: 1;
}

.call-request-title {
    font-weight: 700;
    font-size: 32px;
    line-height: 1.4;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.call-request-form {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.call-request-input-wrapper {
    display: flex;
    align-items: center;
    background-color: #FFFFFF;
    border-radius: 4px;
    padding: 5px 20px;
    flex-grow: 1;
}

.call-request-flag {
    width: 24px; /* Размер флага */
    height: auto;
    margin-right: 10px;
}

.call-request-input {
    border: none;
    outline: none;
    font-family: inherit;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0.1em; /* Расстояние между символами */
    color: #1C1C1C;
    width: 100%;
    padding: 15px 0; /* Вертикальные отступы */
}

.call-request-input::placeholder {
    color: #8B8B8B;
}

.call-request-button {
    flex-shrink: 0;
    min-width: 250px; /* Ширина кнопки */
    height: 70px; /* Высота кнопки */
    font-size: 18px;
}

.call-request-policy {
    font-size: 12px;
    line-height: 1.5;
    color: #FFFFFF;
    opacity: 0.6;
    max-width: 450px; /* Ограничим ширину текста политики */
}

.call-request-policy a {
    color: #FFFFFF;
    text-decoration: underline;
}

.call-request-policy a:hover {
    text-decoration: none;
}

.call-request-tabs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-top: 60px;
    position: relative;
    z-index: 1;
    padding-bottom: 80px;
}

.call-request-tab {
    border: 1px solid #1C1C1C;
    border-radius: 10px;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    background-color: #FFFFFF;
    transition: all 0.3s ease;
}

.call-request-tab:hover {
    border-color: #269600;
    box-shadow: 0px 20px 20px 0px #1C1C1C1A;

}


.call-request-tab-text {
    font-weight: 600;
}

.call-request-tab-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    margin-left: 15px;
}

.call-request-tab-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.guarantee {
    padding: 100px 0 70px;
}

.guarantee-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.guarantee-card {
    position: relative;
    border: 1px solid #DCDCDC;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    padding: 30px 0 0;
    border-radius: 20px;
}

.guarantee-card-icon {
    position: absolute;
    top: -30px;
    background-color: #fff;
    display: block;
    margin: auto;
    padding: 0 30px;
}

.guarantee-card-title {
    align-self: center;
    min-height: 75px;
    display: flex;
    margin: 25px 0 30px;
    padding: 0 30px;
    text-align: center;
    align-items: center;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    text-transform: uppercase;
}

.guarantee-card-text {
    position: relative;
    margin: -1px;
    padding: 40px 60px 40px 30px;
    background-color: #F4F4F4;
    border-radius: 20px;
    font-weight: 500;
    font-size: 14px;
}

.guarantee-card-text:before {
    content: '';
    position: absolute;
    background: url(image/icon-info.svg) no-repeat center #269600;
    background-size: 7px;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
}


.quiz {
    padding: 80px 0;
    background-color: #FFFFFF;
}

.quiz-block {
    display: flex;
    border: 3px solid #F4F4F4;
    border-radius: 20px;
}

.quiz-info-card {
    flex: 0 0 31.7%;
    border: 3px solid #1C1C1C;
    border-radius: 20px;
    padding: 30px 20px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: top center;
        margin: -3px -3px -3px 0;
}

.quiz-manager-photo {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    margin: 0 auto;
    object-fit: cover;
}

.quiz-manager-name {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    margin-bottom: 0;
}

.quiz-manager-title {
    font-weight: 500;
    font-size: 12px;
    line-height: 1.5;
    color: #8B8B8B;
    margin-bottom: 20px;
}

.quiz-info-text {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
    color: #1C1C1C;
    margin-bottom: 25px;
}

.quiz-separator {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.quiz-separator::before,
.quiz-separator::after {
    content: '';
    flex-grow: 1;
    height: 1px;
    background-color: #DCDCDC;
}

.quiz-separator span {
    padding: 0 10px;
    font-weight: 700;
    font-size: 16px;
    color: #1C1C1C;
}

.quiz-phone {
    display: block;
    font-weight: 700;
    font-size: 22px;
    line-height: 1.4;
    text-transform: uppercase;
    color: #1C1C1C;
    margin-bottom: 5px;
}

.quiz-worktime {
    font-weight: 700;
    font-size: 14px;
    color: #269600;
    display: inline-flex; /* Чтобы точка была рядом */
    align-items: center;
    gap: 5px;
    margin-bottom: 25px;
}

.quiz-worktime-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    background-color: #269600;
    border-radius: 50%;
}

.quiz-socials {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.quiz-social-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    background-color: #F4F4F4;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.quiz-social-link:hover {
    background-color: #e0e0e0;
}

.quiz-social-link img {
    width: 20px; /* Примерно */
    height: auto;
}

.quiz-form-card {
    flex-grow: 1;
    padding: 30px 40px;
}

.quiz-form-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.quiz-step-title {
    font-weight: 700;
    font-size: 22px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    margin: 0;
}

.quiz-step-indicator {
    font-weight: 700;
    font-size: 22px;
    text-transform: uppercase;
    color: #1C1C1C;
    text-align: right;
    margin: 0;
}

.quiz-progress-bar {
    height: 10px;
    background-color: #F4F4F4;
    border-radius: 50px;
    overflow: hidden;
    margin-bottom: 30px;
}

.quiz-progress-bar-inner {
    height: 100%;
    background-color: #D60000;
    border-radius: 50px;
    transition: width 0.4s ease;
}



.quiz-options {
    display: flex;
    gap: 30px;
    margin-bottom: 40px;
}

.quiz-option {
    display: block; /* Чтобы label занимал всю ширину */
    cursor: pointer;
}

.quiz-option input[type="radio"] {
    display: none; /* Скрываем стандартный radio */
}

.quiz-option-content {
    
    text-align: center;
    position: relative;
    transition: border-color 0.3s ease;
}



.quiz-option-content img {
    display: block;
    width: 100%;
    object-fit: cover;
    border: 2px solid #F4F4F4;
    border-radius: 20px;
    margin: 0 auto 15px;
    
}

.quiz-option input[type="radio"]:checked + .quiz-option-content img {
    border-color: #D60000;
}

.quiz-option-content span {
    display: block;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
}

.quiz-option-checkmark {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 24px;
    height: 24px;
    border: 2px solid #DCDCDC;
    border-radius: 50%;
    background-color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: border-color 0.3s ease, background-color 0.3s ease;
}

.quiz-option-checkmark::after {
    content: '';
    position: absolute;
    display: block;
    width: 12px;
    height: 12px;
    top: 4px;
    left: 4px;
    background-color: transparent;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

.quiz-option input[type="radio"]:checked + .quiz-option-content .quiz-option-checkmark {
    border-color: #269600;
}

.quiz-option input[type="radio"]:checked + .quiz-option-content .quiz-option-checkmark::after {
    background-color: #269600;
}

.quiz-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.quiz-nav-button {
    display: inline-flex;
    position: relative;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.4;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

.quiz-nav-button--prev {
    background-color: #F4F4F4;
    color: #1C1C1C;
}

.quiz-nav-button--prev:hover:not(:disabled) {
    background-color: #e0e0e0;
}

.quiz-nav-button--prev:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.quiz-nav-button--next {
    background-color: #D60000;
    color: #FFFFFF;
    padding-right: 35px;
}

.quiz-nav-button--next:after {
    content: '';
    width: 9px;
    height: 9px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    margin-right: 15px;
    position: absolute;
    right: 2px;
    rotate: 45deg;
    transition: 0.4s ease;
}

.quiz-nav-button--next:hover {
    background-color: #a70000;
}



.team {
    padding: 80px 0;
    background-color: #FFFFFF;
}

.team .container {
    position: relative;
}

.team-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

.team-header .section-title {
    margin-bottom: 0;
}

.team-info-badge {
    display: inline-flex;
    gap: 10px;
}

.team-info-badge .icon {
    width: 40px;
    background: url(image/icon-info.svg) no-repeat center #269600;
    background-size: 11px;
    border-radius: 10px;

}

.team-info-badge .text {
    border: 2px dashed #DCDCDC;
    border-radius: 10px;
    padding: 0px 30px;
    font-weight: 700;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

.team-info-badge .text span {
    color: #D60000;
    margin-left: 6px;
}

.team-slider {
    overflow: hidden;
    padding: 30px 0 0;
}

.team-card-photo {
    display: block;
    background-color: #F4F4F4;
    border-radius: 20px;
    line-height: 0;
    text-align: center;
    min-height: 170px;
}

.team-card-photo img {
    margin-top: -30px;
}

.team-card-info {
    padding: 20px;
}

.team-card-name {
    font-weight: 600;
    font-size: 18px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    margin-bottom: 15px;
}

.team-card-tags {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.team-card-tag {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.4;
    color: #1C1C1C;
    padding: 0 0 10px 25px;
    border-bottom: 1px dashed #8B8B8B;
}

.team-card-tag:last-child {
    border: 0;
}
.team-card-tag:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background: url(image/icon-team-rank.svg) no-repeat center;
}

.team-card-tag:last-child:before {
    background-image: url(image/icon-team-experience.svg);
}

.reviews {
    padding: 80px 0 0;
    background-color: #F4F4F4;
    position: relative;
    overflow: hidden;
}

.reviews .container {
    position: relative;
}

.reviews .section-title {
    margin-bottom: 40px;
}

.reviews-swiper {
    overflow: hidden;
    padding-bottom: 100px;
}

.reviews-swiper .swiper-button-next,
.reviews-swiper .swiper-button-prev {
    top: auto;
    bottom: 7px;
    box-shadow: none;
}

.reviews-swiper .swiper-button-next {
    right: 50%;
    margin-right: -200px;
}

.reviews-swiper .swiper-button-prev {
    left: 50%;
    margin-left: -200px;
}

.reviews-swiper .swiper-pagination {
    bottom: 20px;
}

.reviews .swiper-slide {
    display: flex;
}

.review-slide-left {
    display: grid;
    gap: 30px
}

.review-img {
    max-height: 600px;
    margin-left: 40px;
}

.review-card {
    background-color: #FFFFFF;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.review-card-author {
    display: grid;
    grid-template-areas:
        "avatar name   source"
        "avatar .....  source";
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px 15px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px dashed #DCDCDC;
}

.review-card-avatar, .review-card-icon {
    grid-area: avatar;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

.review-card-icon {
    background-color: #D60000;
    color: #fff;
    font-size: 24px;
    text-align: center;
    line-height: 60px;
}

.review-card-name {
    grid-area: name;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.5;
    color: #1C1C1C;
}

.review-card-name h4 {
    margin: 15px 0 6px;
}

.review-card-date {
    display: block;
    font-size: 15px;
    font-weight: 400;
}

.review-card-source {
    grid-area: source;
    text-align: right;
    display: grid;
    grid-template-areas:
        "rsource-name rsource-logo"
        "rsource-stars rsource-logo";
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0 15px;
}

.review-card-source img {
    grid-area: rsource-logo;
    display: inline-block;
    vertical-align: middle;
    width: 50px;
    height: 50px;
    object-fit: contain;
    margin-right: 5px;
    border-radius: 50%;
}

.review-card-source span {
    grid-area: rsource-name;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    vertical-align: middle;
}

.review-card-stars-wrap {
    grid-area: rsource-stars;
    width: 100%;
    display: flex;
    justify-content: end;
}

.review-card-stars {
    background-image: url('image/stars-green.svg');
}

.review-card-text {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.5;
    color: #1C1C1C;
    flex-grow: 1;
}

.reviews-pag-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: #1C1C1C;
    border: 5px solid #F4F4F4;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 3;
    transition: background-color 0.3s ease;
}

.reviews-pag-button:hover {
    background-color: #444;
}

.reviews-pag-button--prev {
    left: -20px;
}

.reviews-pag-button--next {
    right: -20px;
}

.reviews-pag-button img {
    width: 8px;
    height: auto;
    filter: brightness(0) invert(1);
}

.reviews-pag-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 30px 0 80px;
}

.reviews-pag-dot {
    width: 10px;
    height: 10px;
    background-color: #DCDCDC;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.reviews-pag-dot:hover,
.reviews-pag-dot--active {
    background-color: #1C1C1C;
}

.reviews-divider {
    border: none;
    border-top: 1px solid #DCDCDC;
    margin: 0 0 80px;
}

.reviews-background {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 300px;
    z-index: 1;
    pointer-events: none;
}

.reviews-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: bottom center;
}

.faq {
    padding: 80px 0;
    background-color: #F4F4F4;
}

.faq-container {
    
}

.faq-content {
    display: flex;
    gap: 5%;
    align-items: flex-start;
}

.faq-title {
    text-align: left;
    margin-bottom: 15px;
}

.faq-description {
    font-size: 18px;
    line-height: 1.5;
    color: #1C1C1C;
    margin-bottom: 40px;
}

.faq-description a {
    font-weight: 700;
}

.faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.faq-item {
    background-color: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
}

.faq-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 25px 30px;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
}

.faq-item-title {
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    margin-right: 40px;
}

.faq-item-icon {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
}

.faq-item-icon img {
    width: 12px;
    height: auto;
    filter: brightness(0) invert(1);
}

.faq-item-icon--minus {
    background-color: #1C1C1C;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.faq-item-icon--plus {
    background-color: #269600;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.faq-item.active .faq-item-icon--minus {
    opacity: 1;
}

.faq-item.active .faq-item-icon--plus {
    opacity: 0;
}

.faq-item-body {
    max-height: 0;
    padding: 0 30px;
    transition: all 0.35s;
}

.faq-item.active .faq-item-body {
    
    padding: 0 30px 25px;
    max-height: 100vh;
}

.faq-item-body p {
    font-size: 14px;
    line-height: 1.5;
    color: #1C1C1C;
}

.faq-form-card {
    flex: 0 0 35%;
    border-radius: 20px;
    padding: 30px 50px;
    border: 3px solid #1C1C1C;
    box-shadow: 0px 20px 40px 0px rgba(28, 28, 28, 0.2);
}

.faq-form-title {
    font-weight: 700;
    font-size: 32px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #1C1C1C;
    text-align: center;
    margin-bottom: 10px;
}

.faq-form-subtitle {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: #1C1C1C;
    text-align: center;
    margin-bottom: 25px;
}

.faq-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 15px;
}

.faq-form-input,
.faq-form-textarea {
    width: 100%;
    padding: 20px 30px;
    border: none;
    border-radius: 4px;
    font-family: inherit;
    font-size: 16px;
    color: #1C1C1C;
    font-weight: 700;
    outline: none;
}

.faq-form-input::placeholder,
.faq-form-textarea::placeholder {
    color: #8B8B8B;
    font-weight: 700;
}

.faq-form-textarea {
    min-height: 100px;
    resize: vertical;
}

.faq-form-button {
    width: 100%;
    height: 60px;
    font-size: 18px;
}

.faq-form-policy {
    font-size: 12px;
    line-height: 1.5;
    color: #1C1C1C;
    opacity: 0.6;
    text-align: center;
}

.faq-form-policy a {
    text-decoration: underline;
}

.zapis-uspeh {
    color: #269600;
    background-color: #e0ffd5;
    padding: 15px;
    border-radius: 12px;
    font-weight: 500;
}

/* END HOME PAGE */

/* START FOOTER */
.footer {
    background-color: #1C1C1C;
    color: #FFFFFF;
    padding: 60px 0;
}

.footer-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}

.footer-brand {
    line-height: 0;
}

.footer-logo img {
    max-width: 221px;
    height: auto;
}
/*
.footer-location {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
}

.footer-location-icon {
    width: 16px;
}
*/
.footer-main-nav {
    display: flex;
    
}

.footer-main-nav li {
    padding: 0 20px;
    list-style: none;
    border-right: 1px solid #8b8b8b;
}

.footer-main-nav li:last-child {
    border-right: none;
}

.footer-main-nav a {
    color: #FFFFFF;
    font-size: 14px;
    transition: color 0.3s ease;
}

.footer-contact-info {
    display: flex;
    align-items: center;
    gap: 20px;
}

.footer-contact-details {
     text-align: right;
}

.footer-phone {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: #FFFFFF;
}

.footer-worktime {
    font-size: 14px;
    font-weight: 700;
    color: #269600;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.footer-worktime-indicator {
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #269600;
    border-radius: 50%;
}

.footer-contact-socials {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
}

.footer-contact-socials a {
    background-color: #fff;
    line-height: 0;
    padding: 12px;
    border-radius: 4px;
}

.footer-contact-socials a img {
    width: 23px;
    height: 23px;
}


/* --- Средняя часть футера --- */
.footer-middle {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 9%;
}

.footer-socials-left {
    display: flex;
    flex-wrap: wrap;
}

.footer-copy {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    align-self: end;
    padding-bottom: 15px;
}

.footer-socials-left h4,
.footer-services-col h4 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.footer-socials-left h4 {
    margin-bottom: 0;
}

.footer-social-icons {
    display: flex;
    gap: 15px;
}

.footer-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 50px;
    background-color: #444;
    border-radius: 4px;
    line-height: 0;
}

.footer-services-col ul {
    padding: 0;
    list-style: none;
}

.footer-services-col li {
    display: flex;
    gap: 7px;
    margin-bottom: 12px;
}

.footer-services-col li:before {
    content: "·";
    font-size: 20px;
    line-height: 20px;
}

.footer-services-col a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    transition: color 0.3s ease;
}

.footer-services-col a:hover {
    color: #FFFFFF;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-policy {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: underline;
    transition: color 0.3s ease;
}

.footer-policy:hover {
    color: #FFFFFF;
}
/* END FOOTER */


/* SECTION PAGE */

.other-services {
    position: relative;
    z-index: 3;
}

.other-services-wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5%;
}

.other-service {
    background-color: #fff;
    padding: 40px;
    border-radius: 20px;
}

.other-service-image {
    width: 100%;
    height: 300px;
    object-fit: cover;
    margin-bottom: 20px;
    border-radius: 20px;
}

.other-service-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.other-service-title {
    font-size: 22px;
    line-height: 150%;
    margin: 0;
    text-transform: uppercase;

}

.other-service-content .btn {
    width: 50px;
    height: 50px;
    min-width: 50px;
    min-height: 50px;
    padding: 0;
    border-radius: 10px;
}

.tab {
  display: flex;
  flex-wrap: wrap;
}

.tab > input[type="radio"] {
  display: none;
}

.tab-content {
    display: none;
    width: 100%;
    padding: 40px;
    background-color: #fff;
    border-radius: 0 20px 20px 20px;
    box-shadow: 0px 20px 30px 0px #1C1C1C1A;
}

.tab-content-wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 8%;
    position: relative;
}

.tab-content-wrap:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 7%;
    width: 1.2px;
    height: 94%;
    background-color: #DCDCDC;
}

#tab-btn-1:checked~#content-1,
#tab-btn-2:checked~#content-2,
#tab-btn-3:checked~#content-3,
#tab-btn-4:checked~#content-4,
#tab-btn-5:checked~#content-5,
#tab-btn-6:checked~#content-6,
#tab-btn-7:checked~#content-7,
#tab-btn-8:checked~#content-8,
#tab-btn-9:checked~#content-9,
#tab-btn-10:checked~#content-10,
#tab-btn-11:checked~#content-11,
#tab-btn-12:checked~#content-12,
#tab-btn-13:checked~#content-13 {
  display: block;
}

.tab > label {
    display: block;
    margin: 0 10px;
    padding: 12px 20px;
    cursor: pointer;
    transition: all .25s ease-in-out;
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    border: 0;
    border-radius: 10px 10px 0 0;
    background-color: #1C1C1C;
}

.tab > label:nth-child(2) {
    margin-left: 0;
}

.tab > input[type="radio"]:checked + label {
  cursor: default;
  color: #1C1C1C;
  background-color: #fff;
}

.price-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    padding: 20px 0;
    border-bottom: 1px dashed #DCDCDC;
}

.price-line-price {
    font-weight: 700;
    font-size: 20px;
    color: #D60000;
    flex: 0 0 190px;
}

.tab-content .btn {
    margin: 30px auto 0;
    display: block;
    width: 320px;
}

.why-about .container {
    display: flex;
    gap: 0 8%;
    justify-content: space-between;
    position: relative;
}

.why-about .why-us-info,
.why-about .about-info {
    flex: 1 1 46%;
    max-width: 46%;
    padding-top: 0;
}

.why-about .container:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 1%;
    width: 1.2px;
    height: 94%;
    background-color: #DCDCDC;
}

.stages-wrap {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 2%;
    counter-reset: step;
}

.stages-item {
    text-align: center;
    padding: 0 20px 20px;
    border: 1px solid #DCDCDC;
    border-radius: 10px;
}

.stages-item:before {
    content: counter(step);
    counter-increment: step;
    width: 36px;
    height: 36px;
    line-height: 36px;
    display: block;
    font-size: 16px;
    color: #fff;
    background: #D60000;
    border-radius: 4px;
    margin: -19px auto 25px;
    text-align: center;
    z-index: 2;
    position: relative;
    box-shadow: 0 0 0 20px #fff;
}

.stages-item:last-child:before {
    content: '';
    background: #269600 url(image/icon-check.svg) no-repeat center;
}

.stages-item img {
    margin: 0 auto;
}

.stages-item img, .stages-item-title, .stages-item-text {
    display: block;
    margin-bottom: 15px;
}

.stages-item-title {
    min-height: 50px;
    font-weight: 600;
}

.stages-item-text {
    font-size: 14px;
}

.gallery-swiper .container {
    position: relative;
}

.photogallery-swiper {
    overflow: hidden;
    padding-bottom: 50px;
}

.photogallery-swiper .swiper-slide img {
    border-radius: 20px;
}

.photogallery-swiper .swiper-slide span {
    display: block;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
}

.addition-discount-wrap {
    position: relative;
    padding: 20px 0 0;
    border: 5px solid #D60000;
    border-radius: 20px
}

.addition-discount-wrap:before,
.addition-discount-wrap:after {
    content: '';
    background-image: url(image/additional-discount-left.png);
    position: absolute;
    width: 313px;
    height: 357px;
    top: -30px;
    left: -50px;
}

.addition-discount-wrap:after {
    background-image: url('image/additional-discount-right.png');
    width: 289px;
    height: 363px;
    left: auto;
    right: -50px;
}

.addition-discount-wrap h3 {
    font-size: 32px;
    text-align: center;
    text-transform: uppercase;
}

.addition-discount-wrap h3 span {
    color: #D60000;
}

.addition-discount-wrap p {
    margin-bottom: 40px;
}

.addition-discount-wrap .btn {
    display: block;
    max-width: 300px;
    margin: 0 auto -30px;
    box-shadow: 0 0 0 20px #fff;
}

.addition-discount-wrap .btn:hover {
    background-color: #ad0000;
    opacity: 1;
}

.text-block-1 {
    position: relative;
    padding: 30px 0 0;
}

.text-block-1 .container {
    display: flex;
    /* justify-content: flex-end; */
    justify-content: center;
    align-items: center;
}
@media (max-width:990px) {
    .text-block-1 .container {
        flex-direction: column;
        flex-wrap: wrap;
    }
    .text-block-info {
        max-width: 100%;
    }
}
@media (min-width: 990px) {
    .text-block-1 img {
        max-width: 50%;
    }
}
.text-block-1 img {
    /* position: absolute;
    top: 0;
    left: 0;
    width: 50%; */
    position: relative;
    object-fit: contain;
    display: block;
}

.text-block-info {
    /* max-width: 50%; */
    /* min-height: 29vw; */
    padding: 3% 5%;
}

.text-block-info h2 {
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    text-transform: uppercase;
}

.questions {
    background-color: #B31200;
}

.questions .consultation-info {
    color: #fff;
}

.questions .consultation-image {
    bottom: -82px;
}

.text-block-2 {
    padding: 80px 0 20px;
    position: relative;
    z-index: 2;
}

.text-block-2 h3 {
    text-transform: uppercase;
    font-size: 20px;
}

.text-block-white {
    display: flex;
    background-color: #fff;
    border-radius: 20px;
    overflow: hidden;
    margin: 40px 0;
}

.text-block-white div {
    padding: 2% 4%;
}

.container.secondary {
    margin: 80px auto;
}

.proch-stages-wrap {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-bottom: 70px;
        counter-reset: step;
}

.proch-stage {
    display: flex;
    flex-direction: column;
}

.proch-stage-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.proch-stage-top:before {
    content: counter(step);
    counter-increment: step;
    width: 36px;
    height: 36px;
    line-height: 36px;
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: #D60000;
    border-radius: 4px;
    text-align: center;
}

.proch-stage-top .arrow {
    flex: 0 0 80%;
    position: relative;
    width: 100%;
    height: 1.5px;
    background-color: #000;
}

.proch-stage-top .arrow:after {
    content: '';
    border-style: solid;
    border-width: 5px 0 5px 9px;
    position: absolute;
    right: -1px;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-44%);
    border-color: transparent transparent transparent transparent;
    border-left-color: #000;
}

.proch-stage:last-child .arrow {
    display: none;
}

.proch-stage:last-child .proch-stage-top:before {
    content: '';
    background: #269600 url(image/icon-check.svg) no-repeat center;
}

.proch-stage-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 15px 0;
    padding: 19px 20px;
    background-color: #fff;
    border-radius: 10px;
    font-weight: 600;
}

.proch-stage-title .icon {
    flex: 0 0 17%;
    text-align: right;
}

.proch-stage-text {
    font-size: 15px;
}

/* CONTACTS PAGE */

.contacts {
    display: flex;
    justify-content: space-between;
    gap: 12%;
    padding: 80px 0;
}
.contacts h1 {
    font-size: 44px;
    font-weight: 700;
    line-height: 120%;
    text-transform: uppercase;
    margin: 0;
}
.contacts-form {
    background-color: #F4F4F4;
}
.contacts-info {
    flex: 0 0 20%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.contacts-info p {
    font-size: 18px;
    line-height: 140%;
    margin: 25px 0;
}
.contacts-info .tel {
    font-weight: 700;
    font-size: 28px;
}
.contacts-form {
    flex: 1 1 75%;
}
.contacts-form-head,
.contacts-form-bot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0;
}
.contacts-form-head .faq-form-title {
    margin: 0;
}
.contacts-form-head p {
    font-size: 12px;
    max-width: 220px;
    text-align: right;
    position: relative;
    line-height: 20px;
    padding-right: 54px;
}
.contacts-form-head p:after {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    top: 0;
    right: 0;
    background: url(image/icon-info.svg) no-repeat center #269600;
    background-size: 8px;
    border-radius: 10px;
}
.contacts-form-mid {
    display: grid;
    grid-template-areas:
        "input-name textarea"
        "input-tel textarea"
        "input-email textarea";
    gap: 20px;
}
.contacts-form-mid .input-name {
    grid-area: input-name;
}
.contacts-form-mid .input-tel {
    grid-area: input-tel;
}.contacts-form-mid .input-email {
    grid-area: input-email;
}
.contacts-form-mid .faq-form-textarea {
    grid-area: textarea;
}
.contacts-form .btn-primary {
    max-width: 50%;
}
.contacts-map {
    overflow: hidden;
    border-radius: 20px;
    margin-bottom: 80px;
}
.secondary .tab {
    margin-bottom: 60px;
}
.secondary .tab > input[type="radio"]:checked + label {
    background-color: #F4F4F4;
}
.secondary .tab-content {
    background-color: #F4F4F4;
}

/* REVIEWS */
.reviews-block {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 80px;
}
.reviews-block .review-card {
    max-width: 1200px;
    border: 1px solid #ddd;
}
.reviews-imgs {
}

/* VACANCYS */
.vacancys-block {
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(3, 1fr);
}
.vacancy-card {
    border: 1px solid #ddd;
    background-color: #FFFFFF;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.05);
    height: 100%;
}
.vacancy-card h2 {
    font-size: 30px;
}



/* ABOUT */

.about-title {
    font-weight: 700;
    font-size: 44px;
    text-align: center;
    text-transform: uppercase;
}

.about-title span {
    color: #D60000;
}

.we-work-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-bottom: 70px;
    border-bottom: 1px solid #DCDCDC;
}

.obj-card {
    position: relative;
    border: 1px solid #DCDCDC;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
}

.obj-card-content {
    text-align: center;
    padding: 20px 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.obj-card-content h3, .obj-card-content p {
    margin: 0;
}

.obj-card-content p {
    margin-top: 10px;
}

.machines-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 70px 30px;
    padding: 50px 0 70px;
}

.machine-card {
    position: relative;
    background-color: #F4F4F4;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 180px 55px 30px;
}

.machine-card img {
    position: absolute;
    max-width: 360px;
    max-height: 197px;
    object-fit: cover;
    top: -50px;
    border-radius: 20px;
}

.machine-card h3 {
    margin: 0;
}


/* SERVICE */


  
@media (max-width: 1449px) {
    .ourserv-card-list {
        margin-right: 11%;
    }
    .consultation {
        padding: 70px 0;
    }
    .consultation-phone {
        font-size: 24px;
    }
    .consultation-image {
        right: -2%;
    }
}

@media (max-width: 1349px) {
    .logo-img {
        width: 200px;
    }
    .ourserv-card-list {
        margin-right: 1%;
    }
    .hero .swiper-slide {
        min-height: 385px;
    }
    .service-card-content {
        padding: 20px 10px;
    }
    .consultation .container {
        gap: 20px
    }
    .consultation-image {
        right: -5%;
    }
    .consultation-card-contact {
        gap: 15px;
    }
    .consultation-phone {
        font-size: 22px;
    }
    .call-request-content {
        padding: 40px 60px 40px 0;
    }
    .call-request-image-wrapper {
        width: 486px;
    }
    .call-request-title {
        font-size: 22px;
    }
    .team-info-badge .text {
        padding: 0px 20px;
        font-size: 16px;
    }
    .footer-main-nav li {
        padding: 0 12px;
    }
    .footer-middle {
        gap: 5%;
    }
}

@media (max-width: 1199px) {
    .container {
        max-width: 970px;
    }
    .actions-header-button:first-child {
        display: none;
    }
    .hero .swiper-slide {
        min-height: 340px;
        padding: 0 20px;
    }
    .swiper-title {
        font-size: 42px;
    }
    .home-intro p {
        font-size: 20px;
    }
    .home-intro p br {
        display: none;
    }
    .why-us .container {
        gap: 40px;
    }
    .why-us-info {
        flex: 1 1 70%;
        max-width: 70%;
        padding-top: 0;
    }
    .why-us-features-list {
        gap: 20px;
    }
    .why-us-feature-item {
        padding-bottom: 20px;
    }
    .popular-services-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
    .our-services-grid {
        gap: 20px;
    }
    .ourserv-card {
        padding: 20px 20px 30px;
    }
    .consultation .container {
        flex-wrap: wrap;
    }
    .consultation-info {
        flex: 0 0 77%;
        max-width: 77%;
    }
    .consultation-card::before {
        display: none;
    }
    .consultation-card-wrap {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .benefits-promo-title {
        height: auto;
        font-size: 20px;
    }
    .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .benefits-ratings {
        align-items: flex-start;
        justify-content: space-between;
    }
    .benefits-ratings-title {
        font-size: 26px;
    }
    .benefits-ratings-cards {
        max-width: 70%;
        flex-wrap: wrap;
    }
    .rating-card {
        flex: 0 0 100%;
    }
    .call-request-content {
        padding: 40px 30px 40px 0;
    }
    .call-request-title {
        font-size: 20px;
    }
    .call-request-form {
        flex-wrap: wrap;
    }
    .call-request-tabs {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 50px;
    }
    .guarantee-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .quiz-manager-photo {
        width: 80px;
        height: 80px;
    }
    .team-header .section-title {
        flex: 0 0 35%;
        font-size: 30px;
    }
    .team-info-badge .text {
        display: inline-block;
        vertical-align: text-bottom;
        padding: 3% 0;
    }
    .reviews-swiper .swiper-slide .review-img {
        align-self: flex-start;
    }
    .faq-form-card {
        flex: 0 0 45%;
        padding: 20px 30px;
    }
    .faq-form-title {
        font-size: 26px;
    }
    .footer-top {
        flex-wrap: wrap;
    }
    .footer-main-nav {
        order: 4;
        margin: 30px auto 0;
    }
    .footer-middle {
        gap: 2%;
    }
    .footer-social-icons a {
        width: 60px;
        height: 46px;
    }
}

@media (max-width: 991px) {
    .container {
        max-width: 750px;
    }
    .section-title {
        font-size: 26px;
        margin-bottom: 25px;
    }
    .head-top .top-menu {
        padding: 0;
    }
    .head-top .top-menu li {
        padding: 0 7px;
    }
    .search-form-input {
        padding: 11px 13px;
    }
    .search-form-button {
        padding: 12px;
    }
    .actions-header-button {
        padding: 10px 15px;
    }
    .contacts-header {
        gap: 0 10px;
    }
    .contacts-header-socials {
        gap: 5px;
    }
    .contacts-header-social-link {
        width: 36px;
        height: 36px;
    }
    .contacts-header-social-link img {
        width: 16px;
    }
    .contacts-header-social-link.whatsapp span {
        display: none;
    }
    .main-menu {
        padding: 15px 0;
    }
    .main-menu li a {
        font-size: 13px;
        font-weight: 600;
    }
    .menu-item-has-children > a:after {
        width: 6px;
        height: 6px;
        right: -30px;
    }
    .hero .swiper-slide {
        min-height: 280px;
    }
    .swiper-title {
        font-size: 34px;
    }
    .swiper-subtitle {
        font-size: 16px;
        padding-left: 35px;
    }
    .swiper-subtitle:before {
        margin-top: 0;
    }
    .home-intro p {
        font-size: 17px;
    }
    .why-us .container {
        flex-wrap: wrap;
    }
    .why-us-info {
        flex: 1 1 100%;
        max-width: 100%;
        padding-top: 0;
    }
    .popular-services-grid,
    .our-services-grid {
        gap: 15px;
    }
    .service-card-title {
        font-size: 16px;
    }
    .our-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .consultation {
        padding: 50px 0;
    }
    .consultation-image {
        width: 278px;
        bottom: -55px;
        right: -8%;
    }
    .other-services-wrap {
        gap: 3%;
    }
    .other-service {
        padding: 20px;
    }
    .other-service-image {
        height: auto;
    }
    .other-service-title {
        font-size: 17px;
    }
    .other-service-content .btn {
        width: 45px;
        height: 45px;
        min-width: 45px;
        min-height: 45px;
    }
    .tab-content-wrap {
        gap: 0 5%;
    }
    .price-line-price {
        font-size: 16px;
    }
    .why-about .container {
        flex-wrap: wrap;
    }
    .why-about .container:before {
        display: none;
    }
    .why-about .why-us-info, .why-about .about-info {
        flex: 1 1 100%;
        max-width: 100%;
        padding-top: 0;
    }
    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .call-request-content {
        padding: 40px;
    }
    .call-request-image-wrapper {
        display: none;
    }
    .guarantee-grid {
        gap: 70px 30px;
    }
    .quiz-block {
        flex-wrap: wrap;
    }
    .quiz-form-card {
        order: 3;
    }
    .quiz-info-card {
        flex: 0 0 100%;
        order: 1;
    }
    .quiz-manager-photo,
    .quiz-manager-name,
    .quiz-manager-title {
        display: none;
    }
    .quiz-contacts {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .quiz-phone,
    .quiz-worktime {
        margin: 0;
    }
    .team-header {
        flex-wrap: wrap;
    }
    .team-header .section-title {
        flex: 0 0 100%;
        margin-bottom: 10px;
    }
    .team-header .section-title br {
        display: none;
    }
    .team-info-badge .text {
        padding: 2% 0;
    }
    .reviews-swiper .swiper-slide .review-img {
        display: none;
    }
    .faq-content {
        flex-wrap: wrap;
    }
    .faq-form-card {
        flex: 0 0 100%;
        padding: 0 30px 15px;
        margin-top: 30px;
    }
    .footer-middle {
        grid-template-columns: repeat(2, 1fr);
    }
    .stages-wrap {
        grid-template-columns: repeat(2, 1fr);
        padding: 10px 0;
    }
    .stages-item {
        margin-bottom: 30px;
    }
}

@media (max-width: 990px) {
    .container {
        max-width: 540px;
    }
    /* ГЛАВНОЕ МЕНЮ */
    .main-menu-container {
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: #ebebeb;
        overflow: hidden;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 98;
    }
    .main-menu-container {
        max-height: 0;
        transition: max-height .5s ease-out;
    }
    .main-menu {
        display: flex;
        flex-direction: column;
        max-width: 360px;
        width: 90%;
        margin: 0 auto;
        padding: 80px 0 40px; /* отступ сверху под хедер + снизу для удобства */
        background-color: transparent;
    }
    .main-menu li {
        height: auto;
        border: 0;
        padding: 6px 0;
    }
    .main-menu li a {
        display: block;
        padding: 3px 0px;
        color: #000;
    }
    .menu-item-has-children > a:after {
        border-top: 2px solid #000;
        border-right: 2px solid #000;
    }
    .head-top {
        display: none;
    }

    
    /* Menu Icon */
    .hamb{
        display: flex;
        position: relative;
        align-items: center;
        cursor: pointer;
        z-index: 99;
    }/* Style label tag */
     
    .hamb-line {
        background: #777;
        display: block;
        height: 2px;
        position: relative;
        width: 24px;
     
    } /* Style span tag */
    .hamb-line::before,
    .hamb-line::after{
        background: #777;
        content: '';
        display: block;
        height: 100%;
        position: absolute;
        transition: all .2s ease-out;
        width: 100%;
    }
    .hamb-line::before{
        top: 5px;
    }
    .hamb-line::after{
        top: -5px;
    }
    /* Toggle menu icon */
    .side-menu:checked ~ main-menu-container {
        max-height: 100%;
    }
    .side-menu:checked ~ .hamb .hamb-line {
        background: transparent;
    }
    .side-menu:checked ~ .hamb .hamb-line::before {
        transform: rotate(-45deg);
        top:0;
    }
    .side-menu:checked ~ .hamb .hamb-line::after {
        transform: rotate(45deg);
        top:0;
    }
    
    header:has(.side-menu:checked) .main-menu-container {
        max-height: 100%;
        overflow-y: auto; /* прокрутка при раскрытых длинных сабменю */
    }
    
    body:has(.side-menu:checked) {
      overflow: hidden;
    }
    /* Скрываем CSS-стрелку на мобильных — используем кнопку-тогглер */
    .main-menu .menu-item-has-children > a:after {
        display: none !important;
    }

    /* Кнопка-тогглер: отдельный элемент рядом с ссылкой */
    .submenu-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
    }
    .submenu-toggle::after {
        content: '';
        display: block;
        width: 8px;
        height: 8px;
        border-top: 2px solid #444;
        border-right: 2px solid #444;
        rotate: 135deg; /* ↓ вниз */
        transition: rotate .2s ease;
        margin-top: -3px; /* оптическая коррекция */
    }
    /* Стрелка вверх при открытом пункте */
    .menu-item-has-children.open > .submenu-toggle::after {
        rotate: -45deg; /* ↑ вверх */
        margin-top: 3px;
    }

    /* li с детьми: flex-строка [ссылка | кнопка] */
    .main-menu li.menu-item-has-children {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        padding: 0;
    }
    .main-menu li.menu-item-has-children > a {
        flex: 1;
        padding: 3px 0 !important;
        display: block !important;
        justify-content: flex-start !important;
    }
    /* Сабменю — всю ширину строки */
    .main-menu li.menu-item-has-children > .sub-menu {
        flex: 0 0 100%;
    }
    /* Сабменю на мобильных — статичный поток, скрыто по умолчанию */
    .main-menu .sub-menu {
        position: static !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        display: none !important;
        max-width: 100% !important;
        width: 100% !important;
        box-shadow: none !important;
        background: rgba(0, 0, 0, 0.06) !important;
        border-radius: 6px !important;
        margin-top: 6px !important;
        padding: 10px 15px !important;
        transition: none !important;
        min-width: 0 !important;
    }
    /* Показываем при .open — ховер-правила удалены (перебивали по специфичности) */
    .main-menu .menu-item-has-children.open > .sub-menu {
        display: flex !important;
        flex-direction: column !important;
    }
    .main-menu .sub-menu li {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .main-menu .sub-menu a {
        text-transform: none;
        color: #222;
        padding-left: 0;
    }
    /* КОНЕЦ ГЛАВНОЕ МЕНЮ */
    .topper-mobile {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 14px;
    }
    .topper-mobile .top-menu {
        display: flex;
        list-style: none;
        padding: 0;
    }
    .topper-mobile .top-menu .menu-item {
        padding: 0 5px;
    }
    .head-mid .container {
        flex-wrap: wrap;
        padding-top: 10px;
    }
    .logo {
        order: 5;
    }
    .logo-img {
        width: 100%;
        max-width: 200px;
    }
    .contacts-header {
        order: 7;
    }
    .search-form {
        flex: 0 0 87%;
        font-size: 10px;
        text-align: left;
    }
    .search-form-button {
        padding: 10px;
    }
    .actions-header {
        flex: 0 0 0%;
    }
    .hero .swiper-slide {
        flex-wrap: wrap;
    }
    .swiper-content {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: center;
        align-items: center;
        text-align: center;
        margin: 30px auto 10px;
    }
    .swiper-image {
        display: flex;
        flex: 0 0 75%;
        margin: 0 auto;
    }
    .home-intro .container {
        flex-wrap: wrap;
        text-align: center;
    }
    .home-intro img {
        width: 100%;
        max-width: 240px;
        margin: 0 auto 20px;
        padding: 0;
    }
    .popular-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .service-card-image {
        height: 136px;
    }
    .consultation-image {
        display: none;
    }
    .consultation-card {
        padding: 30px 25px;
    }
    .benefits-promo-content {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    .benefits-grid {
        gap: 20px;
    }
    .benefit-card {
        padding: 15px;
    }
    .benefit-card-title {
        font-size: 16px;
    }
    .benefits-ratings {
        flex-wrap: wrap;
    }
    .benefits-ratings-title br {
        display: none;
    }
    .benefits-ratings-arrow {
        float: right;
        margin: 14px 0 0 10px;
        rotate: 90deg;
    }
    .benefits-ratings-cards {
        max-width: 100%;
    }
    .guarantee-grid {
        gap: 70px 20px;
    }
    .guarantee-card-title {
        padding: 0 10px;
    }
    .team-header .section-title {
        font-size: 26px;
    }
    .footer-logo img {
        max-width: 188px;
    }
    .footer-contact-info {
        gap: 10px;
    }
    .footer-contact-socials {
        gap: 10px;
    }
    .footer-phone {
        font-size: 20px;
    }
    .footer-main-nav {
        padding: 0;
    }
    .footer-main-nav li {
        padding: 0 7px;
    }
    .footer-contact-socials a {
        padding: 9px;
    }
    .footer-contact-socials a img {
        width: 16px;
        height: 16px;
    }
    .footer-main-nav a {
        font-size: 13px;
    }
}

@media (max-width: 576px) {
    h1 {
        font-size: 38px;
    }
    h2 {
        font-size: 31px;
    }
    .btn-secondary {
        width: auto;
        max-width: 160px;
    }
    .contacts-header-social-link.whatsapp span {
        display: none;
    }
    .swiper-title {
        font-size: 28px;
    }
    .our-services-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .consultation-info {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .consultation-card {
        text-align: center;
    }
    .consultation-card-contact {
        flex-direction: column;
    }
    .consultation-phone-block {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .benefits-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .gallery-grid {
        gap: 15px;
    }
    .gallery-card-title {
        margin-top: 0;
        font-size: 16px;
    }
    .call-request-title {
        font-size: 17px;
    }
    .call-request-button {
        min-width: auto;
        height: auto;
        font-size: 16px;
    }
    .call-request-tabs {
        gap: 20px;
    }
    .guarantee-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .quiz-form-card {
        padding: 40px 30px 20px;
    }
    .quiz-options {
        gap: 10px;
    }
    .quiz-contacts {
        display: block;
    }
    .quiz-worktime {
        padding-bottom: 15px;
    }
    .quiz-option-content span {
        font-size: 14px;
    }
    .stages-item {
        padding: 0 10px 5px;
    }
    .addition-discount-wrap:before, .addition-discount-wrap:after {
        left: -65%;
    }
    .addition-discount-wrap:after {
        left: auto;
        right: -60%;
    }
    .text-block-1 .container {
        flex-wrap: wrap;
    }
    .text-block-1 img {
        width: 100%;
        position: relative;
    }
    .text-block-info {
        max-width: 100%;
    }
    .tab > label {
        font-size: 12px;
        border-radius: 10px;
        padding: 7px;
        margin: 5px;
    }
    .tab-content-wrap {
        grid-template-columns: repeat(1, 1fr);
        gap: 0;
    }
    .tab-content-wrap:before {
        display: none;
    }
    .tab-content {
        border-radius: 10px;
        padding: 15px;
    }
    .price-line-price {
        flex: 0 0 120px;
    }
    .we-work-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .obj-card-content {
        padding: 15px;
    }
    .machines-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .vacancys-block {
        grid-template-columns: repeat(1, 1fr);
    }
    .reviews-imgs {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .reviews-imgs img {
        margin-bottom: 10px;
    }
    .contacts {
        flex-wrap: wrap;
    }
    .contacts-form-head, .contacts-form-bot {
        flex-direction: column;
    }
    .contacts-form-mid {
        display: block;
    }
    .faq-form-input {
        margin-bottom: 10px;
    }
    .proch-stages-wrap {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .other-service {
        padding: 7px 7px 15px;
    }
    .other-service-image {
        margin-bottom: 10px;
    }
    .other-service-title {
        font-size: 14px;
    }
    .hero.service .swiper-title {
        font-size: 28px;
    }
}

@media (max-width: 470px) {
    .section-title {
        font-size: 24px;
    }
    .why-us-title {
        font-size: 24px;
    }
    .head-mid .container {
        align-items: center;
        justify-content: center;
    }
    .logo {
        padding: 10px 0;
    }
    .contacts-header {
        gap: 0 25px;
    }
    .why-us-feature-item {
        font-size: 15px;
    }
    .consultation {
        padding-top: 0;
    }
    .consultation-title {
        font-size: 26px;
    }
    .popular-services-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .rating-card-main-info {
        padding: 20px 0 20px 15px;
    }
    .rating-card-logo {
        width: 52px;
        height: 52px;
    }
    .rating-card-name {
        font-size: 20px;
    }
    .rating-card-score-block {
        width: 80px;
        padding: 20px 10px;
    }
    .rating-card-score {
        font-size: 28px;
    }
    .swiper-pagination-bullet {
        width: 36px;
    }
    .gallery-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .call-request {
        padding-top: 0;
    }
    .call-request-title {
        font-size: 16px;
    }
    .call-request-content {
        padding: 30px 25px;
    }
    .call-request-tabs {
        grid-template-columns: repeat(1, 1fr);
    }
    .quiz-options {
        flex-wrap: wrap;
    }
    .team-info-badge .text {
        font-size: 14px;
    }
    .team-info-badge .icon {
        min-width: 28px;
        background-size: 10px;
    }
    .review-card-author {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .review-card-source {
        text-align: center;
    }
    .review-card-name {
        flex: 0 0 70%;
    }
    .faq-description {
        font-size: 15px;
    }
    .faq-item-header {
        padding: 20px 25px;
    }
    .faq-item-title {
        font-size: 15px;
    }
    .faq-form-title {
        font-size: 18px;
    }
    .faq-form-subtitle {
        font-size: 16px;
    }
    .faq-form-card {
        padding: 15px 20px;
    }
    .footer-top {
        justify-content: center;
        gap: 25px;
        flex-wrap: wrap;
    }
    .footer-main-nav {
        flex-wrap: wrap;
        justify-content: center;
        margin: 0;
    }
    .footer-main-nav li {
        border: 0;
        padding: 5px 10px;
    }
    .footer-middle {
        gap: 1%;
        grid-template-columns: repeat(1, 1fr);
    }
    .footer-socials-left {
        display: block;
    }
    .footer-socials-left h4 {
        margin-bottom: 20px;
    }
}

.popup {
    display: none;
    position: fixed;
    overflow-y: auto;
    z-index: 105;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    top: 0;
    left: 0;
    display: none;
}

.popup:has(.show) {
    display: block;
}

.popup .popup-inner {
    display: none;
    position: relative;
    max-width: 520px;
    height: auto;
    background: #F4F4F4;
    color: #000;
    padding: 30px;
    margin: 5% auto 0 auto;
    border-radius: 7px;
    z-index: 70;
}

.popup #select-city.popup-inner {
    padding: 30px 10px 30px 30px;
}

.popup .close {
    display: block;
    cursor: pointer;
    float: right;
    margin-right: 25px;
    font-size: 32px;
    line-height: 32px;
    opacity: 1;
}

.popup .close:before {
    content: "x";
    color: #999;
    opacity: 1;
    font-weight: 300;
    transition: 0.2s;
}

.popup .close:hover:before {
    color: #ed1c24;
}

.popup h3 {
    color: #000;
    font-weight: 300;
}

.popup .show {
    display: block;
}

.cities {
    display: flex;
    flex-wrap: wrap;
}

.cities a {
    flex: 0 0 33.3%;
    padding: 5px 0;
    font-size: 15px;
}

.overlay {
    display: none;
    position: fixed;
    z-index: 55;
    opacity: 0.7;
    filter: alpha(opacity=50);
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: #000;
    text-align: center;
}

.whatsapp-float-btn {
    background: #25D366;
    border: 3px solid #1cc15a;
    border-radius: 50%;
    box-shadow: 0 8px 10px rgba(7, 206, 112, 0.6);
    cursor: pointer;
    height: 68px; 
    text-align: center;
    width: 68px;
    position: fixed;
    z-index: 9999;
    transition: .3s;
}
a#whatsapp-float-btn {
    background-color: #25D366;
}
.puls {
    display: block;
    animation: hoverWave linear 1s infinite;
    -webkit-animation: hoverWave linear 1s infinite;
}


.cbp-left-bottom {
    left: 5%;
    bottom: 8%;
}
.cbp-right-bottom {
    right: 5%;
    bottom: 8%;
}

.whatsapp-float-btn .cbp-text-button {
    height:68px;
    width:68px;
    border-radius:50%;
    position:relative;
    overflow:hidden;
}
.whatsapp-float-btn .cbp-text-button span {
    text-align: center;
    color:#fff;
    opacity: 0;
    font-size: 0;
    position:absolute;
    right: 5px;
    top: 18px;
    line-height: 14px;
    font-weight: 600;
    transition: opacity .3s linear;
}

.whatsapp-float-btn .cbp-text-button:hover span {
    opacity: 1;
    font-size: 10px;
}
.whatsapp-float-btn:hover img {
    display:none;
}
.whatsapp-float-btn:hover {
    z-index:1;
    background:#fff;
    color:transparent;
    transition:.3s;
}

.whatsapp-float-btn img {
    width: 40px;
    margin-left: -4px; 
    margin-top: 8px; 
    filter: brightness(0) invert(1);
    color:#fff;
    font-size:44px;
    transition:.3s;
    line-height: 66px;transition: .5s ease-in-out;
    animation: 1200ms ease 0s normal none 1 running amin;
    animation-iteration-count: infinite;
    -webkit-animation: 1200ms ease 0s normal none 1 running amin;
    -webkit-animation-iteration-count: infinite;
    display: initial;
        
}

@-webkit-keyframes hoverWave {
    0% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 0 rgba(7,206,112,0.2),0 0 0 0 rgba(7,206,112,0.2)
    }
    40% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 15px rgba(7,206,112,0.2),0 0 0 0 rgba(7,206,112,0.2)
    }
    80% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 30px rgba(7,206,112,0),0 0 0 26.7px rgba(7,206,112,0.067)
    }
    100% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 30px rgba(7,206,112,0),0 0 0 40px rgba(7,206,112,0.0)
    }
}
@keyframes hoverWave {
    0% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 0 rgba(7,206,112,0.2),0 0 0 0 rgba(7,206,112,0.2)
    }
    40% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 15px rgba(7,206,112,0.2),0 0 0 0 rgba(7,206,112,0.2)
    }
    80% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 30px rgba(7,206,112,0),0 0 0 26.7px rgba(7,206,112,0.067)
    }
    100% {
            box-shadow:0 8px 10px rgba(7,206,112,0.3),0 0 0 30px rgba(7,206,112,0),0 0 0 40px rgba(7,206,112,0.0)
    }
}
@-webkit-keyframes hoverWave2 {
    0% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 0 rgba(7,160,206,0.2),0 0 0 0 rgba(7,160,206,0.2)
    }
    40% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 15px rgba(7,160,206,0.2),0 0 0 0 rgba(7,160,206,0.2)
    }
    80% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 30px rgba(7,160,206,0),0 0 0 26.7px rgba(7,160,206,0.067)
    }
    100% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 30px rgba(7,160,206,0),0 0 0 40px rgba(7,160,206,0.0)
    }
}
@keyframes hoverWave2 {
    0% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 0 rgba(7,160,206,0.2),0 0 0 0 rgba(7,160,206,0.2)
    }
    40% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 15px rgba(7,160,206,0.2),0 0 0 0 rgba(7,160,206,0.2)
    }
    80% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 30px rgba(7,160,206,0),0 0 0 26.7px rgba(7,160,206,0.067)
    }
    100% {
            box-shadow:0 8px 10px rgba(7,160,206,0.3),0 0 0 30px rgba(7,160,206,0),0 0 0 40px rgba(7,160,206,0.0)
    }
}
@keyframes amin {
    0% {
        transform: rotateZ(0deg);
            -ms-transform: rotateZ(0deg);
            -webkit-transform: rotateZ(0deg);
    }
    10% {
        transform: rotateZ(-30deg);
            -ms-transform: rotateZ(-30deg);
            -webkit-transform: rotateZ(-30deg);
    }
    20% {
        transform: rotateZ(15deg);
            -ms-transform: rotateZ(15deg);
            -webkit-transform: rotateZ(15deg);
    }
    30% {
        transform: rotateZ(-10deg);
            -ms-transform: rotateZ(-10deg);
            -webkit-transform: rotateZ(-10deg);
    }
    40% {
        transform: rotateZ(7.5deg);
            -ms-transform: rotateZ(7.5deg);
            -webkit-transform: rotateZ(7.5deg);
    }
    50% {
        transform: rotateZ(-6deg);
            -ms-transform: rotateZ(-6deg);
            -webkit-transform: rotateZ(-6deg);
    }
    60% {
        transform: rotateZ(5deg);
            -ms-transform: rotateZ(5deg);
            -webkit-transform: rotateZ(5deg);
    }
    70% {
        transform: rotateZ(-4.28571deg);
            -ms-transform: rotateZ(-4.28571deg);
            -webkit-transform: rotateZ(-4.28571deg);
    }
    80% {
        transform: rotateZ(3.75deg);
            -ms-transform: rotateZ(3.75deg);
            -webkit-transform: rotateZ(3.75deg);
    }
    90% {
        transform: rotateZ(-3.33333deg);
            -ms-transform: rotateZ(-3.33333deg);
            -webkit-transform: rotateZ(-3.33333deg);
    }
    100% {
        transform: rotateZ(0deg);
            -ms-transform: rotateZ(0deg);
            -webkit-transform: rotateZ(0deg);
    }
}
@-webkit-keyframes amin {
    0% {
        transform: rotateZ(0deg);
            -ms-transform: rotateZ(0deg);
            -webkit-transform: rotateZ(0deg);
    }
    10% {
        transform: rotateZ(-30deg);
            -ms-transform: rotateZ(-30deg);
            -webkit-transform: rotateZ(-30deg);
    }
    20% {
        transform: rotateZ(15deg);
            -ms-transform: rotateZ(15deg);
            -webkit-transform: rotateZ(15deg);
    }
    30% {
        transform: rotateZ(-10deg);
            -ms-transform: rotateZ(-10deg);
            -webkit-transform: rotateZ(-10deg);
    }
    40% {
        transform: rotateZ(7.5deg);
            -ms-transform: rotateZ(7.5deg);
            -webkit-transform: rotateZ(7.5deg);
    }
    50% {
        transform: rotateZ(-6deg);
            -ms-transform: rotateZ(-6deg);
            -webkit-transform: rotateZ(-6deg);
    }
    60% {
        transform: rotateZ(5deg);
            -ms-transform: rotateZ(5deg);
            -webkit-transform: rotateZ(5deg);
    }
    70% {
        transform: rotateZ(-4.28571deg);
            -ms-transform: rotateZ(-4.28571deg);
            -webkit-transform: rotateZ(-4.28571deg);
    }
    80% {
        transform: rotateZ(3.75deg);
            -ms-transform: rotateZ(3.75deg);
            -webkit-transform: rotateZ(3.75deg);
    }
    90% {
        transform: rotateZ(-3.33333deg);
            -ms-transform: rotateZ(-3.33333deg);
            -webkit-transform: rotateZ(-3.33333deg);
    }
    100% {
        transform: rotateZ(0deg);
            -ms-transform: rotateZ(0deg);
            -webkit-transform: rotateZ(0deg);
    }
}
@media (max-width : 800px) {
    .cbp-left-bottom, .cbp-right-bottom {
        bottom: 5%;
    }
}
.footer-policy__links {
    display:flex;
    flex-direction: column;
}