/* В оригинале часть стилей для меню (rec141967002) была инлайном в HTML.
   В нашем SPA их нужно добавить отдельным файлом, чтобы header выглядел 1:1. */

/* В оригинале это меню позиционируется абсолютно (поверх первого экрана),
   а не фиксируется на весь скролл. Иначе оно перекрывает следующий контент. */
#rec141967002 #nav141967002.t228 {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 990;
}

/* HERO: фон всегда с самого верха (иначе появляется чёрная полоса). */
#rec148163333 .t-cover__carrier,
#rec148163333 .t-cover__filter {
  top: 0 !important;
  height: 100vh !important;
}

/* У Tilda по умолчанию cover с background-attachment: fixed + background-color:#000.
   На десктопе это даёт чёрные артефакты при скролле, поэтому для hero отключаем fixed. */
#rec148163333 .t-cover,
#rec148163333 .t-cover__carrier {
  background-attachment: scroll !important;
  /* Верхняя зона до начала картинки должна совпадать с хэдером */
  background-color: #7b7a7a !important;
}

/* Компенсируем высоту хедера: сдвигаем картинку вниз,
   чтобы верх головы не попадал под серую шапку. */
#rec148163333 .t-cover__carrier {
  background-position: right 80px !important;
}

/* Полоса отличалась, потому что её затемнял фильтр-градиент.
   Делаем первые 80px фильтра цветом хэдера, а градиент начинаем ниже. */
#rec148163333 .t-cover__filter {
  background-image: linear-gradient(
    to bottom,
    rgba(123, 122, 122, 1) 0px,
    rgba(123, 122, 122, 1) 80px,
    rgba(0, 0, 0, 0.5) 80px,
    rgba(0, 0, 0, 0.3) 100%
  ) !important;
}

#rec141967002 .tmenu-mobile__burgerlogo a,
#rec141967002 .tmenu-mobile__burgerlogo__title,
#rec141967002 .t228__leftcontainer a,
#rec141967002 .t228__logo,
#rec141967002 a.t-menu__link-item,
#rec141967002 .t228__right_langs_lang a {
  color: #ffffff;
}

#rec141967002 a.t-menu__link-item,
#rec141967002 .t228__right_langs_lang a {
  font-weight: 600;
}

/* Хэдер: постоянный серый фон как ты требовал */
#rec141967002 #nav141967002.t228 {
  background-color: #7b7a7a !important;
}

#rec141967002 .tmenu-mobile {
  background-color: #7b7a7a !important;
}

/* В оригинале меню сначала скрыто и проявляется JS-ом.
   У нас JS tilda-menu не подключён, поэтому делаем список видимым всегда. */
#rec141967002 .t228__list_hidden {
  opacity: 1 !important;
}

/* На всякий случай: не даём глобальным стилям/утилитам менять кнопки в меню */
#rec141967002 .t-btn {
  text-decoration: none;
}

/* For whom (rec139791390): в оригинале текст тёмный */
#rec139791390 .t820__textwrapper .t-name,
#rec139791390 .t820__textwrapper .t-descr {
  color: #141414 !important;
}

/* What you will get (rec139797695): в оригинале весь текст тёмный */
#rec139797695 .t-section__title,
#rec139797695 .t-section__descr,
#rec139797695 .t-card__title,
#rec139797695 .t-card__descr,
#rec139797695 .t-name,
#rec139797695 .t-descr {
  color: #141414 !important;
}

#rec139797695 .t-card__link {
  color: inherit !important;
}

/* How it works (rec140000102): в оригинале тёмный текст */
#rec140000102 .t547__title,
#rec140000102 .t547__descr,
#rec140000102 .t547__link,
#rec140000102 .t-name,
#rec140000102 .t-text {
  color: #141414 !important;
}

/* Training format (rec140014352): в оригинале тёмный текст */
#rec140014352 .t-section__title,
#rec140014352 .t-section__descr,
#rec140014352 .t-card__title,
#rec140014352 .t-card__descr,
#rec140014352 .t-heading,
#rec140014352 .t-descr,
#rec140014352 .t-title,
#rec140014352 .t-text,
#rec140014352 .t-name {
  color: #141414 !important;
}

/* Instructor (rec148156049): в оригинале тёмный текст + серый подзаголовок */
#rec148156049 .t546__title,
#rec148156049 .t546__text,
#rec148156049 .t546__text .t-text,
#rec148156049 .t546__textwrapper,
#rec148156049 .t-heading,
#rec148156049 .t-text,
#rec148156049 .t-name {
  color: #141414 !important;
}

#rec148156049 .t546__descr,
#rec148156049 .t546__descr.t-descr {
  color: #666 !important;
}

/* Course structure (rec140031843): в оригинале тёмный текст */
#rec140031843 .t577__title,
#rec140031843 .t577__descr,
#rec140031843 .t-title,
#rec140031843 .t-name,
#rec140031843 .t-text,
#rec140031843 .t-descr {
  color: #141414 !important;
}

/* Tariffs (rec_sm_tariffs): выравниваем карточки по высоте и кнопки по низу */
#rec_sm_tariffs .t491__content {
  height: 100%;
}

#rec_sm_tariffs .t491__wrapper {
  height: 100%;
  min-height: 200px;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* В оригинальном t491 wrapper — table, а img/title — table-cell. Для tariffs делаем блочную вёрстку */
#rec_sm_tariffs .t491__img,
#rec_sm_tariffs .t491 .t-card__title {
  display: block !important;
  vertical-align: initial !important;
}

/* фиксируем высоту заголовка/описания, чтобы кнопки были на одном уровне */
#rec_sm_tariffs .t-card__title {
  min-height: 32px;
}

#rec_sm_tariffs .t491__img {
  max-height: 44px;
  width: auto;
  height: auto;
}

#rec_sm_tariffs .t-descr {
  width: 100%;
}

#rec_sm_tariffs .t491__wrapper > div:last-child {
  margin-top: auto;
}

/* Desktop: 4 карточки в ряд (даже на 1024px), без tilda-grid margin 20px */
@media screen and (min-width: 980px) {
  #rec_sm_tariffs .t491__container {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  #rec_sm_tariffs .t491__container .t491__col {
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 25% !important;
    max-width: none !important;
    flex: 0 0 25% !important;
    box-sizing: border-box !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}