/* ==========================================================================
   JetHim — основные стили дочерней темы (astra-child)
   РЕДИЗАЙН: стилизация по референсу клиента himchistka-kaplya.ru.
   Палитра: синий #1b88d8 + красный #e23936, фон #f9f9f9, белые карточки.
   Шрифты: Montserrat (заголовки) + Inter (текст), Google Fonts.
   Правки только здесь. Файлы Astra не изменяются.
   ========================================================================== */

:root {
	/* Палитра референса */
	--jc-primary: #1b88d8;          /* акцент-синий */
	--jc-primary-dark: #1776bd;
	--jc-red: #e23936;              /* калькулятор / отправка формы */
	--jc-red-dark: #c73331;
	--jc-soft: #d1e8fa;             /* светло-синий блок в герое */

	/* Текст и фоны */
	--jc-heading: #444b54;          /* заголовки */
	--jc-dark: #1b2025;             /* тёмный акцентный текст */
	--jc-text: #3c3d41;             /* основной текст */
	--jc-bg: #f9f9f9;               /* фон страницы */
	--jc-white: #ffffff;
	--jc-gray: #f2f2f2;             /* серые полосы (топбар, футер) */
	--jc-border: #ededee;
	--jc-border-2: #e4e4e6;
	--jc-muted: #bec1c5;

	--jc-link: var(--jc-primary);
	--jc-link-hover: var(--jc-primary-dark);

	--jc-radius: 10px;
	--jc-radius-sm: 6px;
	--jc-pill: 42px;
	--jc-container: 1248px;
	--jc-gap: 24px;

	--jc-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		"Helvetica Neue", Arial, sans-serif;
	--jc-font-display: "Montserrat", var(--jc-font);

	/* Глобальные цвета Astra (меняем бренд-палитру темы) */
	--ast-global-color-0: #1b88d8;
	--ast-global-color-1: #1776bd;
	--ast-global-color-2: #444b54;
	--ast-global-color-3: #3c3d41;
	--ast-global-color-4: #ffffff;
	--ast-global-color-5: #f9f9f9;
	--ast-global-color-6: #f2f2f2;
	--ast-global-color-7: #ededee;
	--ast-global-color-8: #1b2025;
}

/* --------------------------------------------------------------------------
   База
   -------------------------------------------------------------------------- */

body,
body.ast-plain-container,
.ast-plain-container,
.ast-page-builder-template {
	font-family: var(--jc-font);
	font-size: 16.5px;
	line-height: 1.65;
	color: var(--jc-text);
	background-color: var(--jc-bg);
	-webkit-font-smoothing: antialiased;
}

/* Контентные колонки Astra — прозрачные, чтобы виден был фон #f9f9f9 */
.ast-separate-container .article-content,
.ast-separate-container .entry-content,
.ast-separate-container .ast-article-inner {
	background-color: transparent;
}

h1, h2, h3, h4, h5, h6,
.ast-post-title-1 .entry-title,
.entry-title {
	font-family: var(--jc-font-display);
	color: var(--jc-heading);
	letter-spacing: -0.01em;
}

a {
	color: var(--jc-link);
	text-decoration: none;
	transition: color 0.15s ease;
}

a:hover,
a:focus {
	color: var(--jc-link-hover);
}

:focus-visible {
	outline: 2px solid var(--jc-primary);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Заголовки секций: по центру с короткой линией сверху (как в референсе)
   -------------------------------------------------------------------------- */

.entry-content > h2,
.entry-content > .wp-block-group > h2 {
	position: relative;
	margin: 0 auto 34px;
	padding-top: 26px;
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
}

/* Плоские страницы (услуги, цены): верхний отступ перед секцией */
.entry-content > h2 {
	margin-top: 46px;
}

.entry-content > h2::before,
.entry-content > .wp-block-group > h2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 96px;
	height: 2px;
	background: #ccc;
}

h3 {
	font-weight: 700;
	font-size: 21px;
	line-height: 1.35;
	color: var(--jc-heading);
}

.entry-content {
	font-size: 16.5px;
	line-height: 1.65;
}

.entry-content p {
	margin: 0 0 16px;
}

/* Списки: тонкая черта-маркер вместо маркеров WP */
.entry-content ul,
.entry-content ol {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.entry-content ul li,
.entry-content ol li {
	position: relative;
	padding-left: 45px;
	margin-bottom: 10px;
}

.entry-content ul li::before {
	content: "";
	position: absolute;
	top: 0.75em;
	left: 0;
	width: 40px;
	height: 1px;
	background: var(--jc-text);
}

.entry-content ol {
	counter-reset: jc-ol;
}

.entry-content ol li {
	counter-increment: jc-ol;
}

.entry-content ol li::before {
	content: counter(jc-ol) ".";
	position: absolute;
	top: 0;
	left: 0;
	font-weight: 700;
	color: var(--jc-primary);
}

/* --------------------------------------------------------------------------
   Кнопки: pill, капс, letter-spacing (фирменный приём референса)
   -------------------------------------------------------------------------- */

.jc-btn,
.wp-block-button__link,
.entry-content .wp-block-button__link,
.is-style-outline.wp-element-button,
button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 13px 30px;
	border: 1px solid transparent;
	border-radius: var(--jc-pill);
	font-family: var(--jc-font);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.3;
	text-align: center;
	white-space: normal;
	cursor: pointer;
	transition: box-shadow 0.25s ease, background-color 0.2s ease,
		border-color 0.2s ease, color 0.2s ease;
}

.jc-btn svg {
	width: 17px;
	height: 17px;
	flex: 0 0 auto;
}

/* Синий — основной CTA */
.jc-btn--primary,
.entry-content .wp-block-button__link {
	background-color: var(--jc-primary);
	border-color: var(--jc-primary);
	color: var(--jc-white);
}

.jc-btn--primary:hover,
.jc-btn--primary:focus,
.entry-content .wp-block-button__link:hover,
.entry-content .wp-block-button__link:focus {
	background-color: var(--jc-primary);
	border-color: var(--jc-primary);
	color: var(--jc-white);
	box-shadow: 0 10px 15px rgba(27, 136, 216, 0.22);
}

/* Красный — всё, что ведёт в калькулятор (как на референсе) */
.entry-content .wp-block-button__link[href*="#calc"],
a.jc-btn--red {
	background-color: var(--jc-red);
	border-color: var(--jc-red);
	color: var(--jc-white);
}

.entry-content .wp-block-button__link[href*="#calc"]:hover,
.entry-content .wp-block-button__link[href*="#calc"]:focus,
a.jc-btn--red:hover,
a.jc-btn--red:focus {
	background-color: var(--jc-red);
	border-color: var(--jc-red);
	color: var(--jc-white);
	box-shadow: 0 10px 15px rgba(226, 57, 54, 0.22);
}

