/*
Theme Name: KrasaTIME
Theme URI: https://krasatime.com/
Description: Дочерняя тема Kadence для krasatime.com. Главная, хабы и карточки продуктов свёрстаны кодом.
Author: KrasaTIME
Template: kadence
Version: 0.2.0
Text Domain: krasatime
*/

:root {
	--kt-mint: #a7d7c5;
	--kt-mint-light: #bfe8df;
	--kt-mint-pale: #dff2ee;
	--kt-beige: #e8e2d6;
	--kt-gold: #d4af37;
	--kt-white: #fff;
	--kt-ink: #1e3a32;
	--kt-muted: #5c6b66;
	--kt-max: 1240px;

	/* Бумага: чуть холоднее белого, без кремового налёта. */
	--kt-paper: #f6f8f6;
	--kt-hairline: #e0e7e2;
	--kt-deep: #2f6b58;
	--kt-measure: 62ch;
	--kt-ease: cubic-bezier(0.2, 0.7, 0.3, 1);

	/* Тени в два-три слоя: короткая у края даёт чёткость,
	   длинная размытая — объём. Один слой всегда выглядит как грязь. */
	--kt-shadow-soft: 0 2px 6px rgba(30, 58, 50, 0.04), 0 10px 24px rgba(30, 58, 50, 0.06);
	--kt-shadow-card: 0 4px 12px rgba(30, 58, 50, 0.05), 0 24px 60px rgba(30, 58, 50, 0.09);
	--kt-shadow-lift: 0 2px 4px rgba(30, 58, 50, 0.05), 0 12px 28px rgba(30, 58, 50, 0.1);
	--kt-shadow-gold: 0 1px 2px rgba(30, 58, 50, 0.06), 0 6px 14px rgba(30, 58, 50, 0.1),
		0 12px 24px -8px rgba(199, 154, 59, 0.28);
}

/* --- Фон всей темы --------------------------------------------------------- */

/* Не чистый белый: на бумажном фоне белые карточки всплывают сами,
   без теней и рамок. Разница в два тона, но страница перестаёт
   выглядеть распечаткой. */
body {
	background-color: var(--kt-paper);
	/* Полосы во всю ширину окна не должны давать горизонтальную прокрутку. */
	overflow-x: hidden;
}

/* Шапка в том же тоне, что и страница: белая полоса под логотипом
   резала макет надвое. */
#masthead,
#main-header,
.site-header-wrap,
.site-header-row-container-inner,
.site-header-main-section-left,
.site-header-main-section-right {
	background-color: var(--kt-paper);
}

/* Логотип сохранён в JPEG, а этот формат не умеет прозрачность:
   вокруг него белый прямоугольник, заметный на бумажной шапке.
   Умножение убирает белое, не трогая сам знак. Правильное решение —
   перезалить логотип в PNG с прозрачным фоном. */
.custom-logo {
	mix-blend-mode: multiply;
}

/* Содержимое страниц и статей остаётся белым — так колонка текста
   читается как лист, положенный на стол. */
.page .content-bg,
.single .content-bg,
.kt-problem,
.kt-post__media {
	background-color: var(--kt-white);
}

.page:not(.home) .content-bg,
.single .content-bg {
	border-radius: 16px;
	box-shadow: var(--kt-shadow-card);
}

/* На главной блоки сами по себе, без общей белой подложки. */
.home .content-bg,
.home .entry-content-wrap,
.home .content-container {
	background: none;
	box-shadow: none;
	padding: 0;
}

/* --- Проявление блоков при прокрутке --------------------------------------- */

.kt-reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.7s var(--kt-ease), transform 0.7s var(--kt-ease);
}

