/* =========================================================================
   pages-home.css — HOME (front-page.php) section styling
   Project: mikekarni · teya-generated-site · aiworkagents.ru
   Built by Aurora (HOME wave).

   Contract: ALL selectors scoped under .tmpl-home. Reuses dist tokens/components
   (.container, .section, .card, .btn, .market-stat, .quote-card, .process-node,
    .letter-card, .demo-card, .badge-trust, .transition--*, [data-reveal]).
   Does NOT touch assets/dist/*, inc/*, functions.php, header/footer, theme.json.
   on-light accent text uses --color-*-on-light AA tokens only.
   ========================================================================= */

/* -------------------------------------------------------------------------
   01 HERO — дизайн-язык К-3 «Смена» (T13-A)

   Слой токенов/компонентов К-3 лежит в assets/css/k3.css (подключается перед
   этим файлом). Здесь — только hero: сетка первого экрана, фото автора,
   лента рабочей недели и мини-калькулятор.
   Селекторы .home-hero__* сохранены там, где на них завязан GSAP-интро
   (assets/src/motion/motion-home.js).
   ------------------------------------------------------------------------- */

/* T16 F-1 (LCP) — первый экран НЕ проходит через «скрыть → показать».
   Глобальное правило dist/style.css `.js [data-reveal]{opacity:0}` держало hero
   невидимым, пока не отработает motion-home.js. Chrome не считает элементы с
   opacity:0 кандидатами в LCP, поэтому LCP-текст (p.home-hero__lead) ждал конца
   reveal-анимации: на мобильном профиле Render Delay 7749 мс = 93% от LCP 8.4 с.
   Здесь hero первого экрана выводится из-под этой механики: прозрачность всегда 1,
   вход остаётся, но живёт ТОЛЬКО на transform (см. motion-home.js buildHeroTimeline).
   Специфичность (id, класс/атрибут, элемент): у этого правила — (1,3,0)
   (#home-hero + .js + .tmpl-home + [data-reveal]), у глобального `.js [data-reveal]`
   в dist/style.css — (0,2,0). Побеждает уже по одному id, поэтому порядок
   подключения файлов роли не играет.
   [Исправлено T16/F4: в первой редакции здесь стояло «0,4,0 против 0,2,0» —
   неверно, находка M-2 ревью R1. Вывод правила это не меняет.]
   Всё, что ниже первого экрана, работает как раньше. */
.js .tmpl-home #home-hero[data-reveal],
.js .tmpl-home #home-hero [data-reveal],
.js .tmpl-home #home-hero [data-reveal-item] {
	opacity: 1;
}

.tmpl-home .home-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(180deg, #0A101C 0%, #0C1422 62%, #0A101C 100%);
	border-bottom: 1px solid var(--k3-line-soft);
	/* Hero прижат к шапке: первый экран должен вместить H1 + lead + CTA + калькулятор
	   ЦЕЛИКОМ, причём поверх него у первого посетителя лежит cookie-баннер
	   (footer.php, position:fixed, ~95px). Поэтому плотность считается по самому
	   низкому целевому вьюпорту — 1512×786 (фикс ревью I4). */
	padding-block: clamp(12px, 1.2vw, 16px) clamp(16px, 1.8vw, 22px);
}

.tmpl-home .home-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	gap: clamp(24px, 2.8vw, 40px);
	align-items: start;
}

.tmpl-home .home-hero__copy > * + * {
	margin-top: 14px;
}

.tmpl-home .home-hero__copy .k3-hero__eyebrow {
	display: block;
	color: var(--k3-teal);
	margin-bottom: 0;
}

.tmpl-home .home-hero__lead {
	max-width: 60ch;
	font-size: var(--k3-fs-hero);
	line-height: 1.5;
	color: var(--k3-muted);
}

/* CTA-пара держится в одну строку на десктопе */
.tmpl-home .home-hero__cta {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	margin-top: 18px;
}

.tmpl-home .home-hero__cta .k3-btn {
	white-space: nowrap;
	min-height: 50px;
	padding: 13px 20px;
	font-size: 15px;
}

