/* ============================================================================
   АРХИВ РУБРИКИ «СТАТЬИ» — /category/статьи/
   Живой класс body: archive category category-1 … woodmart-archive-blog …
   Переодеваем штатный masonry-цикл Woodmart в карточки макета (.acard).
   Разметка не меняется, только стили.

   ПРОВЕРЕНО по живому html и по css темы (скачаны blog-loop-base-old.min.css и
   blog-loop-design-masonry.min.css):
   порядок подключения bt-styles → menu → vnedrenie → stati → js_composer →
   bootstrap-light → base.min.css → … → blog-loop-design-masonry.min.css,
   то есть css темы идёт ПОСЛЕ наших — поэтому селекторы длинные.
   !important оставлен ТОЛЬКО там, где спорят inline-стили isotope
   (isotope-bundle.min.js и wd-masonry-layout-js на странице подключены).
   ============================================================================ */

/* Полоса контента от шапки до подвала — фон макета (--base #FAFAF9).
   .main-page-wrapper открывается СРАЗУ ПОСЛЕ </header> и закрывается ДО
   <footer class="footer-container"> — проверено по живому html, шапку и подвал
   правило не задевает. */
body.woodmart-archive-blog.category-1 .main-page-wrapper {
	background: #FAFAF9;
	padding-bottom: 44px;
}

/* --- Хлебные крошки --------------------------------------------------------
   ВАЖНО: блок .page-title на этой странице имеет класс title-design-disable,
   а тема в page-title.min.css задаёт .title-design-disable{display:none} —
   то есть крошки сейчас СКРЫТЫ. В макете крошки есть (.crumbs), поэтому
   показываем блок явно. Внутри .page-title на этой странице лежат ТОЛЬКО
   .container > .breadcrumbs и наш h1.bt-arhiv-h1 (с 28.09.2026) — проверено по html.
   Не нужны крошки — удалить это правило, остальное не пострадает. */
body.woodmart-archive-blog.category-1 .page-title.title-design-disable {
	display: block;
	margin: 0;
	padding: 14px 0 0;
	background: none;
}

body.woodmart-archive-blog.category-1 .page-title .container {
	margin-bottom: 0;
}

body.woodmart-archive-blog.category-1 .page-title .breadcrumbs {
	margin: 0;
	font: 400 13px/1.4 'Golos', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	color: #6B7480;
}

body.woodmart-archive-blog.category-1 .page-title .breadcrumbs a {
	color: #6B7480;
	text-decoration: none;
}

body.woodmart-archive-blog.category-1 .page-title .breadcrumbs a:hover {
	color: #CF000D;
	text-decoration: underline;
}

body.woodmart-archive-blog.category-1 .page-title .breadcrumbs .current {
	color: #16181D;
	font-weight: 600;
}

/* --- H1 рубрики (28.09.2026, Лабрика «страницы без H1») ---------------------
   Выводит functions.php дочерней темы через хук woodmart_page_title_after_title —
   в разметке он стоит ПЕРЕД .breadcrumbs. В макете (.art-hero) сначала крошки,
   потом заголовок, поэтому контейнер — колонка, H1 уходит вниз через order.
   Цвет задан явно: у блока color-scheme-light, тема красит текст в белый. */
body.woodmart-archive-blog .page-title .container:has(> .bt-arhiv-h1) {
	display: flex;
	flex-direction: column;
}

body.woodmart-archive-blog .page-title .bt-arhiv-h1 {
	order: 2;
	margin: 16px 0 4px;
	font: 800 38px/1.12 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	letter-spacing: -.02em;
	color: #16181D;
	text-transform: none;
}

@media (max-width: 767px) {
	body.woodmart-archive-blog .page-title .bt-arhiv-h1 {
		margin-top: 12px;
		font-size: 28px;
	}
}

/* --- Сетка карточек --------------------------------------------------------
   Холдер — .row с колонками col-lg-4 и masonry-container. Делаем ровную сетку
   3 × 16px как .arts в макете. minmax(0,1fr) — защита от горизонтального
   вылета на длинных словах. Отрицательные поля .row (-15px) снимаются обычным
   margin: у нашего селектора 5 классов, у .row один — !important не нужен. */