.kt-reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.kt-reveal,
	.kt-reveal.is-visible {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* --- Появление первого экрана при загрузке --------------------------------- */

@keyframes kt-rise {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* Приближение картинки убрано: от него укачивает.
   Движение оставлено только у текста. */

.kt-hero__title {
	animation: kt-rise 0.7s var(--kt-ease) 0.1s both;
}

.kt-hero__sub {
	animation: kt-rise 0.7s var(--kt-ease) 0.22s both;
}

.kt-hero__actions {
	animation: kt-rise 0.7s var(--kt-ease) 0.34s both;
}

@media (prefers-reduced-motion: reduce) {
	.kt-hero__title,
	.kt-hero__sub,
	.kt-hero__actions {
		animation: none;
	}
}

/* --- Золотая нить прогресса чтения ----------------------------------------- */

/* Полоса растёт по мере прокрутки. Считает сам браузер по таймлайну
   прокрутки — ни строчки JavaScript, ни одного обработчика событий. */
.kt-progress {
	position: fixed;
	/* В админке сверху висит чёрная панель WordPress — иначе полоса под ней. */
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	z-index: 100000;
	width: 100%;
	height: 3px;
	background: linear-gradient(to right, var(--kt-mint), var(--kt-gold));
	transform-origin: 0 50%;
	transform: scaleX(0);
	pointer-events: none;
}

@supports (animation-timeline: scroll()) {
	.kt-progress {
		animation: kt-progress linear both;
		animation-timeline: scroll(root block);
	}
}

@keyframes kt-progress {
	to {
		transform: scaleX(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.kt-progress {
		display: none;
	}
}

/* --- Проявление заголовка баннера ------------------------------------------ */

/* Шторка по строкам убрана: строки выводятся как строчные элементы,
   и обрезка съедала часть текста. Движение осталось у всего блока. */

/* --- Надпись-указатель над заголовком секции ------------------------------- */

.kt-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.6rem;
	font-size: 0.72rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--kt-gold);
}

.kt-eyebrow::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: linear-gradient(to right, var(--kt-gold), transparent);
}

/* --- Верхняя полоса ------------------------------------------------------ */

.kt-topbar {
	background: var(--kt-mint-pale);
	font-size: 0.9rem;
}

.kt-topbar__inner {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 0.5rem 1.25rem;
	display: flex;
	gap: 0.75rem;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	color: var(--kt-ink);
}

.kt-topbar__link {
	color: var(--kt-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: var(--kt-gold);
	font-weight: 600;
}

/* --- Кнопки -------------------------------------------------------------- */

.kt-btn {
	display: inline-block;
	padding: 0.85rem 1.6rem;
	border-radius: 6px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: transform 0.25s var(--kt-ease), box-shadow 0.25s var(--kt-ease), background-color 0.25s ease;
}

.kt-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(30, 58, 50, 0.14);
}

.kt-btn:focus-visible {
	outline: 2px solid var(--kt-gold);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.kt-btn:hover {
		transform: none;
	}
}

/* Правило Ирины: на зелёной кнопке текст всегда белый, везде на сайте. */
.kt-btn--primary,
.kt-btn--primary:hover,
.kt-btn--primary:focus,
.kt-btn--primary:visited {
	background: #6bb39a;
	color: #fff;
}

.kt-btn--ghost {
	background: transparent;
	color: var(--kt-ink);
	border: 1px solid var(--kt-gold);
}

/* --- Первый экран -------------------------------------------------------- */

.kt-hero {
	position: relative;
	/* Тон снят с левого края баннера, чтобы подложка не проступала. */
	background: #fdfdfd;
	overflow: hidden;
}

/* Баннер показывается целиком, без обрезки сверху и снизу:
   высота считается от его собственных пропорций. */
.kt-hero__media img {
	display: block;
	width: 100%;
	height: auto;
}

/* У баннера левая часть уже чистая и светлая, осветлять её не нужно.
   Слабая подложка оставлена только на случай тёмной картинки. */
.kt-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to right,
		rgba(255, 255, 255, 0.25) 0%,
		rgba(255, 255, 255, 0) 45%
	);
	pointer-events: none;
}

.kt-hero__inner {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 0 1.25rem;
}

/* Текст и кнопки — единый блок в пустой левой части баннера,
   всё выровнено по левому краю. */
.kt-hero__text {
	max-width: 28rem;
	text-align: left;
}

.kt-hero__title {
	margin: 0 0 1rem;
	/* Антиква вместо жирного гротеска: перекликается с логотипом
	   и звучит мягче для бьюти-темы. */
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: clamp(1.7rem, 3vw, 2.8rem);
	line-height: 1.08;
	letter-spacing: -0.01em;
	color: var(--kt-ink);
	width: fit-content;
}

/* На широком экране строки текут в один абзац, переносы задаёт сама вёрстка. */
.kt-hero__line {
	display: inline;
}

/* Выделено одно слово — название бренда. Курсив и глубокий зелёный,
   без градиента: сплошной цвет в антикве выглядит дороже. */
.kt-hero__accent {
	font-style: italic;
	color: var(--kt-deep);
}

.kt-hero__sub {
	margin: 0 0 1.75rem;
	font-size: clamp(1rem, 1.2vw, 1.15rem);
	line-height: 1.5;
	color: var(--kt-muted);
}

/* Обе кнопки строго в одну линию и по центру блока. */
.kt-hero__actions {
	display: flex;
	gap: 0.85rem;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
}

.kt-hero__actions .kt-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
}

/* На телефоне текст не кладём поверх картинки: она узкая, буквы попадают
   на флаконы и лицо. Картинка сверху, текст под ней на чистом фоне. */
