/* Шрифты как на оригинале: Тильда собрала семейство из Helvetica Neue Cyr,
   Exo 2 и Forum — веса 400 и 500 держат основной текст и заголовки. */
@font-face { font-family: 'RubikText'; src: url('../fonts/Exo2-Regular.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'RubikText'; src: url('../fonts/Exo2-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'RubikText'; src: url('../fonts/HelveticaNeueCyr-Rom.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'RubikText'; src: url('../fonts/HelveticaNeueCyr-Med.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'RubikText'; src: url('../fonts/Exo2-SemiBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'RubikText'; src: url('../fonts/Forum.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }

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

/*
 * Размеры сняты с оригинала: секция 900 пикселей, заголовок 63/54, полоса
 * цифр внизу того же экрана. Блоки расставлены по координатам, поэтому на
 * широком экране макет совпадает точь-в-точь; на узких переходим в поток.
 */
.home-hero {
	position: relative;
	/* Замер оригинала: первый экран равен высоте окна, содержимое привязано
	   к середине, а полоса цифр — к низу. */
	height: 100vh;
	min-height: 760px;
	background: var(--wp--preset--color--ink) center / cover no-repeat;
	color: #fff;
	overflow: hidden;
}
.home-hero--photo::before {
	content: "";
	position: absolute; inset: 0;
	background: rgba(0, 0, 0, .2);
}
.home-hero__inner { position: relative; height: 100%; }

.home-hero__title {
	max-width: 1023px;
	position: absolute; top: calc(50% + 132px); left: 0; right: 0;
	margin: 0;
	font-size: 63px;
	line-height: 54px;
	font-weight: var(--wp--custom--weight--medium);
	color: #fff;
	white-space: nowrap;
}

.home-hero__row {
	position: absolute; top: calc(50% + 205px); left: 0; right: 0;
	display: flex; align-items: center; gap: 73px;
}
/* Замер оригинала: кнопка 527×53 со скруглением 10px, подпись без подложки. */
.home-hero .home-hero__cta {
	min-width: 527px;
	padding: 16px 30px;
	font-size: 14px;
	line-height: 21.7px;
	text-align: center;
	border-radius: var(--wp--custom--radius--card);
}
.home-hero__brand {
	padding: 1px 13px;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--sky);
	font-size: 63px;
	line-height: 54px;
	font-weight: var(--wp--custom--weight--medium);
	color: #fff;
}

.home-hero__bubble {
	font-size: var(--wp--preset--font-size--small);
	position: absolute; top: calc(50% + 121px); right: 0;
	width: 166px; height: 166px;
	display: flex; align-items: center; justify-content: center;
	padding: 16px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--sky);
	font-size: var(--wp--preset--font-size--xs);
	line-height: 19px;
	text-align: center;
}

.home-hero__facts {
	/* На оригинале строка цифр начинается за 40 px до низа экрана,
	   подписи уходят ниже — читаются уже при прокрутке. */
	position: absolute; left: 0; right: 0; top: calc(100% - 40px);
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: var(--wp--preset--spacing--40);
}
.home-fact { display: grid; gap: 8px; align-content: start; }
.home-fact__value { font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); }
.home-fact__text { font-size: var(--wp--preset--font-size--small); line-height: 22px; max-width: 22ch; }
.home-fact__note { display: block; margin-top: 6px; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }

@media (max-width: 1200px) {
	.home-hero { height: auto; padding-block: 180px var(--wp--preset--spacing--60); }
	.home-hero__title,
	.home-hero__row,
	.home-hero__bubble,
	.home-hero__facts { position: static; }
	.home-hero__title { font-size: clamp(34px, 5vw, 63px); line-height: 1.05; margin-bottom: var(--wp--preset--spacing--40); white-space: normal; }
	.home-hero__row { flex-wrap: wrap; gap: var(--wp--preset--spacing--40); margin-bottom: var(--wp--preset--spacing--50); }
	.home-hero__cta { min-width: 0; }
	.home-hero__brand { font-size: clamp(34px, 5vw, 63px); line-height: 1.05; }
	.home-hero__bubble { display: none; }
	.home-hero__facts { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--wp--preset--spacing--40); }
}

/* --- Шапка -------------------------------------------------------------- */

/*
 * Полоса лежит поверх первого экрана и просвечивает: на оригинале под ней
 * видно фотографию. Высота 70 пикселей, значок рейтинга выступает ниже.
 */
/* Шапка занимает место в потоке — 70 пикселей, как на оригинале, и первый
   экран начинается под ней. Цветная полоса идёт отдельным слоем и заходит
   на несколько пикселей ниже шапки: тот же #313131 при 0,8 с размытием. */
.site-header {
	/* Без z-index, как на оригинале: он создавал у шапки свой слой, и карточка
	   подменю услуг (z-index 6000000 у Тильды) не могла подняться над попапом
	   меню — открывалась, но пряталась за ним. */
	position: relative;
	height: 70px;
	color: #fff;
}
.site-header::before {
	content: "";
	position: absolute; left: 0; right: 0; top: 0;
	height: 76px;
	background: rgba(49, 49, 49, .8);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
@media (max-width: 1199px) { .site-header::before { height: 75px; } }
@media (max-width: 959px)  { .site-header::before { height: 79px; } }
@media (max-width: 479px)  { .site-header::before { height: 71px; } }
/* На телефоне оригинал отказывается от прозрачности: под полосой лежит
   сплошной #333333, поверх — та же полоса при 0,8. В сумме получается
   #313131, его и ставим. */
@media (max-width: 479px) {
	.site-header::before {
		background: #313131;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}

.site-header__inner {
	position: relative;
	display: flex; align-items: center;
	height: 70px;
	padding-left: 29px;
	padding-right: 22px;
	gap: 18px;
}

/* Логотип с подписью «агентство интернет-маркетинга» */
.site-header__brand { position: relative; top: -2px; display: block; flex: none; text-decoration: none; }
.site-header__logo { display: block; width: 120px; height: auto; }
.site-header__sub { display: block; width: 120px; height: auto; margin-top: -4px; opacity: .75; }
.site-header__brand .custom-logo { display: block; width: 120px; height: auto; }

/* Значок «Рейтинг Рунета»: светлая плашка ниже полосы */
.site-badge-wrap { position: relative; flex: none; align-self: stretch; display: flex; }
.site-badge {
	flex: none;
	align-self: flex-start;
	display: flex; align-items: center; gap: 8px;
	width: 120px; height: 95px;
	margin-top: -14px;
	padding: 0 15px;
	align-items: flex-start;
	border-radius: 12px;
	background: linear-gradient(180deg, #3a3a3a 0%, #323232 100%);
	text-decoration: none;
	color: #e1ae06;
}
.site-badge img { display: block; flex: none; width: 27px; height: 61px; object-fit: contain; margin-top: 28px; }
/* Подпись на оригинале залита градиентом, а не сплошным цветом: 16/16,
   ширина 64, поэтому переносится на две строки. */
.site-badge__text {
	display: block;
	flex: none;
	width: 64px;
	font-size: 16px;
	line-height: 16px;
	font-weight: 400;
	margin-top: 34px;
	background-image: linear-gradient(248deg, #ffe852 0%, #ffff3b 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* Список мест в рейтингах: замер оригинала — полотно 486×196, фон #313131,
   скругление 10, строки через 57, место жёлтым, пояснение белым. */
.site-badge__drop {
	position: absolute; top: calc(100% - 2px); left: -157px;
	width: 486px;
	padding: 20px;
	border-radius: 10px;
	background: #313131;
	display: grid; gap: 15px;
	opacity: 0; visibility: hidden;
	transition: opacity .18s ease, visibility .18s ease;
	z-index: 70;
}
.site-badge-wrap:hover .site-badge__drop,
.site-badge-wrap:focus-within .site-badge__drop { opacity: 1; visibility: visible; }
/* Строка списка: замер оригинала — 446×42, две строки без значка,
   место 18/500 оливковым, пояснение 15/400 белым. */
.site-badge__item {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 446px;
	height: 42px;
	text-decoration: none;
}
.site-badge__place { display: block; font-size: 18px; line-height: normal; font-weight: 500; color: #d6d62f; }
.site-badge__note { display: block; font-size: 15px; line-height: normal; font-weight: 400; color: #fff; }
.site-badge__item:hover .site-badge__place { color: #ff8562; }

/* Меню */
.site-nav { display: flex; align-items: center; gap: 5px; margin-left: 2px; }
.nav { display: flex; align-items: center; gap: 5px; margin: 0; padding: 0; list-style: none; }
.nav a,
.nav-drop__toggle {
	font-size: 14px;
	line-height: 22px;
	color: #fff;
	text-decoration: none;
	background: none;
	border: 0;
	padding: 8px 7px;
	cursor: pointer;
	font-family: inherit;
	white-space: nowrap;
}
.nav a:hover,
.nav-drop__toggle:hover { opacity: .75; }

/* «Услуги» на оригинале выделено светлой подложкой */
.nav-drop:first-child .nav-drop__toggle {
	padding: 5px 14px;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--dark-soft);
}
.nav-drop { position: relative; }
.nav-drop__toggle::after { content: ""; }
.nav-drop:nth-child(2) .nav-drop__toggle::after {
	content: "";
	display: inline-block;
	margin-left: 4px;
	border: 3px solid transparent;
	border-top-color: currentColor;
	transform: translateY(2px);
}
/* Замер оригинала: панель 150 пикселей, начинается на 25 левее кнопки,
   пункты 14 через 31 пиксель. */
.nav-drop__list {
	position: absolute; top: calc(100% + 31px); left: -31px;
	width: 150px;
	padding: 18px 0;
	border-radius: var(--wp--custom--radius--card);
	background: #fff;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
	opacity: 0; visibility: hidden;
	transition: opacity .18s ease, visibility .18s ease;
}
.nav-drop:hover .nav-drop__list,
.nav-drop:focus-within .nav-drop__list { opacity: 1; visibility: visible; }
.nav-drop__menu { margin: 0; padding: 0; list-style: none; }
.nav-drop__menu { display: grid; gap: 12px; }
.nav-drop__menu a {
	display: block;
	padding: 0 20px;
	font-size: 14px;
	line-height: 19px;
	color: #222;
	text-decoration: none;
	white-space: normal;
}
.nav-drop__menu a:hover { background: var(--wp--preset--color--canvas); }

/* Часы работы и телефон: две строки, выключка вправо */
/* Замер оригинала: часы на 859, телефон на 908, обе строки прижаты влево. */
.site-header__contacts {
	margin-left: auto;
	margin-right: 2px;
	display: grid; gap: 0;
	justify-items: start;
	min-width: 196px;
	font-size: 14px;
	line-height: 22px;
}
.site-header__phone { margin-left: 49px; margin-top: -2px; }
.site-header__hours,
.site-header__phone {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 400;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
}
.site-header__hours { color: #fff; }
.site-header__hours img,
.site-header__phone img { display: block; }

/* Мессенджеры */
.site-header__soc { flex: none; display: flex; align-items: center; gap: 12px; }
.site-header__soc a { flex: none; display: block; }
/* Размеры сняты с оригинала: почта 24, вотсап и вконтакте 26, телеграм 21. */
.site-header__soc img { display: block; flex: none; width: 24px; height: 24px; object-fit: contain; }
.site-header__soc a:nth-child(2) img,
.site-header__soc a:nth-child(3) img { width: 26px; height: 26px; }
.site-header__soc a:nth-child(4) img { width: 21px; height: 21px; }
.site-header__soc a:hover { opacity: .75; }

/* Кнопка заявки: прозрачная, в белой рамке */
.site-header__cta {
	display: inline-flex; align-items: center;
	height: 42px;
	padding: 0 18px;
	border: 1px solid #fff;
	border-radius: var(--wp--custom--radius--plate);
	font-size: 13px;
	letter-spacing: .02em;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
}
.site-header__cta:hover { background: rgba(255, 255, 255, .12); }

/* Поиск */
.site-header__search {
	flex: none;
	margin-left: -5px;
	width: 42px; height: 42px;
	display: grid; place-items: center;
	border: 1px solid #fff;
	border-radius: var(--wp--custom--radius--pill);
	background: none;
	cursor: pointer;
}
.site-header__search:hover { background: rgba(255, 255, 255, .12); }
.site-search { padding: var(--wp--preset--spacing--40) 0; background: #fff; }

/* Под шапкой всегда лежит первый экран, поэтому отступ ей не нужен */
.site-main { padding-top: 0; }

@media (max-width: 1200px) {
	.site-header__soc { display: none; }
	.site-header__inner { gap: 18px; padding-inline: 20px; }
}

@media (max-width: 900px) {
	.site-header__cta { display: none; }
	.site-nav {
		position: absolute; top: 70px; left: 0; right: 0;
		flex-direction: column; align-items: flex-start; gap: 14px;
		padding: var(--wp--preset--spacing--40);
		background: var(--wp--preset--color--ink);
	}
	.site-nav[hidden] { display: none; }
	.nav { flex-direction: column; align-items: flex-start; gap: 14px; }
	.nav-drop__list { position: static; opacity: 1; visibility: visible; box-shadow: none; background: none; padding: 6px 0 0; }
	.nav-drop__menu a { color: #fff; padding: 6px 0; }
}

/*
 * Стили темы RubikMedia.
 *
 * Значений числами нет: цвета, размеры и отступы приходят переменными
 * из theme.json. Правка палитры делается там и расходится по сайту.
 */

/* --- Основа ------------------------------------------------------------- */

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

body {
	margin: 0;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--wp--preset--color--accent); }

.container {
	width: 100%;
	max-width: var(--wp--custom--container--max);
	margin-inline: auto;
	padding-inline: var(--wp--custom--container--gutter);
}

.screen-reader-text {
	position: absolute; width: 1px; height: 1px;
	overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.skip-link:focus {
	position: fixed; top: 8px; left: 8px; width: auto; height: auto;
	clip-path: none; padding: 8px 12px; background: var(--wp--preset--color--surface); z-index: 100;
}

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

.button {
	display: inline-block;
	padding: 15px 34px;
	border: 0;
	/* Замер оригинала: у всех кнопок скругление 10px, не капсула. */
	border-radius: var(--wp--custom--radius--card);
	font: inherit;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: .02em;
	text-decoration: none;
	cursor: pointer;
	transition: opacity var(--wp--custom--transition--base);
}
.button--accent { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--surface); }
.button--accent:hover { opacity: 0.85; color: var(--wp--preset--color--surface); }

/* --- Меню: правила выше, в блоке шапки. Здесь только кнопка-гамбургер --- */

.nav-toggle { display: none; background: none; border: 0; padding: 8px; cursor: pointer; margin-left: auto; }
.nav-toggle__box { display: block; width: 24px; height: 2px; background: var(--wp--preset--color--ink); position: relative; }
.nav-toggle__box::before, .nav-toggle__box::after {
	content: ''; position: absolute; left: 0; width: 24px; height: 2px; background: inherit;
}
.nav-toggle__box::before { top: -7px; }
.nav-toggle__box::after { top: 7px; }

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

.site-footer {
	margin-top: var(--wp--preset--spacing--70);
	padding-block: var(--wp--preset--spacing--60);
	background: var(--wp--preset--color--dark);
	color: var(--wp--preset--color--surface);
}
.site-footer a { color: var(--wp--preset--color--surface); text-decoration: none; }
.site-footer a:hover { color: var(--wp--preset--color--accent); }
.site-footer { margin-top: 0; padding-block: 82px 111px; }
.site-footer__inner {
	display: grid; gap: var(--wp--preset--spacing--50);
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.site-footer__title {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--small);
	font-weight: var(--wp--custom--weight--medium);
	color: var(--wp--preset--color--sky-pale);
}
.site-footer__menu { display: grid; gap: var(--wp--preset--spacing--20); margin: 0; padding: 0; list-style: none; }
.site-footer__name { display: block; font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--bold); }
.site-footer__tagline { font-size: var(--wp--preset--font-size--xs); opacity: 0.7; }
.site-footer__phone { display: block; font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--weight--medium); }
.site-footer__email { display: block; margin-top: var(--wp--preset--spacing--20); }
.site-footer__address { margin: var(--wp--preset--spacing--30) 0 0; font-size: var(--wp--preset--font-size--xs); opacity: 0.8; }
.site-footer__soc { display: flex; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--30); }
.site-footer__bottom {
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}
.site-footer__copy, .site-footer__requisites { margin: 0; font-size: var(--wp--preset--font-size--xs); opacity: 0.7; }

/* --- Узкий экран -------------------------------------------------------- */

@media (max-width: 1199px) {
	.nav-toggle { display: block; }
	.site-nav {
		display: none; position: absolute; top: 100%; left: 0; right: 0;
		flex-direction: column; align-items: flex-start; gap: var(--wp--preset--spacing--40);
		padding: var(--wp--preset--spacing--50) var(--wp--custom--container--gutter);
		background: var(--wp--preset--color--surface);
		border-bottom: 1px solid var(--wp--preset--color--line);
	}
	.is-nav-open .site-nav { display: flex; }
	.nav { flex-direction: column; gap: var(--wp--preset--spacing--30); }
	.nav-drop__list { position: static; border: 0; box-shadow: none; padding: var(--wp--preset--spacing--30) 0 0; min-width: 0; }
}

@media (max-width: 640px) {
	.site-header__contacts .button { display: none; }
}

/* --- Хлебные крошки ----------------------------------------------------- */

.crumbs { padding-block: var(--wp--preset--spacing--30); }
.crumbs__list {
	display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20);
	margin: 0; padding: 0; list-style: none;
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--muted);
}
.crumbs__sep { opacity: .5; }
.crumbs a { color: var(--wp--preset--color--muted); text-decoration: none; }
.crumbs a:hover { color: var(--wp--preset--color--accent); }

/* --- Страница и статья -------------------------------------------------- */

.entry--page, .entry--single { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
/* Там, где страница начинается первым экраном, отступа сверху нет: на оригинале
   экран идёт сразу под шапкой. Убираем только в этом случае — на страницах
   с раскладкой копира стилей блоки стоят по абсолютным координатам, и сдвиг
   потока накладывает текст друг на друга. */
.entry--page:has(> .hero), .entry--single:has(> .post-hero) { padding-top: 0; }
.entry__title { margin: 0 0 var(--wp--preset--spacing--30); }
.entry__meta {
	display: flex; gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted);
}
.entry__media { margin: var(--wp--preset--spacing--50) 0; }
.entry__media img { border-radius: var(--wp--custom--radius--block); }
.entry__content { max-width: 800px; }
.entry__content > * + * { margin-top: var(--wp--preset--spacing--40); }
.entry__content h2 { font-size: var(--wp--preset--font-size--x-large); margin-top: var(--wp--preset--spacing--60); }
.entry__content h3 { font-size: var(--wp--preset--font-size--large); }

.page-header { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); }
.page-title { margin: 0; }

/* --- Сетка карточек ----------------------------------------------------- */

.card-grid {
	grid-auto-rows: 1fr;
	display: grid; gap: 40px;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--card);
	overflow: hidden;
	display: flex; flex-direction: column;
}
.card__media img { width: 100%; height: 350px; object-fit: cover; display: block; }
.card__body { padding: var(--wp--preset--spacing--40); display: grid; gap: var(--wp--preset--spacing--20); }
.card__date { font-size: 12px; line-height: 16px; color: var(--wp--preset--color--date); }
.card__title { margin: 0; font-size: 26px; line-height: 32px; font-weight: 600; }
.card__title a { color: #000; text-decoration: none; }
.card__title a:hover { color: var(--wp--preset--color--accent); }
.card__text { margin: 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--xs); }

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

.section { padding-block: 100px; }

/*
 * Фоны чередуются так же, как на оригинале: белый — светло-голубой — белый.
 * Значения сняты с оригинала: var(--wp--preset--color--canvas) и #313131.
 */
.section--team,
.section--reviews,
.section--next,
.section--contacts { background: var(--wp--preset--color--canvas); }

.section--services,
.section--clients,
.section--certificates,
.section--blog { background: #fff; }

.section--cta { background: #fff; }
.section--cta.section--dark { background: var(--wp--preset--color--dark); }
.section--related { background: var(--wp--preset--color--canvas); }
.section__title {
	margin: 0 0 var(--wp--preset--spacing--60);
	font-size: 54px;
	line-height: 49px;
	font-weight: var(--wp--custom--weight--medium);
	max-width: 790px;
}
.section__lead { margin: -30px 0 var(--wp--preset--spacing--60); max-width: 60ch; color: var(--wp--preset--color--muted); }

/* --- Формы и поиск ------------------------------------------------------ */

.search-form { display: flex; gap: 8px; max-width: 480px; }
.search-form input[type="search"] {
	flex: 1; padding: 12px 16px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--card);
	font: inherit;
}
.search-form button {
	padding: 12px 24px; border: 0;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--surface);
	font: inherit; cursor: pointer;
}

.error-404 { padding-block: var(--wp--preset--spacing--70); }

/* --- Постраничная навигация --------------------------------------------- */

.pagination { padding-block: var(--wp--preset--spacing--50); }
.pagination .page-numbers {
	display: inline-block; padding: 10px 16px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--card);
	text-decoration: none; color: var(--wp--preset--color--ink);
}
.pagination .current {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--surface);
}

/* ═══ ПЕРВЫЙ ЭКРАН ═══ */

.hero { padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70); }

/* Первый экран главной: фото команды во всю ширину, поверх — заголовок */
.hero--photo .hero__inner { position: relative; display: block; }
.hero--photo .hero__title { color: #fff; max-width: 24ch; }

/* Полоса с цифрами о компании */

@media (max-width: 780px) {
	.hero--photo { min-height: 460px; }
	.hero__bubble { display: none; }
}
.hero--home, .hero--industry { background: var(--wp--preset--color--canvas); }
.hero__inner {
	display: grid; gap: var(--wp--preset--spacing--50);
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
	align-items: center;
}
.hero__inner:has(.hero__body:only-child) { grid-template-columns: 1fr; }
.hero__over {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase; letter-spacing: 0.08em;
	color: var(--wp--preset--color--accent);
}
.hero__title { margin: 0 0 var(--wp--preset--spacing--30); max-width: 20ch; }
.hero__subtitle {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--muted);
	max-width: 60ch;
}
.hero__lead { margin: 0 0 var(--wp--preset--spacing--40); color: var(--wp--preset--color--muted); max-width: 60ch; }
.hero__note { margin-top: var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--30); align-items: center; }
.hero__phone { font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--weight--medium); color: var(--wp--preset--color--ink); text-decoration: none; }
.hero__media img { border-radius: var(--wp--custom--radius--block); }
.hero__rates { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--50); margin-top: var(--wp--preset--spacing--50); }
.rate { display: grid; gap: 4px; max-width: 200px; }
.rate__place { font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--bold); color: var(--wp--preset--color--accent); }
.rate__text { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.button--ghost {
	background: transparent;
	color: var(--wp--preset--color--ink);
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--line);
}
.button--ghost:hover { box-shadow: inset 0 0 0 1px var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }

/* ═══ ЦИФРЫ ═══ */

.nums { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--50); margin-block: var(--wp--preset--spacing--40); }
.num { display: grid; gap: 4px; max-width: 220px; }
.num__value {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: var(--wp--custom--weight--bold);
	color: var(--wp--preset--color--accent);
	line-height: 1;
}
.num__label { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

/* ═══ УСЛУГИ СПИСКОМ ═══ */

.services { display: grid; }
.service {
	display: grid;
	grid-template-columns: 102px 558px minmax(0, 1fr) 115px;
	align-items: center;
	gap: 0;
	padding-block: 54px;
	border-top: 1px solid var(--wp--preset--color--line);
}
.service:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.service__num {
	font-size: 16px;
	line-height: 22px;
	color: var(--wp--preset--color--accent);
}
.service__title { margin: 0; font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); }
.service__text { margin: 0; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); max-width: 211px; }
.service__link { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); text-decoration: none; white-space: nowrap; }

