/* =========================================================================
   Атлант — основной стиль темы
   Макет свёрстан от 1920px, все размеры переведены во fluid-значения,
   чтобы сайт одинаково хорошо смотрелся на 1280 / 1440 / 1600 / 1920 / 2560.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Токены
   ---------------------------------------------------------------------- */

:root {
	/* Цвета из макета */
	--c-ink:        #18191f;
	--c-ink-soft:   #1b181f;
	--c-body:       #5b6067;
	--c-muted:      #9b9ca1;
	--c-gold:       #ebc97c;
	--c-gold-deep:  #e1bf85;
	--c-gold-ink:   #614e23;
	/* Золото для знаков и текста на светлом: #ebc97c там не читается.
	   Тот же цвет, что у острого треугольника из макета (eyebrow-triangle-gold.svg). */
	--c-gold-mark:  #b8983c;
	--c-bg:         #f3f4f7;
	--c-beige:      #e6e4de;
	--c-beige-soft: #edebe5;
	--c-white:      #ffffff;
	--grad-gold:    linear-gradient(124.24deg, #efd7a9 4.97%, #deb97c 51.19%, #efd7a9 97.42%);

	--c-line:       rgba(24, 25, 31, 0.14);
	--c-line-hard:  #cdcdcd;
	--c-ink-alt:    #111827;
	--c-line-soft:  rgba(24, 25, 31, 0.08);
	--c-field-line: #cdcdcd;

	/* Типографика */
	/* «Hint» — гарнитура из макета. Если её файлов нет в assets/fonts/,
	   браузер молча берёт следующую в списке. */
	--font-display: "Hint", "Wix Madefor Display", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font-ui:      "Hint", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

	/* Шкала: min при 1280px, max при 1920px */
	--fs-h1:     clamp(38px, 4.1667vw, 80px);
	--fs-h2:     clamp(32px, 3.3333vw, 64px);
	--fs-h3:     clamp(22px, 1.8750vw, 36px);
	--fs-lead:   clamp(17px, 1.2500vw, 24px);
	--fs-body:   clamp(15px, 1.0417vw, 20px);
	--fs-sm:     clamp(14px, 0.9375vw, 18px);
	--fs-eyebrow: clamp(13px, 0.9375vw, 18px);

	/* Сетка и отступы */
	--pad-x:     clamp(16px, 3.125vw, 60px);
	--gap:       clamp(12px, 1.0417vw, 20px);
	--gap-lg:    clamp(20px, 2.0833vw, 40px);
	--section-y: clamp(64px, 10.4167vw, 200px);

	--r-sm:      clamp(12px, 1.0417vw, 20px);
	--r-md:      clamp(20px, 2.0833vw, 40px);
	--r-lg:      clamp(28px, 4.1667vw, 80px);
	--r-pill:    100px;

	--head-col:   clamp(150px, 17.865vw, 343px);
	--container:  1800px;

	/* Шапка. Она всегда зафиксирована, а при скролле сжимается: логотип
	   уменьшается, вертикальные отступы становятся меньше. Высоту считаем
	   из логотипа и отступов, поэтому --header-h и --header-h-sm всегда
	   совпадают с реальной высотой — их можно закладывать в отступы. */
	--hdr-pad:       clamp(14px, 2.0833vw, 40px);
	--hdr-logo-w:    clamp(58px, 5.9896vw, 115px);
	--hdr-logo-h:    clamp(51px, 5.2604vw, 101px);
	--header-h:      calc(var(--hdr-logo-h) + var(--hdr-pad) * 2);

	--hdr-pad-sm:    clamp(8px, 0.9375vw, 18px);
	--hdr-logo-w-sm: clamp(44px, 4.0104vw, 77px);
	--hdr-logo-h-sm: clamp(39px, 3.5417vw, 68px);
	/* Ниже ~1330px логотип становится меньше меню и бургера — строку держат они. */
	--hdr-row-sm:    max(var(--hdr-logo-h-sm), 47px);
	--header-h-sm:   calc(var(--hdr-row-sm) + var(--hdr-pad-sm) * 2);
	/* На сколько подложка шапки свисает ниже её края: блюр и тонировка
	   догасают уже за границей, поэтому стыка не видно. */
	--hdr-fade:      clamp(24px, 2.6042vw, 50px);

	/* Движение */
	/* Оптическое центрирование прописных. Посчитано по метрикам Hint:
	   ascender 0.9067, descender 0.2930, capHeight 0.6665 — центр капители
	   на 0.0264em выше центра строки, поэтому подпись сдвигается вниз.
	   (Для запасной Wix Madefor Display значение было бы -0.021em.) */
	--cap-fix:    0.026em;

	--ease:       cubic-bezier(0.22, 1, 0.36, 1);
	--ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
	--dur:        0.45s;
	--dur-slow:   0.8s;

	/* Подъём карточки на ховере. Базовый --ease (easeOutQuint) выбирает ~72%
	   пути за первые 20% времени, и на дистанции в 4px это читается как рывок.
	   Здесь кривая с плавным разгоном, поэтому движение видно целиком. */
	--ease-lift:  cubic-bezier(0.33, 0, 0.2, 1);
	--dur-lift:   0.6s;

	/* Готовый список для ховер-подъёма: его приходится дописывать к --t-reveal
	   у карточек с data-reveal, см. раздел 30. Здесь объединение всех свойств,
	   которые карточки меняют на ховере: лишние в конкретной карточке ничего
	   не стоят, зато список один на всех и его негде рассинхронить. */
	--t-lift:
		transform var(--dur-lift) var(--ease-lift),
		box-shadow var(--dur-lift) var(--ease-lift),
		border-color var(--dur-lift) var(--ease-lift),
		background-color var(--dur-lift) var(--ease-lift);

	--shadow-card: 0 18px 50px -24px rgba(24, 25, 31, 0.28);
	--shadow-pop:  0 26px 60px -22px rgba(24, 25, 31, 0.34);
}

/* -------------------------------------------------------------------------
   2. Сброс и база
   ---------------------------------------------------------------------- */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* К якорю прокручиваем с запасом под сжатую шапку — при скролле она именно такая. */
	scroll-padding-top: calc(var(--header-h-sm) + 24px);
}

body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-ink);
	font-family: var(--font-ui);
	font-size: var(--fs-body);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body.is-locked { overflow: hidden; }

h1, h2, h3, h4, h5, h6, p, figure, ul, ol, dl { margin: 0; }
ul, ol { padding: 0; list-style: none; }

img, svg, video { display: block; max-width: 100%; }
img { height: auto; }

a { color: inherit; text-decoration: none; }

button, input, textarea, select {
	font: inherit;
	color: inherit;
}

button { cursor: pointer; }

:focus-visible {
	outline: 2px solid var(--c-gold-ink);
	outline-offset: 3px;
	border-radius: 4px;
}

::selection {
	background: var(--c-gold);
	color: var(--c-gold-ink);
}

.skip-link {
	position: fixed;
	top: 8px;
	left: 8px;
	z-index: 999;
	padding: 12px 20px;
	border-radius: var(--r-pill);
	background: var(--c-ink);
	color: var(--c-white);
	transform: translateY(-200%);
	transition: transform var(--dur) var(--ease);
}

.skip-link:focus { transform: translateY(0); }

.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* -------------------------------------------------------------------------
   3. Раскладка
   ---------------------------------------------------------------------- */

.container {
	width: 100%;
	max-width: calc(var(--container) + var(--pad-x) * 2);
	margin-inline: auto;
	padding-inline: var(--pad-x);
}

/* Шапка вынута из потока (position: fixed) — держим под неё место.
   На главной этого не нужно: там шапка лежит поверх первого экрана. */
body:not(.has-overlay-header) .site-main { padding-top: var(--header-h); }

.section { padding-block: calc(var(--section-y) * 0.5); }
.site-main > .section:first-child { padding-top: var(--section-y); }
.site-main > .hero-inner:first-child { padding-top: 0; }
.site-main > .section:last-child  { padding-bottom: var(--section-y); }

/* -------------------------------------------------------------------------
   4. Типографика
   ---------------------------------------------------------------------- */

.h1, .h2, .h3 {
	font-family: var(--font-display);
	font-weight: 400;
	color: var(--c-ink);
	text-wrap: balance;
}

.h1 { font-size: var(--fs-h1); line-height: 1.05; letter-spacing: -0.04em; }
.h2 { font-size: var(--fs-h2); line-height: 1.0;  letter-spacing: -0.02em; }
.h3 { font-size: var(--fs-h3); line-height: 1.08; letter-spacing: -0.01em; }

.accent { color: var(--c-gold); }
.is-muted { color: var(--c-muted); }
/* Акцент в заголовке — то же светлое золото, что у «маркетплейсов и e-com»
   на первом экране главной: так попросил клиент, хотя на светлом фоне оно бледнее. */
.is-accent { color: var(--c-gold); }
.line { display: block; }

/* Ручные переносы из макета. На узких экранах текст перетекает сам. */
.br-lg { display: none; }
@media (min-width: 1025px) { .br-lg { display: inline; } }

/* Переносы мобильного макета 480: на планшете и десктопе строки другие. */
.br-sm { display: none; }
@media (max-width: 520px) { .br-sm { display: inline; } }

/* Треугольник 15×13 (#D9D9D9) + подпись 18px/0.1em с прозрачностью 30% */
.eyebrow {
	display: flex;
	align-items: flex-start;
	gap: clamp(14px, 1.5625vw, 30px);
	margin: 0;
	font-size: var(--fs-eyebrow);
}

.eyebrow__marker {
	flex: none;
	width: clamp(11px, 0.78125vw, 15px);
	margin-top: 0.28em;
	line-height: 0;
	transition: transform var(--dur) var(--ease);
}

/* Знак «глазка» один на весь сайт: золотой и остриём вправо (задача 8).
   Исходный треугольник нарисован вершиной вверх — разворачиваем поворотом.
   Вариант «sm» уже нарисован вправо, его не трогаем. */
.eyebrow:not(.eyebrow--sm) .eyebrow__marker { rotate: 90deg; }

.eyebrow__marker svg { width: 100%; height: auto; }
.eyebrow__marker svg path { fill: var(--c-gold-mark); }

.eyebrow__text {
	max-width: clamp(100px, 8.6vw, 165px);
	font-family: var(--font-ui);
	font-size: var(--fs-eyebrow);
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--c-ink);
	opacity: 0.3;
}

.eyebrow--gold .eyebrow__marker svg path { fill: var(--c-gold-mark); }
.eyebrow--gold .eyebrow__text { opacity: 0.55; }

/* -------------------------------------------------------------------------
   5. Кнопки, значки, соцсети
   ---------------------------------------------------------------------- */

.btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: clamp(10px, 1.0417vw, 20px);
	padding: clamp(14px, 1.5625vw, 30px) clamp(22px, 2.0833vw, 40px);
	border: 0;
	border-radius: var(--r-pill);
	background: var(--c-gold);
	color: var(--c-gold-ink);
	font-family: var(--font-display);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	white-space: nowrap;
	isolation: isolate;
	overflow: hidden;
	transition:
		transform var(--dur) var(--ease),
		box-shadow var(--dur) var(--ease),
		color var(--dur) var(--ease);
}

/* Заливка, наезжающая слева направо при наведении */
.btn::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--c-ink);
	transform: translateX(-101%);
	transition: transform var(--dur) var(--ease);
}

.btn:hover,
.btn:focus-visible {
	transform: translateY(-3px);
	color: var(--c-white);
}

.btn:hover::before,
.btn:focus-visible::before { transform: translateX(0); }

.btn:active { transform: translateY(-1px) scale(0.985); }

.btn__arrow,
.btn__icon {
	flex: none;
	width: 8px;
	height: 13px;
	transition: transform var(--dur) var(--ease);
}

.btn__arrow path,
.btn__icon path { fill: currentColor; }

.btn:hover .btn__arrow { transform: translateX(5px); }

/* Подпись центрируем по прописным, иначе она не совпадает со стрелкой */
.btn > span {
	line-height: 1;
	transform: translateY(var(--cap-fix));
}


.btn--white {
	gap: clamp(6px, 0.4167vw, 8px);
	line-height: 1;
	background: var(--c-white);
	color: var(--c-ink);
	font-family: var(--font-ui);
	font-size: var(--fs-sm);
	letter-spacing: -0.02em;
	padding: clamp(11px, 0.859vw, 16px) clamp(17px, 1.25vw, 24px);
	/* По макету у кнопки своя подложка: белая заливка и рамка #cdcdcd. */
	border: 1px solid var(--c-line-hard);
	/* Список целиком: одна border-color гасила анимацию подъёма и цвета,
	   и кнопка прыгала вверх рывком. Подъём — на плавной кривой карточек. */
	transition:
		transform var(--dur-lift) var(--ease-lift),
		color var(--dur) var(--ease),
		border-color var(--dur) var(--ease);
}

/* На ховере кнопка заливается тёмным, и светлая рамка иначе висит кольцом. */
.btn--white:hover,
.btn--white:focus-visible { border-color: var(--c-ink); }

.btn--white .btn__icon { width: 12px; height: 12px; }

.btn--ghost {
	background: transparent;
	color: var(--c-ink);
	box-shadow: inset 0 0 0 1px var(--c-line);
}

.btn--sm {
	padding: clamp(10px, 0.8333vw, 16px) clamp(16px, 1.25vw, 24px);
	font-size: var(--fs-sm);
}

.btn--call .btn__icon { width: 12px; height: 12px; }

/* Круглые номера у карточек */
.num-badge {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: clamp(36px, 2.6042vw, 50px);
	height: clamp(36px, 2.6042vw, 50px);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	font-family: var(--font-ui);
	font-size: var(--fs-eyebrow);
	line-height: 1;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	color: var(--c-ink);
	backdrop-filter: blur(25px);
	transition:
		background var(--dur) var(--ease),
		color var(--dur) var(--ease),
		transform var(--dur) var(--ease);
}

/* Обводка-градиент из макета: белая сверху, прозрачная снизу */
.num-badge::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(200deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask-composite: exclude;
	pointer-events: none;
}

.num-badge--gold { background: rgba(235, 201, 124, 0.5); }

/* Соцсети */
.socials { display: flex; gap: clamp(8px, 0.78125vw, 15px); }

.social {
	display: grid;
	place-items: center;
	width: clamp(34px, 2.0833vw, 40px);
	height: clamp(34px, 2.0833vw, 40px);
	border-radius: 50%;
	color: var(--c-white);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.social--wa { background: #25d368; }
.social--tg { background: #6ba6ff; }

.social:hover {
	transform: translateY(-3px) scale(1.06);
	box-shadow: 0 12px 24px -12px rgba(24, 25, 31, 0.6);
}

.social__icon {
	width: 46%;
	height: 46%;
	/* Глиф WA вписан в viewBox впритык и касается границ. У корневого <svg>
	   overflow по умолчанию hidden, а atlant_icon() вырезает overflow="visible"
	   из экспорта Figma — без этого правый край круга срезается. */
	overflow: visible;
}
.social__icon path { fill: currentColor; }

/* Самолётик ТГ вписан в бокс симметрично, но его площадь смещена вправо:
   центр масс x=6.24 при центре бокса x=5.0 (12.4% ширины) — тонкий хвост
   слева читается как пустота. Компенсируем половину; полная компенсация
   утаскивает иконку заметно левее центра. */
.social--tg .social__icon { translate: -6% 0; }

/* -------------------------------------------------------------------------
   6. Шапка
   ---------------------------------------------------------------------- */

/* Шапка зафиксирована всегда — и на внутренних страницах, и поверх первого
   экрана главной. Место под неё держит .site-main (см. раздел 3). */
.site-header {
	position: fixed;
	inset: 0 0 auto;
	z-index: 60;
	padding-block: var(--hdr-pad);
	background: color-mix(in srgb, var(--c-bg) 82%, transparent);
	backdrop-filter: blur(18px);
	transition:
		padding-block var(--dur) var(--ease),
		background var(--dur) var(--ease),
		box-shadow var(--dur) var(--ease);
}

/* На главной шапка лежит поверх героя, поэтому наверху она прозрачная. */
.site-header--overlay {
	padding-block: clamp(12px, 1.0417vw, 20px);
	background: transparent;
	backdrop-filter: none;
}

/* Как только страницу тронули скроллом, шапка сжимается и получает подложку.
   Плоской заливки здесь нет: по макету (фрейм «фикс») это прогрессивный блюр
   плюс градиентная тонировка — собираем их слоями ниже. Собственный
   backdrop-filter обязательно снимаем: элемент с ним становится backdrop root
   и обнуляет фильтры вложенных слоёв. */
.site-header.is-stuck {
	padding-block: var(--hdr-pad-sm);
	background: transparent;
	backdrop-filter: none;
	box-shadow: none;
}

/* Три слоя подложки. Важно, что они соседи, а не вложены друг в друга —
   иначе внешний backdrop-filter отрезал бы внутренние от фона страницы.
   Порядок отрисовки задаётся деревом: ::before — первый ребёнок,
   .site-header__blur — следующий, ::after — последний. */
.site-header::before,
.site-header::after { content: ""; }

.site-header::before,
.site-header::after,
.site-header__blur {
	position: absolute;
	/* Слои свисают ниже шапки на --hdr-fade. Граница шапки перестаёт быть
	   краем слоя: к ней блюр подходит ещё живым, а гаснет уже под ней. */
	inset: 0 0 calc(var(--hdr-fade) * -1);
	z-index: -1;
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--dur) var(--ease);
}

.site-header.is-stuck::before,
.site-header.is-stuck::after,
.site-header.is-stuck .site-header__blur { opacity: 1; }

/* Нижняя точка градиента блюра: в макете radius 12, в CSS вдвое меньше.
   Маска держит полную силу до середины, дальше сходит на нет по кривой,
   близкой к ease-out: у линейного градиента заметны изломы на концах. */
.site-header.is-stuck::before {
	backdrop-filter: blur(6px);
	-webkit-mask-image: var(--hdr-fade-mask);
	        mask-image: var(--hdr-fade-mask);
}

/* Верхняя точка: в макете startRadius 40, то есть 20px в CSS. Слой ложится
   поверх базового, а размытия складываются квадратично — sqrt(6² + 19²) ≈ 20.
   Гаснет раньше базового: это добавка к верху, а не самостоятельный фон. */
.site-header.is-stuck .site-header__blur {
	backdrop-filter: blur(19px);
	-webkit-mask-image: var(--hdr-ramp-mask);
	        mask-image: var(--hdr-ramp-mask);
}

/* Тонировка поверх блюра — заливка фрейма из макета: плотная сверху и дальше
   почти линейно слабеющая. В Figma нижняя ручка градиента вынесена за кадр и
   тонировка обрывается на ~33%; здесь она вместо этого догасает до нуля на
   свесе — ровно там, куда ручка и указывает. */
.site-header.is-stuck::after {
	background: linear-gradient(
		to bottom,
		var(--c-bg) 0%,
		var(--c-bg) 11%,
		color-mix(in srgb, var(--c-bg) 78%, transparent) 34%,
		color-mix(in srgb, var(--c-bg) 52%, transparent) 55%,
		color-mix(in srgb, var(--c-bg) 28%, transparent) 73%,
		color-mix(in srgb, var(--c-bg) 11%, transparent) 87%,
		transparent 100%
	);
}

.site-header__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--gap);
	width: 100%;
	max-width: calc(var(--container) + var(--pad-x) * 2);
	min-height: var(--hdr-logo-h);
	margin-inline: auto;
	padding-inline: var(--pad-x);
	transition: min-height var(--dur) var(--ease);
}

.site-header.is-stuck .site-header__inner { min-height: var(--hdr-row-sm); }

/* Открытое мобильное меню занимает весь экран, но шапку не перекрывает:
   иначе бургер уходит под оверлей и закрыть меню нечем. Место под шапку
   меню и так оставляет (см. .mobile-nav__inner). */
body.is-locked .site-header { z-index: 80; background: transparent; backdrop-filter: none; box-shadow: none; }
/* Маски вынесены в переменные: они длинные и нужны с префиксом и без. */
.site-header {
	--hdr-fade-mask: linear-gradient(
		to bottom,
		#000 0%,
		#000 55%,
		rgba(0, 0, 0, 0.93) 64%,
		rgba(0, 0, 0, 0.78) 72%,
		rgba(0, 0, 0, 0.56) 80%,
		rgba(0, 0, 0, 0.33) 87%,
		rgba(0, 0, 0, 0.14) 93%,
		rgba(0, 0, 0, 0.03) 97.5%,
		rgba(0, 0, 0, 0) 100%
	);
	--hdr-ramp-mask: linear-gradient(
		to bottom,
		#000 0%,
		rgba(0, 0, 0, 0.86) 18%,
		rgba(0, 0, 0, 0.64) 34%,
		rgba(0, 0, 0, 0.40) 48%,
		rgba(0, 0, 0, 0.20) 60%,
		rgba(0, 0, 0, 0.06) 70%,
		rgba(0, 0, 0, 0) 78%
	);
}

body.is-locked .site-header::before,
body.is-locked .site-header::after,
body.is-locked .site-header__blur { opacity: 0; }

/* Меню в сжатой шапке тоже подбирается, чтобы не быть выше логотипа. */
.site-header.is-stuck .nav__list { padding-block: clamp(10px, 0.9375vw, 18px); }

/* Логотип */
.logo {
	display: flex;
	align-items: center;
	gap: 0;
	flex: none;
	justify-self: start;
}

/* Исходник квадратный, в макете кадрируется в 115×101 */
.logo__mark {
	width: var(--hdr-logo-w);
	height: var(--hdr-logo-h);
	object-fit: cover;
	transition:
		width var(--dur) var(--ease),
		height var(--dur) var(--ease),
		transform var(--dur) var(--ease);
}

.logo:hover .logo__mark { transform: rotate(-4deg) scale(1.04); }

.logo__text {
	display: flex;
	align-items: center;
	gap: clamp(6px, 0.5208vw, 10px);
}

.logo__name {
	font-family: var(--font-ui);
	font-size: clamp(18px, 1.6667vw, 32px);
	letter-spacing: -0.03em;
	line-height: 0.96;
	transition: font-size var(--dur) var(--ease);
}

.logo__slash { color: var(--c-gold-ink); opacity: 0.5; }
.logo__slash svg { width: clamp(6px, 0.5278vw, 10px); height: auto; }
.logo__slash svg path { fill: currentColor; }

.logo__tagline {
	font-size: clamp(9px, 0.7292vw, 14px);
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.72);
	transition: font-size var(--dur) var(--ease);
}

/* Сжатая шапка: логотип уменьшается вместе с подписью. */
.site-header.is-stuck .logo__mark {
	width: var(--hdr-logo-w-sm);
	height: var(--hdr-logo-h-sm);
}

.site-header.is-stuck .logo__name { font-size: clamp(16px, 1.25vw, 24px); }
.site-header.is-stuck .logo__tagline { font-size: clamp(8px, 0.5729vw, 11px); }

/* Меню */
.nav { justify-self: center; }

.nav__list {
	display: flex;
	align-items: center;
	gap: clamp(14px, 1.5625vw, 30px);
	padding: clamp(12px, 1.1979vw, 23px) clamp(14px, 1.3021vw, 25px);
	border-radius: var(--r-pill);
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(55px);
}

.nav__link {
	position: relative;
	display: inline-block;
	font-size: var(--fs-sm);
	letter-spacing: -0.02em;
	line-height: 1;
	color: var(--c-ink-soft);
	transition: color var(--dur) var(--ease);
}

.nav__link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -6px;
	width: 100%;
	height: 1.5px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform var(--dur) var(--ease);
}

.nav__link:hover::after,
.nav__link:focus-visible::after {
	transform: scaleX(1);
	transform-origin: left;
}

.header-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: clamp(10px, 0.78125vw, 15px);
	flex: none;
	justify-self: end;
}

/* Бургер */
.burger {
	display: none;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--c-white);
	position: relative;
}

.burger span {
	position: absolute;
	left: 12px;
	width: 20px;
	height: 1.6px;
	background: var(--c-ink);
	border-radius: 2px;
	transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

.burger span:nth-child(1) { top: 16px; }
.burger span:nth-child(2) { top: 21px; }
.burger span:nth-child(3) { top: 26px; }

.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* Мобильное меню */
.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: 70;
	display: grid;
	background: var(--c-bg);
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--dur) var(--ease);
}

.mobile-nav.is-open { opacity: 1; pointer-events: auto; }
.mobile-nav[hidden] { display: none; }

.mobile-nav__inner {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 40px;
	height: calc(100vh - var(--mobile-nav-top, var(--header-h)));
	height: calc(100dvh - var(--mobile-nav-top, var(--header-h)));
	min-height: 0;
	margin-top: var(--mobile-nav-top, var(--header-h));
	padding: 24px var(--pad-x) max(40px, env(safe-area-inset-bottom));
	overflow-y: auto;
	overscroll-behavior-y: contain;
	-webkit-overflow-scrolling: touch;
}

.mobile-nav__list { display: grid; gap: 18px; }

.mobile-nav__list a {
	font-family: var(--font-display);
	font-size: clamp(26px, 7vw, 40px);
	letter-spacing: -0.03em;
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.5s var(--ease), transform 0.5s var(--ease);
}

.mobile-nav.is-open .mobile-nav__list a {
	opacity: 1;
	transform: none;
	transition-delay: calc(var(--i, 0) * 55ms + 100ms);
}

.mobile-nav__foot { display: grid; gap: 16px; justify-items: start; }
.mobile-nav__phone { font-size: var(--fs-lead); }

/* -------------------------------------------------------------------------
   7. Заголовок секции
   ---------------------------------------------------------------------- */

.section-head {
	display: grid;
	grid-template-columns: var(--head-col) minmax(0, 1fr);
	gap: 0;
	align-items: start;
	margin-bottom: clamp(28px, 3.125vw, 60px);
}

.section-head--stack { grid-template-columns: 1fr; }

/* Число колонок сетки. Без этих правил cols-4 / cols-5 / cols-6 не работали:
   var(--c) оставался неопределённым и сетка всегда собиралась в 3 колонки. */
.cols-1 { --c: 1; }
.cols-2 { --c: 2; }
.cols-3 { --c: 3; }
.cols-4 { --c: 4; }
.cols-5 { --c: 5; }
.cols-6 { --c: 6; }

.section-head__title { display: grid; }
.section-head__title .line { display: block; }

.section-head__text {
	max-width: min(900px, 100%);
	margin-top: clamp(14px, 1.5625vw, 30px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
}

/* -------------------------------------------------------------------------
   8. Первый экран — главная
   ---------------------------------------------------------------------- */

/* Пропорция кадра из макета: 1920×950. Благодаря ей фон не кадрируется
   и нижний градиент-подложка остаётся видимым на любой ширине. */
.hero-home {
	position: relative;
	display: flex;
	align-items: flex-start;
	aspect-ratio: 1920 / 950;
	min-height: 560px;
	padding-block: clamp(104px, 9.2708vw, 178px) clamp(40px, 3.0208vw, 58px);
	border-radius: 0 0 var(--r-lg) var(--r-lg);
	overflow: hidden;
	isolation: isolate;
}

.hero-home__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.hero-home__picture {
	position: absolute;
	inset: 0;
}

.hero-home__picture img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transform: scale(1.04);
	animation: hero-zoom 2.4s var(--ease-out) forwards;
}

.hero-home__mobile-light,
.hero-home__mobile-rings { display: none; }

@keyframes hero-zoom { to { transform: scale(1); } }

/* Подложка под текстом уже есть на самой картинке — подсветку включаем
   только там, где текст съезжает на фотографию (узкие экраны). */
.hero-home__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: none;
}

.hero-home__inner {
	width: 100%;
	max-width: calc(var(--container) + var(--pad-x) * 2);
	margin-inline: auto;
	padding-inline: var(--pad-x);
}

.hero-home__content { max-width: min(885px, 62%); }

.hero-home__eyebrow {
	margin-bottom: clamp(5px, 0.4167vw, 8px);
	font-size: var(--fs-body);
	line-height: 1.4;
	letter-spacing: -0.03em;
	color: rgba(27, 24, 31, 0.5);
}

.hero-home__title { margin-bottom: clamp(5px, 0.4167vw, 8px); }
.hero-home__title .accent { display: block; }

.hero-home__text {
	max-width: 52ch;
	margin-bottom: clamp(28px, 2.8125vw, 54px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.55);
}

/* Вариант абзаца с переносами мобильного макета — включается в слое 520px. */
.hero-home__text--mobile { display: none; }

/* -------------------------------------------------------------------------
   9. Первый экран — внутренние страницы
   ---------------------------------------------------------------------- */

.hero-inner__card {
	position: relative;
	display: flex;
	align-items: stretch;
	min-height: clamp(420px, 43.75vw, 840px);
	padding: clamp(28px, 4.1667vw, 80px);
	border-radius: var(--r-md);
	overflow: hidden;
	isolation: isolate;
}

.hero-inner__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% center;
	transform: scale(1.05);
	animation: hero-zoom 2.4s var(--ease-out) forwards;
}

/* «Наши решения»: картинку поднимаем — кадр берём ниже по фотографии */
.page-resheniya .hero-inner__bg { object-position: 70% 78%; }

/* Кольца из макета: полотно 2153×840 прижато к левому краю и отражено по вертикали. */
.hero-inner__rings {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 119.6111%;
	height: 100%;
	max-width: none;
	scale: 1 -1;
	pointer-events: none;
}

.hero-inner__card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(100deg, rgba(250, 248, 244, 0.3) 0%, rgba(250, 248, 244, 0.12) 40%, rgba(250, 248, 244, 0) 64%);
}

/* Колонка текста из макета — 1308 из 1800, снизу к ней прижата кнопка. */
.hero-inner__content {
	display: flex;
	flex-direction: column;
	max-width: min(1148px, 70%);
}

.hero-inner__title { margin-block: clamp(16px, 1.6667vw, 32px) clamp(16px, 1.6667vw, 32px); }

.hero-inner__text {
	max-width: min(820px, 100%); /* ширина колонки макета — переносы расставлены вручную */
	margin-bottom: clamp(22px, 2.5vw, 48px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
}

.hero-inner__actions { margin-top: auto; }

/* Подпись первого экрана из макета: значок 12px «уголком» вправо, отбивка 10px, без переноса. */
.hero-inner .eyebrow { align-items: center; gap: clamp(8px, 0.5208vw, 10px); }

.hero-inner .eyebrow__marker {
	width: clamp(9px, 0.625vw, 12px);
	margin-top: 0;
	rotate: 90deg;
}

.hero-inner .eyebrow__marker svg path { fill: var(--c-gold-mark); }
.hero-inner .eyebrow__text { max-width: none; white-space: nowrap; opacity: 0.4; }

/* -------------------------------------------------------------------------
   10. Сетка нумерованных карточек
   ---------------------------------------------------------------------- */

.cards-grid__list {
	display: grid;
	grid-template-columns: repeat(var(--c, 3), minmax(0, 1fr));
	gap: var(--gap);
}

/* Геометрия карточки из макета: 600×373, поля 30, текст с доп. полями 30/30/20,
   номер в правом нижнем углу с отступом 30. */
.num-card,
.step-card {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: clamp(220px, 19.4271vw, 373px);
	padding: clamp(16px, 1.5625vw, 30px);
	border-radius: var(--r-md);
	transition: var(--t-lift);
}

.num-card__body {
	flex: 1;
	padding: clamp(14px, 1.5625vw, 30px) clamp(14px, 1.5625vw, 30px) clamp(12px, 1.0417vw, 20px);
}

.num-card__title,
.step-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

/* Заголовок занимает две строки, даже когда влезает в одну, — чтобы текст
   во всех карточках ряда начинался с одной линии (line-height: 1 → 2em). */
.num-card__title { min-height: 2em; }

/* В макете между заголовком и текстом карточки 59px */
.num-card__text {
	margin-top: clamp(20px, 3.0729vw, 59px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	opacity: 0.5;
}

.step-card__text {
	margin-top: clamp(16px, 2.0833vw, 40px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	opacity: 0.5;
}

.num-card .num-badge,
.step-card .num-badge { align-self: flex-end; }

/* При наведении карточка заливается золотым */
.num-card::before,
.step-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--c-gold);
	opacity: 0;
	transform: scale(0.97);
	transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.num-card:hover,
.step-card:hover { transform: translateY(-4px); }

.num-card:hover::before,
.step-card:hover::before {
	opacity: 1;
	transform: scale(1);
}

/* -------------------------------------------------------------------------
   11. Шаги на бежевой подложке
   ---------------------------------------------------------------------- */

.steps__panel {
	padding-block: clamp(48px, 9.375vw, 180px);
	border-radius: var(--r-lg);
	background: var(--c-beige);
}

.steps--flat .steps__panel {
	padding-block: 0;
	border-radius: 0;
	background: transparent;
}

/* Лента шагов: карточка всегда 355×355, ряд начинается от колонки заголовка
   (--head-col) — при пяти карточках, как в макете, уходит за правый край.
   overflow-x: auto сам делает прокручиваемой и вертикальную ось, поэтому дробная
   высота карточек и подъём при наведении давали лишний вертикальный скролл —
   гасим его явным overflow-y и запасом полей под подъём и тень карточек
   (0 12px 30px -22px уходит на 20px вниз, плюс 4px подъёма). */
.steps__list {
	display: grid;
	grid-template-columns: repeat(var(--c, 3), clamp(150px, 18.49vw, 355px));
	gap: var(--gap);
	padding-left: var(--head-col);
	padding-block: 24px;
	margin-block: -24px;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
}

.steps__list::-webkit-scrollbar { display: none; }

/* Четыре шага должны укладываться в контейнер: 343 (колонка заголовка) + 4×355
   + зазоры = 1823 при ширине 1800, и последняя карточка чуть-чуть не влезала.
   Резиновые колонки делят остаток ровно, без горизонтальной прокрутки. */
.steps__list.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Пять шагов в контейнер не помещаются — это лента с прокруткой. При жёсткой
   ширине карточки правый край резал четвёртую примерно посередине. Считаем
   ширину колонки так, чтобы ровно четыре карточки встали целиком, а пятая
   выглядывала на --steps-peek: обрез перестаёт читаться как брак и заодно
   показывает, что ленту можно листать.

   Проценты в grid-template-columns считаются от content box, а padding-left
   (--head-col) в него не входит — поэтому колонку заголовка вычитать не нужно.
   Только для ПК: ниже 1025px раскладка переключается на резиновые колонки. */
@media (min-width: 1025px) {
	.steps__list.cols-5 {
		--steps-peek: clamp(16px, 1.6667vw, 32px);
		grid-template-columns: repeat(
			5,
			calc((100% - var(--gap) * 4 - var(--steps-peek)) / 4)
		);
	}
}

/* Шаг — только обводка; золотая заливка появляется при наведении.
   Обводка внутренней тенью, а не border: карточка квадратная по aspect-ratio,
   и рамка добавляла бы к размеру 2px. Цвет тот же, что у border остальных
   карточек, — rgba(24, 25, 31, 0.25). */
.steps .step-card {
	aspect-ratio: 355 / 355;
	min-height: 0;
	box-shadow: inset 0 0 0 1px rgba(24, 25, 31, 0.25);
}

.steps .step-card__title { color: var(--c-ink-alt); }

/* Номер в макете прижат к левому нижнему углу карточки */
.steps .step-card .num-badge { align-self: flex-start; }

.steps .step-card:hover { box-shadow: none; }
.steps .step-card:hover .step-card__title { color: var(--c-gold-ink); }

/* Карточка этапа со ссылкой или модалкой: кликабельна вся площадь */
.step-card__link {
	position: absolute;
	inset: 0;
	z-index: 1;
	padding: 0;
	border: 0;
	border-radius: inherit;
	background: none;
	cursor: pointer;
}

/* Рамка внутрь: лента шагов прокручивается (overflow-x) и обрезала бы её снаружи */
.step-card__link:focus-visible {
	outline: 2px solid var(--c-gold-ink);
	outline-offset: -2px;
}

/* -------------------------------------------------------------------------
   12. Баннер с фото
   ---------------------------------------------------------------------- */

.banner__card {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(340px, 31.875vw, 612px);
	padding: clamp(28px, 8.6458vw, 166px);
	border: 1px solid var(--c-line-hard);
	border-radius: clamp(20px, 1.9271vw, 37px);
	overflow: hidden;
	isolation: isolate;
}

/* Обёртка <picture> для мобильной подмены фона не должна становиться flex-элементом карточки. */
.banner__picture { display: contents; }

.banner__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 68% center;
	transition: transform 1.2s var(--ease);
}

.banner__card:hover .banner__bg { transform: scale(1.03); }

.banner__card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(96deg, rgba(249, 248, 245, 0.95) 0%, rgba(249, 248, 245, 0.78) 34%, rgba(249, 248, 245, 0) 62%);
}