/* Контурная */
.jc-btn--outline,
.is-style-outline .wp-block-button__link,
.wp-block-button__link.is-style-outline,
.entry-content .is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	border-color: var(--jc-primary);
	color: var(--jc-primary);
}

.jc-btn--outline:hover,
.jc-btn--outline:focus,
.wp-block-button__link.is-style-outline:hover,
.wp-block-button__link.is-style-outline:focus,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: var(--jc-primary);
	border-color: var(--jc-primary);
	color: var(--jc-white);
	box-shadow: 0 10px 15px rgba(27, 136, 216, 0.22);
}

/* Контурная, ведущая в калькулятор — красная */
.wp-block-button__link.is-style-outline[href*="#calc"],
.wp-block-button.is-style-outline .wp-block-button__link[href*="#calc"] {
	background: transparent;
	border-color: var(--jc-red);
	color: var(--jc-red);
}

.wp-block-button__link.is-style-outline[href*="#calc"]:hover,
.wp-block-button.is-style-outline .wp-block-button__link[href*="#calc"]:hover {
	background: var(--jc-red);
	color: var(--jc-white);
}

/* Outline: астра-инлайн задаёт .wp-block-button__link.is-style-outline:not(.has-background)
   background-color: transparent со спецификацией (0,5,0) — он перебивал наши :hover (0,3,0)
   и оставлял белый текст на прозрачном фоне. Ниже — правило с большим приоритетом. */
.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background),
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background) {
	background-color: transparent;
	border-color: var(--jc-primary);
	color: var(--jc-primary);
}

.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background):hover,
.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background):focus,
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background):hover,
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background):focus {
	background-color: var(--jc-primary);
	border-color: var(--jc-primary);
	color: var(--jc-white);
	box-shadow: 0 10px 15px rgba(27, 136, 216, 0.22);
}

.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"],
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"] {
	background-color: transparent;
	border-color: var(--jc-red);
	color: var(--jc-red);
}

.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"]:hover,
.wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"]:focus,
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"]:hover,
.entry-content .wp-block-button .wp-block-button__link.wp-element-button.is-style-outline:not(.has-background)[href*="#calc"]:focus {
	background-color: var(--jc-red);
	border-color: var(--jc-red);
	color: var(--jc-white);
	box-shadow: 0 10px 15px rgba(226, 57, 54, 0.22);
}

.jc-btn--sm {
	min-height: 38px;
	padding: 8px 22px;
	font-size: 12px;
}

.jc-btn--tg svg,
.jc-btn--vk svg {
	color: currentColor;
}

/* --------------------------------------------------------------------------
   Шапка: полоса меню во всю ширину + строка логотип/телефон/кнопки/мессенджеры
   (Astra-шапка скрыта, см. .site-header ниже)
   -------------------------------------------------------------------------- */

.jc-menubar {
	background-color: var(--jc-gray);
	border-bottom: 1px solid var(--jc-border);
	position: relative;
	z-index: 60;
}

.jc-menubar__inner {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	max-width: var(--jc-container);
	margin: 0 auto;
	padding: 0 24px;
}

.jc-menubar__nav {
	flex: 1 1 auto;
}

/* Верхний уровень: во всю ширину контейнера (первый и последний пункты
   — на общей оси контента, 120px на 1440) */
.jc-menubar__nav > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	list-style: none;
	margin: 0;
	padding: 0;
}

.jc-menubar__nav li {
	margin: 0;
	padding: 0;
	position: relative;
}

.jc-menubar__nav a {
	display: block;
	padding: 12px 11px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--jc-dark);
}

.jc-menubar__nav > ul > li:last-child > a {
	padding-right: 0;
}

.jc-menubar__nav > ul > li:first-child > a {
	padding-left: 0;
}

.jc-menubar__nav a:hover,
.jc-menubar__nav a:focus {
	color: var(--jc-primary);
}

.jc-menubar__nav .current-menu-item > a,
.jc-menubar__nav .current-menu-ancestor > a {
	color: var(--jc-primary);
}

/* Выпадающее подменю (десктоп: hover/focus, плавное появление) */
.jc-menubar__nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 60;
	min-width: 250px;
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 8px 0;
	list-style: none;
	background: var(--jc-white);
	border: 1px solid var(--jc-border);
	border-radius: var(--jc-radius-sm);
	box-shadow: 0 14px 28px rgba(69, 75, 84, 0.14);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

.jc-menubar__nav li:hover > .sub-menu,
.jc-menubar__nav li:focus-within > .sub-menu,
.jc-menubar__nav li.is-sub-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.jc-menubar__nav .sub-menu a {
	padding: 10px 20px;
	font-size: 14.5px;
	font-weight: 600;
	white-space: nowrap;
}

/* Гамбургер (только мобильные) */
.jc-menubar__toggle {
	display: none;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 4px;
	width: 42px;
	height: 38px;
	margin: 4px 0;
	padding: 0;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius-sm);
	background: var(--jc-white);
	cursor: pointer;
}

.jc-menubar__toggle span {
	display: block;
	width: 18px;
	height: 2px;
	background: var(--jc-dark);
}

.jc-header {
	background-color: var(--jc-white);
	border-bottom: 1px solid var(--jc-border);
}

.jc-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	max-width: var(--jc-container);
	margin: 0 auto;
	padding: 13px 24px;
}

.jc-header__inner img {
	display: block;
	max-height: 46px;
	width: auto;
	height: auto;
}

.jc-header__actions {
	display: flex;
	align-items: center;
	gap: 14px;
}

.jc-header__phone {
	color: var(--jc-dark);
	font-weight: 700;
	font-size: 16px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.jc-header__phone:hover,
.jc-header__phone:focus {
	color: var(--jc-primary);
}

/* На белом фоне кружкам соцсетей нужен фон — иначе сливаются */
.jc-header .jc-circle {
	background: var(--jc-gray);
}

/* Шапка Astra больше не используется: меню, логотип, телефон, кнопка
   и мессенджеры выведены jc_header_bars() до .site-header. */
.site-header {
	display: none;
}

/* Круглые кнопки соцсетей */
.jc-circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--jc-white);
	color: var(--jc-primary);
	box-shadow: 0 2px 6px rgba(69, 75, 84, 0.1);
	transition: background-color 0.2s ease, color 0.2s ease,
		box-shadow 0.2s ease;
}

.jc-circle svg {
	width: 17px;
	height: 17px;
}

.jc-circle:hover,
.jc-circle:focus {
	background: var(--jc-primary);
	color: var(--jc-white);
	box-shadow: 0 6px 12px rgba(27, 136, 216, 0.25);
}

/* --------------------------------------------------------------------------
   Шапка: логотип + меню
   -------------------------------------------------------------------------- */

.site-header {
	background-color: var(--jc-white);
	border-bottom: 1px solid var(--jc-border);
}