.tmpl-home .home-hero__cta-note {
	max-width: 56ch;
	font-size: 15px;
	line-height: 1.45;
	color: var(--k3-muted);
}

/* 3 «ключевых факта» → строка бейджей с якорями на секции ниже */
.tmpl-home .home-hero__trust {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
	max-width: none;
	list-style: none;
}

.tmpl-home .home-hero__trust li {
	padding-left: 0;
}

.tmpl-home .home-hero__trust li::before {
	content: none;
}

.tmpl-home .home-hero__trust a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 14px;
	font-size: 15px;
	color: var(--k3-ink);
	border: 1px solid var(--k3-line);
	border-radius: var(--k3-radius-pill);
	background: var(--k3-surface);
	transition: border-color var(--k3-fast) var(--k3-ease),
		color var(--k3-fast) var(--k3-ease);
}

.tmpl-home .home-hero__trust a:hover {
	text-decoration: none;
	color: var(--k3-teal);
	border-color: var(--k3-teal);
}

.tmpl-home .home-hero__media {
	position: relative;
	display: block;
}

/* реальный артефакт первого экрана — фото автора, компактно */
.tmpl-home .k3-author {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 10px;
}

.tmpl-home .k3-author__img {
	width: 76px;
	height: 76px;
	flex: 0 0 auto;
	border-radius: var(--k3-radius-md);
	object-fit: cover;
	border: 1px solid var(--k3-line);
}

.tmpl-home .k3-author__cap {
	font-size: 15px;
	line-height: 1.35;
	color: var(--k3-ink);
}

.tmpl-home .k3-author__cap span {
	display: block;
	color: var(--k3-muted);
}

/* --- памятная деталь: лента рабочей недели ---
   Показывается скриптом вместе с калькулятором (hero-minicalc.js): без JS её
   шапка «N ч можно снять» расходилась бы с незакрашенной сеткой, а низ панели
   выглядел бы обрезанным (border-bottom:0 рассчитан на стык с карточкой). */
.tmpl-home .k3-ribbon[hidden] { display: none; }

.tmpl-home .k3-ribbon {
	padding: 9px 12px 8px;
	background: var(--k3-surface);
	border: 1px solid var(--k3-line-soft);
	border-radius: var(--k3-radius-lg) var(--k3-radius-lg) 0 0;
	border-bottom: 0;
}

.tmpl-home .k3-ribbon__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 6px 18px;
	flex-wrap: wrap;
	margin-bottom: 6px;
}

.tmpl-home .k3-ribbon__grid {
	display: grid;
	gap: 3px;
}

.tmpl-home .k3-ribbon__row {
	display: grid;
	grid-template-columns: 2.4em repeat(8, minmax(0, 1fr));
	gap: 3px;
	align-items: center;
}

.tmpl-home .k3-ribbon__day {
	font-family: var(--k3-mono);
	font-size: 12px;
	color: var(--k3-muted);
	letter-spacing: .04em;
}

.tmpl-home .k3-cell {
	height: clamp(9px, 1vw, 11px);
	border-radius: 4px;
	background: #1C2942;
	border: 1px solid #26344C;
	transition: background-color var(--k3-base) var(--k3-ease),
		border-color var(--k3-base) var(--k3-ease);
}

.tmpl-home .k3-cell.is-freed {
	background: var(--k3-teal);
	border-color: var(--k3-teal);
}

.tmpl-home .k3-ribbon__legend {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin-top: 5px;
}

.tmpl-home .k3-ribbon__legend span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-family: var(--k3-mono);
	font-size: var(--k3-fs-micro);
	color: var(--k3-muted);
	letter-spacing: .04em;
}

.tmpl-home .k3-dot {
	width: 11px;
	height: 11px;
	border-radius: 3px;
	flex: 0 0 auto;
}

