/* Обновление CSS для баннера - центрирование контента */

/* Основной контейнер баннера */
.banner__three-content {
  position: relative;
  z-index: 1;
  /* Убираем адаптивные отступы и центрируем контент */
  padding-block: 0;
  padding-inline: clamp(16px, 4vw, 50px);
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; /* Центрируем по горизонтали */
  text-align: center; /* Центрируем текст */
  gap: clamp(10px, 2vh, 18px);
  margin: 0;
  visibility: hidden;
  min-height: 100vh; /* Занимаем всю высоту экрана */
}

/* Заголовок */
.banner__three-content h1 {
  margin-top: 150px;
  color: var(--text-white);
  font-size: clamp(38px, 6vw, 60px);
  line-height: clamp(44px, 6.8vw, 70px);
  max-width: min(960px, 95%);
  font-weight: 700;
  text-align: center; /* Явно центрируем заголовок */
}

.banner__three-content h1 span {
  color: var(--secondary-color);
}

/* Описание */
.banner__three-content p {
  margin: 0;
  padding-top: clamp(8px, 2vh, 20px);
  color: var(--text-white);
  max-width: min(960px, 95%);
  font-size: clamp(18px, 3vw, 30px);
  line-height: clamp(26px, 4vw, 44px);
  text-align: center; /* Центрируем текст описания */
}

/* Контейнер кнопок */
.banner__three-content-button {
  margin-top: clamp(16px, 3vh, 40px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center; /* Центрируем кнопки */
  gap: clamp(10px, 2.5vw, 30px);
  width: 100%;
}

/* Дополнительное правило для мобильных устройств */
@media (max-width: 768px) {
  .banner__three-content {
    padding-inline: 20px;
  }

  .banner__three-content h1 {
  margin: 0;
}
  
  .banner__three-content-button {
    flex-direction: column;
    gap: 15px;
  }
  
  .banner__three-content-button .default_button {
    width: auto;
    min-width: 200px;
  }
}

/* Для очень узких экранов */
@media (max-width: 480px) {
  .banner__three-content-button {
    gap: 12px;
  }
  
  .banner__three-content-button .default_button {
    min-width: 180px;
  }
}

/* Панель по умолчанию прозрачная */
.site-header .header-inner {
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

/* Текст по умолчанию белый */
.site-header .header__area-menubar-center-menu ul li a,
.site-header .menu__bar i,
.site-header .language-switcher .current-language {
    color: #ffffff !important;
}

/* При скролле - белый фон */
.site-header.scrolled .header-inner {
    background: rgba(255,255,255,0.95) !important;
    box-shadow: 0 6px 24px rgba(0,0,0,0.08) !important;
    backdrop-filter: blur(8px) !important;
}

/* При скролле - темный текст */
.site-header.scrolled .header__area-menubar-center-menu ul li a,
.site-header.scrolled .menu__bar i,
.site-header.scrolled .language-switcher .current-language {
    color: #152022 !important;
}

/* Подчеркивание активного пункта меню по умолчанию белое */
.header__area-menubar-center-menu ul li.active a::after {
    background: #ffffff !important;
}

/* Подчеркивание при наведении по умолчанию белое */
.header__area-menubar-center-menu ul li a:hover::after {
    background: #ffffff !important;
}

/* При скролле подчеркивание темно-синее */
.site-header.scrolled .header__area-menubar-center-menu ul li.active a::after,
.site-header.scrolled .header__area-menubar-center-menu ul li a:hover::after {
    background: var(--primary-color-2) !important;
}

@media (max-width: 520px) {
  .header__area-menubar-left-logo a img {
    max-width: 100px;
  }
}

/* Карточка */
.services__one-item {
  display: flex;
  flex-direction: row;   /* иконка слева, текст справа */
  align-items: flex-start;
  height: 100%;
  gap: 20px; /* расстояние между иконкой и текстом */
}

/* Иконка фиксированная */
.services__one-item-icon {
  flex: 0 0 auto;
  font-size: 42px; /* можно подогнать размер */
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Контент тянется и выравнивает текст */
.services__one-item-content {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}


.process__area-list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch; /* тянет все items */
  gap: 30px; /* если нужен промежуток между карточками */
}

.process__area-item {
  flex: 1 1 0;        /* все шаги равной ширины */
  display: flex;      /* делаем flex, чтобы вложенное тянулось */
  flex-direction: column;
}

.process__area-item-area {
  flex: 1;            /* заставляем внутреннюю область тянуться */
  display: flex;
  flex-direction: column;
}

/* Сетка тянет колонки */
.services__page .row{display:flex;flex-wrap:wrap;align-items:stretch;}
.services__page .col-lg-4,.services__page .col-md-6{display:flex}

/* Карточка */
.services__three-item{
  display:flex;
  flex-direction:column;
  height:100%;
  background:var(--bg-white);
  border-radius:15px;
  overflow:hidden; /* чтобы картинка и контент повторяли скругление */
  box-shadow:0 6px 16px rgba(0,0,0,.06); /* тень карточки */
  border:1px solid rgba(0,0,0,.06);      /* лёгкая обводка */
}

/* Изображение сверху (скругление уже у wrapper, у img убираем) */
.services__three-item-image img{
  width:100%;
  object-fit:cover;
  border-radius:0;            /* было 15px 15px 0 0 — больше не нужно */
  display:block;
}

/* Контент тянется, без собственной тени */
.services__three-item-content{
  flex:1 1 auto;
  padding:25px 30px 30px;
  background:var(--bg-white);
  box-shadow:none;            /* убираем внутреннюю «ступеньку», из-за неё и был конфликт */
  border-radius:0;            /* скругление уже у wrapper */
  position:relative;
}

/* Кнопка вниз */
.services__three-item-content .more_btn{margin-top:auto}