.site-header .custom-logo-link img,
.site-header .site-logo-img img {
	max-height: 52px;
	width: auto;
	height: auto;
}

.site-branding:has(.custom-logo-link) .ast-site-title-wrap {
	display: none;
}

.site-header .site-title {
	font-family: var(--jc-font-display);
	font-size: 24px;
	font-weight: 800;
	margin: 0;
}

.main-header-bar {
	padding-top: 14px;
	padding-bottom: 14px;
}

.main-header-bar .main-navigation a {
	font-family: var(--jc-font-display);
	font-size: 14px;
	font-weight: 600;
	color: var(--jc-text);
	letter-spacing: 0.01em;
	white-space: nowrap;
	transition: color 0.2s ease;
}

.main-header-bar .main-navigation a:hover,
.main-header-bar .main-navigation a:focus,
.main-header-bar .main-header-menu > .current-menu-item > a,
.main-header-bar .main-header-menu > .current-menu-item > a:hover {
	color: var(--jc-primary);
}

.main-header-bar .main-navigation .sub-menu .menu-item > a {
	font-weight: 500;
}

.main-header-bar .main-header-menu > .menu-item > a {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 7px;
	padding-right: 7px;
}

.ast-primary-header-bar .ast-builder-menu .main-header-menu .menu-item > a {
	border-bottom: 2px solid transparent;
}

.ast-primary-header-bar .ast-builder-menu .main-header-menu .menu-item:hover > a,
.ast-primary-header-bar .ast-builder-menu .main-header-menu .current-menu-item > a {
	border-bottom-color: var(--jc-primary);
}

/* --------------------------------------------------------------------------
   Герой: заголовок с подсветкой, буллеты, правая панель
   -------------------------------------------------------------------------- */

/* На главной своя H1 в герое — служебный заголовок страницы («Главная»)
   не показываем. Пункт меню с тем же словом удалён из базы. */
body.home .entry-header {
	display: none;
}

.jc-hero {
	padding: 10px 0 4px;
}

.jc-hero__cols {
	gap: 40px;
	align-items: center;
}

.jc-hero h1 {
	margin: 0 0 18px;
	font-size: 42px;
	font-weight: 800;
	line-height: 1.18;
	color: var(--jc-heading);
	/* Подсветка нижней половины текста, как в референсе */
	width: fit-content;
	background-image: linear-gradient(transparent 58%, var(--jc-soft) 58%);
}

.jc-hero__lead {
	font-size: 18px;
	line-height: 1.6;
	margin-bottom: 22px !important;
}

.jc-hero__list {
	margin: 0 0 26px !important;
}

.jc-hero__list li {
	padding-left: 45px;
	margin-bottom: 6px;
	font-size: 20px;
	line-height: 1.6;
}

.jc-hero__list li::before {
	top: 0.72em;
	width: 40px;
	height: 1px;
	background: var(--jc-text);
}

.jc-hero .wp-block-buttons {
	margin-top: 26px;
	gap: 14px;
}

.jc-hero__panel {
	background: var(--jc-soft);
	border-radius: var(--jc-radius);
	padding: 34px 30px;
}

/* Правая колонка идёт в рост: пока текста слева больше, чем высота карточки,
   панель занимает всю высоту героя, а её содержимое держится по центру. */
.jc-hero__cols > .wp-block-column:last-child {
	display: flex;
}

/* column + stretch: карточка (и картинка) тянутся на всю ширину панели,
   персонаж центрируется сам через align-self — раньше row + align-items:center
   центрировало карточку по вертикали, в column этим занимается justify-content. */
.jc-hero__panel {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	gap: 18px;
}

/* Персонаж выше карточки со статистикой: высота задаётся в px (см. адаптив),
   ширина идёт от пропорций PNG 462×520 — картинка не распирает панель. */
.jc-hero__char {
	margin: 0;
	align-self: center;
	line-height: 0;
}

.jc-hero__char img {
	display: block;
	height: 240px;
	width: auto;
	max-width: 100%;
}

.jc-hero__card {
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	padding: 26px 28px;
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.08);
}

.jc-hero__stat {
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 12px 0;
	border-bottom: 1px dashed var(--jc-border-2);
}

.jc-hero__stat:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.jc-hero__stat:first-child {
	padding-top: 0;
}

.jc-hero__stat b {
	font-family: var(--jc-font-display);
	font-size: 26px;
	font-weight: 800;
	color: var(--jc-primary);
	white-space: nowrap;
}

.jc-hero__stat span {
	font-size: 14.5px;
	color: var(--jc-text);
	line-height: 1.45;
}

.jc-trust {
	margin-top: 26px !important;
	font-size: 14px;
	font-weight: 600;
	color: #8a919a;
}

/* --------------------------------------------------------------------------
   Секции: карточки и колонки
   -------------------------------------------------------------------------- */

/* Astra даёт .entry-content > .wp-block-group padding 49.5px со всех
   сторон — из-за него текст главной «ступенькой» правее шапки и логотипа.
   Горизонтальный отступ убираем: контент секций на одной оси с контентом
   страниц (120px на 1440) и с полосой меню/шапкой. Вертикаль не трогаем. */
body .entry-content > .jc-hero,
body .entry-content > .jc-sec {
	padding-left: 0;
	padding-right: 0;
}

.jc-sec {
	margin-top: 54px;
}

.jc-sec + .jc-sec {
	margin-top: 54px;
}

/* Колонки-карточки (цифры, шаги, услуги) */
.jc-numbers .wp-block-column,
.jc-steps .wp-block-column,
.jc-services .wp-block-column {
	box-sizing: border-box;
	margin-bottom: 16px;
	padding: 26px 24px;
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	text-align: center;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.jc-numbers .wp-block-column:hover,
.jc-steps .wp-block-column:hover,
.jc-services .wp-block-column:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.1);
	transform: translateY(-2px);
}

.jc-numbers h3,
.jc-steps h3,
.jc-services h3 {
	margin: 0 0 8px;
	font-size: 20px;
	font-weight: 800;
	color: var(--jc-heading);
}

.jc-numbers h3 {
	font-size: 30px;
	color: var(--jc-primary);
}

.jc-steps h3 {
	font-size: 17px;
}

.jc-steps h3::first-letter {
	color: var(--jc-primary);
}

.jc-numbers p,
.jc-steps p,
.jc-services p {
	margin-bottom: 14px !important;
	font-size: 15px;
	line-height: 1.55;
	opacity: 0.9;
}

/* Шаги «Как мы работаем»: сетка 3 + 2 вместо пяти плиток в ряд —
   меньше давит на глаз, больше воздуха между карточками.
   6 колонок: первые три по 2, вторые две сдвигаем к центру. */
.jc-sec .jc-steps {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 26px;
}

