/* Start:/local/templates/skypark/css/blog-extra.css?17916686636997*/
/* Версия 2026-10-04.2. Меняется с каждым выкатом этого файла: по ней видно, что стоит на сайте. */
/* Блог skypark.ru: стили шаблонов статьи news.detail/blogg и списка блога news.list_and_search/blogg.
   Подключается из их component_epilog.php. styles.css собран gulp'ом в 2021-2023 годах, сборщик не
   работает, поэтому свои правила держим отдельным файлом, как styles-extra.css. */

/* Карточки списка блога (индекс, блок на /news/, «Другие статьи»): обложка и аватар теперь <img
   loading="lazy">, а не фон (шаг 31 техаудита блога). Обложка лежит внизу карточки на всю ширину, как
   раньше фон (background-position-y: bottom, background-size: 100%), и под текстом: z-index: -1 внутри
   собственного контекста карточки, поэтому текст и стрелка остаются поверх. */
.press__item_pic {
  z-index: 0;
}
.press__item_pic .press__img {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  margin: 0;
  pointer-events: none;
}
.person-card__avatar .person-card__img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: inherit;
  object-fit: cover;
  object-position: center;
}

/* Слайдеры статьи: картинка теперь <img>, а не фон. Коробка .photo-slider__photo держит
   пропорцию 1200x672 (padding-bottom: 56%), картинка вписывается в неё так же, как раньше
   фон с background-size: contain. */
.photo-slider__photo .photo-slider__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
  object-position: center;
}

/* Блок «Источники» после текста (ТЗ Д.13): один вид у блока из свойств статьи и у
   section.article-sources, который конвейер кладёт в сам текст. Заголовок наследует h2
   статьи, ссылки наследуют цвет ссылок текста. */
.text_article .article-sources {
  margin-top: 60px;
  padding-top: 30px;
  border-top: 1px solid #E5E5E5;
}
.text_article .article-sources:first-child {
  margin-top: 0;
}
.text_article .article-sources-list {
  margin: 20px 0 0;
  padding-left: 1.5em;
  font-size: 15px;
  line-height: 1.6em;
}
.text_article .article-sources-list li + li {
  margin-top: 10px;
}

/* Блок следующего шага: из статьи на аттракционы (шаг 21 техаудита блога). Серая плашка сайта
   (#F2F2F2, радиус 10px), кнопка штатная .button.button_blue. */
.blog-next-step {
  margin: 30px 0;
  padding: 30px;
  border-radius: 10px;
  background: #F2F2F2;
}
.blog-next-step__title {
  font-size: 20px;
  line-height: 1.25em;
  font-weight: 700;
}
.blog-next-step__text {
  margin: 10px 0 0;
  font-size: 15px;
  line-height: 1.6em;
}
.blog-next-step__button {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .text_article .article-sources {
    margin-top: 30px;
    padding-top: 20px;
  }
  .blog-next-step {
    margin: 20px 0;
    padding: 20px;
  }
  .blog-next-step__title {
    font-size: 17px;
  }
  .blog-next-step__button {
    display: block;
  }
}

/* Перенесено без изменений из встроенного <style> шаблона списка блога (шаг 35 техаудита блога). Тот <style>
   стоял в <body> и действовал на всю страницу: на индексе, на /news/ и в статьях (виджет «Другие статьи»).
   Этот файл подключают те же страницы, и порядок тот же: после styles.css. */
.person-card__avatar {
  width: 30px !important;
  height: 30px !important;
}
.person-card__header {
  margin-left: auto;
  padding: 15px 30px 0px;
  z-index: 0;
}
.person-card__name, .text_showcase {
  font-size: 14px !important;
}
.press__col {
  margin-bottom: 60px;
}
.press__item {
  background-position-y: bottom;
  background-repeat: no-repeat;
  background-size: 100%;
  background-color: transparent;
}
.press__text {
  margin-bottom: 30px;
}
@media (max-width: 767px) {
  .person-card__header {
    margin-right: auto;
    padding: 15px 0px 0px !important;
  }
  .press__col {
    padding: 15px;
  }
  .press__text {
    margin-bottom: 10vh;
  }
}

/* Из встроенного <style> шаблона статьи действовало только это правило: стрелки слайдеров статьи видны всегда
   (jQuery .hide() у слайдера из одного фото его не перебивает). Ограничено слайдером, чтобы не задеть другие
   страницы с этим файлом. */
.photo-slider .opener_white {
  display: block !important;
}

/* Время чтения и просмотры в карточке блога: был серый #7b8691 на белом, контраст 3,7:1; теперь 4,9:1 (шаг 36). */
.blog-card__meta {
  color: #67727d;
}

/* Рубрики блога над списком статей (шаг 23): индекс блога и страницы рубрик. Синий темнее фирменного #00A3E0:
   у текста на белом контраст 5:1, у фирменного 2,9:1. */
.blog-rubrics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 30px;
}
.blog-rubrics__item {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #0077a8;
  border-radius: 20px;
  color: #0077a8;
  font-size: 15px;
  line-height: 1.3;
  text-decoration: none;
  transition: background-color .2s linear, color .2s linear;
}
.blog-rubrics__item:hover,
.blog-rubrics__item:focus-visible,
.blog-rubrics__item_active {
  background-color: #0077a8;
  color: #fff;
}
/* На телефоне восемь кнопок в несколько строк заняли бы треть экрана до первой статьи: один ряд с прокруткой
   вбок, текущую рубрику в нём показывает blog.js. */
@media (max-width: 767px) {
  .blog-rubrics {
    flex-wrap: nowrap;
    gap: 8px;
    margin-bottom: 20px;
    padding-bottom: 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .blog-rubrics::-webkit-scrollbar {
    display: none;
  }
  .blog-rubrics__item {
    flex: 0 0 auto;
    padding: 7px 12px;
    font-size: 14px;
    white-space: nowrap;
  }
}

/* End */
/* /local/templates/skypark/css/blog-extra.css?17916686636997 */