/*
 * pages-blog.css — лента блога. Грузится на страницах со списком
 * записей (виджет Blog Posts нашего плагина).
 *
 * Разрезано 29.08.2026: файл грузился на всех страницах, а работал
 * только своим разделом. Текст правил не тронут — это точный срез
 * прежнего pages.css, порядок сохранён.
 */

/* ==========================================================================
   BLOG
   Партия 2 из 5, перенесена 29.08.2026. 17 правил из main.css.
   Каскад проверен: правил с равной специфичностью, спорящих по общему
   свойству и остающихся ниже в main.css, — ноль.
   ========================================================================== */

.list-item {
  margin:0 0 var(--sp-64);
}

.button_blog {
  display: flex;
  color: #282828;
  background-color: #fff;
  cursor: pointer;
  font-weight: 500;
  font-family: Montserrat, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  white-space: nowrap;
  overflow: visible;
  text-transform: none;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-btn);
  border: 1px solid #343434;
  border-radius: 87px;
}


@media (min-width: 1200px) {
  .button_blog {
      min-width:9.8125rem;
      min-height:3.0625rem;
      padding:var(--sp-8) var(--sp-20);
    }

}
.button_blog:hover {
  border: 1px solid #fff !important;
  background-color: #abcf39 !important;
  color: #fff !important;
}


@media (max-width: 1199px) {
  .button_blog {
      min-width: 157px;
      min-height: 49px;
      padding: var(--sp-8) var(--sp-20);
    }

}
.list-item .item_img img {
  /* Соотношение 16:9 вместо фиксированной высоты — только веб.
   На планшете и ниже высота задана явно, и там aspect-ratio
   не работает: при двух заданных размерах он не применяется. */
  aspect-ratio: 16 / 9;
  object-fit: cover;
  width: 100%;
}

.post__list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap:0 var(--sp-40);
  justify-content: space-between;
  padding-bottom:var(--sp-24);
}


@media (max-width: 767px) {
  .list-item {
      margin: 0 0 var(--sp-40);
    }

  .list-item:last-child {
      margin: 0 0 var(--sp-48);
    }

}

@media (max-width: 1199px) {
  .post__list {
      grid-template-columns: 1fr 1fr;
      gap: 0 var(--sp-32);
    }

}

@media (max-width: 767px) {
  .post__list {
      grid-template-columns: 1fr;
    }

}
@media (max-width: 1199px) {
  .list-item .item_img img {
      height: 220px;
    }

}

@media (max-width: 480px) {
  .list-item .item_img img {
      height: 190px;
    }

}



/* Расщеплено из смешанного правила main.css, партия 5.
   Глобальная половина осталась в main.css: перенос целиком утащил
   бы туда чужой компонент. Специфичность половин не изменилась. */
.button_blog:hover {
  /* Флаг важности снят 29.08.2026: text-decoration для этой кнопки не объявляет
     больше никто. У соседнего правила .button_blog:hover выше по файлу флаги
     оставлены — там в спор влезают правила с состояниями, и доказать
     холостой ход не удалось. */
  text-decoration: none;
}