.tmpl-home .k3-dot--freed { background: var(--k3-teal); }
.tmpl-home .k3-dot--manual { background: #1C2942; border: 1px solid #26344C; }

/* --- мини-калькулятор (шаг 13.1) --- */
.tmpl-home .k3-calc {
	padding: 9px 12px 10px;
	background: var(--k3-surface-2);
	border: 1px solid var(--k3-line-soft);
	border-radius: 0 0 var(--k3-radius-lg) var(--k3-radius-lg);
	box-shadow: var(--k3-shadow);
}

.tmpl-home .k3-calc[hidden] { display: none; }

/* Внутри карточки вертикальный ритм задают только собственные margin-top.
   Базовое `p { margin: 0 0 var(--space-md) }` из dist/style.css добавляло по 24px
   после результата и после оговорки — 48px впустую, из-за которых кнопку
   «Открыть полный калькулятор» закрывал cookie-баннер на 1512×786 (фикс ревью I4). */
.tmpl-home .k3-calc p { margin-bottom: 0; }
.tmpl-home .k3-calc > .k3-mono { margin-bottom: 2px; }
.tmpl-home .k3-calc__field + .k3-calc__field { margin-top: 2px; }

.tmpl-home .k3-calc__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
}

.tmpl-home .k3-calc__row label {
	font-size: 15px;
	color: var(--k3-ink);
}

.tmpl-home .k3-calc__val {
	font-family: var(--k3-mono);
	font-size: 15px;
	font-weight: 500;
	color: var(--k3-teal-soft);
	white-space: nowrap;
}

.tmpl-home .k3-calc__scale {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-family: var(--k3-mono);
	font-size: 12px;
	color: var(--k3-muted);
	margin-top: -6px;
}

.tmpl-home .k3-calc__result {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid var(--k3-line-soft);
	font-size: 15px;
	color: var(--k3-muted);
}

/* Число результата — БЕЛОЕ с бирюзовой подводкой: второго золота в первом
   экране быть не может, золотой кластер там ровно один — CTA анализа. */
.tmpl-home .k3-calc__num {
	display: inline-block;
	font-family: var(--k3-display);
	font-weight: 600;
	font-size: var(--k3-fs-num);
	line-height: 1.05;
	letter-spacing: -.03em;
	color: #FFFFFF;
	min-width: 3.2ch;
	text-align: right;
	font-variant-numeric: tabular-nums;
	border-bottom: 3px solid var(--k3-teal);
	box-shadow: 0 10px 26px -10px rgba(43, 184, 163, .60);
}

.tmpl-home .k3-calc__tail {
	font-size: 15px;
	color: var(--k3-ink);
}

.tmpl-home .k3-calc__caveat {
	margin-top: 5px;
	font-family: var(--k3-mono);
	font-size: 12px;
	color: var(--k3-muted);
	line-height: 1.45;
	letter-spacing: .02em;
	text-transform: none;
}

.tmpl-home .k3-calc .k3-btn {
	margin-top: 8px;
	width: 100%;
	min-height: 48px;
	font-size: 15px;
}

/* ползунки: бирюза = интерактив, трек 6px, зона нажатия 44px */
.tmpl-home .k3-range {
	-webkit-appearance: none;
	appearance: none;
	display: block;
	width: 100%;
	height: 44px;
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	cursor: pointer;
	touch-action: pan-y;
	--fill: 25%;
}

.tmpl-home .k3-range::-webkit-slider-runnable-track {
	height: 6px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--k3-teal) 0 var(--fill), #24314A var(--fill) 100%);
}

.tmpl-home .k3-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 22px;
	height: 22px;
	margin-top: -8px;
	border-radius: 50%;
	background: var(--k3-teal);
	border: 3px solid #0B1220;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 16px rgba(0, 0, 0, .35);
	transition: transform var(--k3-fast) var(--k3-ease),
		background-color var(--k3-fast) var(--k3-ease);
}

.tmpl-home .k3-range:hover::-webkit-slider-thumb {
	transform: scale(1.14);
	background: var(--k3-teal-soft);
}

.tmpl-home .k3-range:active::-webkit-slider-thumb {
	transform: scale(1.02);
}

.tmpl-home .k3-range::-moz-range-track {
	height: 6px;
	border-radius: 3px;
	background: #24314A;
}

