body {
  margin: 0;
  padding: 0;
  font-family: "Montserrat";
  background-image: url('img/Rectangle\ 4.png'); 
  background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), url('img/Rectangle\ 4.png');

  background-repeat: no-repeat; /* Повторяем изображение */
  background-position: center; /* Центрируем изображение */
  background-size: cover; /* Сохраняем оригинальные размеры */
  background-attachment: fixed; /* Фиксируем фон */
}

.container {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  margin: 0 auto; /* Центрирование контейнера */
}


* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-touch-callout: default; /* Разрешает вызов контекстного меню */
  -webkit-user-select: text;     /* Разрешает выделение текста */
  -webkit-text-decoration: inherit; /* Оставляет автоформатирование */
}



.header {
  width: 100%; /* Шапка на всю ширину экрана */
}

.green-line {
  background: linear-gradient(180deg, rgba(242, 193, 102, 0.9) 0%, rgba(242, 193, 102, 0.81) 100%);

  height: 95px; /* Высота зеленой линии */
  display: flex;
  align-items: center;
}

.containernav {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 колонок */
  align-items: center; /* Центрирование элементов по вертикали */
  max-width: 1140px; /* Максимальная ширина */
  width: 100%;
  margin: 0 auto; /* Центрирование контейнера */
  gap: 2fr; /* Расстояние между элементами */
 
}

.logo {
  margin-left: 20px;
  grid-column: 1 / 1; /* Логотип занимает первую линию */
}

.nav {
  grid-column: 2 / 8; /* Ссылки с 2 по 7 линии */
  display: flex;
  justify-content: space-between; /* Равномерное распределение ссылок */
  text-align: center;
  margin-left: 50px;
}

.nav a {
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 700;
  line-height: 24.38px;
  text-decoration: none;
  color:#2C2C2C;
}

.nav a:hover {
  color:#1a1919;
}

.contact {
  grid-column: 9 / 13; /* Контакты с 10 по 12 линии */
  display: flex;
  align-items: center; /* Центрирование текста и изображения */
  justify-content: flex-end; /* Выровнять по правому краю */

}

.contact img {
  
  margin-right: 16px; /* Отступ между изображением и текстом */
}

.contact a {
  grid-column: 10 / 12;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 700;
  line-height: 24.38px;
  color:#2C2C2C;
  text-decoration: none;
margin-right: 25px;
}

.contact a:hover{
  color:#1a1919;
}




.nav a::after , .contact a::after {
  content: "";
  position: absolute;
  bottom: -4px; /* Расположение линии под текстом */
  left: 0;
  width: 0;
  height: 2px;
  background-color: #2C2C2C;
  transition: width 0.3s ease-in-out; /* Анимация появления линии */
}

.nav a:hover::after , .contact a:hover::after{
  width: 100%; /* Линия подчеркивания полностью растягивается */
}

.nav a::before, .contact a::before{
  position: absolute;
  bottom: -24px; /* Расположение текста под основным */
  left: 0;
  font-size: 14px; /* Размер текста под основным */
  color: rgba(211, 206, 206, 0); /* Прозрачный текст по умолчанию */
  white-space: nowrap; /* Отключение переноса текста */
  transition: color 0.3s ease-in-out; /* Плавное появление текста */
}

.nav a:hover::before , .contact a:hover::before{
  color: #2C2C2C; /* Текст становится видимым при наведении */
}