body.woodmart-archive-blog.category-1 .site-content .wd-blog-holder {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 24px 0 0;
	padding: 0;
	/* height и position isotope пишет в inline-стиль — только здесь !important */
	height: auto !important;
	position: static !important;
}

/* Карточка-обёртка: гасим колоночную ширину Bootstrap и абсолютное
   позиционирование isotope. left/top/transform/position приходят инлайном —
   им !important нужен; width/max-width/padding/margin спорят только с
   классами Bootstrap (.col-lg-4 = 1 класс), там !important лишний. */
body.woodmart-archive-blog.category-1 .wd-blog-holder > article.blog-post-loop {
	position: relative !important;
	left: auto !important;
	top: auto !important;
	transform: none !important;
	width: auto;
	max-width: none;
	min-width: 0;
	margin: 0;
	padding: 0;
	display: flex;
	background: none;
	box-shadow: none;
	border: 0;
}

/* Тело карточки: белая плитка с рамкой и радиусом 16px — как .bt-root .acard.
   Цвета взяты из styles.css комплекта (--panel #FFFFFF, --line #E6E9EE,
   --line-hover #CDD4DD). Переменные объявлены на .bt-root, а этот блок вне
   .bt-root, поэтому значения записаны числом, а не var(). */
body.woodmart-archive-blog.category-1 .wd-blog-holder > article.blog-post-loop .article-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	overflow: hidden;
	background: #FFFFFF;
	border: 1px solid #E6E9EE;
	border-radius: 16px;
	box-shadow: none;
	padding: 0;
	margin: 0;
	text-align: left;
	transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

/* Красная полоса, выезжающая по верху карточки на наведении — приём .acard::before */
body.woodmart-archive-blog.category-1 .wd-blog-holder > article.blog-post-loop .article-inner::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	height: 3px;
	width: 0;
	background: #CF000D;
	transition: width .2s ease;
}

/* Свой ховер вместо теневого ховера темы
   (.blog-design-masonry.blog-style-shadow:hover .article-inner{box-shadow:0 0 9px}) */
body.woodmart-archive-blog.category-1 .wd-blog-holder > article.blog-post-loop .article-inner:hover {
	border-color: #CDD4DD;
	box-shadow: 0 12px 30px rgba(20, 26, 35, .09);
	transform: translateY(-2px);
}

body.woodmart-archive-blog.category-1 .wd-blog-holder > article.blog-post-loop .article-inner:hover::before {
	width: 100%;
}

/* --- Обложка сверху --------------------------------------------------------
   В макете картинки в карточке нет вовсе, но в живой разметке она есть у всех
   10 статей — оставляем как верхнюю обложку постоянной высоты, иначе карточки
   разъедутся. Размер задаём самой картинке: на figure.entry-thumbnail висит
   data-owl-carousel, и после инициализации owl картинка окажется глубже. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-header {
	margin: 0;
	padding: 0;
	border: 0;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-thumbnail {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	overflow: hidden;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .post-img-wrapp {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-bottom: 1px solid #E6E9EE;
	border-radius: 0;
	overflow: hidden;
}

/* Тема двигает ссылку на -2px и вешает поверх картинки тёмную плёнку
   (.post-img-wrapp a:after{background:rgba(0,0,0,.5)} при наведении).
   В макете затемнения нет — гасим плёнку и возвращаем нулевой отступ. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .post-img-wrapp a {
	display: block;
	margin: 0;
	transition: transform .4s ease;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .post-img-wrapp a::after {
	content: none;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-thumbnail img {
	display: block;
	width: 100%;
	height: 210px;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}

/* Три белые точки темы поверх обложки макету не нужны */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .post-image-mask {
	display: none;
}