.tmpl-home .k3-range::-moz-range-progress {
	height: 6px;
	border-radius: 3px;
	background: var(--k3-teal);
}

.tmpl-home .k3-range::-moz-range-thumb {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--k3-teal);
	border: 3px solid #0B1220;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 16px rgba(0, 0, 0, .35);
	transition: transform var(--k3-fast) var(--k3-ease),
		background-color var(--k3-fast) var(--k3-ease);
}

.tmpl-home .k3-range:hover::-moz-range-thumb {
	transform: scale(1.14);
	background: var(--k3-teal-soft);
}

.tmpl-home .k3-range:focus-visible {
	outline: 3px solid var(--k3-focus);
	outline-offset: 2px;
	border-radius: 8px;
}

/* --- hero: адаптив --- */
@media (max-width: 1080px) {
	.tmpl-home .home-hero__inner {
		grid-template-columns: 1fr;
	}

	.tmpl-home .home-hero__media {
		max-width: 640px;
	}
}

@media (max-width: 700px) {
	.tmpl-home .home-hero__cta {
		flex-wrap: wrap;
	}

	.tmpl-home .home-hero__cta .k3-btn {
		flex: 1 1 100%;
		white-space: normal;
	}
}

@media (max-width: 600px) {
	.tmpl-home .k3-cell { height: 18px; }

	.tmpl-home .k3-range::-webkit-slider-thumb {
		width: 26px;
		height: 26px;
		margin-top: -10px;
	}

	.tmpl-home .k3-range::-moz-range-thumb {
		width: 26px;
		height: 26px;
	}

	.tmpl-home .k3-calc__row {
		flex-direction: column;
		align-items: flex-start;
		gap: 2px;
	}
}

/* Полные формулировки C-4 и M-10, переехавшие из hero (шаги 13.2/13.3).
   T13-B: маркер и типографика пунктов теперь у компонента .k3-list (k3.css),
   здесь осталась только геометрия блока — иначе маркер рисовался бы дважды. */
.tmpl-home .home-utp__facts {
	max-width: 68ch;
	/* T13-B, фикс I-1: список стал последним узлом .home-utp__copy, вертикальный
	   зазор до mono-строки теперь задаёт row-gap сетки .home-utp__inner. */
	margin-bottom: 0;
	list-style: none;
}

/* -------------------------------------------------------------------------
   02 MARKET STRIP
   T13-B: .market-stat / .home-market__note / .home-market__extra в разметке
   больше нет — секция собрана на компонентах К-3 (.k3-card, .k3-stat__*,
   .k3-note). Их правила удалены, чтобы не спорить со слоем К-3.
   ------------------------------------------------------------------------- */
.tmpl-home .home-market__grid {
	margin-bottom: var(--space-lg);
}

/* -------------------------------------------------------------------------
   03 PAIN
   ------------------------------------------------------------------------- */
.tmpl-home .home-pain__head {
	max-width: 60ch;
	margin-bottom: var(--space-lg);
}

.tmpl-home .home-pain__layout {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: var(--space-lg);
	align-items: center;
}

.tmpl-home .home-pain__quotes {
	gap: var(--space-md);
}

/* T13-B: цитаты собраны на компоненте .k3-quote (k3.css) — правило .quote-card
   удалено вместе с классом из разметки. */

/* T13-B, фикс ревью M-7: скругление и рамка — на .k3-figure img (k3.css),
   обёртка их больше не дублирует (см. комментарий в §04 UTP). */
.tmpl-home .home-pain__visual {
	margin: 0;
}

.tmpl-home .home-pain__img {
	width: 100%;
	height: auto;
}

/* T13-B: кегль и цвет закрывающего абзаца даёт .k3-lead (k3.css), здесь только отступ. */
.tmpl-home .home-pain__close {
	max-width: 72ch;
	margin: var(--space-lg) 0 0;
}