.jc-sec .jc-steps > .wp-block-column {
	grid-column: span 2;
	margin-bottom: 0;
	padding: 30px 26px;
}

.jc-sec .jc-steps > .wp-block-column:nth-child(4) {
	grid-column: 2 / span 2;
}

.jc-sec .jc-steps > .wp-block-column:nth-child(5) {
	grid-column: 4 / span 2;
}

.jc-services .wp-block-column {
	display: flex;
	flex-direction: column;
}

.jc-services .wp-block-column .wp-block-buttons {
	margin-top: auto;
}

/* Фото в карточке услуги: во всю ширину карточки сверху — отрицательные
   поля компенсируют padding карточки, 4:3 + cover, чтобы не растягивалось. */
.jc-services .jc-svc__img {
	margin: -26px -24px 18px;
	border-radius: var(--jc-radius) var(--jc-radius) 0 0;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}

.jc-services .jc-svc__img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.jc-services .wp-block-buttons .wp-block-button__link {
	min-height: 42px;
	padding: 10px 22px;
	font-size: 11.5px;
}

/* Калькулятор: белая панель */
.jc-calc {
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
}

/* Финальный CTA-блок: синяя панель */
.jc-cta {
	background: var(--jc-primary);
	color: var(--jc-white);
	border-radius: var(--jc-radius);
}

.jc-cta__title,
.jc-cta .jc-cta__title {
	color: var(--jc-white);
}

.jc-cta__lead {
	color: rgba(255, 255, 255, 0.92);
}

.jc-cta .jc-btn--primary {
	background: var(--jc-red);
	border-color: var(--jc-red);
}

.jc-cta .jc-btn--primary:hover {
	box-shadow: 0 10px 15px rgba(0, 0, 0, 0.2);
}

.jc-cta__phone {
	color: var(--jc-white) !important;
	font-weight: 700;
	font-size: 19px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.jc-cta .jc-btn--tg,
.jc-cta .jc-btn--vk {
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.5);
	color: var(--jc-white);
}

.jc-cta .jc-btn--tg:hover,
.jc-cta .jc-btn--vk:hover {
	background: var(--jc-white);
	color: var(--jc-primary);
}

/* --------------------------------------------------------------------------
   FAQ: белые строки с синим знаком «?» (как в референсе)
   -------------------------------------------------------------------------- */

.jc-faq {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 8px;
}

.jc-faq .jc-faq__item {
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	overflow: hidden;
}

.jc-faq h3 {
	position: relative;
	margin: 0;
	padding: 15px 46px 15px 56px;
	font-family: var(--jc-font);
	font-size: 15.5px;
	font-weight: 700;
	color: var(--jc-dark);
	background: var(--jc-white);
}

.jc-faq h3::before {
	content: "?";
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--jc-primary);
	color: var(--jc-white);
	font-size: 13px;
	font-weight: 700;
}

.jc-faq h3::after {
	content: "";
	position: absolute;
	right: 20px;
	top: 50%;
	width: 8px;
	height: 8px;
	margin-top: -6px;
	border-right: 2px solid var(--jc-muted);
	border-bottom: 2px solid var(--jc-muted);
	transform: rotate(45deg);
}

.jc-faq p {
	margin: 0 !important;
	padding: 0 24px 16px 56px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--jc-text);
}

/* Аккордеон: включается JS-ом классом .is-js (без JS всё раскрыто — контент доступен) */
.jc-faq.is-js .jc-faq__item > p {
	max-height: 0;
	overflow: hidden;
	padding-top: 0;
	padding-bottom: 0;
	opacity: 0;
	transition: max-height 0.3s ease, opacity 0.25s ease, padding 0.3s ease;
}

.jc-faq.is-js .jc-faq__item.is-open > p {
	max-height: 600px;
	opacity: 1;
	padding: 0 24px 16px 56px;
}

.jc-faq.is-js h3 {
	cursor: pointer;
	user-select: none;
}

.jc-faq.is-js h3::after {
	transition: transform 0.25s ease;
}

.jc-faq.is-js .jc-faq__item.is-open h3::after {
	transform: rotate(225deg);
}

/* --------------------------------------------------------------------------
   Общие секции на страницах услуги
   -------------------------------------------------------------------------- */

.jc-block {
	margin: 28px 0;
	padding: 26px 28px;
	border: 1px solid var(--jc-border);
	border-radius: var(--jc-radius);
	background-color: var(--jc-white);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.05);
}

.jc-block h2 {
	position: static;
	margin-top: 0;
	padding-top: 0;
	text-align: left;
	font-size: 26px;
	font-weight: 800;
}

.jc-block h2::before {
	display: none;
}

.jc-block p {
	margin-top: 0;
}

.jc-block__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 16px;
}

.jc-block__note {
	margin: 12px 0 0;
	font-size: 15px;
}

.jc-block__note a {
	font-weight: 600;
}

/* списки в блоках вне .entry-content — тот же стиль, что у списков контента
   (черта перед пунктом вместо маркера браузера) */
.jc-block ul {
	margin: 4px 0 14px;
}

.jc-block ul li {
	position: relative;
	padding-left: 45px;
	margin-bottom: 10px;
	list-style: none;
}

.jc-block ul li::before {
	content: "";
	position: absolute;
	top: 0.75em;
	left: 0;
	width: 40px;
	height: 1px;
	background: var(--jc-text);
}

.jc-related__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 10px 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.jc-related__list li {
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

.jc-related__list li::before {
	display: none;
}

.jc-related__list a {
	display: block;
	padding: 12px 16px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius-sm);
	background-color: var(--jc-white);
	font-weight: 600;
	font-size: 15px;
	transition: border-color 0.2s ease, color 0.2s ease,
		box-shadow 0.2s ease;
}

.jc-related__list a:hover,
.jc-related__list a:focus {
	border-color: var(--jc-primary);
	color: var(--jc-primary);
	box-shadow: 0 6px 14px rgba(27, 136, 216, 0.12);
}

/* Хаб услуг */
.jc-hub__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 18px;
	margin: 26px 0;
}

.jc-hub__card {
	margin: 0;
	padding: 24px 26px;
	border: 0;
	border-radius: var(--jc-radius);
	background-color: var(--jc-white);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.jc-hub__card:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.1);
	transform: translateY(-2px);
}

.jc-hub__title {
	margin: 0 0 8px;
	font-size: 19px;
	font-weight: 800;
}

.jc-hub__text {
	margin: 0;
	font-size: 15px;
	color: var(--jc-text);
	opacity: 0.85;
}

.jc-hub__sublist {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}