@media (max-width: 860px) {
	.kt-hero {
		margin-top: 0;
		border-radius: 0;
		background: var(--kt-white);
	}

	/* На телефоне широкий кадр стал бы узкой полоской, поэтому здесь
	   картинка подрезается: показываем правую часть с продуктами. */
	.kt-hero__media img {
		height: 16rem;
		object-fit: cover;
		object-position: 62% 45%;
	}

	.kt-hero::after {
		display: none;
	}

	/* Подзаголовок и кнопки живут под картинкой, на чистом фоне. */
	.kt-hero__inner {
		position: static;
		display: block;
		padding: 1.5rem 1.25rem 2rem;
	}

	/* Текст вынут из потока и лежит на баннере слева, каждая строка отдельно. */
	.kt-hero__title {
		position: absolute;
		top: 4.25rem;
		left: 1.25rem;
		z-index: 3;
		margin: 0;
		font-size: 1.5rem;
	}

	.kt-hero__line {
		display: block;
		text-align: left;
	}

	.kt-hero__text {
		max-width: none;
	}

	.kt-hero__sub {
		margin-bottom: 1.25rem;
	}

	.kt-hero__actions .kt-btn {
		flex: 1 1 auto;
		text-align: center;
	}
}

/* --- Полоска выгод ------------------------------------------------------- */

.kt-benefits {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 1.5rem 1.25rem 1rem;
}

/* Не сетка из равных колонок: подписи разной длины давали разные отступы
   слева и справа. Гибкая строка с равными промежутками выглядит ровно. */
.kt-benefits__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem 2.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-benefits__item {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto;
	column-gap: 0.75rem;
	align-items: center;
}

.kt-benefits__icon {
	grid-row: 1 / 3;
	width: 2.6rem;
	height: 2.6rem;
	color: var(--kt-gold);
}

.kt-benefits__title {
	font-weight: 700;
	color: var(--kt-ink);
}

.kt-benefits__note {
	font-size: 0.9rem;
	color: var(--kt-muted);
}

@media (max-width: 560px) {
	.kt-benefits__list {
		gap: 1.1rem 1.5rem;
	}

	.kt-benefits__item {
		flex: 1 1 45%;
	}
}

/* --- Заголовок страницы и автор ------------------------------------------ */

.kt-intro {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 1rem 1.25rem 1.75rem;
}

.kt-intro__title {
	margin: 0 0 0.75rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: clamp(1.5rem, 2.4vw, 2.15rem);
	line-height: 1.2;
	color: var(--kt-ink);
}

.kt-intro__author {
	margin: 0;
	font-size: 0.95rem;
	color: var(--kt-muted);
}

.kt-intro__author a {
	color: var(--kt-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: var(--kt-gold);
}

.kt-intro__sep {
	margin: 0 0.35rem;
	color: var(--kt-gold);
}

/* --- Обычные страницы и статьи -------------------------------------------- */

/* Шапка страницы: заголовок слева, узкая золотая черта под ним,
   бумажный фон. Отступы срезаны — у Kadence они рассчитаны на
   отдельный экран под заголовок, нам столько воздуха не нужно. */
.entry-hero-container,
.entry-hero.page-hero-section {
	background: var(--kt-paper);
	border-bottom: 1px solid var(--kt-hairline);
}

.entry-hero-container-inner,
.entry-hero .entry-header {
	min-height: 0 !important;
	padding-top: 1.4rem !important;
	padding-bottom: 1.2rem !important;
	text-align: left !important;
}

.entry-hero .entry-header {
	position: relative;
	padding-left: clamp(1.25rem, 5vw, 4rem) !important;
	padding-right: clamp(1.25rem, 5vw, 4rem) !important;
}

/* Короткая золотая черта у самого заголовка вместо линии во всю ширину. */
.entry-hero .entry-title {
	position: relative;
	display: inline-block;
	margin: 0;
	max-width: 24ch;
	padding-left: 1.25rem;
}

.entry-hero .entry-title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.15em;
	bottom: 0.15em;
	width: 2px;
	background: linear-gradient(to bottom, var(--kt-gold), rgba(212, 175, 55, 0));
}

@media (max-width: 860px) {
	.entry-hero-container-inner,
	.entry-hero .entry-header {
		padding-top: 1rem !important;
		padding-bottom: 0.85rem !important;
	}

	.entry-hero .entry-title-hidden::after {
		margin-top: 0.7rem;
	}

	.page .content-container,
	.single .content-container {
		padding-top: 1rem !important;
	}
}

.entry-hero .entry-title::after {
	content: "";
	display: block;
	width: 3.5rem;
	height: 1px;
	margin-top: 1rem;
	background: linear-gradient(to right, var(--kt-gold), transparent);
}

.page .content-container,
.single .content-container {
	padding-top: 1.5rem !important;
}

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

.single-content,
.entry-content {
	font-size: 1.06rem;
	line-height: 1.7;
	color: var(--kt-ink);
}

.entry-title,
.entry-content h2,
.entry-content h3 {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	color: var(--kt-ink);
}

.entry-title {
	font-size: clamp(1.8rem, 3.2vw, 2.6rem);
	line-height: 1.15;
}

.entry-content h2 {
	margin: 2.5rem 0 0.85rem;
	font-size: clamp(1.35rem, 2.2vw, 1.75rem);
	line-height: 1.25;
}