/* -------------------------------------------------------------------------
   04 UTP
   T13-B: золотой радиальный намыв фона снят — по канону К-3 золото занято
   единственной CTA анализа, а тёмная секция ровная (--k3-bg из k3.css).

   T13-B, фикс ревью I-1 — перекомпоновка.
   Было: `1.3fr 0.7fr` + `align-items:center`, и ВСЁ (шапка, список, mono-строка
   и три карточки сравнения) жило в левой колонке. Итог на 1440/1280: карточки
   ужаты до ~215px с ломкой заголовков («Дешёвые / боты с бирж»), а под
   иллюстрацией — пустой прямоугольник ~450×340.
   Стало: как в эталоне К-3 (concepts/K-3/index.html, «02 · что забирает агент»)
   — двухколоночная шапка (пропорции .k3-drain__layout: 1.25fr / .75fr,
   `align-items:start`), а mono-строка и ряд карточек идут ПОД ней во всю
   ширину контейнера (`grid-column: 1 / -1`), как `.k3-mono-line` +
   `.k3-grid--3.k3-mt-l` в концепте. Разметка при этом только переставлена:
   .k3-mono-line и .home-utp__pillars вынесены из .home-utp__copy в сетку.
   Вертикальный ритм даёт row-gap сетки, поэтому собственные margin-top этих
   двух узлов гасятся — селекторы `.home-utp__inner > …` весят (0,3,0) и
   перебивают `body.home .k3-mono-line` (0,2,1).
   ------------------------------------------------------------------------- */
.tmpl-home .home-utp__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
	gap: var(--space-lg) var(--space-xl);
	align-items: start;
}

/* Колонки шапки НЕ адресуются явно (`grid-column: 1` / `2`): при схлопывании
   сетки в одну колонку на ≤960px явный номер создаёт неявную вторую колонку и
   иллюстрация ужимается до ~53px. Копия и фигура раскладываются автоматически,
   а полноширинные узлы объявлены через `1 / -1` — это работает в обоих
   раскладах. Проверено замером на 375 (frame375-probe).

   Иллюстрация 16:9 (1672×941) в колонке 0.75fr даёт ~426×241 — короче текстовой
   колонки в любом раскладе, растянуть её без кропа нельзя. Поэтому она
   центрируется по ряду: остаток воздуха делится поровну сверху и снизу и
   читается как поле, а не как дыра под картинкой. */
.tmpl-home .home-utp__inner > .home-utp__visual {
	align-self: center;
}

.tmpl-home .home-utp__inner > .k3-mono-line,
.tmpl-home .home-utp__inner > .home-utp__pillars {
	grid-column: 1 / -1;
	margin-top: 0;
}

/* T13-B: акцент карточки «Я» переехал на .k3-card--me (бирюзовая рамка) —
   золотая обводка и --glow-gold были вторым золотым кластером на экране. */

/* T13-B, фикс ревью M-7: скругление и рамку иллюстрации задаёт компонент
   .k3-figure img (k3.css). Собственные border-radius + overflow:hidden у
   обёртки давали второе скругление другого радиуса и подрезали рамку
   картинки по углам. Осталась только геометрия блока. */
.tmpl-home .home-utp__visual {
	margin: 0;
}

.tmpl-home .home-utp__img {
	width: 100%;
	height: auto;
}

/* -------------------------------------------------------------------------
   05 SOLUTIONS HUB
   ------------------------------------------------------------------------- */
.tmpl-home .home-solutions__grid {
	margin-bottom: var(--space-lg);
}

/* T13-B: цвет текста задаёт светлая трактовка .k3-card (k3.css). */
.tmpl-home .home-solutions__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	text-align: left;
}

.tmpl-home .home-solutions__card:hover {
	text-decoration: none;
}

/* T13-B, фикс ревью M-7: две карточки направления несут растровую иконку
   .card__icon (96px из dist/style.css), две — глифовую плашку 64px, и базовые
   линии заголовков в ряду расходились на 32px. Единое решение — медиа-слот
   карточки К-3 равен 64px в обоих случаях. Правило скоупировано карточками
   этой секции, .card__icon на остальных страницах не затрагивается. */