.jc-hub__sublist li {
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

.jc-hub__sublist li::before {
	display: none;
}

.jc-hub__sublist a {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Блог: рубрикатор и карточки
   -------------------------------------------------------------------------- */

.jc-posts__header {
	margin-bottom: 20px;
}

.jc-rubricator {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 14px;
}

.jc-rubricator__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-pill);
	background: var(--jc-white);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.jc-rubricator__link:hover,
.jc-rubricator__link:focus {
	border-color: var(--jc-primary);
	color: var(--jc-primary);
}

.jc-rubricator__count {
	padding: 1px 8px;
	border-radius: var(--jc-pill);
	background: rgba(27, 136, 216, 0.12);
	font-size: 12px;
}

.jc-posts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 22px;
	margin-bottom: 28px;
}

.jc-card {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: var(--jc-radius);
	background-color: var(--jc-white);
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.jc-card:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.1);
	transform: translateY(-2px);
}

.ast-separate-container .ast-blog-layout-4-grid .jc-posts .jc-card,
.ast-blog-layout-4-grid .jc-posts .jc-card,
.jc-posts > .jc-card {
	width: 100%;
	margin-bottom: 0;
	padding: 0;
	background-color: var(--jc-white);
}

.jc-card__thumb {
	display: block;
	overflow: hidden;
	margin: 0;
	border-bottom: 0;
}

.jc-card__thumb img {
	display: block;
	width: 100%;
	aspect-ratio: 1200 / 630;
	object-fit: cover;
}

.jc-card__body {
	padding: 18px 22px 22px;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.jc-single__thumb {
	overflow: hidden;
	margin: 18px 0;
	border: 0;
	border-radius: var(--jc-radius);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.08);
}

.jc-single__thumb img {
	display: block;
	width: 100%;
	height: auto;
}

.jc-card__title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.35;
}

.jc-card__title a {
	color: var(--jc-heading);
}

.jc-card__title a:hover {
	color: var(--jc-primary);
}

.jc-card__meta {
	margin: 0 0 10px;
	font-size: 13px;
	color: var(--jc-muted);
}

.jc-card__meta a {
	color: inherit;
}

.jc-card__excerpt {
	flex: 1 1 auto;
	font-size: 15px;
	color: var(--jc-text);
	opacity: 0.9;
}

.jc-card__more {
	margin-top: 14px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--jc-primary);
	text-decoration: none;
}

.jc-card__more:hover {
	text-decoration: underline;
}

/* Лента «последние записи» на главной */
.entry-content .wp-block-latest-posts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
}

.entry-content .wp-block-latest-posts li {
	display: flex;
	flex-direction: column;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.entry-content .wp-block-latest-posts li:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.1);
	transform: translateY(-2px);
}

.entry-content .wp-block-latest-posts li::before {
	display: none;
}

.entry-content .wp-block-latest-posts img {
	display: block;
	width: 100%;
	aspect-ratio: 1200 / 630;
	object-fit: cover;
	margin: 0;
}

.entry-content .wp-block-latest-posts .wp-block-latest-posts__post-title {
	margin: 14px 20px 6px;
	font-family: var(--jc-font-display);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

.entry-content .wp-block-latest-posts .wp-block-latest-posts__post-title a {
	color: var(--jc-heading);
}

.entry-content .wp-block-latest-posts .wp-block-latest-posts__post-title a:hover {
	color: var(--jc-primary);
}

.entry-content .wp-block-latest-posts__post-date {
	margin: auto 20px 14px;
	font-size: 13px;
	color: var(--jc-muted);
}

.navigation.pagination {
	margin-bottom: 20px;
}

/* Запись блога */
.jc-single__footer {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 26px;
	padding-top: 18px;
	border-top: 1px dashed var(--jc-border-2);
}

.jc-single__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px;
	margin-top: 22px;
	font-size: 15px;
}

.jc-single__nav-item:empty {
	display: none;
}

/* --------------------------------------------------------------------------
   Зона выезда: карточки-факты (карту убрали — читалась как «только по западу»)
   -------------------------------------------------------------------------- */

.jc-geo {
	gap: var(--jc-gap);
	margin-top: 4px;
}

.jc-geo .wp-block-column {
	padding: 22px 22px 18px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius);
	background: var(--jc-white);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.05);
}

.jc-geo h3 {
	margin-top: 0;
	font-size: 17px;
	font-weight: 800;
}

.jc-geo p {
	margin: 8px 0 0 !important;
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--jc-text);
}

.jc-section-note {
	font-size: 14px;
	color: #8a919a;
}

.jc-anchor {
	scroll-margin-top: 110px;
}

/* --------------------------------------------------------------------------
   Таблицы прайса и пакеты
   -------------------------------------------------------------------------- */

.jc-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 18px 0 26px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius);
	background: var(--jc-white);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.05);
}

.jc-price-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	background: var(--jc-white);
}

.jc-price-table th,
.jc-price-table td {
	padding: 11px 16px;
	border-bottom: 1px solid var(--jc-border);
	text-align: left;
	vertical-align: top;
}

.jc-price-table th {
	background: var(--jc-gray);
	color: var(--jc-dark);
	font-weight: 700;
	font-size: 13.5px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.jc-price-table tbody tr:last-child td {
	border-bottom: 0;
}

.jc-price-table tbody tr:nth-child(even) {
	background: #fafbfc;
}

.jc-price-table tbody tr:hover {
	background: rgba(27, 136, 216, 0.05);
}

.jc-packages .wp-block-column {
	box-sizing: border-box;
	margin-bottom: 16px;
	padding: 24px 26px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius);
	background: var(--jc-white);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
}

.jc-packages .wp-block-column:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.1);
}

.jc-packages h3 {
	margin-top: 0;
	font-weight: 800;
}

.jc-packages .wp-block-buttons {
	margin-top: 16px;
}

.jc-packages__price {
	margin: 14px 0 0 !important;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--jc-dark);
}

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

.ast-breadcrumbs {
	margin: 16px 0 8px;
	font-size: 14px;
	color: var(--jc-muted);
}

.ast-breadcrumbs a {
	color: var(--jc-text);
}

.ast-breadcrumbs a:hover,
.ast-breadcrumbs a:focus {
	color: var(--jc-primary);
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Подвал: светлый, как в референсе (серая полоса + белый копирайт)
   -------------------------------------------------------------------------- */

.jc-footer {
	background-color: var(--jc-gray);
	color: var(--jc-text);
	border-top: 1px solid var(--jc-border);
}

.jc-footer__inner {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--jc-gap);
	max-width: var(--jc-container);
	margin: 0 auto;
	padding: 46px 24px 38px;
}

.jc-footer__col {
	min-width: 0;
}

.jc-footer__title {
	margin: 0 0 16px;
	font-family: var(--jc-font-display);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--jc-dark);
}

.jc-footer__text {
	margin: 12px 0 0;
	font-size: 14.5px;
	color: var(--jc-text);
}

.jc-footer__actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 2px;
}

.jc-footer__brand {
	display: inline-block;
	margin-bottom: 4px;
}