@keyframes fadeInFromTop {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.nav a,.contact a {
  animation: fadeInFromTop 0.5s ease-in-out forwards;
}

.nav a:nth-child(1) {
  animation-delay: 0.1s;
}

.nav a:nth-child(2) {
  animation-delay: 0.2s;
}

.nav a:nth-child(3) {
  animation-delay: 0.3s;
}

.nav a:nth-child(4) {
  animation-delay: 0.4s;
}









/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.mobile-menu {
  display: none;
}

.mobile-menu {
  display: none; /* По умолчанию скрыто */
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  align-items: center;
}

.burger {
  width: 25px;
  height: 3px;
  background-color: black;
}

.dropdown-menu {
  display: none; /* Скрыть меню по умолчанию */
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw; /* 100% ширины окна */
  height: 50vh; /* 100% высоты окна */
  background-color: #F2C166;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  transition: transform 0.3s ease;
  z-index: 1000;
}

.dropdown-menu.active {
  display: flex; /* Показать меню, когда оно активно */
}


.dropdown-menu a {
  padding: 10px 20px;
  text-decoration: none;
  color: black;
  font-weight: bold;
  font-size: 24px;
}

.close-menu-btn {
  display: flex;
  justify-content: center; /* Центрирует элементы по горизонтали */
  align-items: center; /* Центрирует элементы по вертикали */
  text-align: center;
  position: absolute;
  width: 30px;
  height: 30px;
  top: 25px;
  right: 40px;
  background: #66A4F2;
  border: none;
  font-size: 24px;
  cursor: pointer;
  padding: 10px;
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  color: white;
  font-weight: bold;
}





.wraperVrap {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 колонок */
 
  width: 100%;
  margin: 0 auto; /* Центрирование контейнера */
}





/*-----------------------------------------------------------------------------*/

.video-bg-mobile {
  display: none; /* Скрыто по умолчанию */
}
.video-placeholder {
  display: none; 
}

.videorpew {
  position: relative;
  padding: 0;
  margin: 0;
}

.video-bg {
  position: absolute;
  top: -120px;
  left: 0;
  width: 100%;
  height: 116.1%;
  object-fit: cover;
  z-index: -1; 
}

.contentVideos {
  display: grid;
  grid-template-columns: repeat(12, 1fr); 
  grid-template-rows: auto auto; 
  row-gap: 20px; 
  gap: 16px; 
  max-width: 1140px;
  height: 860px; 
  margin: 0 auto;
  padding: 20px 50px; 
  color: white;
  z-index: 1; 
}

.contentVideos h1 {
  grid-column: 1 / 13; 
  margin: 0;
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 700;
  margin-top: 100px;
}

.contentVideos p {
  grid-column: 1 / 13; 
  margin: 0;
  font-family: Montserrat;
  font-size: 31px;
  font-weight: 300;
  line-height: 1.4; 
}

.footnote {
  grid-column: 1 / -1;
  display: flex;
  grid-gap: 20px; /* отступы между элементами */
  padding: 20px 0;
  color: white;
}

.subtitle {
  min-width: 200px;
  display: flex;
  flex-direction: column;
}


.subtitle div {
  line-height: 45px;
  top: 30px;
  display: flex;
  vertical-align: text-top;
  font-size: 24px;
}


.subtitle div:nth-of-type(1) {
  font-weight: 200;
  font-size: 30px; /* Размер шрифта для второго <p> */
}

.subtitle div:nth-of-type(2) {
  color: #FFFFFF;
  font-size: 60px; /* Размер шрифта для второго <p> */
  font-weight: 900;
  line-height: 40px !important;
}

.subtitle div:nth-of-type(3) {
  font-size: 20px; /* Размер шрифта для второго <p> */
  font-weight: 200;
}


.zero {
  align-self: flex-start;
  font-size: 60px; /* Размер шрифта для второго <p> */
}


.lizing-container {
gap: 10px;
display: flex;
flex-direction: row;
}

.from {
  color: white;
  display: flex;
  align-self: start;
  line-height: 18px !important;
}















@keyframes slideInLeft {
  0% {
    transform: translateX(-100%); /* Элемент вне экрана слева */
    opacity: 0; /* Прозрачный */
  }
  100% {
    transform: translateX(0); /* На своем месте */
    opacity: 1; /* Полностью видимый */
  }
}

.contentVideos {
  animation: slideInLeft 1.5s ease-in-out; /* Анимация для всего блока */
  animation-fill-mode: forwards; /* Сохраняем конечное состояние */
}

.contentVideos h1 {
  animation: slideInLeft 1.5s ease-in-out;
  animation-delay: 0.2s; /* Задержка для заголовка */
  animation-fill-mode: forwards;
}

.contentVideos p {
  animation: slideInLeft 1.5s ease-in-out;
  animation-delay: 0.4s; /* Задержка для текста */
  animation-fill-mode: forwards;
}

.contentVideos .footnote .subtitle {
  animation: slideInLeft 1.5s ease-in-out;
  animation-delay: 0.6s; /* Задержка для подзаголовков */
  animation-fill-mode: forwards;
}
















/*////////////////////////////////////////////////////////////////////////////////////////////////////////*/



.green-background {
  background: linear-gradient(180deg, rgba(242, 193, 102, 0.9) 0%, rgba(242, 193, 102, 0.8) 100%);
  height: 274px; /* Высота фона */
  width: 100%; /* Фон на весь экран */
  display: flex;
  align-items: center; /* Центрирование по вертикали */
  justify-content: center; /* Центрирование по горизонтали */
  margin-top: 18px;
}


.block {
  display: flex;
  flex-direction: column;
  justify-content: center; /* Центрирование по вертикали */
}

.text-block {
  grid-column: 1 / 8; /* С 1 до 7 линии */
  text-align: left;
  color: white; /* Белый текст на зеленом фоне */
  line-height: 1;
}

.button-block {
  margin-top: 12px;
  grid-column: 9 / 13; /* С 9 до 12 линии */
  text-align: center; /* Центрирование текста и кнопки */
  color: white;
}





.text-block h1 {
  font-family: Montserrat;
font-size: 60px;
font-weight: 700;
color:  #000000;
}

.text-block p {
  font-family: Montserrat;
font-size: 60px;
font-weight: 200;
color:  #000000;
}



.btn {
  max-width: 347px;
  height: 60px;
  border-radius: 10px ;
  border: none;
  background-color: #048ABF;
  color:  #FFFFFF;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 900;
  line-height: 64px;
  text-align: center;
  cursor: pointer;

}

.button-block p {
font-family: Montserrat;
font-size: 18px;
font-weight: 300;
color:  #000000;
text-align: left;
line-height: 1.4;


}


.bty{
  margin-bottom: 10px;
}




/* Модальное окно - скрыто по умолчанию */
.modal_form_action {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  justify-content: center;
  align-items: center;
  z-index: 2000; /* Увеличенный z-index */
}


/* Активное модальное окно */
.modal_form_action.active {
  display: flex; /* Появляется при добавлении класса active */
}

.modal-content-form-action {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  max-width: 400px;
  width: 100%;
  text-align: center;
  position: relative;
}

.close-modal-btn-form-Action {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
}
/*///////////////////////////////////////////////////////////////////////////////////////////*/

.container {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: auto;
  gap: 16px;
  max-width: 1140px;
  width: 100%;
  padding: 20px;
  padding-left: 50px;
  padding-bottom: 5px;
}

.title{
  grid-column: 1 / 13;
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 900;
  margin-top: 78px;
  line-height: 1.7;

}

.description-box {
  max-width: 1064px;
  height: 194px;
  grid-column: 1 / 13; /* Занимает все 12 полос */
  background-color: #FFFFFF;
  padding: 16px;
  border-radius: 4px;
  margin-top: 9px;
  margin-left: -19px;
border-radius: 20px;
box-shadow: 6px 6px 4px 0px #F2870540;

}

.description {
  grid-column: 1 / 12; /* Текст занимает 11 полос */
  font-family: Montserrat;
font-size: 21px;
font-weight: 500;
line-height: 40px;


  
}
.descriptionBold{
  font-weight: 600;
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/


.wrapper-best {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  padding-left: 55px;
  margin-top: 30px;
}
.titleFive{
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  display: grid;
  grid-column: 1 / 11;
  padding-left: 55px;
  margin-top: 65px;
}

.titleFive h1 {
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 900;
}


.text {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.text h1{
  margin-top: 40px;
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 900;
  line-height: 51px;
  z-index: 2;
}

.text p{
  margin-top: 20px;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 400;
  line-height: 31px;
  z-index: 2;

} 

.point:nth-child(3) {
  margin-top: 120px; /* Задайте нужное значение */
}

.point:nth-child(4) {
  margin-top: 120px; /* Задайте нужное значение */
}




.point {
  grid-column: span 5; /* Каждый элемент занимает 5 колонок */
  
  max-width: 417px;
  


}

.point:nth-child(2n) {
  grid-column: 8 / span 5;
}

.point5 {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  padding-left: 55px;
  margin-top: 70px;
  position: relative; /* Устанавливает контекст для абсолютного позиционирования */
  overflow: visible;
}

.num {
  min-height: 100px;
  width: auto;
  background-color: #F2C166;
  position: relative; /* Устанавливает контекст для абсолютного позиционирования */
  overflow: visible;
  margin-bottom: 30px; /* Базовый отступ между .num и следующим элементом */
}



.num p:hover {
  animation: wiggle 0.5s ease forwards;
  cursor: pointer;
}

@keyframes wiggle {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-3deg);
  }
  50% {
    transform: rotate(3deg);
  }
  75% {
    transform: rotate(-2deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

.numFive:hover {
  animation: wiggle 0.5s ease forwards;
  cursor: pointer;
}

@keyframes wiggle {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-3deg);
  }
  50% {
    transform: rotate(3deg);
  }
  75% {
    transform: rotate(-2deg);
  }
  100% {
    transform: rotate(0deg);
  }
}






.num::after {
  content: "";
  display: block;
  height: 50px; /* Половина размера текста */
}

.num p {
  font-family: Noto Sans;
  font-size: 200px;
  font-weight: 900;
  line-height: 64px;
  text-decoration-skip-ink: none;
  position: absolute; /* Позволяет точно позиционировать элемент */
  right: 10px; /* Отступ от правого края */
  bottom: -40px; /* Смещение вниз */
  z-index: 1;
}



.formFive {
  display: grid;
  grid-column: 9 / 13; 
  
}

.bth5 {
  max-width: 347px;
  height: 60px;
  text-align: center;
  cursor: pointer;
}




.greenFive{
  background: linear-gradient(180deg, rgba(242, 193, 102, 0.9) 0%, rgba(242, 193, 102, 0.8) 100%);
  height: 262px; /* Высота фона */
  width: 100%; /* Фон на весь экран */
  display: flex;
  align-items: center; /* Центрирование по вертикали */
  justify-content: center; /* Центрирование по горизонтали */
  margin-top: 190px;
  }
  
  
.numFive{
  font-family: Noto Sans;
  font-size: 200px;
  font-weight: 900;
  line-height: 64px;
  text-decoration-skip-ink: none;
  position: absolute; /* Позволяет точно позиционировать элемент */
  right: 35px; /* Отступ от правого края */
  bottom: 270px;
 

}  


.textFive {
  display: grid;
  grid-column: 1 / 8; 
  margin: 0;
  padding-bottom: 50px;
}
.textFive p {
  font-family: Montserrat;
font-size: 32px;
font-weight: 200;
line-height: 40px;


}













/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

.conteinerModela {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  padding-left: 55px;
  margin-top: 30px;
}

.conteinerModela h1 {
  display: grid;
  grid-column: 1 / 4; 
  font-family: Montserrat;
  font-size: 50px;
  font-weight: 300;


}


.card {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 20px; /* Добавлен gap */
  border-radius: 20px;
  background: #f2f2f2;
  padding: 20px;
  margin-top: 10px;
  position: relative; /* Это позволяет позиционировать элементы относительно card */
}

.image-block, .table-block {
  margin-left: 15px;
  grid-column: span 6; /* Занимает 6 колонок */
}

.table-block {
  display: grid;
  flex-direction: column;
  justify-content: space-between; /* Разделяет содержимое равномерно */
  Width: 100%; /* Блок занимает всю высоту */
  margin-top: 60px;
}

.image-block {
  grid-column: span 6; /* Занимает 6 колонок грида */
  display: flex; /* Используем Flexbox внутри */
  flex-direction: column;
  justify-content: center; /* Центрируем по горизонтали внутри блока */
  align-items: center; /* Центрируем по вертикали внутри блока */
  height: 100%; /* Блок занимает всю высоту */
  box-sizing: border-box;
}



.table tr:nth-child(even) {
  background-color: #F9F9F9; /* Задаёт цвет фона для чётных строк */
}

.table td:first-child {
  font-weight: bold;
}

.zakaz {
  border-radius: 10px;
  width: 100%; /* Кнопка занимает всю ширину контейнера */
  height: 64px;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
  background: #048abf;
  border: none;
  outline: none;
  color: white;
  font-family: var(--font-family);
  font-weight: 900;
  font-size: 36px;
  line-height: 178%;
  text-align: center;
  cursor: pointer;
}

.zakaz:focus {
  outline: none; /* Убирает обводку при фокусе */
}

.slider-secondary {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Три колонки с равной шириной */
  gap: 20px; /* Промежуток между элементами */
  padding: 0 40px; /* Отступы слева и справа */
  margin-top: 30px; /* Вертикальный отступ */
  justify-content: center; /* Центрирует сетку внутри контейнера */
}

.slider-secondary img {
  border-radius: 20px;
  height: auto;
  width: 100%; /* Изображения занимают ширину родителя */
  box-shadow: 6px 6px 4px 0 rgba(242, 135, 5, 0.25); /* Тень для изображения */
  object-fit: cover; /* Масштабирование изображения */
}


.slider img {
  border-radius: 20px; /* Скругление углов */
  width: 530px; /* Ширина изображения */
  height: 418px; /* Высота изображения */
  box-shadow: 6px 6px 4px 0 rgba(242, 135, 5, 0.25); /* Тень */
  object-fit: cover; /* Масштабирует изображение, чтобы полностью заполнить элемент */
  object-position: center; /* Центрирует содержимое изображения */
}

.head-text {
  align-self: flex-start; /* Отключает выравнивание по центру и прижимает блок к левому краю родителя */
  text-align: left; /* Убедитесь, что текст внутри блока выравнивается по левому краю */
  width: 100%; /* Занимает всю ширину родителя для консистентного выравнивания */
  box-sizing: border-box;
}

.head-text h3 {
  font-family: var(--font-family);
  font-weight: 300;
  font-size: 30px;
  line-height: 180%;
}

.head-text h1 {
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 59px;
  margin-bottom: 15px;
  
}

.price-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: auto; /* Отодвигает блок к нижнему краю родителя */
  width: 100%; /* Кнопка занимает ширину */
  padding-top: 20px; /* Убираем отступ */
}


.table {
  display: table; /* Сохраняем семантическую таблицу */
  width: 100%; /* Занимает всю доступную ширину */
  border-collapse: collapse; /* Убираем зазоры между ячейками */
  font-family: 'Montserrat', sans-serif;
  margin-top: 20px;
}

.table tr {
  display: grid; /* Используем Grid внутри строки */
  grid-template-columns: 2fr 1fr; /* Первая колонка 2/3, вторая 1/3 */
  width: 100%; /* Занимает всю ширину */
  border-bottom: 1px solid #048ABF; /* Добавляем нижнюю границу для строки */
}

.table tr:last-child {
  border-bottom: none; /* Убираем нижнюю границу у последней строки */
}

.table td {
  border: none; /* Убираем стандартные границы ячеек */
  padding: 10px;
  height: 53px; /* Фиксированная высота ячеек */
  box-sizing: border-box; /* Учитываем padding в высоте */
}

.table td:first-child {
  display: flex;
  justify-content: flex-start; /* Горизонтальное выравнивание по левому краю */
  align-items: center; /* Вертикальное выравнивание по центру */
  text-align: left;
  white-space: normal; /* Позволяет перенос текста */
  word-wrap: break-word; /* Разбивает длинные строки */
}

.table td:last-child {
  display: flex;
  justify-content: center; /* Горизонтальное центрирование */
  align-items: center; /* Вертикальное центрирование */
  text-align: center; /* Текст ровно по центру */
}

.warranity {
  display: flex; /* Включаем Flexbox */
  justify-content: center; /* Горизонтальное центрирование */
  align-items: center; /* Вертикальное центрирование */
  width: 100%; /* Занимает всю ширину родителя */
  height: 46px;
  background-color: #048ABF; /* Опционально: выделение фона */
  border-radius: 20px;
  padding: 10px; /* Отступы внутри блока */
  box-sizing: border-box; /* Учитываем отступы в ширине */
  text-align: center; /* Центрируем текст */
  margin-top: 15px;
}

.warranity p {
  font-family: var(--font-family);
  font-weight: 900;
  font-size: 20px;
  line-height: 150%;
  color: #fff;
}

.warranity p span{
  font-weight: 300;
  font-size: 20px;
}

.old-price {
  font-family: var(--font-family);
  font-weight: 300;
  font-size: 20px;
  line-height: 130%;
  text-align: center;
  color: #858585;
}

.price {
  font-family: var(--font-family);
  line-height: 130%;
  text-align: center;
  font-weight: 800;
  font-size: 24px;
  color: #f2c166;
  margin-bottom: 20px;
}

.slider-secondary .slider-item.active-thumbnail {
  border: 2px solid #048abf;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}


@media (max-width: 900px) {

  .table td, .warranity p, .price, .old-price {
      font-size: 14px; /* Фиксированный размер для мобильных устройств */
  }

  .warranity p {
      padding: 5px;
      font-size: 18px;
  }

  .old-price, .price {
      font-size: 22px;
  }

  .tbody {
      width: 100%;
  }


  .card {
      grid-template-columns: 1fr; /* Одна колонка на узких экранах */
      width: 100%;
      padding: 10px;
  }

  .image-block {
      width: 100%;
      margin-left: 0;
      grid-column: span 2; /* Занимает всю ширину */
  }

  .table-block {
      display: flex;
      grid-column: span 2; /* Занимает всю ширину грида */
      width: 100%; /* Убедитесь, что не ограничена ширина блока */
      padding: 0; /* Уберите или настройте отступы для правильного масштабирования */
      margin-left: 0;
      margin-top: 0px;
  }


  .slider {
      width: 100%; /* Основной слайдер занимает всю ширину */
      display: flex;
      justify-content: center; /* Центрируем содержимое */
  }

  .slider img {
      width: 100%; /* Изображение растягивается на всю ширину слайдера */
      height: auto; /* Сохраняет пропорции */
      object-fit: cover; /* Масштабирует изображение */
  }

  .slider-secondary {
      width: 100%; /* Вторичный слайдер занимает всю ширину */
      display: grid;
      grid-template-columns: repeat(3, 1fr); /* Три колонки с равной шириной */
      gap: 10px; /* Промежутки между изображениями */
      padding: 0; /* Убираем отступы */
  }

  .slider-secondary img {
      width: 100%; /* Изображение заполняет ячейку */
      height: 100%; /* Растягивается на всю высоту контейнера */
      object-fit: cover; /* Обеспечивает заполнение ячейки */
      border-radius: 10px; /* Сохраняем скругление углов */
  }
}


@media (max-width: 700px) {
  .warranity  {
      height: 60px;
      font-size: 18px;
  }
}




.card2 {
  margin-top: 70px;
}





.slider-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px 0;
  width: 100%; /* Соответствует ширине основного изображения */
  position: relative;
}

.slider-button {
  background-color: #048abf;
  border: none;
  color: white;
  font-size: 24px;
  font-weight: bold;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

.slider-button:focus {
  outline: none;
}

.slider-button:hover {
  background-color: #036b9e;
}









@media (max-width: 900px) {
  .slider-controls {
    width: 100%; /* Делает контейнер кнопок по ширине слайдера */
    justify-content: space-between; /* Равномерно размещает кнопки */
    margin: 10px 0;
  }

  .slider-button {
    width: 35px; /* Уменьшенные размеры кнопок для мобильных */
    height: 35px;
    font-size: 20px; /* Соответственно размер текста внутри */
  }

}




@media (max-width: 700px) {
  .slider-controls {
    width: 100%; /* Слайдер занимает всю ширину */
    justify-content: space-between; /* Централизовано */
    position: relative; /* Остаётся внутри блока */
  }

  .slider-button {
    width: 30px; /* Ещё меньше для узких экранов */
    height: 30px;
    font-size: 18px;
  }
}


/***************************************************************************************************/


.linkLending {
  display: grid;
  grid-template-columns: 1fr; /* Одна колонка для заголовка и контейнера */
  gap: 20px; /* Расстояние между элементами */
  width: 100%;
  max-width: 1140px;
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 90px;
}

.linkingText {
  grid-column: 1; /* Заголовок занимает всю ширину */
 
}

.linkingText h1 {
  font-family: Montserrat, sans-serif;
  font-size: 40px;
  font-weight: 900;
}

.linkingContainer {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Кнопки в строку */
  gap: 20px; /* Расстояние между кнопками */
}

.linkingInfo {
  display: flex;
  justify-content: center;
}


.custom-button {
  display: flex;
  align-items: center;
  text-decoration: none;
  width: 300px; /* Фиксированная ширина кнопки */
  height: 80px; /* Увеличенная высота кнопки */
 
  box-shadow: 6px 6px 4px 0px #00000040;

  border-radius: 8px;
  overflow: hidden;
  background-color: #FFFFFF;
  transition: 0.3s;
}

.custom-button:hover {
  background-color:  #858585;
  color: #ffffff;
}

.button-image {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px; /* Фиксированная ширина для изображения */
  height: 100%; /* Высота контейнера совпадает с кнопкой */
  background-color: #e9e9e9;
}

.button-image img {
  width: 100%;
  height: 100%; /* Задаём, чтобы изображение занимало контейнер */
  object-fit: cover; /* Сохраняем пропорции, без растягивания */
}

.button-textLinking {
  flex: 2;
  font-size: 16px;
  color: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
 font-weight: 500;
  padding: 0 12px; /* Внутренние отступы */
  line-height: 1.2; /* Межстрочный интервал для текста */
}

.custom-button:hover .button-textLinking {
  color: #ffffff;
}

@media (max-width: 1200px) {
  .linkLending{
    padding: 20px;
  }

}




@media (max-width: 768px) { 
  .linkLending{
    padding: 20px;
  }/* Планшеты и меньшие устройства */
  .linkingContainer {
    grid-template-columns: 1fr; /* Все элементы в одну колонку */
  }

  .custom-button {
    width: 100%; /* Кнопки растягиваются на всю ширину контейнера */
    max-width: none; /* Убираем максимальную ширину */
  }

  .linkingText h1 {
    font-size: 32px; /* Уменьшаем размер заголовка на планшетах */
  }
}

@media (max-width: 480px) { /* Мобильные устройства */
  .linkLending {
    padding-left: 10px;
    padding-right: 10px;
  }

  .linkingText h1 {
    font-size: 24px; /* Ещё меньше для мобильных */
  }

  .custom-button {
    height: 70px; /* Уменьшаем высоту кнопки */
  }

  .button-textLinking {
    font-size: 14px; /* Уменьшаем размер текста в кнопках */
    padding: 0 8px;
  }
}











/***************************************************************************************************************/
.doublebenefit {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Отступ между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  padding-left: 55px;
  margin-top: 80px;
}

.benefitText {
  display: contents; /* Убираем контейнер для независимого управления его дочерними элементами */
}

.benefitText h1 {
  grid-column: 1 / 6; /* Заголовок занимает с 1 по 5 линию */
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 900;
}

.benefitText p {
  grid-column: 1 / 11; /* Текст занимает с 1 по 11 линию */
  grid-row: 2; /* Располагается под заголовком */
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 300;
  line-height: 47px;
}

/**************************************************************************************************/
.packageConteiner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* Центрирование по горизонтали */
  align-items: baseline;
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding: 20px; /* Внутренние отступы для эстетики */
  margin-top: 20px;
}


.button-container {
  display: flex;
  justify-content: center; /* Центрирование по горизонтали */
  align-items: center; /* Центрирование по вертикали */
  flex-direction: column; /* Элементы сверху вниз */
  text-align: center;
}

.content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.packageConteiner img {
  max-width: 300px;
  height: auto;
  border-color:#D9D9D9 ;
  border-radius: 20px;
  transition: background 0.3s ease;
}

button:hover {
  background: #848383;
}

.packageConteiner p {
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 500;
  line-height: 28px;
  padding-top: 10px;
  padding-bottom: 15px;

}

.button-1 {
  grid-column: 1 / 4;
}

.button-2 {
  grid-column: 5 / 8;
}

.button-3 {
  grid-column: 9 / 12;
}

.button-4 {
  grid-column: 3 / 6;
}

.button-5 {
  grid-column: 7 / 10;
}


/***********************************************************************/
.bacgroundSection {
  background: linear-gradient(180deg, rgba(242, 193, 102, 0.9) 0%, rgba(242, 193, 102, 0.8) 100%);
  min-height: 180px;
  max-height: 250px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sectionMore {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Расстояние между колонками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto;
  padding: 20px;
  padding-left: 50px;
  padding-bottom: 5px;
  margin-top: 30px;
  margin-bottom: 30px;
}

.more1 {
  grid-column: 1 / 8; /* С 1 по 6 грид-столбцы */
}

.more1 p {
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 0;

}



.more2  {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 200;
  
}

.buttonMore {
  grid-row: 1 / 2; /* На первой строке */
  grid-column: 9 / 13; /* С 7 по 12 столбцы */
  margin-top: 0; /* Убираем лишние отступы */
}

.buttonMore button {
  width: 100%; /* Растянуть кнопку на всю ширину родителя */
  height: 60px;
  border-radius: 10px;
  border: none;
  background-color: #048ABF;
  color: #FFFFFF;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 900;
  line-height: 64px;
  text-align: center;
  cursor: pointer;
}

.buttonMore button:hover {
  background-color: #858585;
}


/************************************************************************************************************************************/

.retrofitting {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных столбцов */
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding-left: 55px;
  margin-top: 70px;
}

.first {
  grid-column: 1 / 4; 
  font-family: Montserrat;
  font-size: 60px;
  font-weight: 300;


}

.second {
  grid-column: 1 / 12; 
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 700;


}

.third {
  grid-column: 1 / 12; 
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 500;
  line-height: 39px;
  margin-top: 20px;

}

























/* Адаптация для планшетов */
@media (max-width: 768px) {
  .retrofitting {
    grid-template-columns: 1fr; /* Одна колонка */
    padding-left: 12px;
    padding-right: 12px;
  }

  .first, .second, .third {
    grid-column: 1 / -1; /* Элементы занимают всю ширину */
  }

  .first {
    font-size: 24px; /* Уменьшение размера шрифта */
  }

  .second {
    font-size: 36px;
  }

  .third {
    font-size: 18px;
    line-height: 28px;
  }
}

/* Адаптация для мобильных устройств */
@media (max-width: 480px) {
  .retrofitting {
    grid-template-columns: 1fr; /* Одна колонка */
    padding-left: 12px;
    padding-right: 12px;
  }

  .first {
    font-size: 30px;
  }

  .second {
    font-size: 28px;
  }

  .third {
    font-size: 16px;
    line-height: 24px;
  }
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////////*/


.extra {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных столбцов */
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding-left: 55px;
  margin-top: 65px;
}

.extraCard {
  grid-column: span 4; /* Карточка занимает 4 колонки */
  max-width: 331px;
  background: #ffffff;
  border:none;
  border-radius: 20px;
  background: #F2C166;
  padding: 16px;
  text-align: center; /* Центрируем текст */
  display: flex;
  flex-direction: column; /* Располагаем элементы друг под другом */
  text-align: left; /* Выравниваем текст по левому краю */
}

.extraCard h2 {
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 700;
  line-height: 39px;
  margin-bottom: 8px; /* Отступ снизу */
  color:  #F2F2F2;
}

.extraCard img {
  width: 100%; /* Растягиваем картинку по ширине карточки */
  height: auto; /* Сохраняем пропорции */
  margin-bottom: 8px; /* Отступ снизу */
  border-radius: 4px;
  margin-top: 40px;
}

.extraCard ul{
 margin: 0 auto;
 margin-left: 20px;
 margin-bottom: 20px;
}

.extraCard li {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  margin-top: 10px;

}

/************************************************************************************************************************************/

/* Стили для попапа */
.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* Полупрозрачный фон */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  opacity: 0; /* Скрыт по умолчанию */
  pointer-events: none; /* Отключены клики по скрытому попапу */
  transition: opacity 0.3s ease;
}

.popup-content {
  background: #fff;
  text-align: center;
  position: relative;
  max-width: 400px;
  width: 100%;
}

.popup-close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 20px;
  font-weight: bold;
}

.popup.show {
  opacity: 1; /* Показываем попап */
  pointer-events: auto; /* Разрешаем клики */
}

.hidden {
  display: none;
}

/************************************************************************************************************/
.bacgroundConsult{
  margin-top: 120px;
}
.consultation{
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding-left: 55px;
  margin-top: 10px;
}




.consultationText{
  grid-column: 1 / 7; 
}
.consultationText p {
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 800;
  line-height: 31px;
}

.consultationAction {
  grid-column: 9 / 13;
}

.consultationAction p {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 200;
  line-height: 23px;
  margin-top: 10px;
  margin-bottom: 0;
}

.fret{
  font-family: Montserrat;
font-size: 18px;
font-weight: 200;
line-height: 0.9;
}



.consultationBTH {
 

  padding-bottom: 30px;
}

.buttoConsultation button {
  width: 347px;
  height: 60px;
  border-radius: 10px ;
  border: none;
  background-color: #048ABF;
  color:  #FFFFFF;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 900;
  line-height: 64px;
  text-align: center;
  cursor: pointer;
}
.buttoConsultation button:hover{
  background-color: #858585;
}


/*********************************************************************************************************/

.leasing {
  display: grid;
  grid-template-columns: repeat(12, 1fr); 
  gap: 20px; 
  width: 100%;
  max-width: 1140px; 
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 70px;
  
}

.leasing1 {
  grid-column: 1 / 3; 
  font-family: Montserrat;
  font-size: 60px;
  font-weight: 300;


}

.leasing2 {
  grid-column: 1 / 12; 
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 700;
}

.leasing3, .leasing4 {
  grid-column: 1 / 11; 
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 500;
  line-height: 39px;
  margin-top: 20px;

}































/*****************************************************************************************************************/
.logoLeasing {
  display: grid;
  grid-template-columns: repeat(12, 1fr); 
  gap: 20px; 
  width: 100%;
  max-width: 1140px; 
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 70px;
}

.logoLeasing img:nth-child(1) {
  grid-column: 1 / 4; /* с 1 по 4 столбец */
}

.logoLeasing img:nth-child(2) {
  grid-column: 5 / 8; /* с 6 по 8 столбец */
}

.logoLeasing img:nth-child(3) {
  grid-column: 9 / 12; /* с 9 по 12 столбец */
}

.logoLeasing img:nth-child(4) {
  grid-column: 1 / 4;
  margin-top: 30px; /* второй ряд, те же столбцы */
}

.logoLeasing img:nth-child(5) {
  grid-column: 5 / 8;
  margin-top: 30px; 
}

.logoLeasing img:nth-child(6) {
  grid-column: 9 / 12;
  margin-top: 20px; 
}

.logoLeasing img:nth-child(7) {
  grid-column: 1 / 4; 
  margin-top: 30px; 
}

.logoLeasing img:nth-child(8) {
  grid-column: 5 / 8;
  margin-top: 30px; 
}

.logoLeasing img:nth-child(9) {
  grid-column: 9 / 12;
  margin-top: 30px; 
}

.logoLeasing img {
  max-width: 250px;
  height: auto; 
  
}

/*********************************************************************************************************************************/





.bacgroundOffer{
  margin-top: 170px;
}
.limitedoffer{
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding-left: 55px;
  margin-top: 30px;
}


.limitedofferText{
  grid-column: 1 / 7; 
  margin-top: 20px;
}
.limitedofferText p {
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 800;
  line-height: 31px;
}

.limitedofferAction {
  grid-column: 9 / 13;
}

.limitedofferAction p {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 200;
  line-height: 23px;
  padding-bottom: 10px;
}


.buttolimitedoffer {
  grid-column: 9 / 12; 
  text-align: center;
  padding-bottom: 30px;

}

.buttolimitedoffer button {
  width: 347px;
  height: 60px;
  border-radius: 10px ;
  border: none;
  background-color: #048ABF;
  color:  #FFFFFF;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 900;
  line-height: 64px;
  text-align: center;
  cursor: pointer;
}
.buttolimitedoffer button:hover{
  background-color: #858585;
}

@keyframes shake {
  0% {
    transform: translateX(0); /* Начальное положение */
  }
  25% {
    transform: translateX(-3px); /* Движение влево */
  }
  50% {
    transform: translateX(3px); /* Движение вправо */
  }
  75% {
    transform: translateX(-3px); /* Снова влево */
  }
  100% {
    transform: translateX(0); /* Возвращение в исходное положение */
  }
}

#countdown {
  max-height: 42px;
  font-size: 15px; 
  font-family: Montserrat; 
  font-weight: 700; 
  padding: 10px;
  margin-right: 11px;
  text-align: center;
  display: inline-block;
  border-radius: 10px; 
  color: #000000;
  background-color: rgba(255, 255, 255, 0.8); 
  box-shadow: 6px 6px 4px 0px #6f3e0140;
  margin-bottom: 15px;
  animation: shake 1s ease-in-out infinite; 
}
/*********************************************************************************************************************/