/* --- Текстовая часть -------------------------------------------------------
   Колонка на всю оставшуюся высоту, чтобы ссылка «Продолжить чтение»
   прижималась к низу и карточки в ряду были ровными.
   Тема даёт .article-body-container{padding:25px;text-align:center;
   background:#fff;border-radius:var(--wd-brd-radius)} — перекрываем всё. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .article-body-container {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
	padding: 18px 20px 20px;
	margin: 0;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
	text-align: left;
}

/* Заголовок статьи — Onest 700, графит, как .acard__t.
   Шрифты Onest и Golos подключены в styles.css комплекта, он грузится на этой
   странице (bt-styles-css) — проверено по живому html. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .wd-entities-title.post-title {
	font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	font-weight: 700;
	font-size: 17px;
	line-height: 1.32;
	letter-spacing: -.01em;
	color: #16181D;
	margin: 0 0 10px;
	padding: 0;
	text-align: left;
	text-transform: none;
	overflow-wrap: anywhere;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .wd-entities-title.post-title a {
	color: inherit;
	text-decoration: none;
	transition: color .15s ease;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner:hover .wd-entities-title.post-title a {
	color: #CF000D;
}

/* Краткий текст — Golos 14px. Внутри .entry-content лежит голый текстовый узел
   и следом <p class="read-more-section"> — колонка нужна, чтобы ссылка ушла
   вниз через margin-top:auto. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-content {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
	font: 400 14px/1.55 'Golos', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	color: #3C424B;
	margin: 0;
	padding: 0;
	text-align: left;
	overflow-wrap: anywhere;
}

/* --- Ссылка «Продолжить чтение» — красная, внизу карточки ------------------- */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-content .read-more-section {
	margin: auto 0 0;
	padding: 14px 0 0;
	line-height: 1;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .read-more-section a.btn-read-more {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	font-weight: 700;
	font-size: 13.5px;
	line-height: 1;
	color: #CF000D;
	background: none;
	border: 0;
	padding: 0;
	text-decoration: none;
	text-transform: none;
	transition: color .15s ease;
}

/* Стрелка вместо иконки темы. У темы уже есть .read-more-section a:after —
   абсолютный, left:100%, height:5px, opacity:0, шрифт "woodmart-font",
   на ховере анимация wd-ShakeNext. Одной сменой content это не лечится:
   гасим ВСЕ его свойства, иначе стрелка окажется невидимой и за краем. */
body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .read-more-section a.btn-read-more::after {
	content: "→";
	position: static;
	display: inline-block;
	margin: 0;
	width: auto;
	height: auto;
	opacity: 1;
	font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	animation: none;
	transition: transform .16s ease;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner:hover .read-more-section a.btn-read-more {
	color: #A80009;
}

body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner:hover .read-more-section a.btn-read-more::after {
	opacity: 1;
	animation: none;
	transform: translateX(3px);
}

/* --- Пагинация — вид .apager из макета -------------------------------------
   Живая разметка: div.wd-loop-footer.blog-footer > nav.wd-pagination > ul > li >
   span.current.page-numbers | a.page-numbers. Отдельного css пагинации на
   странице не подключено, но base.min.css даёт ul{padding-left:17px;
   margin-bottom:20px} — обнуляем. */
body.woodmart-archive-blog.category-1 .wd-loop-footer.blog-footer {
	margin-top: 26px;
	padding: 0;
	border: 0;
	text-align: left;
}

body.woodmart-archive-blog.category-1 .wd-loop-footer .wd-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
	justify-content: flex-start;
}

body.woodmart-archive-blog.category-1 .wd-loop-footer .wd-pagination ul li {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.woodmart-archive-blog.category-1 .wd-loop-footer .wd-pagination ul li .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1.5px solid #E6E9EE;
	border-radius: 10px;
	background: #FFFFFF;
	font: 700 14px/1 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
	color: #16181D;
	text-decoration: none;
	box-shadow: none;
	transition: border-color .15s ease, color .15s ease;
}

body.woodmart-archive-blog.category-1 .wd-loop-footer .wd-pagination ul li a.page-numbers:hover {
	border-color: #CF000D;
	color: #CF000D;
	background: #FFFFFF;
}

body.woodmart-archive-blog.category-1 .wd-loop-footer .wd-pagination ul li span.current.page-numbers {
	background: #CF000D;
	border-color: #CF000D;
	color: #FFFFFF;
}

/* --- Адаптив: те же точки, что у .arts в комплекте (1080 / 560) ------------- */
@media (max-width: 1080px) {
	body.woodmart-archive-blog.category-1 .site-content .wd-blog-holder {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	body.woodmart-archive-blog.category-1 .site-content .wd-blog-holder {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
	}

	body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .entry-thumbnail img {
		height: 180px;
	}

	/* тема на ≤576px сама ставит padding 15px по бокам — перекрываем своим */
	body.woodmart-archive-blog.category-1 .wd-blog-holder .article-inner .article-body-container {
		padding: 16px 16px 18px;
	}
}