.entry-content h2::after {
	content: "";
	display: block;
	width: 2.5rem;
	height: 2px;
	margin-top: 0.7rem;
	background: var(--kt-gold);
}

/* Журнальная раскладка: подзаголовки выходят на левое поле,
   текст идёт ровной колонкой справа. Так страница читается
   как разворот, а не как лист с текстом посередине. */
/* Колонка по центру страницы. Выносные подзаголовки отклонены:
   на телефоне теряются, а для длинной статьи неудобны.
   Белая плашка сжимается по ширине текста, чтобы справа
   не оставалось пустого поля. */
.page .content-bg,
.single .content-bg,
.page .entry-content-wrap,
.single .entry-content-wrap {
	max-width: 56rem;
	margin-inline: auto;
}

.entry-content {
	max-width: 46rem;
	margin-inline: auto;
}

/* --- Видео с отложенной загрузкой ------------------------------------------ */

/* Пока не нажали — обычная картинка. Проигрыватель и скрипты YouTube
   подключаются только по клику, поэтому страница грузится быстро. */
.kt-video {
	margin: 2rem 0;
}

.kt-video__button {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	border-radius: 12px;
	overflow: hidden;
	background: var(--kt-ink);
	cursor: pointer;
}

.kt-video__cover {
	display: block;
	width: 100%;
	height: auto;
	transition: transform 0.5s var(--kt-ease), opacity 0.3s ease;
}

.kt-video__button:hover .kt-video__cover {
	transform: scale(1.03);
	opacity: 0.9;
}

.kt-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 4.5rem;
	height: 4.5rem;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 8px 24px rgba(30, 58, 50, 0.25);
	transition: transform 0.3s var(--kt-ease);
}

.kt-video__play::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	transform: translate(-50%, -50%);
	border-style: solid;
	border-width: 0.75rem 0 0.75rem 1.2rem;
	border-color: transparent transparent transparent var(--kt-deep);
}

.kt-video__button:hover .kt-video__play {
	transform: translate(-50%, -50%) scale(1.08);
}

.kt-video iframe {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: 12px;
}

/* --- Оглавление ------------------------------------------------------------ */

.kt-toc {
	margin: 0 0 2.5rem;
	padding: 1.25rem 1.5rem;
	background: var(--kt-paper);
	border-left: 2px solid var(--kt-gold);
	border-radius: 0 10px 10px 0;
}

.kt-toc__title {
	margin: 0 0 0.75rem;
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--kt-gold);
}

.kt-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: kt-toc;
}

.kt-toc__list li {
	counter-increment: kt-toc;
	margin-bottom: 0.5rem;
	padding-left: 2rem;
	position: relative;
}

.kt-toc__list li::before {
	content: counter(kt-toc, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0.1em;
	font-size: 0.8rem;
	color: var(--kt-mint);
}

.kt-toc__list a {
	color: var(--kt-ink);
	text-decoration: none;
	background-image: linear-gradient(var(--kt-gold), var(--kt-gold));
	background-size: 0 1px;
	background-position: 0 100%;
	background-repeat: no-repeat;
	transition: background-size 0.35s var(--kt-ease);
}

.kt-toc__list a:hover {
	background-size: 100% 1px;
}

/* Плавная прокрутка к разделу и отступ, чтобы заголовок не прилипал к верху. */
html {
	scroll-behavior: smooth;
}

.entry-content h2 {
	scroll-margin-top: 5rem;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* --- Раскрывающиеся блоки (частые вопросы) --------------------------------- */

.entry-content details {
	margin: 0 0 0.75rem;
	padding: 1rem 1.25rem;
	background: var(--kt-white);
	border: 1px solid var(--kt-hairline);
	border-radius: 10px;
	box-shadow: var(--kt-shadow-soft);
	transition: border-color 0.3s var(--kt-ease);
}

.entry-content details[open] {
	border-color: var(--kt-mint);
}

.entry-content summary {
	cursor: pointer;
	font-weight: 600;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.entry-content summary::-webkit-details-marker {
	display: none;
}

.entry-content summary::after {
	content: "";
	flex: 0 0 auto;
	width: 0.6rem;
	height: 0.6rem;
	border-right: 2px solid var(--kt-gold);
	border-bottom: 2px solid var(--kt-gold);
	transform: rotate(45deg);
	transition: transform 0.3s var(--kt-ease);
}

.entry-content details[open] summary::after {
	transform: rotate(-135deg);
}

.entry-content details > *:not(summary) {
	margin-top: 0.85rem;
	margin-bottom: 0;
}

/* --- Таблицы --------------------------------------------------------------- */

.kt-table-scroll {
	overflow-x: auto;
	margin: 0 0 1.5rem;
	border: 1px solid var(--kt-hairline);
	border-radius: 10px;
	box-shadow: var(--kt-shadow-soft);
}

.kt-table-scroll table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
}

.kt-table-scroll th,
.kt-table-scroll td {
	padding: 0.7rem 1rem;
	border-bottom: 1px solid var(--kt-hairline);
	text-align: left;
}

.kt-table-scroll th {
	background: var(--kt-paper);
	font-weight: 600;
	white-space: nowrap;
}

/* --- Поделиться ------------------------------------------------------------ */

.kt-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem;
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--kt-hairline);
}