.delivery {
  display: grid;
  grid-template-columns: repeat(12, 1fr); 
  gap: 20px; 
  width: 100%;
  max-width: 1140px; 
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 70px;
}

.delivery1 {
  grid-column: 1 / 3; 
  font-family: Montserrat;
  font-size: 60px;
  font-weight: 300;
 


}

.delivery2 {
  grid-column: 1 / 12; 
  font-family: Montserrat;
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 700;
  margin-top: 20px;
}

.delivery3, .delivery4 {
  grid-column: 1 / 11; 
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 500;
  line-height: 39px;
  margin-top: 20px;

}


/*********************************************************************/







.calculationDel{
  margin-top: 170px;
}
.calculationDelivery{
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 равных колонок */
  gap: 20px; /* Расстояние между колонками и строками */
  width: 100%;
  max-width: 1140px; /* Максимальная ширина контейнера */
  margin: 0 auto; /* Центрирование контейнера */
  padding-left: 55px;
  margin-top: 15px;
}




.calculationDeliveryText{
  grid-column: 1 / 7; 
}
.calculationDeliveryText p {
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 800;
  line-height: 31px;
 
}

.calculationDeliveryAction {
  grid-column: 9 / 12;
}

.calculationDeliveryAction p {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 200;
  line-height: 23px;
  padding-top: 10px;
}


