/**
 * Служебные страницы и блог: page.php (.text-page), home.php / archive.php / index.php (.articles),
 * single.php (.article и «Другие статьи» .articles--related), search.php (.search-page), 404.php (.not-found),
 * «Текстовый блок» конструктора (.text-page--section) и типографика контента .entry. Дизайна этих страниц в вёрстке
 * нет — всё собрано из её блоков:
 *   - отступы секций, h1 и маркированный список — как у «Оплаты» (.payment);
 *   - заголовки и абзацы контента — по SEO-тексту (.seo: h2 uppercase / 600, h3 1.8rem / 600); h2 — 2.4rem, а не 3rem,
 *     чтобы под h1 страницы (3.8rem) читалась иерархия;
 *   - таблица — строки с серыми линиями, как «Характеристики» товара (.specs__row);
 *   - первый экран статьи — сетка .partnership__top (текст | фото 55.2rem), фото — размеры .seo__picture;
 *   - карточки — .article-card из «Экспертных материалов» (стили в style.css) в сетке по ширине их слайда;
 *   - пагинация — .pagination из category.html, стрелка «назад» .pagination__prev — общая с каталогом (smd-shop.css);
 *   - пустые состояния — белая плашка, как пустой список каталога.
 * Подключается только на этих шаблонах (inc/blog.php) и на страницах с «Текстовым блоком» (inc/flex-generic.php).
 * Стили блоков Gutenberg WordPress печатает после стилей темы, поэтому правила для них написаны с запасом
 * специфичности (.entry + элемент/класс блока).
 */

/* ---------- Секции ---------- */

.text-page,
.articles,
.article,
.search-page,
.not-found {
	padding-top: 3rem;
	padding-bottom: var(--section-margin);
}

.articles--related {
	padding-top: var(--section-margin);
}

.article__title,
.search-page__title,
.not-found__title {
	margin-bottom: 2rem;
	overflow-wrap: break-word;
}

/* Под h1 обычной страницы и списка — 3rem: контент часто начинается с заголовка h2. */
.text-page__title,
.articles__title {
	margin-bottom: 3rem;
	overflow-wrap: break-word;
}

/* «Текстовый блок» конструктора (макет text — .text-page.text-page--section). Первым под крошками — отступ текстовой
   страницы (3rem, ≤768 — 2rem); после другой секции — отступ секций вёрстки, как у .faq / .reviews; сразу после текста
   страницы или другого текстового блока — без своего: тексты идут одной колонкой, между ними нижний отступ предыдущего. */
section:not(.text-page) + .text-page--section {
	padding-top: var(--section-margin);
}

.text-page + .text-page--section {
	padding-top: 0;
}

/* Заголовок блока без текста — без отступа снизу (его даёт секция). */
.text-page--section .text-page__title:last-child {
	margin-bottom: 0;
}

/* ---------- Типографика контента ---------- */

.entry {
	max-width: 84rem;
	font-size: 1.6rem;
	line-height: 1.5;
	overflow-wrap: break-word;
}

.entry::after {
	content: "";
	display: block;
	clear: both;
}

.entry > * + * {
	margin-top: 1.5rem;
}

.entry p:empty {
	display: none;
}

.entry h1,
.entry h2 {
	margin: 4.5rem 0 2rem;
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 1.3;
	text-transform: uppercase;
}

.entry h3 {
	margin: 3rem 0 1rem;
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1.3;
}

.entry h4 {
	margin: 2.5rem 0 1rem;
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.4;
	text-transform: uppercase;
}

.entry h5,
.entry h6 {
	margin: 2rem 0 1rem;
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.4;
}

.entry > :first-child {
	margin-top: 0;
}

.entry > :last-child {
	margin-bottom: 0;
}

.entry strong,
.entry b {
	font-weight: 600;
}

.entry small {
	font-size: 0.85em;
}

.entry mark {
	background-color: rgba(113, 190, 0, 0.25);
	color: inherit;
}