.jc-footer__brand img {
	height: 44px;
	width: auto;
}

.jc-footer .widget,
.jc-footer .menu,
.jc-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.jc-footer .menu li {
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

.jc-footer .menu li::before {
	display: none;
}

.jc-footer .menu li + li {
	margin-top: 9px;
}

/* Навигация подвала — в две колонки (10 пунктов иначе тянутся вниз) */
.jc-footer__col--nav .menu {
	columns: 2;
	column-gap: 18px;
}

.jc-footer__col--nav .menu li {
	margin-bottom: 9px;
	break-inside: avoid;
}

.jc-footer .menu a,
.jc-footer a:not(.jc-btn) {
	color: var(--jc-text);
}

.jc-footer .menu a:hover,
.jc-footer .menu a:focus,
.jc-footer a:not(.jc-btn):hover,
.jc-footer a:not(.jc-btn):focus {
	color: var(--jc-primary);
}

.jc-footer__phone {
	display: inline-block;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--jc-dark) !important;
	margin-bottom: 10px;
}

.jc-footer__phone:hover {
	color: var(--jc-primary) !important;
}

.jc-footer__address {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 6px;
	font-size: 14px;
	color: #7d858d;
}

.jc-footer__address svg {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	color: var(--jc-primary);
}

.jc-contacts-list {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
	font-size: 15px;
}

.jc-contacts-list li {
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

.jc-contacts-list li::before {
	display: none;
}

.jc-contacts-list a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: var(--jc-text);
}

.jc-contacts-list a:hover,
.jc-contacts-list a:focus {
	color: var(--jc-primary);
}

.jc-contacts-list svg {
	width: 17px;
	height: 17px;
	flex: 0 0 auto;
	color: var(--jc-primary);
}

/* Пустая обёртка Astra «below footer» (padding 20px + пустая секция) —
   давала ~100px белого пространства между футером и копирайтом. */
#colophon .site-below-footer-wrap,
.site-footer .site-below-footer-wrap {
	display: none !important;
}

.jc-copyright {
	background: var(--jc-white);
	border-top: 1px solid var(--jc-border);
	font-size: 14px;
	color: #7d858d;
}

.jc-copyright__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	max-width: var(--jc-container);
	margin: 0 auto;
	padding: 18px 24px;
}

.jc-copyright a {
	color: var(--jc-text);
	text-decoration: underline;
}

.jc-copyright a:hover {
	color: var(--jc-primary);
}

/* --------------------------------------------------------------------------
   Формы Fluent Forms: светлые, кнопка-отправка красная (как в референсе)
   -------------------------------------------------------------------------- */

.jc-block--form .fluentform,
.jc-footer__col--form .fluentform {
	margin-top: 14px;
}

.fluentform .ff-el-input--label > label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
	color: var(--jc-heading);
}

.fluentform .ff-el-form-control {
	box-sizing: border-box;
	width: 100%;
	min-height: 46px;
	padding: 10px 14px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius-sm);
	background: var(--jc-white);
	color: var(--jc-text);
	font: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fluentform textarea.ff-el-form-control {
	min-height: 92px;
	resize: vertical;
}

.fluentform .ff-el-form-control:focus {
	outline: none;
	border-color: var(--jc-primary);
	box-shadow: 0 0 0 3px rgba(27, 136, 216, 0.15);
}

.fluentform .ff-el-form-control.ff-el-form-has-error,
.fluentform .ff-el-form-control.ff-invalid {
	border-color: var(--jc-red);
}

.fluentform .ff_msg_error,
.fluentform .error-message,
.fluentform .ff_el_error_msg {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--jc-red);
}

.fluentform button[type="submit"],
.fluentform .ff-btn-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 13px 30px;
	border: 1px solid var(--jc-red);
	border-radius: var(--jc-pill);
	background: var(--jc-red);
	color: var(--jc-white);
	font-family: var(--jc-font);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.3;
	cursor: pointer;
	transition: box-shadow 0.25s ease, background-color 0.2s ease;
}

.fluentform button[type="submit"]:hover,
.fluentform button[type="submit"]:focus,
.fluentform .ff-btn-submit:hover {
	background: var(--jc-red);
	border-color: var(--jc-red);
	box-shadow: 0 10px 15px rgba(226, 57, 54, 0.22);
}

.fluentform .ff-errors-in-stack {
	margin-bottom: 14px;
	padding: 10px 14px;
	border: 1px solid #f2c4c4;
	border-radius: var(--jc-radius-sm);
	background: #fdf3f3;
	color: #a33;
	font-size: 14px;
}

.fluentform .ff-message-success,
.fluentform .ff-success-message {
	padding: 14px 16px;
	border: 1px solid var(--jc-border-2);
	border-radius: var(--jc-radius);
	background: var(--jc-white);
	color: var(--jc-heading);
	font-size: 15px;
}

.fluentform .ff-el-html-content,
.fluentform .ff-tnc-checkbox-content {
	font-size: 13px;
	line-height: 1.5;
	color: var(--jc-text);
}

.fluentform .ff-el-tnc label,
.fluentform .ff-el-is-checkable label {
	font-size: 14px;
	color: var(--jc-text);
}

.fluentform .ff-el-input--help {
	margin-top: 4px;
	font-size: 13px;
	color: var(--jc-text);
	opacity: 0.8;
}

.fluentform .ff-el-form-check-input {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	accent-color: var(--jc-primary);
}

.fluentform .ff-el-form-check label {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	cursor: pointer;
}

/* Компактная форма в футере */
.jc-footer__col--form .ff-el-form-control {
	min-height: 40px;
	padding: 8px 12px;
	font-size: 14px;
}

.jc-footer__col--form button[type="submit"] {
	min-height: 42px;
	width: 100%;
	font-size: 12px;
}

.jc-footer__col--form .ff-el-input--label > label {
	margin-bottom: 4px;
	font-size: 13px;
}

/* --------------------------------------------------------------------------
   Календарь дат (flatpickr): светлая тема
   -------------------------------------------------------------------------- */

.flatpickr-calendar {
	background: var(--jc-white) !important;
	border: 1px solid var(--jc-border-2) !important;
	border-radius: var(--jc-radius) !important;
	box-shadow: 0 12px 30px rgba(69, 75, 84, 0.14) !important;
	font-family: var(--jc-font);
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
	color: var(--jc-heading) !important;
	background: transparent !important;
	font-weight: 600;
}

.flatpickr-current-month .flatpickr-monthDropdown-months option {
	background: var(--jc-white);
	color: var(--jc-text);
}

.flatpickr-day {
	border-radius: 6px !important;
	color: var(--jc-text) !important;
	max-width: none;
}

