/* =========================================
   0) БАЗА / УТИЛИТЫ / СЕТКА
   ========================================= */

/* Обнуляем горизонтальные отступы у .vc_row  */
.vc_row { 
  margin-left: 0px; 
  margin-right: 0px;
}

/* Плавная прокрутка на iOS внутри контента */
.wpb-content-wrapper {
  -webkit-overflow-scrolling: touch;
}

/* Тонкая красная линия в герое (статичный бордер по всей ширине)
.hero__border-line{
  position: absolute;
  left: 0;
  top: 130px;
  width: 100%;
  height: 4px;
  z-index: -1;
  background-color: #af0b0b;
} */

.hero__wrapper {
    padding-top: 10px;
}

.hero__right-content {
    z-index: 11;
    padding-top: 40px;
}

/* =========================================
   1) HERO: КОНТЕЙНЕРЫ И СЕТКА
   ========================================= */

.hero{
  margin: 0;
  min-height: 541px;
  position: relative;
}

/* Контейнер для декоративной линии/рамки */
.hero__border-container{
  position: absolute;
  top: 129px;
  left: 0;
}

/* Две колонки: слева текст/характеристики, справа — изображение */
.hero__wrapper{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  height: 85vh;
}

/* Убираем псевдоэлементы, если тема их генерирует */
.hero__wrapper::after,
.hero__wrapper::before{
  display: none;
}

/* Правая колонка (слайдер/картинка) */
.hero__right-content{
  width: 100%;
}

/* =========================================
   2) HERO: ТЕКСТ, ЗАГОЛОВКИ, ССЫЛКИ
   ========================================= */

.hero__title{
  margin-bottom: 20px;
}

.hero__title p{
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 50px;
  line-height: 125%;
  color: #fff;
}
.hh-subtitle {   color: #5f5f63;
    font-size: clamp(14px, 1.25vw, 28px);
    line-height: 1.55;
    margin: .45em 0 .45em;
	text-align: center;}

/* Верхняя строчка с навигационными ссылками в левой части */
.hero__left-text-upper{
  margin-bottom: 5px;
}

.hero__left-text-upper p{
  display: flex;
  gap: 24px;
}

/* Линки с разделителем-квадратиком #af0b0b между ними */
.hero__left-link{
  position: relative;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 14px;
  line-height: 257%;
  color: #fff;
}

.hero__left-link:not(:last-child)::after{
  content: "";
  position: absolute;
  top: 50%;
  right: -8px;
  transform: translate(100%,-50%);
  width: 8px;
  height: 8px;
  background-color: #af0b0b;
}

/* Подзаголовок только для мобильной (по умолчанию скрыт) */
.hero__sub-title-mobile{
  display: none;
}


.information {
	margin-left: 15px;
    margin-right: 15px;
	margin-top: 120px;
    margin-bottom: 120px;
}

@media (max-width: 768px){
  .information { 
    margin-top: 0px;
    margin-bottom: 0px;
  }
}
/* =========================================
   3) HERO: ХАРАКТЕРИСТИКИ (ЛЕВАЯ КОЛОНКА)
   ========================================= */

/* Заголовок секции характеристик */
.hero__left-specifications-title{
  grid-column: span 2;
}

.hero__left-specifications-title p{
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 24px;
  line-height: 208%;
  color: #fff;
}

/* Контейнер характеристик */
.hero__left-specifications{
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  justify-content: center;
  justify-items: center;
}

/* Верхняя строка: значение + иконка + подпись */
.hero__left-specifications-upper{
  width: 100%;
  display: flex;
  gap: 8px;
  align-items: center;
  border-bottom: 1px solid #af0b0b;
  padding: 0 10px 8px 10px;
  justify-content: flex-end;
}

/* Значение (крупное число) */
.hero__left-specifications-num{
  display: flex;
  align-items: center;
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 60px;
  line-height: 77%;
  text-align: right;
  color: #fff;
  gap: 10px;
}