/* Ссылки — как .link вёрстки: зелёная линия снизу, по наведению зелёный текст. Кнопки (.button, .button-arrow,
   кнопки Gutenberg — всё с «button» в классе) оформляются сами. */
.entry a:not([class*="button"]) {
	text-decoration: underline;
	text-decoration-color: var(--theme-color);
	text-decoration-thickness: 0.1rem;
	text-underline-offset: 0.3em;
	transition: color 0.3s ease 0s;
}

.entry a:not([class*="button"]):hover {
	color: var(--green);
}

/* Списки — как .payment__list: маркер-точка 0.7rem, нумерация — жирными цифрами (штатный ::marker — работают
   start/reversed), текст пунктов обоих списков начинается на одной линии. Оформляются только списки
   текста (без класса — классический редактор, .wp-block-list — Gutenberg): чужая разметка списков не трогается. */
.entry li + li,
.entry li > ul,
.entry li > ol {
	margin-top: 1.2rem;
}

.entry :is(ul:not([class]), ul.wp-block-list) > li {
	position: relative;
	padding-left: 2.7rem;
}

.entry :is(ul:not([class]), ul.wp-block-list) > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(0.75em - 0.35rem);
	width: 0.7rem;
	height: 0.7rem;
	background-color: var(--dark);
	border-radius: 50%;
}

.entry :is(ul:not([class]), ul.wp-block-list) :is(ul:not([class]), ul.wp-block-list) > li::before {
	border: 0.1rem solid var(--dark);
	background-color: transparent;
}

.entry :is(ol:not([class]), ol.wp-block-list) {
	padding-left: 2.7rem;
	list-style: decimal;
}

.entry :is(ol:not([class]), ol.wp-block-list) > li::marker {
	font-weight: 600;
}

.entry dt {
	font-weight: 600;
}

.entry dd {
	margin-left: 2.7rem;
}

/* Цитата — белая плашка с зелёной чертой слева. */
.entry blockquote {
	position: relative;
	margin: 3rem 0;
	padding: 2.5rem 3rem 2.5rem 4rem;
	background-color: var(--white);
	font-size: 1.8rem;
	line-height: 1.5;
}

.entry blockquote::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 0.4rem;
	background-color: var(--green);
}

.entry blockquote > * + * {
	margin-top: 1rem;
}

.entry blockquote cite,
.entry blockquote footer {
	display: block;
	margin-top: 1.5rem;
	font-size: 1.4rem;
	font-style: normal;
	opacity: 0.7;
}

.entry .wp-block-pullquote {
	margin: 3rem 0;
	padding: 0;
	text-align: left;
}

/* Картинки и подписи. */
.entry img {
	max-width: 100%;
	height: auto;
}

.entry figure {
	margin: 3rem 0;
}

.entry figure img {
	display: block;
}

.entry figcaption,
.entry .wp-element-caption {
	margin-top: 1rem;
	margin-bottom: 0;
	font-size: 1.4rem;
	line-height: 1.4;
	opacity: 0.7;
}

.entry .alignleft,
.entry .wp-block-image .alignleft {
	float: left;
	max-width: 50%;
	margin: 0.5rem 3rem 2rem 0;
}

.entry .alignright,
.entry .wp-block-image .alignright {
	float: right;
	max-width: 50%;
	margin: 0.5rem 0 2rem 3rem;
}

.entry .aligncenter,
.entry .wp-block-image .aligncenter {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.entry .alignwide,
.entry .alignfull {
	width: 100%;
	max-width: 100%;
}

.entry .wp-block-image.alignwide img,
.entry .wp-block-image.alignfull img {
	width: 100%;
}

/* Таблица — строки с серыми линиями, как характеристики товара; шапка — с тёмной линией. */
.entry .wp-block-table {
	margin: 3rem 0;
	overflow-x: auto;
}

.entry table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1.5rem;
	line-height: 1.4;
}

.entry table thead,
.entry table tfoot {
	border: none;
}