@media (max-width: 900px) {
	.service { grid-template-columns: 44px 1fr; gap: var(--wp--preset--spacing--20); }
	.service__text, .service__link { grid-column: 2; }
}

/* ═══ ПРЕИМУЩЕСТВА И ПРОБЛЕМЫ ═══ */

.adv-grid { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.adv, .problem {
	display: grid; gap: var(--wp--preset--spacing--20); align-content: start;
	padding: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--canvas);
	border-radius: var(--wp--custom--radius--card);
}
.adv__icon img { width: 48px; height: 48px; object-fit: contain; }
.adv__title, .problem__title { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.adv__text, .problem__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

/* ═══ СОСТАВ РАБОТ ═══ */

.works { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.works__item { display: grid; gap: var(--wp--preset--spacing--20); align-content: start; }
.works__num { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }
.works__title { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.works__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.works__shot { font-size: var(--wp--preset--font-size--xs); }
.works__shot::after { content: ' →'; }

/* ═══ ЭТАПЫ ═══ */

/* Замер оригинала: заголовок слева шириной 425, этапы колонкой справа от 738.
   Номер 16/22 весом 500, название 22/26, описание 16/23. Шаг между этапами 226. */
.steps-wrap { display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 564px); justify-content: space-between; gap: 0 40px; }
.steps__heading { grid-column: 1; max-width: 425px; margin: 0; }
/* Замер оригинала: круглое фото 478 под заголовком, выступает за левый край. */
.steps__photo { grid-column: 1; margin: 40px 0 0 -50px; line-height: 0; }
.steps__photo img { width: 478px; height: 478px; border-radius: 50%; object-fit: cover; }
.steps { grid-column: 2; display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; grid-template-columns: 1fr; }
/* Замер оригинала: номер, через 10 заголовок, через 26 описание. */
.step { display: grid; gap: 0; align-content: start; }
.step__title { margin-top: 10px; }
.step__text { margin-top: 12px; }
.step__num { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); font-weight: var(--wp--custom--weight--medium); }
.step__title { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22); font-weight: var(--wp--custom--weight--medium); }
.step__text { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }

@media (max-width: 900px) {
	.steps-wrap { grid-template-columns: 1fr; gap: 24px; }
	.steps__heading, .steps, .steps__photo { grid-column: 1; }
	.steps__photo { margin: 24px 0 0; }
	.steps__photo img { width: 240px; height: 240px; }
}
.steps__item {
	display: grid; gap: var(--wp--preset--spacing--20); align-content: start;
	padding-top: var(--wp--preset--spacing--30);
	border-top: 2px solid var(--wp--preset--color--accent);
}
.steps__num { font-size: var(--wp--preset--font-size--xs); font-weight: var(--wp--custom--weight--bold); color: var(--wp--preset--color--accent); }
.steps__title { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.steps__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.steps__points { margin: 0; padding-left: 18px; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); display: grid; gap: 4px; }

/* ═══ ТАРИФЫ ═══ */

.prices { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.price {
	display: grid; gap: var(--wp--preset--spacing--30); align-content: start;
	padding: var(--wp--preset--spacing--50);
	background: var(--wp--preset--color--canvas);
	border-radius: var(--wp--custom--radius--block);
}
.price__name { margin: 0; font-size: var(--wp--preset--font-size--large); }
.price__value { margin: 0; font-size: var(--wp--preset--font-size--x-large); font-weight: var(--wp--custom--weight--bold); color: var(--wp--preset--color--accent); }
.price__note { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.price__lines { margin: 0; padding-left: 18px; display: grid; gap: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--xs); }

/* ═══ КОМАНДА ═══ */

.person-grid { display: grid; gap: 40px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.person { display: grid; gap: var(--wp--preset--spacing--20); align-content: start; justify-items: center; text-align: center; }
.person__photo {
	width: 175px; height: 175px;
	border-radius: var(--wp--custom--radius--pill);
	overflow: hidden;
	background: var(--wp--preset--color--canvas);
}
.person__photo img { width: 100%; height: 100%; object-fit: cover; }
.person__name { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22); font-weight: var(--wp--custom--weight--medium); }
.person__role { margin: 0; font-size: 14px; line-height: 20px; color: var(--wp--preset--color--muted); }
.person__quote { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: var(--wp--preset--color--ink); max-width: 26ch; }
.person__contact { font-size: var(--wp--preset--font-size--xs); }

/* ═══ ОТЗЫВЫ ═══ */

/* Замер оригинала: карточки высотой 242px и скруглением 37px,
   ширины чередуются 465 и 665, так что в ряду стоит узкая и широкая. */
.review-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.review {
	display: grid; gap: 14px; align-content: start;
	height: 242px;
	padding: 30px 46px;
	border-radius: var(--wp--custom--radius--soft);
	overflow: hidden;
}
.review:nth-child(4n+1),
.review:nth-child(4n+4) { flex: 0 0 465px; }
.review:nth-child(4n+2),
.review:nth-child(4n+3) { flex: 1 1 460px; }

/* Тона карточек сняты с оригинала: восемь позиций по кругу. */
.review:nth-child(8n+1) { background: var(--wp--preset--color--review-blue); }
.review:nth-child(8n+2) { background: var(--wp--preset--color--review-pink); }
.review:nth-child(8n+3) { background: var(--wp--preset--color--review-mint); }
.review:nth-child(8n+4) { background: var(--wp--preset--color--review-lime); }
.review:nth-child(8n+5) { background: var(--wp--preset--color--review-pink); }
.review:nth-child(8n+6) { background: var(--wp--preset--color--review-blue); }
.review:nth-child(8n+7) { background: var(--wp--preset--color--review-lime); }
.review:nth-child(8n+8) { background: var(--wp--preset--color--review-mint); }

.review__head { display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--30); }
.review__logo img { max-width: 134px; max-height: 67px; width: auto; height: auto; object-fit: contain; }
.review__client { margin: 0; font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); }
.review__text {
	font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16);
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; max-width: 331px;
}
.review__text p { margin: 0; }
.review__link { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: inherit; text-decoration: none; }
.review__link:hover { text-decoration: underline; }

/* Страница отзывов: письма показываются целиком, карточка растёт под текст. */
.review-grid--letters { gap: 24px; }
.review-grid--letters > .review { flex: 1 1 460px; height: auto; padding: 40px 46px; }
.review--letter .review__text { display: block; max-width: none; overflow: visible; font-size: var(--wp--preset--font-size--base); line-height: var(--wp--custom--line--24); }
.review--letter .review__text p { margin: 0 0 12px; }
.review--letter .review__text p:last-child { margin-bottom: 0; }
.review__sign { display: grid; gap: 4px; margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }
.review__role { text-transform: uppercase; color: var(--wp--preset--color--muted); }
.review__person { font-weight: var(--wp--custom--weight--medium); }

/* ═══ КЛИЕНТЫ И СЕРТИФИКАТЫ ═══ */

.clients { display: grid; gap: 40px; grid-template-columns: repeat(6, 160px); justify-content: space-between; align-items: center; }
.clients__item img { width: 160px; height: 86px; object-fit: contain; display: block; margin: 0 auto; }

/* Замер оригинала: три значка по 140px стоят справа, вровень с подписью
   «Что подтверждают эти сертификаты», порядок — Яндекс, Google, Calltouch. */
.section--certificates .container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: start;
	column-gap: 40px;
}
.section--certificates .section__title,
.section--certificates .certs { grid-column: 1 / -1; }
.section--certificates .section__sub { grid-column: 1; margin: 0; }
.certs__logos {
	grid-column: 2;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: flex-end;
	gap: 18px;
	margin: 0;
}
.certs__logos img { width: 140px; height: 140px; object-fit: contain; }

.certs { display: grid; }
/* Замер оригинала: номер на 139px, требование на 336px, наш ответ на 998px. */
.cert {
	display: grid;
	grid-template-columns: 197px 251px 411px minmax(0, 1fr);
	align-items: start;
	gap: 0;
	padding-block: 54px;
	border-top: 1px solid var(--wp--preset--color--line);
}
.cert__text { max-width: 251px; }
.cert__arrow { align-self: center; justify-self: center; width: 122px; height: 22px; }
.cert__answer { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }
.cert:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.cert__num { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: var(--wp--preset--color--muted); font-weight: var(--wp--custom--weight--medium); }
.cert__text { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }

/* ═══ ПРИЗЫВ ═══ */

.cta { display: grid; gap: var(--wp--preset--spacing--30); justify-items: start; max-width: 720px; }
.cta__title { margin: 0; font-size: var(--wp--preset--font-size--x-large); }
.cta__text { margin: 0; color: var(--wp--preset--color--muted); }
.cta__actions { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--20); }
.section--cta .button--ghost { box-shadow: inset 0 0 0 1px var(--wp--preset--color--line); }

/* с картинкой — две колонки; ширину контейнера не трогаем */
.section--cta-media .cta {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: var(--wp--preset--spacing--60);
	align-items: center;
}
.cta__body { display: grid; gap: var(--wp--preset--spacing--30); justify-items: start; }
.cta__media img { width: 100%; height: auto; }

@media (max-width: 900px) {
	.section--cta-media .cta { grid-template-columns: 1fr; }
	.cta__media { order: -1; }
}

/* ═══ СМОТРИТЕ ДАЛЕЕ ═══ */

.next { display: grid; gap: var(--wp--preset--spacing--40); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.next__item {
	display: flex; flex-direction: column; justify-content: space-between;
	gap: var(--wp--preset--spacing--60);
	min-height: 260px;
	padding: var(--wp--preset--spacing--60);
	border-radius: var(--wp--custom--radius--block);
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: transform var(--wp--custom--transition--base);
}
.next__item:nth-child(3n+1) { background: #DDEFFB; }
.next__item:nth-child(3n+2) { background: #FBE7E7; }
.next__item:nth-child(3n+3) { background: #D6F9EB; }
.next__item:hover { transform: translateY(-3px); }
.next__title { font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--medium); }
.next__arrow { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

/* ═══ ЭКСПЕРТ ═══ */

.expert { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: minmax(0, 0.4fr) minmax(0, 1fr); align-items: center; }
.expert__photo img { border-radius: var(--wp--custom--radius--block); }
.expert__body { display: grid; gap: var(--wp--preset--spacing--30); justify-items: start; }
.expert__text { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.expert__name { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

/* ═══ КОНТАКТЫ ═══ */

.contacts { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); }
.contacts__body { display: grid; gap: var(--wp--preset--spacing--20); align-content: start; justify-items: start; }
.contacts__title { margin: 0 0 var(--wp--preset--spacing--20); }
.contacts__phone { font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--medium); color: var(--wp--preset--color--ink); text-decoration: none; }
.contacts__email { color: var(--wp--preset--color--ink); text-decoration: none; }
.contacts__hours, .contacts__address { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.contacts__map img { border-radius: var(--wp--custom--radius--block); width: 100%; }

/* ═══ КЕЙС ═══ */

.case-about { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.case-about__client { grid-column: 1 / -1; margin: 0; font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--medium); }
.case-about__title { margin: 0 0 var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--medium); color: var(--wp--preset--color--accent); }
.case-about__col p { margin: 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--xs); }

.case-problems { display: grid; gap: var(--wp--preset--spacing--50); grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); align-items: center; }
.case-problems__media img { border-radius: var(--wp--custom--radius--block); }

.icase__client { margin: 0 0 var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--large); }
.icase__meta { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--50); margin: 0 0 var(--wp--preset--spacing--50); }
.icase__meta dt { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.icase__meta dd { margin: 4px 0 0; font-weight: var(--wp--custom--weight--medium); }
.icase__subtitle { margin: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--medium); }
.icase__list { margin: 0; padding-left: 20px; display: grid; gap: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.partner__list { margin: 0; padding-left: 20px; display: grid; gap: var(--wp--preset--spacing--30); max-width: 800px; }

.card__label { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }
.card__nums { display: flex; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--20); }
.card__num { display: grid; gap: 2px; }
.card__num-value { font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--weight--bold); color: var(--wp--preset--color--accent); }
.card__num-label { font-size: 12px; color: var(--wp--preset--color--muted); }

/* ═══ ОБЩЕЕ ДЛЯ СЕКЦИЙ ═══ */

/* Замер оригинала: заголовок 789px слева, пояснение 242px у правого края, выровнены по верху. */
.section__head {
	display: grid;
	grid-template-columns: minmax(0, 790px) 200px;
	justify-content: space-between;
	align-items: start;
	gap: 0 40px;
	margin-bottom: var(--wp--preset--spacing--50);
}
.section__head .section__lead { margin: 0; max-width: none; }
/* Пояснение под заголовком: у сертификатов оно крупное и стоит слева. */
.section__sub {
	margin: 0 0 var(--wp--preset--spacing--50);
	max-width: 348px;
	font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium);
}
@media (max-width: 900px) { .section__head { grid-template-columns: 1fr; gap: 16px; } }
@media (max-width: 900px) { .person-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); } }
.section__head .section__title { margin: 0; }
.section__more { font-size: var(--wp--preset--font-size--small); font-weight: 500; color: var(--wp--preset--color--accent-text); }
.section__lead { margin: calc(var(--wp--preset--spacing--50) * -1) 0 var(--wp--preset--spacing--50); max-width: 70ch; color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); font-weight: 400; }
.section__note { margin-top: var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.section--advantages, .section--problems, .section--partner { background: var(--wp--preset--color--canvas); }

/* ═══ УЗКИЙ ЭКРАН ═══ */

@media (max-width: 980px) {
	.hero__inner, .expert, .contacts, .case-problems { grid-template-columns: 1fr; }
	.hero__media, .expert__photo { max-width: 480px; }
}

@media (max-width: 640px) {
	.hero { padding-block: var(--wp--preset--spacing--50); }
	.section { padding-block: var(--wp--preset--spacing--50); }
	.nums { gap: var(--wp--preset--spacing--40); }
	.icase__meta { gap: var(--wp--preset--spacing--40); }
}

/* ═══ ФОРМЫ ═══ */

.rubik-trap { display: none; }
.wpcf7 label { display: block; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.wpcf7 input[type="text"], .wpcf7 input[type="tel"], .wpcf7 input[type="email"], .wpcf7 textarea {
	width: 100%; padding: 12px 16px; margin-top: 6px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--card);
	font: inherit; font-size: var(--wp--preset--font-size--small);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 1px; }
.wpcf7 input[type="submit"] {
	padding: 13px 30px; border: 0;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--surface);
	font: inherit; font-size: var(--wp--preset--font-size--xs); cursor: pointer;
}
.wpcf7 form .wpcf7-response-output { margin: var(--wp--preset--spacing--30) 0 0; padding: 12px 16px; border-radius: var(--wp--custom--radius--card); font-size: var(--wp--preset--font-size--xs); }
.section--cta .wpcf7 label { color: rgba(255,255,255,0.7); }

.site-header__logo {
	display: inline-flex;
	align-items: center;
}

.site-header__logo img {
	display: block;
	width: auto;
	height: 40px;
}

/* --- Вопросы и ответы --------------------------------------------------- */

.faq { display: grid; gap: var(--wp--preset--spacing--20); }
.faq__item {
	padding: var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--canvas);
}
.faq__q {
	cursor: pointer;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: var(--wp--custom--weight--medium);
	list-style: none;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q::after { content: "+"; float: right; color: var(--wp--preset--color--accent); }
.faq__item[open] .faq__q::after { content: "–"; }
.faq__a { margin-top: var(--wp--preset--spacing--30); color: var(--wp--preset--color--muted); }
.faq__a p { margin: 0 0 .7em; }

/* --- Блок с формой ------------------------------------------------------ */

.form-block { max-width: 560px; }
.form-block__title { margin: 0 0 var(--wp--preset--spacing--40); }
.form-block label { display: block; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.form-block input[type="text"],
.form-block input[type="tel"],
.form-block input[type="email"],
.form-block textarea {
	width: 100%;
	margin-top: .3em;
	padding: .8em 1em;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--block);
	font: inherit;
	background: #fff;
}
.form-block input[type="submit"] {
	padding: .9em 2em;
	border: 0;
	border-radius: var(--wp--custom--radius--block);
	background: var(--wp--preset--color--accent);
	color: #fff;
	font: inherit;
	cursor: pointer;
}
.contacts__map iframe { display: block; border: 0; border-radius: var(--wp--custom--radius--card); }


/* --- Кейсы тёмной секцией, как на главной оригинала --------------------- */

.section--dark {
	background: var(--wp--preset--color--dark);
	color: #fff;
}
.section--dark .section__title,
.section--dark .card__title a { color: #fff; }
.section--dark .section__lead { color: #fff; }
.section--dark .card {
	background: rgba(255, 255, 255, .06);
	border-radius: var(--wp--custom--radius--block);
	overflow: hidden;
}
.section--dark .card__body { padding: var(--wp--preset--spacing--40); }
.section--dark .card__label { color: var(--wp--preset--color--sky); }
.section--dark .card__num-label { color: rgba(255, 255, 255, .6); }

/* --- Подсветка части заголовка ------------------------------------------ */

/* Замер оригинала: под выделенным словом лежит голубая плашка var(--wp--preset--color--sky-pale)
   со скруглением 10px, текст поверх неё остаётся тёмным. */
h1 mark, h2 mark, h3 mark,
.section__title mark,
.hero__title mark,
.contacts__title mark,
.page-title mark {
	/* Подсветка отключена по решению владельца (09.09.2026): голубых плашек
	   в заголовках быть не должно. Вернуть — заменить transparent обратно
	   на var(--wp--preset--color--sky-pale). */
	background: transparent;
	color: var(--wp--preset--color--ink);
	/* Строчный элемент: длинная подсветка переносится, как на оригинале,
	   и плашка разрывается на две. inline-block этого не даёт. */
	display: inline;
	padding: 3px 8px;
	margin: 0 -8px;
	line-height: 49px;
	border-radius: var(--wp--custom--radius--card);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	/* Плашка выше строки на несколько пикселей и в многострочном заголовке
	   закрывала буквы строки сверху. На оригинале подсветка лежит под текстом,
	   поэтому смешиваем слои умножением: голубое не закрашивает тёмные буквы. */
	mix-blend-mode: multiply;
}

/* Насыщенная подсветка: <mark class="bright"> */
h1 mark.bright, h2 mark.bright, h3 mark.bright,
.section__title mark.bright,
.hero__title mark.bright,
.contacts__title mark.bright {
	/* Тоже отключена: возвращать — var(--wp--preset--color--sky) и белый текст. */
	background: transparent;
	color: inherit;
}



/* --- Контакты: две колонки, строки с пометками ------------------------- */

.section--contacts { background: var(--wp--preset--color--canvas); }
.contacts {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
	gap: var(--wp--preset--spacing--60);
	align-items: center;
}
.contacts__title { margin: 0 0 var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--x-large); }
.contacts__list { margin: 0 0 var(--wp--preset--spacing--50); padding: 0; list-style: none; display: grid; gap: var(--wp--preset--spacing--30); }
.contacts__item { display: flex; align-items: center; gap: 12px; }
.contacts__item img { flex: none; display: block; }
.contacts__phone { font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--weight--medium); color: var(--wp--preset--color--ink); text-decoration: none; }
.contacts__email { color: var(--wp--preset--color--ink); }
.contacts__map { width: 100%; }
.contacts__map iframe { width: 100%; min-height: 420px; border: 0; border-radius: var(--wp--custom--radius--card); }

@media (max-width: 900px) {
	.contacts { grid-template-columns: 1fr; }
}

/* --- Подвал: логотип картинкой и кнопка -------------------------------- */

.site-footer__logo { display: block; width: 210px; height: auto; margin-bottom: var(--wp--preset--spacing--30); }
.site-footer__requisites { font-size: var(--wp--preset--font-size--xs); color: rgba(255, 255, 255, .6); }
.site-footer__requisites p { margin: 0 0 .3em; }
.site-footer__hours { font-size: var(--wp--preset--font-size--xs); color: rgba(255, 255, 255, .6); }
.site-footer__button { margin-top: var(--wp--preset--spacing--30); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35); }
.site-footer__button:hover { background: rgba(255, 255, 255, .08); }

/* Логотипы сертификатов крупнее */
.certs__logos img { width: 140px; height: 140px; }


/* --- Первый экран услуги: тёмное фото, две колонки текста -------------- */

.hero--photo-dark {
	position: relative;
	min-height: 900px;
	display: flex; align-items: center;
	background-size: cover; background-position: center;
	color: #fff;
}
.hero--photo-dark::before {
	/* Замер оригинала: плёнка сверху вниз от rgba(35,35,35,.95) к .9.
	   Плёнка лежит ПОД содержимым: у первого экрана услуги .hero__inner статичный,
	   и без явного слоя плёнка закрашивала заголовок и кнопки. */
	content: ""; position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(rgba(35, 35, 35, .95), rgba(35, 35, 35, .9));
}
.hero--photo-dark .hero__body,
.hero--photo-dark .hero__aside,
.hero--photo-dark .hero__facts { position: relative; z-index: 1; }
/* Эти два уже стоят абсолютом, position им не трогаем — иначе картинка
   выпадает в поток и уводит текст первого экрана вправо. */
.hero--photo-dark .hero__media,
.hero--photo-dark .hero__lines { z-index: 1; }
.hero--photo-dark .hero__inner { position: relative; padding-top: 70px; }
.hero--photo-dark .hero__title { color: #fff; }
.hero--photo-dark .hero__subtitle,
.hero--photo-dark .hero__lead { color: rgba(255, 255, 255, .82); }

/* Замер оригинала: колонки 277 и 325, между ними 68, текст 16/22. */
.hero__cols {
	display: grid;
	grid-template-columns: 277px 325px;
	gap: 0 68px;
	margin-bottom: 66px;
	max-width: 700px;
}
.hero__cols p { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }

@media (max-width: 700px) {
	.hero__cols { grid-template-columns: 1fr; gap: 20px; }
}

.hero__media--round {
	max-width: 520px;
	margin-left: auto;
}
.hero__media--round img {
	border-radius: var(--wp--custom--radius--pill);
	aspect-ratio: 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.button--sky {
	background: var(--wp--preset--color--sky);
	color: #fff;
}
.button--sky:hover { background: #2f9bea; }

@media (max-width: 900px) {
	.hero--photo-dark { min-height: 480px; }
	.hero__media--round { display: none; }
}


/* --- Первый экран обычной страницы -------------------------------------- */

.hero--page {
	position: relative;
	min-height: 808px;
	display: flex; align-items: center;
	padding-block: 110px var(--wp--preset--spacing--70);
	background-size: cover; background-position: center;
}
.hero--page.hero--photo-dark { color: #fff; }
.hero--page .hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
	gap: var(--wp--preset--spacing--60);
	align-items: center;
	width: 100%;
}
.hero--page .hero__title { margin: 0 0 var(--wp--preset--spacing--40); max-width: 16ch; }
.hero--page .hero__text { max-width: 46ch; }
.hero--page .hero__text p { margin: 0 0 .9em; }
.hero--page .hero__actions { margin-top: var(--wp--preset--spacing--50); }

/* Страница без фотографии остаётся светлой */
.hero--page:not(.hero--photo-dark) {
	min-height: 0;
	padding-block: 110px var(--wp--preset--spacing--50);
	background: var(--wp--preset--color--canvas);
}

@media (max-width: 900px) {
	.hero--page { min-height: 420px; padding-block: 96px var(--wp--preset--spacing--50); }
	.hero--page .hero__inner { grid-template-columns: 1fr; }
}


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

.hero--case {
	position: relative;
	min-height: 900px;
	display: flex; align-items: center;
	background-size: cover; background-position: center;
	color: var(--wp--preset--color--ink);
}
.hero--case.hero--photo-dark { color: #fff; }
.hero--case .hero__inner { position: relative; display: block; width: 100%; padding-top: 70px; }

.case-hero__head { margin-bottom: var(--wp--preset--spacing--60); }
.case-hero__over {
	display: inline-flex; align-items: center; gap: 18px;
	font-size: var(--wp--preset--font-size--medium);
}
.case-hero__over::before {
	content: "";
	width: 96px; height: 1px;
	background: currentColor;
}
.case-hero__title {
	margin: var(--wp--preset--spacing--20) 0 0;
	font-size: clamp(48px, 8vw, 118px);
	line-height: .95;
	font-weight: var(--wp--custom--weight--regular);
}

.case-hero__cols {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, .8fr);
	gap: var(--wp--preset--spacing--60);
	align-items: start;
}
.case-hero__label { margin: 0 0 var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--xs); opacity: .9; }
.case-hero__note { margin: 0 0 var(--wp--preset--spacing--50); font-size: var(--wp--preset--font-size--xs); max-width: 44ch; }
.case-hero__about { margin: 0; font-size: var(--wp--preset--font-size--xs); max-width: 40ch; }
.case-hero__extra { margin: 0; font-size: var(--wp--preset--font-size--xs); max-width: 32ch; align-self: end; }

.case-num { margin-bottom: var(--wp--preset--spacing--40); }
.case-num__value { display: block; font-size: var(--wp--preset--font-size--large); }
.case-num__label { display: block; margin-top: .3em; font-size: var(--wp--preset--font-size--xs); opacity: .85; max-width: 24ch; }

@media (max-width: 900px) {
	.hero--case { min-height: 560px; }
	.case-hero__cols { grid-template-columns: 1fr; }
}

/* Под шапкой всегда должен быть отступ, если первый экран светлый.
   Секции задают отступы сами, поэтому их контейнеров правило не касается. */
.site-main > .container:first-child,
.site-main > article > .container:first-child,
.site-main > .entry:first-child > .container:first-child,
.site-main > .entry:first-child > .page-body > .container:first-child { padding-top: 90px; }
.site-main > .hero:first-child ~ * .container:first-child,
.site-main > article > .hero:first-child ~ .container { padding-top: 0; }

/* --- Блоки шорткодов ----------------------------------------------------- */

.facts-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: var(--wp--preset--spacing--40);
}

.adv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--wp--preset--spacing--50); }
.adv__title { margin: 0 0 var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--medium); }
.adv__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

