/*
 * VirtualPos — стили, которые не выражаются через theme.json.
 * Брейкпоинты как в Elementor: планшет ≤ 1024px, телефон ≤ 767px.
 * Размеры шрифтов меняются ступенчато (как было), а не плавно: переопределяем пресеты на брейкпоинтах.
 */

/* ---------- Токены по брейкпоинтам ---------- */
@media (max-width: 1024px) {
	body {
		--wp--preset--font-size--body: 14px;
		--wp--preset--font-size--title: 45px;
		--wp--preset--font-size--subtitle: 18px;
		--wp--preset--font-size--lead: 25px;
		--wp--preset--font-size--hero: 65px;
		--wp--custom--line-height--subtitle: 1.4;
	}
}
@media (max-width: 767px) {
	body {
		--wp--preset--font-size--title: 28px;
		--wp--custom--line-height--title: 1.1em;
		--wp--preset--font-size--box-title: 18px;
		--wp--preset--font-size--subtitle: 16px;
		--wp--preset--font-size--lead: 20px;
		--wp--preset--font-size--hero: 42px;
	}
}

/* ---------- База (повторяет reset Hello Elementor) ---------- */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
p {
	margin-top: 0;
	margin-bottom: 0.9rem;
}
/* Абзацы в содержимом страниц и записей — тоже с отступом .9rem снизу (как у текстовых виджетов Elementor, в том
   числе у последнего абзаца). Ядро в блоках обнуляет его правилом :root :where(.is-layout-flow) > *; эта же
   специфичность, но позже — побеждает. Классы секций (sections.css) идут ещё позже и задают свои отступы. */
/* Кроме абзацев с классами темы vp-* (подзаголовки секций и т.п.) — они задают отступы сами.
   Только абзацы-блоки (класс wp-block-paragraph ставит WP 7): абзацы внутри HTML-блоков живут по своим стилям. */
:root :where(.wp-block-post-content p.wp-block-paragraph:not([class*="vp-"])),
:root :where(.wp-block-post-content p.wp-block-paragraph:not([class*="vp-"])):last-child { /* у ядра для последнего — (0,2,0) */
	margin-block-end: 0.9rem;
}
:where(h1, h2, h3, h4, h5, h6) {
	margin-top: 0;
	margin-bottom: 0;
}
img {
	max-width: 100%;
	height: auto;
}
a {
	transition: color 0.2s;
}

/* ---------- Шапка ---------- */
.vp-header {
	position: relative;
	z-index: 50;
	margin: 20px 0 60px;
}
.vp-header__inner {
	position: relative;
	max-width: 960px;
	margin: 0 auto;
	gap: 0 10px;
}
/* Ширины как в Elementor: базы 300 / 400px / 100% и пропорциональное сжатие (дробные размеры совпадают с продом) */
.vp-header__logo {
	flex: 0 1 300px;
	min-width: 0;
	margin: 0;
	display: flex;
	align-items: center;
}
.vp-header__logo a,
.vp-header__logo img {
	display: block;
	width: 100%;
}
.vp-header__tagline {
	flex: 0 1 400px;
	min-width: 0;
	align-self: center;
	margin: 0;
	font-size: 14px;
	line-height: 20px;
	color: var(--wp--preset--color--dark-2-60);
}
.vp-nav.wp-block-navigation {
	flex: 0 1 100%;
	min-width: 0;
	align-self: flex-start;
	justify-content: flex-end;
	gap: 0 10px;
	font-size: 18px;
	line-height: 22px;
	font-weight: 500;
}
.vp-nav .wp-block-navigation__container {
	gap: 0 10px;
}
.vp-nav .wp-block-navigation-item__content {
	padding: 15px;
	color: var(--wp--preset--color--primary);
}
/* Подчёркивание при наведении и у текущего раздела (как «pointer: underline» в старом меню) */
@media (min-width: 1025px) {
	.vp-nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		position: relative;
	}
	.vp-nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 3px;
		background: var(--wp--preset--color--accent);
		opacity: 0;
		transition: opacity 0.3s cubic-bezier(0.58, 0.3, 0.005, 1);
	}
	.vp-nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after,
	.vp-nav .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after {
		opacity: 1;
	}
}
/* «Еще»: ссылка + стрелка = 89px, как на старом сайте (иначе всё меню съезжает вправо) */
.vp-nav .wp-block-navigation-submenu > .wp-block-navigation-item__content {
	padding-right: 0;
}
.vp-nav .wp-block-navigation__submenu-icon {
	width: 11px;
	height: 11px;
	/* «Еще» на проде: текст + 10px + стрелка 8.75px + 15px = 88.97px; стрелку ставим туда же */
	margin: 0 14px 0 8.75px;
}
.vp-nav .wp-block-navigation__submenu-icon svg {
	width: 11px;
	height: 11px;
	stroke-width: 3px;
}
/* Выпадающее «Еще» */
.vp-nav .wp-block-navigation__submenu-container {
	min-width: 220px !important;
	border: 0 !important;
	background: var(--wp--preset--color--base);
	box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1);
	padding: 0;
}
.vp-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 15px 15px 15px 35px;
}