.buttocalculationDelivery {
  grid-column: 9 / 12; 
  text-align: center;

}

.buttocalculationDelivery button {
  width: 318px;
  height: 60px;
  border-radius: 10px ;
  border: none;
  background-color: #048ABF;
  color:  #FFFFFF;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 900;
  line-height: 64px;
  text-align: center;
  cursor: pointer;
}
.buttocalculationDelivery button:hover{
  background-color: #858585;
}

/**********************************************************************************************/




.aboutUs {
  display: grid;
  grid-template-columns: repeat(12, 1fr); 
  gap: 20px; 
  width: 100%;
  max-width: 1140px; 
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 70px;
}

.aboutUs1 {
  grid-column: 1 / 5; 
  font-family: Montserrat;
  font-size: 60px;
  font-weight: 300;
 


}

.aboutUs2 {
  grid-column: 1 / 12; 
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 700;
  margin-top: 20px;
  margin-top: 20px;
}

.aboutUs3 {
  grid-column: 1 / 11; 
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 500;
  line-height: 39px;
  margin-top: 20px;

}

/*********************************************************/


.biglogo {
  display: grid;
  grid-template-columns: repeat(8, 1fr); /* 8 равных колонок */
  gap: 20px; 
  width: 100%;
  max-width: 1140px; 
  margin: 0 auto; 
  padding-left: 55px;
  margin-top: 70px;
}