.flatpickr-day:hover,
.flatpickr-day:focus,
.flatpickr-day.flatpickr-startDay,
.flatpickr-day.flatpickr-endDay {
	background: var(--jc-soft) !important;
	border-color: var(--jc-soft) !important;
	color: var(--jc-dark) !important;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus {
	background: var(--jc-primary) !important;
	border-color: var(--jc-primary) !important;
	color: var(--jc-white) !important;
}

.flatpickr-weekday {
	color: var(--jc-muted) !important;
	font-weight: 600;
}

.flatpickr-weekdaygap .flatpickr-weekday {
	color: var(--jc-muted) !important;
}

span.flatpickr-weekday {
	color: var(--jc-muted) !important;
}

.flatpickr-day.flatpickr-disabled {
	color: #cfd3d7 !important;
}

.numInputWrapper span:hover,
.numInputWrapper input:hover {
	background: var(--jc-soft);
}

/* --------------------------------------------------------------------------
   Слайдер «до/после»: синий разделитель и ручка (фирменный приём)
   -------------------------------------------------------------------------- */

.jc-ba__handle,
.jc-ba__divider {
	border-color: var(--jc-primary);
}

/* --------------------------------------------------------------------------
   Модальные окна с формами (заявка / запись / консультация)
   -------------------------------------------------------------------------- */

.jc-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.jc-modal.is-open {
	display: flex;
}

.jc-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(24, 30, 36, 0.55);
}

.jc-modal__card {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	padding: 30px 30px 28px;
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.28);
	animation: jc-modal-in 0.18s ease;
}

.jc-modal__card:focus {
	outline: none;
}

@keyframes jc-modal-in {
	from {
		opacity: 0;
		transform: translateY(12px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.jc-modal__card .jc-modal__close {
	position: absolute;
	top: 8px;
	right: 12px;
	width: 40px;
	height: 40px;
	padding: 0;
	margin: 0;
	border: 0 !important;
	border-radius: 50%;
	background: #eef1f4 !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--jc-dark) !important;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

.jc-modal__card .jc-modal__close:hover,
.jc-modal__card .jc-modal__close:focus-visible {
	background: var(--jc-primary) !important;
	color: var(--jc-white) !important;
}

.jc-modal__title {
	margin: 0 34px 8px 0;
	font-size: 24px;
	font-weight: 800;
}

.jc-modal__text {
	margin: 0 0 16px;
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--jc-text);
}

body.jc-modal-open {
	overflow: hidden;
}

/* Оверлеи Fluent Forms должны жить поверх модалки (z-index 100000):
   календарь дат рендерится в body (z 99999), пузырь подсказки — в body
   (z 9999), иначе они уходят под затемнение и становятся некликабельны. */
.flatpickr-calendar {
	z-index: 100010 !important;
}

.ff-el-pop-content {
	z-index: 100020 !important;
}

/* --------------------------------------------------------------------------
   Загрузка фото к заявке (свой file-контрол, т.к. FF free — без загрузки)
   -------------------------------------------------------------------------- */

.jc-photo {
	margin-bottom: 16px;
}

.jc-photo__label {
	display: block;
	margin-bottom: 7px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--jc-dark);
}

.jc-photo__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 24px;
	border: 1px dashed var(--jc-primary);
	border-radius: var(--jc-pill);
	background: rgba(27, 136, 216, 0.05);
	color: var(--jc-primary);
	font-family: var(--jc-font);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.jc-photo__btn:hover {
	background: var(--jc-primary);
	color: var(--jc-white);
}

.jc-photo__hint,
.jc-photo__status {
	margin-top: 7px;
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--jc-muted);
}

.jc-photo__status.is-error {
	color: var(--jc-red);
}

.jc-photo__status.is-ok {
	color: var(--jc-primary);
}

.jc-photo__preview {
	display: none;
	align-items: center;
	gap: 12px;
	margin-top: 10px;
}

.jc-photo__preview.is-visible {
	display: flex;
}

.jc-photo__preview img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var(--jc-border);
}

.jc-photo__name {
	font-size: 14px;
	color: var(--jc-text);
}

.jc-photo__remove {
	border: 0;
	background: none;
	color: var(--jc-red);
	font-size: 13.5px;
	text-decoration: underline;
	cursor: pointer;
}

/* --------------------------------------------------------------------------
   Фотогалерея примеров работ (/do-posle/) и её лайтбокс
   -------------------------------------------------------------------------- */

.jc-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 16px;
	margin: 24px 0;
}

.jc-gallery__item {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: var(--jc-radius);
	background: var(--jc-soft);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.jc-gallery__item:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.14);
	transform: translateY(-2px);
}

.jc-gallery__item a {
	display: block;
	line-height: 0;
}

.jc-gallery__item img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1; /* фото квадратные (1080×1080) — сетка без обрезки */
	object-fit: cover;
	transition: transform 0.4s ease;
}

.jc-gallery__item:hover img {
	transform: scale(1.05);
}

/* значок лупы: появляется на hover, исчезает пока галерея пуста */
.jc-gallery__item::after {
	content: '';
	position: absolute;
	right: 12px;
	bottom: 12px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23454b54' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-4.3-4.3M11 8.4v5.2M8.4 11h5.2'/></svg>") center / 18px no-repeat;
	box-shadow: 0 4px 12px rgba(69, 75, 84, 0.25);
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.25s ease, transform 0.25s ease;
	pointer-events: none;
}

.jc-gallery__item:hover::after {
	opacity: 1;
	transform: none;
}

.jc-gallery__empty {
	margin: 24px 0;
	padding: 28px 26px;
	border: 1px dashed var(--jc-border-2);
	border-radius: var(--jc-radius);
	background: var(--jc-soft);
	color: var(--jc-text);
	font-size: 15.5px;
	line-height: 1.6;
	text-align: center;
}

/* Лайтбокс: полноэкранный просмотр с навигацией и зумом */
.jc-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(16, 22, 28, 0.95);
	opacity: 1;
	transition: opacity 0.2s ease;
}

.jc-lightbox[hidden] {
	display: none;
}

.jc-lightbox__img {
	display: block;
	max-width: min(92vw, 1400px);
	max-height: 80vh;
	border-radius: 6px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
	object-fit: contain;
	cursor: zoom-in;
	transform-origin: center center;
	transition: transform 0.25s ease;
	user-select: none;
	-webkit-user-drag: none;
}

.jc-lightbox__img.is-zoomed {
	transform: scale(2.2);
	cursor: zoom-out;
}

.jc-lightbox__btn {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease;
}

.jc-lightbox__btn:hover {
	background: rgba(255, 255, 255, 0.28);
}

.jc-lightbox__close {
	top: 20px;
	right: 20px;
}

.jc-lightbox__prev,
.jc-lightbox__next {
	top: 50%;
	transform: translateY(-50%);
}

.jc-lightbox__prev {
	left: 20px;
}

.jc-lightbox__next {
	right: 20px;
}