/* Единицы измерения (м² и т.п.) */
.hero__left-specifications-metre{
  font-family: var(--font-family);
  font-weight: 800;
  font-size: 22px;
  line-height: 182%;
  color: #fff;
}

/* Иконка рядом со значением (фиксируем минимальную ширину) */
.hero__left-specifications-upper img{
  min-width: 55px;
}

/* Подпись под значением */
.hero__left-specifications-desk{
  font-weight: 500;
  font-size: 14px;
  line-height: 114%;
  text-align: center;
  color: #fff;
}

/* Блок с дополнительной сеткой текста/пунктов */
.hero__left-specifications-info{
  padding-left: 20px;
  margin-left: -15px;
  padding-top: 30px;
  margin-bottom: -4px;
}

/* Сетка на 2 колонки внутри info */
.hero__left-specifications-info > .wpb_column > .vc_column-inner > .wpb_wrapper{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
/*  padding-right: 75px; */
}

/* Подгоняем ширину внутреннего контейнера под контент */
.hero__left-specifications-info > .wpb_column > .vc_column-inner{
  width: fit-content;
}

/* Текстовые пункты в сетке (фиксируем минимальную ширину) */
.hero__left-specifications-text{
  min-width: 203px;
}

/* Контент левой колонки в целом */
.hero__left-content{
  width: fit-content;
}

/* =========================================
   4) HERO: ИЗОБРАЖЕНИЯ (ПРАВАЯ КОЛОНКА)
   ========================================= */

.hero__img > .vc_figure{ width: 100%; }
.hero__img > .vc_figure > .vc_single_image-wrapper{ width: 100%; }

.hero__img > .vc_figure > .vc_single_image-wrapper img{
  width: 100%;
  max-height: 530px;
  border-radius: 12px;
}


/* Контейнер с изображением (нижний отступ и ограничение по высоте) */
.hero__img-container{
  padding-bottom: 33px;
  max-height: 530px;
}

/* =========================================
   5) ГЕРОЙ — МОБИЛЬНЫЙ ВАРИАНТ h-160__
   ========================================= */

/* Вся мобильная секция скрыта по умолчанию — показываем в @media */
.h-160__hero-mobile{
  display: none;
  padding-top: 20px;
}