.tmpl-home .home-solutions__card .card__icon {
	width: 64px;
	height: 64px;
}

.tmpl-home .home-solutions__glyph {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin-bottom: var(--space-sm);
	font-size: 32px;
	color: var(--color-teal-on-light);
	background: rgba(24, 120, 107, 0.10);
	border-radius: var(--radius-md);
}

/* T13-B: кегль, цвет и прижатие к низу карточки даёт .k3-card__cta (k3.css);
   здесь остаётся только подчёркивание по ховеру карточки. */
.tmpl-home .home-solutions__card:hover .home-solutions__link,
.tmpl-home .home-segments__card:hover .home-segments__link {
	text-decoration: underline;
}

.tmpl-home .home-solutions__cross,
.tmpl-home .home-segments__cross,
.tmpl-home .home-process__link,
.tmpl-home .home-trust__link,
.tmpl-home .home-pricing__link,
.tmpl-home .home-faq__all {
	margin: 0;
	font-weight: 600;
}

/* T13-B, фикс ревью M-1: зона нажатия двух кросс-ссылок зоны была 18px.
   Кегль и цвет .k3-note не трогаем — ссылка становится inline-flex с
   min-height 44px, текст остаётся по центру строки. */
.tmpl-home .home-solutions__cross a,
.tmpl-home .home-segments__cross a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* -------------------------------------------------------------------------
   06 PRODUCTS STRIP
   ------------------------------------------------------------------------- */
/* T13-B: цвет текста задаёт тёмная трактовка .k3-card (k3.css). */
.tmpl-home .home-products__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	text-align: center;
}

.tmpl-home .home-products__card:hover {
	text-decoration: none;
}

.tmpl-home .home-products__icon {
	width: 112px;
	height: 112px;
	margin: 0 auto var(--space-sm);
}

/* T13-B: подпись-переход собрана на .k3-card__cta (k3.css). Ховер темы красил
   её в золото — на главной золото зарезервировано за CTA анализа, поэтому
   подсветка по ховеру ушла в бирюзу (.k3-card__cta в k3.css). */

/* -------------------------------------------------------------------------
   07 SEGMENTS
   ------------------------------------------------------------------------- */
/* T13-B, фикс ревью M-7: скругление/рамка — на .k3-figure img (k3.css).
   Тень обёртки снята вместе с обрезкой: в языке К-3 иллюстрация — рамка 1px
   плюс радиус, без карточной тени (concepts/K-3/index.html, .k3-figure). */
.tmpl-home .home-segments__visual {
	margin: 0 0 var(--space-lg);
}

.tmpl-home .home-segments__img {
	width: 100%;
	height: auto;
}

.tmpl-home .home-segments__grid {
	margin-bottom: var(--space-lg);
}

.tmpl-home .home-segments__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}

.tmpl-home .home-segments__card:hover {
	text-decoration: none;
}

/* -------------------------------------------------------------------------
   08 PROCESS
   T13-C: пять шагов собраны на компоненте .k3-step (k3.css §6c), схема — на
   .k3-figure, раскладка — .k3-split. Сняты декларации старого языка темы:
   сетка шагов repeat(5,1fr) (шаг стал строкой «номер + формулировка»),
   скругление и обрезка обёртки схемы (их держит .k3-figure img), кегли и цвет
   номера/подписи (их задаёт .k3-step__n/.k3-step__t). Осталась геометрия,
   которой в слое К-3 нет.
   ------------------------------------------------------------------------- */
.tmpl-home .home-process__img {
	width: 100%;
	height: auto;
}

.tmpl-home .home-process__layout {
	margin-bottom: var(--space-lg);
}

/* -------------------------------------------------------------------------
   09 TRUST
   T13-C: сканы писем переведены на .k3-figure (рамку и скругление держит
   .k3-figure img, подпись — figcaption компонента), бейдж «Честно» — .k3-badge.
   Сняты: правила .letter-card__img/.letter-card:hover (класс .letter-card из
   темы больше не используется — он давал вторую карточную обёртку с тенью,
   а его inset-outline спорил с рамкой .k3-figure img), .home-trust__head
   .badge-trust, а также мёртвый блок .home-trust__demo/.demo-card__img
   (демо-карточки в разметке главной нет; его ::after светился --glow-gold).
   Кадрирование скана 4:3 сохранено — на своём хуке .home-trust__img.
   ------------------------------------------------------------------------- */