/* В макете колонка баннера — до 974px, абзац внутри неё уже (672px). */
.banner__content { max-width: min(1020px, 70%); }

/* Заголовок cta-баннера набран в две строки вручную (разделитель «|»), но
   колонка контента для него узка: на 1440px первой строке нужно ~737px против
   683px колонки, и она ломалась на третью строку. Даём заголовку ширину по
   содержимому — он выходит за колонку абзаца, но занимает лишь две трети
   ширины карточки на любом десктопном разрешении, так что не обрежется. */
@media (min-width: 1025px) {
	.banner__card--cta .banner__title { width: max-content; max-width: none; }
}
.banner__title { margin-bottom: clamp(16px, 2.0833vw, 40px); }
.banner__title .line { display: block; }

.banner__text {
	max-width: min(900px, 100%);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
}

.banner__actions { margin-top: clamp(28px, 4.1667vw, 80px); }

/* Кнопка баннера в макете тёмная, на наведении — золотая */
.banner .btn { background: var(--c-ink); color: var(--c-white); }
.banner .btn::before { background: var(--c-gold); }
.banner .btn:hover,
.banner .btn:focus-visible { color: var(--c-gold-ink); }

/* -------------------------------------------------------------------------
   13. Слайдер
   ---------------------------------------------------------------------- */

.slider { position: relative; }

.slider__viewport {
	width: 100%;
	max-width: calc(var(--container) + var(--pad-x) * 2);
	margin-inline: auto;
	padding-inline: var(--pad-x);
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	cursor: grab;
}

/* Start the service strip on the same grid line as its section title. */
.slider-cards .slider__viewport {
	padding-left: calc(var(--pad-x) + var(--head-col));
}

.slider__viewport::-webkit-scrollbar { display: none; }
.slider__viewport.is-dragging { cursor: grabbing; scroll-snap-type: none; }

/* Слайдер внутри .container не должен добавлять поля повторно */
.container .slider__viewport {
	max-width: none;
	margin-inline: 0;
	padding-inline: 0;
}

.slider__track {
	display: flex;
	gap: var(--gap);
	padding-block: 4px;
}

.slider__slide {
	flex: 0 0 auto;
	scroll-snap-align: start;
}

.slider__nav {
	display: flex;
	gap: 16px;
	margin-top: clamp(24px, 2.9167vw, 56px);
}

.slider__nav--end { justify-content: flex-end; }

.slider__btn {
	display: grid;
	place-items: center;
	width: clamp(44px, 2.9167vw, 56px);
	height: clamp(44px, 2.9167vw, 56px);
	border: 1px solid #38211b;
	border-radius: 50%;
	background: transparent;
	color: #38211b;
	transition:
		background var(--dur) var(--ease),
		color var(--dur) var(--ease),
		border-color var(--dur) var(--ease),
		transform var(--dur) var(--ease);
}

.slider__btn:hover:not(:disabled) {
	background: var(--c-ink);
	border-color: var(--c-ink);
	color: var(--c-white);
	transform: translateY(-2px);
}

.slider__btn:disabled { opacity: 0.3; cursor: default; }

.slider__btn--dark {
	background: var(--c-ink);
	border-color: var(--c-ink);
	color: var(--c-white);
}

.slider__btn--dark:hover:not(:disabled) {
	background: var(--c-gold);
	border-color: var(--c-gold);
	color: var(--c-gold-ink);
}

/* Карточка-плитка с картинкой */
/* Карточка 435×600: фон #e6e4de, обводка #cdcdcd, текст и номер с отступом 60/30 */
.media-tile {
	--tile-w: clamp(250px, 22.6563vw, 435px);
	--u: calc(var(--tile-w) / 435);

	position: relative;
	display: flex;
	flex-direction: column;
	width: var(--tile-w);
	aspect-ratio: 435 / 600;
	padding: clamp(24px, 3.125vw, 60px) clamp(24px, 3.125vw, 60px) clamp(16px, 1.5625vw, 30px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: var(--c-beige);
	overflow: hidden;
	isolation: isolate;
}

.media-tile__link { position: absolute; inset: 0; z-index: 3; }

/* Низ иллюстрации уходит в расфокус — одинаково на всех плитках, поэтому
   размывается сама область карточки, а не отдельные слои. Маска гасит
   эффект к середине, чтобы граница размытия не читалась полосой. */
.media-tile::after {
	content: "";
	position: absolute;
	/* Область размытия выходит за карточку: по краям backdrop-filter нечего
	   сэмплировать, и у самой кромки оставалась неразмытая полоска. Лишнее
	   срезает overflow карточки. */
	inset: 70% calc(-24 * var(--u)) calc(-24 * var(--u));
	z-index: 0;
	backdrop-filter: blur(calc(9 * var(--u)));
	-webkit-backdrop-filter: blur(calc(9 * var(--u)));
	/* Маска идёт по S-кривой: линейный градиент даёт излом на обоих концах,
	   и верхняя кромка размытия читается полосой. Резкость набирается к низу,
	   поэтому заметная зона расфокуса остаётся прежней — нижняя часть кадра. */
	mask-image: linear-gradient(to bottom,
		rgba(0, 0, 0, 0) 23%,
		rgba(0, 0, 0, 0.03) 31%,
		rgba(0, 0, 0, 0.12) 40%,
		rgba(0, 0, 0, 0.27) 49%,
		rgba(0, 0, 0, 0.5) 56%,
		rgba(0, 0, 0, 0.7) 64%,
		rgba(0, 0, 0, 0.85) 71%,
		rgba(0, 0, 0, 0.94) 78%,
		rgba(0, 0, 0, 1) 88%);
	-webkit-mask-image: linear-gradient(to bottom,
		rgba(0, 0, 0, 0) 23%,
		rgba(0, 0, 0, 0.03) 31%,
		rgba(0, 0, 0, 0.12) 40%,
		rgba(0, 0, 0, 0.27) 49%,
		rgba(0, 0, 0, 0.5) 56%,
		rgba(0, 0, 0, 0.7) 64%,
		rgba(0, 0, 0, 0.85) 71%,
		rgba(0, 0, 0, 0.94) 78%,
		rgba(0, 0, 0, 1) 88%);
	pointer-events: none;
}

/* Подпись и номер лежат поверх размытия. */
.media-tile__title,
.media-tile .num-badge { z-index: 1; }

/* Слои иллюстрации спозиционированы в процентах — как в макете */
.media-tile__layer {
	position: absolute;
	z-index: -1;
	transform: var(--layer-transform, none);
	transition: scale 1s var(--ease);
	pointer-events: none;
}

.media-tile:hover .media-tile__layer { scale: 1.04; }

.media-tile__title {
	position: relative;
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	max-width: 12ch;
}

.media-tile .num-badge { position: relative; margin-top: auto; margin-left: auto; }

/* Липкая лента карточек: страница замирает, карточки едут вбок, и только
   после последней скролл продолжается. Класс is-pinned и размеры
   --pin-distance (путь ленты) / --pin-tile-w (ширина карточки) ставит JS,
   поэтому без него и ниже десктопа секция остаётся обычным скроллером. */
@media (min-width: 1025px) {
	/* Запас хода обязан лежать внутри content box родителя: липкий элемент
	   двигается только в его пределах, отступами это место не создать. */
	.slider-cards.is-pinned .slider-cards__pin {
		height: calc(100svh + var(--pin-distance, 0px));
	}

	.slider-cards.is-pinned .slider-cards__stage {
		position: sticky;
		top: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 100svh;
		/* Шапка зафиксирована и в прокрутке всегда сжата — держим её место свободным. */
		padding-top: var(--header-h-sm);
		padding-bottom: clamp(24px, 2.0833vw, 40px);
	}

	.slider-cards.is-pinned .section-head { margin-bottom: clamp(20px, 1.8229vw, 35px); }

	/* clip, а не hidden: не создаёт прокручиваемый контейнер, поэтому сдвинутую
	   лентой нечем «утащить» вбок. */
	.slider-cards.is-pinned .slider__viewport {
		overflow: hidden;
		overflow: clip;
		cursor: default;
		scroll-snap-type: none;
	}

	.slider-cards.is-pinned .slider__slide { scroll-snap-align: none; }
	.slider-cards.is-pinned .slider__track { will-change: transform; }
	.slider-cards.is-pinned .media-tile { --tile-w: var(--pin-tile-w, clamp(250px, 22.6563vw, 435px)); }
}

/* Кейсы */
/* Контейнер прокрутки обрезает по обеим осям, поэтому тень при наведении
   упиралась в его край. Даём запас изнутри и компенсируем отрицательным полем. */
.cases .slider__viewport {
	padding-block: 28px;
	margin-block: -28px;
}

/* На десктопе три карточки и так помещаются — прокрутка не нужна,
   а без неё тень вообще ничем не режется */
@media (min-width: 1025px) {
	.cases .slider__viewport {
		overflow: visible;
		padding-block: 0;
		margin-block: 0;
	}
}

.cases__track > .case-card { flex: 1 0 0; min-width: min(100%, 320px); }

.case-card {
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 2.0833vw, 40px);
	padding: clamp(24px, 3.125vw, 60px);
	border: 1px solid rgba(24, 25, 31, 0.25);
	border-radius: var(--r-md);
	background: transparent;
	transition: var(--t-lift);
}

.case-card:hover {
	border-color: var(--c-gold);
	transform: translateY(-4px);
	box-shadow: var(--shadow-card);
}

.case-card__row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(12px, 1.0417vw, 20px);
}

/* Тег-«таблетка»: 32px по бокам, 12/13 сверху и снизу.
   Фон, обводка и тень — как у бейджей в карточках услуг (.chip). */
.tag {
	padding: clamp(9px, 0.625vw, 12px) clamp(20px, 1.6667vw, 32px) clamp(10px, 0.6771vw, 13px);
	border: 1px solid var(--c-white);
	border-radius: var(--r-pill);
	background: rgba(255, 255, 255, 0.1);
	box-shadow:
		inset 5px 5px 14px rgba(24, 25, 31, 0.05),
		inset -5px -5px 14px rgba(255, 255, 255, 0.5);
	font-size: var(--fs-eyebrow);
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(17, 24, 39, 0.7);
	transition: background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.tag--gold {
	background: var(--c-gold);
	border-color: var(--c-gold);
	box-shadow: none;
}

.case-card__value {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
}

/* -------------------------------------------------------------------------
   14. Таблетки-показатели
   ---------------------------------------------------------------------- */

/* В макете таблетки идут «змейкой»: чётные опущены на 84px и слегка заходят
   на соседние по горизонтали. */
.pills__list {
	--pill-shift: clamp(24px, 4.375vw, 84px);

	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: space-between;
	column-gap: clamp(8px, 0.7292vw, 14px);
	row-gap: var(--gap);
	padding-bottom: 0;
}

.pill {
	display: inline-flex;
	align-items: center;
	flex: 0 1 auto;
	/* min-width:0 разрешал сжимать таблетку уже текста — на pills--lg текст
	   ещё и nowrap, поэтому он вылезал за скруглённый край. Без min-width:0
	   таблетка не сжимается уже своего содержимого. */
	gap: 10px;
	padding: clamp(12px, 1.0417vw, 20px) clamp(16px, 1.0417vw, 20px);
	border: 2px solid rgba(17, 24, 39, 0.3);
	border-radius: var(--r-pill);
	background: var(--c-bg);
	font-family: var(--font-display);
	/* Чуть мельче макетных 36px: подписи набраны другой гарнитурой и в 36px
	   шесть таблеток не помещались в ряд. Размер задан во vw, поэтому
	   пропорция «текст / доступная ширина» одинакова на любом десктопе. */
	font-size: clamp(15px, 1.5104vw, 29px);
	line-height: 1;
	letter-spacing: 0;
	color: var(--c-ink-alt);
	transition: var(--t-lift);
}

/* Та же оптическая компенсация капители, что и у кнопок */
.pill__label {
	line-height: 1;
	transform: translateY(var(--cap-fix));
}

/* Крупные таблетки: всегда один ряд шахматкой на всю ширину блока.
   nowrap — чтобы ни одна не уезжала на вторую строку. */
.pills--lg .pills__list {
	flex-wrap: nowrap;
	/* Раньше space-between: он в паре с отрицательным margin ниже (тянем
	   таблетки друг к другу) непредсказуемо перераспределял остаток —
	   средний зазор оставался шире крайних. center нейтрален к margin. */
	justify-content: center;
	column-gap: clamp(8px, 0.7292vw, 14px);
}

.pills--lg .pill__label { white-space: nowrap; }

/* Кегль и поля подобраны так, чтобы четыре таблетки помещались в ряд 1800 */
.pills--lg .pill {
	gap: clamp(6px, 0.5208vw, 10px);
	padding: clamp(10px, 0.9375vw, 18px) clamp(14px, 1.25vw, 24px);
	font-size: clamp(16px, 1.25vw, 24px);
}

/* Ниже 1301px таблетки уже не сдвигаются друг к другу (см. ниже), и четыре
   подписи без переносов в ряд не помещаются: на 1280 ряд был 1289px, на 1024 —
   1150px, страница шире экрана. Здесь ряд переносится, таблетки по центру. */
@media (max-width: 1300px) {
	.pills--lg .pills__list { flex-wrap: wrap; }
}

.pill:hover {
	border-color: var(--c-gold);
	background: rgba(235, 201, 124, 0.14);
	transform: translateY(-3px);
}

/* Смещение через строку включаем только там, где ряд заведомо помещается */
@media (min-width: 1301px) {
	.pills__list { padding-bottom: var(--pill-shift); }
	.pill:nth-child(even) { transform: translateY(var(--pill-shift)); }
	.pill:nth-child(even):hover { transform: translateY(calc(var(--pill-shift) - 3px)); }

	/* Без min-width:0 таблетки больше не сжимаются уже текста, и на pills--lg
	   их суммарная ширина может не влезать в ряд. Тянем каждую, кроме первой:
	   если тянуть только чётные, зазор между 2-й и 3-й никто не сжимает — он
	   остаётся на всю ширину 2-й таблетки. Между 1-й и 3-й (обе без сдвига
	   вниз, на одной высоте) запаса на глаз с большим запасом хватает —
	   3-я не дотянется до 1-й. */
	.pills--lg .pill:nth-child(n + 2) { margin-left: clamp(-40px, -2.8vw, -14px); }
}

/* В макете иконка стоит в рамке 30×30. Раньше задавалась только ширина, и
   у иконок с разными пропорциями (40×24, 25×28) высота гуляла от 18 до 34px. */
.pill__icon {
	display: grid;
	place-items: center;
	flex: none;
	width: clamp(22px, 1.5625vw, 30px);
	height: clamp(22px, 1.5625vw, 30px);
}

.pill__icon svg { width: auto; height: auto; max-width: 100%; max-height: 100%; }

/* -------------------------------------------------------------------------
   15. Блок доверия
   ---------------------------------------------------------------------- */

.trust__grid {
	display: grid;
	grid-template-columns: minmax(0, 850fr) minmax(0, 910fr);
	gap: clamp(24px, 2.0833vw, 40px);
	align-items: end;
}

.trust__media img {
	width: 100%;
	height: auto;
	object-fit: contain;
	object-position: bottom;
}

.trust__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(24px, 2.0833vw, 40px);
	padding-top: clamp(0px, 1.5104vw, 29px);
}

.trust__item { display: grid; align-content: start; justify-items: start; }

.trust__item { gap: clamp(20px, 2.0833vw, 40px); }

.trust__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.trust__text {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	opacity: 0.5;
}


.trust__item .num-badge { background: rgba(235, 201, 124, 0.5); }
.trust__item:hover .num-badge { transform: scale(1.08); }

/* -------------------------------------------------------------------------
   16. Нумерованные тезисы в две колонки (заголовок слева)
   ---------------------------------------------------------------------- */

.benefits__grid {
	display: grid;
	grid-template-columns: minmax(0, 925fr) minmax(0, 875fr);
	gap: clamp(24px, 2.0833vw, 40px);
	align-items: start;
}

.benefits__list { display: grid; gap: clamp(24px, 3.3333vw, 64px); }

.benefit-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	/* column-gap — расстояние от номера до текстовой колонки (как в макете).
	   row-gap не задаём: заголовок и текст — соседние строки той же сетки,
	   вертикальный интервал между ними держит margin-top текста ниже —
	   раньше общий gap: ... складывался с ним и удваивал отступ. */
	column-gap: clamp(16px, 2.0833vw, 40px);
	align-items: start;
}

/* Номер занимает первую колонку, заголовок и текст идут во второй. */
.benefit-row .num-badge { grid-column: 1; grid-row: 1 / span 2; }
.benefit-row__title { grid-column: 2; }
.benefit-row__text { grid-column: 2; }

.benefit-row__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.benefit-row__text {
	margin-top: clamp(14px, 1.6667vw, 32px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	opacity: 0.5;
}

.benefit-row .num-badge { background: rgba(235, 201, 124, 0.5); }
.benefit-row:hover .num-badge { transform: scale(1.08); }

/* -------------------------------------------------------------------------
   17. FAQ
   ---------------------------------------------------------------------- */

.faq__grid {
	display: grid;
	grid-template-columns: minmax(0, 913fr) minmax(0, 847fr);
	gap: clamp(24px, 2.0833vw, 40px);
	align-items: start;
}

.faq__grid .section-head { margin-bottom: 0; }

/* Вариант со стопкой: заголовок сверху, список — от колонки «глазка» */
.faq--stack .faq__grid { grid-template-columns: 1fr; gap: clamp(28px, 3.125vw, 60px); }
.faq--stack .faq__list { padding-left: var(--head-col); }

/* Заголовок в левой колонке едет вместе со скроллом, пока не кончится
   список справа. Ниже 1201px колонки схлопываются в одну — там не нужно. */
@media (min-width: 1201px) {
	.benefits__grid > .section-head,
	.faq:not(.faq--stack) .faq__grid > .section-head,
	.form-section__grid > .section-head {
		position: sticky;
		top: calc(var(--header-h-sm) + clamp(24px, 2.0833vw, 40px));
	}
}

.faq__list { display: grid; gap: clamp(20px, 2.0833vw, 40px); }

.faq__item {
	border-bottom: 1px solid var(--c-line-hard);
	padding-bottom: clamp(20px, 2.0833vw, 40px);
}

.faq__q { margin: 0; }

.faq__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	text-align: left;
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	color: var(--c-ink-alt);
	transition: color var(--dur) var(--ease);
}

.faq__trigger:hover { color: var(--c-gold-ink); }

.faq__icon {
	position: relative;
	flex: none;
	width: clamp(20px, 1.3542vw, 26px);
	height: clamp(20px, 1.3542vw, 26px);
	transition: transform var(--dur) var(--ease);
}

.faq__icon::before,
.faq__icon::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	background: var(--c-gold);
	border-radius: 2px;
	transform: translate(-50%, -50%);
	transition: background var(--dur) var(--ease);
}

.faq__icon::before { width: 78%; height: 1.6px; }
.faq__icon::after  { width: 1.6px; height: 78%; }

.faq__item.is-open .faq__icon { transform: rotate(45deg); }

.faq__item.is-open .faq__icon::before,
.faq__item.is-open .faq__icon::after { background: var(--c-ink); }

.faq__a {
	overflow: hidden;
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

.faq__a[hidden] { display: block; height: 0; }
.faq__a p { padding-top: clamp(20px, 2.0833vw, 40px); }

/* -------------------------------------------------------------------------
   18. Форма
   ---------------------------------------------------------------------- */

.form-section__grid {
	display: grid;
	grid-template-columns: minmax(0, 925fr) minmax(0, 875fr);
	gap: clamp(24px, 2.0833vw, 40px);
	align-items: start;
}

.form-section__grid .section-head { margin-bottom: 0; }

.lead-form { display: grid; gap: clamp(16px, 1.6667vw, 32px); }
.lead-form--compact { gap: clamp(18px, 2vw, 32px); }

.lead-form__honeypot {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.field {
	position: relative;
	padding-top: var(--fs-h3);
}

.field__label {
	position: absolute;
	left: 0;
	top: var(--fs-h3);
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1;
	color: rgba(24, 25, 31, 0.5);
	pointer-events: none;
	transform-origin: left top;
	transition: transform var(--dur) var(--ease), color var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

.field__req { color: var(--c-gold-ink); margin-left: 4px; }

.field__input {
	width: 100%;
	padding: 0 0 clamp(14px, 1.25vw, 24px);
	border: 0;
	border-bottom: 1px solid var(--c-field-line);
	border-radius: 0;
	background: transparent;
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1;
	color: var(--c-ink);
	transition: border-color var(--dur) var(--ease);
}

.field__input::placeholder { color: transparent; }
.field__input:focus { outline: none; border-bottom-color: var(--c-gold); }

.field:focus-within .field__label,
.field.has-value .field__label {
	transform: translateY(calc(var(--fs-h3) * -1)) scale(0.5);
	color: rgba(24, 25, 31, 0.45);
}

.lead-form__foot {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(20px, 2.0833vw, 40px);
}

/* Согласие под кнопкой: чекбокс 18×18 и текст 653px из макета. */
.lead-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	max-width: min(653px, 100%);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-muted);
	cursor: pointer;
}

/* Квадратик выравниваем по первой строке текста, а не по её середине. */
.lead-form__consent .checkbox { margin-top: 0.22em; }

.lead-form__consent a {
	color: var(--c-gold-ink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.lead-form__consent.is-invalid .checkbox__box { border-color: #b3402f; }

.lead-form__message {
	margin: 0;
	font-size: var(--fs-sm);
	line-height: 1.4;
}

.lead-form__message:empty { display: none; }
.lead-form__message.is-ok { color: #2c7a4b; }
.lead-form__message.is-error { color: #b3402f; }

.lead-form.is-loading { opacity: 0.6; pointer-events: none; }

/* -------------------------------------------------------------------------
   18a. Чекбокс (форма заявки, cookie-баннер)
   ---------------------------------------------------------------------- */

.checkbox {
	position: relative;
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: clamp(16px, 0.9375vw, 18px);
	height: clamp(16px, 0.9375vw, 18px);
}

/* Настоящий input лежит поверх квадратика и невидим: так работают клик,
   клавиатура и чтение с экрана, а рисуем мы .checkbox__box. */
.checkbox__input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.checkbox__input:disabled { cursor: default; }

.checkbox__box {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border: 1px solid rgba(24, 25, 31, 0.25);
	border-radius: 4px;
	color: var(--c-white);
	transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.checkbox__check {
	width: 66.67%;
	height: 66.67%;
	opacity: 0;
	transform: scale(0.6);
	transition: opacity 0.2s var(--ease), transform 0.2s var(--ease);
}

.checkbox__input:checked + .checkbox__box {
	border-color: var(--c-gold);
	background: var(--c-gold);
}

.checkbox__input:checked + .checkbox__box .checkbox__check {
	opacity: 1;
	transform: none;
}

.checkbox__input:focus-visible + .checkbox__box {
	outline: 2px solid var(--c-gold-ink);
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------
   18b. Cookie-баннер
   ---------------------------------------------------------------------- */

.cookie {
	position: fixed;
	left: clamp(16px, 3.125vw, 60px);
	bottom: clamp(16px, 1.5625vw, 30px);
	z-index: 75;
	width: min(480px, calc(100vw - 32px));
	padding: clamp(16px, 1.0938vw, 21px);
	border: 1px solid rgba(24, 25, 31, 0.25);
	border-radius: 12px;
	background: var(--c-bg);
	box-shadow: 0 20px 60px rgba(24, 25, 31, 0.12);
	opacity: 0;
	transform: translateY(20px);
	transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
}

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

.cookie__view {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* display: flex перебивает [hidden] из стилей браузера — гасим явно. */
.cookie__view[hidden] { display: none; }

.cookie__text {
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: #6b7280;
}

.cookie__text a {
	color: var(--c-gold-ink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Три кнопки всегда в одну строку: перенос заставлял «Настройки» прыгать
   вниз в момент, когда догружался дисплейный шрифт и строка переставала
   помещаться. Вместо переноса кнопки ужимаются, а подпись внутри них при
   нехватке места переходит на вторую строку. */
.cookie__actions {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 8px;
}

.cookie__btn {
	display: inline-flex;
	flex: 0 1 auto;
	min-width: 0;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 6px 16px;
	text-align: center;
	border: 1px solid rgba(24, 25, 31, 0.25);
	border-radius: var(--r-pill);
	background: transparent;
	color: var(--c-gold-ink);
	font-family: var(--font-display);
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	cursor: pointer;
	transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}

.cookie__btn--gold {
	border-color: var(--c-gold);
	background: var(--c-gold);
}

.cookie__btn:hover,
.cookie__btn:focus-visible {
	border-color: var(--c-ink);
	background: var(--c-ink);
	color: var(--c-white);
}

.cookie__link {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
	border: 0;
	white-space: nowrap;
	background: none;
	color: var(--c-ink);
	font-family: var(--font-display);
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	cursor: pointer;
	transition: color var(--dur) var(--ease);
}

.cookie__link:hover { color: var(--c-gold-ink); }

.cookie__options {
	display: grid;
	gap: 4px;
}

.cookie__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border: 1px solid rgba(155, 156, 161, 0.25);
	border-radius: 10px;
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink-alt);
	cursor: pointer;
}

.cookie__option:has(.checkbox__input:disabled) { cursor: default; }

.cookie__option-name { flex: 1 1 auto; }
.cookie__option-note { color: var(--c-muted); }

/* -------------------------------------------------------------------------
   18c. Страница 404
   ---------------------------------------------------------------------- */

/* Атлант выходит за нижний край блока — в макете его срезает подвал. */
.error-404 { overflow: hidden; }

/* Место под фиксированную шапку держит .site-main (раздел 3) — здесь нужен
   только зазор до неё из макета, иначе отступ задваивается и блок уезжает вниз. */
.site-main > .error-404:first-child {
	padding-top: clamp(20px, 2.0833vw, 40px);
	padding-bottom: 0;
}

.error-404__inner {
	display: flex;
	align-items: center;
	gap: clamp(20px, 2.0833vw, 40px);
	width: 100%;
	min-height: clamp(420px, 41.6667vw, 800px);
	max-width: calc(var(--container) + var(--pad-x) * 2);
	margin-inline: auto;
	padding-inline: var(--pad-x);
}

.error-404__copy {
	position: relative;
	z-index: 1;
	display: flex;
	flex: none;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(16px, 1.5625vw, 30px);
}

.error-404__title {
	font-family: var(--font-display);
	font-size: var(--fs-h2);
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: -0.02em;
	color: var(--c-ink);
}

.error-404__text {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
}

.error-404__action { margin-top: clamp(14px, 1.5625vw, 30px); }

.error-404__art {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	align-self: stretch;
	align-items: center;
	justify-content: space-between;
	min-width: 0;
}

.error-404__digit {
	font-family: var(--font-display);
	font-size: clamp(160px, 41.6667vw, 800px);
	line-height: 0.96;
	letter-spacing: -0.02em;
	color: rgba(235, 201, 124, 0.2);
}

/* Пропорции из макета: картинка 1032 против блока 800 и сдвиг вверх на 44. */
.error-404__atlas {
	position: absolute;
	left: 50%;
	top: -5.5%;
	width: auto;
	height: 129%;
	transform: translateX(-50%);
	pointer-events: none;
}

/* -------------------------------------------------------------------------
   19. Подвал
   ---------------------------------------------------------------------- */

.site-footer {
	margin-top: clamp(48px, 5.2083vw, 100px);
	padding-block: clamp(40px, 3.125vw, 60px);
	border-radius: var(--r-lg) var(--r-lg) 0 0;
	background: var(--c-beige);
}

.site-footer__inner {
	display: grid;
	grid-template-columns: minmax(0, 974fr) minmax(0, 640fr) minmax(0, 186fr);
	gap: clamp(24px, 2.0833vw, 40px) clamp(24px, 3.125vw, 60px);
	width: 100%;
	max-width: calc(var(--container) + var(--pad-x) * 2);
	margin-inline: auto;
	padding-inline: var(--pad-x);
}

.site-footer__title {
	font-family: var(--font-display);
	font-size: clamp(24px, 1.875vw, 36px);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.05em;
}

.site-footer__text {
	margin-top: clamp(16px, 2.0833vw, 40px);
	font-size: var(--fs-lead);
	line-height: 1.3;
	letter-spacing: -0.04em;
	color: rgba(24, 25, 31, 0.5);
}

.site-footer__buttons {
	display: flex;
	flex-wrap: nowrap;
	gap: clamp(8px, 0.7292vw, 14px);
	margin-top: clamp(22px, 2.5vw, 48px);
}

/* Три кнопки должны умещаться в одну строку — кегль и поля чуть меньше макетных */
.site-footer__buttons .btn {
	flex: 0 1 auto;
	min-width: 0;
	gap: clamp(8px, 0.625vw, 12px);
	padding: clamp(14px, 1.3021vw, 25px) clamp(14px, 1.4583vw, 28px);
	font-family: var(--font-ui);
	font-size: clamp(13px, 0.9375vw, 18px);
	letter-spacing: -0.03em;
}

.site-footer__buttons .btn__arrow { width: 6px; height: 10px; }

.site-footer__nav ul { display: grid; gap: clamp(14px, 1.7188vw, 33px); }

.site-footer__nav a {
	position: relative;
	font-size: var(--fs-lead);
	line-height: 1.2;
	letter-spacing: -0.04em;
	transition: color var(--dur) var(--ease);
}

.site-footer__nav a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 1.5px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform var(--dur) var(--ease);
}

.site-footer__nav a:hover::after { transform: scaleX(1); transform-origin: left; }

.site-footer__aside {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	gap: clamp(24px, 2.0833vw, 40px);
	grid-column: 3;
	grid-row: 1;
	text-align: right;
	font-size: var(--fs-lead);
	letter-spacing: -0.04em;
	white-space: nowrap;
}

/* Обёртка контактов существует ради мобильной строки (см. блок 520).
   На остальных ширинах она исчезает из раскладки, и телефон с почтой
   остаются прямыми флекс-детьми .site-footer__aside — вместе с его gap. */
.site-footer__contacts { display: contents; }

.site-footer__aside a { transition: color var(--dur) var(--ease); }
.site-footer__aside a:hover { color: var(--c-gold-ink); }

.site-footer__socials { display: flex; gap: 10px; }

.site-footer__socials .social {
	width: clamp(28px, 1.6667vw, 32px);
	height: clamp(28px, 1.6667vw, 32px);
}

.site-footer__logo { flex: none; }
.site-footer__nav { grid-column: 2; grid-row: 1; }
.site-footer__lead { grid-column: 1; grid-row: 1; align-self: center; }

/* Нижняя строка макета: лого, реквизиты и ссылки на документы в одну линию.
   Ниже 768px обёртка становится display: contents, и лого снова встаёт
   в сетку подвала отдельным элементом — правила адаптива её не замечают. */
.site-footer__bottom {
	display: flex;
	align-items: center;
	gap: clamp(24px, 3.125vw, 60px);
	grid-column: 1 / -1;
	grid-row: 2;
	margin-top: clamp(32px, 4vw, 80px);
}

.site-footer__legal {
	display: flex;
	flex: 1 1 auto;
	align-items: flex-start;
	justify-content: space-between;
	gap: clamp(16px, 2.0833vw, 40px);
	min-width: 0;
	font-size: clamp(12px, 0.8333vw, 16px);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
}

.site-footer__requisites { flex: 0 1 300px; }

.site-footer__docs {
	display: flex;
	flex: 1 1 auto;
	justify-content: space-between;
	gap: clamp(16px, 2.0833vw, 40px);
	min-width: 0;
}

.site-footer__docs li { flex: 0 1 300px; }

.site-footer__docs a { transition: color var(--dur) var(--ease); }
.site-footer__docs a:hover { color: var(--c-gold-ink); text-decoration: underline; }

/* -------------------------------------------------------------------------
   20. Услуги списком (страница «Все услуги»)
   ---------------------------------------------------------------------- */

.services-list__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
}

.service-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: clamp(320px, 29.5833vw, 568px);
	padding: clamp(24px, 3.1771vw, 61px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: var(--c-beige);
	overflow: hidden;
	isolation: isolate;
	/* Работает только без JS: с ним правило перебивает .js [data-reveal],
	   поэтому подъём на ховере восстанавливается в разделе 30. */
	transition: var(--t-lift);
}

.service-card--wide { grid-column: 1 / -1; }

.service-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-card);
}

.service-card__link { position: absolute; inset: 0; z-index: 3; }

/* Кадр иллюстрации из макета — 340×416, прижат к правому нижнему углу карточки. */
.service-card__ill {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
	width: clamp(170px, 17.7083vw, 340px);
	height: clamp(208px, 21.6667vw, 416px);
	object-fit: cover;
	filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.06));
	transition: transform 0.75s var(--ease-lift);
}

.service-card:hover .service-card__ill { transform: translateY(-6px) scale(1.04); }

/* Из макета: заголовок H36/1.0 без трекинга, абзац 24/1.4, отбивки по 40px. */
.service-card__title {
	margin-block: clamp(18px, 2.0833vw, 40px);
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.service-card__text {
	max-width: 28em;
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

.chips {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(8px, 0.625vw, 12px);
	margin-top: auto;
	padding-top: clamp(22px, 2.5vw, 48px);
}

/* Бейдж из макета: заливка белым 10%, сплошная белая обводка и внутренняя тень —
   лёгкое затемнение сверху слева и белая подсветка снизу справа (значения сняты
   с макета по кромке: −7 и +5 к заливке). Без состояния наведения. */
.chip {
	position: relative;
	z-index: 4;
	padding: clamp(10px, 1.0417vw, 20px) clamp(16px, 1.6667vw, 32px);
	border: 1px solid var(--c-white);
	border-radius: var(--r-pill);
	background: rgba(255, 255, 255, 0.1);
	box-shadow:
		inset 5px 5px 14px rgba(24, 25, 31, 0.05),
		inset -5px -5px 14px rgba(255, 255, 255, 0.5);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(17, 24, 39, 0.7);
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   21. Две карточки выбора
   ---------------------------------------------------------------------- */

/* В макете карточки начинаются от заголовка, а не от края страницы. */
.two-choice__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
	padding-left: var(--head-col);
}

.choice-card {
	display: flex;
	flex-direction: column;
	padding: clamp(24px, 3.125vw, 60px);
	border: 1px solid var(--c-line);
	border-radius: var(--r-md);
	transition: var(--t-lift);
}

.choice-card:hover,
.choice-card.is-active { border-color: var(--c-gold); }

.choice-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }

.choice-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-lead);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.02em;
}

/* Нумерованный список 01/02/03 */
.num-list {
	display: grid;
	gap: clamp(16px, 1.6667vw, 32px);
	margin-top: clamp(24px, 2.9167vw, 56px);
}

.num-list__item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: clamp(10px, 0.8333vw, 16px);
	align-items: baseline;
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
	transition: transform var(--dur) var(--ease);
}

.num-list__item:hover { transform: translateX(4px); }

.num-list__num {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1;
	color: var(--c-gold);
	letter-spacing: 0;
}

.choice-card .btn { margin-top: auto; align-self: flex-start; }
.choice-card .num-list { margin-bottom: clamp(24px, 2.5vw, 48px); }

/* -------------------------------------------------------------------------
   22. Бенто-сетка задач
   ---------------------------------------------------------------------- */

/* Верхний блок: четыре колонки по 435 и три строки 307 / 243 / 307.
   Места карточек заданы явно — автопоток кладёт третью карточку
   в свободную ячейку второй строки, а в макете она стоит в третьей. */
.bento__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-template-rows:
		clamp(150px, 15.9896vw, 307px)
		clamp(120px, 12.6563vw, 243px)
		clamp(150px, 15.9896vw, 307px);
	gap: var(--gap);
}