/* Замер оригинала: строка работы — номер на 139px, название 34/41 на 238px
   шириной 460, описание 16/22 на 838px. Шаг между строками около 150px. */
.works { display: grid; gap: 0; grid-template-columns: 1fr; }
.work {
	display: grid;
	grid-template-columns: 99px 600px minmax(0, 1fr);
	align-items: start;
	gap: 0;
	padding-block: 54px;
	border-top: 1px solid var(--wp--preset--color--line);
}
.work:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.work__num { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: var(--wp--preset--color--muted); }
.work__title { margin: 0; font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); max-width: 460px; }
.work__text { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); max-width: 360px; }

@media (max-width: 900px) {
	.work { grid-template-columns: 60px 1fr; }
	.work__text { grid-column: 2; margin-top: 12px; }
}
.work__shot { margin-top: var(--wp--preset--spacing--30); width: 100%; height: auto; border-radius: var(--wp--custom--radius--card); }
.work__shot-link { display: inline-block; margin-top: 12px; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--accent); }


.case-intro { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--wp--preset--spacing--60); }
.case-intro__label { margin: 0 0 var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--medium); color: var(--wp--preset--color--accent); }
.case-intro__text { margin: 0; }

.case-problem { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); gap: var(--wp--preset--spacing--60); align-items: start; }
.case-problem__media img { width: 100%; height: auto; border-radius: var(--wp--custom--radius--card); }

.case-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--wp--preset--spacing--50); }
.case-plan__num { display: block; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }
.case-plan__title { margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--s); }
.case-plan__text { margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--xs); }

.case-results { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--60); }
.case-result__value { display: block; font-size: var(--wp--preset--font-size--x-large); color: var(--wp--preset--color--accent); }
.case-result__label { display: block; margin-top: .3em; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); max-width: 24ch; }
.case-results__client { margin-bottom: var(--wp--preset--spacing--40); }
.case-results__name { font-size: var(--wp--preset--font-size--client); font-weight: 500; line-height: var(--wp--custom--line--32); }
.case-results__site { display: inline-block; margin-top: 6px; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink); }
.case-results__note { margin-top: var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.text-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--wp--preset--spacing--50); }
.text-cols__item p { margin: 0 0 1em; }

.check-list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--wp--preset--spacing--20); }
.check-list li { position: relative; padding-left: 28px; }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--wp--preset--color--accent); }

