/**
 * Блог: лента (home.php), рубрики (archive.php), статья (single.php).
 * Карточка записи — template-parts/post-card.php, стили — в components.css.
 */

/* Шапка ленты и статьи — шалфейная панель, как fsp/page-header */

.fsp-block.fsp-blog-head {
	padding-block: clamp(1.75rem, 4vw, 3rem);
}

.fsp-blog-head + .fsp-block {
	padding-top: clamp(2rem, 4vw, 3rem);
}

.fsp-blog-head__inner {
	position: relative;
	z-index: 1;
}

.fsp-blog-head h1 {
	max-width: 22ch;
	margin-bottom: 0.75rem;
}

/* Статья: заголовок мельче H1 страниц и во всю ширину — в одну-две строки. */
.fsp-post .fsp-blog-head h1 {
	max-width: none;
	font-size: clamp(1.75rem, 1.1rem + 2.2vw, 2.75rem);
}

/* На телефоне последнее звено крошек (название статьи) скрыто — оно
   тут же в заголовке, а целиком крошки занимали три строки. */
@media (max-width: 599.98px) {
	.fsp-post .fsp-breadcrumbs .last,
	.fsp-post .fsp-breadcrumbs .separator:nth-last-child(2) {
		display: none;
	}
}

.fsp-post .fsp-blog-head__meta {
	margin-block: 0.5rem 0;
}

.fsp-blog-head .fsp-lead {
	max-width: var(--fsp-container-text);
	margin: 0;
}

.fsp-blog-head__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1rem;
	margin-top: 1.25rem;
	color: var(--fsp-color-text-muted);
}

/* Пагинация — круглые кнопки */

.fsp-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 3rem;
}

.fsp-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--fsp-tap);
	height: var(--fsp-tap);
	padding-inline: 1rem;
	border-radius: var(--fsp-radius-pill);
	background: var(--fsp-color-sage-light);
	color: var(--fsp-color-text);
	text-decoration: none;
}

.fsp-pagination .page-numbers.current {
	background: var(--fsp-color-primary);
	color: var(--fsp-color-on-primary);
}

.fsp-pagination a.page-numbers:hover {
	background: var(--fsp-color-sage);
}

/* Статья */

/* Две колонки: текст (ширина строки — как у текстовых страниц) и липкая
   форма справа. На телефоне и планшете форма — после текста. */
.fsp-article {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3rem;
	padding-block: clamp(2rem, 5vw, 3rem) var(--fsp-section-y);
}

.fsp-article__main {
	max-width: var(--fsp-container-text);
}

.fsp-article__quote-title {
	margin-bottom: 0.5rem;
	font-size: var(--fsp-fs-h4);
}

.fsp-article__quote-text {
	margin-bottom: 1.25rem;
	color: var(--fsp-color-text-muted);
	font-size: var(--fsp-fs-small);
}

@media (min-width: 1024px) {
	.fsp-article {
		grid-template-columns: minmax(0, 1fr) minmax(20rem, 24rem);
		gap: clamp(3rem, 5vw, 5rem);
		align-items: start;
	}

	.fsp-article__aside {
		position: sticky;
		top: calc(var(--fsp-header-offset, var(--fsp-header-h)) + 1.5rem);
	}
}

/* Форма внутри текста — после пятого абзаца */
.fsp-prose .fsp-post-quote {
	margin-block: 2.5rem;
	padding: clamp(1.5rem, 4vw, 2.25rem);
	border-radius: var(--fsp-radius);
	background: var(--fsp-gradient-sage);
}

.fsp-prose .fsp-post-quote__title {
	margin: 0 0 0.5rem;
	color: var(--fsp-color-primary);
	font-family: var(--fsp-font-heading);
	font-size: var(--fsp-fs-h4);
	font-weight: var(--fsp-fw-heading);
	line-height: 1.3;
}

.fsp-prose .fsp-post-quote__text {
	margin: 0 0 1.25rem;
}

.fsp-prose .fsp-post-quote .fsp-quote-form p {
	margin: 0;
}

.fsp-article__media {
	margin-bottom: 2.5rem;
	aspect-ratio: 16 / 9;
}

.fsp-toc {
	margin-bottom: 2.5rem;
	border-radius: var(--fsp-radius);
	background: var(--fsp-color-sage-light);
}

.fsp-toc__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 3.5rem;
	padding: 0.75rem 1rem 0.75rem 1.5rem;
	color: var(--fsp-color-primary);
	font-family: var(--fsp-font-heading);
	font-weight: var(--fsp-fw-heading);
	list-style: none;
	cursor: pointer;
}

.fsp-toc__summary::-webkit-details-marker {
	display: none;
}

.fsp-toc[open] .fsp-accordion__chevron {
	transform: rotate(180deg);
}

.fsp-toc__list {
	margin: 0;
	padding: 0 1.5rem 1.5rem 2.75rem;
}

.fsp-toc__list li + li {
	margin-top: 0.5rem;
}

.fsp-toc__list a {
	color: var(--fsp-color-text);
}

.fsp-toc__list a:hover {
	color: var(--fsp-color-primary);
}

/* Старые статьи Elementor (до переноса): контент держит свою сетку. */
.fsp-article__content .elementor {
	width: 100%;
}

.fsp-article__tags {
	margin-top: 2.5rem;
}

.fsp-article__tags .fsp-chip {
	text-decoration: none;
}
