/* Блог blendor.io: /blog, /blog/<слаг> и блок «From our blog» на главной.
   Цвета и карточки — как у сайта (style3.css: зелёный #29b672, .news-item-box). */

.blog { padding-bottom: 2rem; }
.blog__empty { margin: 2rem 0; }

.blog-grid {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem;
	margin: 2rem 0 1rem;
}
@media (max-width: 991px) {
	.blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
}
@media (max-width: 639px) {
	.blog-grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; margin-top: 1.5rem; }
}

/* карточка */
.blog-card {
	display: flex; flex-direction: column; min-width: 0; overflow: hidden;
	background-color: #fff; border-radius: 1.125rem;
	box-shadow: 0 .25rem 1.25rem 0 rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.02);
	transition: box-shadow .2s ease, transform .2s ease;
}
.blog-card:hover { box-shadow: 0 .5rem 2rem 0 rgba(0, 0, 0, 0.09), 0 0 0 1px rgba(0, 0, 0, 0.02); transform: translateY(-2px); }

.blog-card__cover { display: block; aspect-ratio: 4 / 3; background-color: #eef0f1; overflow: hidden; }
.blog-card__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }

.blog-card__body { padding: 1.25rem 1.5rem 1.5rem; }
.blog-card__meta { font-size: .875rem; margin-bottom: .5rem; }
.blog-card__title { font-size: 1.25rem; line-height: 1.35; margin: 0 0 .5rem; letter-spacing: 0; }
.blog-card__title a { color: inherit; }
.blog-card__title a:hover { color: #29b672; }
.blog-card__excerpt { font-size: .9375rem; line-height: 1.55; color: #707473; margin: 0; }

@media (max-width: 767px) {
	.blog-card { border-radius: .5rem; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); }
	.blog-card__body { padding: 1rem; }
	.blog-card__title { font-size: 1.125rem; }
}

/* пагинация */
.blog-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 2.5rem 0 1rem; }
.blog-pagination a, .blog-pagination span {
	min-width: 2.5rem; padding: .5rem .875rem; border-radius: 1.25rem; text-align: center; line-height: 1.5;
}
.blog-pagination a { color: inherit; background-color: #fff; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); }
.blog-pagination a:hover { color: #fff; background-color: #29b672; box-shadow: none; }
.blog-pagination__current { color: #fff; background-color: #29b672; font-weight: bold; }
.blog-pagination__gap { color: #8b8c8c; }

/* статья */
.blog-article { max-width: 50rem; }
.blog-article__meta { margin: 2rem 0 .5rem; }
.blog-article .title { font-size: 2.4rem; }
@media (max-width: 767px) {
	.blog-article .title { font-size: 1.75rem; }
}
.blog-article__hero { display: block; width: 100%; height: auto; border-radius: 1.125rem; margin: 0 0 1rem; }

.blog-article__body { font-size: 1.0625rem; line-height: 1.7; overflow-wrap: break-word; }
.blog-article__body h2 { font-size: 1.75rem; line-height: 1.25; }
.blog-article__body h3 { font-size: 1.375rem; line-height: 1.3; }
.blog-article__body h4 { font-size: 1.125rem; margin: 1.5rem 0 .75rem; }
.blog-article__body img { max-width: 100%; height: auto; border-radius: .5rem; }
.blog-article__body a { text-decoration: underline; }
.blog-article__body ol { padding-left: 1.5rem; margin-bottom: 1.5rem; }
.blog-article__body ol > li { margin-top: .4rem; }
.blog-article__body blockquote { margin: 0 0 1.5rem; padding: .25rem 0 .25rem 1.25rem; border-left: 3px solid #29b672; color: #707473; }
.blog-article__body table { width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; font-size: .9375rem; }
.blog-article__body th, .blog-article__body td { border: 1px solid rgba(0, 0, 0, 0.1); padding: .5rem .75rem; text-align: left; vertical-align: top; }
.blog-article__body th { background-color: #fff; }
/* широкая таблица листается сама, страница не ездит вбок */
@media (max-width: 767px) {
	.blog-article__body table { display: block; overflow-x: auto; }
}

/* эксперт */
.blog-expert { margin: 2rem 0 1rem; padding: 1.5rem 1.75rem .5rem; background-color: #E9F8F1; border-radius: 1.125rem; }
.blog-expert__name { font-size: 1.25rem; font-weight: bold; }
.blog-expert__pos { margin-bottom: .75rem; }
.blog-expert .blog-expert__text { margin: 0; line-height: 1.65; }
.blog-expert .blog-expert__text h2, .blog-expert .blog-expert__text h3 { font-size: 1.25rem; margin: 1rem 0 .5rem; }

/* related */
.blog-related { margin: 3rem 0 2rem; padding-top: 2.5rem; border-top: 1px solid rgba(0, 0, 0, 0.1); }
.blog-related__title, .blog-latest__title { font-size: 2rem; margin: 0; }
@media (max-width: 767px) {
	.blog-related__title, .blog-latest__title { font-size: 1.5rem; }
}

/* главная */
.blog-latest { margin: 3.5rem 0 2rem; }
.blog-latest__more { text-align: center; margin: 2rem 0 0; }
.blog-latest__more .btn { display: inline-block; }