.h-160__hero-mobile .wpb_wrapper{
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Строка с краткими характеристиками (мобайл) */
.h-160__hero-mobile-info{
  display: flex;
  align-items: center;
  margin-top: 0px;
}

/* Числовое значение слева (мобайл) */
.h-160__hero-mobile-info-value{
  width: 60px;
  align-items: center;
  display: flex;
  gap: 3px;
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 18px;
  line-height: 75%;
  text-align: right;
}

/* Единицы измерения (мобайл) */
.h-160__hero-mobile-value-metre{
  font-family: var(--font-family);
  font-weight: 800;
  font-size: 18px;
  line-height: 209%;
}

/* Правая подпись с иконкой (мобайл) */
.h-160__hero-mobile-info-right{
  align-items: center;
  display: flex;
  width: 122px;
  gap: 5px;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 12px;
  line-height: 114%;
}

.h-160__hero-mobile-info-right img{
  padding-right: 5px;
  width: 35px;
  height: 35px;
  border-right: 2px solid #af0b0b;
}

/* =========================================
   6) ГАЛЕРЕЯ / СВАЙПЕР (точки, заголовки)
   ========================================= */

/* Общая прозрачность контейнера точек */
.swiper__gallery .wpcp-swiper-dots{
  opacity: 0.6;
}

/* Все точки пагинации */
.swiper__gallery .wpcpro-wrapper .wpcp-carousel-section 
.wpcp-swiper-dots.wpcp-pagination-strokes 
.swiper-pagination-bullet{
  width: 7px;
  height: 7px;
  margin: 0 4px;
  border-radius: unset;
  background-color: #fff;
  opacity: 0.6;
}

/* Активная точка пагинации — красная */
.swiper__gallery .wpcpro-wrapper .wpcp-carousel-section 
.wpcp-swiper-dots.wpcp-pagination-strokes 
.swiper-pagination-bullet.swiper-pagination-bullet-active{
  background-color: #af0b0b !important;
  width: 7px;
  height: 7px;
}

/* Подзаголовок над слайдером */
.gallery__swiper-title h6{
  font-weight: 500;
    font-size: 24px;
    line-height: 150%;
    text-transform: none;
   color: #000;
}

/* Большой заголовок секции галереи */
.gallery__title p{
  font-weight: 400;
  font-size: 40px;
  line-height: 90%;
  text-transform: uppercase;
  color: #000;
}
.inform-main {padding: 90px 150px 90px 150px;}
.inform-main-title {color: #000000; font-size: clamp(21px, 3.3vw, 48px);font-weight: 500;line-height: 125%; padding: 0px 0px 60px 0px;}
.sliders {padding: 0px 60px 0px 60px;}
.galleryinf {padding: 60px 90px 90px 90px;}
.galleryinf-title {font-weight: 500; font-size: 45px; line-height: 125%;}
.galleryinf-img {padding: 0px 30px 0px 0px;}
.galleryinf-text {padding: 0px 0px 0px 0px;    align-items: flex-start;}
.galleryinf-text strong {font-size: clamp(18px, 3.3vw, 28px);line-height: 125%;     font-weight: 500;}
.galeryinf-2 {padding: 40px 90px 90px 60px;}
.information-3 {padding: 30px 180px 30px 180px;}
.wpb_single_image img {border-radius: 20px;}

@media (max-width: 768px){
	.galleryinf-title {font-size: 22px; margin-top: -30px;}
	.galleryinf-text {padding: 0px 10px 40px 10px;}
	.galleryinf p {font-size: clamp(12px, 3.3vw, 48px);}
	.content ul {font-size: clamp(12px, 3.3vw, 48px)}
	.inform-main {padding: 0px 10px 0px 10px;}
	.galleryinf {padding: 25px 15px 0px 15px;}
	.galeryinf-2 {padding: 40px 15px 40px 15px;}
	.information-3{padding: 10px 10px 20px 10px;}
	.hhv2 {display:none;}
	.sliders {padding: 0px 15px 0px 15px;}
	.inform-main-title { text-align: center;padding: 0px 0px 20px 0px;}
	.galleryinf-img {padding: 0px 0px 0px 0px;}
	.inform-main p {font-size: clamp(12px, 3.3vw, 48px)}
	.content ol {font-size: clamp(12px, 3.3vw, 48px)}
}

/* =========================================
   7) АДАПТИВ: БОЛЬШИЕ ЭКРАНЫ / СРЕДНИЕ
   ========================================= */

/* До 1439px — перестройка обёртки и картинок */
@media (max-width: 1439px){
  /* Прячем правое изображение-контейнер (если есть модификатор .right) */
  .hero__img-container.right{
    display: none;
  }
  /* Средний контейнер становиться авто */
  .hero__img-container.middle{
    width: auto;
  }
  .hero__left-content{
    width: auto;
  }
  .hero__wrapper{
    display: flex;
    align-items: center;
  }
}

/* До 1280px — упрощаем правую колонку, уменьшаем заголовок в галерее */
@media (max-width: 1280px){
  .hero__right-content{
    display: none;
  }
  .gallery__swiper-title h6{
    font-size: 16px;
  }
}

/* До 1024px — галерея в колонку */
@media (max-width: 1024px){
  .gallery{
    flex-direction: column;
  }
  .gallery .vc_col-sm-4{
    width: 100% !important;
  }
}

/* =========================================
   8) АДАПТИВ: МОБИЛЬНЫЕ (≤768px)
   ========================================= */

@media (max-width: 768px){

  /* Снимаем минимальную высоту у героя */
  .hero { 
    min-height: 0px; 
	padding-bottom: 20px;
  }
  .h-160__hero-mobile-info-value {font-size: 14px;}
  .h-160__hero-mobile-info-right {font-size: 11px;}
  .h-160__hero-mobile-value-metre {font-size: 12px;}

  /* Убираем паддинги у колонок WPBakery */
  .vc_column_container>.vc_column-inner { 
    padding-left: 0px; 
    padding-right: 0px;
  }

  /* Показываем мобильный блок и убираем отступ сверху */
  .h-160__hero-mobile{
    display: block;
    padding-top: 0px;
  }

  /* Компактнее заголовки и отступы */
  .hero__title { margin-bottom: 0px; }
  .hero__left-content { padding-top: 0px; }

  /* Скрываем длинную бордер-линию */
  .hero__border-line{
    display: none;
  }

  /* Возвращаем правую колонку (если скрывали), ставим её первой */
  .hero__right-content{
    display: block;
    order: 1;
	padding-top: 0px;
  }

  /* Левая колонка — второй блок по порядку */
  .hero__left-content{
    display: block;
    order: 2;
  }

  /* Размер шрифта заголовка галереи ниже */
  .gallery__title p{
    font-size: 24px;
  }

  /* Герой во всю ширину (с компенсацией паддингов контейнера темы) */
  .hero__wrapper{
    flex-direction: column;
    margin-left: -30px;
    margin-right: -30px;
	padding-top: 0px;
	      height: auto;
  }

  /* Правый контейнер изображения снова показываем (если был .right) */
  .hero__img-container.right{
    display: block;
  }

  /* Убираем декоративные бордеры/смещения в характеристиках для мобилки */
  .hero{
    border: none;
  }
  .hero__left-specifications-info{
    border: none;
    padding: 0;
    margin: 0;
  }

  /* Ширина левого контента — на всю */
  .hero__left-content{
    width: 100%;
  }

  /* Прячем верхний ряд навигационных ссылок */
  .hero__left-text-upper{
    display: none;
  }

  /* Центрируем основной контент левой колонки */
  .hero__left-content > .vc_column-inner > .wpb_wrapper{
    display: flex;
    align-items: center;
    justify-items: center;
    flex-direction: column;
  }

  /* Сетка характеристик — в одну колонку */
  .hero__left-specifications-info > .wpb_column > .vc_column-inner > .wpb_wrapper{
    padding-right: 0;
    grid-template-columns: 1fr;
  }

  /* Заголовок характеристик — без span 2 */
  .hero__left-specifications-title{
    grid-column: auto;
  }

  /* Размеры шрифтов для мобильной */
  .hero__title p{
    font-size: 24px;
  }
  .hero__left-specifications-title p{
    text-align: center;
    font-size: 16px;
  }
  .hero__left-specifications-upper{
    justify-content: center;
  }

  /* Прячем подробную сетку характеристик на мобильной */
  .hero__left-specifications-info{
    display: none;
  }

  /* Включаем подзаголовок для мобильной версии */
  .hero__sub-title-mobile{
    display: block;
  }

  .hero__sub-title-text p{
    font-weight: 400;
    font-size: 16px;
    line-height: 208%;
    text-align: center;
    padding-bottom: 20px;
  }

  .hero__sub-title-text{
    margin: 0;
  }

  /* Сжимаем общий нижний отступ секции hero */
  .hero{
    margin-bottom: 15px;
  }
}



/* ===== Hilbert Lists v1.1 — цвет цифр и пульс-буллеты ===== */
:root{ --hh-accent:#af0b0b; }

/* Нумерованные: гарантируем наличие маркеров */
.content ol{ list-style: decimal !important; padding-left: 1.6em; margin:0 0 1.2em; }
.content ol>li{ margin:0 0 .6em; }
/* Красим цифры; убиваем возможные переопределения темой */
.content ol>li::marker{ color:#000!important; font-weight:600; }

/* Маркированные: квадраты с пульсом (не зависит от list-style) */
.content ul{ list-style:none; padding-left:0; margin:0 0 1.2em; }
.content ul>li{ position:relative; padding-left:1.2em; margin:0 0 .55em; }
.content ul>li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:.55em; height:.55em; background:var(--hh-accent); border-radius:2px;
  animation:hhv-pulse 2.2s ease-in-out infinite; will-change:transform, box-shadow;
}