.kt-share__label {
	margin-right: 0.35rem;
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--kt-muted);
}

.kt-share__link {
	padding: 0.45rem 1rem;
	border: 1px solid var(--kt-hairline);
	border-radius: 999px;
	font-size: 0.9rem;
	color: var(--kt-ink);
	text-decoration: none;
	transition: border-color 0.25s var(--kt-ease), color 0.25s var(--kt-ease);
}

.kt-share__link:hover {
	border-color: var(--kt-mint);
	color: var(--kt-deep);
}

/* --- Оглавление сбоку на широком экране ------------------------------------ */

/* Оглавление стоит на месте, текст едет мимо него.
   Раскладка включается только там, где хватает ширины. */
@media (min-width: 1180px) {
	.page .entry-content,
	.single .entry-content {
		display: grid;
		grid-template-columns: 15rem minmax(0, 42rem);
		gap: 0 3.5rem;
		justify-content: center;
		max-width: none;
	}

	.entry-content > * {
		grid-column: 2;
	}

	.entry-content > .kt-toc {
		grid-column: 1;
		grid-row: 1 / 500;
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + 2rem);
		align-self: start;
		margin: 0;
		padding: 0 0 0 1.25rem;
		background: none;
		border-radius: 0;
	}

	.page .content-bg,
	.single .content-bg,
	.page .entry-content-wrap,
	.single .entry-content-wrap {
		max-width: 68rem;
	}
}

.entry-content p {
	margin: 0 0 1.15rem;
}

/* Буквица в первом абзаце — единственная вольность в наборе. */
.entry-content .kt-lead::first-letter {
	float: left;
	margin: 0.15em 0.12em 0 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 3.4em;
	line-height: 0.78;
	color: var(--kt-deep);
}

/* Медиа выходит за колонку — так страница дышит. */
.entry-content .wp-block-image,
.entry-content .wp-block-embed {
	max-width: min(52rem, 100%);
}

.entry-content blockquote {
	margin: 2rem 0;
	padding-left: 1.5rem;
	border-left: 2px solid var(--kt-gold);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.2rem;
	font-style: italic;
	line-height: 1.5;
	color: var(--kt-deep);
	max-width: var(--kt-measure);
}

/* Первый абзац страницы — крупнее, как вводка в журнале. */
.entry-content .kt-lead {
	font-size: 1.2rem;
	line-height: 1.6;
	color: var(--kt-muted);
}

.entry-content ul {
	margin: 0 0 1.5rem;
	padding-left: 0;
	list-style: none;
}

.entry-content ul li {
	position: relative;
	margin-bottom: 0.6rem;
	padding-left: 1.5rem;
}

.entry-content ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.65em;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background: var(--kt-mint);
}

.entry-content a {
	color: #3f7d6b;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: var(--kt-mint);
}

.entry-content .wp-block-embed {
	max-width: 40rem;
	margin: 2rem 0;
}

.entry-content .wp-block-embed__wrapper {
	position: relative;
	padding-top: 56.25%;
	overflow: hidden;
	border-radius: 12px;
}

.entry-content .wp-block-embed__wrapper iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* --- Общий заголовок секции ---------------------------------------------- */

.kt-section__title {
	position: relative;
	margin: 0 0 1.75rem;
	padding-top: 1.1rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	letter-spacing: -0.01em;
	color: var(--kt-ink);
}

/* Черта над заголовком прочерчивается сама, когда секция входит в экран. */
.kt-section__title::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 3.5rem;
	height: 1px;
	background: linear-gradient(to right, var(--kt-gold), transparent);
	transform: scaleX(0);
	transform-origin: 0 50%;
	transition: transform 0.9s var(--kt-ease) 0.15s;
}

.is-visible .kt-section__title::before {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	.kt-section__title::before {
		transform: none;
		transition: none;
	}
}

/* --- Популярные проблемы -------------------------------------------------- */

.kt-problems {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 0.5rem 1.25rem 2rem;
}

.kt-problems__list {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-problem {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.7rem;
	height: 100%;
	padding: 1.4rem 0.6rem 1.25rem;
	background: var(--kt-white);
	border: 1px solid var(--kt-hairline);
	border-radius: 12px;
	box-shadow: var(--kt-shadow-soft);
	color: var(--kt-ink);
	text-align: center;
	text-decoration: none;
	overflow: hidden;
	transition: border-color 0.3s var(--kt-ease), transform 0.3s var(--kt-ease),
		box-shadow 0.3s var(--kt-ease);
}

/* Золотая нить проступает сверху при наведении. */
.kt-problem::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: linear-gradient(to right, transparent, var(--kt-gold), transparent);
	transform: translateX(-50%);
	transition: width 0.4s var(--kt-ease);
}