.entry table th,
.entry table td {
	padding: 1.4rem 2rem 1.4rem 0;
	border: none;
	border-bottom: 0.1rem solid #C4C4C4;
	text-align: left;
	vertical-align: top;
}

.entry table th:last-child,
.entry table td:last-child {
	padding-right: 0;
}

.entry table th,
.entry table thead td {
	font-weight: 600;
}

.entry table thead th,
.entry table thead td {
	border-bottom-color: var(--dark);
}

.entry .wp-block-table.is-style-stripes {
	border-bottom: none;
}

.entry .wp-block-table.is-style-stripes table th,
.entry .wp-block-table.is-style-stripes table td {
	padding-left: 1.6rem;
	padding-right: 1.6rem;
	border-bottom-color: #C4C4C4;
}

.entry .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background-color: var(--white);
}

/* Разделитель. */
.entry hr,
.entry .wp-block-separator {
	margin: 4rem 0;
	border: none;
	border-top: 0.1rem solid #C4C4C4;
	background: none;
}

/* Кнопки Gutenberg — как .button вёрстки, стиль «Контур» — как .button--border. */
.entry .wp-block-buttons {
	gap: 1.5rem;
	margin: 3rem 0;
}

.entry .wp-block-button__link,
.entry .wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 5rem;
	padding: 1.2rem 3rem;
	border: none;
	border-radius: 0;
	background-color: var(--green);
	color: var(--white);
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: 0.3s ease 0s;
}

.entry .wp-block-button__link:hover,
.entry .wp-element-button:hover {
	background-color: var(--green-hover);
	color: var(--white);
}

.entry .is-style-outline > .wp-block-button__link,
.entry .wp-block-button__link.is-style-outline {
	border: 0.1rem solid var(--black-txt);
	background-color: transparent;
	color: var(--black-txt);
	font-weight: 400;
}

.entry .is-style-outline > .wp-block-button__link:hover,
.entry .wp-block-button__link.is-style-outline:hover {
	border-color: var(--green);
	background-color: var(--green);
	color: var(--white);
}

/* Колонки, код, встраивания. */
.entry .wp-block-columns {
	gap: 2.4rem;
	margin: 3rem 0;
}

.entry code,
.entry kbd {
	padding: 0.2rem 0.5rem;
	background-color: var(--white);
	font-family: monospace;
	font-size: 0.9em;
}

.entry pre {
	padding: 2rem;
	overflow-x: auto;
	background-color: var(--white);
	font-family: monospace;
	font-size: 1.4rem;
	line-height: 1.5;
	white-space: pre;
}

.entry pre code {
	padding: 0;
	background: none;
	font-size: inherit;
	white-space: inherit;
}

.entry iframe,
.entry video {
	max-width: 100%;
}

/* Форма пароля защищённой записи (WordPress): поле и кнопка как в формах вёрстки. */
.entry .post-password-form label {
	display: block;
	max-width: 36rem;
	font-size: 1.4rem;
}

.entry .post-password-form input[type="password"] {
	display: block;
	width: 100%;
	min-height: 5rem;
	margin-top: 0.8rem;
	padding: 0 2rem;
	border: 0.1rem solid #C4C4C4;
	background-color: var(--white);
	font-size: 1.6rem;
}

.entry .post-password-form input[type="submit"] {
	min-height: 5rem;
	margin-top: 1.5rem;
	padding: 1.2rem 3rem;
	background-color: var(--green);
	color: var(--white);
	font-size: 1.6rem;
	font-weight: 600;
	transition: 0.3s ease 0s;
}

.entry .post-password-form input[type="submit"]:hover {
	background-color: var(--green-hover);
}

/* Постраничный контент (<!--nextpage-->): номера как у .pagination. */
.entry-pages {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-top: 3rem;
	font-size: 1.4rem;
}

.entry-pages .post-page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 1.8rem;
	height: 1.8rem;
	padding: 0 0.4rem;
	background-color: var(--white);
	font-size: 1.2rem;
	line-height: 1;
	transition: 0.3s ease 0s;
}

.entry-pages a.post-page-numbers:hover {
	color: var(--green);
}