.bento-card--p1 { grid-area: 1 / 1 / 3 / 3; }
.bento-card--p2 { grid-area: 1 / 3 / 2 / 5; }
.bento-card--p3 { grid-area: 3 / 1 / 4 / 3; }
.bento-card--p4 { grid-area: 2 / 3 / 4 / 4; }
.bento-card--p5 { grid-area: 2 / 4 / 4 / 5; }

/* Нижний блок: либо пять карточек 344×436, либо одна на всю ширину 1800×307. */
.bento__row {
	display: grid;
	grid-template-columns: repeat(var(--c, 5), minmax(0, 1fr));
	gap: var(--gap);
	margin-top: var(--gap);
	--bento-row-h: clamp(220px, 22.7083vw, 436px);
}

.bento__row.cols-1 { --bento-row-h: clamp(160px, 15.9896vw, 307px); }
.bento__row.cols-1 .bento-card__title,
.bento__row.cols-1 .bento-card__text { max-width: min(830px, 62%); }
.bento__row .bento-card {
	min-height: var(--bento-row-h);
	padding: clamp(16px, 1.6146vw, 31px);
}

.bento-card {
	/* Рамка иллюстрации из макета: 263×263 с отступом 22 от угла карточки */
	--ill-size: clamp(120px, 13.7vw, 263px);
	--ill-gap: clamp(0px, 1.1458vw, 22px);

	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 0;
	padding: clamp(20px, 2.1354vw, 41px);
	border-radius: var(--r-md);
	background: var(--c-beige);
	overflow: hidden;
	isolation: isolate;
	transition: var(--t-lift);
}

.bento-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }

/* Золотой градиент из макета появляется при наведении, а не залит по умолчанию.
   Слой лежит под иллюстрацией (у неё z-index -1), поэтому картинка не тускнеет. */
.bento-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	border-radius: inherit;
	background: var(--grad-gold);
	opacity: 0;
	transition: opacity var(--dur) var(--ease);
}

.bento-card:hover::before { opacity: 1; }
.bento-card:hover .num-badge { background: rgba(255, 255, 255, 0.55); }

.bento-card__title {
	position: relative;
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

/* Ручной перенос, нужный только в мобильной раскладке. У <br> дефолтный
   display: inline, поэтому выключается он именно через display: none;
   в тексте перед ним стоит пробел, чтобы слова не слиплись на десктопе. */
.br-mob { display: none; }

/* В макете иллюстрация вписана в квадратную рамку у правого нижнего угла.
   Раньше задавалась только ширина: у вертикальных картинок (мешок, папка)
   высота уходила выше карточки — картинки вылезали за край и были разного размера. */
.bento-card__ill {
	position: absolute;
	right: var(--ill-right, var(--ill-gap));
	bottom: var(--ill-bottom, var(--ill-gap));
	z-index: -1;
	width: var(--ill-size);
	height: var(--ill-size);
	max-width: calc(100% - 2 * var(--ill-gap));
	max-height: calc(100% - 2 * var(--ill-gap));
	object-fit: contain;
	transition: transform 0.75s var(--ease-lift);
}

/* Низкая карточка под крупной и две высокие узкие: картинка мельче
   и с небольшим отступом от нижнего и бокового края */
.bento-card--p3,
.bento-card--p4,
.bento-card--p5 { --ill-size: clamp(96px, 10.4167vw, 200px); }

.bento-card--p4,
.bento-card--p5 { --ill-gap: clamp(6px, 0.9375vw, 18px); }

/* Нижний ряд: пять карточек 344×436 — рамка мельче и в самом углу */
.bento__row .bento-card { --ill-size: clamp(110px, 9.7917vw, 188px); --ill-gap: 0px; }

/* Одна карточка на всю ширину (1800×307) — рамка как у крупных, с отступом */
.bento__row.cols-1 .bento-card { --ill-size: clamp(120px, 13.7vw, 263px); --ill-gap: clamp(0px, 1.1458vw, 22px); }

/* Маркетплейсы: иллюстрации мельче и дальше от правого и нижнего края.
   Карточку «Налоговый учет» (p4) оставляем как есть. */
.page-marketplejsy .bento-card:not(.bento-card--p4) {
	--ill-size: clamp(100px, 11.1979vw, 215px);
	--ill-gap: clamp(12px, 1.875vw, 36px);
}

.page-marketplejsy .bento-card.bento-card--p3,
.page-marketplejsy .bento-card.bento-card--p5 { --ill-size: clamp(84px, 8.5938vw, 165px); }

/* Решения: иллюстрации мельче и дальше от правого и нижнего края */
.page-resheniya .bento-card {
	--ill-size: clamp(96px, 10.4167vw, 200px);
	--ill-gap: clamp(12px, 1.875vw, 36px);
}

.page-resheniya .bento-card.bento-card--p3,
.page-resheniya .bento-card.bento-card--p4,
.page-resheniya .bento-card.bento-card--p5 { --ill-size: clamp(80px, 8.3333vw, 160px); }

/* Бухгалтерский учет — вдвое дальше от правого края */
.page-resheniya .bento-card.bento-card--p1 { --ill-right: clamp(24px, 3.75vw, 72px); }

/* Отчетность, налоги и сопровождение бизнеса — картинка мельче, по центру
   по вертикали и с увеличенным отступом справа */
.page-resheniya .bento-card.bento-card--p2,
.page-resheniya .bento-card.bento-card--p3,
.page-resheniya .bento__row .bento-card {
	--ill-size: clamp(72px, 7.2917vw, 140px);
	--ill-right: clamp(20px, 3.125vw, 60px);
}

.page-resheniya .bento-card--p2 .bento-card__ill,
.page-resheniya .bento-card--p3 .bento-card__ill,
.page-resheniya .bento__row .bento-card__ill {
	top: 50%;
	bottom: auto;
	margin-top: calc(var(--ill-size) / -2);
}

/* Сопровождение бизнеса — карточка на всю ширину, картинка крупнее соседей */
.page-resheniya .bento__row .bento-card { --ill-size: clamp(88px, 8.8542vw, 170px); }

/* Консультации — иконка крупнее соседних высоких карточек, опущена ниже
   (на уровень кружка с номером) и сдвинута правее */
.page-resheniya .bento-card.bento-card--p5 {
	--ill-size: clamp(112px, 11.4583vw, 220px);
	--ill-right: clamp(0px, 0.4167vw, 8px);
	--ill-bottom: 0px;
}

/* Калькулятор в карточке «Расчет налогов» нарисован крупнее прочих
   иллюстраций и перевешивает карточку — сбавляем на 15%. Считаем от
   --ill-size, чтобы пропорция держалась на всех брейкпоинтах, где размер
   переопределяется. Ниже 521px не трогаем: там у всех иллюстраций свой
   фиксированный размер, не зависящий от --ill-size. */
@media (min-width: 521px) {
	.page-buhgalteriya-ip .bento-card__ill[src$="ill-calculator.png"] {
		width: calc(var(--ill-size) * 0.85);
		height: calc(var(--ill-size) * 0.85);
	}
}

.bento-card:hover .bento-card__ill { transform: translateY(-6px) scale(1.05); }
.bento-card .num-badge { position: relative; margin-top: auto; }

/* -------------------------------------------------------------------------
   23. Медиа-карточка (налоговые режимы, «почему сложнее»)
   ---------------------------------------------------------------------- */

.media-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: clamp(320px, 28.125vw, 540px);
	padding: clamp(26px, 3.125vw, 60px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: #f5f0e8;
	overflow: hidden;
	isolation: isolate;
}

.media-card__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
}

/* В макете снимок сам светлый слева, поверх — мягкая заливка до 45% ширины */
.media-card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(253, 251, 250, 0.92) 0%, rgba(253, 251, 250, 0.75) 30%, rgba(253, 251, 250, 0) 62%);
}

/* Вариант со списком: поля 100 и текст крупнее */
.media-card--list {
	min-height: clamp(360px, 38.6458vw, 742px);
	padding: clamp(28px, 5.2083vw, 100px);
	border: 1px solid var(--c-line-hard);
}

.media-card--list::after {
	background: linear-gradient(90deg, rgba(253, 251, 250, 0.65) 0%, rgba(253, 251, 250, 0.45) 26%, rgba(253, 251, 250, 0) 52%);
}

.media-card--list .num-list__item {
	font-size: var(--fs-h3);
	line-height: 1;
	color: var(--c-ink);
}

/* Вариант с нумерованными тезисами: в макете колонка начинается от «глазка» */
.media-card--items {
	min-height: clamp(360px, 35.2083vw, 676px);
	padding: clamp(28px, 5.2083vw, 100px);
	padding-left: var(--head-col);
}

.media-card--items::after {
	background: linear-gradient(90deg, rgba(253, 251, 250, 0.7) 0%, rgba(253, 251, 250, 0.5) 30%, rgba(253, 251, 250, 0) 56%);
}

.media-card--items .media-card__content { max-width: min(560px, 46%); }

.media-card__items { display: grid; gap: clamp(24px, 3.3333vw, 64px); }

.media-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: clamp(16px, 1.8229vw, 35px);
	align-items: start;
}

.media-item .num-badge { background: rgba(235, 201, 124, 0.5); }