a.kt-problem:hover {
	border-color: var(--kt-mint);
	transform: translateY(-3px);
	box-shadow: var(--kt-shadow-lift);
}

a.kt-problem:hover::before {
	width: 70%;
}

.kt-problem__icon {
	width: 2.5rem;
	height: 2.5rem;
	color: #4f8f7d;
}

.kt-problem__label {
	font-size: 0.9rem;
	line-height: 1.25;
}

@media (max-width: 1080px) {
	.kt-problems__list {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 560px) {
	.kt-problems__list {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.75rem;
	}
}

/* --- Разделы сайта -------------------------------------------------------- */

.kt-hubs {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 0.5rem 1.25rem 2rem;
}

.kt-hubs__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-hub {
	position: relative;
	display: flex;
	align-items: flex-end;
	height: 100%;
	min-height: 7.5rem;
	padding: 1.1rem 1.25rem;
	background: linear-gradient(155deg, #eef5f1 0%, var(--kt-mint-pale) 55%, #e9eee7 100%);
	border-radius: 12px;
	box-shadow: var(--kt-shadow-soft);
	color: var(--kt-ink);
	text-decoration: none;
	overflow: hidden;
	transition: transform 0.35s var(--kt-ease), box-shadow 0.35s var(--kt-ease);
}

/* Мягкий блик уходит по диагонали при наведении. */
.kt-hub::after {
	content: "";
	position: absolute;
	inset: -40% -60%;
	background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, 0.65) 50%, transparent 58%);
	transform: translateX(-70%);
	transition: transform 0.7s var(--kt-ease);
}

a.kt-hub:hover {
	transform: translateY(-3px);
	box-shadow: var(--kt-shadow-lift);
}

a.kt-hub:hover::after {
	transform: translateX(70%);
}

@media (prefers-reduced-motion: reduce) {
	.kt-hub::after {
		display: none;
	}
}

.kt-hub__label {
	font-size: 1.05rem;
	font-weight: 600;
}

@media (max-width: 860px) {
	.kt-hubs__list {
		grid-template-columns: repeat(2, 1fr);
	}

	.kt-hub {
		min-height: 5.5rem;
	}
}

/* --- Ленты статей --------------------------------------------------------- */

.kt-posts {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 1rem 1.25rem 2.5rem;
}

.kt-posts__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-post {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	height: 100%;
	color: var(--kt-ink);
	text-decoration: none;
}

.kt-post__media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--kt-mint-pale);
	border-radius: 12px;
	box-shadow: var(--kt-shadow-soft);
}

.kt-post__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.kt-post:hover .kt-post__media img {
	transform: scale(1.04);
}

.kt-post__title {
	font-size: 0.98rem;
	line-height: 1.35;
}