.block-image img { width: 100%; height: auto; border-radius: var(--wp--custom--radius--card); }
.block-image figcaption { margin-top: .6em; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

@media (max-width: 900px) {
	.expert, .case-problem { grid-template-columns: 1fr; }
}

/* --- Сетка страницы ------------------------------------------------------ */

.row { padding-block: var(--wp--preset--spacing--70); background-size: cover; background-position: center; }
.row--pad-0 { padding-block: 0; }
.row--pad-s { padding-block: var(--wp--preset--spacing--50); }
.row--pad-l { padding-block: 120px; }
.row--canvas { background-color: var(--wp--preset--color--canvas); }
.row--white  { background-color: #fff; }
.row--dark   { background-color: var(--wp--preset--color--dark); color: #fff; }
.row--sky    { background-color: var(--wp--preset--color--sky); color: #fff; }
.row--dark .el-title, .row--sky .el-title { color: #fff; }
.row__inner { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--50); }
.row--top    .row__inner { align-items: flex-start; }
.row--middle .row__inner { align-items: center; }
.row--bottom .row__inner { align-items: flex-end; }
.col { flex: 1 1 calc(var(--col-width) - var(--wp--preset--spacing--50)); min-width: 220px; }

@media (max-width: 780px) {
	.col { flex-basis: 100%; }
}

/* --- Элементы ------------------------------------------------------------ */

.el-title { margin: 0 0 var(--wp--preset--spacing--40); }
.el-title--h1 { font-size: var(--wp--preset--font-size--xx-large); }
.el-title--h2 { font-size: var(--wp--preset--font-size--x-large); }
.el-title--h3 { font-size: var(--wp--preset--font-size--large); }
.el-title--huge { font-size: clamp(48px, 8vw, 118px); line-height: .95; font-weight: var(--wp--custom--weight--regular); }

.el-text p { margin: 0 0 1em; }
.el-text--мелкий  { font-size: var(--wp--preset--font-size--xs); }
.el-text--крупный { font-size: var(--wp--preset--font-size--medium); }
.el-text--серый   { color: var(--wp--preset--color--muted); }
.el-text--белый   { color: #fff; }
.el-text--красный { color: var(--wp--preset--color--accent); }

.button--white { background: #fff; color: var(--wp--preset--color--ink); }
.button--wide { min-width: 527px; text-align: center; }

.el-fact__value { display: block; font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); }
.el-fact__text { display: block; margin-top: 8px; font-size: var(--wp--preset--font-size--xs); max-width: 22ch; }
.el-fact--крупная .el-fact__value { font-size: var(--wp--preset--font-size--xx-large); }
.el-fact--красный .el-fact__value { color: var(--wp--preset--color--accent); }
.el-fact--белый .el-fact__value, .el-fact--белый .el-fact__text { color: #fff; }

.el-bubble {
	width: var(--bubble, 166px); height: var(--bubble, 166px);
	display: flex; align-items: center; justify-content: center;
	padding: 16px; border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--sky); color: #fff;
	font-size: var(--wp--preset--font-size--xs); line-height: 19px; text-align: center;
}

.el-num__value { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }
.el-num__title { margin: var(--wp--preset--spacing--20) 0; font-size: var(--wp--preset--font-size--medium); }
.el-num__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.card-el { display: block; padding: var(--wp--preset--spacing--50); border-radius: var(--wp--custom--radius--block); text-decoration: none; color: inherit; }
.card-el--pink   { background: #FBE7E7; }
.card-el--mint   { background: #D6F9EB; }
.card-el--sky    { background: #DDEFFB; }
.card-el--lime   { background: #F7F9DF; }
.card-el--canvas { background: var(--wp--preset--color--canvas); }
.card-el--dark   { background: var(--wp--preset--color--dark); color: #fff; }
.card-el__head { display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--30); margin-bottom: var(--wp--preset--spacing--30); }
.card-el__title { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.card-el__logo { max-height: 34px; width: auto; }
.card-el__text { font-size: var(--wp--preset--font-size--xs); }
.card-el__text p { margin: 0 0 .7em; }
.card-el__link { display: inline-block; margin-top: var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }

.el-img img { width: 100%; height: auto; border-radius: var(--wp--custom--radius--card); }
.el-img--round img { border-radius: var(--wp--custom--radius--pill); aspect-ratio: 1; object-fit: cover; }
.el-img figcaption { margin-top: .6em; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.el-badge { display: inline-flex; align-items: center; gap: 18px; font-size: var(--wp--preset--font-size--medium); }
.el-badge::before { content: ""; width: 96px; height: 1px; background: currentColor; }
.el-badge--plate::before { display: none; }
.el-badge--plate { padding: 6px 14px; border-radius: var(--wp--custom--radius--plate); background: var(--wp--preset--color--sky); color: #fff; font-size: var(--wp--preset--font-size--xs); }

.el-line { margin: var(--wp--preset--spacing--50) 0; border: 0; border-top: 1px solid var(--wp--preset--color--line); }
.el-space { display: block; }

/* Вкладки на радиокнопках */
.tabs__head { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: var(--wp--preset--spacing--40); }
.tabs__radio { position: absolute; opacity: 0; pointer-events: none; }
.tabs__label {
	padding: 10px 20px; border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--canvas);
	font-size: var(--wp--preset--font-size--xs); cursor: pointer;
}
.tabs__pane { display: none; }
.tabs__radio:nth-of-type(1):checked ~ .tabs__label:nth-of-type(1),
.tabs__radio:nth-of-type(2):checked ~ .tabs__label:nth-of-type(2),
.tabs__radio:nth-of-type(3):checked ~ .tabs__label:nth-of-type(3),
.tabs__radio:nth-of-type(4):checked ~ .tabs__label:nth-of-type(4),
.tabs__radio:nth-of-type(5):checked ~ .tabs__label:nth-of-type(5),
.tabs__radio:nth-of-type(6):checked ~ .tabs__label:nth-of-type(6) { background: var(--wp--preset--color--sky); color: #fff; }
.tabs:has(.tabs__radio:nth-of-type(1):checked) .tabs__pane[data-tab="0"],
.tabs:has(.tabs__radio:nth-of-type(2):checked) .tabs__pane[data-tab="1"],
.tabs:has(.tabs__radio:nth-of-type(3):checked) .tabs__pane[data-tab="2"],
.tabs:has(.tabs__radio:nth-of-type(4):checked) .tabs__pane[data-tab="3"],
.tabs:has(.tabs__radio:nth-of-type(5):checked) .tabs__pane[data-tab="4"],
.tabs:has(.tabs__radio:nth-of-type(6):checked) .tabs__pane[data-tab="5"] { display: block; }

.gallery { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: var(--wp--preset--spacing--30); }
.gallery__item img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--wp--custom--radius--card); }

.el-video iframe { width: 100%; aspect-ratio: 16/9; height: auto; border: 0; border-radius: var(--wp--custom--radius--card); }

.el-quote__title { margin: 0 0 var(--wp--preset--spacing--50); font-size: var(--wp--preset--font-size--title); font-weight: 500; line-height: var(--wp--custom--line--34); }
.el-quote { margin: 0; padding-left: var(--wp--preset--spacing--40); border-left: 3px solid var(--wp--preset--color--accent); }
.el-quote__text { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.el-quote__author { margin-top: var(--wp--preset--spacing--30); font-weight: var(--wp--custom--weight--medium); }
.el-quote__role { display: block; font-weight: 400; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.note { padding: var(--wp--preset--spacing--40); border-radius: var(--wp--custom--radius--block); }
.note--sky { background: #DDEFFB; }
.note--accent { background: #FBE7E7; }
.note--mint { background: #D6F9EB; }
.note--canvas { background: var(--wp--preset--color--canvas); }
.note p { margin: 0 0 .7em; }
.note p:last-child { margin: 0; }

.el-map iframe { width: 100%; border: 0; border-radius: var(--wp--custom--radius--card); }


/* --- Сравнение тарифов, прогресс, лента, карусель ------------------------ */

.compare { display: flex; gap: 1px; background: var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--card); overflow: hidden; }
.compare__labels, .compare__col { flex: 1; display: flex; flex-direction: column; gap: 1px; background: var(--wp--preset--color--line); }
.compare__labels { flex: 0 0 220px; }
.compare__cell { padding: var(--wp--preset--spacing--40); background: #fff; font-size: var(--wp--preset--font-size--xs); flex: 1; }
.compare__cell--head { font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--weight--medium); background: var(--wp--preset--color--canvas); }
.compare__cell--label { color: var(--wp--preset--color--muted); background: var(--wp--preset--color--canvas); }
.compare__label-mob { display: none; }

@media (max-width: 780px) {
	.compare { flex-direction: column; }
	.compare__labels { display: none; }
	.compare__label-mob { display: block; margin-bottom: 6px; font-size: 11px; text-transform: uppercase; color: var(--wp--preset--color--muted); }
}

.progress { margin-bottom: var(--wp--preset--spacing--40); }
.progress__head { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: var(--wp--preset--font-size--xs); }
.progress__bar { height: 8px; border-radius: 999px; background: var(--wp--preset--color--canvas); overflow: hidden; }
.progress__bar span { display: block; height: 100%; border-radius: 999px; background: var(--wp--preset--color--accent); }

.timeline { display: grid; gap: var(--wp--preset--spacing--50); }
.timeline__item { position: relative; padding-left: 34px; }
.timeline__item::before { content: ""; position: absolute; left: 5px; top: 18px; bottom: -34px; width: 1px; background: var(--wp--preset--color--line); }
.timeline__item:last-child::before { display: none; }
.timeline__dot { position: absolute; left: 0; top: 6px; width: 11px; height: 11px; border-radius: 999px; background: var(--wp--preset--color--accent); }
.timeline__title { margin: 0 0 6px; font-size: var(--wp--preset--font-size--medium); }
.timeline__text { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }

.carousel { display: flex; gap: var(--wp--preset--spacing--30); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
.carousel__item { flex: 0 0 auto; scroll-snap-align: start; }
.carousel__item img { height: var(--h, 380px); width: auto; border-radius: var(--wp--custom--radius--card); }

.tip { border-bottom: 1px dashed var(--wp--preset--color--muted); cursor: help; }

/* --- Бегущая строка, карточка кейса, рейтинг, карусель, окно ------------- */

.ticker { overflow: hidden; padding-block: 22px; background: var(--wp--preset--color--canvas); }
.ticker--dark { background: var(--wp--preset--color--dark); color: #fff; }
.ticker__line { display: flex; gap: 40px; width: max-content; animation: ticker var(--speed, 26s) linear infinite; }
.ticker__item { font-size: var(--wp--preset--font-size--medium); white-space: nowrap; opacity: .55; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ticker__line { animation: none; } }

.case-card { display: block; border-radius: var(--wp--custom--radius--block); overflow: hidden; background: var(--wp--preset--color--canvas); text-decoration: none; color: inherit; }
.case-card__media img { width: 100%; height: 230px; object-fit: cover; display: block; }
.case-card__body { padding: var(--wp--preset--spacing--40); }
.case-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--30); }
.case-card__title { margin: 0; font-size: var(--wp--preset--font-size--medium); }
.case-card__logo { max-height: 30px; width: auto; }
.case-card__text { margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.case-card__nums { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--30); }
.case-card__value { display: block; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--accent); }
.case-card__label { display: block; font-size: 11px; color: var(--wp--preset--color--muted); max-width: 18ch; }

.ratings { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--60); }
.rating__place { display: block; font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--weight--medium); }
.rating__text { display: block; margin-top: 6px; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); max-width: 26ch; }

.slider { display: flex; gap: var(--wp--preset--spacing--40); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 10px; }
.slider__item { flex: 0 0 var(--item, 380px); scroll-snap-align: start; }

/* Окно заявки закрыто не через display:none, а нулевой высотой: у Тильды оно
   устроено так же, и его текст попадает в копирование страницы целиком.
   С display:none наш текст в буфер не попадал, и страница расходилась
   с оригиналом на пятнадцать слов. */
.popup {
	position: fixed; left: 0; top: 0; z-index: 200;
	width: 100%; height: 0; overflow: hidden;
	display: flex; align-items: center; justify-content: center;
	background: rgba(0,0,0,.6); padding: 0;
	opacity: 0; pointer-events: none;
}
.popup:target,
.popup-yakor:target ~ #zayavka {
	height: 100%; overflow: auto; padding: 20px;
	opacity: 1; pointer-events: auto;
}
/* якоря окон Тильды: стоят в углу экрана, чтобы переход по ним не прокручивал страницу */
.popup-yakor { position: fixed; top: 0; left: 0; width: 0; height: 0; overflow: hidden; }
.popup__box { position: relative; width: min(560px, 100%); max-height: 90vh; overflow: auto; padding: var(--wp--preset--spacing--60); border-radius: var(--wp--custom--radius--block); background: #fff; }
.popup__close { position: absolute; top: 14px; right: 18px; font-size: 26px; line-height: 1; color: var(--wp--preset--color--muted); text-decoration: none; }
.popup__title { margin: 0 0 var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--large); }

.shot a { display: block; position: relative; }
.shot img { width: 100%; height: auto; border-radius: var(--wp--custom--radius--card); }
.shot__link { display: inline-block; margin-top: .6em; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent); }
.shot__link::after { content: " →"; }

.to-top {
	position: fixed; left: 24px; bottom: 24px; z-index: 90;
	width: 50px; height: 50px;
	display: grid; place-items: center;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--sky);
	color: #fff; text-decoration: none; font-size: 20px;
}
/* На оригинале кнопка появляется только после прокрутки: на первом экране её нет. */
.to-top { opacity: 0; visibility: hidden; transition: opacity .2s; }
.to-top--vidna { opacity: 1; visibility: visible; }
.to-top:hover { background: #2f9bea; color: #fff; }
.mega-toggle:checked ~ .to-top,
.mega-toggle:checked ~ * .to-top { display: none; }
@media (max-width: 780px) { .to-top { left: 14px; bottom: 14px; width: 42px; height: 42px; } }


/* --- Карточка кейса ------------------------------------------------------ */

/*
 * Размеры сняты с оригинала: название 32/500, отрасль 16/400,
 * подписи «Результат» и цифры по 22/500.
 */
.card--case { display: flex; flex-direction: column; height: 100%; }
.card--case .card__body { display: flex; flex-direction: column; gap: 14px; flex: 1; }
.card--case .card__title { margin: 0; font-size: 32px; line-height: 34px; font-weight: var(--wp--custom--weight--medium); }
.card--case .card__title a { text-decoration: none; color: inherit; }
.card__industry { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); color: var(--wp--preset--color--muted); }
.card__result { margin-top: auto; padding-top: 18px; }
.card__result-label { display: block; margin-bottom: 12px; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.card--case .card__nums { display: flex; flex-wrap: wrap; gap: 10px 28px; }
.card--case .card__num-value { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }

/* На тёмной секции подписи светлее */
.section--dark .card__industry,
.section--dark .card--case .card__num-label { color: rgba(255, 255, 255, .6); }
.section--dark .card--case .card__title a { color: #fff; }


/* --- Кейсы на главной ---------------------------------------------------- */
/* Замер оригинала: голубая плашка 1160×465 со скруглением 30px стоит по центру,
   красные стрелки 60px — снаружи плашки, у краёв окна. Имя клиента 32px,
   «Результат» и «Системы» 22px, подписи под цифрами 16/23. Листание якорями. */

.case-radio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.case-slider {
	width: 100vw;
	margin-inline: calc(50% - 50vw);
	overflow: hidden;
}
.case-track {
	display: flex;
	transition: transform .45s ease;
}

.case-slide {
	position: relative;
	flex: 0 0 100vw;
}

#case-r1:checked ~ .case-slider .case-track { transform: translateX(-0%); }
#case-r2:checked ~ .case-slider .case-track { transform: translateX(-100%); }
#case-r3:checked ~ .case-slider .case-track { transform: translateX(-200%); }
#case-r4:checked ~ .case-slider .case-track { transform: translateX(-300%); }
#case-r5:checked ~ .case-slider .case-track { transform: translateX(-400%); }
#case-r6:checked ~ .case-slider .case-track { transform: translateX(-500%); }
#case-r7:checked ~ .case-slider .case-track { transform: translateX(-600%); }
#case-r8:checked ~ .case-slider .case-track { transform: translateX(-700%); }
#case-r9:checked ~ .case-slider .case-track { transform: translateX(-800%); }
#case-r10:checked ~ .case-slider .case-track { transform: translateX(-900%); }
#case-r11:checked ~ .case-slider .case-track { transform: translateX(-1000%); }
#case-r12:checked ~ .case-slider .case-track { transform: translateX(-1100%); }
.case-slide__link { position: absolute; inset: 0; z-index: 1; }

.case-slide__box {
	position: relative;
	width: 1160px;
	max-width: calc(100% - 220px);
	min-height: 465px;
	margin: 0 auto;
	padding: 57px 55px 40px;
	border-radius: 30px;
	background: linear-gradient(120deg, #A2DEFF 0%, #C3EAFF 100%);
	color: var(--wp--preset--color--ink);
	overflow: hidden;
	display: grid;
	grid-template-columns: 273px 272px 300px minmax(0, 1fr);
	align-content: start;
}

.case-slide__logo { grid-column: 2; align-self: start; width: 168px; height: 168px; object-fit: contain; margin-top: -10px; }

.case-slide__client { grid-column: 1; grid-row: 1; }
.case-slide__name { margin: 0; font-size: var(--wp--preset--font-size--client); line-height: var(--wp--custom--line--32); font-weight: var(--wp--custom--weight--medium); }
.case-slide__note { margin: 33px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); max-width: 273px; }

/* Фотография лежит в нижней части плашки, как маска на оригинале */
.case-slide__photo { position: absolute; left: 0; bottom: 0; width: 470px; height: 232px; z-index: 0; }
.case-slide__photo--mask { inset: 0; width: auto; height: auto; }
.case-slide__photo--mask img {
	width: 100%; height: 100%; object-fit: cover; border-radius: 0;
	-webkit-mask-image: none; mask-image: none;
}
.case-slide__photo img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	border-radius: 0 0 0 30px;
	-webkit-mask-image: linear-gradient(90deg, #000 62%, transparent 100%);
	mask-image: linear-gradient(90deg, #000 62%, transparent 100%);
}

.case-slide__result { grid-column: 3; grid-row: 1; padding-top: 4px; }
.case-slide__systems { grid-column: 4; grid-row: 1; padding-top: 4px; }
.case-slide__label { display: block; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }

.case-slide__num { margin-top: 29px; }
.case-slide__value { display: block; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.case-slide__caption { display: block; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); max-width: 231px; }

.case-slide__system { display: block; margin-top: 26px; height: 34px; width: auto; max-width: 175px; object-fit: contain; }

/* Стрелки: красные круги 60px по краям окна, снаружи плашки */
.case-slide__arrow {
	position: absolute; top: 50%; z-index: 2;
	cursor: pointer;
	width: 60px; height: 60px; margin-top: -30px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	text-decoration: none;
}
.case-slide__arrow::before {
	content: ''; position: absolute; top: 50%; left: 50%;
	width: 12px; height: 12px; margin: -6px 0 0 -6px;
	border-top: 2px solid #fff; border-right: 2px solid #fff;
}
.case-slide__arrow--prev { left: 50px; }
.case-slide__arrow--prev::before { transform: rotate(-135deg); margin-left: -3px; }
.case-slide__arrow--next { right: 50px; }
.case-slide__arrow--next::before { transform: rotate(45deg); margin-left: -9px; }
.case-slide__arrow:hover { background: #fc3f3f; }

@media (max-width: 1000px) {
	.case-track {
		transform: none !important;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}
	.case-slide { scroll-snap-align: center; }
	.case-slide__box {
		grid-template-columns: 1fr;
		min-height: 0;
		max-width: calc(100% - 40px);
		padding: 40px 30px;
		gap: 30px;
	}
	.case-slide__logo { grid-column: 1; width: 110px; height: 110px; margin: 0; }
	.case-slide__photo { position: static; width: 100%; height: 200px; }
	.case-slide__photo img { border-radius: 20px; }
	.case-slide__result, .case-slide__systems { grid-column: 1; }
	.case-slide__arrow { display: none; }
}


/* --- Сотрудники на главной ----------------------------------------------- */
/* Замер оригинала: фото 260×260 кружком, шаг 300px, имя 22/18 весом 500,
   должность 14/20 цветом var(--wp--preset--color--muted). Лента листается стрелками, скриптов нет. */

.team-radio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.team-slider { position: relative; }
.team-viewport { overflow: hidden; }
/* Замер оригинала: круглое фото 360, шаг между сотрудниками 400, имя 22/30.8
   на 20px внутрь от фото, должность 14/14, описание 16/22.4 шириной 320. */
.team-track { display: flex; gap: 40px; transition: transform .45s ease; }
.team-slider .person { flex: 0 0 360px; text-align: center; justify-items: center; gap: 0; }
.team-slider .person__photo { width: 360px; height: 360px; }
.team-slider .person__name { margin: 20px 0 0; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.team-slider .person__role { margin: 4px 0 0; font-size: 14px; line-height: 14px; color: var(--wp--preset--color--muted); }
.team-slider .person__quote { margin: 18px auto 0; max-width: 320px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }

.team-arrow {
	position: absolute; top: 130px; z-index: 2;
	width: 60px; height: 60px; margin-top: -30px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	cursor: pointer;
	display: none;
}
.team-arrow::before {
	content: ''; position: absolute; top: 50%; left: 50%;
	width: 12px; height: 12px; margin: -6px 0 0 -6px;
	border-top: 2px solid #fff; border-right: 2px solid #fff;
}
.team-arrow--prev { left: calc(50% - 50vw + 30px); }
.team-arrow--prev::before { transform: rotate(-135deg); margin-left: -3px; }
.team-arrow--next { right: calc(50% - 50vw + 30px); }
.team-arrow--next::before { transform: rotate(45deg); margin-left: -9px; }
.team-arrow:hover { background: #fc3f3f; }

#team-r0:checked ~ .team-slider .team-track { transform: translateX(-0px); }
#team-r0:checked ~ .team-slider .team-arrow[data-poz="0"] { display: block; }
#team-r1:checked ~ .team-slider .team-track { transform: translateX(-300px); }
#team-r1:checked ~ .team-slider .team-arrow[data-poz="1"] { display: block; }
#team-r2:checked ~ .team-slider .team-track { transform: translateX(-600px); }
#team-r2:checked ~ .team-slider .team-arrow[data-poz="2"] { display: block; }
#team-r3:checked ~ .team-slider .team-track { transform: translateX(-900px); }
#team-r3:checked ~ .team-slider .team-arrow[data-poz="3"] { display: block; }
#team-r4:checked ~ .team-slider .team-track { transform: translateX(-1200px); }
#team-r4:checked ~ .team-slider .team-arrow[data-poz="4"] { display: block; }
#team-r5:checked ~ .team-slider .team-track { transform: translateX(-1500px); }
#team-r5:checked ~ .team-slider .team-arrow[data-poz="5"] { display: block; }
#team-r6:checked ~ .team-slider .team-track { transform: translateX(-1800px); }
#team-r6:checked ~ .team-slider .team-arrow[data-poz="6"] { display: block; }
#team-r7:checked ~ .team-slider .team-track { transform: translateX(-2100px); }
#team-r7:checked ~ .team-slider .team-arrow[data-poz="7"] { display: block; }

@media (max-width: 1000px) {
	.team-track { transform: none !important; overflow-x: auto; scrollbar-width: none; }
	.team-arrow { display: none !important; }
}


/* Круг с пояснением в отзывах.
   Замер оригинала: 350×350 цветом var(--wp--preset--color--sky), выступает на 27px выше секции,
   правый край на 1339px; текст внутри 16/22 белым шириной 268. */
.section--reviews { position: relative; }
.reviews__bubble {
	position: absolute; top: -27px; right: calc(50% - 622px); z-index: 1;
	width: 350px; height: 350px;
	border-radius: 50%;
	background: var(--wp--preset--color--sky);
	display: flex; align-items: center; justify-content: center;
	padding: 0 41px;
	pointer-events: none;
}
.section--reviews .reviews__bubble span {
	width: 268px;
	font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: #fff;
}

@media (max-width: 1100px) {
	.reviews__bubble { position: static; width: 100%; height: auto; border-radius: var(--wp--custom--radius--soft); padding: 30px; margin-bottom: 24px; }
	.reviews__bubble span { width: auto; }
}


/* --- Свободный текст в редакторе ----------------------------------------- */
/* Секции-шорткоды идут во всю ширину, а всё, что заказчик наберёт руками —
   заголовок, абзац, список, картинку — ставим в колонку по ширине контейнера
   и оформляем стилями сайта. */

.page-body > p,
.page-body > h1,
.page-body > h2,
.page-body > h3,
.page-body > h4,
.page-body > ul,
.page-body > ol,
.page-body > blockquote,
.page-body > figure,
.page-body > img,
.page-body > hr,
.page-body > pre,
.page-body > .split,
.page-body > .el-head,
.page-body > .wide-slider,
.page-body > .slider,
.page-body > .boxes,
.page-body > .faq,
.page-body > .table-wrap,
.page-body > .proof,
.page-body > div.page-lead {
	width: 100%;
	max-width: var(--wp--custom--container--max);
	margin-inline: auto;
	padding-inline: var(--wp--custom--container--gutter);
}

/* Кнопка, значки и диаграмма не тянутся во всю ширину: они по размеру
   содержимого, но стоят в той же колонке, что и текст. */
/* Кнопка, значки и диаграмма живут в своей строке: сама строка встаёт
   в колонку, а содержимое остаётся по размеру. */
.page-body > .btn-row,
.page-body > .soc,
.page-body > .share,
.page-body > .donut {
	width: 100%;
	max-width: var(--wp--custom--container--max);
	margin-inline: auto;
	margin-block: 24px;
	padding-inline: var(--wp--custom--container--gutter);
}
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.page-body > *:first-child { margin-top: var(--wp--preset--spacing--60); }
.page-body > *:last-child { margin-bottom: var(--wp--preset--spacing--60); }

.page-body > h2,
.page-body > .el-head > h2 { font-size: var(--wp--preset--font-size--hero); line-height: var(--wp--custom--line--54); font-weight: var(--wp--custom--weight--medium); margin: 60px auto 24px; }
.page-body > .el-head { margin: 60px auto 24px; }
.page-body > .el-head > h2 { margin: 0; }
.page-body > h3 { font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); margin: 48px auto 20px; }
.page-body > h4 { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); margin: 36px auto 16px; }
.page-body > p { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); margin: 0 auto 18px; max-width: calc(var(--wp--custom--container--max) - 200px); }
.page-body > ul,
.page-body > ol { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); margin: 0 auto 18px; padding-left: 24px; }
.page-body > ul li,
.page-body > ol li { margin-bottom: 8px; }
.page-body > blockquote { margin: 24px auto; padding-left: 20px; border-left: 3px solid var(--wp--preset--color--sky); }
.page-body > figure,
.page-body > img { margin: 24px auto; }
.page-body > figure img,
.page-body > img { max-width: 100%; height: auto; border-radius: 20px; }
.page-body > table { border-collapse: collapse; }
.page-body > table td,
.page-body > table th { padding: 12px 16px; border-bottom: 1px solid var(--wp--preset--color--line); text-align: left; }
.page-body > hr { margin: 40px auto; border: 0; border-top: 1px solid var(--wp--preset--color--line); }

/* Пустые абзацы между шорткодами не должны раздвигать секции. */
.page-body > p:empty { display: none; margin: 0; }


/* --- Карусель слайдов из админки ------------------------------------------ */
/* Слайды заводятся в разделе «Слайдеры» и выводятся [rubik_slides group="…"].
   Листается стрелками на радиокнопках, как кейсы и команда. */

.slides-radio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.slides { position: relative; }
.slides__viewport { overflow: hidden; }
.slides__track { display: flex; gap: 24px; transition: transform .45s ease; }

.slide {
	flex: 0 0 calc((100% - (var(--slides-cols) - 1) * 24px) / var(--slides-cols));
	display: flex; flex-direction: column;
	background: #fff;
	border-radius: 30px;
	overflow: hidden;
}
.slide__media img { width: 100%; height: 230px; object-fit: cover; display: block; }
.slide__body { padding: 30px; display: grid; gap: 12px; align-content: start; }
.slide__logo { max-height: 44px; width: auto; object-fit: contain; }
.slide__title { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.slide__sub { margin: 0; font-size: 14px; line-height: 20px; color: var(--wp--preset--color--muted); }
.slide__text { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.slide__text p { margin: 0 0 10px; }
.slide__btn { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); text-decoration: none; color: var(--wp--preset--color--accent); }
.slide__btn::after { content: ' →'; }

.section--dark .slide { background: #3a3a3a; color: #fff; }
.section--dark .slide__title { color: #fff; }

.slides-arrow {
	position: absolute; top: 50%; z-index: 2;
	width: 60px; height: 60px; margin-top: -30px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	cursor: pointer;
	display: none;
}
.slides-arrow::before {
	content: ''; position: absolute; top: 50%; left: 50%;
	width: 12px; height: 12px; margin: -6px 0 0 -6px;
	border-top: 2px solid #fff; border-right: 2px solid #fff;
}
.slides-arrow--prev { left: calc(50% - 50vw + 30px); }
.slides-arrow--prev::before { transform: rotate(-135deg); margin-left: -3px; }
.slides-arrow--next { right: calc(50% - 50vw + 30px); }
.slides-arrow--next::before { transform: rotate(45deg); margin-left: -9px; }
.slides-arrow:hover { background: #fc3f3f; }

.slides-radio:nth-of-type(1):checked ~ .slides .slides__track { transform: translateX(calc(-0 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(1):checked ~ .slides .slides-arrow[data-poz="0"] { display: block; }
.slides-radio:nth-of-type(2):checked ~ .slides .slides__track { transform: translateX(calc(-1 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(2):checked ~ .slides .slides-arrow[data-poz="1"] { display: block; }
.slides-radio:nth-of-type(3):checked ~ .slides .slides__track { transform: translateX(calc(-2 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(3):checked ~ .slides .slides-arrow[data-poz="2"] { display: block; }
.slides-radio:nth-of-type(4):checked ~ .slides .slides__track { transform: translateX(calc(-3 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(4):checked ~ .slides .slides-arrow[data-poz="3"] { display: block; }
.slides-radio:nth-of-type(5):checked ~ .slides .slides__track { transform: translateX(calc(-4 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(5):checked ~ .slides .slides-arrow[data-poz="4"] { display: block; }
.slides-radio:nth-of-type(6):checked ~ .slides .slides__track { transform: translateX(calc(-5 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(6):checked ~ .slides .slides-arrow[data-poz="5"] { display: block; }
.slides-radio:nth-of-type(7):checked ~ .slides .slides__track { transform: translateX(calc(-6 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(7):checked ~ .slides .slides-arrow[data-poz="6"] { display: block; }
.slides-radio:nth-of-type(8):checked ~ .slides .slides__track { transform: translateX(calc(-7 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(8):checked ~ .slides .slides-arrow[data-poz="7"] { display: block; }
.slides-radio:nth-of-type(9):checked ~ .slides .slides__track { transform: translateX(calc(-8 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(9):checked ~ .slides .slides-arrow[data-poz="8"] { display: block; }
.slides-radio:nth-of-type(10):checked ~ .slides .slides__track { transform: translateX(calc(-9 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(10):checked ~ .slides .slides-arrow[data-poz="9"] { display: block; }
.slides-radio:nth-of-type(11):checked ~ .slides .slides__track { transform: translateX(calc(-10 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(11):checked ~ .slides .slides-arrow[data-poz="10"] { display: block; }
.slides-radio:nth-of-type(12):checked ~ .slides .slides__track { transform: translateX(calc(-11 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(12):checked ~ .slides .slides-arrow[data-poz="11"] { display: block; }
.slides-radio:nth-of-type(13):checked ~ .slides .slides__track { transform: translateX(calc(-12 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(13):checked ~ .slides .slides-arrow[data-poz="12"] { display: block; }
.slides-radio:nth-of-type(14):checked ~ .slides .slides__track { transform: translateX(calc(-13 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(14):checked ~ .slides .slides-arrow[data-poz="13"] { display: block; }
.slides-radio:nth-of-type(15):checked ~ .slides .slides__track { transform: translateX(calc(-14 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(15):checked ~ .slides .slides-arrow[data-poz="14"] { display: block; }
.slides-radio:nth-of-type(16):checked ~ .slides .slides__track { transform: translateX(calc(-15 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(16):checked ~ .slides .slides-arrow[data-poz="15"] { display: block; }
.slides-radio:nth-of-type(17):checked ~ .slides .slides__track { transform: translateX(calc(-16 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(17):checked ~ .slides .slides-arrow[data-poz="16"] { display: block; }
.slides-radio:nth-of-type(18):checked ~ .slides .slides__track { transform: translateX(calc(-17 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(18):checked ~ .slides .slides-arrow[data-poz="17"] { display: block; }
.slides-radio:nth-of-type(19):checked ~ .slides .slides__track { transform: translateX(calc(-18 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(19):checked ~ .slides .slides-arrow[data-poz="18"] { display: block; }
.slides-radio:nth-of-type(20):checked ~ .slides .slides__track { transform: translateX(calc(-19 * (100% + 24px) / var(--slides-cols))); }
.slides-radio:nth-of-type(20):checked ~ .slides .slides-arrow[data-poz="19"] { display: block; }

@media (max-width: 1000px) {
	.slides__track { transform: none !important; overflow-x: auto; scrollbar-width: none; }
	.slide { flex: 0 0 80%; }
	.slides-arrow { display: none !important; }
}


/* Ленты в режиме карусели: сетка раскрывается внутрь дорожки (display: contents),
   поэтому ширину задаём самим карточкам через их сетку, а не через дорожку. */
.review-grid--carousel,
.card-grid--carousel,
.clients--carousel { display: contents; }

.review-grid--carousel > .review,
.review-grid--carousel > .review:nth-child(4n+1),
.review-grid--carousel > .review:nth-child(4n+2),
.review-grid--carousel > .review:nth-child(4n+3),
.review-grid--carousel > .review:nth-child(4n+4),
.card-grid--carousel > .card,
.clients--carousel > .clients__item {
	flex: 0 0 calc((100% - (var(--slides-cols) - 1) * 24px) / var(--slides-cols));
	max-width: calc((100% - (var(--slides-cols) - 1) * 24px) / var(--slides-cols));
}
.review-grid--carousel > .review { height: auto; min-height: 242px; }


/* --- Новые элементы: плитки, баннер, колонки, соцсети, диаграмма, таблица --- */

/* Плитки */
.boxes { display: grid; gap: 24px; grid-template-columns: repeat(var(--boxes-cols), minmax(0, 1fr)); }
.box {
	display: block; text-decoration: none; color: inherit;
	padding: 40px;
	border-radius: 30px;
	background: var(--wp--preset--color--canvas);
}
a.box:hover { background: #E8F4FF; }
.box--center { text-align: center; }
.box--center .box__icon { margin-inline: auto; }
.box__icon { display: block; max-height: 56px; width: auto; margin-bottom: 20px; }
.box__title { margin: 0 0 12px; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.box__text { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.box__text p { margin: 0 0 10px; }
.box__text p:last-child { margin-bottom: 0; }

/* Баннер */
.banner {
	padding-block: 80px;
	background-size: cover; background-position: center;
	border-radius: 30px;
	margin-block: 40px;
}
.banner--dark { color: #fff; }
.banner--dark .banner__title { color: #fff; }
.banner__inner { display: grid; gap: 20px; justify-items: start; }
.banner__title { margin: 0; font-size: var(--wp--preset--font-size--hero); line-height: var(--wp--custom--line--54); font-weight: var(--wp--custom--weight--medium); max-width: 790px; }
.banner__text { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); max-width: 560px; }
.banner__text p { margin: 0; }

/* Текст в колонки */
.split { columns: var(--split-cols); column-gap: 40px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.split p { margin: 0 0 18px; break-inside: avoid; }

/* Значки соцсетей */
.soc { display: flex; align-items: center; gap: 18px; }
.soc__item img { display: block; width: auto; }

/* Поделиться */
.share { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }
.share__label { color: var(--wp--preset--color--muted); }
.share__item { text-decoration: none; color: var(--wp--preset--color--accent); }
.share__item:hover { text-decoration: underline; }

/* Круговая диаграмма */
.donut { display: grid; gap: 14px; justify-items: center; }
.donut__ring {
	position: relative;
	width: var(--donut-size); height: var(--donut-size);
	border-radius: 50%;
	display: grid; place-items: center;
	background: conic-gradient(var(--donut-color) calc(var(--donut-value) * 1%), var(--wp--preset--color--line) 0);
}
.donut__ring::before {
	content: ''; position: absolute;
	width: calc(var(--donut-size) - 28px); height: calc(var(--donut-size) - 28px);
	border-radius: 50%; background: #fff;
}
.donut__value { position: relative; font-size: 32px; line-height: 34px; font-weight: var(--wp--custom--weight--medium); }
.donut__label { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); text-align: center; max-width: 240px; }

/* Таблица */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.table th, .table td { padding: 16px 20px; text-align: left; border-bottom: 1px solid var(--wp--preset--color--line); }
.table th { font-weight: var(--wp--custom--weight--medium); }
.table tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 900px) {
	.boxes { grid-template-columns: 1fr; }
	.split { columns: 1; }
	.banner { padding-block: 50px; }
	.banner__title { font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); }
}


/* --- Фон и отступы любой секции ------------------------------------------ */
/* Задаются прямо в шорткоде: bg="голубой" pad="малые" align="центр" */

.section--canvas { background: var(--wp--preset--color--canvas); }
.section--white  { background: #fff; }
.section--sky    { background: var(--wp--preset--color--sky); color: #fff; }
.section--sky .section__title,
.section--sky h2, .section--sky h3 { color: #fff; }
.section--peach  { background: #FFE7D1; }
.section--pink   { background: var(--wp--preset--color--review-pink); }
.section--mint   { background: var(--wp--preset--color--review-mint); }

.section--pad-0 { padding-block: 0; }
.section--pad-s { padding-block: 50px; }
.section--pad-l { padding-block: 140px; }

.section--center { text-align: center; }
.section--center .section__head { grid-template-columns: 1fr; justify-items: center; }
.section--center .section__lead { text-align: center; }


/* Контурная кнопка на фотографии: тёмный текст на тёмном фоне не читается. */
.hero--photo-dark .button--ghost,
.home-hero--photo .button--ghost,
.section--dark .button--ghost {
	color: #fff;
	border-color: rgba(255, 255, 255, .7);
}
.hero--photo-dark .button--ghost:hover,
.home-hero--photo .button--ghost:hover,
.section--dark .button--ghost:hover {
	background: rgba(255, 255, 255, .12);
	color: #fff;
}

/* Заголовок ряда плиток встаёт в ту же колонку, что и сами плитки. */


/* Плитка без подложки: колонка с заголовком, текстом и ссылкой.
   Замер оригинала: колонка 260px, текст 14/21.7 шириной 200, ссылка 13/18.2. */
.box--plain {
	padding: 0;
	background: none;
	border-radius: 0;
}
a.box--plain:hover { background: none; }
a.box--plain:hover .box__title { color: var(--wp--preset--color--accent); }
.box--plain .box__title { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); margin-bottom: 14px; }
.box--plain .box__text { font-size: var(--wp--preset--font-size--xs); line-height: var(--wp--custom--line--14); max-width: 200px; }

.expert__actions { margin-top: 30px; }
@media (max-width: 900px) {
	.expert { grid-template-columns: 1fr; }
	.expert__photo img { width: 260px; height: 260px; }
}

/* Низ страниц услуг оригинала: вопросы подзаголовками 34/31, ответы открыты.
   Колонка текста 1114px, подзаголовок и абзацы от одной левой границы. */
.faq-text { display: grid; gap: 30px; }
.faq-text__card {
	/* Замер оригинала: карточка 1198 — чуть шире контейнера, текст 1134. */
	margin-inline: -18px;
	padding: 40px 32px 45px;
	border: 1px solid #B0B0B0;
	border-radius: var(--wp--custom--radius--soft);
	background: #fff;
}
.faq-text__q { margin: 0 0 20px; font-size: var(--wp--preset--font-size--title); line-height: var(--wp--custom--line--34); font-weight: var(--wp--custom--weight--medium); }
.faq-text__a p { margin: 0 0 1em; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }
.faq-text__a ul { margin: 0 0 1em; padding-left: 20px; display: grid; gap: 0; }
.faq-text__a li { font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }

/* Замер оригинала: карточка услуги 260×473, скругление 34, фото фоном под
   синей плёнкой. Заголовок 22/29.7, описание 14/21.7 на 200px, красная
   кнопка 13/18.2 внизу. Контейнер ряда 1200, шаг между карточками 300. */
.boxes--photo { grid-template-columns: repeat(var(--boxes-cols), 260px); gap: 40px; justify-content: start; }
.box--photo {
	position: relative;
	display: block;
	min-height: 473px;
	padding: 30px;
	border-radius: var(--wp--custom--radius--photo);
	overflow: hidden;
	background-size: cover;
	background-position: 50% 50%;
	color: #fff;
	text-decoration: none;
}
/* Оверлей карточки: цвета сняты с оригинала — тёплый красный сверху,
   почти чёрный снизу. При переносе стоял синий градиент. */
.box--photo .box__veil {
	position: absolute; inset: 0;
	background: linear-gradient(rgba(255, 89, 89, 0.5), rgba(33, 0, 0, 0.8));
}
.box--photo .box__body { position: relative; display: flex; flex-direction: column; height: 413px; }
.box--photo .box__title { display: block; margin: 120px 0 0; font-size: 22px; line-height: 29.7px; font-weight: var(--wp--custom--weight--medium); color: #fff; }
.box--photo .box__text { display: block; margin-top: 25px; font-size: var(--wp--preset--font-size--xs); line-height: var(--wp--custom--line--14); color: #fff; }
.box--photo .box__btn {
	margin-top: auto;
	align-self: flex-start;
	padding: 8px 15px;
	border-radius: 10px;
	background: var(--wp--preset--color--accent);
	font-size: 13px;
	line-height: 18.2px;
	color: #fff;
	text-transform: uppercase;
}
a.box--photo:hover { background-color: transparent; }
a.box--photo:hover .box__btn { background: #E14A4A; }

/* Кнопка карточки на странице контекстной рекламы — голубая: на оригинале
   красная кнопка только у карточек продвижения, здесь свой цвет. */
.page-context .box--photo .box__btn { background: #3AACFF; }
.page-context a.box--photo:hover .box__btn { background: #1F97F0; }

@media (max-width: 900px) {
	.boxes--photo { grid-template-columns: 1fr; }
	.box--photo .box__title { margin-top: 60px; }
}

/* Замер оригинала: белая плашка 1160 со скруглением 8, подписи строк слева
   на 188 (шрифт 18/27.9 жирный), колонки тарифов на 449 и 849 шириной 399.
   Название тарифа 24/32.4, цена 20/31 жирная, кнопка 171×45. */
.ptable {
	background: #fff;
	border-radius: var(--wp--custom--radius--plate);
	padding: 50px;
	display: grid;
	gap: 0;
}
.ptable__row { display: grid; grid-template-columns: 261px repeat(var(--ptable-cols), minmax(0, 400px)); align-items: start;
	border-bottom: 1px solid var(--wp--preset--color--line); }
.ptable__row--head, .ptable__row--foot { border-bottom: 0; }
.ptable__label { font-size: var(--wp--preset--font-size--medium); line-height: var(--wp--custom--line--18); font-weight: var(--wp--custom--weight--bold); padding: 26px 0; }
.ptable__cell { padding: 26px 50px 26px 0; }
.ptable__row--head .ptable__cell { padding-top: 0; }
.ptable__name { font-size: var(--wp--preset--font-size--tariff); line-height: var(--wp--custom--line--24); font-weight: var(--wp--custom--weight--medium); }
.ptable__name--sky { color: var(--wp--preset--color--sky-bright); }
.ptable__name--red { color: var(--wp--preset--color--accent); }
.ptable__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.ptable__list li { position: relative; padding-left: 24px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }
.ptable__list li::before { content: '\2713'; position: absolute; left: 0; }
.ptable__value { margin: 0; font-size: var(--wp--preset--font-size--large); line-height: var(--wp--custom--line--20); font-weight: var(--wp--custom--weight--bold); }
.ptable__note { margin: 6px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }
.ptable__star { margin: 12px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); font-style: italic; }
.ptable__row--foot .ptable__cell { padding-block: 0; }
.ptable__row--foot .button { min-width: 171px; text-align: center; text-transform: none; }

@media (max-width: 900px) {
	.ptable { padding: 24px; }
	.ptable__row { grid-template-columns: 1fr; }
	.ptable__cell { padding: 12px 0; }
}

/* Замер оригинала: фон var(--wp--preset--color--canvas) во всю ширину, заголовок 54/49 шириной 622,
   пояснение 16/22 шириной 480, кнопка 370×55. Справа ноутбук 1098×662,
   он выходит за правый край, сверху проходит светлая волна. */
.section--cta-media { position: relative; overflow: hidden; background: var(--wp--preset--color--canvas); padding-block: 215px 119px; }
.cta__wave { position: absolute; top: -25px; left: 0; width: 100%; height: auto; pointer-events: none; }
.section--cta-media .cta { position: relative; z-index: 1; max-width: none; grid-template-columns: 622px minmax(0, 1fr); align-items: center; gap: 0; }
.section--cta-media .cta__title { margin: 0; font-size: var(--wp--preset--font-size--hero); line-height: var(--wp--custom--line--54); font-weight: var(--wp--custom--weight--medium); max-width: 622px; }
.section--cta-media .cta__text { margin: 30px 0 0; max-width: 480px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: var(--wp--preset--color--text); }
.section--cta-media .cta__actions { margin-top: 56px; }
.section--cta-media .cta__actions .button { min-width: 370px; padding-block: 17px; text-align: center; text-transform: uppercase; font-size: var(--wp--preset--font-size--xs); line-height: var(--wp--custom--line--14); }
.section--cta-media .cta__media { position: relative; }
.section--cta-media .cta__media img { position: absolute; top: 50%; left: 0; width: 1098px; max-width: none; transform: translateY(-50%); }

@media (max-width: 1100px) {
	.section--cta-media { padding-block: 80px; }
	.section--cta-media .cta { grid-template-columns: 1fr; }
	.section--cta-media .cta__media { display: none; }
	.section--cta-media .cta__actions .button { min-width: 0; width: 100%; }
}

/* Замер оригинала: заголовок ряда на 123 сверху, ряд карточек через 30, низ 120. */
.section--boxes { padding-block: 123px 120px; }
.section--boxes .boxes__head { margin-bottom: 30px; }

/* Фоны секций как на оригинале: голубой у плиток, эксперта, формата работы,
   призыва, отзывов и вопросов; тёмный у тарифов; остальное белое. */
.section--boxes,
.section--expert,
.section--steps,
.section--cta-media,
.section--reviews,
.section--faq-text { background: var(--wp--preset--color--canvas); }

.section--advantages,
.section--cases,
.section--works,
.section--team,
.section--contacts { background: #fff; }

.section--prices-table { background: var(--wp--preset--color--dark); }
.section--prices-table .section__title { color: #fff; }
.section--prices-table .section__title mark { background: var(--wp--preset--color--sky-bright); }

/* Замер оригинала: значок кавычек 81×66 на 139/162, заголовок 54/49 шириной 517
   на 271, круглое фото 363 справа на 815/135, два столбца текста 16/24 шириной
   438 на 563, крупная фраза 30/30 шириной 473 внизу, кнопка 370×55 справа. */
.section--expert { padding-block: 135px 130px; }
.expert {
	display: grid;
	grid-template-columns: minmax(0, 602px) minmax(0, 438px);
	grid-template-areas:
		"mark  photo"
		"title photo"
		"left  right"
		"rule  rule"
		"final aside";
	gap: 0 164px;
	align-items: start;
}
.expert__quote-mark { grid-area: mark; width: 81px; height: auto; margin-bottom: 43px; }
.expert__title { grid-area: title; margin: 0; max-width: 517px; font-size: var(--wp--preset--font-size--hero); line-height: var(--wp--custom--line--54); font-weight: var(--wp--custom--weight--medium); }
.expert__photo { grid-area: photo; justify-self: end; }
.expert__photo img { width: 363px; height: 363px; border-radius: 50%; object-fit: cover; }
.expert__col { max-width: 438px; }
.expert__col--left { grid-area: left; margin-top: 96px; }
.expert__col--right { grid-area: right; margin-top: 96px; }
.expert__col p:last-child { margin-bottom: 0; }
.expert__col p { margin: 0 0 24px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }
.expert__final { grid-area: final; margin: 30px 0 0; max-width: 473px; font-size: 30px; line-height: 30px; }
.expert__aside { grid-area: aside; margin-top: 33px; max-width: 370px; }
.expert__note { margin: 0; max-width: 329px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-text); }
.expert__name { margin: 24px 0 0; font-weight: var(--wp--custom--weight--medium); }
.expert__role { margin: 0; font-size: 14px; line-height: 20px; color: var(--wp--preset--color--accent); }
.expert__btn { display: inline-block; margin-top: 131px; min-width: 370px; text-align: center; }

@media (max-width: 900px) {
	.section--expert { padding-block: 60px; }
	.expert { grid-template-columns: 1fr; grid-template-areas: "mark" "photo" "title" "left" "right" "final" "aside"; gap: 0; }
	.expert__photo { justify-self: start; margin-bottom: 24px; }
	.expert__photo img { width: 240px; height: 240px; }
	.expert__col--left, .expert__col--right { margin-top: 24px; }
	.expert__btn { min-width: 0; width: 100%; }
}

/* Замер оригинала: заголовок работ шире прочих — 909px. */
.section--works .section__title { max-width: 920px; }

/* Замер оригинала: первый ряд — четыре карточки 267×300, второй — три по 365.
   Скругление 37, фон var(--wp--preset--color--card), значок сверху ~96px, подпись 16px внизу. */
.adv-grid { display: flex; flex-wrap: wrap; gap: 31px 30px; }
.adv {
	flex: 0 0 267px;
	height: 300px;
	padding: 49px 48px 40px;
	border-radius: var(--wp--custom--radius--soft);
	background: var(--wp--preset--color--card);
	display: flex; flex-direction: column; align-items: center;
	text-align: center;
}
.adv--wide { flex: 0 0 365px; }
.adv__icon { width: 96px; height: 96px; margin-bottom: auto; }
.adv__title { margin: 24px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); font-weight: 400; }
.adv__text { margin: 8px 0 0; font-size: 14px; line-height: 20px; color: var(--wp--preset--color--muted); }

/* Пояснение справа у преимуществ крупнее и шире прочих. */
.section--advantages .section__head { grid-template-columns: minmax(0, 470px) 558px; }
.section--advantages .section__lead { font-size: 18px; line-height: 26px; max-width: 558px; }
.section--advantages .section__title { max-width: 460px; }

@media (max-width: 900px) {
	.adv, .adv--wide { flex: 1 1 240px; }
	.section--advantages .section__head { grid-template-columns: 1fr; }
}

/* Замер оригинала: карточка кейса на странице услуги — плашка 1160×365
   со скруглением 47, фото слева, название 32/32, сайт и «Читать кейс» 16/23,
   колонки результатов на 678 и 997, заголовки колонок 22/32. */
.case-svc { flex: 0 0 100vw; }
.case-svc__box {
	width: 1160px;
	max-width: calc(100% - 220px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 540px 319px 319px;
	align-items: start;
	min-height: 365px;
	padding: 57px 0 40px;
	border-radius: var(--wp--custom--radius--wide);
	background-color: var(--wp--preset--color--plate);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 100%;
	overflow: hidden;
}
.case-svc__body { padding-left: 55px; }
.case-svc__name { margin: 0; font-size: var(--wp--preset--font-size--client); line-height: var(--wp--custom--line--32); font-weight: var(--wp--custom--weight--medium); }
.case-svc__note { margin: 12px 0 0; max-width: 420px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.case-svc__result { margin: 6px 0 0; max-width: 420px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); font-weight: var(--wp--custom--weight--medium); }
.case-svc__links { display: flex; gap: 0; margin: 22px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }
.case-svc__site { min-width: 205px; }
.case-svc__site { color: inherit; text-decoration: underline; }
.case-svc__more { color: inherit; text-decoration: none; }
.case-svc__more:hover { text-decoration: underline; }
.case-svc__col-title { margin: 0 0 25px; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.case-svc__value { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); font-weight: var(--wp--custom--weight--medium); }
.case-svc__label { margin: 2px 0 53px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); max-width: 200px; }
.case-svc__label:last-child { margin-bottom: 0; }



@media (max-width: 1100px) {
	.case-svc__box { grid-template-columns: 1fr; padding: 24px; }
	.case-svc__photo { grid-row: auto; margin: 0 0 20px; }
	.case-svc__body { padding-left: 0; }
}

/* Крупный светлый знак вопроса справа сверху — украшение с оригинала. */
.section--faq-text .container { position: relative; }
.faq-text__mark {
	position: absolute; top: -30px; right: 0;
	font-size: 150px; line-height: 1; color: var(--wp--preset--color--sky-pale);
	pointer-events: none; user-select: none;
}
.faq-text__mark::before { content: '?'; }
@media (max-width: 900px) { .faq-text__mark { display: none; } }

/* Отступы секций сняты с оригинала: у каждой свой шаг сверху и снизу. */
.section--advantages { padding-block: 106px 92px; }
.section--expert { padding-block: 135px 130px; }
.section--cta-media { padding-block: 194px 47px; }
.section--faq-text { padding-block: 170px 0; }
.section--boxes { padding-block: 123px 120px; }

/* Замер оригинала: в первом экране на фотографии плашка подсветки ярче
   (var(--wp--preset--color--sky)) и текст в ней белый, а сами линии-росчерки лежат справа. */
.hero--photo-dark .hero__title mark { background: var(--wp--preset--color--sky); color: #fff; }
.hero__lines {
	position: absolute; top: 80px; left: 58%;
	width: 506px; height: auto;
	pointer-events: none; opacity: .9;
}
@media (max-width: 1100px) { .hero__lines { display: none; } }

/* Замер оригинала: колонки подвала на 136 (логотип), 500 (услуги), 840 (о нас)
   и 1078 (часы, телефон, кнопка). Заголовки колонок 22px, пункты 16/32. */
.site-footer__inner { grid-template-columns: 360px 340px 200px minmax(0, 1fr); gap: 0; align-items: start; }
.site-footer__title { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); margin-bottom: 15px; color: #fff; }
.site-footer__menu { gap: 10px; padding-left: 0; list-style: none; font-size: 16px; line-height: 22px; }
.site-footer__col--contacts { display: grid; justify-items: start; gap: 0; }
.site-footer__col--contacts .site-footer__hours { order: 2; margin: 15px 0 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); color: rgba(255,255,255,.75); }
.site-footer__col--contacts .site-footer__phone { order: 3; margin-top: 16px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); font-weight: 400; }
.site-footer__button { order: 1; margin-top: 0; min-width: 205px; text-align: center; }
.site-footer__policy { order: 4; white-space: nowrap; margin-left: -44px; margin-top: 53px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); text-decoration: underline; color: #bbb; }

@media (max-width: 1100px) {
	.site-footer__inner { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--wp--preset--spacing--50); }
}

/* Замер оригинала: кнопка «Заказать звонок» отступает от края колонки на 74. */
.section--contacts .contacts .button { margin-left: 74px; }

/* Вложенный список в выпадающем меню: отрасли под «Комплексным продвижением». */
.nav-drop__menu .sub-menu { margin: 6px 0 0; padding: 0 0 0 16px; list-style: none; display: grid; gap: 6px; }
.nav-drop__menu .sub-menu a { font-size: 13px; color: var(--wp--preset--color--muted); }
.nav-drop__menu .sub-menu a:hover { color: var(--wp--preset--color--accent); }

/* Замер оригинала: значки мессенджеров 16–20px под реквизитами,
   ниже плашка рейтинга шириной 266. */
.site-footer__icons { display: flex; align-items: center; gap: 12px; margin: 22px 0 0; }
.site-footer__icons img { display: block; }
.site-footer__icons a:hover { opacity: .75; }
.site-footer__rating { display: block; margin-top: 18px; width: 266px; }
.site-footer__rating img { width: 100%; height: auto; border-radius: var(--wp--custom--radius--plate); }

/* Замер оригинала: перед итоговой фразой тонкая черта во всю колонку. */
.expert__rule { grid-area: rule; display: block; height: 1px; margin-top: 60px; background: var(--wp--preset--color--line); }

/* Отступы секций по замерам оригинала: у каждой свой воздух сверху и снизу. */
.section--cases { padding-block: 120px 141px; }
.section--team { padding-block: 106px 120px; }
.section--reviews { padding-block: 163px 130px; }
.section--steps { padding-block: 120px 40px; }

/* Пояснение под текстом призыва: на страницах услуг оно мельче основного. */
.cta__note { margin: 24px 0 0; max-width: 620px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16); }
.section--cta .cta__title { font-size: var(--wp--preset--font-size--hero); line-height: var(--wp--custom--line--54); font-weight: var(--wp--custom--weight--medium); }
.section--cta .cta__text { font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); color: var(--wp--preset--color--ink); max-width: 700px; }

/* Подзаголовок под заголовком секции: этапы, работы, тарифы, вопросы. */
.steps-wrap .steps__lead { grid-column: 1 / -1; margin: 0 0 34px; max-width: 760px; }
.section--works .section__lead,
.section--prices .section__lead,
.section--faq .section__lead { margin: -12px 0 34px; max-width: 760px; }

/* Список кейсов в разделе «Кейсы»: карточка на светлой плашке. */
.case-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 30px; margin: 34px 0 60px; }
.case-list__item { display: flex; flex-direction: column; gap: 10px; padding: 34px; border-radius: var(--wp--custom--radius--block); background: var(--wp--preset--color--card); color: inherit; text-decoration: none; }
.case-list__item:hover { background: var(--wp--preset--color--canvas); }
.case-list__name { margin: 0; font-size: var(--wp--preset--font-size--client); line-height: var(--wp--custom--line--32); font-weight: var(--wp--custom--weight--medium); }
.case-list__result { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: var(--wp--custom--line--22-card); }
.case-list__note { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); color: var(--wp--preset--color--muted); }
.case-list__more { margin-top: auto; padding-top: 12px; font-size: var(--wp--preset--font-size--small); }
@media (max-width: 767px) { .case-list { grid-template-columns: 1fr; } .case-list__item { padding: 24px; } }
.reviews__note { margin: 10px 0 0; max-width: 560px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); color: var(--wp--preset--color--muted); }
.next__text { display: block; margin-top: 10px; font-size: var(--wp--preset--font-size--small); line-height: var(--wp--custom--line--16-wide); }


/* Строка достижения и ссылка на разбор в ленте кейсов на страницах услуг. */
.case-slide__result-line { margin: 8px 0 0; font-size: var(--wp--preset--font-size--base); line-height: var(--wp--custom--line--24); }
.case-slide__more { display: inline-block; margin-top: 8px; font-size: var(--wp--preset--font-size--small); color: inherit; text-decoration: none; }
.case-slide__more:hover { text-decoration: underline; }


/* ═══ МЕНЮ ВО ВЕСЬ ЭКРАН ═══
   Замер оригинала: белое полотно поверх страницы, слева шесть услуг 32/32 с
   красными номерами, посередине разделы 18/28 с шагом 48, справа телефон,
   почта и мессенджеры, внизу тёмная полоса с призывом. */

.nav-mega-open {
	padding: 5px 14px;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--dark-soft);
	font-size: 14px;
	line-height: 22px;
	color: #fff;
	cursor: pointer;
	white-space: nowrap;
}
.nav-mega-open:hover { opacity: .85; }

.mega {
	position: fixed; inset: 58px 10px 0; z-index: 90;
	display: none;
	background: #fff;
	border-radius: 20px 20px 0 0;
	box-shadow: 0 -10px 40px rgba(0, 0, 0, .25);
	overflow-y: auto;
}
.mega-toggle:checked ~ .mega { display: block; }
.mega__inner { position: relative; min-height: 100%; padding: 34px 141px 0; }

.mega__top { display: flex; align-items: center; gap: 18px; }
.mega__logo { margin-right: auto; display: block; text-decoration: none; }
.mega__logo img { display: block; width: 158px; height: auto; }
.mega__logo-sub { margin-top: 5px; opacity: .8; }
.mega__cta {
	display: inline-flex; align-items: center; justify-content: center;
	width: 192px; height: 42px;
	border-radius: var(--wp--custom--radius--plate);
	background: var(--wp--preset--color--dark);
	font-size: 14px; color: #fff; text-decoration: none;
}
.mega__close {
	display: inline-flex; align-items: center; justify-content: center;
	width: 100px; height: 42px;
	border-radius: var(--wp--custom--radius--plate);
	background: #ffd2d2;
	font-size: 14px; font-weight: 600; color: var(--wp--preset--color--accent);
	cursor: pointer;
}

.mega__cols { display: grid; grid-template-columns: 628px 199px 200px auto; padding-top: 43px; }
.mega__col--soc { text-align: right; }
.mega__label { display: block; margin-bottom: 40px; font-size: 16px; color: #9b9b9b; }

.mega__services, .mega__list, .mega__sub { margin: 0; padding: 0; list-style: none; }
.mega__service { position: relative; padding-left: 34px; margin-bottom: 34px; }
.mega__num { position: absolute; left: 0; top: 2px; font-size: 16px; color: var(--wp--preset--color--accent); }
.mega__service-link {
	display: inline-block;
	font-size: 32px; line-height: 32px; font-weight: 500;
	color: var(--wp--preset--color--dark); text-decoration: none;
	cursor: pointer;
}
.mega__service-link:hover { color: var(--wp--preset--color--accent); }
.mega__details summary { list-style: none; }
.mega__details summary::after {
	content: "";
	display: inline-block; margin-left: 10px;
	border: 5px solid transparent; border-top-color: currentColor;
	transform: translateY(4px);
}
.mega__details summary::-webkit-details-marker { display: none; }
.mega__sub { margin: 24px 0 0 161px; display: grid; gap: 26px; }
.mega__sub a { font-size: 16px; color: var(--wp--preset--color--dark); text-decoration: none; }
.mega__sub a:hover { color: var(--wp--preset--color--accent); }

.mega__list { display: grid; gap: 20px; }
.mega__list a { font-size: 18px; line-height: 28px; font-weight: 500; color: var(--wp--preset--color--dark); text-decoration: none; }
.mega__list a:hover { color: var(--wp--preset--color--accent); }

/* Низ меню: адрес, метро и режим работы — как на оригинале. */
.mega__addr { margin-left: 628px; padding: 34px 0 60px; border-top: 1px solid #e6e6e6; }
.mega__addr .mega__label { margin-bottom: 46px; }
.mega__addr-line { display: flex; align-items: center; gap: 16px; margin: 0 0 12px; font-size: 16px; line-height: 24px; color: var(--wp--preset--color--dark); }
.mega__addr-link { color: inherit; text-decoration: none; }
.mega__addr-line img { display: block; width: 24px; height: 24px; }
.mega__addr-label { margin: 24px 0 4px; font-size: 14px; letter-spacing: .02em; color: #9b9b9b; }
.mega__addr-hours { margin: 0; font-size: 14px; color: #9b9b9b; }

@media (max-width: 1200px) {
	.mega__inner { padding: 80px 24px 0; }
	.mega__cols { grid-template-columns: 1fr; gap: 40px; padding-top: 60px; }
	.mega__top { right: 24px; top: 24px; }
	.mega__addr { margin-left: 0; padding-bottom: 40px; }
}


/* ═══ ПАНЕЛЬ WORDPRESS ═══
   Для вошедшего в админку сверху висит своя полоса: шапка и меню во весь экран
   прижаты к верху окна, поэтому их нужно опустить на её высоту. */
body.admin-bar .mega { top: 90px; }
@media screen and (max-width: 782px) {
	body.admin-bar .mega { top: 104px; }
}

.certs__partner { display: inline-block; margin-top: 12px; }
.certs__partner img { display: block; width: 140px; height: auto; }

.case-list__wish { margin: var(--wp--preset--spacing--60) 0 0; font-size: var(--wp--preset--font-size--title); font-weight: 500; line-height: var(--wp--custom--line--34); color: var(--wp--preset--color--muted); }
.case-list__form { margin-top: var(--wp--preset--spacing--60); }

.rubik-form { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--40); }
.rubik-form__row { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.rubik-form__label { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.rubik-form__field { padding: 12px 16px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--card); font: inherit; }
.rubik-form__note { margin: 0; font-size: var(--wp--preset--font-size--xxs); color: var(--wp--preset--color--muted); }
.rubik-form__code { display: inline-block; margin-right: 8px; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.case-hero__achievement { margin: var(--wp--preset--spacing--30) 0 0; font-size: var(--wp--preset--font-size--large); line-height: var(--wp--custom--line--20); }
.case-results__group { margin: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--x-large); font-weight: 500; }

.case-card__group { display: block; width: 100%; margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--xs); opacity: .7; }
.case-card__more { display: inline-block; margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink); }

.box__more { display: inline-block; margin: var(--wp--preset--spacing--20) 0 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink); }

.case-news { flex: 0 0 var(--case-news, 360px); max-width: 100%; }
.case-news__link { display: block; color: inherit; text-decoration: none; }
.case-news__date { display: block; margin: 0 0 var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--xs); text-transform: uppercase; opacity: .6; }
.case-news__title { margin: 0 0 var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--m); }
.case-news__text { margin: 0; font-size: var(--wp--preset--font-size--xs); }
.case-news__photo img { width: 100%; height: auto; border-radius: var(--rubik-radius, 16px); }

.contacts__label { margin-right: var(--wp--preset--spacing--20); opacity: .6; }

.news-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--wp--preset--spacing--50); }

.site-footer__menu a { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--surface); }
.site-footer__policy a { color: #bbb; }


/* Вертикальные отступы секций сняты с оригинала: у каждой свой ритм. */
.section--services { padding-block: 63px 117px; }
.section--clients { padding-block: 145px 146px; }
.section--certificates { padding-block: 207px 119px; }
.section--certificates .certs { margin-top: 0; }
.section--next { padding-block: 134px 148px; }
.section--blog { padding-block: 58px 158px; }
.section--blog .blog-grid, .section--blog .card-grid { margin-top: 119px; }
.section--contacts { padding-block: 120px; }

/* Блок контактов повторяет раскладку оригинала: заголовок в две строки,
   контакты столбиком, кнопка на 281 пиксель, карта справа и выше края секции.
   Раньше эти правила стояли только на главной, а на страницах услуг блок
   собирался мелким шрифтом и с кнопкой не на месте — хотя оригинал одинаков. */
.section--contacts { padding-block: 165px 120px; margin-bottom: 0; }
.contacts { display: block; position: relative; }
.contacts__title { font-size: 54px; line-height: 49px; margin: 0 0 25px; max-width: 405px; }
.contacts__list { gap: 15px; margin: 0 0 43px; }
.contacts__item { line-height: 22px; align-items: center; }
.contacts__item img { align-self: center; }
.contacts__phone { font-size: 16px; font-weight: 400; line-height: 22px; }
.contacts__email { font-size: 16px; line-height: 22px; }
.contacts__address { font-size: 16px; line-height: 22px; color: var(--wp--preset--color--ink); text-decoration: none; }
.section--contacts .contacts .button,
.section--contacts .contacts a.button {
	margin-left: 0; min-width: 281px; padding-block: 16px;
	font-size: 14px; line-height: 22px;
	text-transform: uppercase;   /* на оригинале подпись кнопки заглавными */
}
.contacts__map { position: absolute; left: 479px; top: -67px; width: 700px; }
.contacts__map iframe { width: 700px; height: 468px; min-height: 0; }

/* «Смотрите далее»: три карточки 370x186 с центрованным текстом, как на оригинале. */
.next { grid-template-columns: repeat(3, 370px); gap: 25px; justify-content: start; }
.next__item { min-height: 186px; height: auto; padding: 63px 0 0; gap: 13px;
	align-items: center; justify-content: flex-start; border-radius: 30px; text-align: center; }
.next__title { font-size: 34px; line-height: 41px; color: var(--wp--preset--color--ink); }
.next__arrow { font-size: 16px; line-height: 22px; color: var(--wp--preset--color--ink); }

.next__item:nth-child(3n+1) { background: #CCFFEB; }
.next__item:nth-child(3n+2) { background: #FFE3E3; }
.next__item:nth-child(3n+3) { background: #FCFFD9; }
.section--next .section__title { margin: 0; }
.section--next .next { margin-top: 70px; }

/* Первый экран: колонки макета оригинала начинаются на 138px, цифры — по ширине подписей. */
.home-hero__title, .home-hero__row { left: 18px; right: 10px; }
.home-hero__facts { left: 18px; right: 10px; display: flex; justify-content: space-between; gap: 0; }
.home-fact { display: block; }
.home-fact__value { display: block; }
/* Строкой в одну линию подписи идут только в первом экране главной: там колонки
   разведены по ширине окна. На страницах услуг подпись переносится. */
.home-hero__facts .home-fact__text { max-width: none; white-space: nowrap; margin-top: 1px; }
.home-fact__text { margin-top: 1px; }
.home-hero__bubble { right: 19px; padding: 3px; font-size: 16px; line-height: 19px; }

/* Отзывы: зазоры внутри карточки с оригинала — 25 после названия, ссылка у низа. */
.review { gap: 25px; grid-template-rows: auto auto 1fr; }
.review__link { align-self: end; }

/* Команда: заголовок стоит ниже, карточки остаются на своём месте. */
.section--team { padding-top: 120px; }
.section--team .section__title { font-weight: 400; }
.section--team .team-slider { margin-top: 0; }

/* Призыв с картинкой: пояснение 16px в одну колонку 421px, кнопка шире. */
.section--cta-media .cta__text { font-size: 16px; line-height: 22px; max-width: 421px; }
.section--cta-media .cta__actions { margin-top: 42px; }
.section--cta-media .cta__actions .button { min-width: 370px; }
.home .section--cta-media .cta__actions .button { min-width: 423px; }

/* Лента команды: карточка 260×434 на белой плашке, шаг слайда 300 — замер оригинала. */
.section--team .section__head { margin-bottom: 69px; }
.section--team .section__head .section__lead { margin-top: 9px; max-width: 210px; margin-right: 52px; justify-self: end; }
.team-track { gap: 40px; }
.team-slider .person { flex: 0 0 260px; min-height: 434px; background: #fff; }
.team-slider .person__photo { width: 260px; height: 260px; }
.team-slider .person__name { margin: 18px 0 0; font-size: 22px; line-height: 18px; }
.team-slider .person__role { margin: 12px 0 0; font-size: 14px; line-height: 16px; }
.team-slider .person__quote { margin: 6px auto 0; max-width: 220px; font-size: 16px; line-height: 22px; }

/* Оригинал рисует основную часть страницы системным Helvetica, а фирменным
   HelveticaNeueCyr — только шапку, услуги, ленту статей и меню подвала. */
.site-header, .mega, .mega-menu,
.home-hero__brand,
.section--services,
.section--team .section__title,
.card__title, .card__date,
.site-footer__title, .site-footer__menu { font-family: RubikText, Helvetica, Arial, sans-serif; }

.review-grid { gap: 30px; }
.site-footer__button { font-size: 14px; }

.section--reviews .review-grid { margin-top: 0; }

/* Лента статей на главной: карточка без плашки, как на оригинале. */
.section--blog .card { background: none; border-radius: 0; overflow: visible; }
.section--blog .card__media img { border-radius: 0; }
.section--blog .card__body { padding: 16px 0 0; gap: 6px; }
.section--blog .card__text { display: none; }
.section--blog .section__more { justify-self: end; width: auto; margin-top: 24px; }

/* Логотип в карточке отзыва не двигает название: на оригинале он выступает за строку. */
.review__head { position: relative; height: 41px; }
.review__logo { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.section--blog .card__title { min-height: 128px; }

/* Услуги: на оригинале строка выровнена по верху, название чуть выше подписей. */
.service { align-items: start; }
.service__num, .service__text, .service__link { margin-top: 4px; }

.service { padding-block: 50px; }

/* Фоны секций главной сняты с оригинала: кейсы тёмные, команда и клиенты на канве. */
.home .section--cases { background: #313131; color: #fff; }
.home .section--cases .section__title,
.home .section--cases .section__lead { color: #fff; }
.home .section--team,
.home .section--clients { background: var(--wp--preset--color--canvas); }
.home .section--cta-media { background: #fff; }
.home .section--contacts { background: var(--wp--preset--color--canvas); }

/* Карусель кейсов на главной начинается на 68px ниже заголовка — замер оригинала. */
.section--cases .case-slider { margin-top: 56px; }
.section--team .section__head .section__lead { width: 210px; max-width: none; margin-right: 62px; justify-self: end; }

/* Первый экран страницы услуги: замер оригинала — заголовок 62/68 на 315,
   колонки текста на 528, кнопки 290x55 на 665. */
.hero--service.hero--photo-dark { align-items: flex-start; }
.hero--service .hero__inner { padding-top: 0; }
.hero--service .hero__title { font-size: 62px; line-height: 68px; max-width: 639px; margin: 0 0 78px;
	/* На оригинале заголовок прижат к нижней линии 450 — сколько бы строк в нём ни было. */
	min-height: 320px; display: flex; align-items: flex-end; }
.hero--service .hero__cols { margin-bottom: 49px; }
.hero--service .hero__actions { gap: 20px; }
.hero--service .hero__actions .button { min-width: 290px; padding: 16px 8px; font-size: 14px; line-height: 22px; border-radius: 10px; text-align: center; }

.hero--service .hero__actions { flex-wrap: nowrap; }
.hero--service .hero__inner { position: static; }
.hero--service { position: relative; }
.hero--service .hero__media--round { position: absolute; right: 86px; left: auto; top: 150px; transform: none;
	width: auto; max-width: none; margin: 0; }
.hero--service .hero__media--round img { width: auto; height: auto; max-width: 584px; max-height: 660px;
	width: 584px; height: 547px; border-radius: 50%; object-fit: cover; }

.hero--service .hero__title mark { margin: 0; padding: 3px 10px; }

/* Карточка-плитка с фото: под заголовком тонкая линия, кнопка у нижнего края. */
.box--photo { padding: 30px 30px 11px; }
.box--photo .box__body { height: 376px; }
.box--photo .box__title { margin-top: 92px; line-height: 28.3px; }
.box--photo .box__title::after { content: ""; display: block; height: 1px; margin-top: 23px; background: rgba(255, 255, 255, .6); }
.box--photo .box__text { margin-top: 4px; }

/* Заголовок раздела с подписью справа: замер оригинала — подпись 178px у правого края,
   на 9px ниже верхней линии заголовка. */
.el-head { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: start; }
.el-head .el-title { margin: 0; }
.el-head__lead { position: relative; top: 66px; margin: 9px 0 0; width: 180px; justify-self: end; font-size: 16px; line-height: 22px; }

/* Широкая карточка кейса на странице услуги: замер оригинала — плашка 1160×365
   со скруглением 47, название 32/500 на 55, колонки цифр на 540 и 859. */
.case-card--wide { position: relative; width: 1160px; height: 365px; border-radius: 47px; overflow: hidden; background: var(--wp--preset--color--card); }
.case-card--wide .case-card__left { position: absolute; left: 55px; top: 57px; }
.case-card--wide .case-card__title { margin: 0; font-size: 32px; line-height: 32px; font-weight: var(--wp--custom--weight--medium); }
.case-card--wide .case-card__links { display: flex; align-items: baseline; gap: 32px; margin-top: 15px; }
.case-card--wide .case-card__site { font-size: 16px; line-height: 20px; text-decoration: underline; }
.case-card--wide .case-card__more { font-size: 16px; line-height: 20px; color: var(--wp--preset--color--ink); text-decoration: none; }
.case-card--wide .case-card__cols { position: absolute; left: 540px; top: 61px; display: flex; gap: 100px; }
.case-card--wide .case-card__col { width: 220px; }
.case-card--wide .case-card__group { display: block; margin: 0; font-size: 22px; line-height: 32px; font-weight: var(--wp--custom--weight--medium); opacity: 1; }
.case-card--wide .case-card__num { margin-top: 29px; }
.case-card--wide .case-card__value { display: block; font-size: 22px; line-height: 32px; font-weight: var(--wp--custom--weight--medium); color: var(--wp--preset--color--ink); }
.case-card--wide .case-card__label { display: block; margin-top: 2px; max-width: 200px; font-size: 16px; line-height: 23px; color: var(--wp--preset--color--ink); }

/* Карусель широких карточек: одна карточка в окне, круглые стрелки по краям экрана. */
.wide-slider { position: relative; }
.wide-slider > input { position: absolute; opacity: 0; pointer-events: none; }
.wide-slider__window { position: relative; overflow: hidden; }
.wide-slider__track { display: flex; transition: transform .45s ease; }
.wide-slider__item { flex: 0 0 100%; }
.wide-slider__arrow { display: none; position: absolute; top: 50%; width: 60px; height: 60px; margin-top: -30px;
	border-radius: 50%; background: var(--wp--preset--color--accent) no-repeat center; cursor: pointer; z-index: 2; }
.wide-slider__arrow::before { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 12px;
	border-top: 2px solid #fff; border-right: 2px solid #fff; margin-top: -6px; }
.wide-slider__arrow--prev { left: calc(50% - 50vw + 30px); }
.wide-slider__arrow--prev::before { transform: rotate(-135deg); margin-left: -3px; }
.wide-slider__arrow--next { right: calc(50% - 50vw + 30px); }
.wide-slider__arrow--next::before { transform: rotate(45deg); margin-left: -9px; }
.wide-slider > input:nth-of-type(1):checked ~ .wide-slider__window .wide-slider__track { transform: translateX(0); }
.wide-slider > input:nth-of-type(2):checked ~ .wide-slider__window .wide-slider__track { transform: translateX(-100%); }
.wide-slider > input:nth-of-type(3):checked ~ .wide-slider__window .wide-slider__track { transform: translateX(-200%); }
.wide-slider > input:nth-of-type(4):checked ~ .wide-slider__window .wide-slider__track { transform: translateX(-300%); }
.wide-slider > input:nth-of-type(5):checked ~ .wide-slider__window .wide-slider__track { transform: translateX(-400%); }
.wide-slider > input:nth-of-type(1):checked ~ .wide-slider__window .wide-slider__arrow[data-poz="0"],
.wide-slider > input:nth-of-type(2):checked ~ .wide-slider__window .wide-slider__arrow[data-poz="1"],
.wide-slider > input:nth-of-type(3):checked ~ .wide-slider__window .wide-slider__arrow[data-poz="2"],
.wide-slider > input:nth-of-type(4):checked ~ .wide-slider__window .wide-slider__arrow[data-poz="3"],
.wide-slider > input:nth-of-type(5):checked ~ .wide-slider__window .wide-slider__arrow[data-poz="4"] { display: block; }

/* Обращение руководителя: колонки 602 и 438 стоят вплотную, справа поле 124. */
.expert { grid-template-columns: 602px 438px; gap: 0; }
.expert__final { font-weight: var(--wp--custom--weight--medium); }

/* Бегущая строка: полоса 70px цвета #8DCFFF, надпись 20/300 белым — замер оригинала. */
.ticker { padding-block: 19px; background: #8DCFFF; }
.ticker__line { gap: 6px; }
.ticker__item { font-size: 20px; font-weight: 300; line-height: 31px; color: #fff; opacity: 1; }

/* Этапы: замер оригинала — 32 от номера до заголовка, 26 до текста, 50 между этапами. */
.steps { gap: 12px; }
.step__title { margin-top: 10px; }
.step__text { margin-top: 26px; }

/* Команда на странице услуги: три карточки по 320 с шагом 400 — замер оригинала. */
.person-grid { grid-template-columns: repeat(auto-fill, 320px); gap: 40px 80px; justify-content: start; }
.person-grid .person__photo { width: 320px; height: 320px; }
.person-grid .person__name { margin: 0; font-size: 22px; line-height: 31px; }
.person-grid .person__role { margin: 4px 0 0; font-size: 14px; line-height: 14px; }
.person-grid .person__quote { margin: 12px 0 0; max-width: 320px; font-size: 16px; line-height: 22px; }

/* Отступы блоков страницы услуги — по замеру оригинала. */
.page-body > .boxes { margin-bottom: 0; }
.page-body > .wide-slider { margin-top: 44px; }

.page-body > .ticker { margin-top: 206px; }
.expert__final { margin-top: 106px; }

/* Сведение по вертикали для страниц услуг — замер оригинала. Главной не касается:
   там свои отступы, сведённые отдельно. */
body:not(.home) .section--works { padding-top: 116px; }
body:not(.home) .section--works .section__title { margin-bottom: 73px; }
body:not(.home) .section--steps { padding-top: 123px; }
body:not(.home) .section--cta-media { padding-top: 120px; }
body:not(.home) .section--team .section__head { margin-bottom: 122px; }

body:not(.home) .section--steps { padding-bottom: 0; }


/* Карточка команды в сетке: подписи выровнены по левому краю с отступом 20. */
.person-grid .person { justify-items: start; text-align: left; }
.person-grid .person__name,
.person-grid .person__role,
.person-grid .person__quote { padding-left: 20px; }

body:not(.home) .section--prices { padding-block: 199px 1px; }

body:not(.home) .page-body > *:last-child { margin-bottom: 0; }

/* Этапы карточками: 660+460 и 460+660, скругление 37, своя заливка у каждой,
   цифра 270/500 белым поверх плашки — замер страницы контекстной рекламы. */
.case-plan--cards { display: flex; flex-wrap: wrap; gap: 33px 40px; }
.case-plan--cards .case-plan__item {
	position: relative; height: 242px; padding: 62px 60px 0 85px;
	border-radius: 37px; overflow: hidden;
}
.case-plan--cards .case-plan__item:nth-child(4n+1) { flex: 0 0 660px; background: #E0F3FF; }
.case-plan--cards .case-plan__item:nth-child(4n+2) { flex: 0 0 460px; background: #FFEBEB; }
.case-plan--cards .case-plan__item:nth-child(4n+3) { flex: 0 0 460px; background: #DBFFF1; }
.case-plan--cards .case-plan__item:nth-child(4n+4) { flex: 0 0 660px; background: #E5E5FF; }
.case-plan--cards .case-plan__num {
	position: absolute; left: -41px; top: -54px; width: 152px;
	font-size: 270px; line-height: 324px; font-weight: var(--wp--custom--weight--medium);
	color: #fff; text-align: center;
}
.case-plan--cards .case-plan__title { position: relative; margin: 0; font-size: 22px; line-height: 26px; font-weight: var(--wp--custom--weight--medium); }
.case-plan--cards .case-plan__text { position: relative; margin: 16px 0 0; font-size: 16px; line-height: 22px; }
@media (max-width: 1200px) {
	.case-plan--cards .case-plan__item { flex: 1 1 320px; height: auto; padding-bottom: 40px; }
}

/* Средняя карточка кейса 560×395: снимок во всю плашку, название 32/500,
   под ним три пары «значение — подпись» — замер страницы лидогенерации. */
.case-card--medium { position: relative; width: 560px; height: 395px; padding: 35px; border-radius: 37px; overflow: hidden; background: var(--wp--preset--color--card); }
.case-card--medium .case-card__title { margin: 0 0 27px; font-size: 32px; line-height: 32px; font-weight: var(--wp--custom--weight--medium); }
.case-card--medium .case-card__num { margin-top: 8px; }
.case-card--medium .case-card__value { display: block; font-size: 22px; line-height: 32px; font-weight: var(--wp--custom--weight--medium); color: var(--wp--preset--color--ink); }
.case-card--medium .case-card__label { display: block; font-size: 16px; line-height: 23px; color: var(--wp--preset--color--ink); max-width: 290px; }

/* Плитки со снимком: 259×380 сверху, шаг 300 — замер страницы таргета. */
.case-plan--tiles { display: flex; flex-wrap: wrap; gap: 41px; }
.case-plan--tiles .case-plan__item { flex: 0 0 259px; }
.case-plan--tiles .case-plan__photo { display: block; width: 259px; height: 380px; object-fit: cover; border-radius: 30px; }
.case-plan--tiles .case-plan__title { margin: 22px 0 0; font-size: 16px; line-height: 20px; font-weight: var(--wp--custom--weight--medium); }
.case-plan--tiles .case-plan__text { margin: 10px 0 0; font-size: 16px; line-height: 22px; }
@media (max-width: 900px) { .case-plan--tiles .case-plan__item { flex: 1 1 240px; } .case-plan--tiles .case-plan__photo { width: 100%; } }

/* Цифры первого экрана на страницах услуг лежат поверх фотографии, а не под ней:
   на оригинале строка цифр стоит на 842 при первом экране 70…970. */
.page-body > .section--facts:first-child { margin-top: -161px; padding-block: 0; position: relative; z-index: 2; color: #fff;
	/* Замер оригинала: следующий блок начинается на 367 ниже строки цифр. */
	margin-bottom: 221px; }
.page-body > .section--facts:first-child .facts-row { display: flex; gap: 0; justify-content: space-between; }
/* Замер оригинала: колонки цифр начинаются на 138, 349, 577, 862 и 1108 от края окна.
   Пять колонок раскладываем сеткой, подписи переносятся по строкам, как в оригинале. */
.page-body > .section--facts:first-child .facts-row:has(> :nth-child(5)):not(:has(> :nth-child(6))) {
	display: grid; grid-template-columns: 211px 228px 285px 246px 190px; gap: 0; justify-content: start;
}
.page-body > .section--facts:first-child .home-fact__text { white-space: normal; max-width: none; }
.page-body > .section--facts:first-child .fact__value { font-size: 34px; line-height: 41px; font-weight: var(--wp--custom--weight--medium); color: #fff; }
.page-body > .section--facts:first-child .fact__text { font-size: 16px; line-height: 22px; color: #fff; white-space: nowrap; }

/* Иллюстрации внутри текстовых блоков страниц услуг стоят справа от текста,
   как на оригинале, а не отдельной полосой во всю ширину. */
body.page .page-body > .el-img { float: right; margin: 0 calc(50% - 580px) 34px 48px; max-width: 45%; }
/* Одна колонка для всего содержимого страницы: и абзацы, и списки, и заголовки
   стоят по одной левой границе. Раньше отступ задавался тремя разными способами
   (padding у абзацев, max-width с margin у списков), и у списка они складывались —
   текст уезжал на 260 вместо 140. */
body.page .page-body > p,
body.page .page-body > ul,
body.page .page-body > ol,
body.page .page-body > .el-text,
body.page .page-body > .el-title,
body.page .page-body > .el-head,
body.page .page-body > h2,
body.page .page-body > h3,
body.page .page-body > .el-num,
body.page .page-body > .el-quote,
body.page .page-body > .faq,
body.page .page-body > .btn-row,
body.page .page-body > .table-wrap {
	max-width: 1160px;
	margin-inline: auto;
	padding-left: 0;
	padding-right: 0;
	box-sizing: border-box;
}
/* Значок рисуется внутри пункта, поэтому своего отступа списку не нужно. */
body.page .page-body > ul,
body.page .page-body > ol { padding-left: 0; }
body.page .page-body > .plain-list,
body.page .page-body > .tab-row,
body.page .page-body > .tag-list { padding-left: 0; }
/* На узких экранах у содержимого свои поля по краям: 84 пикселя на планшете
   и 20 на телефоне — замер оригинала. Правила старых постраничных блоков
   обнуляли отступ, поэтому здесь !important. */
@media (max-width: 1240px) {
	body[class] .page-body > p,
	body[class] .page-body > ul,
	body[class] .page-body > ol,
	body[class] .page-body > .el-text,
	body[class] .page-body > .el-title,
	body[class] .page-body > .el-head,
	body[class] .page-body > h2,
	body[class] .page-body > h3,
	body[class] .page-body > .el-num,
	body[class] .page-body > .el-quote,
	body[class] .page-body > .faq,
	body[class] .page-body > .btn-row,
	body[class] .page-body > .table-wrap { padding-inline: 84px !important; }
	body[class] .page-body > ul,
	body[class] .page-body > ol { padding-left: 84px !important; }
}
@media (max-width: 600px) {
	body[class] .page-body > p,
	body[class] .page-body > ul,
	body[class] .page-body > ol,
	body[class] .page-body > .el-text,
	body[class] .page-body > .el-title,
	body[class] .page-body > .el-head,
	body[class] .page-body > h2,
	body[class] .page-body > h3,
	body[class] .page-body > .el-num,
	body[class] .page-body > .el-quote,
	body[class] .page-body > .faq,
	body[class] .page-body > .btn-row,
	body[class] .page-body > .table-wrap { padding-inline: 20px !important; }
	body[class] .page-body > ul,
	body[class] .page-body > ol { padding-left: 20px !important; }
}
body.page .page-body > .el-img img { width: 100%; height: auto; display: block; }
body.page .page-body > section,
body.page .page-body > .ticker,
body.page .page-body > .el-title,
body.page .page-body > .el-head,
body.page .page-body > h2,
body.page .page-body > .table-wrap,
body.page .page-body > .check-list,
body.page .page-body > .slider,
body.page .page-body > .wide-slider { clear: both; }

/* Страница «Команда»: карточки идут по четыре в ряд, как на оригинале. */
body.page-id-55 .person-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 20px; }
body.page-id-55 .person-grid .person__photo { width: 100%; height: auto; aspect-ratio: 1; }
body.page-id-55 .person-grid .person__photo img { width: 100%; height: 100%; object-fit: cover; }

/* «О компании»: заголовок первого экрана 94px — замер оригинала. */
body.page-id-25 .hero__title { font-size: 94px; line-height: 100px; max-width: 900px; }

/* Первый экран простых страниц: у оригинала он ниже главного и заголовок крупнее. */
body.page-id-21 .hero--page, body.page-id-39 .hero--page { min-height: 550px; }
body.page-id-14 .hero--page { min-height: 720px; }
body.page-id-21 .hero--page .hero__title,
body.page-id-39 .hero--page .hero__title { font-size: 74px; line-height: 80px; max-width: 20ch; }
body.page-id-14 .hero--page .hero__title { font-size: 60px; line-height: 66px; max-width: 20ch; }

/* На странице «Команда» блок стоит сразу под первым экраном, без большого отступа. */
body.page-id-55 .section--team { padding-top: 120px; }
body.page-id-55 .section--team .section__head { margin-bottom: 60px; }

/* Заголовок кейса: 130px, как на оригинале. */
.case-hero__title { font-size: 130px; line-height: 130px; }
@media (max-width: 900px) { .case-hero__title { font-size: clamp(48px, 12vw, 130px); line-height: 1.02; } }

/* Страницы кейсов: у оригинала блоки идут плотнее, чем на страницах услуг. */
body.single-rubik_case .section { padding-block: 70px; }

/* Первый экран статьи: снимок на всю ширину, заголовок 60/68 по центру. */
.post-hero { position: relative; min-height: 900px; display: flex; align-items: center; justify-content: center;
	background-size: cover; background-position: center; text-align: center; }
.post-hero::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); }
.post-hero__title { position: relative; max-width: 1166px; margin: 0; padding: 0 20px;
	font-size: 60px; line-height: 68px; font-weight: var(--wp--custom--weight--medium); color: #fff; }
.entry--single { padding-top: 70px; }
@media (max-width: 900px) { .post-hero { min-height: 420px; } .post-hero__title { font-size: 34px; line-height: 40px; } }

/* --- Шапка лендинга ----------------------------------------------------- */

/*
 * У отдельных лендингов оригинала своя полоса поверх первого экрана: слева
 * значок меню, за ним логотип, справа кнопка. Пункты лежат в панели шириной
 * 280 пикселей, она выезжает слева. Панель открывает флажок, как и выпадающее
 * меню общей шапки. На телефоне остаётся один значок меню.
 */
.lnav {
	position: fixed;
	inset: 0 0 auto;
	z-index: 990;
	pointer-events: none;
}
.lnav__inner {
	display: flex;
	align-items: center;
	gap: 50px;
	height: 120px;
	padding-inline: 24px;
}
.lnav__inner > * { pointer-events: auto; }

.lnav__burger {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	flex: none;
	width: 60px;
	height: 60px;
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 50%;
	cursor: pointer;
}
.lnav__burger span {
	display: block;
	height: 2px;
	background: #fff;
}
.lnav__burger span:nth-child(1),
.lnav__burger span:nth-child(2) { width: 22px; }
.lnav__burger span:nth-child(3) { width: 14px; margin-right: 8px; }

.lnav__brand { display: flex; flex: none; flex-direction: column; gap: 6px; line-height: 0; }
.lnav__logo { width: 227px; height: auto; }
.lnav__sub { width: 227px; height: auto; }

.lnav__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	width: 263px;
	height: 60px;
	border-radius: 200px;
	background: #a50014;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	text-decoration: none;
}
.lnav__btn:hover { opacity: .9; }

.lnav-overlay {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: none;
}
.lnav-menu {
	position: fixed;
	inset: 0 auto 0 0;
	z-index: 999999;
	width: 280px;
	padding: 48px 40px;
	background: #171b1b;
	transform: translateX(-100%);
	transition: transform .3s;
}
.lnav-menu__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.lnav-menu__list li + li { margin-top: 15px; }
.lnav-menu__list a {
	color: #fff;
	font-size: 18px;
	font-weight: 300;
	line-height: 21px;
	text-decoration: none;
}
.lnav-menu__close {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 40px;
	height: 40px;
	cursor: pointer;
}
.lnav-menu__close::before,
.lnav-menu__close::after {
	content: "";
	position: absolute;
	top: 19px;
	left: 10px;
	width: 20px;
	height: 2px;
	background: #fff;
}
.lnav-menu__close::before { transform: rotate(45deg); }
.lnav-menu__close::after { transform: rotate(-45deg); }

.lnav-toggle:checked ~ .lnav-menu { transform: none; }
.lnav-toggle:checked ~ .lnav-overlay { display: block; }

@media (max-width: 900px) {
	.lnav__inner { padding-inline: 12px; }
}
@media (max-width: 600px) {
	.lnav__inner { height: 97px; gap: 0; }
	.lnav__burger { width: 49px; height: 49px; gap: 7px; }
	.lnav__burger span:nth-child(1),
	.lnav__burger span:nth-child(2) { width: 28px; }
	.lnav__burger span:nth-child(3) { width: 18px; }
	.lnav__brand,
	.lnav__btn { display: none; }
}

/* --- Тёмное оформление страницы ----------------------------------------- */

/*
 * Часть лендингов оригинала целиком тёмная: фон #171b1b, текст белый,
 * акценты остаются красными. Переопределяем палитру темы, а не отдельные
 * блоки, — тогда тёмными становятся и карточки, и таблицы, и подвал.
 */
body.rubik-dark {
	--wp--preset--color--ink: #ffffff;
	--wp--preset--color--dark: #ffffff;
	--wp--preset--color--dark-soft: #e6e8e8;
	--wp--preset--color--muted: #c9cdcd;
	--wp--preset--color--date: #9aa0a0;
	--wp--preset--color--canvas: #171b1b;
	--wp--preset--color--surface: #171b1b;
	--wp--preset--color--card: #1f2424;
	--wp--preset--color--plate: #1f2424;
	--wp--preset--color--line: rgba(255, 255, 255, .12);
	background: #171b1b;
	color: #fff;
}
body.rubik-dark .site-main,
body.rubik-dark .entry,
body.rubik-dark .section,
body.rubik-dark .site-footer { background: transparent; color: #fff; }
body.rubik-dark h1,
body.rubik-dark h2,
body.rubik-dark h3,
body.rubik-dark h4,
body.rubik-dark p,
body.rubik-dark li,
body.rubik-dark td,
body.rubik-dark th,
body.rubik-dark .section__title,
body.rubik-dark .box__title,
body.rubik-dark .card__title { color: #fff; }
body.rubik-dark .breadcrumbs,
body.rubik-dark .breadcrumbs a { color: rgba(255, 255, 255, .6); }
body.rubik-dark .box { background: transparent; padding-inline: 0; }
body.rubik-dark .card,
body.rubik-dark .faq__item { background: rgba(255, 255, 255, .04); }
body.rubik-dark .section--facts .home-fact,
body.rubik-dark .section--facts .fact { color: #fff; }

/* Блоки тёмного лендинга: замеры сняты со страницы автосервисов. */

/* Колонки проблем: значок справа от заголовка, между ними красная линия. */
body.rubik-dark.page-id-44 .section--boxes .box {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 60px;
	align-items: center;
	column-gap: 12px;
}
body.rubik-dark.page-id-44 .section--boxes .box__title {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0;
	font-size: 24px;
	line-height: 28px;
	font-weight: 200;
}
body.rubik-dark.page-id-44 .section--boxes .box__title::after {
	content: "";
	flex: 1;
	height: 1px;
	background: #c5001e;
}
body.rubik-dark.page-id-44 .section--boxes .box__icon {
	grid-column: 2;
	grid-row: 1;
	width: 60px;
	height: 60px;
	margin: 0;
}
body.rubik-dark.page-id-44 .section--boxes .box__text {
	grid-column: 1 / -1;
	margin-top: 26px;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
}
body.rubik-dark.page-id-44 .section--boxes .box__text p + p { margin-top: 28px; }

/* Широкая красная кнопка между блоками. */
body.rubik-dark .btn-row { margin-block: 40px; }
body.rubik-dark .btn-row .button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	width: 100%;
	height: 60px;
	border-radius: 8px;
	background: #c5001e;
	color: #fff;
	font-size: 20px;
	font-weight: 800;
	text-transform: none;
}

/* Инструменты: карточки с градиентом, внизу исполнитель. */
body.rubik-dark .case-plan:has(.case-plan__author) {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 26px;
}
body.rubik-dark .case-plan:has(.case-plan__author) .case-plan__item {
	grid-column: span 2;
	display: flex;
	flex-direction: column;
	min-height: 315px;
	padding: 20px;
	border-radius: 8px;
	background: linear-gradient(122.04deg, rgba(114, 125, 125, .32) 0%, rgba(255, 255, 255, .64) 100%);
}
body.rubik-dark .case-plan:has(.case-plan__author) .case-plan__item:nth-child(4),
body.rubik-dark .case-plan:has(.case-plan__author) .case-plan__item:nth-child(5) {
	grid-column: span 3;
	min-height: 262px;
}
body.rubik-dark .case-plan__item .case-plan__title {
	margin: 0 0 12px;
	font-size: 32px;
	line-height: 40px;
	font-weight: 200;
	color: #fff;
}
body.rubik-dark .case-plan:has(.case-plan__author) .case-plan__text {
	margin: 0;
	font-size: 18px;
	line-height: 23px;
	font-weight: 300;
	color: #fff;
}
.case-plan__author {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	column-gap: 12px;
	margin-top: auto;
	padding-top: 24px;
}
.case-plan__face {
	grid-row: span 2;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}
.case-plan__person { font-size: 16px; font-weight: 800; color: #fff; }
.case-plan__role { font-size: 16px; font-weight: 200; color: #fff; }

/* Пояснение под инструментами лежит полосой с градиентом. */
body.rubik-dark .section--case-plan:has(.case-plan__author) .container { display: flex; flex-direction: column; }
body.rubik-dark .section--case-plan:has(.case-plan__author) .section__lead {
	order: 3;
	margin: 26px 0 0;
	padding: 16px 20px;
	border-radius: 8px;
	background: linear-gradient(35.64deg, rgba(0, 154, 166, .32) 0%, rgba(114, 125, 125, .32) 100%);
	font-size: 16px;
	font-weight: 200;
	color: #fff;
}

/* Преимущества: значок 52×52 над подписью. */
body.rubik-dark .adv__icon { width: 52px; height: 52px; }

/* Заголовки разделов тёмного лендинга: 52/57, светлое начертание, во всю ширину. */
body.rubik-dark .section__title {
	max-width: none;
	font-size: 52px;
	line-height: 57px;
	font-weight: 200;
}
body.rubik-dark .section__lead { max-width: none; }

/* На лендингах оригинала блоки идут вплотную: между ними полосы по 40–90 пикселей. */
body.rubik-dark .section { padding-block: 40px; }
body.rubik-dark .section--boxes + .btn-row,
body.rubik-dark .btn-row + .section { margin-top: 0; }

/* Пункты с красной шапкой: кружок-номер и название на плашке, под ней пояснение. */
.case-plan--heads { display: flex; align-items: flex-start; gap: 33px; }
.case-plan--heads .case-plan__item {
	position: relative;
	flex: 1;
	padding-top: 56px;
}
.case-plan--heads .case-plan__item::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 48px;
	border-radius: 8px;
	background: linear-gradient(90deg, rgba(199, 21, 42, 0) 0%, rgb(199, 21, 42) 100%);
}
.case-plan--heads .case-plan__num {
	position: absolute;
	top: 8px;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #c7152a;
	font-size: 20px;
	line-height: 23px;
	font-weight: 200;
	color: #fff;
}
.case-plan--heads .case-plan__title {
	position: absolute;
	top: 12px;
	left: 48px;
	margin: 0;
	font-size: 20px;
	line-height: 23px;
	font-weight: 200;
	color: #fff;
}
.case-plan--heads .case-plan__text {
	margin: 0;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	color: #fff;
}

/* Пояснение к разделу лежит плашкой справа от заголовка. */
body.rubik-dark .section--case-plan:has(.case-plan--heads) .container {
	display: grid;
	grid-template-columns: minmax(0, 584px) minmax(0, 1fr);
	column-gap: 36px;
}
body.rubik-dark .section--case-plan:has(.case-plan--heads) .section__title { grid-column: 1; margin: 0; }
body.rubik-dark .section--case-plan:has(.case-plan--heads) .section__lead {
	grid-column: 2;
	margin: 0;
	padding: 16px 24px;
	border-left: 4px solid #0072c1;
	border-radius: 0 8px 8px 0;
	background: linear-gradient(35.64deg, rgba(0, 114, 193, .32) 0%, rgba(114, 125, 125, .32) 100%);
	font-size: 18px;
	line-height: 23px;
	font-weight: 200;
}
body.rubik-dark .section--case-plan:has(.case-plan--heads) .case-plan { grid-column: 1 / -1; margin-top: 84px; }

/* Створки кейса: две синие плашки рядом, внутри перечень. */
body.rubik-dark .faq {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px;
}
body.rubik-dark .faq__item {
	padding: 0;
	border-radius: 8px;
	background: #0072c1;
	align-self: start;
}
body.rubik-dark .faq__q {
	padding: 24px;
	font-size: 24px;
	line-height: 34px;
	font-weight: 200;
	color: #fff;
}
body.rubik-dark .faq__q::after { color: #fff; font-weight: 200; }
body.rubik-dark .faq__a {
	margin: 0;
	padding: 0 24px 24px;
	color: #fff;
	font-size: 16px;
	line-height: 24.8px;
	font-weight: 300;
}
body.rubik-dark .faq__a strong {
	display: block;
	margin-top: 16px;
	font-weight: 500;
}

/* Пары «метка — значение» в кейсе идут двумя колонками, без значков. */
body.rubik-dark.page-id-44 .plain-list {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	justify-content: start;
	column-gap: 24px;
	row-gap: 8px;
	list-style: none;
	padding: 0;
	max-width: 1160px;
	margin-inline: auto;
}
body.rubik-dark.page-id-44 .plain-list li { margin: 0; }
body.rubik-dark .plain-list { list-style: none; padding-left: 0; }

/* Результаты кейса: зелёные плашки справа, значение крупно у правого края. */
body.rubik-dark .section--facts .section__title { font-size: 32px; line-height: 40px; }
body.rubik-dark .section--facts .facts-row {
	display: grid;
	grid-template-columns: minmax(0, 420px);
	justify-content: end;
	gap: 8px;
}
body.rubik-dark .section--facts .home-fact {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 24px;
	min-height: 145px;
	padding: 24px;
	border-radius: 8px;
	background: linear-gradient(0deg, rgba(15, 179, 40, .8) 0%, rgba(15, 179, 40, .12) 100%);
}
body.rubik-dark .section--facts .home-fact__text {
	order: 1;
	font-size: 20px;
	line-height: 25px;
	font-weight: 200;
	color: #fff;
}
body.rubik-dark .section--facts .home-fact__value {
	order: 2;
	font-size: 32px;
	line-height: 40px;
	font-weight: 200;
	color: rgb(15, 179, 40);
}
body.rubik-dark .section--facts .home-fact__note { display: none; }

/* Призыв с фотографией: снимок во всю ширину, заголовок на красной заливке. */
body.rubik-dark .section--cta-media .cta__wave { display: none; }
body.rubik-dark .section--cta-media .cta {
	position: relative;
	display: block;
	min-height: 622px;
	padding: 0;
	border-radius: 8px;
	overflow: hidden;
}
body.rubik-dark .section--cta-media .cta__media {
	position: absolute;
	inset: 0;
	margin: 0;
	width: auto;
}
body.rubik-dark .section--cta-media .cta__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
body.rubik-dark .section--cta-media .cta__body {
	position: relative;
	z-index: 2;
	max-width: 620px;
	padding: 32px 20px 40px;
}
body.rubik-dark .section--cta-media .cta__title {
	display: inline;
	padding: 8px 20px 8px 20px;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	background: linear-gradient(91.8deg, rgb(197, 0, 24) 0%, rgba(197, 0, 24, 0) 100%);
	font-size: 38px;
	line-height: 66px;
	font-weight: 200;
	color: #fff;
}
body.rubik-dark .section--cta-media .cta__actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 340px;
	max-width: 552px;
}
body.rubik-dark .section--cta-media .cta__actions .button {
	justify-content: center;
	height: 60px;
	border-radius: 8px;
	font-size: 18px;
	font-weight: 600;
}
body.rubik-dark .section--cta-media .button--accent { background: #c50018; color: #fff; }
body.rubik-dark .section--cta-media .button--ghost { border: 0; background: #fff; color: #171b1b; }

/* Этапы работ слева от цифр: серые плашки со стрелкой у правого края. */
body.rubik-dark .section--facts:has(.facts-steps) .container {
	display: grid;
	grid-template-columns: minmax(0, 700px) minmax(0, 420px);
	justify-content: space-between;
	column-gap: 40px;
}
body.rubik-dark .section--facts:has(.facts-steps) .section__title { grid-column: 1 / -1; }
body.rubik-dark .facts-steps { display: grid; gap: 8px; align-content: start; }
body.rubik-dark .facts-step {
	position: relative;
	display: grid;
	gap: 4px;
	min-height: 80px;
	padding: 14px 60px 14px 12px;
	border-radius: 8px;
	background: linear-gradient(121.68deg, rgba(153, 153, 153, .35) 0%, rgba(255, 255, 255, .12) 100%);
}
body.rubik-dark .facts-step::after {
	content: "";
	position: absolute;
	top: 16px;
	right: 20px;
	width: 16px;
	height: 16px;
	border-top: 2px solid #0fb328;
	border-right: 2px solid #0fb328;
	transform: rotate(-45deg);
}
body.rubik-dark .facts-step__title { font-size: 20px; line-height: 25px; font-weight: 200; color: #fff; }
body.rubik-dark .facts-step__text { font-size: 18px; line-height: 23px; font-weight: 300; color: #fff; }
body.rubik-dark .section--facts:has(.facts-steps) .facts-row { grid-column: 2; justify-content: stretch; }

/* Шаги с формой: слева нумерованные пункты, справа заявка на снимке экрана. */
body.rubik-dark .section--case-plan:has(.plan-form) .container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	column-gap: 60px;
	align-items: start;
}
body.rubik-dark .section--case-plan:has(.plan-form) .section__title { grid-column: 1 / -1; }
body.rubik-dark .section--case-plan:has(.plan-form) .case-plan { grid-column: 1; }
body.rubik-dark .plan-form {
	grid-column: 2;
	grid-row: 2;
	padding: 32px 24px;
	border-radius: 8px;
	background: #1f2424 center / cover no-repeat;
	box-shadow: inset 0 0 0 999px rgba(23, 27, 27, .72);
}
body.rubik-dark .plan-form__title {
	margin: 0 0 12px;
	font-size: 32px;
	line-height: 38px;
	font-weight: 200;
	text-align: center;
	color: #fff;
}
body.rubik-dark .plan-form__text {
	margin: 0 0 24px;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	text-align: center;
	color: #fff;
}
body.rubik-dark .plan-form .rubik-form__field {
	width: 100%;
	padding: 16px 18px;
	border: 0;
	border-radius: 8px;
	background: rgba(255, 255, 255, .1);
	color: #fff;
}
body.rubik-dark .plan-form .rubik-form__row { position: relative; margin-bottom: 12px; }
body.rubik-dark .plan-form .rubik-form__code { position: absolute; top: 16px; left: 18px; color: #fff; }
body.rubik-dark .plan-form .rubik-form__code + .rubik-form__field { padding-left: 48px; }
body.rubik-dark .plan-form .button {
	display: flex;
	justify-content: center;
	width: 100%;
	height: 56px;
	border-radius: 8px;
	background: #c50018;
	font-size: 16px;
	font-weight: 600;
}

/* Нумерованные шаги: номер в красной плашке, под названием перечень. */
body.rubik-dark .case-plan--cards { display: grid; grid-template-columns: 1fr; gap: 24px; }
body.rubik-dark .case-plan--cards .case-plan__item {
	position: relative;
	display: block;
	min-height: 0;
	padding: 0 0 0 60px;
	border-radius: 0;
	background: none;
}
body.rubik-dark .case-plan--cards .case-plan__num {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 40px;
	height: 70px;
	padding-top: 8px;
	border-radius: 8px;
	background: linear-gradient(180deg, rgb(197, 0, 24) 0%, rgba(197, 0, 24, 0) 100%);
	font-size: 20px;
	line-height: 25px;
	font-weight: 200;
	color: #fff;
}
body.rubik-dark .case-plan--cards .case-plan__title {
	margin: 0 0 8px;
	font-size: 24px;
	line-height: 29px;
	font-weight: 200;
}
body.rubik-dark .case-plan--cards .case-plan__text {
	margin: 0;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
}

body.rubik-dark .case-plan--cards .case-plan__item { min-height: 0 !important; height: auto !important; }
body.rubik-dark .case-plan__list {
	margin: 0;
	padding-left: 18px;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	color: #fff;
}
body.rubik-dark .case-plan__list li { margin: 0 0 4px; }

/* Преимущества на тёмном: пояснение под заголовком, значок слева от подписи. */
body.rubik-dark .section--advantages .section__head { display: block; }
body.rubik-dark .section--advantages .section__lead {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
}
body.rubik-dark .adv-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin-top: 32px;
	max-width: none;
}
body.rubik-dark .adv,
body.rubik-dark .adv--wide {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	column-gap: 20px;
	grid-column: auto;
	padding: 24px;
	border-radius: 8px;
	background: rgba(255, 255, 255, .04);
	text-align: left;
}
body.rubik-dark .adv__title {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	text-align: left;
	color: #fff;
}

/* Отзывы на лендинге: логотип клиента, текст письма и его снимок. */
body.rubik-dark .section--boxes:has(.box__shot) .section__head { display: block; }
body.rubik-dark .section--boxes:has(.box__shot) .section__lead {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
}
body.rubik-dark .boxes:has(.box__shot) {
	display: grid;
	grid-template-columns: none !important;
	grid-auto-flow: column;
	grid-auto-columns: 280px;
	justify-content: start !important;
	gap: 8px;
	margin-top: 32px;
	overflow-x: auto;
	padding-bottom: 8px;
}
body.rubik-dark .boxes:has(.box__shot) .box {
	display: grid;
	grid-template-rows: auto 1fr auto;
	gap: 24px;
	padding: 24px;
	border-radius: 8px;
	background: rgba(255, 255, 255, .04);
}
body.rubik-dark .boxes:has(.box__shot) .box__icon {
	width: auto;
	max-width: 170px;
	height: 32px;
	object-fit: contain;
	object-position: left center;
}
/* Подпись клиента в карточке отзыва на оригинале видна рядом с логотипом
   («АРМАНД», «ООО «СПЕЦАВТОКРАН»») — сверка 05.09.2026. Раньше её прятали. */
body.rubik-dark .boxes:has(.box__shot) .box__title {
	margin: 0 0 10px; font-size: 16px; line-height: 23px; font-weight: 400;
}
body.rubik-dark .boxes:has(.box__shot) .box__text {
	margin: 0;
	font-size: 16px;
	line-height: 23px;
	font-weight: 300;
	color: #fff;
}
body.rubik-dark .box__shot {
	width: 93px;
	height: auto;
	border-radius: 4px;
}

/* Логотип клиента в отзыве стоит на цветной плашке, как на оригинале. */
body.rubik-dark .boxes:has(.box__shot) .box__icon {
	padding: 8px 12px;
	border-radius: 6px;
	background: #d8e8c8;
	box-sizing: content-box;
}
body.rubik-dark .boxes:has(.box__shot) .box:nth-child(2) .box__icon { background: #ffd9dd; }
body.rubik-dark .boxes:has(.box__shot) .box:nth-child(3) .box__icon { background: #cfeee0; }
body.rubik-dark .boxes:has(.box__shot) .box:nth-child(4) .box__icon { background: #fff4c8; }
body.rubik-dark .boxes:has(.box__shot) .box:nth-child(5) .box__icon { background: #cfeee0; }
body.rubik-dark .boxes:has(.box__shot) .box:nth-child(6) .box__icon { background: #ffe2c2; }

/* Снимок сайта из кейса на оригинале виден только на телефоне. */
@media (min-width: 901px) {
	body.rubik-dark .page-body > .el-img { display: none; }
}

/* Кейс: заголовок, подпись с красной чертой, название клиента. */
body.rubik-dark .page-body > .el-title--h2 {
	margin-block: 0 24px;
	font-size: 52px;
	line-height: 57px;
	font-weight: 200;
}
body.rubik-dark .page-body > .el-text { margin-block: 0 16px; }
body.rubik-dark .page-body > .el-text p {
	margin: 0;
	font-size: 18px;
	line-height: 23px;
	font-weight: 300;
	color: #fff;
}
body.rubik-dark .page-body > .el-title--h2 + .el-text p {
	font-size: 32px;
	line-height: 38px;
	font-weight: 200;
}
body.rubik-dark .page-body > .el-title--h2 + .el-text + .el-text p {
	padding-left: 14px;
	border-left: 3px solid #c5001e;
}

/* Карточки услуг на тёмном лендинге: рамка, значок слева от названия. */
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	align-items: start;
	column-gap: 16px;
	padding: 24px;
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: 8px;
	background: transparent;
}
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__icon {
	grid-column: 1;
	grid-row: 1;
	width: 40px;
	height: 40px;
	margin: 0;
}
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__title {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	align-self: center;
	font-size: 20px;
	line-height: 25px;
	font-weight: 500;
	color: #fff;
}
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__text {
	grid-column: 1 / -1;
	grid-row: 2;
	margin-top: 16px;
	font-size: 16px;
	line-height: 22px;
	font-weight: 300;
	color: #fff;
}

/* Четыре инструмента идут в один ряд, пять — тремя и двумя. */
body.rubik-dark .case-plan:has(.case-plan__author):not(:has(> :nth-child(5))) {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
body.rubik-dark .case-plan:has(.case-plan__author):not(:has(> :nth-child(5))) .case-plan__item {
	grid-column: span 1;
	min-height: 360px;
}

/* Специалисты на лендинге: список слева, снимок команды справа. */
body.rubik-dark .section--team:has(.team-photo) .container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 560px);
	column-gap: 40px;
	align-items: start;
}
body.rubik-dark .section--team:has(.team-photo) .section__head { grid-column: 1 / -1; display: block; }
body.rubik-dark .section--team:has(.team-photo) .section__lead { display: none; }
body.rubik-dark .section--team:has(.team-photo) .person-grid {
	grid-column: 1;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 40px;
}
body.rubik-dark .section--team .person {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	column-gap: 32px;
	align-items: start;
	text-align: left;
}
body.rubik-dark .section--team .person__photo {
	grid-row: span 3;
	width: 120px;
	height: 120px;
	border-radius: 8px;
	overflow: hidden;
}
body.rubik-dark .section--team .person__photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
body.rubik-dark .section--team .person__name {
	order: 2;
	margin: 0;
	font-size: 20px;
	line-height: 25px;
	font-weight: 500;
	color: #fff;
}
body.rubik-dark .section--team .person__role {
	order: 1;
	margin: 0 0 4px;
	font-size: 18px;
	line-height: 23px;
	font-weight: 300;
	color: #9aa0a0;
}
body.rubik-dark .section--team .person__quote,
body.rubik-dark .section--team .person__text {
	order: 3;
	margin-top: 12px;
	padding-left: 22px;
	font-size: 18px;
	line-height: 23px;
	font-weight: 300;
	color: #fff;
	position: relative;
}
body.rubik-dark .team-photo { grid-column: 2; grid-row: 2; }
body.rubik-dark .team-photo img { width: 100%; height: auto; border-radius: 8px; display: block; }
body.rubik-dark .team-photo__text {
	margin: 0;
	padding: 24px;
	border-radius: 0 0 8px 8px;
	background: rgba(255, 255, 255, .04);
	font-size: 18px;
	line-height: 23px;
	font-weight: 300;
	color: #fff;
}

/* Карточка без значка занимает всю ширину, текст слева. */
body.rubik-dark .section--boxes .box:not(:has(.box__icon)):not(:has(.box__shot)) {
	grid-template-columns: minmax(0, 1fr);
	text-align: left;
}
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__title { text-align: left; }
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__text,
body.rubik-dark .section--boxes .box:not(:has(.box__shot)) .box__text p { max-width: none; }

/* Тёмные лендинги на планшете и телефоне: сетки в одну колонку,
   жёсткие ширины сбрасываются, иначе страница едет вбок. */
@media (max-width: 900px) {
	body.rubik-dark .section--case-plan:has(.case-plan--heads) .container,
	body.rubik-dark .section--case-plan:has(.plan-form) .container,
	body.rubik-dark .section--facts:has(.facts-steps) .container,
	body.rubik-dark .section--team:has(.team-photo) .container {
		display: block;
	}
	body.rubik-dark .case-plan--heads { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
	body.rubik-dark .case-plan:has(.case-plan__author),
	body.rubik-dark .case-plan:has(.case-plan__author):not(:has(> :nth-child(5))) {
		grid-template-columns: minmax(0, 1fr);
	}
	body.rubik-dark .case-plan:has(.case-plan__author) .case-plan__item,
	body.rubik-dark .case-plan:has(.case-plan__author):not(:has(> :nth-child(5))) .case-plan__item {
		grid-column: auto;
		min-height: 0;
	}
	body.rubik-dark .section--facts .facts-row { grid-template-columns: minmax(0, 1fr); justify-content: stretch; }
	body.rubik-dark .plan-form { width: auto; margin-top: 32px; }
	body.rubik-dark .adv-grid { grid-template-columns: minmax(0, 1fr); }
	body.rubik-dark .faq { grid-template-columns: minmax(0, 1fr); }
	body.rubik-dark .boxes:has(.box__shot) { grid-auto-columns: 260px; }
	body.rubik-dark .section--team:has(.team-photo) .person-grid { grid-column: auto; }
	body.rubik-dark .team-photo { margin-top: 32px; }
	body.rubik-dark .section--cta-media .cta { min-height: 0; }
	body.rubik-dark .section--cta-media .cta__actions { margin-top: 40px; }
	body.rubik-dark .section--cta-media .cta__body { max-width: none; }
	body.rubik-dark .section__title { font-size: 34px; line-height: 40px; }
	body.rubik-dark .case-plan__item .case-plan__title { font-size: 24px; line-height: 30px; }
}
@media (max-width: 600px) {
	body.rubik-dark .section--boxes .box:not(:has(.box__shot)) { padding: 16px; }
	body.rubik-dark .boxes:has(.box__shot) { grid-auto-columns: 240px; }
	body.rubik-dark .section--team .person { grid-template-columns: 96px minmax(0, 1fr); column-gap: 16px; }
	body.rubik-dark .section--team .person__photo { width: 96px; height: 96px; }
}

@media (max-width: 900px) {
	body.rubik-dark .case-plan__item,
	body.rubik-dark .box,
	body.rubik-dark .adv,
	body.rubik-dark .home-fact,
	body.rubik-dark .facts-step,
	body.rubik-dark .person { min-width: 0; }
	body.rubik-dark .case-plan__author { grid-template-columns: 40px minmax(0, 1fr); column-gap: 8px; }
	body.rubik-dark .case-plan__face { width: 40px; height: 40px; }
	body.rubik-dark .case-plan__person,
	body.rubik-dark .case-plan__role { font-size: 14px; overflow-wrap: anywhere; }
}

/* Окно с картинкой: скан письма во всю высоту, крестик за пределами окна. */
.popup__veil { position: absolute; inset: 0; display: block; }
.popup__box { z-index: 2; width: min(var(--popup-width, 560px), 100%); }
.popup--image .popup__box {
	width: auto;
	max-width: min(1160px, 100%);
	max-height: 92vh;
	padding: 0;
	background: transparent;
	overflow: visible;
}
.popup--image .popup__image {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 92vh;
	border-radius: var(--wp--custom--radius--block);
	background: #fff;
}
.popup--image .popup__close {
	top: -46px;
	right: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, .15);
	color: #fff;
}

/* Окно заявки на лендинге: тёмное, заголовок красный, услуги галочками. */
body.rubik-dark .popup__box {
	background: #1f2424;
	border-radius: 16px;
}
body.rubik-dark .popup__title {
	margin: 0 0 12px;
	font-size: 38px;
	line-height: 44px;
	font-weight: 200;
	color: #ff2b46;
}
body.rubik-dark .popup .form-block__title,
body.rubik-dark .popup .rubik-form__label { color: #fff; }
body.rubik-dark .popup .rubik-form__field {
	width: 100%;
	padding: 16px 18px;
	border: 1px solid rgba(255, 255, 255, .3);
	border-radius: 8px;
	background: transparent;
	color: #fff;
}
body.rubik-dark .popup .rubik-form__row { position: relative; margin: 0 0 18px; }
body.rubik-dark .popup .rubik-form__label { display: block; margin-bottom: 8px; font-size: 18px; }
body.rubik-dark .popup .rubik-form__code { position: absolute; left: 46px; bottom: 17px; color: #fff; }
body.rubik-dark .popup .rubik-form__code + .rubik-form__field { padding-left: 78px; }
body.rubik-dark .popup .button {
	display: flex;
	justify-content: center;
	width: 100%;
	height: 56px;
	border-radius: 8px;
	background: #c5001e;
	font-size: 16px;
	font-weight: 800;
}
.rubik-form__label--group { margin: 0 0 12px; font-size: 18px; }
.rubik-form__checks { display: grid; gap: 10px; margin-bottom: 24px; }
.rubik-check { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 12px; cursor: pointer; }
.rubik-check input { width: 22px; height: 22px; accent-color: #c5001e; }
body.rubik-dark .rubik-check span { font-size: 16px; line-height: 22px; color: #fff; }

.popup__text { margin: 0 0 24px; color: var(--wp--preset--color--muted); }
body.rubik-dark .popup__text { color: #fff; }

/* Окно заявки: поля во всю ширину, «+7» внутри поля телефона. */
.popup .rubik-form__row { position: relative; margin: 0 0 16px; }
.popup .rubik-form__field {
	width: 100%;
	padding: 16px 18px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
}
.popup .rubik-form__code { position: absolute; top: 17px; left: 18px; color: var(--wp--preset--color--muted); }
.popup .rubik-form__code + .rubik-form__field { padding-left: 48px; }
.popup .button { display: flex; justify-content: center; width: 100%; height: 56px; border-radius: 8px; }
.popup textarea.rubik-form__field { min-height: 96px; resize: vertical; }
@media (max-width: 600px) {
	.popup__box { padding: 24px 18px; }
	.popup--image .popup__close { top: -40px; }
}

/* Заголовок сертификатов у оригинала идёт двумя строками: «Сертифицированное
   агентство» и подсвеченное «Яндекса и Google». */
.section--certificates .section__title { max-width: 880px; }

/* На узких экранах значки уходят под подпись и переносятся по строкам. */
@media (max-width: 900px) {
	.section--certificates .container { display: block; }
	.certs__logos {
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 24px;
	}
}
@media (max-width: 600px) {
	.certs__logos { gap: 12px; }
	.certs__logos img { width: 104px; height: 104px; }
}

/* Ряд вкладок на странице цен: первая подсвечена, остальные чёрные. */
.tab-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 26px;
	margin: 0 0 40px;
	padding-left: 0;
	list-style: none;
}
.tab-row li {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 600;
	color: #000;
	cursor: default;
}
.tab-row li:first-child { color: var(--wp--preset--color--accent); }

/* Кегль пунктов списка. Замер оригинала: в теле страницы услуги пункт идёт
   18/24, на телефоне — 16/23. На «Гарантиях» пункты крупнее: 20/31. */
body.page .page-body > ul li,
body.page .page-body > ol li,
body.page .page-body .check-list li,
body.page .page-body .dot-list li,
body.page .page-body .plain-list li {
	font-size: 18px;
	line-height: 24px;
}
/* На телефоне кегль пункта у оригинала не падает: на страницах услуг те же 18/24.
   Меньше он только там, где и на десктопе крупнее обычного — на «Гарантиях». */
body.page-id-21 .page-body ul li,
body.page-id-21 .page-body .check-list li,
body.page-id-21 .page-body .dot-list li,
body.page-id-21 .entry li { font-size: 20px; line-height: 31px; }
@media (max-width: 900px) {
	body.page-id-21 .page-body ul li,
	body.page-id-21 .page-body .check-list li,
	body.page-id-21 .page-body .dot-list li,
	body.page-id-21 .entry li { font-size: 16px; line-height: 23px; }
}
@media (max-width: 900px) {
	body.page-id-21 .page-body ul li { font-size: 16px; line-height: 23px; }
}

/* Первый экран-слепок идёт вплотную к шапке, как на оригинале: собственный
   отступ статьи в этом случае лишний — он сдвигал экран на 24 пикселя. */
.entry:has(> .hero-art:first-child) { padding-top: 0; }

/* Подсветка первого слова заголовка.
 *
 * На оригинале под первым словом лежит голубой прямоугольник #8DCFFF высотой
 * почти во всю строку. Здесь это фон у span: слово переносится вместе с
 * подсветкой, а высота задаётся вертикальными полями. */
.el-title .rubik-hl,
.section__title .rubik-hl,
.hero__title .rubik-hl,
.contacts__title .rubik-hl,
.case-form__title .rubik-hl {
	background: #8DCFFF;
	padding: 0.04em 0.12em;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}
.row--dark .el-title .rubik-hl,
.row--sky .el-title .rubik-hl,
.section__title .rubik-hl,
.hero__title .rubik-hl,
.contacts__title .rubik-hl,
.case-form__title .rubik-hl { color: #313131; }

/* Блок «Зачем нужна…» — как на оригинале.
 *
 * Было: заголовок в узкой колонке 460px (переносился в три строки), пункты
 * в карточках с заливкой. На оригинале заголовок идёт в одну строку на всю
 * ширину, а под ним четыре колонки: иконка 130 пикселей и подпись под ней,
 * без карточек. */
.section--advantages .section__title { max-width: 100%; }
.section--advantages .section__head { grid-template-columns: 1fr; }
.section--advantages .adv {
	flex: 1 1 0;
	height: auto;
	padding: 0;
	background: none;
	border-radius: 0;
}
.section--advantages .adv__icon {
	width: 130px;
	height: 130px;
	margin: 0 0 26px;
	object-fit: contain;
}
.section--advantages .adv__title { margin: 0; }

/* Заголовок страницы и подпись к нему.
 *
 * На оригинале подпись стоит у правого края на уровне заголовка, а не под ним.
 * Селектор строго div: тема вешает на body класс page-<слаг>, и у страницы
 * «lead» он совпадал с этим — вся страница разъезжалась сеткой. */
div.page-lead {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 162px;   /* колонка подписи как на оригинале */
	align-items: start;
	gap: 40px;
}
div.page-lead .el-title { font-size: 54px; line-height: 1.1; }
div.page-lead .el-text {
	margin: 8px 0 0;
	font-size: 16px;
	line-height: 22px;
}
@media (max-width: 900px) {
	div.page-lead { grid-template-columns: 1fr; gap: 12px; }
	div.page-lead .el-text { text-align: left; }
}

/* Первая секция с карточками на странице услуги идёт на белом фоне: голубая
   заливка на оригинале начинается только со следующего блока. Ниже по странице
   плитки остаются на голубом, поэтому правило привязано к шапке страницы. */
div.page-lead + .section--boxes { background: #fff; }

/* Заголовок секции и кнопка к нему — в одну строку.
 *
 * На оригинале кнопка стоит у правого края на уровне заголовка, а не отдельной
 * строкой под секцией. */
.head-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	margin-bottom: var(--wp--preset--spacing--60);
}
.head-row .section__title { margin: 0; }
.head-row__action { flex: 0 0 auto; }
@media (max-width: 900px) {
	.head-row { flex-direction: column; align-items: flex-start; gap: 20px; }
}

/* Блок еженедельной отчётности: на оригинале пункты идут в две колонки слева,
   а справа стоит контур куба. При переносе пункты растянулись в четыре колонки
   на всю ширину, и куб лёг поверх текста. */
.section--case-plan .container { position: relative; }
/* Только тот блок, где справа стоит куб: раньше правило ловило все блоки
   с этапами, и карточки 660/460 сжимались до 320 — текст вылезал за края. */
.section--case-plan:has(.case-plan__cube) .case-plan {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 320px));
	gap: 60px 40px;
	max-width: 700px;
}
.case-plan__cube {
	position: absolute;
	left: 1100px;   /* на оригинале куб начинается у правого края колонки текста */
	top: 40px;
	width: 670px;
	height: auto;
	pointer-events: none;
	z-index: 0;
}
@media (max-width: 1200px) {
	.case-plan__cube { display: none; }
	.section--case-plan .case-plan { max-width: none; }
}
@media (max-width: 700px) {
	.section--case-plan .case-plan { grid-template-columns: 1fr; gap: 32px; }
}

/* В блоке цен подпись кнопки строчными, как на оригинале: заглавными она
   стоит только в шапке и в блоках призыва. */
.section--prices .button,
.prices .button { text-transform: none; }

/* ── Аудит рекламы: свой лендинг, кнопки крупнее и без заглавных ──
   Замер оригинала: первый экран 240×55, шрифт 20/600, скругление 4;
   в прайсе и призыве подписи тоже идут как написаны, без uppercase. */
/* Постраничные правила копира стилей идут с двойным классом и перебивают
   обычный селектор — поэтому здесь тоже двойной. */
body.page-audit-reklamy.page-audit-reklamy .button,
body.page-audit-reklamy.page-audit-reklamy a.button { text-transform: none; }
body.page-audit-reklamy.page-audit-reklamy .hero .button { min-width: 240px; padding-block: 15px; font-size: 20px; font-weight: var(--wp--custom--weight--medium); line-height: 25px; border-radius: 4px; text-align: center; }
body.page-audit-reklamy.page-audit-reklamy .section--cta-media .cta__actions .button { text-transform: none; font-size: 18px; }
body.page-audit-reklamy.page-audit-reklamy .steps__btn { display: inline-block; min-width: 300px; margin-bottom: 30px; padding-block: 15px; font-size: 14px; font-weight: var(--wp--custom--weight--bold); line-height: 25px; border-radius: 0; text-align: center; }

/* ── Подтверждения: номер, требование, стрелка, ответ ──
   Замер оригинала на /guarantees: колонки 106 / 220 / стрелка / 231,
   кегль 16/22, над каждой строкой линия #C8C8C8 во всю ширину 1160. */
.proof { margin-block: 40px; }
.proof__row {
	display: grid; grid-template-columns: 197px 402px 240px minmax(0, 1fr);
	align-items: start; gap: 0;
	padding-block: 55px 40px; border-top: 1px solid #C8C8C8;
}
.proof__row:last-child { border-bottom: 1px solid #C8C8C8; }
.proof__num { font-size: 16px; line-height: 22px; color: var(--wp--preset--color--ink); }
.proof__need { max-width: 220px; margin: 0; font-size: 16px; line-height: 22px; }
.proof__have { max-width: 231px; margin: 0; font-size: 16px; line-height: 22px; }
.proof__arrow { position: relative; display: block; margin-top: 10px; height: 1px; background: #313131; }
.proof__arrow::after {
	content: ""; position: absolute; right: 0; top: -3px;
	width: 7px; height: 7px; border-top: 1px solid #313131; border-right: 1px solid #313131;
	transform: rotate(45deg);
}
@media (max-width: 900px) {
	.proof__row { grid-template-columns: 1fr; gap: 12px; padding-block: 24px; }
	.proof__need, .proof__have { max-width: none; }
	.proof__arrow { display: none; }
}

/* Кнопки в таблице тарифов: на оригинале подпись как написана — «Оставить
   заявку», а не заглавными. Правило для подвала таблицы их не покрывало. */
.ptable__cell .button { text-transform: none; }

/* Кнопка видом «ссылка»: на кейсах оригинала «Смотреть отзыв →» стоит
   подписью без подложки и как написана, без заглавных. */
.button--as-link {
	padding: 0; background: none; color: var(--wp--preset--color--ink);
	text-transform: none; text-decoration: none;
}
.button--as-link:hover { color: var(--wp--preset--color--accent); }

/* ── Лента кейсов новостями ──
   Замер оригинала (t404): карточки 360 с шагом 400 от левого поля 140,
   фото 360×234 без скругления, дата 12/16 серым заглавными, заголовок 26/32
   вес 600 чёрным, описание 16/24.8 вес 300 серым. */
/* В статье лента стоит внутри узкой колонки текста, а на оригинале идёт
   во всю ширину страницы. Колонка текста прижата к левому полю, поэтому
   обычный приём «50% минус 50vw» её не выравнивает: сдвигаем ровно на поле
   страницы, а карточки внутри держат свои 140 слева. */
@media (min-width: 1200px) {
	.entry__content .section--cases-news {
		width: 100vw;
		margin-left: calc(-1 * ((100vw - 1160px) / 2));
		margin-right: 0;
	}
}
.section--cases-news .case-slider { overflow: visible; }
.section--cases-news .case-track {
	display: grid; grid-template-columns: repeat(3, 360px); gap: 40px;
	width: auto; max-width: 1160px; margin-inline: auto; transform: none;
}
.section--cases-news .case-news { flex: none; width: 360px; }
.section--cases-news .case-news__photo img {
	width: 360px; height: 234px; object-fit: cover; border-radius: 0;
}
.section--cases-news .case-news__date {
	margin: 23px 0 13px; font-size: 12px; line-height: 16px; font-weight: 400;
	color: #777; opacity: 1;
}
.section--cases-news .case-news__title {
	margin: 0 0 12px; font-size: 26px; line-height: 31.98px; font-weight: 600; color: #000;
}
.section--cases-news .case-news__text {
	margin: 0; font-size: 16px; line-height: 24.8px; font-weight: 300; color: #777;
}
@media (max-width: 1199px) {
	.section--cases-news .case-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.section--cases-news .case-news { width: auto; }
	.section--cases-news .case-news__photo img { width: 100%; }
}
@media (max-width: 767px) {
	.section--cases-news .case-track { grid-template-columns: minmax(0, 1fr); }
}

/* Краткая лента: на одной из статей оригинала у карточек только снимок
   и заголовок, без даты и описания. */
.section--cases-news-short .case-news__date,
.section--cases-news-short .case-news__text { display: none; }

/* Полоса прочтения статьи Тильды (t602): её двигал скрипт, у нас она застывала красной
   полосой вверху страницы. Владелец 11.09.2026: не нужна. */
.rubik-tilda .t602 { display: none !important; }

/* Аккордеоны Тильды (t668): текст внутри раскрывал её скрипт, у нас он был скрыт совсем —
   на /seo/prodvizhenie-avtoservisov/ пустовали «Выявленные проблемы» и «Этапы улучшения».
   Показываем раскрытыми, как просил владелец 12.09.2026: содержимое важнее сворачивания. */
.rubik-tilda .t668__content { display: block !important; }
/* и без кнопок: значок «+» убран, заголовок не нажимается — просто две колонки с текстом */
.rubik-tilda .t668__icon { display: none !important; }
.rubik-tilda .t668__trigger-button { cursor: default; pointer-events: none; }

/* То же у вопросов-ответов (t849): ответы открывал скрипт, у нас нажатие мёртвое
   и ответов не видно совсем. Держим раскрытыми, значок-кружок убран (12.09.2026). */
.rubik-tilda .t849__content { display: block !important; }
.rubik-tilda .t849__icon { display: none !important; }
.rubik-tilda .t849__trigger-button { cursor: default; pointer-events: none; }

/* Лента статей Тильды (t404): высоту заголовков и описаний в ряду выравнивает её скрипт,
   и только с 960 px. В сохранённой странице она осталась инлайном (height:128px),
   поэтому на телефоне под заголовком зияла дыра. Ниже 960 px карточки идут столбиком,
   высота по тексту — как на оригинале. Инлайн перебивается только !important. */
@media (max-width: 959px) {
	.rubik-tilda .t404__title, .rubik-tilda .t404__descr { height: auto !important; }
}