.media-item__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.media-item__text {
	margin-top: clamp(8px, 0.625vw, 12px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
}

.media-card__content { max-width: min(1120px, 66%); }

/* В макете заголовок карточки — H64/0.96, как у секции */
.media-card__title {
	margin-block: clamp(16px, 1.6667vw, 32px) clamp(16px, 2.0833vw, 40px);
	font-family: var(--font-display);
	font-size: var(--fs-h2);
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: -0.02em;
}

.media-card .eyebrow__text { max-width: none; white-space: nowrap; }

.media-card .chips { margin-top: 0; padding-top: 0; }

/* Бейдж режима: плоская заливка без внутренней тени и без состояния наведения. */
.media-card .chip {
	display: inline-flex;
	align-items: center;
	gap: clamp(6px, 0.5208vw, 10px);
	border-color: var(--c-gold);
	background: var(--c-white);
	box-shadow: none;
	line-height: 1;
	color: var(--c-ink);
}

/* Иконки монет в макете разной ширины, но одной высоты — задаём высоту,
   ширину считает браузер по пропорции. Чуть приподняты к середине строки. */
.media-card .chip__icon {
	display: inline-grid;
	place-items: center;
	flex: none;
	color: var(--c-gold);
	transform: translateY(-2px);
}

.media-card .chip__icon svg { width: auto; height: clamp(18px, 1.3542vw, 26px); }

/* -------------------------------------------------------------------------
   24. Ряды-шаги (Понятная система взаимодействия)
   ---------------------------------------------------------------------- */

/* В макете лента строк начинается от колонки заголовка, а не от края страницы. */
.rows__list {
	display: grid;
	gap: var(--gap);
	padding-left: var(--head-col);
}

/* Строка 1453×182: номер 60px, тонкий разделитель, текст 36/24. Заливка
   золотым нарастает от первой строки к последней (--i ставит шаблон). */
.row-card {
	display: grid;
	grid-template-columns: auto auto minmax(0, 1fr);
	gap: clamp(14px, 1.5625vw, 30px);
	align-items: center;
	min-height: clamp(110px, 9.4931vw, 182px);
	padding: clamp(18px, 1.6146vw, 31px);
	border: 1px solid var(--c-line-soft);
	border-radius: var(--r-md);
	background: transparent;
	transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

/* Заливка из макета — градиент от прозрачного к #efdfb9, значения по строкам
   взяты из Figma как есть. Первая строка без заливки, дальше золото плотнее. */
.row-card:nth-child(2) {
	background: linear-gradient(180deg, rgba(239, 223, 185, 0) 20.43%, #efdfb9 215.75%);
}

.row-card:nth-child(3) {
	background: linear-gradient(182.19deg, rgba(239, 223, 185, 0) -48.33%, #efdfb9 171.76%);
}

.row-card:nth-child(n + 4) {
	background: linear-gradient(170.23deg, rgba(239, 223, 185, 0) -83.96%, #efdfb9 67.76%);
}

.row-card:hover {
	transform: translateX(6px);
	border-color: transparent;
	background: linear-gradient(180deg, rgba(239, 223, 185, 0) 30%, rgb(239, 223, 185) 108%);
}

/* Workflow rows use consistent outlined cards without progressive fills. */
:is(.page-kak-rabotaem, .page-doverie) .row-card,
:is(.page-kak-rabotaem, .page-doverie) .row-card:hover {
	border-color: var(--c-line-hard);
	background: transparent;
}

.row-card__rule {
	width: 1px;
	height: 66%;
	align-self: center;
	background: var(--c-line);
}

.row-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.row-card__text {
	margin-top: clamp(6px, 0.5208vw, 10px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
}

.row-card .num-badge {
	width: clamp(42px, 3.125vw, 60px);
	height: clamp(42px, 3.125vw, 60px);
	background: rgba(235, 201, 124, 0.5);
	border-color: transparent;
	color: var(--c-ink);
	margin: 0;
}

/* -------------------------------------------------------------------------
   25. До / После
   ---------------------------------------------------------------------- */

/* В макете обе карточки начинаются от колонки заголовка */
.compare__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
	padding-left: var(--head-col);
}

.compare__col {
	padding: clamp(24px, 3.125vw, 60px);
	border: 1px solid rgba(24, 25, 31, 0.25);
	border-radius: var(--r-md);
	transition: var(--t-lift);
}

/* Раньше «После» была обведена золотым в 3px и читалась как выбранная карточка.
   Обе колонки оформлены одинаково; акцент остаётся только на наведении. */
.compare__col:hover { transform: translateY(-4px); }

.compare__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.02em;
}

.compare__col--before .num-list__item { color: var(--c-muted); }

/* -------------------------------------------------------------------------
   26. Карточки-фичи с иллюстрацией
   ---------------------------------------------------------------------- */

.feature-cards__grid {
	display: grid;
	grid-template-columns: repeat(var(--c, 2), minmax(0, 1fr));
	gap: var(--gap);
}

/* «База знаний» в макете — колонка широких строк 1453×220 от колонки «глазка» */
.feature-cards--rows .feature-cards__grid {
	grid-template-columns: 1fr;
	padding-left: var(--head-col);
}

.feature-cards--rows .feature-card {
	min-height: clamp(150px, 11.4583vw, 220px);
	padding: clamp(18px, 1.6146vw, 31px);
	border: 1px solid var(--c-line-soft);
	background: transparent;
}

.feature-cards--rows .feature-card .num-badge {
	width: clamp(42px, 3.125vw, 60px);
	height: clamp(42px, 3.125vw, 60px);
	background: rgba(235, 201, 124, 0.5);
}

.feature-cards--rows .feature-card__title {
	max-width: none;
	margin-block: clamp(18px, 1.6667vw, 32px) clamp(8px, 0.5208vw, 10px);
}

.feature-cards--rows .feature-card__text { max-width: none; }

.feature-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: clamp(240px, 21vw, 404px);
	padding: clamp(24px, 3.125vw, 60px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: var(--c-beige);
	overflow: hidden;
	isolation: isolate;
	transition: var(--t-lift);
}

.feature-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }

.feature-card__title {
	margin-block: clamp(24px, 3.125vw, 60px) clamp(18px, 2.0833vw, 40px);
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	max-width: min(452px, 100%);
}

.feature-card__text {
	max-width: min(452px, 100%);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

/* На «Доверие» переносы в подтекстах карточек расставлены вручную и должны
   держаться на любой десктопной ширине. Фиксированный max-width 452px при
   растущем на широких экранах --fs-lead давал на широких мониторах лишний
   авто-перенос внутри строки — снимаем ограничение, границы держат только <br>. */
.page-doverie .feature-card__text { max-width: none; }

/* В макете картинка задана по высоте (~215px), прижата к правому краю карточки
   и имеет мягкую тень. Ширину считает браузер по пропорции файла. */
.feature-card__ill {
	position: absolute;
	right: 0;
	bottom: clamp(0px, 0.5208vw, 10px);
	z-index: -1;
	width: auto;
	height: clamp(120px, 11.1979vw, 215px);
	max-width: 60%;
	object-fit: contain;
	object-position: right bottom;
	filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.06));
	transition: transform 0.75s var(--ease-lift);
}

/* «Командная работа» на «Доверии» — картинка широкая, в макете ниже соседних */
.page-doverie .feature-cards__grid > .feature-card:nth-child(3) .feature-card__ill {
	height: clamp(100px, 9.4792vw, 182px);
}

/* «Как работаем»: картинки мельче и сдвинуты от правого края и низа */
.page-kak-rabotaem .feature-card__ill {
	right: clamp(20px, 3.125vw, 60px);
	bottom: clamp(24px, 3.4375vw, 66px);
	height: clamp(104px, 9.6354vw, 185px);
}

.feature-card:hover .feature-card__ill { transform: translateY(-6px) rotate(-3deg) scale(1.05); }

/* -------------------------------------------------------------------------
   27. Площадки (логотипы)
   ---------------------------------------------------------------------- */

.logos__list {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(20px, 2.9167vw, 56px);
	padding-left: var(--head-col);
}

.logo-item { display: grid; justify-items: center; gap: clamp(12px, 1.0417vw, 20px); }

/* Плитка площадки из макета — 250×250, подпись 36 */
.logo-item__box {
	display: grid;
	place-items: center;
	width: clamp(110px, 13.0208vw, 250px);
	height: clamp(110px, 13.0208vw, 250px);
	border-radius: clamp(12px, 1.5625vw, 30px);
	background: var(--c-white);
	box-shadow: 0 10px 26px -18px rgba(24, 25, 31, 0.5);
	font-family: var(--font-display);
	font-size: clamp(26px, 3.4375vw, 66px);
	font-weight: 700;
	color: var(--c-white);
	transition: var(--t-lift);
}

.logo-item:hover .logo-item__box { transform: translateY(-5px) scale(1.04); box-shadow: var(--shadow-card); }

.logo-item__box--wb   { background: linear-gradient(135deg, #cb11ab, #7b1fa2); }
.logo-item__box--ozon { background: linear-gradient(135deg, #005bff, #0043c1); }
.logo-item__box--ym   { background: linear-gradient(135deg, #fc3f1d, #ff9c00); }
.logo-item__box--ecom { background: var(--c-white); color: #1a73e8; font-size: clamp(14px, 1.5625vw, 30px); }

/* Логотип площадки картинкой из макета */
img.logo-item__box { object-fit: cover; box-shadow: none; }

.logo-item__label {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1;
	color: var(--c-ink);
}

/* -------------------------------------------------------------------------
   28. Статьи / база знаний
   ---------------------------------------------------------------------- */

/* В макете карточки материалов начинаются от колонки «глазка» */
.posts__grid {
	display: grid;
	grid-template-columns: repeat(var(--c, 2), minmax(0, 1fr));
	gap: var(--gap);
	padding-left: var(--head-col);
}

.post-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 1.25vw, 24px);
	padding: clamp(24px, 2.6042vw, 50px);
	border-radius: var(--r-md);
	background: var(--c-beige);
	transition: var(--t-lift);
}

.post-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.post-card__link { position: absolute; inset: 0; }

.post-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.post-card__text {
	margin-top: clamp(10px, 1.0417vw, 20px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.5);
}

.topic-card {
	position: relative;
	display: grid;
	align-content: start;
	gap: clamp(16px, 1.6667vw, 32px);
	min-height: clamp(150px, 11.4583vw, 220px);
	padding: clamp(18px, 1.6146vw, 31px);
	border: 1px solid var(--c-line-soft);
	border-radius: var(--r-md);
	transition: var(--t-lift);
}


.topic-card:hover { border-color: var(--c-gold); transform: translateY(-3px); }

.topic-card__icon {
	display: grid;
	place-items: center;
	width: clamp(42px, 3.125vw, 60px);
	height: clamp(42px, 3.125vw, 60px);
	border-radius: 50%;
	background: rgba(235, 201, 124, 0.5);
	color: var(--c-gold-ink);
}

/* -------------------------------------------------------------------------
   29. Модальное окно
   ---------------------------------------------------------------------- */

.modal {
	position: fixed;
	inset: 0;
	z-index: 90;
	display: grid;
	place-items: center;
	padding: var(--pad-x);
	pointer-events: none;
}

.modal[hidden] { display: none; }
.modal.is-open { pointer-events: auto; }

/* Затемнение и размытие нарастают вместе: одна длительность и одна кривая.
   Раньше проявлялся весь .modal через opacity, а backdrop-filter под
   полупрозрачным родителем браузер не рисует — блюр включался рывком
   в самом конце, уже после затемнения. 0.4s — под таймер закрытия в main.js. */
.modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(24, 25, 31, 0);
	backdrop-filter: blur(0);
	-webkit-backdrop-filter: blur(0);
	transition:
		background-color 0.4s var(--ease-lift),
		backdrop-filter 0.4s var(--ease-lift),
		-webkit-backdrop-filter 0.4s var(--ease-lift);
}

.modal.is-open .modal__backdrop {
	background: rgba(24, 25, 31, 0.42);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.modal__dialog {
	position: relative;
	width: min(680px, 100%);
	max-height: 90vh;
	overflow-y: auto;
	padding: clamp(28px, 3.125vw, 60px);
	border-radius: var(--r-md);
	background: var(--c-bg);
	box-shadow: var(--shadow-pop);
	opacity: 0;
	transform: translateY(24px) scale(0.98);
	transition:
		opacity 0.4s var(--ease-lift),
		transform var(--dur-slow) var(--ease-out);
}

.modal.is-open .modal__dialog { opacity: 1; transform: none; }

.modal__title { margin-block: 14px clamp(24px, 2.5vw, 48px); }

/* Подпись над заголовком — одной строкой: общий max-width глазка рассчитан
   на узкую колонку секции, в модалке места хватает. */
.modal .eyebrow__text { max-width: none; white-space: nowrap; }

/* Смена формы на «Заявка принята» (showLeadSuccess в main.js): форма гаснет
   за 0.25s, затем проявляется новый экран, высоту окна тянет сам скрипт. */
.modal__view { transition: opacity 0.25s var(--ease-lift); }
.modal__view.is-leaving { opacity: 0; }

/* Экран успеха по макету: значок 100, отбивки 40 и 20, по центру. */
.modal-success {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: clamp(28px, 2.0833vw, 40px);
	margin-top: clamp(32px, 3.125vw, 60px);
	text-align: center;
	opacity: 0;
	transform: translateY(12px);
	transition:
		opacity 0.45s var(--ease-lift),
		transform 0.6s var(--ease-out);
}

.modal-success[hidden] { display: none; }
.modal-success.is-shown { opacity: 1; transform: none; }

.modal-success__badge {
	display: grid;
	place-items: center;
	width: clamp(72px, 5.2083vw, 100px);
	height: clamp(72px, 5.2083vw, 100px);
	border-radius: 50%;
	background: #26a300;
	color: var(--c-white);
	box-shadow: 0 10px 100px rgba(235, 201, 124, 0.6);
}

.modal-success__badge svg { width: 48%; height: 48%; }

.modal-success__body {
	display: grid;
	gap: clamp(12px, 1.0417vw, 20px);
}

.modal-success__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1;
	color: var(--c-ink);
	outline: none;
}

.modal-success__text {
	font-family: var(--font-display);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	opacity: 0.5;
}

.modal-success__close {
	padding: clamp(14px, 1.0417vw, 20px) clamp(28px, 2.0833vw, 40px);
}

.modal__close {
	position: absolute;
	top: clamp(16px, 1.25vw, 24px);
	right: clamp(16px, 1.25vw, 24px);
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--c-line);
	border-radius: 50%;
	background: transparent;
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.modal__close:hover {
	background: var(--c-ink);
	color: var(--c-white);
	transform: rotate(90deg);
}

.modal .field__label,
.modal .field__input { font-size: var(--fs-lead); }
.modal .lead-form__consent { font-size: var(--fs-sm); }
.modal .field__input { padding-bottom: 16px; }

/* -------------------------------------------------------------------------
   30. Анимации появления при скролле
   ---------------------------------------------------------------------- */

/* Анимация появления включается только при работающем JS: без него контент виден сразу. */
.js [data-reveal] {
	opacity: 0;
	--t-reveal:
		opacity var(--dur-slow) var(--ease-out) var(--reveal-delay, 0ms),
		translate var(--dur-slow) var(--ease-out) var(--reveal-delay, 0ms),
		scale var(--dur-slow) var(--ease-out) var(--reveal-delay, 0ms),
		clip-path var(--dur-slow) var(--ease-out) var(--reveal-delay, 0ms);
	transition: var(--t-reveal);
	will-change: opacity, translate;
}

/* Ловушка: этот шорткат специфичнее правил самих карточек (0,2,0 против 0,1,0)
   и обнуляет у них transition для transform/box-shadow — подъём на ховере
   становится мгновенным. Карточкам с ховером список нужно собирать целиком.
   Появление идёт по translate/scale, ховер по transform, так что не конфликтуют. */
.js :is(
	.num-card, .step-card, .case-card, .service-card, .choice-card, .bento-card,
	.compare__col, .feature-card, .post-card, .topic-card, .contact-card, .pill,
	.price-card
)[data-reveal] {
	transition: var(--t-reveal), var(--t-lift);
}

.js [data-reveal="up"]   { translate: 0 34px; }

/* Внутри горизонтальных лент вертикальный сдвиг не нужен: он вылезал за
   рамку прокрутки и карточки появлялись обрезанными. Оставляем только фейд. */
.js .slider__track > [data-reveal="up"],
.js .cases__track > [data-reveal="up"],
.js .steps__list > [data-reveal="up"] { translate: none; }
.js [data-reveal="left"] { translate: -34px 0; }
.js [data-reveal="right"]{ translate: 34px 0; }
.js [data-reveal="zoom"] { scale: 0.96; }
.js [data-reveal="mask"] { clip-path: inset(0 0 100% 0 round var(--r-md)); }

.js [data-reveal].is-revealed {
	opacity: 1;
	translate: none;
	scale: none;
}

/* Ниже 1025px колонки идут во всю ширину: сдвиг вбок до появления выталкивал
   их за край экрана (колонка «После» в «До / После» — на 34px), и страница
   становилась шире экрана. Здесь они появляются снизу, как остальные блоки. */
@media (max-width: 1024px) {
	.js [data-reveal="left"],
	.js [data-reveal="right"] { translate: 0 34px; }
}

/* Раскрытая маска чуть шире блока, иначе её скругление срезает собственную обводку */
.js [data-reveal="mask"].is-revealed { clip-path: inset(-3px round calc(var(--r-md) + 3px)); }

.js [data-reveal].is-revealed { will-change: auto; }

/* Плавное «дыхание» декоративных элементов */
@keyframes float-soft {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-8px); }
}

/* -------------------------------------------------------------------------
   31. Адаптив
   ---------------------------------------------------------------------- */

/* Широкие мониторы: не растягиваем контент бесконечно */
@media (min-width: 1921px) {
	:root {
		--fs-h1: 80px;  --fs-h2: 64px;  --fs-h3: 36px;
		--fs-lead: 24px; --fs-body: 20px; --fs-sm: 18px; --fs-eyebrow: 14px;
		--pad-x: 60px;  --gap: 20px;  --gap-lg: 40px;  --head-col: 343px;
		--r-sm: 20px; --r-md: 40px; --r-lg: 80px;
		--section-y: 200px;
		/* --header-h и --header-h-sm считаются из --hdr-*, а те и так упираются
		   в верх clamp(), поэтому отдельно фиксировать высоту шапки не нужно. */
	}
}

/* Ноутбуки 1280–1440 */
@media (max-width: 1440px) {
	.hero-home__content { max-width: 66%; }
	.banner__content    { max-width: 62%; }
}

/* Небольшие ноутбуки и планшеты-landscape */
@media (max-width: 1200px) {
	:root { --section-y: clamp(56px, 8vw, 120px); }

	.nav__list { gap: 14px; padding: 12px 16px; }
	.nav__link { font-size: 14px; }
	.logo__tagline { display: none; }
	.logo__slash { display: none; }

	.section-head { grid-template-columns: 1fr; gap: 16px; }
	.eyebrow__text { max-width: none; }

	.trust__grid,
	.benefits__grid,
	.faq__grid,
	.form-section__grid { grid-template-columns: 1fr; }

	/* Колонка «глазка» схлопывается — вместе с ней уходят сдвиги сеток и ленты */
	:root { --head-col: 0px; }

	.trust__list { padding-top: 0; }
	.trust__grid { align-items: start; }
	.steps__list { grid-template-columns: repeat(var(--c, 3), minmax(0, 1fr)); }

	.cols-5, .cols-6 { --c: 3; }

	.bento__grid,
	.bento__row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: none;
	}

	.bento-card { grid-area: auto !important; min-height: clamp(220px, 30vw, 320px); }
	.bento__grid > .bento-card:first-child { grid-column: span 2; }
	.bento__row .bento-card { min-height: clamp(220px, 30vw, 320px); }

	.site-footer__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.site-footer__lead  { grid-column: 1; grid-row: 1; }
	.site-footer__nav   { grid-column: 2; grid-row: 1; }
	.site-footer__aside { grid-column: 1 / -1; grid-row: 2; flex-direction: row; align-items: center; justify-content: space-between; }
	.site-footer__logo  { grid-column: 1 / -1; grid-row: 3; margin-top: clamp(24px, 3vw, 48px); }
}

/* Планшеты */
@media (max-width: 1024px) {
	.nav { display: none; }
	.header-actions .btn--call span { display: none; }
	.header-actions .btn--call { padding: 12px; }
	.burger { display: block; }

	.hero-home {
		aspect-ratio: auto;
		min-height: auto;
		align-items: center;
		padding-block: calc(var(--header-h) + clamp(24px, 5vw, 56px)) clamp(48px, 8vw, 88px);
	}
	.hero-home__content { max-width: 100%; }
	.hero-home__bg::after { background: linear-gradient(180deg, rgba(248, 246, 242, 0.94) 0%, rgba(248, 246, 242, 0.72) 55%, rgba(248, 246, 242, 0.45) 100%); }
	.hero-home__bg img { object-position: 78% center; }

	.hero-inner__card { align-items: center; }
	.hero-inner__content { max-width: 100%; }
	.hero-inner__actions { margin-top: 0; }
	.hero-inner__rings { display: none; }
	.hero-inner__card::after { background: linear-gradient(180deg, rgba(250, 248, 244, 0.95) 0%, rgba(250, 248, 244, 0.72) 60%, rgba(250, 248, 244, 0.5) 100%); }

	.banner__content { max-width: 100%; }
	.banner__card::after { background: linear-gradient(180deg, rgba(249, 248, 245, 0.95) 0%, rgba(249, 248, 245, 0.75) 60%, rgba(249, 248, 245, 0.5) 100%); }

	.media-card__content { max-width: 100%; }
	.media-card::after { background: linear-gradient(180deg, rgba(250, 249, 246, 0.95) 0%, rgba(250, 249, 246, 0.78) 60%, rgba(250, 249, 246, 0.55) 100%); }

	.cols-3, .cols-4, .cols-5, .cols-6 { --c: 2; }

	.services-list__grid,
	.two-choice__grid,
	.compare__grid,
	.feature-cards__grid { grid-template-columns: 1fr; }

	.service-card--wide { grid-column: auto; }

	.trust__list { grid-template-columns: 1fr; }

	.pills__list { flex-wrap: wrap; justify-content: flex-start; column-gap: var(--gap); padding-bottom: 0; }
	.pill { font-size: var(--fs-lead); }
	.pill:nth-child(even) { transform: none; }
	.pill:nth-child(even):hover { transform: translateY(-3px); }
}

/* Телефоны */
@media (max-width: 720px) {
	:root {
		--fs-h1: clamp(30px, 8.6vw, 40px);
		--fs-h2: clamp(26px, 7.4vw, 34px);
		--fs-h3: clamp(20px, 5.4vw, 24px);
		--r-lg: 28px;
		--r-md: 20px;
	}

	[class*="cols-"] { --c: 1; }

	.bento__grid,
	.bento__row { grid-template-columns: 1fr; }
	.bento-card,
	.bento__grid > .bento-card:first-child { grid-column: span 1; grid-row: auto; }

	.site-footer__inner { grid-template-columns: 1fr; }
	.site-footer__lead,
	.site-footer__nav,
	.site-footer__logo { grid-column: 1; grid-row: auto; }
	.site-footer__aside {
		grid-column: 1;
		grid-row: auto;
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
		text-align: left;
	}
	.site-footer__buttons .btn { width: 100%; }

	.lead-form__foot { flex-direction: column; align-items: stretch; }
	.lead-form__foot .btn { width: 100%; }

	.field__input,
	.field__label { font-size: 20px; }
	.field__input { padding-bottom: 14px; }

	.media-tile { --tile-w: 78vw; height: 96vw; }
	.case-card { width: 82vw; }

	.hero-home { border-radius: 0 0 var(--r-lg) var(--r-lg); }
}

/* Внутренние страницы: общая геометрия мобильных фреймов Figma 768px. */
/* На ООО кадр первого экрана сдвинут: снимок уезжает правее, в кадр берём левее. */
@media (max-width: 1024px) {
	body.page-buhgalteriya-ooo .hero-inner__bg { object-position: 60% center; }
	body.page-konsultaciya-buhgaltera .hero-inner__bg { object-position: 62% center; }
	body.page-sdacha-otchetnosti .hero-inner__bg { object-position: 68% center; }
	body.page-marketplejsy .hero-inner__bg { object-position: 60% center; }
	body.page-problemy-biznesa .hero-inner__bg { object-position: 84% center; }
	body.page-resheniya .hero-inner__bg { object-position: 62% center; }
	body.page-doverie .hero-inner__bg { object-position: 62% center; }
	body.page-kak-rabotaem .hero-inner__bg { object-position: 62% center; }
	body.page-baza-znaniy .hero-inner__bg { object-position: 46% center; }
}

@media (max-width: 768px) {
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) {
		--pad-x: clamp(20px, 5.2083vw, 40px);
		--section-y: clamp(80px, 15.625vw, 120px);
		--fs-h1: clamp(38px, 8.3333vw, 64px);
		--fs-h2: clamp(32px, 6.5104vw, 50px);
		--fs-h3: clamp(24px, 4.6875vw, 36px);
		--fs-lead: clamp(18px, 3.125vw, 24px);
		--fs-eyebrow: clamp(13px, 2.3438vw, 18px);
		--r-md: clamp(24px, 5.2083vw, 40px);
	}

	body:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-main { padding-top: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header:not(.is-stuck) {
		padding-block: clamp(20px, 5.2083vw, 40px);
		background: transparent;
		backdrop-filter: none;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header__inner {
		display: flex;
		justify-content: space-between;
		min-height: clamp(52px, 9.2448vw, 71px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header:not(.is-stuck) .logo__mark {
		width: clamp(59px, 10.5376vw, 81px);
		height: clamp(52px, 9.2448vw, 71px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header:not(.is-stuck) .logo__name {
		font-size: clamp(18px, 2.9306vw, 22.5px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header:not(.is-stuck) .logo__tagline {
		display: block;
		font-size: clamp(10px, 1.8229vw, 14px);
		white-space: nowrap;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-header:not(.is-stuck) .logo__slash { display: inline-flex; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .header-actions .socials,
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .header-actions .btn--call { display: none; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger {
		display: block;
		width: clamp(52px, 9.375vw, 72px);
		height: clamp(48px, 7.2917vw, 56px);
		padding: 0;
		border: 1px solid #cdcdcd;
		border-radius: 100px;
		background: var(--c-white);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger span {
		left: 50%;
		width: 16px;
		height: 1.5px;
		margin-left: -8px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger span:nth-child(1) { top: calc(50% - 7px); }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger span:nth-child(2) { top: 50%; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger span:nth-child(3) { top: calc(50% + 7px); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner > .container { padding-inline: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__card {
		min-height: clamp(760px, 133.3333vw, 1024px);
		padding: clamp(20px, 5.2083vw, 40px);
		border-radius: 0;
		align-items: stretch;
	}

	.hero-inner .hero-inner__bg {
		object-position: right center;
		transform: none;
	}

	/* Кадр из макета: снимок шире экрана и сдвинут влево, поэтому в кадре
	   остаются весы, а колоннада уходит за правый край. */
	.page-buhgalteriya-ip .hero-inner__bg {
		inset: auto;
		left: -84.5%;
		top: 0;
		width: 236.9%;
		height: 100%;
		max-width: none;
		object-fit: fill;
		animation: none;
	}

	.hero-inner .hero-inner__rings {
		display: block;
		left: clamp(-155px, -20.1823vw, -76px);
		width: 280.3385%;
	}

	.hero-inner .hero-inner__card::after {
		background: linear-gradient(100deg, rgba(250, 248, 244, 0.78) 0%, rgba(250, 248, 244, 0.52) 50%, rgba(250, 248, 244, 0.12) 100%);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__content {
		width: 100%;
		max-width: none;
		padding-top: clamp(170px, 27.3438vw, 210px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__title {
		margin-block: clamp(24px, 4.1667vw, 32px);
		line-height: 0.96;
		letter-spacing: -0.02em;
		text-wrap: initial;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__text {
		max-width: 100%;
		margin-bottom: 0;
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__actions { margin-top: auto; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner .btn,
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner .btn {
		padding: clamp(20px, 3.9063vw, 30px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .section-head {
		gap: clamp(24px, 5.2083vw, 40px);
		margin-bottom: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .section-head__title {
		line-height: 0.96;
		letter-spacing: -0.02em;
		text-wrap: initial;
	}

	.page-baza-znaniy .posts--topic .section-head__title .line { display: inline; }
	.page-baza-znaniy .posts--topic .section-head__title .line + .line::before { content: " "; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .eyebrow {
		align-items: center;
		gap: clamp(14px, 2.6042vw, 20px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .eyebrow__marker {
		width: clamp(11px, 1.6927vw, 13px);
		margin-top: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq--stack .faq__grid {
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__list {
		padding-left: 0;
		gap: clamp(28px, 5.2083vw, 40px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__item { padding-bottom: clamp(28px, 5.2083vw, 40px); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__trigger {
		gap: 20px;
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__icon {
		width: clamp(30px, 5.2083vw, 40px);
		height: clamp(30px, 5.2083vw, 40px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .posts__grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .post-card {
		min-height: clamp(250px, 43.099vw, 331px);
		gap: clamp(28px, 5.2083vw, 40px);
		padding: clamp(28px, 6.5104vw, 50px);
		border: 1px solid var(--c-line-hard);
		border-radius: var(--r-md);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .post-card__title { font-size: var(--fs-h3); }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .post-card__text { font-size: var(--fs-lead); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .topic-card {
		min-height: 0;
		gap: clamp(22px, 3.9063vw, 30px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: #bcbdc1;
		border-radius: var(--r-md);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .topic-card__icon {
		width: clamp(48px, 7.8125vw, 60px);
		height: clamp(48px, 7.8125vw, 60px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .topic-card .post-card__title { font-size: var(--fs-h3); }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .topic-card .post-card__text { font-size: var(--fs-lead); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__card {
		min-height: clamp(760px, 133.3333vw, 1024px);
		padding: clamp(60px, 13.0208vw, 100px) clamp(28px, 7.8125vw, 60px) clamp(40px, 7.8125vw, 60px);
		align-items: stretch;
		border-radius: clamp(24px, 4.8177vw, 37px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__bg { object-position: 84% center; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__card::after {
		background: linear-gradient(180deg, rgba(249, 248, 245, 0.97) 0%, rgba(249, 248, 245, 0.82) 46%, rgba(249, 248, 245, 0.08) 100%);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__content {
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: none;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__title {
		font-size: var(--fs-h2);
		line-height: 0.96;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__text {
		max-width: 100%;
		font-size: var(--fs-lead);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .banner__actions { margin-top: auto; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-main > .section:last-child { padding-bottom: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer {
		margin-top: var(--section-y);
		padding: clamp(60px, 10.4167vw, 80px) 0 clamp(28px, 5.2083vw, 40px);
		border-radius: clamp(40px, 10.4167vw, 80px) clamp(40px, 10.4167vw, 80px) 0 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__inner {
		grid-template-columns: 1fr 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__lead { display: contents; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__copy { grid-column: 1 / -1; grid-row: 1; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__title {
		font-size: clamp(28px, 4.6875vw, 36px);
		line-height: 1;
		letter-spacing: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__text {
		font-size: var(--fs-lead);
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__nav {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__nav ul {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: repeat(3, auto);
		grid-auto-flow: column;
		gap: clamp(24px, 5.2083vw, 40px) clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__nav a { font-size: var(--fs-lead); }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__buttons {
		grid-column: 1 / -1;
		grid-row: 3;
		display: grid;
		gap: 20px;
		margin-top: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__buttons .btn {
		display: grid;
		grid-template-columns: auto clamp(8px, 1.3021vw, 10px);
		justify-content: center;
		column-gap: clamp(14px, 2.6042vw, 20px);
		width: 100%;
		padding: clamp(20px, 3.9063vw, 30px);
		font-size: var(--fs-lead);
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__buttons .btn > span {
		line-height: 1.4;
		transform: none;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__buttons .btn__arrow {
		width: clamp(8px, 1.3021vw, 10px);
		height: clamp(13px, 2.0833vw, 16px);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__logo {
		grid-column: 1;
		grid-row: 4;
		align-self: center;
		margin-top: 0;
	}

	/* Footer logo keeps the complete lockup used by the expanded header. */
	.site-footer__logo .logo {
		width: clamp(284px, 49.9674vw, 383.75px);
		height: clamp(52px, 10.1901vw, 78.26px);
	}

	.site-footer__logo .logo__mark {
		width: clamp(59px, 11.6523vw, 89.49px);
		height: clamp(52px, 10.1901vw, 78.26px);
	}

	.site-footer__logo .logo__text {
		flex: none;
		width: clamp(225px, 38.3151vw, 294.26px);
		height: clamp(24px, 4.6875vw, 36px);
		gap: 0;
	}

	.site-footer__logo .logo__name {
		flex: none;
		width: clamp(62px, 11.0677vw, 85px);
		font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
		font-size: clamp(18px, 3.2354vw, 24.8482px);
	}

	.site-footer__logo .logo__slash {
		display: inline-flex;
		flex: none;
		margin-left: clamp(6px, 0.9883vw, 7.59px);
		color: var(--c-ink);
		opacity: 1;
	}

	.site-footer__logo .logo__slash svg {
		width: clamp(6px, 1.026vw, 7.88px);
	}

	.site-footer__logo .logo__tagline {
		display: block;
		flex: none;
		width: clamp(145px, 24.2188vw, 186px);
		margin-left: clamp(6px, 1.0143vw, 7.79px);
		font-size: clamp(12px, 2.3438vw, 18px);
		line-height: 1;
		color: var(--c-ink);
		white-space: nowrap;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__aside {
		grid-column: 2;
		grid-row: 4;
		align-items: flex-start;
		align-self: center;
		gap: 10px;
		text-align: left;
		font-size: var(--fs-lead);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .site-footer__socials { display: none; }

	.page-kak-rabotaem .hero-inner__content {
		padding-top: clamp(250px, 40.8854vw, 314px);
	}

	/* «Как работаем»: нумерованные этапы 688×198. */
	.page-kak-rabotaem .rows__list {
		gap: 20px;
		padding-left: 0;
	}

	.page-kak-rabotaem .rows .eyebrow__text br,
	.page-kak-rabotaem .compare .eyebrow__text br {
		display: inline;
		content: " ";
	}

	.page-kak-rabotaem .rows .eyebrow__text br::after,
	.page-kak-rabotaem .compare .eyebrow__text br::after { content: " "; }

	.page-kak-rabotaem .row-card {
		grid-template-columns: clamp(48px, 7.8125vw, 60px) 1px minmax(0, 1fr);
		gap: clamp(20px, 3.9063vw, 30px);
		min-height: clamp(164px, 25.7813vw, 198px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: var(--c-line-hard);
		border-radius: var(--r-md);
	}

	.page-kak-rabotaem .row-card .num-badge {
		width: clamp(48px, 7.8125vw, 60px);
		height: clamp(48px, 7.8125vw, 60px);
	}

	.page-kak-rabotaem .row-card__rule { height: clamp(96px, 15.625vw, 120px); }

	.page-kak-rabotaem .row-card__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-kak-rabotaem .row-card__text {
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	/* Карточки поддержки 688×394 с иллюстрацией в правом нижнем углу. */
	.page-kak-rabotaem .feature-cards__grid {
		grid-template-columns: 1fr;
		gap: clamp(14px, 4.1667vw, 20px);
	}

	.page-kak-rabotaem .feature-card {
		min-height: clamp(320px, 51.3021vw, 394px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-radius: var(--r-md);
	}

	.page-kak-rabotaem .feature-card .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	.page-kak-rabotaem .feature-card__title {
		max-width: min(448px, 72%);
		margin-block: clamp(40px, 7.8125vw, 60px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-h3);
	}

	.page-kak-rabotaem .feature-card__text {
		max-width: min(448px, 72%);
		font-size: var(--fs-lead);
	}

	.page-kak-rabotaem .feature-card__ill {
		right: 0;
		bottom: 0;
		width: clamp(150px, 26.0417vw, 200px);
		height: clamp(114px, 19.7917vw, 152px);
		max-width: none;
		object-fit: contain;
		object-position: right bottom;
	}

	/* «До / после»: две вертикальные карточки 688×340. */
	.page-kak-rabotaem .compare__grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 0;
	}

	.page-kak-rabotaem .compare__col {
		min-height: clamp(290px, 44.2708vw, 340px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-color: #bcbdc1;
		border-radius: var(--r-md);
	}

	.page-kak-rabotaem .compare__col--after { border: 3px solid var(--c-gold); }

	.page-kak-rabotaem .compare__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-kak-rabotaem .compare .num-list {
		gap: 20px;
		margin-top: clamp(28px, 5.2083vw, 40px);
	}

	.page-kak-rabotaem .compare .num-list__item {
		gap: 16px;
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	.page-kak-rabotaem .compare .num-list__num { font-size: var(--fs-h3); }

	.page-doverie .hero-inner__content {
		padding-top: clamp(225px, 36.9792vw, 284px);
	}

	.page-doverie .feature-cards .eyebrow__text br,
	.page-doverie .rows .eyebrow__text br,
	.page-doverie .compare .eyebrow__text br,
	.page-doverie .feature-card__title br {
		display: inline;
		content: " ";
	}

	.page-doverie .feature-cards .eyebrow__text br::after,
	.page-doverie .rows .eyebrow__text br::after,
	.page-doverie .compare .eyebrow__text br::after,
	.page-doverie .feature-card__title br::after { content: " "; }

	/* «Доверие»: четыре карточки основы работы 688×434. */
	.page-doverie .feature-cards__grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.page-doverie .feature-card {
		min-height: clamp(350px, 56.5104vw, 434px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-radius: var(--r-md);
	}

	.page-doverie .feature-card .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	.page-doverie .feature-card__title {
		max-width: min(448px, 72%);
		margin-block: clamp(40px, 7.8125vw, 60px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-h3);
	}

	.page-doverie .feature-card__text {
		max-width: min(448px, 72%);
		font-size: var(--fs-lead);
	}

	.page-doverie .feature-card__ill,
	.page-doverie .feature-cards__grid > .feature-card:nth-child(3) .feature-card__ill {
		right: 0;
		bottom: 0;
		width: clamp(150px, 26.0417vw, 200px);
		height: clamp(128px, 22.2656vw, 171px);
		max-width: none;
		object-fit: contain;
		object-position: right bottom;
	}

	.page-doverie .feature-cards__grid > .feature-card:nth-child(3) .feature-card__ill {
		height: clamp(114px, 19.7917vw, 152px);
	}

	/* Понятная система взаимодействия: четыре строки из мобильного макета. */
	.page-doverie .rows__list {
		gap: 20px;
		padding-left: 0;
	}

	.page-doverie .row-card {
		grid-template-columns: clamp(48px, 7.8125vw, 60px) 1px minmax(0, 1fr);
		gap: clamp(20px, 3.9063vw, 30px);
		min-height: clamp(156px, 23.7331vw, 182.27px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: var(--c-line-hard);
		border-radius: var(--r-md);
	}

	.page-doverie .row-card:nth-child(2) {
		min-height: clamp(170px, 26.0417vw, 200px);
	}

	.page-doverie .row-card .num-badge {
		width: clamp(48px, 7.8125vw, 60px);
		height: clamp(48px, 7.8125vw, 60px);
	}

	.page-doverie .row-card__rule { height: clamp(96px, 15.625vw, 120px); }

	.page-doverie .row-card__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-doverie .row-card__text {
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	/* Сравнение команды с одним специалистом: две карточки 688×340. */
	.page-doverie .compare__grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 0;
	}

	.page-doverie .compare__col {
		min-height: clamp(290px, 44.2708vw, 340px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-color: #bcbdc1;
		border-radius: var(--r-md);
	}

	.page-doverie .compare__col--after { border: 3px solid var(--c-gold); }

	.page-doverie .compare__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-doverie .compare .num-list {
		gap: 20px;
		margin-top: clamp(28px, 5.2083vw, 40px);
	}

	.page-doverie .compare .num-list__item {
		gap: 16px;
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	.page-doverie .compare .num-list__num { font-size: var(--fs-h3); }

	.page-resheniya .hero-inner__content {
		padding-top: clamp(215px, 34.7656vw, 267px);
	}

	.page-resheniya .bento .eyebrow__text br,
	.page-resheniya .compare .eyebrow__text br,
	.page-resheniya .steps .eyebrow__text br {
		display: inline;
		content: " ";
	}

	.page-resheniya .bento .eyebrow__text br::after,
	.page-resheniya .compare .eyebrow__text br::after,
	.page-resheniya .steps .eyebrow__text br::after { content: " "; }

	/* Шесть финансовых процессов: вертикальная лента карточек 688×307. */
	.page-resheniya .bento__grid,
	.page-resheniya .bento__row {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		gap: 20px;
	}

	.page-resheniya .bento__row { margin-top: 20px; }

	.page-resheniya .bento__grid > .bento-card,
	.page-resheniya .bento__grid > .bento-card:first-child,
	.page-resheniya .bento__row .bento-card {
		--ill-size: clamp(112px, 19.5313vw, 150px);
		--ill-right: 0px;
		--ill-bottom: 0px;
		grid-area: auto;
		grid-column: auto;
		min-height: clamp(255px, 39.974vw, 307px);
		padding: clamp(28px, 5.2083vw, 40px);
		border: 1px solid var(--c-line-hard);
		border-radius: var(--r-md);
	}

	.page-resheniya .bento-card__title {
		max-width: 72%;
		font-size: var(--fs-h3);
	}

	.page-resheniya .bento-card__text {
		max-width: 72%;
		margin-top: 20px;
		font-size: var(--fs-lead);
	}

	.page-resheniya .bento-card .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	.page-resheniya .bento-card .bento-card__ill {
		top: auto;
		right: 0;
		bottom: 0;
		width: var(--ill-size);
		height: var(--ill-size);
		margin-top: 0;
		object-fit: contain;
		object-position: right bottom;
	}

	/* Пять пунктов в каждой карточке требуют высоты 482px и шага 32px. */
	.page-resheniya .compare__grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 0;
	}

	.page-resheniya .compare__col {
		min-height: clamp(400px, 62.7604vw, 482px);
		padding: clamp(40px, 7.8125vw, 60px);
		border-color: #bcbdc1;
		border-radius: var(--r-md);
	}

	.page-resheniya .compare__col--after { border: 3px solid var(--c-gold); }

	.page-resheniya .compare__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-resheniya .compare .num-list {
		gap: clamp(24px, 4.1667vw, 32px);
		margin-top: clamp(28px, 5.2083vw, 40px);
	}

	.page-resheniya .compare .num-list__item {
		gap: 16px;
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	.page-resheniya .compare .num-list__num { font-size: var(--fs-h3); }

	/* Передача бухгалтерии: раскладка шагов 2 + 2 + 1 из макета. */
	.page-resheniya .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	.page-resheniya .steps .step-card {
		aspect-ratio: auto;
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
		box-shadow: none;
	}

	.page-resheniya .steps .step-card:nth-child(3),
	.page-resheniya .steps .step-card:nth-child(4) {
		min-height: clamp(286px, 46.224vw, 355px);
	}

	.page-resheniya .steps .step-card:last-child {
		grid-column: 1 / -1;
	}

	.page-resheniya .steps .step-card__title {
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	.page-resheniya .steps .step-card .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	.page-problemy-biznesa .hero-inner__content {
		padding-top: clamp(215px, 34.7656vw, 267px);
	}

	.page-problemy-biznesa .section-head {
		margin-bottom: clamp(40px, 7.2917vw, 56px);
	}

	.page-problemy-biznesa .rows .eyebrow__text br,
	.page-problemy-biznesa .steps .eyebrow__text br {
		display: inline;
		content: " ";
	}

	.page-problemy-biznesa .rows .eyebrow__text br::after,
	.page-problemy-biznesa .steps .eyebrow__text br::after { content: " "; }

	/* Business situations use the 2-by-3 card grid from the 768px frame. */
	.page-problemy-biznesa .cards-grid__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}

	.page-problemy-biznesa .cards-grid .num-card {
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
	}

	.page-problemy-biznesa .cards-grid .num-card__body { padding: 0; }

	.page-problemy-biznesa .cards-grid .num-card__title {
		min-height: 0;
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	.page-problemy-biznesa .cards-grid .num-card__text {
		margin-top: 20px;
		font-size: clamp(14px, 2.0833vw, 16px);
		color: rgba(27, 24, 31, 0.8);
		opacity: 1;
	}

	.page-problemy-biznesa .cards-grid .num-badge,
	.page-problemy-biznesa .steps .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	/* Let the mobile quote hug its content while keeping the quote mark separate. */
	.page-problemy-biznesa .quote__card {
		grid-template-columns: clamp(36px, 5.7292vw, 44px) minmax(0, 1fr);
		gap: 20px;
		min-height: 0;
		padding: clamp(28px, 5.2083vw, 40px);
		border-radius: 20px;
	}

	.page-problemy-biznesa .quote__mark {
		font-size: clamp(96px, 15.625vw, 120px);
		line-height: 0.72;
	}

	.page-problemy-biznesa .quote__text {
		font-size: var(--fs-h2);
		line-height: 0.96;
	}

	/* Accumulating workload is shown as four full-width numbered rows. */
	.page-problemy-biznesa .rows__list {
		gap: 20px;
		padding-left: 0;
	}

	.page-problemy-biznesa .row-card {
		grid-template-columns: clamp(48px, 7.8125vw, 60px) 1px minmax(0, 1fr);
		gap: clamp(20px, 3.9063vw, 30px);
		min-height: clamp(156px, 23.7331vw, 182.27px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: var(--c-line-hard);
		border-radius: var(--r-md);
	}

	.page-problemy-biznesa .row-card:nth-child(2),
	.page-problemy-biznesa .row-card:nth-child(3) {
		min-height: clamp(190px, 30.7292vw, 236px);
	}

	.page-problemy-biznesa .row-card:nth-child(4) {
		min-height: clamp(170px, 26.0417vw, 200px);
	}

	.page-problemy-biznesa .row-card .num-badge {
		width: clamp(48px, 7.8125vw, 60px);
		height: clamp(48px, 7.8125vw, 60px);
	}

	.page-problemy-biznesa .row-card__rule { height: clamp(96px, 15.6602vw, 120.27px); }

	.page-problemy-biznesa .row-card__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.page-problemy-biznesa .row-card__text {
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	/* Consequences keep a two-column grid with two rows. */
	.page-problemy-biznesa .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	.page-problemy-biznesa .steps .step-card {
		aspect-ratio: auto;
		min-height: clamp(286px, 46.224vw, 355px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
		box-shadow: none;
	}

	.page-problemy-biznesa .steps .step-card__title {
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__content {
		padding-top: clamp(215px, 34.7656vw, 267px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .hero-inner__title br:nth-of-type(n + 2) { display: none; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid .num-card {
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid .num-card__body { padding: 0; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid .num-card__title {
		min-height: 0;
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid .num-card__text {
		margin-top: 20px;
		font-size: clamp(14px, 2.0833vw, 16px);
		color: rgba(27, 24, 31, 0.8);
		opacity: 1;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cards-grid .num-badge,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento .num-badge,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps .num-badge,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-item .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card-section .section-head { margin-bottom: clamp(40px, 7.2917vw, 56px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card--items {
		justify-content: center;
		min-height: clamp(650px, 104.1667vw, 800px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-radius: var(--r-md);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card--items::after {
		background: rgba(253, 251, 250, 0.56);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card--items .media-card__bg { object-position: center; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card--items .media-card__content {
		width: 100%;
		max-width: none;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-card__items { gap: clamp(40px, 8.3333vw, 64px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-item {
		grid-template-columns: clamp(42px, 6.5104vw, 50px) minmax(0, 1fr);
		gap: clamp(24px, 5.2083vw, 40px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-item__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .media-item__text {
		margin-top: clamp(16px, 2.6042vw, 20px);
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__grid,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__row {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		gap: 20px;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__row { margin-top: 20px; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__grid > .bento-card,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__grid > .bento-card:first-child,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento__row .bento-card {
		--ill-size: clamp(150px, 27.9948vw, 215px);
		--ill-gap: 0px;
		grid-area: auto !important;
		grid-column: auto;
		min-height: clamp(255px, 39.974vw, 307px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid var(--c-line-hard);
		border-radius: var(--r-md);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento-card--p3,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento-card--p5 { --ill-size: clamp(120px, 21.4844vw, 165px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento-card__title {
		max-width: 70%;
		font-size: var(--fs-h3);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .bento-card__ill {
		top: auto;
		right: 0;
		bottom: 0;
		width: var(--ill-size);
		height: var(--ill-size);
		margin-top: 0;
		object-position: right bottom;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps--flat .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps--flat .step-card {
		aspect-ratio: auto;
		min-height: clamp(286px, 46.224vw, 355px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
		box-shadow: none;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps--flat .step-card__title,
	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps .step-card__title {
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .logos__list {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: clamp(20px, 5.2083vw, 40px);
		padding-left: 0;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .logo-item { gap: 20px; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .logo-item__box {
		width: clamp(72px, 15.625vw, 120px);
		height: clamp(72px, 15.625vw, 120px);
		border-radius: clamp(16px, 3.9063vw, 30px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .logo-item__label {
		font-size: clamp(14px, 3.125vw, 24px);
		text-align: center;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .pills__list {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .pills--lg .pill {
		width: 100%;
		min-height: clamp(62px, 9.6354vw, 74px);
		padding: clamp(14px, 2.6042vw, 20px);
		font-size: var(--fs-lead);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .pills--lg .pill__label { white-space: normal; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .pills .pill__icon {
		width: clamp(24px, 3.9063vw, 30px);
		height: clamp(24px, 3.9063vw, 30px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps:not(.steps--flat) .steps__panel {
		padding: clamp(48px, 7.8125vw, 60px) 0;
		border-radius: var(--r-md);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps:not(.steps--flat) .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .steps:not(.steps--flat) .step-card {
		aspect-ratio: auto;
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(24px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
		box-shadow: none;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .form-section__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .form-section__grid .section-head { margin-bottom: 0; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .lead-form { gap: clamp(28px, 5.2083vw, 40px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .field {
		min-height: clamp(62px, 9.7656vw, 75px);
		padding-top: var(--fs-lead);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .field__label {
		top: var(--fs-lead);
		font-size: var(--fs-lead);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .field__input {
		padding-bottom: clamp(18px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .lead-form__foot {
		display: grid;
		gap: 20px;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .lead-form__foot .btn {
		width: auto;
		justify-self: start;
		padding: clamp(20px, 3.9063vw, 30px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cases .slider__viewport {
		padding-block: 0;
		margin-block: 0;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cases__track { gap: 20px; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cases__track > .case-card {
		flex: 0 0 clamp(280px, 43.4896vw, 334px);
		min-width: 0;
		min-height: clamp(280px, 43.4896vw, 334px);
		padding: clamp(24px, 3.9063vw, 30px);
		border-color: rgba(24, 25, 31, 0.25);
		border-radius: var(--r-md);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .case-card__row { gap: clamp(8px, 1.3958vw, 10.72px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .case-card__value { font-size: clamp(14px, 2.0833vw, 16px); }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .case-card .tag {
		padding: 7px 17px;
		font-size: 12px;
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .cases .slider__nav { margin-top: 20px; }

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .faq__grid .section-head { margin-bottom: 0; }

	.page-sdacha-otchetnosti .media-card-section .section-head { margin-bottom: 40px; }

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefits > .container {
		padding-inline: clamp(20px, 7.8125vw, 60px);
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefits__grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefits .section-head { margin-bottom: 0; }

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefits__list { gap: 40px; }

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefit-row {
		grid-template-columns: clamp(42px, 6.5104vw, 50px) minmax(0, 1fr);
		/* Только колоночный интервал — иначе складывается с margin-top текста
		   ниже и удваивает отступ под заголовком. */
		column-gap: clamp(24px, 5.2083vw, 40px);
		row-gap: 0;
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefit-row .num-badge {
		width: clamp(42px, 6.5104vw, 50px);
		height: clamp(42px, 6.5104vw, 50px);
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefit-row__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .benefit-row__text {
		margin-top: clamp(24px, 4.1667vw, 32px);
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
		opacity: 1;
	}

	:is(.page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .home, .single-material, .error404) .pills--lg .pill {
		min-height: clamp(60px, 9.1146vw, 70px);
	}

	.page-konsultaciya-buhgaltera .cards-grid .num-card {
		grid-column: auto !important;
		border-color: rgba(24, 25, 31, 0.25);
	}

	.page-konsultaciya-buhgaltera .cards-grid .num-card:last-child {
		grid-column: 1 / -1 !important;
	}
}

/* -------------------------------------------------------------------------
   32. Уважение к настройкам доступности
   ---------------------------------------------------------------------- */

/* Mobile service pages: geometry follows the 768px Figma frames. */
@media (max-width: 768px) {
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card {
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(22px, 3.9063vw, 30px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card:last-child { grid-column: 1 / -1; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card__body { padding: 0; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card__title {
		min-height: 0;
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card__text {
		margin-top: 20px;
		font-size: clamp(14px, 2.0833vw, 16px);
		color: rgba(27, 24, 31, 0.8);
		opacity: 1;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .num-badge {
		width: clamp(44px, 6.5104vw, 50px);
		height: clamp(44px, 6.5104vw, 50px);
		font-size: clamp(15px, 2.3438vw, 18px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card-section > .container { padding-inline: 0; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card {
		min-height: clamp(600px, 93.099vw, 715px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-radius: var(--r-md);
		justify-content: flex-start;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__bg { object-position: center; }

	/* Сюжет снимка (стопка кодексов, колоннада) лежит в правой части кадра —
	   без сдвига в карточку попадает пустая стена. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__bg { object-position: 55% center; }
	body:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card:not(.media-card--list)::after { background: none; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .media-card__bg { object-position: right center; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .media-card__bg {
		object-position: 78% center;
		transform: scale(1.08);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card::after {
		background: linear-gradient(180deg, rgba(245, 240, 232, 0.98) 0%, rgba(245, 240, 232, 0.86) 48%, rgba(245, 240, 232, 0.35) 100%);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__content {
		display: flex;
		flex: 1;
		flex-direction: column;
		width: 100%;
		max-width: none;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__title {
		margin-block: clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-h2);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chips {
		display: grid;
		gap: 12px;
		width: 100%;
		margin-top: auto;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chip {
		justify-content: center;
		width: 100%;
		min-height: clamp(72px, 13.0208vw, 100px);
		padding: 12px 32px 12px 20px;
		border-width: 2px;
		font-size: clamp(22px, 4.6875vw, 36px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chip__icon {
		width: clamp(34px, 8.3333vw, 64px);
		height: clamp(28px, 4.9479vw, 38px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chip__icon svg { max-width: 100%; height: 100%; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__row {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__row { margin-top: 20px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid > .bento-card:first-child,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__row .bento-card {
		grid-column: 1;
		min-height: clamp(245px, 39.974vw, 307px);
		padding: clamp(28px, 5.2083vw, 40px);
		border: 1px solid #bcbdc1;
		border-radius: var(--r-md);
		background: var(--c-beige);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid > .bento-card:first-child {
		min-height: clamp(430px, 74.2188vw, 570px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card__title {
		max-width: 70%;
		font-size: clamp(24px, 4.6875vw, 36px);
		line-height: 1;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card {
		--ill-size: clamp(120px, 26.0417vw, 200px);
		--ill-gap: clamp(16px, 3.9063vw, 30px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid > .bento-card:first-child { --ill-size: clamp(210px, 42.8385vw, 329px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list {
		min-height: clamp(850px, 133.3333vw, 1024px);
		padding: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list::after {
		background: linear-gradient(180deg, rgba(245, 240, 232, 0.98) 0%, rgba(245, 240, 232, 0.8) 50%, rgba(245, 240, 232, 0.18) 100%);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .num-list {
		display: grid;
		gap: clamp(24px, 3.9063vw, 30px);
		margin-top: auto;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .num-list__item {
		grid-template-columns: clamp(34px, 5.8594vw, 45px) minmax(0, 1fr);
		gap: 16px;
		font-size: clamp(22px, 4.6875vw, 36px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefits > .container { padding-inline: clamp(30px, 7.8125vw, 60px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefits__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefits .section-head { margin-bottom: 0; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefits__list { gap: clamp(28px, 5.2083vw, 40px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefit-row {
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: clamp(24px, 5.2083vw, 40px);
		row-gap: 0;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefit-row__title {
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .benefit-row__text {
		margin-top: 12px;
		font-size: clamp(14px, 2.0833vw, 16px);
		color: rgba(27, 24, 31, 0.8);
		opacity: 1;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps__panel {
		padding-block: clamp(60px, 10.4167vw, 80px);
		border-radius: var(--r-md);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps .step-card {
		aspect-ratio: 1;
		padding: clamp(22px, 3.9063vw, 30px);
		border-radius: var(--r-md);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps .step-card:last-child {
		grid-column: 1 / -1;
		aspect-ratio: auto;
		min-height: clamp(245px, 43.4896vw, 334px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps .step-card__title {
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .form-section__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .form-section .section-head { margin-bottom: 0; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .lead-form { gap: clamp(28px, 5.2083vw, 40px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .field__input,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .field__label { font-size: var(--fs-lead); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .field__input { padding-bottom: clamp(28px, 5.2083vw, 40px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .lead-form__foot {
		flex-direction: row;
		align-items: center;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cases .slider__viewport {
		padding-bottom: 0;
		overflow-x: auto;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cases__track { gap: 20px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cases__track > .case-card {
		flex: 0 0 clamp(270px, 43.4896vw, 334px);
		min-width: 0;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .case-card {
		width: auto;
		min-height: clamp(270px, 43.4896vw, 334px);
		gap: clamp(20px, 3.9063vw, 30px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: #bcbdc1;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .case-card__row { gap: clamp(8px, 1.3958vw, 11px); }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .case-card__value { font-size: clamp(14px, 2.0833vw, 16px); }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .tag { font-size: clamp(10px, 1.5625vw, 12px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .slider__nav { margin-top: 20px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .faq__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .faq__grid .section-head { margin-bottom: 0; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .faq__list { padding-left: 0; }

	.home .hero-home {
		aspect-ratio: auto;
		height: clamp(760px, 133.3333vw, 1024px);
		padding: 0;
		border-radius: 0;
		align-items: stretch;
	}

	.home .hero-home__bg::after { background: transparent; }
	.home .hero-home__picture img {
		position: absolute;
		left: -98.1771%;
		top: -3.9063%;
		width: 249.8698%;
		height: 105.4688%;
		max-width: none;
		object-position: center;
	}

	.home .hero-home__mobile-light,
	.home .hero-home__mobile-rings {
		position: absolute;
		display: block;
		max-width: none;
		pointer-events: none;
	}

	.home .hero-home__mobile-light {
		left: -118.3594%;
		top: -54.8828%;
		z-index: 1;
		width: 231.224%;
		height: 173.418%;
	}

	.home .hero-home__mobile-rings {
		left: -51.4323%;
		top: -3.9063%;
		z-index: 2;
		width: 294.2708%;
		height: 105.4688%;
	}

	.home .hero-home__inner {
		height: 100%;
		padding: clamp(20px, 5.2083vw, 40px);
	}

	.home .hero-home__content {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
		max-width: none;
		padding-top: clamp(220px, 34.5052vw, 265px);
	}

	.home .hero-home__eyebrow {
		margin-bottom: clamp(24px, 4.1667vw, 32px);
		font-size: clamp(16px, 2.6042vw, 20px);
	}

	.home .hero-home__title {
		margin-bottom: clamp(24px, 4.1667vw, 32px);
		font-size: var(--fs-h1);
		line-height: 0.96;
		letter-spacing: -0.02em;
	}

	.home .hero-home__text {
		max-width: 497px;
		margin-bottom: 0;
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	.home .hero-home__actions { margin-top: auto; }

	.home .hero-home .btn {
		padding: clamp(20px, 3.9063vw, 30px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
	}

	.home .num-badge {
		width: clamp(38px, 6.5104vw, 50px);
		height: clamp(38px, 6.5104vw, 50px);
		font-size: clamp(14px, 2.3438vw, 18px);
	}

	.home .cards-grid__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}

	.home .cards-grid .num-card {
		min-height: clamp(270px, 43.4896vw, 334px);
		padding: clamp(20px, 3.9063vw, 30px);
		border: 1px solid rgba(24, 25, 31, 0.25);
		border-radius: var(--r-md);
	}

	.home .cards-grid .num-card__body { padding: 0; }

	.home .cards-grid .num-card__title {
		min-height: 0;
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	/* Homepage system banner follows the compact 688x797 mobile frame. */
	.home .banner__card {
		aspect-ratio: 688 / 797;
		min-height: 0;
		padding: clamp(20px, 5.2083vw, 40px);
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
	}

	.home .banner__bg { object-position: 62% center; }

	.home .banner__content {
		gap: clamp(24px, 5.2083vw, 40px);
	}

	.home .banner__title { margin-bottom: 0; }

	.home .slider-cards .section-head {
		gap: 20px;
		margin-bottom: clamp(40px, 7.2917vw, 56px);
	}

	/* scroll-snap выравнивает первую плитку по краю рамки прокрутки, из-за чего
	   лента стартовала под левым полем — компенсируем scroll-padding. */
	.home .slider-cards .slider__viewport {
		padding-inline: var(--pad-x);
		scroll-padding-inline: var(--pad-x);
	}
	.home .slider-cards .slider__track { gap: 20px; }

	.home .slider-cards .media-tile {
		--tile-w: clamp(260px, 42.4805vw, 326.25px);
		width: var(--tile-w);
		/* Гасим height: 96vw из блока 720px — иначе плитка тянется по высоте экрана. */
		height: auto;
		aspect-ratio: 326.25 / 450;
		padding: clamp(18px, 2.9297vw, 22.5px);
		gap: clamp(6px, 0.9766vw, 7.5px);
		justify-content: space-between;
		align-items: flex-start;
		border: 0;
		border-radius: clamp(24px, 3.9063vw, 30px);
	}

	.home .slider-cards .media-tile__title {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: none;
		width: max-content;
		max-width: 100%;
		min-height: clamp(80px, 11.7188vw, 90px);
		padding: clamp(18px, 2.9297vw, 22.5px);
		font-size: clamp(22px, 3.5156vw, 27px);
		line-height: 1;
	}

	.home .slider-cards .media-tile .num-badge {
		width: clamp(32px, 4.8828vw, 37.5px);
		height: clamp(32px, 4.8828vw, 37.5px);
		font-size: clamp(12px, 1.7578vw, 13.5px);
	}

	/* The first four illustrations use the dedicated 326.25x450 mobile crop. */
	.home .slider-cards .media-tile:nth-child(1) .media-tile__layer:nth-of-type(1) {
		left: -16.5517% !important;
		top: 18.8333% !important;
		width: 150.8046% !important;
		height: 109.3333% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(1) {
		left: -4.5977% !important;
		top: 4.3333% !important;
		width: 88.8989% !important;
		height: 96.6778% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(2) {
		left: 54.7126% !important;
		top: 20% !important;
		width: 35.8621% !important;
		height: 23.6667% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(3) {
		left: 0.2299% !important;
		top: 69.5% !important;
		width: 58.2222% !important;
		height: 38.4222% !important;
	}

	.home .slider-cards .media-tile:nth-child(3) .media-tile__layer:nth-of-type(1) {
		left: 6.8966% !important;
		top: 25% !important;
		width: 108.2759% !important;
		height: 99.8333% !important;
	}

	.home .slider-cards .media-tile:nth-child(4) .media-tile__layer:nth-of-type(1) {
		left: -4.3678% !important;
		top: 20% !important;
		width: 149.4253% !important;
		height: 108.3333% !important;
	}

	.home .pills__list {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
		padding-bottom: 0;
	}

	.home .pills .eyebrow { gap: clamp(20px, 3.9063vw, 30px); }

	.home .pill,
	.home .pill:nth-child(even) {
		justify-content: flex-start;
		width: 100%;
		min-height: clamp(54px, 9.1146vw, 70px);
		gap: 10px;
		padding: clamp(14px, 2.6042vw, 20px);
		border-width: 2px;
		border-color: rgba(24, 25, 31, 0.25);
		font-size: clamp(20px, 3.5156vw, 27px);
		line-height: 1.2;
		transform: none;
	}

	.home .pill__icon {
		width: 30px;
		height: 30px;
	}

	.home .pill:nth-child(1) .pill__icon { width: 35px; height: 29px; }
	.home .pill:nth-child(4) .pill__icon { width: 35px; height: 21px; }
	.home .pill:nth-child(5) .pill__icon { width: 40px; height: 24px; }
	.home .pill:nth-child(6) .pill__icon { width: 25px; height: 28px; }

	.home .pill__label {
		flex: 1 1 auto;
		line-height: 1.2;
		transform: none;
	}

	.home .trust .section-head {
		gap: 20px;
		margin-bottom: clamp(40px, 7.2917vw, 56px);
	}

	.home .trust .eyebrow { gap: clamp(20px, 5.2083vw, 40px); }

	.home .trust .eyebrow__marker {
		width: clamp(13px, 2.25vw, 17.28px);
		height: 13px;
	}

	.home .trust__grid { display: block; }

	.home .trust__media {
		display: none;
	}

	.home .trust__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(28px, 5.2083vw, 40px);
	}

	.home .trust__item { gap: clamp(28px, 5.2083vw, 40px); }
	.home .trust__item:first-child { align-self: center; }

	.home .trust .num-badge {
		width: clamp(44px, 6.5104vw, 50px);
		height: clamp(44px, 6.5104vw, 50px);
		font-size: clamp(15px, 2.3438vw, 18px);
	}

	.home .trust__title {
		font-size: var(--fs-h3);
		line-height: 1;
	}

	.home .trust__text {
		font-size: var(--fs-lead);
		color: var(--c-ink);
		opacity: 0.5;
	}

	.home .steps__panel {
		padding-block: clamp(60px, 10.4167vw, 80px);
		border-radius: var(--r-md);
	}

	.home .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	.home .steps .step-card {
		aspect-ratio: 1;
		padding: clamp(20px, 3.9063vw, 30px);
		border-radius: var(--r-md);
	}

	.home .steps .step-card__title {
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	.home .form-section__grid,
	.home .faq__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	.home .form-section .section-head,
	.home .faq__grid .section-head { margin-bottom: 0; }

	.home .lead-form { gap: clamp(28px, 5.2083vw, 40px); }

	.home .form-section .section-head { gap: clamp(28px, 5.2083vw, 40px); }

	.home .field {
		min-height: clamp(62px, 9.7656vw, 75px);
		padding-top: 0;
	}

	.home .field__label {
		top: 0;
		font-size: var(--fs-lead);
		line-height: 1.4;
	}

	.home .field__input {
		height: clamp(62px, 9.7656vw, 75px);
		padding: 0 0 clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
		line-height: 1.4;
	}

	.home .field:focus-within .field__label,
	.home .field.has-value .field__label {
		transform: translateY(calc(var(--fs-lead) * -1)) scale(0.55);
	}

	.home .field__req { display: none; }

	.home .form-section .lead-form__foot .btn {
		width: min(292px, 100%);
		min-height: clamp(76px, 12.2396vw, 94px);
	}

	/* Кнопка и строка про политику стоят друг под другом — как на внутренних
	   страницах, где подвал формы это grid с шагом 20. Раньше здесь была
	   строка: в подвале оставалась одна кнопка, и направление не значило. */
	.home .lead-form__foot { flex-direction: column; align-items: stretch; }

	.home .cases .slider__viewport {
		padding-bottom: 0;
		overflow-x: auto;
	}

	.home .cases__track { gap: 20px; }

	.home .cases__track > .case-card {
		flex: 0 0 clamp(270px, 43.4896vw, 334px);
		min-width: 0;
	}

	.home .case-card {
		width: auto;
		min-height: clamp(270px, 43.4896vw, 334px);
		gap: clamp(20px, 3.9063vw, 30px);
		padding: clamp(22px, 3.9063vw, 30px);
		border-color: rgba(24, 25, 31, 0.25);
	}

	.home .case-card__row { gap: clamp(8px, 1.3958vw, 11px); }
	.home .case-card__value { font-size: clamp(14px, 2.0833vw, 16px); }
	.home .tag { font-size: clamp(10px, 1.5625vw, 12px); }
	.home .cases .slider__nav {
		justify-content: space-between;
		width: 100%;
		height: clamp(48px, 7.2917vw, 56px);
		padding-right: 16px;
		margin-top: 20px;
	}

	.home .cases .slider__btn {
		width: clamp(48px, 7.2917vw, 56px);
		height: clamp(48px, 7.2917vw, 56px);
		padding: 1px 6px;
		border-color: #38211b;
		border-radius: 28px;
		color: #38211b;
	}

	.home .cases .slider__btn svg {
		width: 20px;
		height: 20px;
	}

	.home .faq__list {
		padding-left: 0;
		gap: clamp(28px, 5.2083vw, 40px);
	}

	.home .faq__item { padding-bottom: clamp(28px, 5.2083vw, 40px); }

	.home .faq__trigger {
		gap: 20px;
		font-size: clamp(21px, 3.5156vw, 27px);
		line-height: 1.2;
	}

	.home .faq__icon {
		width: clamp(30px, 5.2083vw, 40px);
		height: clamp(30px, 5.2083vw, 40px);
	}

	.page-uslugi .hero-inner__bg { object-position: 76% center; }

	.page-uslugi .hero-inner__content {
		padding-top: clamp(200px, 30.599vw, 235px);
	}

	.page-uslugi .hero-inner__title br:nth-of-type(n + 2) { display: block; }

	.page-uslugi .hero-inner__text { max-width: min(497px, 100%); }

	.page-uslugi .num-badge {
		width: clamp(44px, 6.5104vw, 50px);
		height: clamp(44px, 6.5104vw, 50px);
		font-size: clamp(15px, 2.3438vw, 18px);
	}

	.page-uslugi .services-list__grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.page-uslugi .services-list .eyebrow__text {
		max-width: clamp(150px, 31.7109vw, 243.53px);
	}

	.page-uslugi .service-card,
	.page-uslugi .service-card--wide {
		grid-column: 1;
		min-height: clamp(360px, 58.8542vw, 452px);
		padding: clamp(28px, 5.2083vw, 40px);
		gap: 0;
		border-color: #cdcdcd;
		border-radius: var(--r-md);
	}

	.page-uslugi .service-card:nth-child(4) { min-height: clamp(330px, 50.5208vw, 388px); }
	.page-uslugi .service-card:nth-child(5) { min-height: clamp(390px, 61.7188vw, 474px); }

	.page-uslugi .service-card__title {
		margin-block: clamp(28px, 5.2083vw, 40px);
		font-size: clamp(24px, 4.6875vw, 36px);
		line-height: 1;
	}

	.page-uslugi .service-card__text {
		max-width: min(61%, 415px);
		font-size: var(--fs-lead);
		color: rgba(27, 24, 31, 0.8);
	}

	.page-uslugi .service-card__ill {
		width: clamp(190px, 33.3333vw, 256px);
		height: clamp(232px, 40.625vw, 312px);
	}

	.page-uslugi .service-card:nth-child(4) .service-card__ill {
		width: clamp(180px, 32.5521vw, 250px);
		height: clamp(180px, 32.5521vw, 250px);
	}

	.page-uslugi .service-card:nth-child(5) .service-card__ill {
		width: clamp(220px, 38.2813vw, 294px);
		height: clamp(120px, 20.8333vw, 160px);
		object-fit: contain;
	}

	.page-uslugi .service-card .chips {
		gap: 12px 8px;
		padding-top: clamp(28px, 5.2083vw, 40px);
	}

	.page-uslugi .service-card:not(:last-child) .chips {
		flex-wrap: nowrap;
	}

	.page-uslugi .service-card .chip {
		padding: clamp(14px, 2.6042vw, 20px) clamp(20px, 4.1667vw, 32px);
		font-size: var(--fs-lead);
	}

	.page-uslugi .service-card:not(:last-child) .chip {
		padding-inline: clamp(7px, calc(6.23vw - 15.86px), 32px);
		font-size: clamp(11px, 3.125vw, 24px);
	}

	.page-uslugi .benefits > .container { padding-inline: var(--pad-x); }

	.page-uslugi .benefits__grid {
		grid-template-columns: 1fr;
		gap: clamp(40px, 7.8125vw, 60px);
	}

	.page-uslugi .benefits .section-head { margin-bottom: 0; }
	.page-uslugi .benefits__list { gap: clamp(28px, 5.2083vw, 40px); }

	.page-uslugi .benefit-row {
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: clamp(24px, 5.2083vw, 40px);
		row-gap: 0;
	}

	.page-uslugi .benefit-row__title {
		font-size: clamp(24px, 4.6875vw, 36px);
		line-height: 1;
	}

	.page-uslugi .benefit-row__text {
		margin-top: clamp(22px, 4.1667vw, 32px);
		font-size: var(--fs-lead);
	}

	.page-uslugi .two-choice__grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 0;
	}

	.page-uslugi .choice-card {
		min-height: clamp(380px, 57.2917vw, 440px);
		padding: clamp(28px, 5.2083vw, 40px);
		border-color: #bcbdc1;
		border-radius: var(--r-md);
	}

	.page-uslugi .choice-card.is-active { border-width: 3px; }

	.page-uslugi .choice-card__title {
		font-size: clamp(24px, 4.6875vw, 36px);
		line-height: 1;
		letter-spacing: 0;
	}

	.page-uslugi .choice-card .num-list {
		gap: 20px;
		margin-block: clamp(28px, 5.2083vw, 40px) clamp(40px, 7.8125vw, 60px);
	}

	.page-uslugi .choice-card .num-list__item {
		gap: 16px;
		font-size: var(--fs-lead);
	}

	.page-uslugi .choice-card .num-list__num { font-size: clamp(24px, 4.6875vw, 36px); }

	.page-uslugi .choice-card .btn {
		padding: clamp(20px, 3.9063vw, 30px) clamp(28px, 5.2083vw, 40px);
		font-size: var(--fs-lead);
	}

	.banner__card--cta {
		background: #fdfcfb;
		border: 0;
	}

	/* Keep the mobile artwork proportional and the CTA content above it. */
	.banner__card--cta .banner__content {
		position: relative;
		z-index: 1;
		justify-content: space-between;
	}

	.banner__card--cta::after {
		background: transparent;
	}

	.banner__card--cta::before {
		content: "";
		position: absolute;
		left: -202.17%;
		top: 24.1523%;
		z-index: -1;
		width: 326.7776%;
		height: auto;
		aspect-ratio: 2248.228 / 3244.463;
		background: url("../img/mobile-cta-rings.svg") center / 164.18% 144.47% no-repeat;
		transform: matrix(0, 1, 1, 0, 0, 0);
		transform-origin: 0 0;
		pointer-events: none;
	}

	.banner__card--cta .banner__bg {
		inset: auto;
		left: -171%;
		top: 45.7%;
		width: 285%;
		height: auto;
		max-width: none;
		object-fit: contain;
		object-position: center;
		clip-path: inset(2px 0 0);
		transition: none;
	}

	.banner__card--cta:hover .banner__bg { transform: none; }

	.banner__card--cta .banner__title {
		margin-bottom: clamp(28px, 5.2083vw, 40px);
		text-wrap: wrap;
	}

	.banner__card--cta .banner__title .line { display: inline; }
	.banner__card--cta .banner__title .line + .line::before { content: " "; }
	.banner__card--cta .banner__text { text-wrap: wrap; }

	.banner__card--cta .btn {
		width: min(292px, 100%);
		min-height: clamp(74px, 12.2396vw, 94px);
		gap: clamp(12px, 2.6042vw, 20px);
		padding: clamp(20px, 3.9063vw, 30px) clamp(28px, 5.2083vw, 40px);
	}

	.banner__card--cta .btn > span {
		line-height: 1.4;
		transform: none;
	}

	.banner__card--cta .btn__arrow {
		width: clamp(8px, 1.3021vw, 10px);
		height: clamp(13px, 2.0833vw, 16px);
	}

	.page-buhgalteriya-ooo .media-card-section--audience > .container,
	.page-buhgalteriya-ooo .media-card-section--complexity > .container {
		padding-inline: var(--pad-x);
	}

	.page-buhgalteriya-ooo .media-card-section--audience .section-head {
		margin-bottom: clamp(40px, 7.8125vw, 60px);
	}

	.page-buhgalteriya-ooo .media-card-section--audience .section-head__text {
		font-size: var(--fs-lead);
		color: rgba(24, 25, 31, 0.5);
	}

	.page-buhgalteriya-ooo .bento__grid > .bento-card:first-child {
		min-height: clamp(245px, 39.974vw, 307px);
		--ill-size: clamp(110px, 19.5313vw, 150px);
	}

	.page-buhgalteriya-ooo .bento-card { --ill-size: clamp(110px, 19.5313vw, 150px); }

	.page-buhgalteriya-ooo .media-card-section--complexity .media-card--list {
		min-height: clamp(850px, 133.3333vw, 1024px);
		padding: clamp(28px, 5.2083vw, 40px);
	}

	.page-buhgalteriya-ooo .media-card-section--complexity .media-card--list .num-list {
		gap: clamp(36px, 7.8125vw, 60px);
	}

	.page-buhgalteriya-ooo .benefits > .container { padding-inline: var(--pad-x); }
}

@media (max-width: 520px) {
	/* Сетки задач и шагов остаются двухколоночными — как в мобильном макете 480. */
	.home .trust__list { grid-template-columns: 1fr; }

	.home .lead-form__foot {
		flex-direction: column;
		align-items: stretch;
	}

	.page-uslugi .service-card__text { max-width: 76%; }
	.page-uslugi .service-card:last-child .chip { font-size: clamp(14px, 4.6vw, 20px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card:last-child:nth-child(odd) { grid-column: 1 / -1; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .steps .step-card:last-child:nth-child(odd) { grid-column: 1 / -1; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .lead-form__foot {
		flex-direction: column;
		align-items: stretch;
	}
}

/* -------------------------------------------------------------------------
   Главная: мобильный фрейм Figma 480px.
   Планшетную геометрию задаёт блок max-width: 768px выше — здесь только то,
   что в мобильном макете отличается: поля 16, кегли 40/32/24/16/14,
   радиус карточек 30 и отдельные раскладки секций.
   ---------------------------------------------------------------------- */
@media (max-width: 520px) {
	.home {
		--pad-x: 16px;
		--section-y: clamp(44px, 12.5vw, 60px);
		--fs-h1: clamp(34px, 8.3333vw, 40px);
		--fs-h2: clamp(27px, 6.6667vw, 32px);
		--fs-h3: 24px;
		--fs-lead: 16px;
		--fs-eyebrow: 14px;
		--r-md: 30px;
	}

	/* Шапка на первом экране: логотип и бургер крупнее планшетных. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header:not(.is-stuck) { padding-block: clamp(15px, 4.1667vw, 20px); }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header__inner { min-height: clamp(53px, 14.7917vw, 71px); }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header:not(.is-stuck) .logo__mark {
		width: clamp(61px, 16.8602vw, 80.93px);
		height: clamp(53px, 14.7917vw, 71px);
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header:not(.is-stuck) .logo__name { font-size: clamp(17px, 4.689vw, 22.51px); }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header:not(.is-stuck) .logo__tagline { font-size: clamp(10.5px, 2.9167vw, 14px); }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .burger {
		width: clamp(54px, 15vw, 72px);
		height: clamp(42px, 11.6667vw, 56px);
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .burger span {
		width: 18px;
		margin-left: -9px;
	}

	/* «Глазок»: треугольник 13px, отбивка 16, подпись 14. */
	.home .eyebrow,
	.home .pills .eyebrow,
	.home .trust .eyebrow { gap: 16px; }

	.home .eyebrow__marker,
	.home .trust .eyebrow__marker { width: 13px; }

	.home .section-head { gap: 20px; margin-bottom: 40px; }
	.home .trust .section-head,
	.home .slider-cards .section-head { margin-bottom: 40px; }

	/* Единственная секция с крупной подписью — «Решение». */
	.home .banner .eyebrow { gap: 20px; }
	.home .banner .eyebrow__text { font-size: 16px; }

	/* Первый экран 480×760: поля 24, подпись 20, кнопка на всю ширину. */
	.home .hero-home__inner { padding: 20px 24px 40px; }
	.home .hero-home__content { padding-top: clamp(150px, 41.4583vw, 199px); }

	.home .hero-home__eyebrow {
		margin-bottom: 32px;
		font-size: clamp(17px, 4.1667vw, 20px);
	}

	.home .hero-home__title { margin-bottom: 32px; }

	.home .hero-home .btn {
		justify-content: center;
		width: 100%;
		gap: 12px;
		padding: 20px 32px;
	}

	.home .hero-home .btn__arrow { width: 8px; height: 12.8px; }

	/* Проблемы бизнеса: шесть карточек 216×216 в два столбца. */
	.home .cards-grid__list { gap: 16px; }

	.home .cards-grid .num-card {
		aspect-ratio: 1;
		min-height: 0;
		gap: 16px;
		padding: 20px;
	}

	.home .cards-grid .num-card__title {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.home .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	/* «Решение»: карточка 448×598 с полями 40. */
	.home .banner__card {
		aspect-ratio: 448 / 598;
		padding: 40px;
		border-radius: 37px;
	}

	/* Карточка на мобильном уже планшетной, поэтому при том же object-position
	   статуя уходит из кадра — приближаем кроп к её фигуре. */
	.home .banner__bg { object-position: 70% center; }

	.home .banner__content { gap: 40px; }
	.home .banner__text { color: rgba(27, 24, 31, 0.5); }

	/* Лента услуг: плитки 198.57×237 без внутренней рамки заголовка. */
	.home .slider-cards .slider__track { gap: 16px; }

	.home .slider-cards .media-tile {
		--tile-w: clamp(165px, 41.3681vw, 198.57px);
		height: auto;
		aspect-ratio: 198.57 / 237;
		gap: 16px;
		padding: clamp(15px, 3.6394vw, 17.47px);
		border-radius: 30px;
	}

	.home .slider-cards .media-tile__title {
		display: block;
		min-height: 0;
		padding: 0;
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.home .slider-cards .media-tile .num-badge {
		width: clamp(24px, 6.0657vw, 29.12px);
		height: clamp(24px, 6.0657vw, 29.12px);
		font-size: clamp(9px, 2.1838vw, 10.48px);
	}

	/* Кадрирование иллюстраций пересчитано под плитку 198.57×237. */
	.home .slider-cards .media-tile:nth-child(1) .media-tile__layer:nth-of-type(1) {
		left: 3.2257% !important;
		top: 21.6215% !important;
		width: 117.3025% !important;
		height: 98.2803% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(1) {
		left: 2.3458% !important;
		top: 21.499% !important;
		width: 97.7482% !important;
		height: 104.2641% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(2) {
		left: 78.6013% !important;
		top: 21.6216% !important;
		width: 33.6959% !important;
		height: 29.0316% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(3) {
		left: 2.3458% !important;
		top: 83.7498% !important;
		width: 55.2775% !important;
		height: 44.3835% !important;
	}

	.home .slider-cards .media-tile:nth-child(3) .media-tile__layer:nth-of-type(1) {
		left: 17.1109% !important;
		top: 26.2055% !important;
		width: 88.0905% !important;
		height: 93.8574% !important;
	}

	.home .slider-cards .media-tile:nth-child(4) .media-tile__layer:nth-of-type(1) {
		left: -5.5719% !important;
		top: 24.0785% !important;
		width: 117.3025% !important;
		height: 98.2803% !important;
	}

	/* Показатели: таблетки на всю ширину, иконки 24/30. */
	.home .pills__list { gap: 16px; }

	.home .pill,
	.home .pill:nth-child(even) {
		min-height: 54px;
		padding: 16px;
		border-color: rgba(17, 24, 39, 0.3);
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.home .pill__label { line-height: 1.4; }

	.home .pills .pill__icon { width: 24px; height: 24px; }
	.home .pills .pill:nth-child(1) .pill__icon { width: 24px; height: 20px; }
	.home .pills .pill:nth-child(4) .pill__icon { width: 30px; height: 18px; }
	.home .pills .pill:nth-child(5) .pill__icon { width: 30px; height: 18px; }
	.home .pills .pill:nth-child(6) .pill__icon { width: 24px; height: 26px; }

	/* Доверие: четыре тезиса в одну колонку. */
	.home .trust__list { gap: 40px; }
	.home .trust__item { gap: 16px; }
	.home .trust__item:first-child { align-self: start; }
	.home .trust__title { margin-top: 4px; }

	.home .trust .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	/* Как начинается работа: шесть карточек 216×216.
	   Селекторы повторяют форму общего мобильного блока — иначе он перебивает. */
	.home .steps:not(.steps--flat) .steps__panel { padding: 30px 0; }
	.home .steps:not(.steps--flat) .steps__list { gap: 16px; }

	.home .steps:not(.steps--flat) .step-card {
		aspect-ratio: 1;
		min-height: 0;
		padding: 20px;
		border-radius: 30px;
	}

	.home .steps .step-card__title {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	/* Форма: поля 39px, кнопка во всю ширину. */
	.home .form-section__grid,
	.home .faq__grid { gap: 40px; }

	.home .form-section .section-head { gap: 20px; }
	.home .lead-form { gap: 16px; }

	.home .field { min-height: 39px; }

	.home .field__label,
	.home .field__input { font-size: 16px; }

	.home .field__input {
		height: 39px;
		padding-bottom: 16px;
	}

	.home .form-section .lead-form__foot .btn {
		width: 100%;
		min-height: 94px;
		gap: 20px;
		padding: 30px 40px;
		font-size: 24px;
	}

	.home .form-section .lead-form__foot .btn__arrow { width: 10px; height: 16px; }

	/* Кейсы: карточки 300×300. */
	.home .cases__track { gap: 16px; }
	.home .cases__track > .case-card { flex: 0 0 clamp(240px, 62.5vw, 300px); }

	.home .cases__track > .case-card {
		min-height: clamp(240px, 62.5vw, 300px);
		padding: 20px;
		border-radius: 30px;
	}

	.home .case-card { gap: 16px; }

	.home .case-card__row { gap: 7px; }
	.home .case-card__value { font-size: 14px; }
	.home .case-card .tag { padding: 4px 11px 5px; font-size: 12px; }

	/* Частые вопросы: заголовок 24px, значок 40px, ответ 14px. */
	.home .faq__list { gap: 16px; }
	.home .faq__item { padding-bottom: 16px; }

	.home .faq__trigger {
		font-size: 24px;
		line-height: 1.4;
	}

	.home .faq__icon { width: 40px; height: 40px; }
	.home .faq__a { font-size: 14px; }
	.home .faq__a p { padding-top: 8px; }

	/* Подвал: одна колонка, поля 24, шаг блоков 60. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer {
		padding: 80px 0 24px;
		border-radius: 80px 80px 0 0;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__inner {
		grid-template-columns: 1fr;
		gap: 60px;
		padding-inline: 24px;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__copy,
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav,
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons,
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__aside,
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo { grid-column: 1; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__copy   { grid-row: 1; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav    { grid-row: 2; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons { grid-row: 3; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__aside  { grid-row: 4; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo   { grid-row: 5; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__title { font-size: 32px; line-height: 1; }
	/* В мобильном макете заголовок подвала переносится сам. Ручной перенос
	   гасим не display: none — иначе слова склеиваются, — а подменой на пробел. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__title br { display: none; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__text { margin-top: 20px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav ul {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-auto-flow: row;
		gap: 32px;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav a { font-size: 24px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons { gap: 20px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons .btn {
		grid-template-columns: auto 10px;
		column-gap: 20px;
		padding: 30px;
		font-size: 24px;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons .btn__arrow { width: 10px; height: 16px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__aside {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 20px;
		font-size: clamp(17px, 5vw, 24px);
	}

	/* Телефон и почта в одну строку помещаются не всегда: на 375px это
	   примерно 170px + 225px против ~257px свободных. Оборачиваем их в свой
	   флекс с переносом — пока влезают, стоят рядом; как только нет, почта
	   уходит под телефон, а не сжимает соседей и не лезет за край. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__contacts {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
		gap: 4px 20px;
	}

	/* Лого подвала в мобильном макете крупнее планшетного. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo {
		width: auto;
		max-width: 100%;
		height: clamp(66px, 18.3447vw, 88.05px);
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__mark {
		width: clamp(76px, 20.9869vw, 100.74px);
		height: clamp(66px, 18.3447vw, 88.05px);
	}

	/* Ширины из планшетного блока не дают лакапу сжаться — отдаём его контенту. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__text {
		flex: 0 1 auto;
		width: auto;
		height: auto;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__name {
		width: auto;
		font-size: clamp(19px, 5.8229vw, 27.95px);
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__slash { margin-left: clamp(6px, 1.7792vw, 8.54px); }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__slash svg { width: clamp(6px, 1.8458vw, 8.86px); }

	/* Подпись в подвале, как в макете, идёт в две строки — nowrap из планшетного
	   блока распирал лакап за поля на узких телефонах. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__tagline {
		width: auto;
		margin-left: clamp(6px, 1.825vw, 8.76px);
		font-size: clamp(13px, 4.2188vw, 20.25px);
		white-space: normal;
	}
}

/* -------------------------------------------------------------------------
   Главная: детальная сверка с мобильным фреймом Figma 480 (node 649:8407).
   Уточняет блок 520px выше. Отступы вокруг заголовков пересчитаны с учётом
   того, что в макете текст обрезан по капители (text-box-trim), а у нас
   считается line-box: кегль 32/0.96 даёт 3.85px сверху и 5.55px снизу.
   ---------------------------------------------------------------------- */
@media (max-width: 520px) {
	/* Шапка: поля 24 как у контента первого экрана; линии бургера 16px. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-header__inner { padding-inline: 24px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .burger span {
		width: 16px;
		margin-left: -8px;
	}

	/* Между первым экраном и «Проблемами» в макете 60px, а у секции только 30. */
	.home .hero-home { margin-bottom: 30px; }

	/* Первый экран 480×760. Фон — готовая композиция 600×760 (фото-слой
	   1919×1080 со смещением (−974, −40), световое пятно и матовые кольца
	   с backdrop-blur, который у SVG в <img> не работает). Картинка привязана
	   к правому краю: на телефонах уже 480 композиция обрезается слева,
	   запас 120px слева закрывает экраны до 600px. */
	.home .hero-home__picture img {
		left: auto;
		right: 0;
		top: 0;
		width: auto;
		height: 100%;
		max-width: none;
	}

	.home .hero-home__mobile-light,
	.home .hero-home__mobile-rings { display: none; }

	/* Текст первого экрана: капитель подписи на 202.5, заголовка на 247.8,
	   абзац на 460; кнопка 62px прижата к низу (поле 40). */
	.home .hero-home__content { padding-top: 176px; }
	.home .hero-home__eyebrow { margin-bottom: 19px; }
	.home .hero-home__title { margin-bottom: 25px; }
	.home .hero-home__text--desktop { display: none; }

	.home .hero-home__text--mobile {
		display: block;
		max-width: 309px;
	}

	.home .hero-home .btn { min-height: 62px; }

	/* Заголовки секций: в макете 20 до заголовка и 40 после (от капители). */
	.home .section-head {
		gap: 16px;
		margin-bottom: 34px;
	}

	.home .trust .section-head,
	.home .slider-cards .section-head { margin-bottom: 34px; }

	.home .form-section .section-head { gap: 16px; }

	.home .form-section__grid,
	.home .faq__grid { gap: 34px; }

	/* «Как начинается работа»: подпись 16px, треугольник 16. */
	.home .steps .eyebrow__text { font-size: 16px; }
	.home .steps .eyebrow__marker { width: 16px; }

	/* Ленты: вертикальные поля дорожки (4px) в макете отсутствуют. */
	.home .slider__track { padding-block: 0; }

	/* Плитки услуг: поля 20. Слои шире плитки (документы 233px в плитке 199)
	   не должны упираться в img { max-width: 100% } — иначе кадр обрезается.
	   Размытие: радиус Figma вдвое больше CSS-значения (stdDeviation = R/2);
	   документы в рендере макета резкие, монета и кошелёк — 1.79 и 1.72.
	   Рука и монеты: в макете повёрнут сам слой, а не его bounding box —
	   размеры слоёв взяты реальные, позиция — по центру рамки поворота. */
	.home .slider-cards .media-tile { padding: 20px; }
	.home .slider-cards .media-tile__layer { max-width: none; }

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(1) {
		left: 14.56% !important;
		top: 12.69% !important;
		width: 73.32% !important;
		height: 92.14% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(2) {
		left: 61.13% !important;
		top: 26.07% !important;
		width: 26.39% !important;
		height: 20.13% !important;
	}

	.home .slider-cards .media-tile:nth-child(2) .media-tile__layer:nth-of-type(3) {
		left: 7.99% !important;
		top: 76.18% !important;
		width: 43.99% !important;
		height: 33.55% !important;
	}

	.home .slider-cards .media-tile:nth-child(3) .media-tile__layer:nth-of-type(1) {
	}

	/* «Решение»: мобильная композиция уже содержит свет и кольца — без подложки. */
	.home .banner__card::after { background: none; }
	.home .banner__bg { object-position: center; }
	.home .banner__content { gap: 34px; }

	/* Таблетки: в макете 54/56/58 по высоте вместе с обводкой 2px — поле 14. */
	.home .pill,
	.home .pill:nth-child(even) {
		min-height: 0;
		padding: 14px;
	}

	/* Тезисы: капитель заголовка на 20 ниже номера, текст на 16 ниже базовой
	   линии, между абзацами пустая строка (22.4). Первый заголовок в макете
	   идёт одной строкой. */
	.home .trust__title { margin-top: 1px; }
	.home .trust__text { margin-top: -5px; }
	.home .trust__text + .trust__text { margin-top: 6px; }
	.home .trust__item:first-child .trust__title br { display: none; }

	/* Шаги: обводка карточек как в макете. */
	.home .steps:not(.steps--flat) .step-card { border-color: rgba(24, 25, 31, 0.25); }

	/* Форма: от последнего поля до кнопки 40 (16 — шаг сетки формы). */
	.home .lead-form__foot { margin-top: 24px; }

	/* Частые вопросы: плюс 20×20 с перекладинами 3px в рамке 40 (как в макете). */
	.home .faq__icon::before {
		width: 20px;
		height: 3px;
		border-radius: 0;
	}

	.home .faq__icon::after {
		width: 3px;
		height: 20px;
		border-radius: 0;
	}

	/* Кейсы: без стрелок, заголовок без серого акцента, обводка-волосок. */
	.home .cases .slider__nav { display: none; }
	.home .cases .section-head__title .is-muted { color: inherit; }
	.home .cases__track > .case-card { border-width: 0.5px; }

	/* Подвал: заголовок 32/1 без трекинга (иначе переносы не совпадают
	   с макетом), тексты 24/1.4 и 16/1.4 с трекингом −0.02em, кнопки 94. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer { padding-top: 76px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__title {
		max-width: calc(100% - 2px);
		letter-spacing: 0;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__text {
		margin-top: 14px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav a {
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__aside {
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons .btn { min-height: 94px; }

	/* Контакты и лого в макете стоят в одном блоке с шагом 40, а не 60. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo { margin-top: -20px; }
}

/* -------------------------------------------------------------------------
   Внутренние страницы: мобильные фреймы Figma 480.
   Планшетную геометрию задаёт блок 768 выше — здесь только то, что
   в мобильном макете отличается: поля 16, кегли 40/32/24/16/14,
   первый экран во всю высоту 760 и карточки с полями 30.
   Шапка и подвал общие с главной (см. блоки выше).
   ---------------------------------------------------------------------- */
@media (max-width: 520px) {
	/* Кадр героя ООО: берём его левее, чтобы сам снимок съехал правее.
	   Планшетное значение (60%) задано в блоке 1024 и здесь перекрывается. */
	body.page-buhgalteriya-ooo .hero-inner__bg { object-position: 50% center; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) {
		--pad-x: 16px;
		--section-y: clamp(44px, 12.5vw, 60px);
		--fs-h1: clamp(34px, 8.3333vw, 40px);
		--fs-h2: clamp(27px, 6.6667vw, 32px);
		--fs-h3: 24px;
		--fs-lead: 16px;
		--fs-eyebrow: 14px;
		--r-md: 30px;
	}

	/* «Глазок»: треугольник 13, отбивка 16, подпись 14 без обрезки по ширине. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .eyebrow { gap: 16px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .eyebrow__marker { width: 13px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .eyebrow__text,
	.page-uslugi .services-list .eyebrow__text { max-width: none; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .section-head { gap: 16px; margin-bottom: 26px; }

	/* Первый экран 480×760: поля 24, кнопка на всю ширину, текст 366. */
	/* Между первым экраном и следующей секцией в макете 60px, а у секции только 30. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner { padding-block: 0; margin-bottom: 30px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__card {
		height: 760px;
		min-height: 0;
		padding: 0 24px 40px;
		border-radius: 0;
		align-items: stretch;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__content {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
		max-width: none;
		padding-top: 210px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner .eyebrow { gap: 8px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner .eyebrow__text { font-size: 14px; opacity: 0.4; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__title {
		margin-block: 24px;
		font-size: 40px;
		line-height: 1.1;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__text {
		max-width: 366px;
		margin-bottom: 0;
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: 0;
		color: rgba(27, 24, 31, 0.8);
	}

	/* Планшетный слой гасит второй и последующие переносы — в мобильном макете они есть. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__title br:nth-of-type(n + 2) { display: inline; }

	/* В мобильном макете первый экран — только фотография со светлой вуалью:
	   кольца, которые планшетный слой возвращает, здесь лишние. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner .hero-inner__rings { display: none; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner__actions { margin-top: auto; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner .btn {
		justify-content: center;
		width: 100%;
		min-height: 62px;
		gap: 12px;
		padding: 20px 32px;
		font-size: 16px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .hero-inner .btn__arrow { width: 8px; height: 12.8px; }

	/* Форма, кейсы, шаги и вопросы в мобильных макетах совпадают с главной. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .form-section__grid,
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__grid { gap: 34px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .form-section .section-head { gap: 16px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .lead-form { gap: 16px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .field { min-height: 39px; padding-top: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .field__label,
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .field__input { font-size: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .field__label { top: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .field__input {
		height: 39px;
		padding-bottom: 16px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .lead-form__foot { margin-top: 24px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .form-section .lead-form__foot .btn {
		width: 100%;
		justify-self: stretch;
		min-height: 94px;
		gap: 20px;
		padding: 30px 40px;
		font-size: 24px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .form-section .lead-form__foot .btn__arrow { width: 10px; height: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .cases__track { gap: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .cases__track > .case-card {
		flex: 0 0 clamp(240px, 62.5vw, 300px);
		min-height: clamp(240px, 62.5vw, 300px);
		padding: 20px;
		border-width: 0.5px;
		border-radius: 30px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .case-card { gap: 16px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .case-card__row { gap: 7px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .case-card__value { font-size: 14px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .case-card .tag { padding: 4px 11px 5px; font-size: 12px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .cases .slider__nav { display: none; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__list { gap: 16px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__item { padding-bottom: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__trigger {
		gap: 20px;
		font-size: 24px;
		line-height: 1.4;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__icon { width: 40px; height: 40px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__icon::before {
		width: 20px;
		height: 3px;
		border-radius: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__icon::after {
		width: 3px;
		height: 20px;
		border-radius: 0;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__a { font-size: 14px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .faq__a p { padding-top: 8px; }

	/* Шаги: карточки 216×216 в два столбца, последняя — во всю ширину. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps:not(.steps--flat) .steps__panel { padding: 30px 0; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps:not(.steps--flat) .steps__list { gap: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps:not(.steps--flat) .step-card {
		aspect-ratio: 1;
		min-height: 0;
		padding: 20px;
		border-color: rgba(24, 25, 31, 0.25);
		border-radius: 30px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps .step-card__title {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps:not(.steps--flat) .step-card:last-child:nth-child(odd) {
		grid-column: 1 / -1;
		aspect-ratio: 448 / 218;
	}

	/* Нижний баннер с призывом: карточка 448×610, поля 40, кнопка 94. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta {
		aspect-ratio: 448 / 610;
		min-height: 0;
		padding: 80px 40px 40px;
		border: 1px solid #cdcdcd;
		border-radius: 37px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .banner__title {
		margin-bottom: 40px;
		font-size: 32px;
		line-height: 0.96;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .banner__text {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
		color: rgba(27, 24, 31, 0.5);
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .btn {
		justify-content: center;
		width: 100%;
		min-height: 94px;
		gap: 20px;
		padding: 30px 40px;
		font-size: 24px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .btn__arrow { width: 10px; height: 16px; }

	/* Фигура в мобильном макете крупнее и выше планшетной. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .banner__bg {
		left: -220%;
		top: 42%;
		width: 356%;
	}

	/* Фигура в кадре выше, правее и крупнее — как на сопровождении ООО. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta .banner__bg {
		left: -248%;
		top: 24%;
		width: 415%;
	}

	/* Кольца и общая вуаль поверх снимка тут не нужны. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta::after { content: none; background: none; }

	/* Светлая подложка под заголовком: опущена ниже текста, низ выгнут вверх. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .banner__card--cta::before {
		content: "";
		position: absolute;
		inset: 0 -1px auto;
		z-index: -1;
		height: 83%;
		width: auto;
		aspect-ratio: auto;
		background: linear-gradient(180deg, rgba(253, 252, 251, 0.12) 20%, rgba(253, 252, 251, 0.82) 100%);
		backdrop-filter: blur(54.34px);
		-webkit-backdrop-filter: blur(54.34px);
		transform: none;
		mask-image: radial-gradient(360% 210% at 50% 232%, transparent 82.5%, #000 82.5%);
		-webkit-mask-image: radial-gradient(360% 210% at 50% 232%, transparent 82.5%, #000 82.5%);
	}

	/* Сопровождение ООО и ИП: карточки задач 448×307 и тезисы с полями 30. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card-section .section-head { margin-bottom: 26px; }

	/* Планшетный слой убирает поля у секции — в мобильном макете карточка 448 с полями 16. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card-section > .container { padding-inline: var(--pad-x); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card {
		min-height: 0;
		padding: 40px;
		border-radius: 40px;
	}

	/* Кадры фона из макета: снимок шире карточки и сдвинут влево,
	   иначе в кадр попадает пустая стена, а не сюжет. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__bg {
		inset: auto;
		left: -120%;
		top: 0;
		width: 312.5%;
		height: 100%;
		max-width: none;
		object-fit: cover;
		object-position: center;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .media-card__bg {
		left: -42%;
		width: 172%;
	}

	/* Светлая пелена поверх снимка в макете отсутствует. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card:not(.media-card--list)::after { background: none; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list::after {
		background: linear-gradient(90deg, rgba(253, 251, 250, 0.72) 0%, rgba(253, 251, 250, 0.5) 38%, rgba(253, 251, 250, 0.12) 100%);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card { min-height: 600px; }
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card-section--complexity .media-card--list { min-height: 383px; padding: 40px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .num-list,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card-section--complexity .media-card--list .num-list { gap: 16px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .num-list__item {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 12px;
		align-items: start;
		font-size: 16px;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card--list .num-list__num { font-size: 18px; }

	.page-buhgalteriya-ip .media-card--list { min-height: 506px; }
	.page-buhgalteriya-ip .media-card--list .num-list {
		gap: 24px;
		margin-top: 56px;
	}

	.page-buhgalteriya-ip .media-card--list .num-list__item {
		gap: 16px;
		font-size: 24px;
		line-height: 1.2;
	}

	.page-buhgalteriya-ip .media-card--list .num-list__num { font-size: 24px; line-height: 1.2; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card__title {
		font-size: 32px;
		line-height: 0.96;
		letter-spacing: -0.02em;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chips { gap: 12px; }

	/* Подписи режимов у ИП длиннее макетных («УСН «Доходы минус расходы»»),
	   поэтому кегль на шаг мельче и перенос разрешён — иначе чип вылезает. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chip {
		min-height: 60px;
		padding: 12px 20px;
		font-size: 24px;
		line-height: 1.2;
		text-align: center;
		white-space: normal;
	}

	.page-buhgalteriya-ip .media-card .chip { font-size: clamp(16px, 4.1667vw, 20px); }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .media-card .chip__icon { width: 44px; height: 26px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__row { gap: 16px; }

	/* Высота — по кадру 480: карточка 448×307, на других телефонах та же
	   пропорция от ширины карточки (экран минус поля страницы). Это нижняя
	   граница, а не точная высота: на 320–360px длинный заголовок не влезает,
	   и карточка вытягивается под текст. С aspect-ratio и min-height: 0 она
	   оставалась по пропорции, и номер выталкивало за нижний край.
	   Селектор .bento__grid > .bento-card нужен отдельно: правило из блока 768
	   с тремя классами иначе оставляло карточкам 2–5 свои min-height 255px,
	   поля и скругление — на 390px они были выше остальных (255 против 245). */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid > .bento-card,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__grid > .bento-card:first-child,
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento__row .bento-card {
		--ill-size: 120px;
		--ill-gap: 0px;
		min-height: calc((100vw - 2 * var(--pad-x)) * 307 / 448);
		padding: 30px;
		border-color: #cdcdcd;
		border-radius: 40px;
	}

	/* margin-bottom держит последнюю строку заголовка выше иллюстрации, когда карточка растёт под
	   длинный заголовок (узкий экран, правка текста из админки): иллюстрация — квадрат
	   clamp(68px, 16vw, 94px) в 34px от низа (правило «Объёмные иллюстрации мельче» ниже), номер —
	   50px над полем 30px, так что заголовку нужно «иллюстрация − 46px» над номером, +4px зазора.
	   Пока у карточки есть запас высоты, номер прижат вниз (margin-top: auto) и отступ ничего
	   не сдвигает. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card__title {
		max-width: 100%;
		margin-bottom: calc(clamp(68px, 16vw, 94px) - 42px);
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	/* Кадр иллюстрации из макета — 120 в ширину у нижнего правого угла.
	   Небольшой отступ держит рисунок в стороне от скругления, иначе угол его срезает. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card__ill {
		right: 12px;
		bottom: 12px;
		width: 108px;
		height: 96px;
		max-width: none;
		max-height: none;
		object-fit: contain;
		object-position: right bottom;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .bento-card .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	/* «Кому подойдёт услуга»: карточки 216 в два столбца, поля 20. */
	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid__list { gap: 16px; }

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card {
		min-height: 0;
		padding: 20px;
		border-color: rgba(24, 25, 31, 0.25);
		border-radius: 30px;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card__title {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	/* «Начинающим предпринимателям» помещается в строку (241px при кегле 16
	   против 248px в карточке даже на 320px) — снимаем ручной перенос.
	   Отключить <br> можно только через display: none: у него дефолтный
	   display и так inline, и перенос от этого не зависит. Чтобы слова не
	   слиплись, в самом тексте перед <br> стоит пробел. */
	.page-buhgalteriya-ip .cards-grid .num-card__title br { display: none; }

	/* Заголовки карточек «Что входит в услугу» разбиты вручную на две строки
	   (<br> в inc/content/sdacha-otchetnosti.php), и переносить их больше
	   ничего не должно. Ширину резали два разных правила, поэтому нужны оба
	   селектора: первые пять карточек лежат в .bento__grid и попадали под
	   :is(...) .bento-card__title { max-width: 70% } из блока 768 (два класса),
	   шестая — в .bento__row.cols-1 с немедийным max-width: min(830px, 62%)
	   (три класса). Оба перебиваются не порядком, а специфичностью: три
	   класса в первом селекторе и четыре во втором. 70% от карточки на 375px
	   это 205px — туда не влезала даже пара слов, отсюда перенос почти на
	   каждом слове.
	   font-size — линейная функция от vw, подобранная по самой широкой строке
	   («Консультационная поддержка», 341px при кегле 24) и ширине контента
	   карточки (vw - 80: поля страницы 16 и поля карточки 24 с каждой
	   стороны): требуемый кегль 24 * (vw - 80) / 341 выше этой прямой на всём
	   мобильном диапазоне, так что строки помещаются от 320px и выше. */
	.page-sdacha-otchetnosti .bento__grid .bento-card__title,
	.page-sdacha-otchetnosti .bento__row.cols-1 .bento-card__title {
		max-width: 100%;
		font-size: clamp(16px, 7.24vw - 7.66px, 24px);
	}

	.page-sdacha-otchetnosti .bento-card__title .br-mob { display: inline; }

	/* «Почему сдача отчетности становится источником риска»: в кадре 480
	   карточки 448×240 и все одной высоты. Нижняя граница — та же пропорция
	   от ширины карточки вместо min-height 270px из блока 768 (три класса;
	   .section .num-card { min-height: 0 } ниже его не перебивает). Когда
	   текст не влезает, строки сетки 1fr выравнивают карточки по самой
	   высокой. Не aspect-ratio: в сетке со столбцом 1fr он растягивал столбец
	   под текст — на 320px карточка выходила шириной 417px. */
	.page-sdacha-otchetnosti .cards-grid__list { grid-auto-rows: 1fr; }

	.page-sdacha-otchetnosti .cards-grid .num-card {
		min-height: calc((100vw - 2 * var(--pad-x)) * 240 / 448);
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-card__text {
		margin-top: 12px;
		font-size: 14px;
		line-height: 1.4;
	}

	:is(.page-buhgalteriya-ip, .page-buhgalteriya-ooo) .cards-grid .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	/* «Какие риски снимает Атлант»: номер 40, заголовок и текст в колонке справа. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefits > .container { padding-inline: var(--pad-x); }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefits__grid { gap: 34px; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefits__list { gap: 16px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefit-row {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 0 20px;
		align-items: start;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefit-row .num-badge {
		width: 40px;
		height: 40px;
		font-size: 14px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefit-row__title {
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .benefit-row__text {
		margin-top: 8px;
		font-size: 16px;
		color: rgba(27, 24, 31, 0.5);
		opacity: 1;
	}

	/* Шаг между тезисами: 40 — как в макете ИП; у ООО строки плотнее. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404):not(.page-buhgalteriya-ooo):not(.page-uslugi) .benefits__list { gap: 40px; }

	/* Консультация бухгалтера: карточки «Когда нужна консультация» идут в столбик,
	   а иллюстрации в «Что входит в консультацию» мельче и отодвинуты от углов. */
	.page-konsultaciya-buhgaltera .cards-grid__list { grid-template-columns: 1fr; }
	.page-konsultaciya-buhgaltera .cards-grid .num-card { grid-column: 1 / -1 !important; }

	.page-konsultaciya-buhgaltera .bento-card__ill {
		right: 20px;
		bottom: 20px;
		width: clamp(112px, 26vw, 152px);
		height: clamp(112px, 26vw, 152px);
	}

	/* Карточка с тезисами поверх снимка: поля 40 по бокам и 80 сверху и снизу. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items {
		min-height: 498px;
		padding: 80px 40px;
		border-radius: 40px;
		justify-content: center;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-card__bg {
		inset: auto;
		left: -42%;
		top: 0;
		width: 172%;
		height: 100%;
		max-width: none;
		object-fit: cover;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-card__items { gap: 40px; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-item {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 0 20px;
		align-items: start;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-item .num-badge {
		width: 40px;
		height: 40px;
		font-size: 14px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-item__title {
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .media-card--items .media-item__text {
		margin-top: 8px;
		font-size: 16px;
	}

	/* Абзац первого экрана здесь длиннее: строкам нужна полная ширина колонки. */
	:is(.page-problemy-biznesa, .page-resheniya, .page-doverie) .hero-inner__text { max-width: none; font-size: 15px; }

	/* Цитата: кегль подобран так, чтобы фраза укладывалась в три строки. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .quote__text { font-size: clamp(18px, 4.6vw, 22px); line-height: 1.3; }

	/* Доверие: карточки с полями 40 и иллюстрацией 150×128 у нижнего правого угла. */
	.page-doverie .feature-cards__grid { gap: 20px; }

	.page-doverie .feature-card {
		min-height: 0;
		padding: 40px;
		border-radius: 40px;
	}

	.page-doverie .feature-card .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	.page-doverie .feature-card__title {
		max-width: 236px;
		margin-block: 40px 16px;
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.page-doverie .feature-card__text {
		max-width: 236px;
		font-size: 16px;
	}

	.page-doverie .feature-card__ill,
	.page-doverie .feature-cards__grid > .feature-card:nth-child(3) .feature-card__ill {
		right: 0;
		bottom: 0;
		width: 150px;
		height: 128px;
	}

	/* Как работаем: карточки с полями 40 и иллюстрацией 150×114 у нижнего правого угла. */
	.page-kak-rabotaem .feature-cards__grid { gap: 20px; }

	.page-kak-rabotaem .feature-card {
		min-height: 0;
		padding: 40px;
		border-radius: 40px;
	}

	.page-kak-rabotaem .feature-card .num-badge {
		width: 50px;
		height: 50px;
		font-size: 18px;
	}

	.page-kak-rabotaem .feature-card__title {
		max-width: 290px;
		margin-block: 40px 16px;
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.page-kak-rabotaem .feature-card__text {
		max-width: 290px;
		font-size: 16px;
	}

	.page-kak-rabotaem .feature-card__ill {
		right: 18px;
		bottom: 18px;
		width: 118px;
		height: 90px;
		max-width: none;
		object-fit: contain;
		object-position: right bottom;
	}

	/* Плитки показателей — квадратные, как в макете. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps--flat .steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps--flat .step-card {
		/* Инлайновый span из данных ломает двухколоночную сетку. */
		grid-column: auto !important;
		aspect-ratio: 1;
		min-width: 0;
		/* Ширину задаёт колонка: иначе высокий текст растягивает и высоту, и ширину. */
		width: 100%;
		min-height: 0;
		padding: 20px;
		overflow: hidden;
	}

	/* Длинные подписи не должны растягивать плитку выше квадрата. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps--flat .step-card__title {
		font-size: 15px;
		line-height: 1.3;
	}

	/* Планшетный слой задаёт отдельным плиткам свою высоту — гасим, плитка квадратная. */
	.page-resheniya .steps .step-card,
	.page-resheniya .steps .step-card:nth-child(3),
	.page-resheniya .steps .step-card:nth-child(4) { min-height: 0; }

	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .steps--flat .step-card:last-child:nth-child(odd) {
		grid-column: 1 / -1 !important;
		aspect-ratio: 448 / 216;
	}

	/* Карточки-проблемы в мобильном макете идут в столбик. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .cards-grid__list { grid-template-columns: 1fr; }
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .cards-grid .num-card { grid-column: 1 / -1 !important; }

	/* Объёмные иллюстрации мельче и с отступом от углов карточки. */
	:is(.page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404):not(.page-konsultaciya-buhgaltera) .bento-card__ill {
		right: 34px;
		bottom: 34px;
		width: clamp(68px, 16vw, 94px);
		height: clamp(68px, 16vw, 94px);
	}

	/* Карточки услуг: одна колонка, поля 30, иллюстрации в мобильном макете нет. */
	.page-uslugi .services-list__grid { gap: 16px; }

	.page-uslugi .service-card,
	.page-uslugi .service-card--wide {
		min-height: 0;
		padding: 30px;
		border-radius: 32px;
		border-color: #cdcdcd;
	}

	.page-uslugi .service-card:nth-child(4),
	.page-uslugi .service-card:nth-child(5) { min-height: 0; }

	.page-uslugi .service-card__ill { display: none; }

	.page-uslugi .service-card .num-badge {
		width: 40px;
		height: 40px;
		font-size: 14px;
	}

	.page-uslugi .service-card__title {
		margin-block: 20px 8px;
		font-size: 24px;
		line-height: 1.4;
		letter-spacing: -0.02em;
	}

	.page-uslugi .service-card__text {
		max-width: none;
		font-size: 16px;
		color: rgba(27, 24, 31, 0.5);
	}

	.page-uslugi .service-card .chips,
	.page-uslugi .service-card:not(:last-child) .chips {
		flex-wrap: wrap;
		gap: 8px;
		padding-top: 40px;
	}

	.page-uslugi .service-card .chip,
	.page-uslugi .service-card:not(:last-child) .chip,
	.page-uslugi .service-card:last-child .chip {
		padding: 12px 20px;
		font-size: 14px;
		line-height: 1.4;
	}

	/* «Что общего»: номер и заголовок в строку, текст под ними на всю ширину. */
	.page-uslugi .benefits__grid { gap: 34px; }
	.page-uslugi .benefits__list { gap: 32px; }

	.page-uslugi .benefit-row {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 12px;
		align-items: center;
	}

	.page-uslugi .benefit-row .num-badge {
		width: 40px;
		height: 40px;
		font-size: 14px;
	}

	.page-uslugi .benefit-row__title {
		font-size: 24px;
		line-height: 1.2;
		letter-spacing: 0;
	}

	.page-uslugi .benefit-row__text {
		grid-column: 1 / -1;
		margin-top: 16px;
		font-size: 16px;
	}

	/* «Не уверены?»: две карточки 448×330 с полями 30. */
	.page-uslugi .two-choice__grid { gap: 16px; }

	.page-uslugi .choice-card {
		min-height: 330px;
		padding: 30px;
		border-radius: 32px;
		border-color: #bcbdc1;
	}

	.page-uslugi .choice-card.is-active {
		border-width: 2px;
		border-color: var(--c-gold);
		padding: 29px;
	}

	.page-uslugi .choice-card__title {
		font-size: 24px;
		line-height: 1.2;
		letter-spacing: 0;
	}

	.page-uslugi .choice-card .num-list {
		gap: 16px;
		margin-block: 20px 40px;
	}

	.page-uslugi .choice-card .num-list__item {
		gap: 12px;
		align-items: center;
		font-size: 16px;
	}

	.page-uslugi .choice-card .num-list__num { font-size: 18px; color: #b28c40; }

	.page-uslugi .choice-card .btn {
		justify-content: center;
		align-self: stretch;
		width: 100%;
		min-height: 62px;
		gap: 12px;
		padding: 20px 32px;
		font-size: 16px;
	}

	.page-uslugi .choice-card .btn__arrow { width: 8px; height: 12.8px; }

	/* Нижний баннер: карточка 448×610, поля 40, заголовок 32, кнопка 94. */
	:is(.page-uslugi, .single-material) .banner__card--cta {
		aspect-ratio: 448 / 610;
		min-height: 0;
		padding: 80px 40px 40px;
		border: 1px solid #cdcdcd;
		border-radius: 37px;
	}

	:is(.page-uslugi, .single-material) .banner__card--cta .banner__title {
		margin-bottom: 40px;
		font-size: 32px;
		line-height: 0.96;
		letter-spacing: -0.02em;
	}

	:is(.page-uslugi, .single-material) .banner__card--cta .banner__text {
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: -0.02em;
		color: rgba(27, 24, 31, 0.5);
	}

	:is(.page-uslugi, .single-material) .banner__card--cta .btn {
		justify-content: center;
		width: 100%;
		min-height: 94px;
		gap: 20px;
		padding: 30px 40px;
		font-size: 24px;
	}

	:is(.page-uslugi, .single-material) .banner__card--cta .btn__arrow { width: 10px; height: 16px; }
}

/* Телефоны уже мобильного фрейма: ручные переносы из макета 480 рвут абзацы
   пополам, поэтому подменяем их пробелом и даём тексту течь самому. */
@media (max-width: 430px) {
	/* В баннере это один связный абзац — переносы макета только рвут его.
	   В герое переносы разделяют три фразы, поэтому их сохраняем, а чтобы
	   каждая укладывалась в строку, чуть убавляем кегль. */
	.home .banner__text br { display: none; }
	.home .hero-home__text { font-size: clamp(13px, 3.85vw, 16px); }

	/* Лакап в подвале на 390 не помещается в поля — ужимаем на шаг. */
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__mark {
		width: clamp(58px, 17vw, 72px);
		height: clamp(50px, 14.87vw, 63px);
	}

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__name { font-size: clamp(17px, 5vw, 22px); }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__logo .logo__tagline { font-size: clamp(11px, 3.6vw, 15px); }
}

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

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	[data-reveal] { opacity: 1 !important; translate: none !important; scale: none !important; clip-path: none !important; }
	.hero-home__picture img,
	.hero-inner__bg { animation: none; transform: none; }
}

/* Печать */
@media print {
	.site-header, .mobile-nav, .modal, .slider__nav, .btn { display: none !important; }
	body { background: #fff; }
	[data-reveal] { opacity: 1 !important; translate: none !important; scale: none !important; clip-path: none !important; }
}

/* Запас по высоте для параллакса фоновых картинок */
.banner__bg,
.media-card__bg { will-change: translate; }

.banner__card,
.media-card { --parallax-pad: 28px; }

.banner__bg,
.media-card__bg {
	top: calc(var(--parallax-pad) * -1);
	height: calc(100% + var(--parallax-pad) * 2);
}

/* -------------------------------------------------------------------------
   33. Цитата
   ---------------------------------------------------------------------- */

.quote__card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: clamp(20px, 2.0833vw, 40px);
	margin: 0;
	padding: clamp(28px, 6.25vw, 120px);
	border-radius: var(--r-md);
	background: var(--c-beige);
}

.quote__mark {
	font-family: var(--font-display);
	font-size: clamp(96px, 10vw, 192px);
	line-height: 0.7;
	color: var(--c-gold);
}

.quote__text {
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--fs-h2);
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: -0.02em;
}

.quote__author {
	grid-column: 2;
	margin-top: clamp(12px, 1.0417vw, 20px);
	font-size: var(--fs-sm);
	color: var(--c-body);
}

.bento-card__text {
	position: relative;
	max-width: 46ch;
	margin-top: clamp(12px, 1.1458vw, 22px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

.bento-card:hover .bento-card__text { color: rgba(97, 78, 35, 0.85); }

/* -------------------------------------------------------------------------
   34. Контакты
   ---------------------------------------------------------------------- */

.contacts__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--gap);
}

.contact-card {
	display: grid;
	align-content: start;
	gap: clamp(10px, 0.8333vw, 16px);
	padding: clamp(22px, 2.6042vw, 50px);
	border-radius: var(--r-md);
	background: var(--c-beige);
	transition: var(--t-lift);
}

.contact-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }

.contact-card__label {
	font-size: var(--fs-eyebrow);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(24, 25, 31, 0.45);
}

.contact-card__value {
	font-family: var(--font-display);
	font-size: var(--fs-lead);
	line-height: 1.15;
	letter-spacing: -0.02em;
	/* Кликабельное значение выделено золотым; подпись и пояснение — нейтральные. */
	color: var(--c-gold-ink);
	transition: color var(--dur) var(--ease);
}

.contact-card__value:hover { color: var(--c-ink); }

.contact-card__note {
	font-size: var(--fs-sm);
	line-height: 1.4;
	color: var(--c-body);
}

@media (max-width: 1024px) { .contacts__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px)  { .contacts__grid { grid-template-columns: 1fr; } }

/* Обычный контент страниц (политика, статьи) */
.entry__title { margin-bottom: clamp(20px, 2.5vw, 48px); }

.entry__content {
	max-width: 78ch;
	font-size: var(--fs-body);
	line-height: 1.6;
	color: var(--c-body);
}

.entry__content > * + * { margin-top: 1em; }

.entry__content h2,
.entry__content h3 {
	margin-top: 1.6em;
	font-family: var(--font-display);
	font-weight: 400;
	color: var(--c-ink);
	letter-spacing: -0.02em;
}

.entry__content h2 { font-size: var(--fs-h3); }
.entry__content h3 { font-size: var(--fs-lead); }
.entry__content ul { padding-left: 1.2em; list-style: disc; }
.entry__content ol { padding-left: 1.2em; list-style: decimal; }
.entry__content li + li { margin-top: 0.4em; }
.entry__content a { color: var(--c-gold-ink); text-decoration: underline; text-underline-offset: 2px; }

.breadcrumbs {
	display: flex;
	gap: 10px;
	margin-bottom: clamp(16px, 1.5625vw, 30px);
	font-size: var(--fs-sm);
	color: var(--c-muted);
}

.breadcrumbs a:hover { color: var(--c-ink); }

.pagination { margin-top: clamp(28px, 3vw, 56px); }
.pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	padding-inline: 12px;
	border: 1px solid var(--c-line);
	border-radius: var(--r-pill);
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.pagination .page-numbers.current,
.pagination .page-numbers:hover { background: var(--c-ink); color: var(--c-white); border-color: var(--c-ink); }
.pagination .nav-links { display: flex; gap: 8px; flex-wrap: wrap; }

.field__input--area {
	min-height: 3.2em;
	line-height: 1.2;
	resize: vertical;
	font-family: var(--font-display);
}

/* В модалке поля компактнее — подпись поднимается на свою высоту шрифта */
.modal .field { padding-top: var(--fs-lead); }
.modal .field__label { top: var(--fs-lead); }
.modal .field:focus-within .field__label,
.modal .field.has-value .field__label { transform: translateY(calc(var(--fs-lead) * -1)) scale(0.55); }

/* На мобильном подпись в активном состоянии почти нечитаема: базовый шрифт
   там и так уменьшен до 16px, а scale (0.5 в обычных полях, 0.55 в модалке
   и на главной) сжимает её ещё раз — на выходе 8-9px. Смещение (translateY)
   не трогаем, оно у каждого контекста своё и совпадает с его версткой,
   только увеличиваем сам масштаб. Правило намеренно в самом низу файла —
   у всех трёх исходных селекторов та же специфичность, и без места в конце
   этот блок их не перебьёт. */
@media (max-width: 520px) {
	.field:focus-within .field__label,
	.field.has-value .field__label { transform: translateY(calc(var(--fs-h3) * -1)) scale(0.75); }

	.home .field:focus-within .field__label,
	.home .field.has-value .field__label { transform: translateY(calc(var(--fs-lead) * -1)) scale(0.75); }

	.modal .field:focus-within .field__label,
	.modal .field.has-value .field__label { transform: translateY(calc(var(--fs-lead) * -1)) scale(0.75); }
}

/* -------------------------------------------------------------------------
   35. Материал (статья / руководство / разбор)

   Сетка макета: 1800px делятся на 268 / 919 / 453 с промежутками по 80px
   (268+919+453+80*2 = 1800), поэтому колонки заданы во fr — пропорции
   сохраняются на любой ширине.
   ---------------------------------------------------------------------- */

.article {
	padding-top: clamp(24px, 3.3333vw, 64px);
	padding-bottom: clamp(40px, 5.2083vw, 100px);
}

/* Области, а не порядок в разметке: на десктопе содержание стоит слева,
   на планшете и мобильном — между обложкой и текстом. Колонки во fr, потому
   что 268+919+453 ровно равно 1800 минус два промежутка по 80. */
.article__grid {
	display: grid;
	grid-template-columns: minmax(0, 268fr) minmax(0, 919fr) minmax(0, 453fr);
	grid-template-areas:
		"toc intro more"
		"toc body  more";
	gap: clamp(20px, 2.0833vw, 40px) clamp(28px, 4.1667vw, 80px);
	align-items: start;
}

/* Без содержания левая колонка не нужна — остальные разъезжаются на её место. */
.article__grid--no-toc {
	grid-template-columns: minmax(0, 919fr) minmax(0, 453fr);
	grid-template-areas:
		"intro more"
		"body  more";
}

.article__intro       { grid-area: intro; }
.article__aside--toc  { grid-area: toc; }
.article__main        { grid-area: body; }
.article__aside--more { grid-area: more; }

.article__intro {
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 2.0833vw, 40px);
	min-width: 0;
}

/* --- Левая колонка: автосодержание по H2 --- */

.article__aside--toc { position: sticky; top: calc(var(--header-h-sm) + clamp(12px, 1.5625vw, 30px)); }

.article__aside-inner {
	display: flex;
	flex-direction: column;
	gap: clamp(8px, 0.5208vw, 10px);
}

/* Панель без рамки и подложки: пункты идут вплотную друг к другу, активный
   выделен бежевым во всю ширину с золотой полосой слева. */
.toc {
	display: flex;
	flex-direction: column;
	overflow: clip;
	margin: 0;
	padding: 0;
	list-style: none;
}

.toc li { display: block; }

.toc__item {
	display: block;
	padding: clamp(8px, 0.5208vw, 10px);
	border-left: 3px solid transparent;
	font-size: clamp(14px, 0.8333vw, 16px);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
	transition: color var(--dur) var(--ease), background-color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.toc__item:hover { color: rgba(27, 24, 31, 0.8); }

.toc__item.is-current {
	border-left-color: var(--c-gold);
	background: var(--c-beige);
	color: rgba(27, 24, 31, 0.8);
}

/* --- Центральная колонка --- */

.article__main {
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 2.0833vw, 40px);
	min-width: 0;
}

.article__head {
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 1.0417vw, 20px);
	scroll-margin-top: calc(var(--header-h-sm) + 40px);
}

.article__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gap);
	flex-wrap: wrap;
}

.article__meta-facts {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2.0833vw, 40px);
}

.article__fact {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: clamp(12px, 0.7292vw, 14px);
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--c-ink);
	opacity: 0.3;
}

.article__fact svg {
	flex: none;
	width: clamp(18px, 1.25vw, 24px);
	height: clamp(18px, 1.25vw, 24px);
	/* В макете знак холоднее подписи: #6F6F6F против #18191F. */
	color: #6f6f6f;
}

.article__title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(30px, 3.3333vw, 64px);
	line-height: 0.96;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	text-wrap: balance;
}

.article__cover {
	margin: 0;
	overflow: hidden;
	border-radius: var(--r-md);
	aspect-ratio: 919 / 594;
}

.article__cover-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.article__lead,
.article__body p {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

/* --- Контент из блочного редактора ---
   Стилизуем по тегам, а не по классам блоков: тогда любой блок, который
   редактор добавит в будущем, попадает в оформление макета сам. --- */

.article__body {
	display: flex;
	flex-direction: column;
	gap: clamp(14px, 1.25vw, 24px);
}

.article__body > * { margin: 0; }

.article__body h2,
.article__sources-title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: var(--fs-h3);
	line-height: 1;
	letter-spacing: 0;
	color: var(--c-ink);
	scroll-margin-top: calc(var(--header-h-sm) + clamp(20px, 2.0833vw, 40px));
}

.article__body h2 { margin-top: clamp(10px, 1.0417vw, 20px); }

.article__body h3 {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(19px, 1.4583vw, 28px);
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--c-ink);
	scroll-margin-top: calc(var(--header-h-sm) + 40px);
}

.article__body h4 {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: var(--fs-lead);
	line-height: 1.2;
	color: var(--c-ink);
}

.article__body a {
	color: var(--c-gold-ink);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-color: rgba(97, 78, 35, 0.35);
	transition: text-decoration-color var(--dur) var(--ease);
}

.article__body a:hover { text-decoration-color: currentColor; }

.article__body ul,
.article__body ol {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	padding-left: clamp(20px, 1.875vw, 36px);
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(24, 25, 31, 0.8);
}

.article__body ul { list-style: disc; }
.article__body ol { list-style: decimal; }
.article__body li::marker { color: rgba(24, 25, 31, 0.5); }
.article__body li > ul,
.article__body li > ol { margin-top: 0.15em; }

/* Цитата-выделение из макета: бежевая подложка, золотая линия слева,
   текст капсом 18/0.1em. Работает и для <blockquote>, и для блока «Цитата». */
.article__body blockquote,
.article__body .wp-block-quote {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	padding: clamp(16px, 1.25vw, 24px);
	border-left: 4px solid var(--c-gold);
	border-radius: 8px;
	background: var(--c-beige);
}

.article__body blockquote p,
.article__body .wp-block-quote p {
	font-size: clamp(14px, 0.9375vw, 18px);
	line-height: 1.35;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(27, 24, 31, 0.8);
}

.article__body blockquote cite,
.article__body .wp-block-quote cite {
	font-size: clamp(13px, 0.8333vw, 16px);
	font-style: normal;
	letter-spacing: -0.02em;
	text-transform: none;
	color: rgba(27, 24, 31, 0.5);
}

/* Вторая раскладка цитаты — без подложки, для длинных вставок. */
.article__body .is-style-atlant-plain {
	padding: 0 0 0 clamp(16px, 1.25vw, 24px);
	border-radius: 0;
	background: none;
}

.article__body .is-style-atlant-plain p {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	text-transform: none;
}

/* Вводный абзац */
.article__body .is-style-atlant-lead {
	font-size: clamp(18px, 1.4583vw, 28px);
	line-height: 1.35;
	color: var(--c-ink);
}

/* Заметка на бежевом */
.article__body .is-style-atlant-note {
	padding: clamp(18px, 1.5625vw, 30px);
	border-radius: var(--r-sm);
	background: var(--c-beige-soft);
}

.article__body figure { margin: 0; }

.article__body img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--r-sm);
}

.article__body figcaption {
	margin-top: 10px;
	font-size: clamp(13px, 0.8333vw, 16px);
	line-height: 1.4;
	color: rgba(27, 24, 31, 0.5);
}

.article__body .wp-block-table { overflow-x: auto; }

.article__body table {
	width: 100%;
	border-collapse: collapse;
	font-size: clamp(14px, 0.9375vw, 18px);
	line-height: 1.4;
	color: rgba(27, 24, 31, 0.8);
}

.article__body th,
.article__body td {
	padding: clamp(10px, 0.7292vw, 14px);
	border: 1px solid var(--c-line);
	text-align: left;
}

.article__body th { background: var(--c-beige-soft); font-weight: 400; color: var(--c-ink); }

.article__body hr,
.article__body .wp-block-separator {
	width: 100%;
	height: 0;
	margin-block: clamp(8px, 0.8333vw, 16px);
	border: 0;
	border-top: 1px solid var(--c-line);
}

.article__body .wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--gap); }

.article__body .wp-block-button__link {
	display: inline-flex;
	padding: clamp(14px, 1.25vw, 24px) clamp(22px, 2.0833vw, 40px);
	border-radius: var(--r-pill);
	background: var(--grad-gold);
	font-size: var(--fs-lead);
	color: var(--c-ink);
	text-decoration: none;
}

/* --- Теги --- */

.article__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	border-radius: 6px;
	background: #f4f5f5;
}

.article__tags-label {
	font-size: clamp(14px, 0.9375vw, 18px);
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--c-ink);
	opacity: 0.3;
}

.article__tag {
	font-size: clamp(14px, 0.8333vw, 16px);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
	transition: color var(--dur) var(--ease);
}

.article__tag:hover { color: var(--c-gold-ink); }

/* --- Источники --- */

.article__sources {
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 1.0417vw, 20px);
	padding-top: clamp(24px, 2.0833vw, 40px);
	border-top: 1px solid var(--c-line);
}

.article__sources-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-left: clamp(18px, 1.25vw, 24px);
	list-style: decimal;
	font-size: clamp(14px, 0.8333vw, 16px);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.5);
}

.article__sources-list a { color: inherit; text-decoration: underline; text-underline-offset: 0.2em; }
.article__sources-list a:hover { color: var(--c-gold-ink); }

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

.share {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.share__label {
	font-size: clamp(14px, 0.9375vw, 18px);
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--c-ink);
	opacity: 0.3;
}

.share__list { display: flex; align-items: center; gap: 16px; }

.share__btn {
	display: grid;
	place-items: center;
	width: clamp(20px, 1.25vw, 24px);
	height: clamp(20px, 1.25vw, 24px);
	padding: 0;
	border: 0;
	background: none;
	color: var(--c-ink);
	cursor: pointer;
	transition: color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.share__btn svg { width: 100%; height: 100%; }
.share__btn:hover { color: var(--c-gold-ink); transform: translateY(-2px); }
.share__btn.is-copied { color: var(--c-gold-ink); }

.share__done {
	font-size: clamp(12px, 0.7292vw, 14px);
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--c-gold-ink);
	opacity: 0;
	transition: opacity var(--dur) var(--ease);
}

.share__done.is-visible { opacity: 1; }

/* --- Правая колонка: другие материалы --- */

.article__aside--more {
	display: flex;
	flex-direction: column;
	gap: clamp(14px, 1.25vw, 24px);
}

.article__more {
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 0.8333vw, 16px);
}

.material-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 1.0417vw, 20px);
	padding: clamp(20px, 1.5625vw, 30px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: var(--c-beige);
	transition: var(--t-lift);
}

.material-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.material-card__link { position: absolute; inset: 0; }

.material-card__title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--c-ink);
}

.material-card__text {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: clamp(14px, 0.8333vw, 16px);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

/* Подписи колонок («Содержание», «Другие материалы») идут одной строкой:
   общий .eyebrow__text ограничен по ширине под заголовки секций. */
.article__aside .eyebrow__text { max-width: none; }

/* «Глазок» типа материала: подпись 14/0.1em и свой знак — острый золотой
   треугольник 9×10.4 остриём вправо (в разметку подставляется
   eyebrow-triangle-gold.svg), в отличие от серого скруглённого у секций. */
.eyebrow--sm { gap: clamp(10px, 1.0417vw, 20px); align-items: center; }
.eyebrow--sm .eyebrow__marker { width: clamp(7px, 0.46875vw, 9px); margin-top: 0; }
.eyebrow--sm .eyebrow__text { max-width: none; font-size: clamp(12px, 0.7292vw, 14px); }

/* --- Планшет (эталон — фрейм 768) ---

   Одна колонка: содержание переезжает под обложку, «другие материалы» уходят
   вниз. Кегли на планшете крупнее общей fluid-шкалы темы (у неё на 768px
   значения близки к минимальным), поэтому размеры считаем от ширины окна так,
   чтобы точно попасть в оба макета: линейка проходит через 768 и 480.
   ---------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.article__grid,
	.article__grid--no-toc {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"intro"
			"toc"
			"body"
			"more";
		gap: 20px;
	}

	/* Поля статьи: 40px при 768 и 16px при 480. */
	.article > .container { padding-inline: clamp(16px, calc(8.3333vw - 24px), 40px); }

	.article { padding-top: clamp(24px, 8.3333vw, 40px); }

	/* До «других материалов» в макете 40px — 20 даёт сетка, 20 добавляем. */
	.article__aside--more { margin-top: clamp(14px, 4.1667vw, 20px); }

	.article__aside--toc { position: static; }
	.article__aside-inner { gap: clamp(8px, 2.0833vw, 10px); }

	/* Подписи колонок: треугольник 15px, отступ до текста 30px, кегль 18. */
	.article .eyebrow { gap: clamp(16px, 6.25vw, 30px); }
	.article .eyebrow__marker { width: clamp(12px, 3.125vw, 15px); margin-top: 0.2em; }
	.article .eyebrow__text { font-size: clamp(14px, 3.75vw, 18px); }

	/* Тип материала: свой знак 9px и подпись 14. */
	.article .eyebrow--sm { gap: clamp(12px, 4.1667vw, 20px); }
	.article .eyebrow--sm .eyebrow__marker { width: clamp(7px, 1.875vw, 9px); }
	.article .eyebrow--sm .eyebrow__text { font-size: clamp(12px, 2.9167vw, 14px); }

	/* В макете сначала просмотры, потом дата — на десктопе наоборот. */
	.article__meta-facts { flex-direction: row-reverse; flex-wrap: wrap; gap: 8px clamp(14px, 8.3333vw, 40px); }
	.article__fact { font-size: clamp(11px, 2.9167vw, 14px); }
	.article__fact svg { width: clamp(18px, 5vw, 24px); height: clamp(18px, 5vw, 24px); }

	.article__title { font-size: clamp(28px, 8.3333vw, 64px); }
	.article__cover { aspect-ratio: 688 / 594; }

	/* Содержание: нумерованный список без внутренних отступов у пунктов. */
	.toc {
		gap: clamp(6px, 1.6667vw, 8px);
		padding: clamp(8px, 2.2917vw, 11px);
		border: 1px solid #bcbdc1;
		border-radius: clamp(14px, 4.1667vw, 20px);
		list-style: decimal;
	}
	.toc li { display: list-item; margin-left: clamp(17px, 5vw, 24px); }

	.toc__item {
		padding: 0;
		border-left: 0;
		font-size: clamp(13px, 3.3333vw, 16px);
	}

	/* Подложку активного пункта макет здесь не показывает — остаётся цвет. */
	.toc__item.is-current { background: none; }

	.article__lead,
	.article__body p,
	.article__body ul,
	.article__body ol,
	.article__sources-list { font-size: clamp(16px, calc(2.7778vw + 2.67px), 24px); }

	.article__body h2,
	.article__sources-title {
		font-size: clamp(23px, calc(6.25vw + 2px), 50px);
		line-height: 0.98;
		letter-spacing: -0.02em;
	}

	.article__body h3 { font-size: clamp(17px, calc(3.4722vw + 5.33px), 32px); }

	.article__body blockquote p,
	.article__body .wp-block-quote p { font-size: clamp(12px, calc(1.3889vw + 7.33px), 18px); }

	.article__tags-label,
	.share__label { font-size: clamp(13px, 3.75vw, 18px); }

	.article__tag { font-size: clamp(13px, 3.3333vw, 16px); }

	/* Значки «поделиться» на планшете и мобильном крупнее — 32px. */
	.share { gap: clamp(10px, 3.3333vw, 16px); }
	.share__list { gap: clamp(10px, 3.3333vw, 16px); }
	.share__btn { width: clamp(24px, 6.6667vw, 32px); height: clamp(24px, 6.6667vw, 32px); }
	.share__done { font-size: clamp(11px, 2.9167vw, 14px); }

	.material-card {
		gap: clamp(14px, 4.1667vw, 20px);
		padding: clamp(20px, 6.4583vw, 31px);
		border-radius: clamp(24px, 8.3333vw, 40px);
	}

	.material-card__title { font-size: clamp(18px, 5vw, 24px); }
	.material-card__text { font-size: clamp(13px, 3.3333vw, 16px); }
}

/* --- Мобильный (эталон — фрейм 480) --- */

@media (max-width: 520px) {
	/* Факты о материале уходят под заголовок: display:contents поднимает
	   «глазок» и факты на уровень шапки, дальше их разводит order. */
	.article__meta { display: contents; }
	.article__head { gap: clamp(14px, 4.1667vw, 20px); }
	.article__title { order: 2; }
	.article__meta-facts { order: 3; align-self: start; }

	.article__cover { aspect-ratio: 448 / 594; }

	.toc { gap: clamp(3px, 0.8333vw, 4px); }
	.toc li { margin-left: clamp(15px, 4.375vw, 21px); }
	.toc__item { font-size: clamp(12px, 2.9167vw, 14px); }

	.article__body h2,
	.article__sources-title { line-height: 1; letter-spacing: 0; }
}

/* -------------------------------------------------------------------------
   36. Материал: отступы вокруг нижнего баннера

   Общая сетка секций разводит блоки на ~200px, а в макете статьи между
   текстом, баннером и подвалом ровно по 20px. Селектор с .site-main нужен,
   чтобы перебить .site-main > .section:last-child из раздела 3.
   ---------------------------------------------------------------------- */

.single-material .article { padding-bottom: 0; }

.single-material .site-main > .section.banner {
	padding-top: clamp(12px, 1.0417vw, 20px);
	padding-bottom: clamp(12px, 1.0417vw, 20px);
}

/* Свой отступ подвала (100px) здесь лишний: зазор до него уже задан
   нижним padding баннера. */
.single-material .site-footer { margin-top: 0; }

@media (max-width: 1024px) {
	.single-material .site-main > .section.banner {
		padding-top: clamp(24px, 8.3333vw, 40px);
		padding-bottom: clamp(24px, 8.3333vw, 40px);
	}
}

@media (max-width: 768px) {
	body.single-material .site-main { padding-top: var(--header-h-sm); }
}

/* Подвал переходит в одну колонку только с 720px, а его мобильная раскладка
   включается с 768px. В полосе 721–768 вторая колонка распирала сетку по
   содержимому, страница становилась шире экрана и появлялась горизонтальная
   прокрутка — на всех страницах, не только у материалов. */
@media (max-width: 768px) {
	.site-footer .site-footer__inner { grid-template-columns: minmax(0, 1fr); }
}


/* -------------------------------------------------------------------------
   Чекбоксы, cookie-баннер, 404 и документы в подвале — адаптив.
   Блоки идут последними, чтобы перебивать общие правила той же силы
   (см. ловушку со специфичностью :is(...) выше по файлу).
   ---------------------------------------------------------------------- */

@media (max-width: 768px) {
	.lead-form__consent { font-size: 14px; gap: 8px; }

	/* Нижняя строка подвала на планшете распадается: лого и контакты остаются
	   в сетке, документы уходят под них отдельной строкой. */
	.site-footer .site-footer__bottom { display: contents; }

	.site-footer .site-footer__legal {
		grid-column: 1 / -1;
		grid-row: 5;
		flex-direction: column;
		align-items: stretch;
		gap: clamp(16px, 3.125vw, 24px);
		font-size: clamp(13px, 1.8229vw, 14px);
	}

	.site-footer .site-footer__requisites { flex: none; }

	.site-footer .site-footer__docs {
		flex: none;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: clamp(12px, 2.0833vw, 16px) clamp(24px, 5.2083vw, 40px);
	}

	.site-footer .site-footer__docs li { flex: 0 1 clamp(220px, 40vw, 300px); }

	/* Мобильная шапка выше, чем --header-h (у неё свои размеры в блоке 768):
	   считаем отступ с запасом, иначе заголовок подлезает под логотип. */
	.site-main > .error-404:first-child {
		padding-top: calc(var(--header-h) + clamp(56px, 14vw, 96px));
	}

	/* 404: текст сверху, «404» с Атлантом — под ним во всю ширину. */
	.error-404__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: clamp(24px, 5.2083vw, 40px);
		min-height: 0;
	}

	.error-404__art { align-self: stretch; flex: none; }

	/* В макете цифра — 0.73 ширины блока «404», поэтому Атлант заходит на неё.
	   Ниже 768px блок занимает почти всю ширину экрана: 0.73 × ~93vw ≈ 68vw. */
	.error-404__digit { font-size: min(68vw, 560px); }
}

@media (max-width: 520px) {
	.lead-form__foot { gap: 20px; }
	.lead-form__consent { font-size: 13px; }

	/* Подвал по мобильному фрейму 480: лого, под ним соцсети, телефон и почта
	   столбиком, в самом низу — реквизиты и документы. */
	.site-footer .site-footer__inner { gap: 40px; }

	.site-footer .site-footer__logo   { grid-row: 4; }
	.site-footer .site-footer__aside  { grid-row: 5; }
	.site-footer .site-footer__legal  { grid-row: 6; }

	.site-footer .site-footer__aside {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 16px;
		text-align: left;
		font-size: 24px;
	}

	/* В мобильном макете соцсети снова видны — на планшете их прячут. */
	.site-footer .site-footer__socials { display: flex; }

	/* Телефон и почта идут отдельными строками: обёртка снова прозрачная. */
	.site-footer .site-footer__contacts { display: contents; }

	.site-footer .site-footer__legal {
		grid-column: 1;
		gap: 20px;
		font-size: 16px;
	}

	.site-footer .site-footer__docs {
		flex-direction: column;
		gap: 20px;
	}

	.site-footer .site-footer__docs li { flex: none; }

	/* Баннер на всю ширину экрана, кнопки — одной строкой. */
	.cookie {
		left: 8px;
		right: 8px;
		bottom: 8px;
		width: auto;
		padding: 16px;
	}

	.cookie__view { gap: 16px; }
	.cookie__text { font-size: 15px; }

	.cookie__actions { gap: 6px; }
	.cookie__btn { min-height: 48px; padding: 6px 12px; font-size: 15px; }
	.cookie__link { padding: 6px 2px; font-size: 15px; }
}

/* На 404 Атлант уходит прямо под подвал, как в макете, — собственный отступ
   подвала здесь лишний. Правило идёт последним: :is(…) .site-footer из
   мобильного слоя имеет ту же силу и иначе перебивает его. */
.error404 .site-footer { margin-top: 0; }

/* =========================================================================
   38. Правки по обратной связи клиента
   -------------------------------------------------------------------------
   Блок намеренно последний в файле: мобильные слои выше объявлены длинными
   селекторами через :is(...), и перебить их можно только равной
   специфичностью ниже по файлу (см. раздел 31 и мобильные слои).
   ========================================================================= */

/* --- 4. Карточки блока проблем: видимые границы и меньше пустоты ---------
   На светлом фоне карточки без обводки читались как непрогруженные. Даём
   тонкий золотисто-бежевый контур, мягкую тень той же гаммы и сокращаем
   внутренние поля. Мобильная сетка ниже 769px живёт своими правилами. */
@media (min-width: 769px) {
	.cards-grid .num-card {
		min-height: clamp(180px, 14.5833vw, 280px);
		padding: clamp(14px, 1.1458vw, 22px);
		border: 1px solid rgba(184, 152, 60, 0.4);
		border-radius: var(--r-md);
		background: rgba(255, 255, 255, 0.45);
		box-shadow: 0 12px 30px -22px rgba(97, 78, 35, 0.5);
	}

	.cards-grid .num-card__body {
		padding: clamp(8px, 0.8333vw, 16px) clamp(8px, 0.8333vw, 16px) clamp(6px, 0.5208vw, 10px);
	}

	.cards-grid .num-card__text { margin-top: clamp(14px, 1.5625vw, 30px); }

	/* Золотая заливка на наведении лежит в ::before под карточкой — гасим
	   собственный фон, иначе он её перекрывает. */
	.cards-grid .num-card:hover { background: transparent; border-color: transparent; }
}

/* --- 5. Карточки этапов подключения: заметные границы и меньше высоты ---- */
@media (min-width: 769px) {
	.steps .step-card {
		/* Квадрат 355×355 из макета давал большую пустую зону под заголовком. */
		aspect-ratio: 355 / 258;
		padding: clamp(14px, 1.1458vw, 22px);
		box-shadow:
			inset 0 0 0 1.5px rgba(184, 152, 60, 0.55),
			0 12px 30px -22px rgba(97, 78, 35, 0.5);
	}

	.steps .step-card:hover { box-shadow: none; }
}

/* --- 7. «До передачи» / «После подключения» ------------------------------
   Обводки обеих колонок сведены в разделе 25; здесь только мобильный слой,
   где «После» тоже была выделена золотым. */
.compare .compare__col--after { border: 1px solid rgba(24, 25, 31, 0.25); }

/* Цифра набрана крупнее строки, и при выравнивании по базовой линии текст
   оказывался ниже её оптического центра. В этих списках строки короткие,
   поэтому центрируем их по цифре. */
.compare .num-list__item { align-items: center; }

/* Каждый пункт — своя сетка, а колонка номера задана как auto. В Hint цифры
   разной ширины («1» — 0.374em против 0.586em у «2»), поэтому после отказа
   от ведущих нулей строка первого пункта уезжала влево. Табличные цифры
   уравнивают ширину, min-width страхует, если шрифт не загрузился. */
.num-list__num {
	min-width: 0.6em;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

/* --- 9. Короткий стеклянный блик на золотой кнопке «Обсудить задачу» -----
   Запускается один раз, когда кнопка попадает в кадр (класс is-shine ставит
   initShine в main.js), и ещё раз на наведении. Ниже — отключение при
   prefers-reduced-motion. */
.hero-home__actions .btn,
.hero-inner__actions .btn,
.banner__actions .btn,
.lead-form__foot button[type="submit"] { --shine-w: 36%; }

.hero-home__actions .btn::after,
.hero-inner__actions .btn::after,
.banner__actions .btn::after,
.lead-form__foot button[type="submit"]::after {
	content: "";
	position: absolute;
	top: -60%;
	bottom: -60%;
	left: 0;
	z-index: 1;
	width: var(--shine-w);
	background: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.42) 50%,
		rgba(255, 255, 255, 0) 100%
	);
	transform: translateX(-150%) rotate(12deg);
	pointer-events: none;
	opacity: 0;
}

.hero-home__actions .btn.is-shine::after,
.hero-inner__actions .btn.is-shine::after,
.banner__actions .btn.is-shine::after,
.lead-form__foot button[type="submit"].is-shine::after,
.hero-home__actions .btn:hover::after,
.hero-inner__actions .btn:hover::after,
.banner__actions .btn:hover::after,
.lead-form__foot button[type="submit"]:hover::after {
	animation: btn-shine 5s linear infinite;
}

/* Проход идёт с постоянной скоростью ~1.7s: резкий easeOutQuint пролетал
   кнопку за первые 200ms и дальше еле полз — это и читалось как рывок.
   Остальные 3.3s блик стоит за правым краем, кнопка его обрезает
   (у .btn overflow: hidden), поэтому появления и ухода не видно. */
@keyframes btn-shine {
	0%   { opacity: 1; transform: translateX(-150%) rotate(12deg); }
	34%  { opacity: 1; transform: translateX(340%)  rotate(12deg); }
	100% { opacity: 1; transform: translateX(340%)  rotate(12deg); }
}

/* --- 11. Межстрочный интервал в заголовке первого экрана услуг ----------- */
.hero-inner .hero-inner__title { line-height: 1; }

@media (max-width: 768px) {
	.hero-inner .hero-inner__title { line-height: 1.02; }
}

@media (max-width: 520px) {
	.hero-inner .hero-inner__title { line-height: 1; }
}

/* --- 12. Кнопка на карточке «Не нашли подходящую услугу» -----------------
   Была тёмная, во всю колонку и закрывала лицо статуи. Возвращаем золотую
   заливку, делаем компактной и прижимаем к левому краю контента. */
.banner .banner__card--cta .btn {
	background: var(--c-gold);
	color: var(--c-gold-ink);
}

/* Наведение как у всех золотых кнопок: слева наезжает чёрная заливка.
   Общее .banner .btn::before красит её в золото — под тёмную кнопку баннера,
   а на золотой она сливалась с фоном, и белый текст становился нечитаемым. */
.banner .banner__card--cta .btn::before { background: var(--c-ink); }

.banner .banner__card--cta .btn:hover,
.banner .banner__card--cta .btn:focus-visible { color: var(--c-white); }

.banner .banner__card--cta .banner__actions {
	display: flex;
	justify-content: flex-start;
	margin-top: clamp(24px, 2.6042vw, 50px);
}

@media (max-width: 768px) {
	.banner .banner__card--cta .btn {
		width: auto;
		min-height: 0;
		padding: 14px 24px;
		font-size: 16px;
	}

	.banner .banner__card--cta .btn__arrow { width: 7px; height: 11px; }
	.banner .banner__card--cta .banner__actions { margin-top: 24px; }
}

/* --- 12b. Карточка «Не нашли подходящую услугу» на мобильном -------------
   Контент был растянут по высоте (space-between): заголовок уезжал вниз,
   а между ним и абзацем зиял пустой блок. Собираем текст сверху, кнопку
   держим у нижнего края, карточку делаем чуть ниже и поднимаем фигуру,
   чтобы её не срезало новой высотой. */
@media (max-width: 768px) {
	.banner .banner__card--cta { padding-top: clamp(28px, 6.25vw, 48px); }

	.banner .banner__card--cta .banner__content { justify-content: flex-start; }

	.banner .banner__card--cta .banner__title {
		margin-bottom: clamp(10px, 2.0833vw, 16px);
	}

	.banner .banner__card--cta .banner__actions { margin-top: auto; }

	/* Планшетный кадр был рассчитан на растянутый по высоте текст: после сборки
	   контента наверх между абзацем и фигурой оставалась пустая полоса. */
	.banner .banner__card--cta {
		min-height: clamp(520px, 96vw, 740px);
		aspect-ratio: auto;
	}

	.banner .banner__card--cta .banner__bg { top: 33%; }
}

@media (max-width: 520px) {
	/* Пропорция кадра 448×536 — через min-height, а не aspect-ratio. С ним
	   min-height из блока 768 (520px) переносился в минимальную ширину
	   (520 × 448/536 ≈ 435), и на экране 390 карточка вылезала за край —
	   страница шире экрана, правый край обрезан. Здесь ширина всегда по
	   контейнеру (100vw − 2 × 16), а высота — не меньше 520 и не меньше
	   пропорции: на 480 это прежние 448×536, на 390 — 358×520. */
	.banner .banner__card--cta {
		aspect-ratio: auto;
		min-height: max(520px, calc((100vw - 32px) * 536 / 448));
		padding: 40px 40px 32px;
	}

	.banner .banner__card--cta .banner__bg { top: 16%; }
}

/* --- 4b. «Что общего»: заголовок по центру относительно номера ------------
   Кружок занимал обе строки сетки и прижимался к верху, из-за чего заголовок
   вставал выше его центра. Оставляем номер в строке заголовка и центрируем
   их друг по другу; отбивку до подтекста сокращаем. */
.benefit-row .num-badge {
	grid-row: 1;
	align-self: center;
}

.benefit-row__title { align-self: center; }

.benefits .benefit-row__text { margin-top: clamp(8px, 0.8333vw, 16px); }

/* --- 13 + 22. Компактность карточек услуг и общая плотность на мобильном -
   Меньше вертикальных отступов и внутренних полей у повторяющихся карточек:
   на экран помещается заметно больше содержимого, сетка не ломается. */
@media (max-width: 768px) {
	:root { --section-y: clamp(48px, 9.375vw, 76px); }

	.page-uslugi .services-list__grid { gap: 14px; }

	.page-uslugi .service-card,
	.page-uslugi .service-card--wide,
	.page-uslugi .service-card:nth-child(4),
	.page-uslugi .service-card:nth-child(5) {
		min-height: 0;
		padding: clamp(20px, 3.6458vw, 28px);
	}

	.page-uslugi .service-card__title { margin-block: 16px 8px; }
	.page-uslugi .service-card .chips,
	.page-uslugi .service-card:not(:last-child) .chips { padding-top: 20px; }
}

@media (max-width: 520px) {
	:root { --section-y: clamp(36px, 10vw, 48px); }

	.page-uslugi .services-list__grid { gap: 12px; }

	.page-uslugi .service-card,
	.page-uslugi .service-card--wide { padding: 20px; border-radius: 24px; }

	.page-uslugi .service-card__title { margin-block: 14px 6px; font-size: 22px; }

	.page-uslugi .service-card .chips,
	.page-uslugi .service-card:not(:last-child) .chips { padding-top: 16px; }

	.page-uslugi .service-card .chip,
	.page-uslugi .service-card:not(:last-child) .chip,
	.page-uslugi .service-card:last-child .chip { padding: 9px 16px; font-size: 13px; }

	/* Повторяющиеся карточки по сайту: убираем запас высоты из макета. */
	.section .num-card,
	.section .step-card,
	.section .feature-card,
	.section .service-card,
	.section .contact-card { min-height: 0; }
}

/* --- 14. Список разделов в подвале: золотой треугольник и плотнее строки -- */
.site-footer__nav a {
	display: inline-flex;
	align-items: baseline;
	gap: 0.5em;
}

.site-footer__nav a::before {
	content: "";
	flex: none;
	width: 0.42em;
	height: 0.5em;
	background: var(--c-gold-mark);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transform: translateY(-0.05em);
	transition: transform var(--dur) var(--ease);
}

.site-footer__nav a:hover::before { transform: translate(3px, -0.05em); }

/* Подчёркивание на наведении рисуется псевдоэлементом ::after во всю ширину
   ссылки — со знаком оно должно начинаться от текста, поэтому сдвигаем. */
.site-footer__nav a::after { left: 0.92em; width: calc(100% - 0.92em); }

@media (max-width: 768px) {
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav ul { gap: 14px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons { gap: 12px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons .btn { min-height: 62px; }
}

@media (max-width: 520px) {
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__nav ul { gap: 14px; }
	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons { gap: 12px; }

	:is(.home, .page-baza-znaniy, .page-kak-rabotaem, .page-doverie, .page-resheniya, .page-problemy-biznesa, .page-marketplejsy, .page-sdacha-otchetnosti, .page-konsultaciya-buhgaltera, .page-buhgalteriya-ip, .page-buhgalteriya-ooo, .page-uslugi, .page-kontakty, .single-material, .error404) .site-footer__buttons .btn {
		min-height: 58px;
		padding: 16px 20px;
		font-size: 18px;
	}
}

/* --- 15. Мобильное меню --------------------------------------------------
   Пункты со знаком, интервалы плотнее, «Заказать звонок» — такая же кнопка,
   как остальные CTA, и лёгкая подложка, чтобы меню не выглядело пустым. */
.mobile-nav {
	background:
		radial-gradient(120% 70% at 100% 0%, rgba(235, 201, 124, 0.22) 0%, rgba(235, 201, 124, 0) 60%),
		linear-gradient(180deg, var(--c-beige-soft) 0%, var(--c-bg) 55%);
}

.mobile-nav__inner { gap: 28px; }
.mobile-nav__list { gap: 10px; }

.mobile-nav__list a {
	display: inline-flex;
	align-items: baseline;
	gap: 0.44em;
	font-size: clamp(24px, 6.2vw, 34px);
	line-height: 1.2;
}

.mobile-nav__list a::before {
	content: "";
	flex: none;
	width: 0.36em;
	height: 0.44em;
	background: var(--c-gold-mark);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transform: translateY(-0.06em);
}

.mobile-nav__foot {
	gap: 14px;
	justify-items: stretch;
	padding-top: 20px;
	border-top: 1px solid var(--c-line-soft);
}

.mobile-nav__phone { font-size: var(--fs-lead); text-align: center; }

/* CTA меню приводим к общему виду кнопок сайта. */
.mobile-nav__foot .btn {
	width: 100%;
	justify-content: center;
	padding: 16px 24px;
	font-size: 18px;
}

/* --- 16 + 20. Карточки-фичи: номер и название в одной верхней строке ------
   Заодно карточка становится ниже: пропадает лишний отступ между номером
   и заголовком. Вариант «rows» («База знаний») живёт своей раскладкой. */
.feature-cards:not(.feature-cards--rows) .feature-card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-content: start;
	align-items: center;
	column-gap: clamp(12px, 1.0417vw, 20px);
	row-gap: clamp(12px, 1.25vw, 24px);
	min-height: 0;
}

.feature-cards:not(.feature-cards--rows) .feature-card .num-badge {
	grid-column: 1;
	grid-row: 1;
}

.feature-cards:not(.feature-cards--rows) .feature-card__title {
	grid-column: 2;
	grid-row: 1;
	max-width: none;
	margin-block: 0;
	line-height: 1.1;
}

.feature-cards:not(.feature-cards--rows) .feature-card__text {
	grid-column: 1 / -1;
	grid-row: 2;
}

@media (min-width: 769px) {
	.feature-cards:not(.feature-cards--rows) .feature-card {
		padding: clamp(24px, 2.2917vw, 44px);
	}
}

/* На узких экранах карточка стала ниже, и абсолютная иллюстрация в правом
   нижнем углу наехала бы на последние строки. Переводим её в саму сетку —
   она встаёт справа от названия и ничего не перекрывает. */
@media (max-width: 768px) {
	.feature-cards:not(.feature-cards--rows) .feature-card {
		grid-template-columns: auto minmax(0, 1fr) auto;
		padding: clamp(20px, 3.9063vw, 30px);
	}

	.feature-cards:not(.feature-cards--rows) .feature-card__text {
		grid-column: 1 / -1;
		max-width: none;
	}

	.feature-cards:not(.feature-cards--rows) .feature-card__ill,
	.page-doverie .feature-cards__grid > .feature-card:nth-child(3) .feature-card__ill {
		position: static;
		grid-column: 3;
		grid-row: 1;
		width: clamp(52px, 11.5vw, 72px);
		height: clamp(52px, 11.5vw, 72px);
		max-width: none;
		object-fit: contain;
		object-position: center;
	}

	.feature-cards:not(.feature-cards--rows) .feature-card__title {
		max-width: none;
		font-size: clamp(20px, 4.6875vw, 24px);
	}

	/* Чек-лист обрезан по рисунку, без прозрачных полей соседей, — в общем
	   боксе он читается крупнее. Даём ему меньший бокс. */
	.page-doverie .feature-cards__grid > .feature-card:nth-child(1) .feature-card__ill {
		width: clamp(34px, 7.5vw, 47px);
		height: clamp(34px, 7.5vw, 47px);
		margin-right: clamp(8px, 2.0833vw, 14px);
	}
}

/* --- 20b. Иконка «Прозрачного процесса» в размер соседних ----------------
   ill-checklist.png обрезан по самому рисунку, а ill-pin / ill-team / ill-gears
   нарисованы с прозрачными полями ~15-20%. При одинаковой высоте бокса
   чек-лист выглядел крупнее соседей и упирался в угол карточки. Сжимаем бокс
   до их «полезной» части и отбиваем от края на те же поля. */
@media (min-width: 769px) {
	.page-doverie .feature-cards__grid > .feature-card:nth-child(1) .feature-card__ill {
		right: clamp(32px, 3.6458vw, 70px);
		bottom: clamp(22px, 2.6042vw, 50px);
		height: clamp(80px, 7.5521vw, 145px);
	}
}

/* --- 21. Печать в блоке доверия ----------------------------------------- */
.trust__stamp {
	grid-column: 1 / -1;
	justify-self: end;
	width: clamp(84px, 7.8125vw, 150px);
	margin-top: clamp(20px, 2.0833vw, 40px);
	opacity: 0;
	pointer-events: none;
}

.trust__stamp img {
	width: 100%;
	height: auto;
	filter: saturate(0.85) contrast(1.05);
}

.trust__stamp.is-stamped {
	animation: trust-stamp 0.55s var(--ease-out) 1 forwards;
}

/* Конечный наклон печати задаётся переменной: у логотипа на главной −8°,
   у треугольной печати на «Доверии» −30°. Промежуточные кадры считаются от неё. */
@keyframes trust-stamp {
	0%   { opacity: 0; transform: scale(2) rotate(calc(var(--stamp-angle, -8deg) - 8deg)); }
	55%  { opacity: 0.95; transform: scale(0.94) rotate(calc(var(--stamp-angle, -8deg) + 1deg)); }
	75%  { transform: scale(1.03) rotate(calc(var(--stamp-angle, -8deg) - 1deg)); }
	100% { opacity: 0.9; transform: scale(1) rotate(var(--stamp-angle, -8deg)); }
}

/* --- 21a. Печать ООО на странице «Доверие» ------------------------------
   Треугольная печать stamp.png стоит после четырёх карточек, повёрнута влево
   на 30° и отрицательным отступом заходит на нижний правый угол последней
   карточки «Масштабируемая поддержка». Печать идёт в DOM позже карточки,
   поэтому с position: relative она рисуется поверх неё. */
.trust__stamp--seal {
	--stamp-angle: -30deg;
	position: relative;
	z-index: 1;
	width: clamp(120px, 10.4167vw, 200px);
	margin-top: calc(clamp(60px, 5.2083vw, 100px) * -1);
	margin-right: clamp(40px, 4.1667vw, 80px);
}

.trust__stamp--seal img {
	filter: none;
}

@media (max-width: 768px) {
	.trust__stamp--seal {
		width: clamp(100px, 25vw, 140px);
		margin-top: -50px;
		margin-right: 32px;
	}
}

/* --- Доступность: блик и печать выключены вместе с остальным движением --- */
@media (prefers-reduced-motion: reduce) {
	.hero-home__actions .btn::after,
	.hero-inner__actions .btn::after,
	.banner__actions .btn::after,
	.lead-form__foot button[type="submit"]::after { content: none; }

	.trust__stamp { opacity: 0.9; animation: none; transform: rotate(var(--stamp-angle, -8deg)); }
}

/* --- «Финансовая аналитика»: иллюстрация без среза сверху ----------------
   Картинка квадратная, а рамка слоя задана в процентах от ширины и высоты
   плитки — квадратом она была только в пропорциях десктопной карточки
   435×600. На плитках других пропорций рамка сплющивалась, и cover срезал
   верх графика. Держим рамку квадратной от ширины; лишнее уходит вниз,
   под размытие и обрез плитки. */
.home .slider-cards .media-tile:nth-child(5) .media-tile__layer {
	height: auto !important;
	aspect-ratio: 1;
}

/* --- «Финансовая система поддержки бизнеса» → «Понятный путь подключения» --
   На десктопе картинка стоит в нижнем углу сетки и должна вплотную лечь
   на бежевую подложку шагов: убираем нижнее поле trust и верхнее у steps.
   Ниже 1201px сетка trust в одну колонку, картинка уже не внизу — не трогаем. */
@media (min-width: 1201px) {
	.home .trust { padding-bottom: 0; }
	.home .trust + .steps { padding-top: 0; }

	/* Картинка прижата к подложке, а тезисы — нет: поднимаем их над ней. */
	.home .trust__list { padding-bottom: clamp(40px, 3.125vw, 60px); }

	/* Низ картинки мягко расфокусирован: размытие поверх кадра и маска
	   от прозрачного к сплошному, чтобы граница блюра не читалась полосой. */
	.home .trust__media { position: relative; }

	.home .trust__media::after {
		content: "";
		position: absolute;
		inset: 80% 0 0;
		backdrop-filter: blur(4px);
		-webkit-backdrop-filter: blur(4px);
		mask-image: linear-gradient(to bottom, transparent, #000 75%);
		-webkit-mask-image: linear-gradient(to bottom, transparent, #000 75%);
		pointer-events: none;
	}
}

/* --- «Выберите решение для своего бизнеса»: пилюли плотнее ---------------
   Фон 10% белого почти не читался поверх иллюстраций — добавляем размытие
   подложки и немного плотности, сохраняя стеклянный вид. */
.page-uslugi .service-card .chip {
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

/* --- «Консультация бухгалтера»: иллюстрация крупнее и по центру ----------
   Широкая карточка на всю строку: квадратная картинка 832×832 целиком,
   без обреза cover, и по центру высоты карточки. Центрируем через
   margin-block: auto, а не transform — transform занят подъёмом на ховере. */
@media (min-width: 769px) {
	.page-uslugi .service-card--wide .service-card__ill {
		top: 0;
		bottom: 0;
		right: clamp(8px, 1.0417vw, 20px);
		margin-block: auto;
		width: clamp(300px, 29vw, 560px);
		height: clamp(300px, 29vw, 560px);
		object-fit: contain;
	}
}

/* =========================================================================
   39. Правки по макету Figma от 01.10.2026 (страницы услуг)

   Значения сняты с макета (get_design_context / REST), ноды указаны у блоков.
   Перевод в fluid — как во всём файле: максимум при 1920, vw = px / 19.2.
   Заголовки и подписи, у которых в макете text-box-trim, обрезаем тем же
   свойством text-box: так отступы совпадают с макетом в Chrome и Safari;
   в Firefox свойство пока не поддерживается и отступы чуть больше.
   ========================================================================= */

/* --- Тёмная кнопка (ценовой баннер, Figma 1070:5305): #18191f, текст #fdfcfb,
   на ховере заливается золотом, как кнопки баннеров. */
.btn--dark { background: var(--c-ink); color: #fdfcfb; }
.btn--dark::before { background: var(--c-gold); }
.btn--dark:hover,
.btn--dark:focus-visible { color: var(--c-gold-ink); }

/* --- Цена «от 12 900₽/ мес» (Figma 1038:5762): подписи 36, число 44 (в баннере 50).
   Кегль абзаца = кегль числа: обрезка по капители считается по нему, как в макете. */
.price {
	margin: 0;
	font-family: var(--font-display);
	/* Число в 44/36 от подписей. От --fs-h3, а не своим clamp: на ≤768 страницы
	   переопределяют --fs-h3, и подписи иначе становились крупнее числа. */
	font-size: var(--price-size, calc(var(--fs-h3) * 44 / 36));
	line-height: 1;
	letter-spacing: 0;
	color: var(--c-ink);
	white-space: nowrap;
	text-box: trim-both cap alphabetic;
}

.price__prefix,
.price__suffix { font-size: var(--fs-h3); }

/* --- Карточки услуг с ценой («Все услуги», Figma 1012:6338) -------------- */
.price-cards__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
}

.price-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 2.0833vw, 40px);
	padding: clamp(24px, 2.0833vw, 40px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	background: var(--c-beige);
	overflow: hidden;
	isolation: isolate;
	transition: var(--t-lift);
}

.price-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }

.price-card__body {
	display: flex;
	flex-direction: column;
	gap: clamp(12px, 1.0417vw, 20px);
}

.price-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--c-ink);
	text-box: trim-both cap alphabetic;
}

.price-card__text {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

.price-card__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: clamp(8px, 0.625vw, 12px) clamp(12px, 1.6667vw, 32px);
	margin-top: auto;
}

/* Кнопка в карточке ниже обычной: 74 против 84 (поля 25 при подписи 24/1). */
.price-card .btn {
	position: relative;
	z-index: 3;
	padding-block: clamp(12px, 1.3021vw, 25px);
}

/* Иллюстрация 169×207 у правого верхнего угла: отступ сверху 0, справа 26,
   тень 15/15/40 под 12% — в макете это тень слоя с прозрачностью, поэтому
   drop-shadow, а не box-shadow. */
.price-card__ill {
	position: absolute;
	top: 0;
	right: clamp(13px, 1.3542vw, 26px);
	z-index: 1;
	width: clamp(110px, 8.8021vw, 169px);
	height: clamp(135px, 10.7813vw, 207px);
	overflow: hidden;
	filter: drop-shadow(15px 15px 40px rgba(0, 0, 0, 0.12));
	transition: transform 0.75s var(--ease-lift);
}

.price-card__ill img { width: 100%; height: 100%; object-fit: cover; }

/* «ИП»: в макете картинка в кадре сдвинута — 122.49% ширины, −16.17% слева. */
.price-card__ill--crop img {
	position: absolute;
	top: -0.16%;
	left: -16.17%;
	width: 122.49%;
	max-width: none;
	height: 100%;
	object-fit: fill;
}

/* «Консультация»: кадр крупнее — 190×233. */
.price-card__ill--lg {
	width: clamp(124px, 9.8958vw, 190px);
	height: clamp(152px, 12.1354vw, 233px);
}

.price-card:hover .price-card__ill { transform: translateY(-6px) scale(1.04); }

/* Вся карточка ведёт на страницу услуги, кнопка — поверх ссылки.
   Рамка фокуса внутрь: снаружи её срезал бы overflow карточки. */
.price-card__link { position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.price-card__link:focus-visible { outline-offset: -3px; }

/* 721–1365px: иллюстрация заходила на конец строк описания. Колонке текста
   оставляем место под картинку, а переносы макета (br-lg) здесь выключаем —
   иначе после естественного переноса оставалось слово-сирота. */
@media (min-width: 721px) and (max-width: 1365px) {
	.price-card__body {
		padding-right: calc(clamp(110px, 8.8021vw, 169px) + clamp(13px, 1.3542vw, 26px) - clamp(24px, 2.0833vw, 40px) + 8px);
	}

	.price-card:has(.price-card__ill--lg) .price-card__body {
		padding-right: calc(clamp(124px, 9.8958vw, 190px) + clamp(13px, 1.3542vw, 26px) - clamp(24px, 2.0833vw, 40px) + 8px);
	}

	.price-card__text br { display: none; }
}

/* --- Тезисы строками (Figma 1048:12495; «Все услуги» — 1041:12075) -------- */
.num-rows__list {
	display: grid;
	gap: var(--gap);
	padding-inline: clamp(0px, 18.0729vw, 347px);
	counter-reset: none;
}

.num-row {
	display: flex;
	align-items: center;
	gap: clamp(14px, 1.5625vw, 30px);
	padding: clamp(16px, 1.5625vw, 30px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
}

/* Двойной класс: старые постраничные правила .num-badge (0,2,0) иначе
   перебивали размер на мобильных, и кружки были 50 на одних страницах и 40 на других. */
.num-rows .num-row__num {
	width: clamp(40px, 3.125vw, 60px);
	height: clamp(40px, 3.125vw, 60px);
}

/* Золотая черта 3px #efdfb9 на всю высоту текста. В макете это линия:
   места в раскладке она не занимает и рисуется левее своей точки, поэтому
   −3px слева — текст стоит в 30 от неё, как в макете. */
.num-row__line {
	flex: none;
	align-self: stretch;
	width: 3px;
	margin-left: -3px;
	background: #efdfb9;
}

.num-row__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: clamp(12px, 1.0417vw, 20px);
	min-width: 0;
}

.num-row__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--c-ink-alt);
	text-box: trim-both cap alphabetic;
}

.num-row__text {
	font-size: var(--fs-lead);
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: rgba(27, 24, 31, 0.8);
}

/* «Все услуги»: черта фиксированной высоты 120.27 и отбивка 10 в тексте. */
.num-rows--tall .num-row__line { align-self: center; height: clamp(80px, 6.2639vw, 120.266px); }
.num-rows--tall .num-row__body { gap: clamp(6px, 0.5208vw, 10px); }

/* --- Список на фото колонн (Figma 1055:9845) ----------------------------- */
/* Поля 100 / 100 / 100 / 344 минус обводка 1px: в макете она внутри кадра. */
.media-list__card {
	position: relative;
	padding:
		clamp(39px, 5.1563vw, 99px)
		clamp(23px, 5.1563vw, 99px)
		clamp(39px, 5.1563vw, 99px)
		clamp(23px, 17.8646vw, 343px);
	border: 1px solid var(--c-line-hard);
	border-radius: var(--r-md);
	overflow: hidden;
	isolation: isolate;
}

/* Слой фона отражён, как вся карточка в макете: фото растянуто в кадр
   103.71% × 115.98% со сдвигом −3.76% / −7.87%, сверху вуаль #fdfbfa
   от 0 до 50% на отрезке 12.78–45.08% ширины. */
.media-list__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	overflow: hidden;
	transform: scaleX(-1);
}

.media-list__bg img {
	position: absolute;
	top: -7.87%;
	left: -3.76%;
	width: 103.71%;
	max-width: none;
	height: 115.98%;
	object-fit: fill;
}

.media-list__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(253, 251, 250, 0) 12.778%, rgba(253, 251, 250, 0.5) 45.083%);
}

.media-list__items {
	display: grid;
	gap: clamp(20px, 2.2917vw, 44px);
}

.media-list__item {
	display: flex;
	align-items: center;
	gap: clamp(10px, 0.8333vw, 16px);
}

.media-list__text {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--c-ink-alt);
	text-box: trim-both cap alphabetic;
}

/* --- Ценовой баннер (Figma 1070:5289) ------------------------------------ */
.price-banner__card {
	position: relative;
	padding: clamp(40px, 8.5938vw, 165px);
	border: 1px solid var(--c-line-hard);
	border-radius: clamp(20px, 1.9271vw, 37px);
	background: #e4d9cf;
	overflow: hidden;
	isolation: isolate;
}

/* Рендер фона 1800×718 при карточке 1800×683: прижат к верхнему левому углу,
   лишнее снизу срезается — как в макете. */
.price-banner__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left top;
}

.price-banner__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(28px, 3.125vw, 60px);
	max-width: 962px;
}

.price-banner__title {
	font-family: var(--font-display);
	font-size: var(--fs-h2);
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: -0.02em;
	color: var(--c-ink);
	text-box: trim-both cap alphabetic;
}

.price-banner__title .line { display: block; }

.price-banner .price { --price-size: calc(var(--fs-h3) * 50 / 36); }

/* --- «Всё, что нужно знать о стоимости услуг» (Figma 1049:12892) ---------- */
.faq--price .faq__list { padding-inline: clamp(0px, 18.0729vw, 347px); }

.faq--price .faq__trigger { line-height: 1.4; }
.faq--price .faq__trigger > span:first-child { text-box: trim-both cap alphabetic; }

/* Крестик в макете толще обычного: штрихи 3px. */
.faq--price .faq__icon::before { height: 3px; }
.faq--price .faq__icon::after  { width: 3px; }

.faq__bullets {
	padding-top: clamp(20px, 2.0833vw, 40px);
	padding-left: clamp(24px, 1.875vw, 36px);
	list-style: disc;
}

.faq__actions { justify-self: start; }

/* --- Две карточки выбора (Figma 1012:6456) -------------------------------
   Поля 40, заголовок 36, отбивки 40, обводка 25% чёрного; на ховере золотая
   рамка 3px (в макете так нарисована первая карточка). Только для ПК и
   планшета: мобильную геометрию задают слои выше. */
@media (min-width: 769px) {
	.two-choice__grid { padding-left: clamp(0px, 18.0729vw, 347px); }

	.choice-card {
		gap: clamp(20px, 2.0833vw, 40px);
		padding: clamp(24px, 2.0833vw, 40px);
		border-color: rgba(24, 25, 31, 0.25);
	}

	.choice-card:hover,
	.choice-card.is-active {
		border-color: var(--c-gold);
		box-shadow: inset 0 0 0 2px var(--c-gold), var(--shadow-card);
	}

	.choice-card__title {
		font-size: var(--fs-h3);
		line-height: 1.4;
		letter-spacing: 0;
		text-box: trim-both cap alphabetic;
	}

	.choice-card .num-list { gap: clamp(12px, 1.0417vw, 20px); margin: 0; }
	.choice-card .num-list__item { align-items: center; }
	.choice-card .num-list__num { text-box: trim-both cap alphabetic; }
}

/* --- Плашки налоговых режимов (Figma 1041:11509): белые, рамка 2px #ebc97c,
   поля 12 / 32 / 12 / 20, иконка высотой 24, отбивка 10, подпись 24/1.4.
   Рамка в макете внутри плашки, поэтому из полей вычтены её 2px: 58 по высоте. */
@media (min-width: 769px) {
	:is(.page-buhgalteriya-ooo, .page-buhgalteriya-ip) .media-card .chip {
		gap: clamp(6px, 0.5208vw, 10px);
		padding:
			clamp(6px, 0.5208vw, 10px)
			clamp(18px, 1.5625vw, 30px)
			clamp(6px, 0.5208vw, 10px)
			clamp(10px, 0.9375vw, 18px);
		border-width: 2px;
		line-height: 1.4;
		color: var(--c-ink-alt);
	}

	:is(.page-buhgalteriya-ooo, .page-buhgalteriya-ip) .media-card .chip__icon { transform: none; }
	:is(.page-buhgalteriya-ooo, .page-buhgalteriya-ip) .media-card .chip__icon svg { height: clamp(16px, 1.25vw, 24px); }

	/* Ширина ряда плашек задаёт перенос: ООО 802 (3 + 2), ИП 842 (4 + 2).
	   У ИП +20: на сайте кавычки «ёлочки» вместо “лапок” макета, они шире,
	   и без запаса четвёртая плашка уходила во второй ряд. */
	.page-buhgalteriya-ooo .media-card .chips { max-width: clamp(560px, 41.7708vw, 802px); }
	.page-buhgalteriya-ip .media-card .chips  { max-width: clamp(604px, 44.8958vw, 862px); }
}

/* --- Адаптив новых блоков ------------------------------------------------
   Мобильных фреймов для этих блоков в макете нет: раскладка повторяет
   соседние блоки тех же страниц (одна колонка, поля 24/20). */
@media (max-width: 1024px) {
	.price-cards__grid { grid-template-columns: 1fr; }
	.num-rows__list,
	.faq--price .faq__list { padding-inline: 0; }
	.media-list__card { padding-left: clamp(24px, 6vw, 60px); }
}

@media (max-width: 768px) {
	/* Текст стоит поверх фото — вуаль на всю карточку, чтобы он читался. */
	.media-list__bg::before,
	.price-banner__card::after {
		content: "";
		position: absolute;
		inset: 0;
		pointer-events: none;
	}

	.media-list__bg::before { z-index: 1; background: rgba(253, 251, 250, 0.55); }

	.price-banner__card::after {
		z-index: -1;
		background: linear-gradient(90deg, rgba(253, 252, 251, 0.92) 0%, rgba(253, 252, 251, 0.75) 55%, rgba(253, 252, 251, 0.2) 100%);
	}

	.price-banner__bg { object-position: 70% top; }
}

@media (max-width: 720px) {
	.price-card { padding-top: 24px; }
	.price-card__body { padding-right: clamp(110px, 30vw, 150px); }
	.price-card__foot { flex-direction: column; align-items: stretch; }
	.price-card__foot .btn { width: 100%; }
	.price-card__ill { top: 12px; right: 12px; }
}

@media (max-width: 520px) {
	/* Иллюстрация меньше и в углу; от неё отодвинут только заголовок —
	   текст начинается ниже картинки. */
	.price-card__ill { top: 12px; right: 12px; width: 84px; height: 103px; }
	.price-card__ill--lg { width: 94px; height: 115px; }
	.price-card__body { padding-right: 0; }
	.price-card__title { padding-right: 88px; }
	.num-row { align-items: flex-start; }
	.num-row__line { display: none; }
	.media-list__card { padding: 32px 20px; }
	.price-banner__card { padding: 32px 20px; }
	.price-banner .btn,
	.faq__actions,
	.faq__actions .btn { width: 100%; }
}

/* --- Тексты из админки: длинное слово не раздвигает страницу ----------------
   Тексты страниц правит клиент (блок «Тексты страницы»), предел слова — 20 знаков.
   Стресс-тест со словами в 20 широких букв (bin/check-text-limits.py --words hard)
   нашёл три места, где такое слово делало страницу шире экрана: заголовок строки
   списка, таблетка и вопрос FAQ. Здесь слово, которое не помещается, переносится по
   буквам. Только точечно: общее правило на весь блок меняло и тексты макета (надзаголовки
   и подпись согласия шире своих узких колонок — так задумано). С текстами макета эти
   правила не меняют ни одного элемента (геометрия 13 страниц на 7 ширинах). */
.num-row__title,
.faq__trigger > span:first-child { overflow-wrap: anywhere; }
/* У таблеток break-word, а не anywhere: ряд на 1280 сжимает таблетки, и anywhere
   менял, насколько каждая может сжаться (ширина плыла на 2px). */
.pill { max-width: 100%; }
.pill__label { overflow-wrap: break-word; }
.pills--lg .pill__label { white-space: normal; }