.tmpl-home .home-trust__head {
	max-width: 72ch;
}

.tmpl-home .home-trust__letters {
	margin-bottom: var(--space-md);
}

.tmpl-home .home-trust__img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.tmpl-home .home-trust__letters-note {
	margin-bottom: var(--space-lg);
}

/* -------------------------------------------------------------------------
   10 PRICING
   T13-C: три зоны собраны на том же .k3-step, что и шаги работы. Снято:
   .home-pricing__num (номер зоны красился --color-primary, то есть золотом —
   второй золотой кластер в экране золотой CTA; теперь это бирюзовый
   .k3-step__n) и .home-pricing__risk с золотым бейджем темы.
   ------------------------------------------------------------------------- */
.tmpl-home .home-pricing__risk .k3-badge {
	margin-right: var(--space-xs);
}

.tmpl-home .home-pricing__cta {
	margin: var(--space-md) 0 var(--space-sm);
}

/* -------------------------------------------------------------------------
   11 FAQ
   ------------------------------------------------------------------------- */
.tmpl-home .home-faq__list {
	margin-bottom: var(--space-lg);
}

/* T13-C: аккордеон собран на .k3-faq__item/__q/__a (k3.css §6c). Сняты правила
   старого языка темы, спорившие с компонентом: типографика и абсолютный маркер
   «+» (в К-3 маркер — flex-элемент строки, поэтому два маркера наложились бы
   друг на друга), цвет и паддинги ответа. Остались только `interpolate-size`
   и анимация раскрытия, которых в слое К-3 нет. */
.tmpl-home .home-faq__item {
	interpolate-size: allow-keywords;
}

.tmpl-home .home-faq__a {
	transition: height var(--dur-base) var(--ease-standard);
}

.tmpl-home .home-faq__a p {
	margin-bottom: var(--space-sm);
}

.tmpl-home .home-faq__a-link {
	margin: 0;
	font-weight: 600;
}

/* -------------------------------------------------------------------------
   BLOG BLOCK
   ------------------------------------------------------------------------- */
.tmpl-home .home-blog__head {
	max-width: 60ch;
	margin-bottom: var(--space-lg);
}

/* T13-C: карточка статьи — .k3-card. Обнуление паддинга и обрезка обложки
   объявлены в k3.css (§6c): любое поэлементное правило ЭТОГО файла (0,2,0)
   проигрывает компоненту `body.home .k3-card` (0,2,1) — находка T13-B §6.1. */
.tmpl-home .home-blog__cover {
	display: block;
	line-height: 0;
}

.tmpl-home .home-blog__img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform var(--dur-base) var(--ease-standard);
}

.tmpl-home .home-blog__card:hover .home-blog__img {
	transform: scale(1.04);
}

.tmpl-home .home-blog__body {
	padding: var(--space-md);
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}

/* T13-C: кегль и цвет мета-строки задаёт .k3-card__meta (k3.css). Ховер
   заголовка уводил в золото (--color-primary) — на главной золото
   зарезервировано за CTA анализа, цвет ссылки-заголовка объявлен в k3.css. */
.tmpl-home .home-blog__cat {
	color: var(--color-secondary);
}

.tmpl-home .home-blog__title {
	margin: 0;
}

.tmpl-home .home-blog__all {
	margin: var(--space-lg) 0 0;
	text-align: center;
}

/* -------------------------------------------------------------------------
   12 CTA (cross-cutting before footer)
   ------------------------------------------------------------------------- */
/* T13-C: золотой радиальный намыв фона снят — в финальном экране золото
   остаётся ровно одно, кнопка CTA. Сам градиент К-3 объявлен в k3.css:
   правило `body.home .section--dark` (0,2,1) перебило бы фон, заданный здесь
   (0,2,0), и секция вышла бы плоской — проверено computed-замером. */