/* Планшет и телефон: «гамбургер», меню выпадает в правую половину */
@media (max-width: 1024px) {
	.vp-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
	.vp-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}
@media (max-width: 767px) {
	.vp-header__logo {
		flex: 0 0 calc(50% - 5px);
	}
	.vp-header__tagline {
		display: none;
	}
}
.vp-nav .wp-block-navigation__responsive-container-open,
.vp-nav .wp-block-navigation__responsive-container-close {
	margin: 8px 8px 0 0;
	padding: 0;
	color: #000; /* на старом сайте у SVG-иконок заливка по умолчанию — чёрная */
}
.vp-nav .wp-block-navigation__responsive-container-open svg,
.vp-nav .wp-block-navigation__responsive-container-close svg {
	width: 25px;
	height: 25px;
}
/* Иконка как на старом сайте — Font Awesome «align-justify» (4 жирные полосы) */
.vp-nav .wp-block-navigation__responsive-container-open svg {
	display: none;
}
.vp-nav .wp-block-navigation__responsive-container-open::before {
	content: "";
	width: 25px;
	height: 25px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M432 416H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16A16 16 0 0 0 0 48v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16V48a16 16 0 0 0-16-16z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M432 416H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-128H16A16 16 0 0 0 0 48v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16V48a16 16 0 0 0-16-16z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Крестик — Font Awesome «window-close» (regular), как на старом сайте */
.vp-nav .wp-block-navigation__responsive-container-close svg {
	display: none;
}
.vp-nav .wp-block-navigation__responsive-container-close::before {
	content: "";
	display: block;
	width: 25px;
	height: 25px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M464 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm0 394c0 3.3-2.7 6-6 6H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h404c3.3 0 6 2.7 6 6v340zM356.5 194.6L295.1 256l61.4 61.4c4.6 4.6 4.6 12.1 0 16.8l-22.3 22.3c-4.6 4.6-12.1 4.6-16.8 0L256 295.1l-61.4 61.4c-4.6 4.6-12.1 4.6-16.8 0l-22.3-22.3c-4.6-4.6-4.6-12.1 0-16.8l61.4-61.4-61.4-61.4c-4.6-4.6-4.6-12.1 0-16.8l22.3-22.3c4.6-4.6 12.1-4.6 16.8 0l61.4 61.4 61.4-61.4c4.6-4.6 12.1-4.6 16.8 0l22.3 22.3c4.7 4.6 4.7 12.1 0 16.8z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M464 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm0 394c0 3.3-2.7 6-6 6H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h404c3.3 0 6 2.7 6 6v340zM356.5 194.6L295.1 256l61.4 61.4c4.6 4.6 4.6 12.1 0 16.8l-22.3 22.3c-4.6 4.6-12.1 4.6-16.8 0L256 295.1l-61.4 61.4c-4.6 4.6-12.1 4.6-16.8 0l-22.3-22.3c-4.6-4.6-4.6-12.1 0-16.8l61.4-61.4-61.4-61.4c-4.6-4.6-4.6-12.1 0-16.8l22.3-22.3c4.6-4.6 12.1-4.6 16.8 0l61.4 61.4 61.4-61.4c4.6-4.6 12.1-4.6 16.8 0l22.3 22.3c4.7 4.6 4.7 12.1 0 16.8z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Открытое меню — как на старом сайте: не поверх страницы, а в потоке, на всю ширину колонки меню под кнопкой;
   шапка вырастает (логотип и подпись — по центру по высоте), прокрутка страницы не блокируется */
html.has-modal-open:has(.vp-nav .is-menu-open) {
	overflow: visible;
}
.vp-nav:has(.is-menu-open) .wp-block-navigation__responsive-container-open {
	display: none;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open {
	position: relative;
	inset: auto;
	z-index: auto;
	/* ширина — как у меню Elementor на планшете: не больше 530px, в узкой колонке — во всю колонку */
	flex: 0 1 530.4px;
	padding: 0;
	background: transparent;
	overflow: visible;
	animation: none;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	position: static;
	margin: 0;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: absolute;
	top: 0;
	right: 0;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 42px 0 0;
	align-items: stretch;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	width: 100%;
	gap: 0;
	align-items: stretch;
	background: var(--wp--preset--color--base);
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	align-items: stretch;
	text-align: left;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child) {
	border-bottom: 1px solid #c4c4c4;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	padding: 15px;
	font-size: 18px;
	line-height: 1.4;
	font-weight: 500;
	color: var(--wp--preset--color--primary);
}
@media (max-width: 767px) {
	.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		font-size: 16px;
	}
}
/* «Еще»: стрелка справа в строке, подменю свёрнуто, пока стрелку не нажали */
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
	flex-flow: row wrap;
	align-items: center;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content {
	flex: 1 1 0;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
	display: flex;
	margin: 0 15px 0 0;
}
/* ядро поворачивает стрелку по aria-expanded, а оно в открытом меню всегда true */
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation__submenu-icon svg {
	transform: none;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.vp-sub-open > .wp-block-navigation__submenu-icon svg {
	transform: rotate(180deg);
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu:not(.vp-sub-open) > .wp-block-navigation__submenu-container {
	display: none;
}
/* (ядро задаёт подменю в открытом меню поля 2rem с той же специфичностью — перебиваем лишним классом) */
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container {
	flex: 0 0 100%;
	padding: 0;
	border: 0;
	box-shadow: none;
}
.vp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 15px 15px 15px 35px;
}

/* ---------- Подвал ---------- */
.vp-footer {
	padding: 0 50px;
	background: var(--wp--preset--color--base);
}
.vp-footer__inner {
	display: grid;
	grid-template-columns: repeat(3, 33%);
	max-width: 1140px;
	margin: 0 auto;
	padding: 50px 0;
}
.vp-footer__col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.vp-footer .vp-footer__title {
	margin: 0;
	font-size: var(--wp--preset--font-size--box-title);
	line-height: 25px;
}
.vp-footer__title a {
	color: inherit;
}
.vp-footer__links {
	margin: 26px 0 0;
	padding: 0;
	list-style: none;
}
.vp-footer__links li {
	line-height: 25px;
}
.vp-footer__links li + li {
	margin-top: 5px;
}
.vp-footer__links a,
.vp-footer__col p a {
	color: var(--wp--preset--color--primary);
}
.vp-footer__links a:hover,
.vp-footer__col p a:hover,
.vp-footer__title a:hover {
	color: var(--wp--preset--color--accent);
}
.vp-footer__links--loose {
	margin-top: 20px;
}
.vp-footer__links--loose li {
	padding-right: 10px;
}
.vp-footer__links--loose li + li {
	margin-top: 10px;
}
.vp-footer__links--loose a {
	color: #000;
}

/* Вертикальный ритм колонок — как на старом сайте (там отступы задавались каждому виджету отдельно) */
.vp-footer__col > :first-child {
	margin-top: 25px;
}
.vp-footer__col:nth-child(1) .vp-footer__title--after-loose {
	margin-top: 45px;
}
.vp-footer__col:nth-child(1) .vp-footer__title--after-loose + .vp-footer__links {
	margin-top: 20px;
}
.vp-footer__col:nth-child(2) .vp-footer__links + .vp-footer__title {
	margin-top: 41px;
}
.vp-footer__col:nth-child(3) .vp-footer__title + .vp-footer__title {
	margin-top: 35px;
}
.vp-footer__col p {
	margin: 0;
	line-height: 25px;
}
.vp-footer .vp-footer__address {
	margin-top: 20px;
}
.vp-footer .vp-footer__phone {
	margin-top: 24.4px; /* 0.9rem от абзаца + 10px от виджета — как в Elementor */
}
.vp-footer .vp-footer__note {
	margin-top: 20px;
}
.vp-footer .vp-footer__copyright {
	margin-top: 25px;
}
.vp-footer .vp-footer__about {
	margin-top: 34px;
}

/* Списки «Маркетплейсы» и «Интеграции» на планшете и телефоне остаются 16px, остальное — 14px (как было) */
.vp-footer__links--16 {
	font-size: 16px;
}
@media (max-width: 767px) {
	.vp-footer__inner {
		grid-template-columns: 1fr;
		row-gap: 40px;
	}
}

/* ---------- Статья ---------- */
/* Единый шаблон записи: расстояния задаёт тема, у блоков в записях своих отступов нет. Ритм — самый частый в старых
   статьях Elementor: абзац→абзац 0.9rem, перед заголовком/картинкой/цитатой/видео после текста 0.9rem + 25px,
   после них и между ними — 25px (поля схлопываются: берётся больший). */
/* Поля по бокам: текст не прилегает к краям экрана, когда он уже колонки 1140px (на старом сайте прилегал) */
.vp-article {
	padding-inline: 20px;
}
.vp-article .vp-article__title {
	margin-bottom: 50px;
	text-align: center;
}
.vp-article__content {
	font-size: var(--wp--preset--font-size--blog);
	line-height: var(--wp--custom--line-height--blog);
	font-weight: 400;
	overflow-wrap: break-word; /* длинные адреса-ссылки без пробелов не раздвигают страницу на телефоне */
}
.vp-article__content p,
.vp-article__content ul,
.vp-article__content ol {
	margin: 0 0 0.9rem;
}
.vp-article__content ul,
.vp-article__content ol {
	padding-left: 40px;
}
.vp-article__content li ul,
.vp-article__content li ol {
	margin-bottom: 0;
}
.vp-article__content h2,
.vp-article__content h3,
.vp-article__content h4 {
	font-size: var(--wp--preset--font-size--box-title);
	line-height: 25px;
}
.vp-article__content > :is(h2, h3, h4, h5, h6, .wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-quote, .wp-block-table, .wp-block-separator) {
	margin-top: calc(0.9rem + 25px);
	margin-bottom: 25px;
}
/* сразу под заголовком — 25px (как между заголовком и текстом) */
.vp-article__content > :is(h2, h3, h4, h5, h6) + :is(h2, h3, h4, h5, h6, .wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-quote, .wp-block-table) {
	margin-top: 25px;
}
.vp-article__content > :first-child {
	margin-top: 0;
}
.vp-article__content > :last-child {
	margin-bottom: 0;
}
/* Картинка — в своём размере, не шире текста, по центру */
.vp-article__content .wp-block-image img {
	display: block;
	margin: 0 auto;
}
.vp-article__content .wp-block-image.aligncenter {
	display: block; /* ядро ставит aligncenter display: table — подпись тогда сжимается до ширины картинки */
}
.vp-article__content .wp-block-image > figcaption.wp-element-caption {
	display: block; /* у ядра — table-caption: в блочной картинке подпись сжималась бы в узкий столбец */
	margin: 10px 0 0;
	font-size: 16px;
	line-height: 25px;
	font-weight: 500;
	text-align: center;
	color: var(--wp--preset--color--primary);
}
.vp-article__content .wp-block-gallery {
	gap: 20px;
}
.vp-article__content .wp-block-separator {
	width: 100%;
	border: 0;
	border-top: 1px solid #000; /* как разделитель Elementor в старых статьях */
	opacity: 1;
}
/* Цитата — как блок цитаты на старом сайте: карточка с полосой слева и тенью, значок кавычек, подпись автора */
.vp-article__content .wp-block-quote {
	margin-inline: 0;
	padding: 37px 43px;
	border-left: 4px solid #50e3c2;
	background: var(--wp--preset--color--base);
	box-shadow: 0 20px 30px rgba(0, 0, 0, 0.06);
	color: #000;
	font-size: 20px; /* шрифт — фирменный Montserrat (на старом сайте был системный шрифт темы Hello) */
	font-weight: 400;
	line-height: 32px;
}
.vp-article__content .wp-block-quote::before {
	content: "";
	display: block;
	width: 48px;
	height: 48px;
	margin-bottom: 12px;
	border-radius: 50%;
	background: #b8bfc2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E") center / 20px no-repeat;
}
/* На телефоне поля карточки меньше: с полями статьи строка цитаты остаётся той же ширины, что на старом сайте */
@media (max-width: 767px) {
	.vp-article__content .wp-block-quote {
		padding: 30px 20px;
	}
}
.vp-article__content .wp-block-quote p {
	margin: 0;
}
.vp-article__content .wp-block-quote cite {
	display: block;
	margin-top: 14px;
	color: #bbc1c4;
	font-size: 15px;
	font-style: normal;
	line-height: 25px;
}
/* Группы (врезки, паттерны статей), кнопки, таблицы и «Подробности» — в том же ритме, что картинки и цитаты */
.vp-article__content > :is(.wp-block-group, .wp-block-buttons, .wp-block-details) {
	margin-top: calc(0.9rem + 25px);
	margin-bottom: 25px;
}
.vp-article__content > :is(h2, h3, h4, h5, h6) + :is(.wp-block-group, .wp-block-buttons, .wp-block-details) {
	margin-top: 25px;
}
.vp-article__content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 16px;
	line-height: 1.5;
}
.vp-article__content .wp-block-table :is(th, td) {
	padding: 10px 12px;
	border: 1px solid #e8e9f1;
	text-align: left;
	vertical-align: top;
}
.vp-article__content .wp-block-table th {
	background: var(--wp--preset--color--blue-light-bg);
	font-weight: 600;
}
/* Стиль группы «Врезка»: серая карточка для важного или примера */
.vp-article__content .wp-block-group.is-style-callout {
	padding: 30px 35px;
	border-radius: 20px;
	background: var(--wp--preset--color--blue-light-bg);
}
.vp-article__content .is-style-callout > :first-child {
	margin-top: 0;
}
.vp-article__content .is-style-callout > :last-child {
	margin-bottom: 0;
}
/* Обложка записи (изображение записи) — под заголовком, в своём размере (до 768px), по центру; копий в тексте нет */
.vp-article .vp-article__cover {
	margin: 0 0 25px;
}
.vp-article .vp-article__cover img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}
/* «Попробовать бесплатно» в конце записи (patterns/blog-cta.php) */
.vp-article .vp-blog-cta {
	margin-top: 60px;
	padding: 50px;
	border-radius: 40px;
	background: var(--wp--preset--color--blue-light-bg);
	text-align: center;
}
.vp-blog-cta h2 {
	margin: 0 0 20px;
	font-size: 28px;
	line-height: 1.2;
}
.vp-blog-cta p {
	max-width: 640px;
	margin: 0 auto 30px;
	font-size: 18px;
	line-height: 1.5;
}
.vp-blog-cta .wp-block-buttons {
	justify-content: center;
}
@media (max-width: 767px) {
	.vp-article__content .wp-block-group.is-style-callout {
		padding: 25px 20px;
	}
	.vp-article .vp-blog-cta {
		margin-top: 40px;
		padding: 30px 20px;
		border-radius: 30px;
	}
	.vp-blog-cta h2 {
		font-size: 22px;
	}
	.vp-blog-cta p {
		font-size: 16px;
	}
}

/* ---------- Лента блога ---------- */
.vp-blog .vp-blog__title {
	font-size: var(--wp--preset--font-size--title);
}
.vp-blog .vp-blog__subtitle {
	margin: 0 0 50px;
	font-size: var(--wp--preset--font-size--subtitle);
	line-height: var(--wp--custom--line-height--subtitle);
}
.vp-blog__items {
	margin: 0;
	padding: 0;
	list-style: none;
}
.vp-blog__items > li + li {
	margin-top: 30px;
}
.vp-blog__item {
	gap: 15px;
}
/* Картинка тянется на высоту строки (обрезка cover); если сама выше — строка растёт под неё */
.vp-blog__thumb {
	flex: 0 0 100px;
	align-self: stretch;
	margin: 0;
}
.vp-blog__thumb a {
	display: block;
	height: 100%;
}
.vp-blog__thumb img {
	width: 100px;
	height: 100% !important;
	object-fit: cover !important;
}
.vp-blog__text {
	flex: 1 1 auto;
	padding: 15px 0;
}
.vp-blog .vp-blog__item-title {
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 500;
	line-height: var(--wp--custom--line-height--lead);
}
.vp-blog__item-title a {
	color: var(--wp--preset--color--primary);
}
.vp-blog__item-title a:hover {
	color: var(--wp--preset--color--accent);
}
.vp-blog__excerpt {
	margin-top: 10px;
	font-size: var(--wp--preset--font-size--subtitle);
	line-height: var(--wp--custom--line-height--subtitle);
	color: var(--wp--preset--color--muted);
}
.vp-blog__excerpt p {
	margin: 0;
}
.vp-blog__pagination {
	margin-top: 50px;
}
@media (max-width: 767px) {
	.vp-blog__item {
		flex-wrap: wrap !important;
	}
	.vp-blog__thumb,
	.vp-blog__thumb a {
		height: auto;
	}
	.vp-blog__thumb img {
		height: auto !important;
	}
	.vp-blog__text {
		flex-basis: 100%;
		padding: 0 15px 15px;
	}
}

/* ---------- 404 ---------- */
.vp-404 .vp-404__title {
	margin-bottom: 15px;
}
.vp-404 .vp-404__text {
	margin-bottom: 12px;
}