.jc-lightbox__meta {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 18px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 0 70px;
	text-align: center;
	pointer-events: none;
}

.jc-lightbox__caption {
	max-width: 700px;
	color: rgba(255, 255, 255, 0.9);
	font-size: 15px;
	line-height: 1.5;
}

.jc-lightbox__counter {
	color: rgba(255, 255, 255, 0.6);
	font-size: 13px;
	letter-spacing: 0.04em;
}

.jc-lightbox__hint {
	position: absolute;
	left: 20px;
	bottom: 18px;
	color: rgba(255, 255, 255, 0.45);
	font-size: 12.5px;
}

/* --------------------------------------------------------------------------
   Отзывы с Юды (карточки: звёзды, задание, текст, заказчик)
   -------------------------------------------------------------------------- */

.jc-reviews {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 18px;
	margin: 24px 0 4px;
}

.jc-review {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 22px 24px;
	background: var(--jc-white);
	border-radius: var(--jc-radius);
	box-shadow: 0 2px 8px rgba(69, 75, 84, 0.06);
	text-align: left;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.jc-review:hover {
	box-shadow: 0 11px 22px rgba(69, 75, 84, 0.12);
	transform: translateY(-2px);
}

.jc-review__stars {
	color: #f2b01e;
	font-size: 17px;
	line-height: 1;
	letter-spacing: 2px;
}

.jc-review__task {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #8a919a;
	line-height: 1.45;
}

.jc-review__text {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.62;
	color: var(--jc-text);
	white-space: pre-line;
}

.jc-review__author {
	margin-top: auto;
	padding-top: 6px;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--jc-heading);
	border-top: 1px dashed var(--jc-border-2);
}

.jc-review__source {
	font-size: 13px;
	font-weight: 600;
	color: var(--jc-primary);
	text-decoration: none;
}

.jc-review__source:hover {
	text-decoration: underline;
}

@media (max-width: 782px) {
	.jc-gallery {
		grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
		gap: 10px;
	}

	.jc-lightbox {
		padding: 12px;
	}

	.jc-lightbox__img {
		max-width: 96vw;
		max-height: 72vh;
	}

	.jc-lightbox__prev {
		left: 8px;
	}

	.jc-lightbox__next {
		right: 8px;
	}

	.jc-lightbox__btn {
		width: 40px;
		height: 40px;
		font-size: 22px;
	}

	.jc-lightbox__hint {
		display: none;
	}
}

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

@media (max-width: 1200px) {
	.main-header-bar .main-navigation .menu-item > a {
		font-size: 13.5px;
		padding-left: 8px;
		padding-right: 8px;
	}
}

@media (max-width: 1024px) {
	.jc-hero h1 {
		font-size: 34px;
	}

	.jc-footer__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 782px) {
	body {
		font-size: 16px;
	}

	.entry-content {
		font-size: 16px;
	}

	.entry-content > h2,
	.entry-content > .wp-block-group > h2 {
		font-size: 26px;
		margin-bottom: 26px;
	}

	.jc-menubar__inner {
		padding: 0 12px;
	}

	.jc-menubar__toggle {
		display: inline-flex;
	}

	.jc-menubar__nav {
		display: none;
		width: 100%;
	}

	.jc-menubar.is-open .jc-menubar__nav {
		display: block;
	}

	.jc-menubar__nav ul {
		flex-direction: column;
		justify-content: flex-start;
		width: 100%;
	}

	/* Подменю на мобильных: аккордеон (раскрытие классом is-sub-open из JS) */
	.jc-menubar__nav .sub-menu {
		position: static;
		display: none;
		min-width: 0;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		background: transparent;
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: none;
	}

	.jc-menubar__nav li.is-sub-open > .sub-menu {
		display: flex;
	}

	.jc-menubar__nav .sub-menu a {
		padding: 10px 4px 10px 18px;
		font-size: 14px;
	}

	.jc-menubar__nav a {
		padding: 11px 4px;
		border-top: 1px dashed var(--jc-border);
	}

	.jc-header__inner {
		flex-wrap: wrap;
		padding: 10px 16px;
		gap: 10px;
	}

	.jc-header__actions {
		flex: 1 1 auto;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 10px;
	}

	.jc-header__phone {
		font-size: 14.5px;
	}

	.jc-hero h1 {
		font-size: 28px;
		background-image: linear-gradient(transparent 60%, var(--jc-soft) 60%);
	}

	.jc-hero__lead {
		font-size: 16.5px;
	}

	.jc-hero__list li {
		font-size: 17px;
		padding-left: 34px;
	}

	.jc-hero__list li::before {
		width: 26px;
	}

	.jc-hero .wp-block-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.jc-hero .wp-block-buttons .wp-block-button,
	.jc-hero .wp-block-buttons .wp-block-button__link {
		width: 100%;
	}

	.jc-hero__panel {
		padding: 24px 20px;
	}

	.jc-hero__char img {
		height: 170px;
	}

	.jc-sec {
		margin-top: 42px;
	}

	.jc-numbers .wp-block-column,
	.jc-steps .wp-block-column,
	.jc-services .wp-block-column {
		text-align: left;
	}

	.jc-sec .jc-steps {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}

	/* :nth-child(n) — чтобы перебить десктопные span-правила той же
	   специфичности (иначе колонка из 6-колоночной сетки тащится сюда). */
	.jc-sec .jc-steps > .wp-block-column:nth-child(n) {
		grid-column: auto;
	}

	.entry-content .wp-block-latest-posts {
		grid-template-columns: minmax(0, 1fr);
	}

	.jc-footer__inner {
		grid-template-columns: minmax(0, 1fr);
		padding: 34px 16px 26px;
		gap: 28px;
	}

	.jc-footer__col--nav .menu {
		columns: 1;
	}

	.jc-modal {
		padding: 12px;
	}

	.jc-modal__card {
		max-height: calc(100vh - 24px);
		padding: 24px 18px 22px;
	}

	.jc-copyright__inner {
		flex-direction: column;
		align-items: flex-start;
		padding: 16px;
	}

	.jc-block {
		padding: 20px 18px;
	}

	.jc-hub__list,
	.jc-posts {
		grid-template-columns: minmax(0, 1fr);
	}

	.jc-single__nav {
		flex-direction: column;
	}

	.jc-price-table th,
	.jc-price-table td {
		padding: 8px 10px;
		font-size: 14px;
	}

	.jc-faq h3 {
		padding: 14px 40px 14px 50px;
	}

	.jc-faq p {
		padding: 0 18px 14px 50px;
	}

	.fluentform button[type="submit"] {
		width: 100%;
	}
}

@media (max-width: 400px) {
	.jc-topbar__actions {
		gap: 6px;
	}

	.site-header .custom-logo-link img {
		max-height: 40px;
	}
}