@media (max-width: 860px) {
	.kt-posts__list {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* --- Об авторе и бизнес --------------------------------------------------- */

.kt-about {
	display: flex;
	gap: 2rem;
	align-items: flex-start;
}

.kt-about__photo {
	flex: 0 0 auto;
	width: 11rem;
	height: 11rem;
	border-radius: 50%;
	object-fit: cover;
}

.kt-author-photo img {
	border-radius: 12px;
}

@media (max-width: 700px) {
	.kt-about {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

.kt-about,
.kt-business {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 2rem 1.25rem;
}

.kt-about__text p,
.kt-business__text {
	max-width: 42rem;
	margin: 0 0 1.4rem;
	color: var(--kt-muted);
	line-height: 1.6;
}

.kt-business {
	margin-bottom: 3rem;
	padding: 2rem 1.5rem;
	background: var(--kt-beige);
	border-radius: 12px;
	box-shadow: var(--kt-shadow-soft);
}

.kt-business__title {
	margin: 0 0 0.6rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: 1.35rem;
	color: var(--kt-ink);
}

/* --- Каталог и акции ----------------------------------------------------- */

.kt-promo {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 1rem 1.25rem 2rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.kt-promo__card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	min-height: 15rem;
	padding: 2rem;
	/* Цвет плашки снят пипеткой с левого края обеих картинок:
	   у каталога #E4E9E3, у акций #E5E8E3 — стык не виден. */
	background-color: #e4e9e3;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 100%;
	border-radius: 12px;
	box-shadow: var(--kt-shadow-card);
}

/* Текст не заезжает на картинку: она занимает правую часть карточки. */
.kt-promo__card--has-image .kt-promo__title,
.kt-promo__card--has-image .kt-promo__text {
	max-width: 60%;
}

/* Обе карточки одного оттенка: картинки совпадают по фону.
   Записываем только цвет — сокращённая форма background сбрасывала
   положение, повтор и масштаб фоновой картинки. */
.kt-promo__card--alt {
	background-color: #dde4dc;
}

.kt-promo__title {
	margin: 0 0 0.6rem;
	font-size: 1.4rem;
	color: var(--kt-ink);
}

.kt-promo__text {
	margin: 0 0 1.4rem;
	color: var(--kt-muted);
}

@media (max-width: 760px) {
	.kt-promo {
		grid-template-columns: 1fr;
	}
}

/* --- Личный кабинет: формула выгоды ---------------------------------------- */

.kt-account {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 1rem 1.25rem 0.5rem;
}

.kt-account__title {
	margin: 0 0 2rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: clamp(1.5rem, 2.6vw, 2.15rem);
	line-height: 1.2;
	text-align: center;
	color: var(--kt-ink);
}

.kt-account__card {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) 1px minmax(0, 0.95fr);
	align-items: center;
	gap: 2.5rem;
	padding: 2.5rem 2.75rem;
	background: var(--kt-white);
	border: 1px solid #e8d7ab;
	border-radius: 22px;
	box-shadow: var(--kt-shadow-card);
}

.kt-account__sep {
	align-self: stretch;
	background: linear-gradient(180deg, transparent, var(--kt-hairline) 20%, var(--kt-hairline) 80%, transparent);
}

/* Формула строго в одну строку: пять колонок под три слагаемых и два знака. */
.kt-formula {
	display: grid;
	grid-template-columns: 1fr auto 1fr auto 1.1fr;
	align-items: start;
	gap: 0.5rem;
}

/* Одинаковые поля у всех слагаемых — цифры стоят на одной линии. */
.kt-term {
	min-width: 0;
	padding: 1rem 0.6rem;
	border-radius: 14px;
	text-align: center;
}

.kt-term--total {
	background: linear-gradient(160deg, #fdfaf2, var(--kt-white));
	box-shadow: var(--kt-shadow-lift);
}

.kt-term__value {
	display: block;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(2rem, 3.4vw, 3rem);
	line-height: 1;
	color: var(--kt-deep);
	white-space: nowrap;
}

.kt-term--total .kt-term__value {
	color: #c79a3b;
}

.kt-term__value sup {
	font-size: 0.5em;
	vertical-align: super;
	margin-left: 0.04em;
}

.kt-term__label {
	display: block;
	margin-top: 0.5rem;
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.25;
}

.kt-term__note {
	display: block;
	margin-top: 0.3rem;
	font-size: 0.82rem;
	line-height: 1.35;
	color: var(--kt-muted);
}

.kt-term__sign {
	align-self: start;
	margin-top: 2.2rem;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.5rem;
	color: #b9c6bf;
}

.kt-extras {
	display: grid;
	gap: 1rem;
}

/* Значок и текст в строку, штрих тонкий — иначе иконка выглядит рисованной. */
.kt-extra {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 1rem 1.15rem;
	background: var(--kt-white);
	border: 1px solid var(--kt-hairline);
	border-radius: 14px;
	box-shadow: var(--kt-shadow-soft);
}

.kt-extra__icon {
	flex: 0 0 auto;
	width: 2.1rem;
	height: 2.1rem;
	color: #c79a3b;
}

.kt-extra__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.kt-extra__text {
	min-width: 0;
}

.kt-extra__title {
	display: block;
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.25;
}

.kt-extra__note {
	display: block;
	margin-top: 0.3rem;
	font-size: 0.84rem;
	line-height: 1.4;
	color: var(--kt-muted);
}

.kt-account__footnote {
	max-width: 44rem;
	margin: 1.75rem auto 0;
	font-size: 0.95rem;
	line-height: 1.65;
	text-align: center;
	color: var(--kt-muted);
}

/* --- Как это работает: пергаментная полоса во всю ширину -------------------- */

.kt-works {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-top: 2.5rem;
	padding: 3.5rem 1.5rem 4rem;
	background-color: #e7e2d8;
	background-image:
		radial-gradient(120% 90% at 12% 8%, rgba(250, 247, 240, 0.85), transparent 62%),
		radial-gradient(90% 70% at 88% 12%, rgba(220, 214, 202, 0.65), transparent 66%),
		radial-gradient(85% 80% at 72% 96%, rgba(214, 208, 195, 0.6), transparent 62%),
		radial-gradient(60% 55% at 22% 88%, rgba(245, 242, 235, 0.75), transparent 70%);
	/* Полоса лежит поверх страницы: тень уходит вверх и вниз от краёв. */
	box-shadow:
		0 -14px 28px -18px rgba(30, 58, 50, 0.35),
		0 14px 28px -18px rgba(30, 58, 50, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.kt-works__inner {
	max-width: var(--kt-max);
	margin: 0 auto;
}

.kt-works__title {
	margin: 0 0 2.25rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: clamp(1.5rem, 2.6vw, 2.15rem);
	text-align: center;
	color: var(--kt-ink);
}

/* Тонкая золотая нить с точкой посередине. */
.kt-works__divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	max-width: 46rem;
	margin: -1.25rem auto 3rem;
}

.kt-works__divider::before,
.kt-works__divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #e8d7ab 25%, #c79a3b 100%);
}

.kt-works__divider::after {
	background: linear-gradient(90deg, #c79a3b, #e8d7ab 75%, transparent);
}

.kt-works__divider span {
	flex: 0 0 auto;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #c79a3b;
}

.kt-steps__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Номер слева, текст справа. Плашек нет — держит сетка. */
.kt-step {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0.9rem;
	padding-right: 1rem;
}

.kt-step__num {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.45rem;
	color: #c79a3b;
	background: linear-gradient(160deg, #fffdf7, var(--kt-white));
	border: 1px solid #e8d7ab;
	border-radius: 12px;
	box-shadow: var(--kt-shadow-gold);
}

.kt-step__text {
	min-width: 0;
}

.kt-step__title {
	display: block;
	padding-top: 0.35rem;
	font-weight: 600;
	line-height: 1.3;
}

.kt-step__note {
	display: block;
	margin-top: 0.4rem;
	font-size: 0.86rem;
	line-height: 1.45;
	color: var(--kt-muted);
}

.kt-step__note--accent {
	color: var(--kt-deep);
}

.kt-step:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 1.4rem;
	right: -1.15rem;
	width: 0.5rem;
	height: 0.5rem;
	border-top: 1.5px solid #ccd8d1;
	border-right: 1.5px solid #ccd8d1;
	transform: rotate(45deg);
}

@media (max-width: 1000px) {
	.kt-account__card {
		grid-template-columns: 1fr;
		gap: 1.75rem;
		padding: 1.75rem;
	}

	.kt-account__sep {
		height: 1px;
		background: var(--kt-hairline);
	}

	.kt-extras {
		grid-template-columns: 1fr 1fr;
	}

	.kt-steps__list {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
	}

	.kt-step:not(:last-child)::after {
		display: none;
	}
}

@media (max-width: 620px) {
	.kt-formula {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}

	.kt-term__sign {
		margin: 0;
		justify-self: center;
	}

	.kt-extras {
		grid-template-columns: 1fr;
	}

	.kt-steps__list {
		grid-template-columns: 1fr;
	}
}

/* --- Об авторе и бизнес --------------------------------------------------- */

.kt-about {
	display: flex;
	gap: 2rem;
	align-items: flex-start;
}

.kt-about__photo {
	flex: 0 0 auto;
	width: 11rem;
	height: 11rem;
	border-radius: 50%;
	object-fit: cover;
}

.kt-author-photo img {
	border-radius: 12px;
}

@media (max-width: 700px) {
	.kt-about {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

.kt-about,
.kt-business {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 2rem 1.25rem;
}

.kt-about__text p,
.kt-business__text {
	max-width: 42rem;
	margin: 0 0 1.4rem;
	color: var(--kt-muted);
	line-height: 1.6;
}

.kt-business {
	margin-bottom: 3rem;
	padding: 2rem 1.5rem;
	background: var(--kt-beige);
	border-radius: 12px;
	box-shadow: var(--kt-shadow-soft);
}

.kt-business__title {
	margin: 0 0 0.6rem;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	font-size: 1.35rem;
	color: var(--kt-ink);
}

/* --- Каталог и акции ----------------------------------------------------- */

.kt-promo {
	max-width: var(--kt-max);
	margin: 0 auto;
	padding: 2rem 1.25rem 3rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.kt-promo__card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	min-height: 15rem;
	padding: 2rem;
	/* Цвет плашки снят пипеткой с левого края обеих картинок:
	   у каталога #E4E9E3, у акций #E5E8E3 — стык не виден. */
	background-color: #e4e9e3;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 100%;
	border-radius: 12px;
	box-shadow: var(--kt-shadow-card);
}

/* Текст не заезжает на картинку: она занимает правую часть карточки. */
.kt-promo__card--has-image .kt-promo__title,
.kt-promo__card--has-image .kt-promo__text {
	max-width: 60%;
}

/* Обе карточки одного оттенка: картинки совпадают по фону.
   Записываем только цвет — сокращённая форма background сбрасывала
   положение, повтор и масштаб фоновой картинки. */
.kt-promo__card--alt {
	background-color: #dde4dc;
}

.kt-promo__title {
	margin: 0 0 0.6rem;
	font-size: 1.4rem;
	color: var(--kt-ink);
}

.kt-promo__text {
	margin: 0 0 1.4rem;
	color: var(--kt-muted);
}

@media (max-width: 760px) {
	.kt-promo {
		grid-template-columns: 1fr;
	}
}