.entry-pages .post-page-numbers.current {
	border: 0.1rem solid var(--black-txt);
}

/* ---------- Список статей (.articles) ---------- */

.articles__text {
	margin: -1rem 0 3rem;
}

.articles__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.4rem;
}

/* Карточка без миниатюры — тёмная подложка вместо фото (текст карточки белый). */
.article-card--empty {
	background-color: var(--dark);
}

/* Пагинация — .pagination из style.css; стрелка «назад» .pagination__prev оформлена в smd-shop.css (зона [catalog],
   файл подключается на всех страницах), здесь только отступ от списка. */
.articles__pagination,
.search-page__pagination {
	margin-top: 3rem;
}

/* Список результатов поиска уже контейнера (84rem) — номера страниц стоят под его правым краем, а не у края контейнера. */
.search-page__pagination {
	max-width: 84rem;
}

/* «Другие статьи» под записью: шапка как у «Экспертных материалов» (.materials__top). */
.articles__top {
	display: flex;
	align-items: center;
	gap: 4rem;
	margin-bottom: 4rem;
}

.articles__heading {
	margin-bottom: 0;
}

.articles__button {
	min-width: 18.4rem;
	min-height: 4.1rem;
}

/* Пустой список и «ничего не найдено» — белая плашка, как пустой список каталога. */
.articles__empty,
.search-page__empty {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2.4rem;
	padding: 4rem;
	background-color: var(--white);
	font-size: 1.8rem;
	line-height: 1.4;
}

/* ---------- Статья (.article) ---------- */

.article__top {
	display: grid;
	grid-template-columns: 1fr 55.2rem;
	align-items: center;
	gap: 2.4rem;
}

.article--text .article__top {
	display: block;
}

.article__head {
	min-width: 0;
}

.article__date {
	display: block;
	font-size: 1.4rem;
	color: rgba(54, 61, 71, 0.7);
}

.article__picture {
	display: block;
}

.article__picture img {
	width: 100%;
	height: 39.2rem;
	object-fit: cover;
}

.article__content {
	margin-top: 4rem;
}

/* ---------- Поиск (.search-page) ---------- */

.search-page__count {
	margin-bottom: 2rem;
	font-size: 1.4rem;
	color: rgba(54, 61, 71, 0.7);
}

.search-page__list {
	max-width: 84rem;
	border-top: 0.1rem solid #C4C4C4;
}

.search-page__item {
	padding: 2.4rem 0;
	border-bottom: 0.1rem solid #C4C4C4;
}

/* Тип — подпись с зелёным квадратом, как .mark-title. */
.search-page__type {
	position: relative;
	margin-bottom: 0.8rem;
	padding-left: 1.4rem;
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.3;
	text-transform: uppercase;
}

.search-page__type::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(0.65em - 0.3rem);
	width: 0.6rem;
	height: 0.6rem;
	background-color: var(--green);
}

.search-page__link {
	font-size: 2rem;
	font-weight: 600;
	line-height: 1.3;
	transition: color 0.3s ease 0s;
}

.search-page__link:hover {
	color: var(--green);
}

.search-page__text {
	margin-top: 1rem;
	font-size: 1.6rem;
	line-height: 1.5;
	color: rgba(54, 61, 71, 0.8);
}

.search-page__form {
	width: 100%;
	max-width: 55.2rem;
	height: 5rem;
}

.search-page__form .search__input {
	font-size: 1.6rem;
}

/* ---------- 404 (.not-found) ---------- */

.not-found__text {
	margin-bottom: 4rem;
	font-size: 1.8rem;
	line-height: 1.5;
}

.not-found__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem 2.4rem;
}

.not-found__button {
	min-width: 26.4rem;
}

/* ==================================== */

@media (max-width: 1024px) {
	.entry {
		font-size: 1.5rem;
	}

	.entry h1,
	.entry h2 {
		font-size: 2.2rem;
	}

	.article__top {
		grid-template-columns: 1fr 45rem;
	}

	.article__picture img {
		height: 32rem;
	}
}