.biglogo img {
  grid-column: 3/ 7; /* Занимает с 2 по 6 колонку (5 колонок) */
  max-width: 100%; /* Чтобы изображение не вылезало за границы */
  height: auto; /* Сохраняет пропорции */
}

/*****************************************************************************************************************************/

#map {
  position: relative;
  width: 100%;
  height: 500px; /* высота карты */
  background-color: #eaeaea; /* резервный цвет */
  margin-top: 70px;
}

.contactsFooter {
  position: relative;
  z-index: 1;
  background: none; /* отключаем стандартный фон */
}

.contentFooter {
  max-width: 650px;
  padding: 20px;
  background-color: #FFFFFF;
  position: absolute;
  top: 50%; /* центрируем */
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  border-radius: 20px;
  z-index: 2;
}

.contentFooter h2 {
  font-family: Montserrat;
  font-size: 40px;
  font-weight: 700;
  line-height: 39px;
 color: #000000;
 margin: 0;
}
.contacts-listFooter{
  margin-top: 25px;
}

.contacts-listFooter li {
  list-style-type: none;
  font-family: Montserrat;
  font-size: 15px;
  font-weight: 300;
  line-height: 23px;
}
.contacts-listFooter a {
 
  font-family: Montserrat;
  font-size: 15px;
  font-weight: 700;
  line-height: 24.38px;
  color: #2C2C2C;
}


.contacts-listFooter a:hover{
  font-size: 15px;
  color: #1b1b1b;
}

















/* Адаптивность ----------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media (max-width: 1160px) {
  .limitedofferBTH{
    width: 280px !important;
  }
  .consultationBTH{
    width: 280px !important;
  }
}






/* Адаптация для экранов от 906px до 1200px */
@media (max-width: 1200px) {
  #map {
    height: 400px; /* Уменьшаем высоту карты для средних экранов */
    margin-top: 70px;
  }
  .contentFooter {
    max-width: 90%;
    top: 40%; /* Смещаем выше для корректного отображения */
    transform: translate(-50%, -40%);
    padding: 16px;
    border-radius: 0;
    border:none;
    box-shadow: none;
  }
  .contentFooter h2 {
    font-size: 32px;
    line-height: 36px;
  }
  .contacts-listFooter li {
    font-size: 14px;
    line-height: 20px;
  }
}

/* Адаптация для экранов от 576px до 906px */
@media (max-width: 906px) {
  #map {
    height: 300px; /* Ещё сильнее уменьшаем высоту карты */
  }
  .contentFooter {
    max-width: 100%;
    position: static; /* Убираем абсолютное позиционирование */
    transform: none;
    margin: 0 auto;
    background: #ffffff;
    padding: 12px;
    
    box-shadow: none; /* Убираем тени */
    margin-top: 30px;
  }
  .contentFooter h2 {
    font-size: 24px;
    line-height: 28px;
    margin-top: 0;
  }
  .contacts-listFooter li {
    font-size: 13px;
    line-height: 18px;
  }
}

/* Адаптация для экранов меньше 576px */
@media (max-width: 576px) {
  #map {
    height: 250px; /* Минимальная высота карты */
  }
  .contactsFooter {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin-top: 30px;
    border-radius: 0;
    border:none;
    box-shadow: none;
  }
  .contentFooter {
    max-width: 100%;
    margin: 10px auto;
    padding: 10px;
    margin-top: 0;
    background: #ffffff;
    border-radius: 0;
    border:none;
    box-shadow: none;
  }
  .contentFooter h2 {
    font-size: 20px;
    line-height: 24px;
  }
  .contacts-listFooter li {
    font-size: 12px;
    line-height: 16px;
  }
  .contacts-listFooter {
    margin-top: 10px;
  }
}



































































/* Адаптив для планшетов (ширина до 768px) */
@media (max-width: 768px) {
  .biglogo {
    grid-template-columns: repeat(4, 1fr); /* 4 колонки для более узкого экрана */
    padding-left: 20px; /* Уменьшение отступов */
    padding-right: 20px;
    gap: 15px;
  }

  .biglogo img {
    grid-column: 1 / 5; /* Изображение занимает всю ширину сетки */
  }
}

/* Адаптив для мобильных устройств (ширина до 480px) */
@media (max-width: 480px) {
  .biglogo {
    grid-template-columns: 1fr; /* 1 колонка для мобильных устройств */
    padding-left: 20px; /* Уменьшение отступов */
    padding-right: 20px;
    gap: 10px;
  }

  .biglogo img {
    grid-column: 1 / -1; /* Занимает всю доступную ширину */
  }
}





















/* Адаптация для планшетов (максимальная ширина экрана 768px) */
@media (max-width: 768px) {
  .aboutUs {
    grid-template-columns: 1fr; /* Один столбец */
    gap: 15px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 50px;
  }

  .aboutUs1 {
    font-size: 40px; /* Уменьшаем размер текста */
    grid-column: 1 / -1; /* Растянуть на всю ширину */
  }

  .aboutUs2 {
    font-size: 36px; /* Уменьшаем размер текста */
    line-height: 32px;
    grid-column: 1 / -1;
  }

  .aboutUs3 {
    font-size: 18px;
    line-height: 28px;
    grid-column: 1 / -1;
  }
}

/* Адаптация для мобильных устройств (максимальная ширина экрана 480px) */
@media (max-width: 480px) {
  .aboutUs {
    gap: 10px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 30px;
  }

  .aboutUs1 {
    font-size: 30px; /* Ещё меньше размер текста */
  }

  .aboutUs2 {
    font-size: 28px;
    line-height: 28px;
  }

  .aboutUs3 {
    font-size: 16px;
    line-height: 24px;
  }
}





