.tmpl-home .home-cta {
	text-align: center;
}

.tmpl-home .home-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-md);
}

.tmpl-home .home-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	justify-content: center;
}

.tmpl-home .home-cta__phone {
	margin: 0;
	display: flex;
	justify-content: center;
}

/* Duplicate .btn--phone shimmer block removed (T3 3.13): front-page.php:645 now uses
   the canonical `.btn btn--phone` component (dist/style.css); this raw-link twin was dead. */

/* Mobile sticky CTA wrapper (dist toggles [data-sticky-cta] display) */
.tmpl-home .home-sticky-cta {
	gap: var(--space-sm);
}

/* -------------------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------------------- */
@media (max-width: 960px) {
	.tmpl-home .home-hero__inner,
	.tmpl-home .home-utp__inner,
	.tmpl-home .home-pain__layout {
		grid-template-columns: 1fr;
	}
	/* T13-C: перекладки .home-process__steps здесь больше нет — шаги стали
	   вертикальным списком .k3-steps на всех ширинах (k3.css §6c), а раскладка
	   «список + схема» схлопывается в один столбец на 860px там же. */
}

@media (max-width: 768px) {
	/* T13-A: правило .home-hero__media{order:-1} снято — в языке К-3 калькулятор
	   обязан идти ПОСЛЕ H1 и CTA (и в DOM, и на экране), иначе он перекрывает
	   LCP-элемент и первый экран мобильного открывается виджетом, а не оффером.
	   Правила .home-hero__object убраны вместе с самим декор-объектом. */
	.tmpl-home .home-pain__quotes {
		grid-template-columns: 1fr;
	}
}

/* T13-C: блок @media (max-width: 600px) с перекладкой .home-process__steps
   удалён — правило стало мёртвым вместе с сеткой шагов (см. выше). */

/* =========================================================================
   T16 F-5 (FCP) — «бюджетная компоновка первого кадра».

   Проблема. До первой отрисовки браузер обязан скомпоновать ВЕСЬ документ,
   а главная — 20 507 px ≈ 25 экранов. На мобильном профиле (CPU ×4) один
   первичный Layout занимал 1 079 мс и держал FCP; при этом LCP == FCP до
   миллисекунды (и на стенде, и на бою — см. T16/D1-deploy.md), то есть весь
   остаток бюджета LCP упирался именно в эту компоновку. Скрипты тут ни при
   чём: замер со снятыми main.js/motion-home.js двигал FCP в пределах шума —
   они отложенные и выполняются уже ПОСЛЕ первого кадра.

   Решение. Секции ниже первого экрана на время первой компоновки помечаются
   content-visibility:auto — браузер пропускает их layout. Первый экран
   (#home-hero) под правило НЕ попадает: он должен быть скомпонован и виден
   в первом кадре, иначе уедет LCP (правка T16/F-1).

   Класс `perf-cv` ставится в header.php и снимается в assets/src/main.js
   по двойному requestAnimationFrame — то есть сразу после первого
   отрисованного кадра. Дальше страница живёт без containment: реальная
   высота документа, корректные позиции для ScrollTrigger (motion-home.js
   инициализируется ~на секунду позже), нормальные якорные переходы.

   Замер на стенде (зеркало боевой главной, Chrome, CPU ×4, медиана 5):
     Layout до FCP  1079 → 582 мс
     FCP            1796 → 1162 мс
   Проверка отсутствия визуальных изменений: 5 скриншотов (моб. + десктоп)
   побайтно идентичны версии без правки, scrollHeight совпадает, все 60
   reveal-узлов доезжают до opacity 1.

   Эталон К-3 «Смена» не затронут: правило не меняет ни один цвет, шрифт,
   отступ, размер или порядок элементов — только МОМЕНТ их компоновки.
   ========================================================================= */
html.perf-cv .tmpl-home > section:not(#home-hero) {
	content-visibility: auto;
	contain-intrinsic-size: auto 1200px;
}