@media (max-width: 768px) {
	.text-page,
	.articles,
	.article,
	.search-page,
	.not-found {
		padding-top: 2rem;
	}

	/* У «Других статей» верхний отступ — как у секции, а не 2rem первой секции страницы. */
	.articles--related {
		padding-top: var(--section-margin);
	}

	.article__title,
	.search-page__title,
	.not-found__title {
		margin-bottom: 1.5rem;
	}

	.text-page__title,
	.articles__title {
		margin-bottom: 2rem;
	}

	.entry h1,
	.entry h2 {
		margin-top: 3.5rem;
		margin-bottom: 1.5rem;
		font-size: 2rem;
	}

	.entry h3 {
		margin-top: 2.5rem;
		font-size: 1.6rem;
	}

	.entry :is(ul:not([class]), ul.wp-block-list) > li {
		padding-left: 2.4rem;
	}

	.entry :is(ol:not([class]), ol.wp-block-list) {
		padding-left: 2.4rem;
	}

	.entry blockquote {
		padding: 2rem 2rem 2rem 3rem;
		font-size: 1.6rem;
	}

	.entry .alignleft,
	.entry .alignright,
	.entry .wp-block-image .alignleft,
	.entry .wp-block-image .alignright {
		float: none;
		max-width: 100%;
		margin: 2rem 0;
	}

	/* Таблица из классического редактора — прокрутка по горизонтали (блок таблицы прокручивается сам). */
	.entry > table {
		display: block;
		overflow-x: auto;
	}

	.articles__text {
		margin-bottom: 2rem;
	}

	.articles__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.articles__top {
		gap: 2.5rem;
		margin-bottom: 3rem;
	}

	/* «Другие статьи» в 2 колонки — две карточки, третья осталась бы одна в ряду. */
	.articles--related .articles__item:nth-child(n + 3) {
		display: none;
	}

	.articles__empty,
	.search-page__empty {
		padding: 3rem 2rem;
		font-size: 1.6rem;
	}

	.article__top {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.article__picture img {
		height: 30rem;
	}

	.article__content {
		margin-top: 3rem;
	}

	.search-page__item {
		padding: 2rem 0;
	}

	.search-page__link {
		font-size: 1.8rem;
	}

	.search-page__text {
		font-size: 1.5rem;
	}

	.not-found__text {
		margin-bottom: 3rem;
		font-size: 1.6rem;
	}
}

@media (max-width: 480px) {
	.entry {
		font-size: 1.4rem;
	}

	/* Переносы заголовка «Текстового блока» (Enter в поле) на телефоне скрыты, как у заголовков вёрстки. */
	.text-page--section .text-page__title br {
		display: none;
	}

	.entry h1,
	.entry h2 {
		font-size: 1.8rem;
	}

	.entry :is(ul:not([class]), ul.wp-block-list) > li {
		padding-left: 2rem;
	}

	.entry :is(ul:not([class]), ul.wp-block-list) > li::before {
		top: calc(0.75em - 0.3rem);
		width: 0.6rem;
		height: 0.6rem;
	}

	.entry :is(ol:not([class]), ol.wp-block-list) {
		padding-left: 2rem;
	}

	.entry table {
		font-size: 1.4rem;
	}

	.entry .wp-block-buttons .wp-block-button,
	.entry .wp-block-button__link {
		width: 100%;
	}

	.articles__list {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.articles--related .articles__item:nth-child(n + 3) {
		display: flex;
	}

	.articles__top {
		flex-wrap: wrap;
	}

	.articles__heading,
	.articles__button {
		width: 100%;
	}

	.article__picture img {
		height: 20rem;
	}

	.search-page__link {
		font-size: 1.6rem;
	}

	.search-page__text {
		font-size: 1.4rem;
	}

	.search-page__form {
		max-width: none;
	}

	.not-found__buttons {
		flex-direction: column;
	}

	.not-found__button {
		width: 100%;
		min-width: 0;
	}
}