@media (max-width: 1024px) {
  .calculationDelivery {
    grid-template-columns: 1fr; /* Однофрагментная колонка */
    gap: 15px; /* Меньше расстояние между элементами */
    padding-left: 20px; /* Уменьшаем отступ */
    margin: 0;
  }

  .calculationDeliveryText {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .calculationDeliveryText p {
    font-size: 20px; /* Уменьшаем шрифт */
    line-height: 28px; /* Уменьшаем высоту строки */
  }

  .calculationDeliveryAction {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .calculationDeliveryAction p {
    font-size: 16px; /* Уменьшаем размер текста */
    line-height: 22px; /* Уменьшаем высоту строки */
  }

  .buttocalculationDelivery {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .buttocalculationDelivery button {
    width: 100%; /* Кнопка на всю ширину */
    max-width: 300px; /* Максимальная ширина кнопки */
    height: 50px; /* Уменьшаем высоту кнопки */
    font-size: 18px; /* Уменьшаем размер шрифта */
    line-height: 50px; /* Центрируем текст */
  }
}

@media (max-width: 768px) {
  .calculationDel{
    margin-top: 50px !important;
  }
  .calculationDelivery {
    gap: 10px; /* Уменьшаем расстояние между элементами */
    padding: 10px; /* Увеличиваем внутренний отступ */
    margin: 0;
  }

  .calculationDeliveryText p {
    font-size: 18px; /* Еще меньше размер текста */
    line-height: 24px;
    margin: 0;
  }

  .calculationDeliveryAction p {
    font-size: 18px; /* Уменьшаем текст */
    line-height: 20px;
  }

  .buttocalculationDelivery button {
    height: 45px; /* Еще меньше высота кнопки */
    font-size: 16px; /* Уменьшаем текст */
  }
}





























/* Адаптация для планшетов (максимальная ширина экрана 768px) */
@media (max-width: 768px) {
  .delivery {
    grid-template-columns: 1fr; /* Один столбец */
    gap: 15px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 50px;
  }

  .delivery1 {
    font-size: 40px; /* Уменьшаем размер текста */
    grid-column: 1 / -1; /* Растянуть на всю ширину */
  }

  .delivery2 {
    font-size: 36px;
    line-height: 32px;
    grid-column: 1 / -1;
  }

  .delivery3,
  .delivery4 {
    font-size: 18px;
    line-height: 28px;
    grid-column: 1 / -1;
  }
}

/* Адаптация для мобильных устройств (максимальная ширина экрана 480px) */
@media (max-width: 480px) {
  .delivery {
    gap: 10px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 30px;
  }

  .delivery1 {
    font-size: 30px; /* Ещё меньше размер текста */
  }

  .delivery2 {
    font-size: 28px;
    line-height: 28px;
  }

  .delivery3,
  .delivery4 {
    font-size: 16px;
    line-height: 24px;
  }
}













@media (max-width: 1024px) {
  .bacgroundOffer{
    margin-top: 50px !important;
  }
  .limitedoffer {
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 15px; /* Меньше расстояние между элементами */
    padding-left: 20px; /* Уменьшаем отступ */
    margin: 0;
  }

  .limitedofferText {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем текст */
  }

  .limitedofferText p {
    font-size: 20px; /* Уменьшаем шрифт */
    line-height: 28px; /* Уменьшаем высоту строки */
  }

  .limitedofferAction {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .limitedofferAction p {
    font-size: 18px; /* Уменьшаем размер текста */
    line-height: 22px; /* Уменьшаем высоту строки */
  }

  .buttolimitedoffer {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .buttolimitedoffer button {
    width: 100%; /* Кнопка на всю ширину */
    max-width: 300px; /* Максимальная ширина кнопки */
    height: 50px; /* Уменьшаем высоту кнопки */
    font-size: 18px; /* Уменьшаем размер шрифта */
    line-height: 50px; /* Центрируем текст */
  }
}


@media (max-width: 768px) {
  .limitedoffer {
    gap: 10px; /* Уменьшаем расстояние между элементами */
    padding: 10px; /* Увеличиваем внутренний отступ */
    margin: 0;
  }

  .limitedofferText p {
    font-size: 16px; /* Еще меньше размер текста */
    line-height: 24px;
    margin: 0;
  }

  .limitedofferAction p {
    font-size: 18px; /* Уменьшаем текст */
    line-height: 20px;
  }

  .buttolimitedoffer button {
    height: 45px; /* Еще меньше высота кнопки */
    font-size: 16px; /* Уменьшаем текст */
  }
  #countdown{
    padding: 10px;
    font-size: 13px;
    font-weight: 700; 
    margin-right: 10px;
 
  }
}











/* Адаптация для планшетов */
@media (max-width: 1024px) {
  .logoLeasing {
    grid-template-columns: repeat(4, 1fr); /* Две картинки в ряд */
    gap: 15px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .logoLeasing img {
    max-width: 200px;
  }

  .logoLeasing img:nth-child(1) { grid-column: 1 / 3; }
  .logoLeasing img:nth-child(2) { grid-column: 3 / 5; }
  .logoLeasing img:nth-child(3) { grid-column: 1 / 3; margin-top: 20px; }
  .logoLeasing img:nth-child(4) { grid-column: 3 / 5; margin-top: 20px; }
  .logoLeasing img:nth-child(5) { grid-column: 1 / 3; margin-top: 20px; }
  .logoLeasing img:nth-child(6) { grid-column: 3 / 5; margin-top: 20px; }
  .logoLeasing img:nth-child(7) { grid-column: 1 / 3; margin-top: 20px; }
  .logoLeasing img:nth-child(8) { grid-column: 3 / 5; margin-top: 20px; }
  .logoLeasing img:nth-child(9) {
    grid-column: 2 / 4; /* Занимает место по центру */
    margin-top: 20px;
  }
}

/* Адаптация для мобильных устройств */
@media (max-width: 768px) {
  .logoLeasing {
    grid-template-columns: repeat(2, 1fr); /* Две картинки в ряд */
    gap: 10px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .logoLeasing img {
    max-width: 150px;
  }

  .logoLeasing img:nth-child(1) { grid-column: 1 / 2; }
  .logoLeasing img:nth-child(2) { grid-column: 2 / 3; }
  .logoLeasing img:nth-child(3) { grid-column: 1 / 2; margin-top: 10px; }
  .logoLeasing img:nth-child(4) { grid-column: 2 / 3; margin-top: 10px; }
  .logoLeasing img:nth-child(5) { grid-column: 1 / 2; margin-top: 10px; }
  .logoLeasing img:nth-child(6) { grid-column: 2 / 3; margin-top: 10px; }
  .logoLeasing img:nth-child(7) { grid-column: 1 / 2; margin-top: 10px; }
  .logoLeasing img:nth-child(8) { grid-column: 2 / 3; margin-top: 10px; }
  .logoLeasing img:nth-child(9) {
    grid-column: 1 / 3; /* Занимает всю ширину */
    margin-top: 10px;
  }
}



















@media (max-width: 768px) {
  .leasing {
    grid-template-columns: 1fr; /* Один столбец */
    gap: 15px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 50px;
  }

  .leasing1 {
    font-size: 40px; /* Уменьшаем размер текста */
    grid-column: 1 / -1; /* Растянуть на всю ширину */
  }

  .leasing2 {
    font-size: 36px;
    line-height: 32px;
    grid-column: 1 / -1;
  }

  .leasing3, .leasing4 {
    font-size: 18px;
    line-height: 28px;
    grid-column: 1 / -1;
  }
}

/* Адаптация для мобильных устройств (ширина экрана до 480px) */
@media (max-width: 480px) {
  .leasing {
    gap: 10px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 30px;
  }

  .leasing1 {
    font-size: 30px; /* Ещё меньше размер текста */
  }

  .leasing2 {
    font-size: 28px;
    line-height: 28px;
  }

  .leasing3, .leasing4 {
    font-size: 16px;
    line-height: 24px;
  }
}











@media (max-width: 1024px) {
  .bacgroundConsult{
    margin-top: 30px;
  }
  .consultation {
    grid-template-columns: 1fr; /* Однофрагментная колонка */
    gap: 15px; /* Меньше расстояние между элементами */
    padding-left: 20px; /* Уменьшаем отступ */
    margin: 0;
  }

  .consultationText {
    grid-column: 1 / -1; /* Элемент на всю ширину */
  }

  .consultationText p {
    font-size: 20px; /* Уменьшаем шрифт */
    line-height: 28px; /* Уменьшаем высоту строки */
    text-align: center; /* Центрируем текст */
    
  }

  .consultationAction {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .consultationAction p {
    font-size: 16px; /* Уменьшаем размер текста */
    line-height: 22px; /* Уменьшаем высоту строки */
  }

  .consultationBTH {
    grid-column: 1 / -1; /* Элемент на всю ширину */
    text-align: center; /* Центрируем содержимое */
  }

  .buttoConsultation button {
    width: 100%; /* Кнопка на всю ширину */
    max-width: 300px; /* Максимальная ширина кнопки */
    height: 50px; /* Уменьшаем высоту кнопки */
    font-size: 18px; /* Уменьшаем размер шрифта */
    line-height: 50px; /* Центрируем текст */
  }
}

@media (max-width: 768px) {
  .bacgroundConsult{
    margin-top: 50px !important;
  }
  .consultation {
    gap: 10px; /* Уменьшаем расстояние между элементами */
    padding: 10px; /* Увеличиваем внутренний отступ */
    margin: 0;
  }

  .consultationText p {
    font-size: 18px; /* Еще меньше размер текста */
    line-height: 24px;
    margin: 0;
  }

  .consultationAction p {
    font-size: 18px; /* Уменьшаем текст */
    line-height: 20px;
  }

  .buttoConsultation button {
    height: 45px; /* Еще меньше высота кнопки */
    font-size: 16px; /* Уменьшаем текст */
  }
}




































@media (max-width: 1024px) {
  .extra {
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 16px; /* Уменьшаем расстояние между карточками */
    padding-left: 30px;
    padding-right: 30px;
  }

  .extraCard {
    grid-column: span 12; /* Карточка занимает всю ширину */
    max-width: 100%; /* Убираем фиксированную ширину */
    padding: 12px;
  }

  .extraCard h2 {
    font-size: 28px; /* Уменьшаем размер заголовка */
    line-height: 32px;
  }

  .extraCard img {
    width: 100%; /* Картинка остается на всю ширину карточки */
    max-height: 200px; /* Максимальная высота для предотвращения больших изображений */
    object-fit: contain; /* Сохраняем пропорции изображения, подгоняя его в контейнер */
    margin-top: 20px; /* Сокращаем отступы сверху */
    margin-bottom: 12px; /* Сокращаем отступы снизу */
  }

  .extraCard p {
    font-size: 16px; /* Уменьшаем размер текста */
    line-height: 24px;
  }
}

@media (max-width: 900px) {
  .extraCard{
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .extraCard ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
  }
}




@media (max-width: 768px) {
   .extra {
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 16px; /* Уменьшаем расстояние между карточками */
    padding-left: 15px;
    padding-right: 15px;
  }

  .extraCard h2 {
    font-size: 24px; /* Еще меньше для мобильных */
    line-height: 28px;
  }

  .extraCard p {
    font-size: 14px; /* Уменьшаем текст для мобильных */
    line-height: 22px;
  }

  .extra {
    gap: 12px; /* Еще меньше расстояние между карточками */
  }

  .extraCard {
    padding: 10px; /* Уменьшаем внутренние отступы карточек */
  }
  .extraCard img {
    width: 100%; /* Картинка остается на всю ширину карточки */
    max-height: 200px; /* Максимальная высота для предотвращения больших изображений */
    object-fit: contain; /* Сохраняем пропорции изображения, подгоняя его в контейнер */
    margin-top: 20px; /* Сокращаем отступы сверху */
    margin-bottom: 12px; /* Сокращаем отступы снизу */
  }

}

















































@media (max-width: 1024px) {
  .bacgroundSection {
    padding: 12px; /* Увеличиваем отступы */
  }

  .more1 p {
    font-size: 20px; /* Уменьшаем шрифт */
    line-height: 28px;
  }

  .more2  {
    font-size: 16px; /* Уменьшаем шрифт описания */
    line-height: 22px;
  }

  .buttonMore button {
    font-size: 16px; /* Уменьшаем размер текста кнопки */
    height: 50px; /* Уменьшаем высоту кнопки */
    line-height: 50px;
  }
}

@media (max-width: 768px) {
  .bacgroundSection {
    height: auto; /* Автоматическая высота */
    padding: 12px; /* Увеличиваем внутренние отступы */
    display: flex;
    flex-direction: column; /* Элементы располагаются в одну колонку */
    align-items: center; /* Центрируем элементы по горизонтали */
    text-align: center; /* Центрируем текст */
    margin: 0 auto;
  }

  .sectionMore {
    width: 100%; /* На всю ширину */
    display: flex;
    flex-direction: column; /* Располагаем элементы вертикально */
    align-items: center; /* Центрируем содержимое */
    text-align: center; /* Текст по центру */
    gap: 10px; /* Расстояние между элементами */
    margin: 0 auto; /* Убираем отступ сверху */
    padding: 0;
    margin-top: 10px;
    margin-bottom: 10px;
    
  }

  .more1, .more2 {
    width: 100%; /* На всю ширину */
    text-align: center; /* Текст по центру */
  }

  .more1 p {
    font-size: 20px; /* Уменьшаем размер текста */
    line-height: 24px;
    margin: 0;
  }

  .more2  {
    padding: 0;
    font-size: 14px; 
    
    
  }

  .buttonMore {
    width: 100%; /* Контейнер кнопки на всю ширину */
    display: flex;
    justify-content: center; /* Центрируем кнопку */
    align-items: center;
   
  }

  .buttonMore button {
    width: 100%; /* Кнопка на всю ширину */
    max-width: 300px; /* Максимальная ширина кнопки */
    height: 50px; /* Уменьшаем высоту */
    font-size: 16px; /* Уменьшаем размер шрифта */
    line-height: 50px; /* Центрирование текста */
  }
}
























@media (max-width: 1024px) {
  .nav,
  .contact {
    display: none; /* Скрываем навигацию и контакты */
  }
.green-line {
  position: relative; /* Устанавливает контекст для абсолютного позиционирования */
  overflow: visible;

}
  .mobile-menu {
    display: flex; /* Показываем бургер */
    flex-direction: column;
    align-items: center;
    position: relative;
   bottom: 60px;
  }
}

@media (max-width: 768px) {
  .containernav {
    grid-template-columns: repeat(12, 1fr);
  }

  .dropdown-menu {
    width: 100%;
    right: 5%;
  }
}



@media (max-width: 1024px) {
  .green-background {
    padding: 20px; /* Увеличиваем отступы */
  }

  .text-block h1 {
    font-size: 40px; /* Уменьшаем заголовок */
  }

  .text-block p {
    font-size: 30px; /* Уменьшаем текст */
  }
  .btn{
    font-size: 14px;
  }
  .button-block p {
    font-size: 14px; /* Уменьшаем текст описания */
  }
}

@media (max-width: 768px) {
  .green-background {
    height: auto; /* Чтобы высота автоматически подстраивалась */
    margin-top: 0; /* Убираем отступ сверху, если не нужен */
    display: flex;
    flex-direction: column; /* Блоки располагаются в одну колонку */
    align-items: center; /* Центрируем элементы по горизонтали */
    justify-content: center; /* Центрируем элементы по вертикали */
  }

  .container {
    width: 100%; /* Контейнер на всю ширину */
    display: flex;
    flex-direction: column; /* В одну колонку */
    align-items: center; /* Центрирование по горизонтали */
    text-align: center; /* Выравнивание текста в центре */
  }

  .text-block, .button-block {
    width: 90%; /* Уменьшаем ширину для отступов */
    margin: 10px 0; /* Добавляем отступ между блоками */
    text-align: center; /* Центрируем текст внутри блоков */
  }

  .text-block h1, .text-block p {
    font-size: 24px; /* Уменьшаем размер шрифта для мобильных */
    line-height: 1.2; /* Оптимизируем высоту строки */
  }

  .button-block p {
    font-size: 16px; /* Уменьшаем шрифт описания */
    line-height: 1.5; /* Оптимизируем высоту строки */
  }
  .button-block {
    display: flex; /* Используем Flexbox */
    flex-direction: column; /* Вертикальное расположение */
    align-items: center; /* Центрируем элементы по горизонтали */
    justify-content: center; /* Центрируем элементы по вертикали */
    text-align: center; /* На случай текста */
  }
  
  .btn {
    width: 100%; /* Кнопка на всю ширину блока */
    max-width: 300px; /* Максимальная ширина */
    height: 50px; /* Уменьшаем высоту */
    font-size: 16px; /* Уменьшаем размер текста */
    line-height: 50px; /* Центрирование текста */
  }
}




/* Адаптив для планшетов (ширина от 768px до 1024px) */
@media (max-width: 1024px) {
  .container {
    grid-template-columns: 1fr; /* Одна колонка */
    padding: 16px;
    padding-left: 20px;
  }

  .title {
    font-size: 32px; /* Уменьшение шрифта заголовка */
    margin-top: 40px; /* Уменьшение отступа сверху */
    grid-column: 1 / 2; /* Охват всей ширины */
  }

  .description-box {
    grid-column: 1 / 2; /* Охват всей ширины */
    margin-left: 0; /* Убираем отрицательный отступ */
    padding: 12px;
    height: auto; /* Высота адаптируется к контенту */
  }

  .description {
    font-size: 18px; /* Уменьшение шрифта */
    padding-left: 0; /* Убираем отступ */
  }
}

/* Адаптив для мобильных устройств (ширина до 767px) */
@media (max-width: 767px) {
  .container {
    grid-template-columns: 1fr; /* Одна колонка */
    padding: 12px;
  }

  .title {
    font-size: 24px; /* Ещё меньше шрифт заголовка */
    margin-top: 20px;
    line-height: 1.5;
  }

  .description-box {
    margin-left: 0;
    padding: 8px;
    border-radius: 10px;
    box-shadow: 4px 4px 3px 0px #F2870540;
  }

  .description {
    font-size: 16px;
    padding-left: 0;
    line-height: 1.4;
  }
}



/* Адаптив для планшетов и узких экранов */
@media (max-width: 768px) {
  .wrapper-best {
    grid-template-columns: 1fr 1fr; /* Две колонки */
    padding-left: 30px; /* Уменьшаем отступы */
    gap: 15px; /* Уменьшаем расстояние между элементами */
    margin: 0;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }
  
  .greenFive {
    flex-direction: column; /* Перестраиваем блоки в колонку */
    height: auto; /* Автоматическая высота */
    margin-top: 50px; /* Уменьшенный отступ сверху */
  }

  .point5 {
    display: grid;
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 20px; /* Расстояние между элементами */
    text-align: center; /* Центрирование текста */

  }

  .numFive {
    font-size: 100px; /* Уменьшаем шрифт */
    position: relative; /* Сбрасываем абсолютное позиционирование */
    right: 0;
    bottom: 0;
    margin-bottom: 20px; /* Добавляем отступ */
  }

  .textFive {
    grid-column: auto;
    padding-bottom: 20px; /* Уменьшенный отступ */
  }

  .textFive p {
    font-size: 24px; /* Уменьшаем шрифт */
    line-height: 32px; /* Соответствующая высота строки */
  }

  .formFive {
    grid-column: auto;
    margin: 0 auto; /* Центрируем кнопку */
  }

  .bth5 {
    width: 250px; /* Кнопка на всю ширину */
    height: 50px; /* Уменьшаем высоту */
    font-size: 12px; /* Уменьшаем шрифт */
    display: flex;
    justify-content: center;
    margin: 0;
  }
}


/* Адаптивность для мобильных устройств (ширина экрана до 768px) */
@media (max-width: 768px) {
  .wrapper-best {
    grid-template-columns: 1fr 1fr; /* Две колонки */
    padding-left: 30px; /* Уменьшаем отступы */
    gap: 15px; /* Уменьшаем расстояние между элементами */
    margin: 0;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }
  
.point:nth-child(3) {
  margin-top: 20px; /* Задайте нужное значение */
}

.point:nth-child(4) {
  margin-top: 20px; /* Задайте нужное значение */
}


    .point {
      grid-column: span 12; /* На планшетах элементы занимают всю ширину */
    }
  
    .point:nth-child(2n) {
        grid-column: span 12;
      }
  
    .num {
      display: flex; /* Flexbox для центрирования */
      align-items: center; /* Центрируем по вертикали */
      justify-content: center; /* Центрируем по горизонтали */
      min-height: 100px;
    }
    .text h1 {
      font-size: 20px;
    }
  
  .titleFive {
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }
.point5{
  padding: 0;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 75px;
}
  .num p {
    font-size: 80px; /* Уменьшаем размер текста */
  }

  .text h1 {
    font-size: 24px; /* Уменьшаем размер заголовка */
    line-height: 32px;
  }

  .text p {
    font-size: 16px; /* Уменьшаем размер текста */
    line-height: 24px;
  }

  .titleFive h1 {
    font-size: 20px; /* Уменьшаем размер заголовка для секции */
  }
  .textFive h1{
    font-size: 20px;
  }
  .textFive p{
    font-size: 16px;
  }
  .textFive{
    padding-bottom: 0;
  }
  .conteinerModela h1 {
    margin: 0;
    grid-column: 3 / span 5; 
    font-size: 50px;
  }
  .conteinerModela{
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;

  }

}





















/* Адаптивность для планшетов (ширина экрана от 769px до 1024px) */
@media (max-width: 1024px) {
  .wrapper-best {
    grid-template-columns: 1fr 1fr; /* Две колонки */
    padding-left: 30px; /* Уменьшаем отступы */
    gap: 15px; /* Уменьшаем расстояние между элементами */
    margin: 0;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }

  .point {
    max-width: 100%; /* Убираем фиксированную ширину */
    margin-top: 40px; /* Уменьшаем отступ сверху */
  }

  .num p {
    font-size: 120px; /* Уменьшаем размер текста */
  }

  .text h1 {
    font-size: 30px; /* Уменьшаем размер заголовка */
    line-height: 38px;
  }
  .text h1 {
    font-size: 20px;
  }

  }























/* Адаптив для планшетов (ширина экрана до 768px) */
@media (max-width: 768px) {
  .doublebenefit {
    grid-template-columns: 1fr; /* Одна колонка */
    padding-left: 20px; /* Уменьшаем отступы */
    gap: 15px;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }

  .benefitText h1 {
    font-size: 32px; /* Уменьшаем размер заголовка */
  }

  .benefitText p {
    font-size: 24px; /* Уменьшаем размер текста */
    line-height: 32px;
  }

  .packageConteiner {
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 15px; /* Уменьшаем расстояние между элементами */
    padding-left: 20px;
  }

  .button-container {
    margin-top: 10px; /* Уменьшаем отступы */
  }

  .content button {
    width: 240px; /* Уменьшаем ширину кнопки */
    height: 160px; /* Уменьшаем высоту кнопки */
  }

  .packageConteiner p {
    font-size: 18px; /* Уменьшаем размер текста */
    line-height: 24px;
    padding-top: 15px;
  }

  /* Выравнивание кнопок в одну колонку */
  .button-1,
  .button-2,
  .button-3,
  .button-4,
  .button-5 {
    grid-column: 1 / -1; /* Занимает всю ширину */
    margin-top: 0; /* Сбрасываем отступы */
  }
}

/* Адаптив для мобильных устройств (ширина экрана до 480px) */
@media (max-width: 480px) {
  .doublebenefit {
    grid-template-columns: 1fr; /* Одна колонка */
    padding-left: 10px; /* Ещё меньше отступов */
    gap: 10px;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
  }

  .benefitText h1 {
    font-size: 20px; /* Ещё меньше заголовок */
  }

  .benefitText p {
    font-size: 16px; /* Ещё меньше текст */
    line-height: 1.2;
  }

  .packageConteiner {
    grid-template-columns: 1fr; /* Одна колонка */
    gap: 10px;
    padding-left: 10px;
  }

  .content button {
    width: 180px; /* Минимальная ширина кнопки */
    height: 120px; /* Минимальная высота кнопки */
  }

  .packageConteiner p {
    font-size: 14px; /* Минимальный размер текста */
    line-height: 20px;
    padding-top: 10px;
  }

  /* Выравнивание кнопок в одну колонку */
  .button-1,
  .button-2,
  .button-3,
  .button-4,
  .button-5 {
    grid-column: 1 / -1; /* Занимает всю ширину */
    margin-top: 0; /* Сбрасываем отступы */
  }
}



@media (min-width: 900px) and (max-width: 1140px) {
  /* Стили для экранов шириной от 768px до 1024px */
  .card {
    max-width: 1140px;
  }

  .slider  img {
    width: 100%; /* Заполняет ширину блока */
    height: auto; /* Сохраняет пропорции */
    object-fit: cover; /* Обрезает изображение, чтобы заполнить блок, если нужно */
  }

  .bacgroundConsult {
    margin-top: 50px;
  }
  
}


@media (max-width: 1010px) {
 .numFive {
  visibility: collapse;
 }

 .point5 {
  margin-top: 0;
  align-items: center;
 }

 .textFive {
  padding-bottom: 0;
 }

 .bth5 {
  margin-top: 0;
 }
}


@media (max-width: 950px) {

  .video-bg {
    display: none; /* Скрываем видео для десктопа */
  }
  .video-bg-mobile {
    display: block;
    position: absolute;
    top: -120px;
    left: 0;
    width: 100%;
    height: 119.4%;
    object-fit: cover;
    z-index: -1;
  }
  .green-background {
    margin-top: 0;
  }

  .footnote {
    display: none
  }


  .contentVideos {
    display: flex;
    flex-direction: column;
    padding-bottom: 0;
    height: 620px;
  }

  .contentVideos h1{
    margin-top: 30px;
    font-size: 30px;
  }

  .contentVideos p{
    font-size: 24px;
  }

  .video-bg {
    height: 119.5%;
  }
}


@media (max-width: 450px) {

  .video-bg {
    display: none; /* Скрываем видео для десктопа */
  }
  .video-bg-mobile {
    
    position: absolute;
    top: -120px;
    left: 0;
    width: 100%;
    height: 119.4%;
    object-fit: cover;
    z-index: -1;
  }




  .contentVideos h1{
    font-size: 23px;
  }

  .contentVideos p{
    font-size: 20px;
  }
}

@media (max-width: 535px) {
.packageConteiner button{
  min-width: 300px;
  max-width: 600px;
}

.contentFooter {
  border: 1px solid #F2C166;
  border-radius: 8px;
}


}


@media (max-width: 656px) {
.packageConteiner img {
  max-width: 100%;
}

}


























.justifidPop {
  max-width: 335px;
   height: auto;
   position: fixed;
   top: 50px;
   right: 160px; /* Позиционируем попап слева */
   padding: 10px;
   background-color: #FFFFFF;
   box-shadow: 6px 6px 4px 0px #F2870540;
   color: #000000;
   border-radius: 5px;
   visibility: hidden; /* Скрытие по умолчанию */
   font-family: Montserrat;
   font-size: 18px;
   font-weight: 300;
   z-index: 1000;
   transition: opacity 0.5s ease, visibility 0.5s ease; /* Плавный переход для visibility */
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   align-items: center;
   display: flex;
 }
 
 .justifidPop.show {
   visibility: visible; /* Сделать видимым */
   opacity: 1;
 }
 
 .justifidPop img {
   width: 20px;
   height: 20px;
   margin-right: 10px;
 }
 
 .justifidPopText {
   flex: 1;
   padding-left: 10px;
 }
 
 /* Адаптивные стили */
 /* Для планшетов */
 @media (min-width: 769px) and (max-width: 1024px) {
   .justifidPop {
     max-width: 335px;/* Уменьшаем ширину попапа на планшетах */
       top: 15px; /* Немного увеличиваем отступ сверху */
       left: 10%; /* Оставляем отступ с левой стороны */
       font-size: 16px; /* Уменьшаем шрифт */
   }
 }
 
 /* Для десктопов */
 @media (min-width: 1025px) {
   .justifidPop {
       max-width: 335px; /* Ширина попапа на компьютерах */
       font-size: 18px; /* Оставляем шрифт таким же */
   }
 }
 
 /* Скрываем попап для мобильных устройств */
 @media (max-width: 768px) {
   .justifidPop {
       display: none; /* Скрываем попап на мобильных */
   }
 }
 

















 