/* ===========================================================================
   Arti Golden — бренд-стиль (поверх Kadence)
   Акцент #fd9408 · тёмный #363636 · Montserrat
   =========================================================================== */

:root {
	--global-palette1: #fd9408 !important; /* акцент */
	--global-palette2: #e98500 !important; /* акцент:hover */
	/* Тёплые нейтрали (сдвиг в кожу/тан) — раньше были холодно-серые,
	   из-за чего Kadence-карточки диссонировали с тёплыми ag-секциями. */
	--global-palette3: #2b251e !important; /* заголовки / тёмный (тёплый near-black) */
	--global-palette4: #3a332b !important;
	--global-palette5: #574f45 !important; /* текст (тёплый графит) */
	--global-palette6: #e7ded0 !important; /* границы (тёплый песок) */
	--global-palette7: #efe8dc !important;
	--global-palette8: #f7f3ea !important; /* светлый фон (тёплый крем) */
	--global-palette9: #ffffff !important;

	--global-palette-highlight: #fd9408 !important;
	--global-palette-highlight-alt: #e98500 !important;

	/* Токены «оживления» */
	--ag-ink: #2b251e;            /* тёплый near-black для текста/теней */
	--ag-cream: #f7f3ea;          /* тёплый светлый фон секций */
	--ag-line: #e7ded0;           /* тёплая граница */
	--ag-amber: #fd9408;
	--ag-amber-soft: #fff4e6;     /* подложка иконок */
	--ag-shadow: 43 37 30;        /* rgb тёплой тени (для rgba(var(--ag-shadow)/a)) */
	--ag-card-shadow: 0 1px 2px rgba(43,37,30,.05), 0 10px 24px -14px rgba(43,37,30,.18);
	--ag-card-shadow-hover: 0 2px 6px rgba(43,37,30,.06), 0 20px 40px -18px rgba(43,37,30,.28);
	--ag-ease: cubic-bezier(.22,.61,.36,1);

	/* Единая шкала отступов/размеров — чтобы сайт был однородным */
	--ag-radius: 14px;         /* карточки/поверхности (было вперемешку 10/12/14) */
	--ag-radius-ctrl: 8px;     /* кнопки, инпуты, мелкие бейджи (было 6/8) */
	--ag-pad-card: 28px 26px;  /* стандартный паддинг карточки */
	--ag-gap: 22px;            /* стандартный зазор сеток карточек */
	--ag-section-y: 80px;      /* вертикальный ритм секций */

	/* Амбр для ТЕКСТА на светлом: #fd9408 даёт 2.23:1 (не проходит WCAG AA).
	   #a35600 = 5.2:1 на белом. Яркий амбр остаётся для заливок/иконок/тёмных фонов. */
	--ag-amber-text: #a35600;
	/* Дисплейная антиква для крупных заголовков (пара к Montserrat в тексте) */
	--ag-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
}

/* Типографика */
body,
button,
input,
select,
textarea,
.entry-content {
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: var(--global-palette3);
	letter-spacing: -0.01em;
}

/* Ссылки и акценты */
a { color: var(--global-palette1); }
a:hover { color: var(--global-palette2); }

/* Кнопки */
.wp-block-button__link,
.button,
button.button,
input[type="submit"] {
	background-color: var(--global-palette1);
	border-color: var(--global-palette1);
	color: #ffffff;
	border-radius: var(--ag-radius-ctrl);
	font-weight: 700;
	transition: background-color .2s ease;
}
.wp-block-button__link:hover,
.button:hover,
input[type="submit"]:hover {
	background-color: var(--global-palette2);
	border-color: var(--global-palette2);
	color: #ffffff;
}

/* Outline-вариант кнопки */
.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--global-palette1);
	border: 2px solid var(--global-palette1);
}
.is-style-outline .wp-block-button__link:hover {
	background: var(--global-palette1);
	color: #fff;
}

/* Шапка / навигация */
.site-header-row .site-header-item .header-navigation .menu > .menu-item > a:hover,
.header-navigation .menu-item.current-menu-item > a {
	color: var(--global-palette1);
}

/* Лого в шапке: показываем ТОЛЬКО щит (обрезаем невидимую белую надпись справа),
   текстовый заголовок «Arti Golden» ставим вплотную → аккуратный lockup. */
.site-branding a.brand img.custom-logo,
.site-branding a.brand img.svg-logo-image {
	width: 46px !important;
	height: 46px !important;
	max-width: 46px !important;
	object-fit: cover;
	object-position: left center;
}
.site-branding a.brand { gap: 10px; align-items: center; }
.site-branding .site-title-wrap { margin-left: 0; }
.site-branding .site-title { font-size: 24px; color: var(--global-palette3); }

/* ===== Переключатель языков (выпадающее меню) ===== */
.ag-lang-switcher { position: relative; display: flex; align-items: center; }
.ag-lang-flag { display: inline-block; width: 18px; height: auto; border-radius: 2px; vertical-align: middle; }

.ag-lang-toggle {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 6px 10px; border-radius: var(--ag-radius-ctrl); line-height: 1;
	font-weight: 700; color: var(--global-palette3); cursor: pointer;
	user-select: none;
}
.ag-lang-toggle:hover { color: var(--global-palette1); }
.ag-lang-name { font-size: 14px; letter-spacing: .02em; }
.ag-lang-fullname { display: none; } /* по умолчанию (десктоп) показываем короткий код */
.ag-lang-caret {
	width: 0; height: 0; margin-left: 1px;
	border-left: 4px solid transparent; border-right: 4px solid transparent;
	border-top: 5px solid currentColor; transition: transform .2s ease;
}
.ag-lang-switcher.is-open .ag-lang-caret { transform: rotate(180deg); }

.ag-lang-sub {
	display: none !important; /* только клик (.is-open) открывает — без hover */
	position: absolute; top: 100%; right: 0; z-index: 120;
	min-width: 168px; margin: 8px 0 0; padding: 6px 0; list-style: none;
	overflow: hidden; /* подсветка пунктов не вылезает за скругление */
	background: #fff; border: 1px solid var(--global-palette6); border-radius: 10px;
	box-shadow: 0 14px 32px rgba(0,0,0,.13);
}
/* !important — чтобы перебить CSS аккордеона Kadence для .sub-menu в мобильном drawer */
.ag-lang-switcher.is-open > .ag-lang-sub { display: block !important; }
.ag-lang-sub li { margin: 0; }
.ag-lang-sub a {
	display: flex; align-items: center; gap: 10px; padding: 10px 18px;
	color: var(--global-palette3); text-decoration: none; font-weight: 600; white-space: nowrap;
}
.ag-lang-sub a:hover { background: var(--global-palette8); color: var(--global-palette1); }

/* ===== Мобильное меню (drawer) — полировка ===== */
/* Пункты меню: hover/active — акцент */
.drawer-menu-container .menu .menu-item > a:hover,
.drawer-menu-container .menu .current-menu-item > a { color: #fd9408; }
.drawer-menu-container .sub-menu .menu-item > a { color: rgba( 255, 255, 255, .72 ); }
.drawer-menu-container .sub-menu .menu-item > a:hover { color: #fd9408; }
/* Аккордеон-стрелка: убрать вертикальный разделитель-«коробку» */
.drawer-sub-toggle { color: #fff; border-left: 0 !important; }
.drawer-sub-toggle:hover { color: #fd9408; }

/* Переключатель языков в drawer: ровно как пункт меню (14px/400/белый), без лишних разделителей */
.mobile-navigation .ag-lang-switcher,
.drawer-navigation .ag-lang-switcher { display: block; }
.mobile-navigation .ag-lang-toggle,
.drawer-navigation .ag-lang-toggle { color: #fff; padding: 14px 0; width: 100%; gap: 9px; }
.mobile-navigation .ag-lang-toggle .ag-lang-name,
.drawer-navigation .ag-lang-toggle .ag-lang-name { font-size: 14px; font-weight: 400; color: #fff; }
.mobile-navigation .ag-lang-flag,
.drawer-navigation .ag-lang-flag { width: 20px; }
.mobile-navigation .ag-lang-caret,
.drawer-navigation .ag-lang-caret { border-top-color: #fff; margin-left: auto; }
.mobile-navigation .ag-lang-sub,
.drawer-navigation .ag-lang-sub {
	position: static; margin: 0 0 6px; padding-left: 30px;
	border: none; box-shadow: none; min-width: 0; background: transparent;
}
.mobile-navigation .ag-lang-sub a,
.drawer-navigation .ag-lang-sub a { color: rgba( 255, 255, 255, .72 ); font-size: 14px; font-weight: 400; padding: 11px 0; }
.mobile-navigation .ag-lang-sub a:hover,
.drawer-navigation .ag-lang-sub a:hover { color: #fd9408; background: transparent; }
.mobile-navigation .ag-lang-code,
.drawer-navigation .ag-lang-code { display: none; }
.mobile-navigation .ag-lang-fullname,
.drawer-navigation .ag-lang-fullname { display: inline; }

/* ===== Обычное выпадающее меню (под-услуги) — в стиле свитчера языков =====
   Открытие оставляем по hover (поведение Kadence), меняем только вид. */
.header-navigation .header-menu-container ul ul.sub-menu {
	background: #ffffff !important;
	border: 1px solid var(--global-palette6) !important;
	border-radius: 10px !important;
	box-shadow: 0 14px 32px rgba( 0, 0, 0, .13 ) !important;
	overflow: hidden;          /* подсветка пунктов не вылезает за скругление */
	padding: 6px 0 !important;
}
.header-navigation .header-menu-container ul ul.sub-menu li,
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item { border: 0 !important; }
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item > a {
	color: var(--global-palette3) !important;
	background: transparent !important;
	border: 0 !important;
	padding: 11px 20px !important;
	font-weight: 600;
}
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item > a:hover,
.header-navigation .header-menu-container ul ul.sub-menu li.menu-item.current-menu-item > a {
	color: var(--global-palette1) !important;
	background: var(--global-palette8) !important;
	border-radius: 0 !important;
}

/* Секции (полное определение — ниже; здесь только тёмный вариант) */
.ag-section--dark {
	background: #15110c;
	color: #e8e2d6;
}
.ag-section--dark h1, .ag-section--dark h2, .ag-section--dark h3 { color: #fff; }

/* Карточки услуг */
.ag-card {
	background: #fff;
	border: 1px solid var(--global-palette6);
	border-radius: var(--ag-radius);
	padding: var(--ag-pad-card);
	height: 100%;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ag-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 30px rgba(0,0,0,.08);
	border-color: var(--global-palette1);
}
.ag-card h3 { margin-top: 0; }
.ag-card a { text-decoration: none; }

/* ===== Адаптивность / запрет горизонтального переполнения ===== */
html, body { overflow-x: hidden; max-width: 100%; }
.entry-content h1,
.entry-content h2,
.entry-content h3 { overflow-wrap: break-word; }
.wp-block-buttons { flex-wrap: wrap; }

@media (max-width: 781px) {
	/* герой H1 (инлайн 46px) и заголовки секций — делаем флюидными */
	.single-content h1[style] { font-size: clamp(26px, 7.5vw, 40px) !important; line-height: 1.15 !important; }
	.single-content h2[style] { font-size: clamp(22px, 6vw, 30px) !important; }
	.single-content p[style*="font-size:19px"],
	.single-content p[style*="font-size:18px"] { font-size: 16px !important; }
	/* секции: меньше вертикального паддинга на мобиле */
	.single-content .wp-block-group.has-background { padding-left: 18px !important; padding-right: 18px !important; }
}

/* ===== Кастомный футер Arti Golden ===== */
.ag-footer { background: #15110c; color: #cdc8bf; }
.ag-footer-inner { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.ag-footer-grid {
	display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 44px;
	padding: 66px 0 50px;
}
.ag-footer-logo { width: 180px; height: auto; margin-bottom: 20px; display: block; }
.ag-footer-tagline { font-size: 14px; line-height: 1.6; color: #a39d93; margin: 0 0 22px; max-width: 280px; }
.ag-footer-title {
	color: #fff; font-size: 14px; font-weight: 700; margin: 0 0 18px;
	text-transform: uppercase; letter-spacing: .06em;
}
.ag-footer-links { list-style: none; margin: 0; padding: 0; }
.ag-footer-links li { margin-bottom: 11px; }
.ag-footer-links a { color: #cdc8bf; text-decoration: none; font-size: 15px; transition: color .15s ease; }
.ag-footer-links a:hover { color: #fd9408; }

.ag-footer-phone { display: inline-block; color: #fff; font-size: 21px; font-weight: 800; text-decoration: none; margin-bottom: 8px; }
.ag-footer-phone:hover { color: #fd9408; }
.ag-footer-addr { font-size: 14px; line-height: 1.5; color: #a39d93; margin: 0 0 20px; }
.ag-footer-tg {
	display: inline-flex; align-items: center; gap: 8px;
	background: #fd9408; color: #15110c; font-weight: 700; font-size: 15px;
	padding: 11px 22px; border-radius: var(--ag-radius-ctrl); text-decoration: none; transition: background .2s ease;
}
.ag-footer-tg:hover { background: #e98500; color: #15110c; }

.ag-socials { display: flex; gap: 11px; }
.ag-social {
	display: inline-flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; border-radius: 50%;
	background: rgba(255,255,255,.08); color: #cdc8bf;
	transition: background .2s ease, color .2s ease, transform .2s ease;
}
.ag-social svg { width: 19px; height: 19px; }
.ag-social:hover { background: #fd9408; color: #15110c; transform: translateY(-2px); }

.ag-footer-bottom { border-top: 1px solid rgba(255,255,255,.09); }
.ag-footer-bottom .ag-footer-inner {
	display: flex; justify-content: space-between; align-items: center;
	padding-top: 22px; padding-bottom: 22px; flex-wrap: wrap; gap: 8px;
}
.ag-footer-bottom span { font-size: 13px; color: #a39d93; } /* a11y: 6.9:1 на тёмном (было 4.7) */

@media (max-width: 900px) {
	.ag-footer-grid { grid-template-columns: 1fr 1fr; gap: 34px; padding: 50px 0 38px; }
}
@media (max-width: 560px) {
	.ag-footer-grid { grid-template-columns: 1fr; gap: 30px; }
	.ag-footer-bottom .ag-footer-inner { flex-direction: column; align-items: flex-start; }
}

/* ===== Страница «О нас»: секции ===== */
/* Почему мы — карточки */
.ag-why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--ag-gap); }
.ag-why-card { background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: var(--ag-pad-card); }
.ag-why-num { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #fff4e6; color: #fd9408; font-weight: 800; font-size: 18px; margin-bottom: 16px; }
.ag-why-card h3 { margin: 0 0 8px; font-size: 19px; color: var(--global-palette3); }
.ag-why-card p { margin: 0; font-size: 15px; color: #6b655c; line-height: 1.55; }

/* Портрет мастерской (после интро на «О нас») */
.ag-founder { background: var(--ag-cream); }
.ag-founder-inner { max-width: 1000px; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 48px; align-items: center; }
.ag-founder-photo img { width: 100%; height: auto; display: block; border-radius: var(--ag-radius); box-shadow: var(--ag-card-shadow-hover); }
.ag-founder-text .ag-eyebrow { margin-bottom: 14px; }
.ag-founder-h { font-family: var(--ag-display); font-weight: 600; font-size: clamp(26px, 3.6vw, 36px); line-height: 1.15; color: var(--global-palette3); margin: 0 0 16px; text-wrap: balance; }
.ag-founder-p { font-size: 17px; line-height: 1.7; color: var(--global-palette5); margin: 0; max-width: 48ch; }
.ag-founder-p + .ag-founder-p { margin-top: 14px; }
@media (max-width: 768px) {
	.ag-founder-inner { grid-template-columns: 1fr; gap: 24px; }
	.ag-founder-photo { max-width: 300px; margin: 0 auto; }
}

/* Контакты — карточки */
.ag-contacts-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ag-gap); }
.ag-contact-item { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: 20px 22px; text-decoration: none; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.ag-contact-item:hover { border-color: #fd9408; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0,0,0,.07); }
.ag-ci-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #fff4e6; color: #fd9408; flex: 0 0 auto; }
.ag-ci-ic svg { width: 22px; height: 22px; }
.ag-ci-tx { display: flex; flex-direction: column; line-height: 1.3; }
.ag-ci-l { font-size: 13px; color: #6b655c; } /* a11y: 5.8:1 (было 4.0) */
.ag-ci-v { font-size: 17px; font-weight: 700; color: var(--global-palette3); word-break: break-word; }

/* Форма обратного звонка (CF7) */
.wpcf7 .ag-field { margin: 0 0 14px; }
.wpcf7 input[type="text"], .wpcf7 input[type="tel"], .wpcf7 input[type="email"], .wpcf7 textarea {
	width: 100%; padding: 13px 16px; border: 1px solid var(--global-palette6); border-radius: 8px;
	font-size: 16px; font-family: inherit; background: #fff; color: var(--global-palette3); box-sizing: border-box;
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: none; border-color: #fd9408; box-shadow: 0 0 0 3px rgba(253,148,8,.15); }
.wpcf7 .ag-submit { margin: 6px 0 0; }
.wpcf7 input[type="submit"] { width: 100%; background: #fd9408; color: #15110c; font-weight: 700; font-size: 16px; border: 0; border-radius: 8px; padding: 14px 34px; cursor: pointer; transition: background .2s ease; }
.wpcf7 input[type="submit"]:hover { background: #e98500; }
.wpcf7 .wpcf7-not-valid-tip { color: #d33; font-size: 13px; margin-top: 4px; }
.wpcf7-response-output { border-radius: 8px; margin: 14px 0 0 !important; font-size: 14px; }

/* Карта + адрес + маршрут (внутри секции «Контакты») */
.ag-map { position: relative; width: 100%; margin: 38px auto 0; }
.ag-map-frame { line-height: 0; border-radius: var(--ag-radius); overflow: hidden; }
.ag-map-frame iframe { display: block; width: 100%; height: 460px; border: 0; }
.ag-map-card { position: absolute; top: 30px; left: 30px; z-index: 2; background: #15110c; color: #e8e2d6; border-radius: var(--ag-radius); padding: 28px 30px; max-width: 340px; box-shadow: 0 18px 40px rgba(0,0,0,.25); }
.ag-map-card h3 { margin: 0 0 14px; color: #fd9408; font-size: 22px; }
.ag-map-addr { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; margin: 0 0 20px; color: #fff; }
.ag-map-addr .ag-ci-ic { width: 34px; height: 34px; background: rgba(253,148,8,.15); }
.ag-map-addr .ag-ci-ic svg { width: 18px; height: 18px; }
.ag-map-route { display: inline-flex; background: #fd9408; color: #15110c; font-weight: 700; padding: 11px 22px; border-radius: var(--ag-radius-ctrl); text-decoration: none; transition: background .2s ease; }
.ag-map-route:hover { background: #e98500; color: #15110c; }

@media (max-width: 900px) {
	.ag-why-grid { grid-template-columns: repeat(2, 1fr); }
	.ag-contacts-list { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
}
@media (max-width: 600px) {
	.ag-why-grid { grid-template-columns: 1fr; }
	/* Карточка «Как нас найти» + карта = единый блок: скруглён верх карточки и низ карты */
	.ag-map-card { position: static; max-width: none; border-radius: 14px 14px 0 0; }
	.ag-map-frame { border-radius: 0 0 14px 14px; }
}

/* ===== Hero с фоновым видео (главная) ===== */
.ag-hero {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: 78vh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #15110c;
	padding: 90px 20px;
	box-sizing: border-box;
}
.ag-hero-media { position: absolute; inset: 0; z-index: 0; }
.ag-hero-poster,
.ag-hero-video {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; object-position: center;
}
.ag-hero-video { opacity: 0; transition: opacity .8s ease; }
.ag-hero-video.is-playing { opacity: 1; }
.ag-hero-overlay {
	position: absolute; inset: 0; z-index: 1;
	background: linear-gradient( to bottom, rgba(21,17,12,.70), rgba(21,17,12,.80) );
}
.ag-hero-content { position: relative; z-index: 2; max-width: 820px; text-align: center; color: #fff; }
.ag-hero-title { color: #fff; font-size: clamp(30px, 6vw, 48px); font-weight: 800; line-height: 1.12; margin: 0; }
.ag-hero-sub { color: #e8e2d6; font-size: clamp(16px, 2.4vw, 19px); line-height: 1.55; margin: 22px auto 0; max-width: 680px; }
.ag-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 34px; }
.ag-btn { display: inline-flex; align-items: center; justify-content: center; padding: 14px 30px; border-radius: var(--ag-radius-ctrl); font-weight: 700; font-size: 16px; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.ag-btn--primary { background: #fd9408; color: #15110c; }
.ag-btn--primary:hover { background: #e98500; color: #15110c; }
.ag-btn--ghost { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.55); }
.ag-btn--ghost:hover { border-color: #fd9408; color: #fd9408; }

@media (max-width: 600px) {
	.ag-hero { min-height: 68vh; padding: 66px 18px; }
	.ag-hero-actions { width: 100%; }
	.ag-hero-actions .ag-btn { width: 100%; }
}

/* ===== Страница «Обучение» ===== */
/* Hero внутренней страницы (картинка-постер + оверлей, без видео) */
.ag-hero--page { min-height: 52vh; background-image: url( '../img/hero-poster.jpg' ); background-size: cover; background-position: center; }

/* Универсальные секции (wp:html) */
.ag-section { width: 100vw; margin-left: calc( 50% - 50vw ); padding: var(--ag-section-y) 20px; box-sizing: border-box; }
.ag-section--dark { background: #15110c; color: #e8e2d6; }
.ag-section-inner { max-width: 1080px; margin: 0 auto; }
.ag-section-inner--narrow { max-width: 720px; }
.ag-section-inner--form { max-width: 560px; }
.ag-section-title { text-align: center; font-size: clamp( 26px, 5vw, 34px ); font-weight: 700; margin: 0 0 36px; color: var(--global-palette3); }
.ag-section-title--light { color: #fff; }
.ag-center { text-align: center; }
.ag-lead { font-size: 18px; line-height: 1.6; color: var(--global-palette5); margin: 0 auto 26px; max-width: 640px; }
.ag-lead--muted { color: #6b655c; }
.ag-section--dark .ag-lead { color: #cdc8bf; }

/* Программа — нумерованные модули */
.ag-program { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.ag-program-item { display: flex; gap: 22px; align-items: flex-start; background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: 24px 28px; }
.ag-program-num { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 10px; background: #fff4e6; color: #fd9408; font-weight: 800; font-size: 20px; display: flex; align-items: center; justify-content: center; }
.ag-program-text h3 { margin: 0 0 6px; font-size: 19px; color: var(--global-palette3); }
.ag-program-text p { margin: 0; color: #6b655c; font-size: 15px; line-height: 1.55; }

/* Что получите — чек-лист */
.ag-results { list-style: none; margin: 6px auto 0; padding: 0; max-width: 600px; display: flex; flex-direction: column; gap: 16px; }
.ag-result-item { display: flex; gap: 14px; align-items: center; font-size: 17px; color: #f0ece4; }
.ag-result-check { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: #fd9408; color: #15110c; display: flex; align-items: center; justify-content: center; }
.ag-result-check svg { width: 18px; height: 18px; }

/* Работы студентов — плейсхолдеры */
.ag-students-grid { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: var(--ag-gap); margin-top: 34px; }
.ag-student-card { aspect-ratio: 4 / 3; border-radius: var(--ag-radius); background: #ece7de; border: 1px dashed #cfc8ba; display: flex; align-items: center; justify-content: center; color: #6b655c; font-weight: 600; font-size: 15px; } /* a11y: 4.9:1 (было 1.9) */

/* Ghost-кнопка на светлом фоне */
.ag-btn--ghost-dark { background: transparent; color: var(--global-palette3); border: 2px solid #d8d2c6; }
.ag-btn--ghost-dark:hover { border-color: #fd9408; color: #fd9408; }

@media (max-width: 900px) {
	.ag-students-grid { grid-template-columns: repeat( 2, 1fr ); }
}
@media (max-width: 600px) {
	.ag-section { padding: 56px 18px; }
	.ag-students-grid { grid-template-columns: 1fr; }
	.ag-program-item { padding: 20px; gap: 16px; }
}

/* ===== Карточные блоки → слайдер на мобильных (без JS, scroll-snap) ===== */
@media (max-width: 768px) {
	.ag-why-grid,
	.ag-students-grid,
	.ag-program {
		display: flex;
		flex-direction: row;
		grid-template-columns: none;
		flex-wrap: nowrap;
		overflow-x: auto;
		/* overflow-x:auto по спецификации делает overflow-y=auto → контейнер скроллился
		   по вертикали и «прыгал». Запрещаем Y-скролл контейнера — этого ДОСТАТОЧНО:
		   вертикальный свайп естественно уходит странице (контейнеру некуда двигаться
		   по Y), горизонтальный листает карточки.
		   touch-action:pan-x НЕ ставим — он блокирует вертикальный жест на всём
		   поддереве и НЕ делегирует его странице (палец на карточке = страница не
		   скроллится). Именно это и был баг. */
		overflow-y: hidden;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		gap: 14px;
		/* лёгкий full-bleed: карточки доходят до края экрана, первая выровнена по контенту */
		margin-left: -18px;
		margin-right: -18px;
		padding: 4px 18px 24px;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.ag-why-grid::-webkit-scrollbar,
	.ag-students-grid::-webkit-scrollbar,
	.ag-program::-webkit-scrollbar { display: none; }
	.ag-why-grid > *,
	.ag-students-grid > *,
	.ag-program > * {
		flex: 0 0 80%;
		scroll-snap-align: start;
	}
	.ag-students-grid > * { flex-basis: 72%; }
	.ag-program > * { flex-basis: 86%; }
	/* В слайдере карточки не двигаем по Y (overflow-y:hidden обрезал бы при reveal) —
	   появление только через прозрачность. */
	.ag-why-grid > .ag-reveal, .ag-students-grid > .ag-reveal, .ag-program > .ag-reveal,
	.ag-svc-grid:not( .ag-svc-grid--4 ) > .ag-reveal { transform: none; }
}

/* ===== «Обучение»: Кому подойдёт (иконки) + Как проходит (сетка 2×2) ===== */
/* Кому подойдёт — карточки с иконками (слайдер на мобиле) */
.ag-who-grid { display: grid; grid-template-columns: repeat( 4, 1fr ); gap: var(--ag-gap); }
.ag-who-card { background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: var(--ag-pad-card); }
.ag-who-ic { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: var(--ag-radius); background: #fff4e6; color: #fd9408; margin-bottom: 16px; }
.ag-who-ic svg { width: 26px; height: 26px; }
.ag-who-card h3 { margin: 0 0 8px; font-size: 19px; color: var(--global-palette3); }
.ag-who-card p { margin: 0; font-size: 15px; color: #6b655c; line-height: 1.55; }

/* Как проходит — сетка с центрированными иконками (НЕ слайдер) */
.ag-feat-grid { display: grid; grid-template-columns: repeat( 4, 1fr ); gap: 22px; }
.ag-feat-item { text-align: center; padding: 6px; }
.ag-feat-ic { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: #fff4e6; color: #fd9408; margin-bottom: 16px; }
.ag-feat-ic svg { width: 30px; height: 30px; }
.ag-feat-item h4 { margin: 0 0 8px; font-size: 17px; color: var(--global-palette3); }
.ag-feat-item p { margin: 0; font-size: 14px; color: #6b655c; line-height: 1.5; }

@media (max-width: 900px) {
	.ag-who-grid { grid-template-columns: repeat( 2, 1fr ); }
	.ag-feat-grid { grid-template-columns: repeat( 2, 1fr ); }
}
@media (max-width: 480px) {
	.ag-feat-ic { width: 56px; height: 56px; }
}

/* Кому подойдёт — компактнее в узких 2×2 на мобиле (чтобы заголовки помещались) */
@media (max-width: 560px) {
	.ag-who-card { padding: 18px 15px; }
	.ag-who-ic { width: 46px; height: 46px; margin-bottom: 12px; }
	.ag-who-card h3 { font-size: 16px; }
}

/* ===== Хлебные крошки (под hero, прозрачный фон — нативно в теле страницы) ===== */
.ag-breadcrumbs { background: transparent; }
/* На «О нас» ниже идёт кремовая секция-портрет → крошки наследуют её фон и сливаются
   (на остальных страницах ниже белое, прозрачные крошки и так совпадают). */
.page-id-18 .ag-breadcrumbs,
.page-id-19 .ag-breadcrumbs,
.page-id-20 .ag-breadcrumbs { background: var(--ag-cream); }
/* Тёмное интро имеет margin-bottom:32px (block-gap WP) — прозрачный зазор давал
   белую полосу над кремовыми крошками. Убираем его именно у интро (блок прямо
   перед крошками) → кремовая зона вплотную к тёмному герою, без разрыва. */
.page-id-18 .wp-block-group.alignfull:has( + .ag-breadcrumbs ),
.page-id-19 .wp-block-group.alignfull:has( + .ag-breadcrumbs ),
.page-id-20 .wp-block-group.alignfull:has( + .ag-breadcrumbs ) { margin-bottom: 0; }
.ag-breadcrumbs-inner { max-width: 1160px; margin: 0 auto; padding: 24px 24px 0; font-size: 14px; color: #9a9385; }
.ag-breadcrumbs a { color: #6b655c; text-decoration: none; } /* a11y: ≥5.3:1 на белом и кремовом (было 3.6–4.0) */
.ag-breadcrumbs a:hover { color: #fd9408; }
.ag-breadcrumbs .breadcrumb_last { color: var(--global-palette3); font-weight: 600; }
@media (max-width: 600px) {
	.ag-breadcrumbs-inner { white-space: nowrap; overflow-x: auto; scrollbar-width: none; padding: 18px 18px 0; }
	.ag-breadcrumbs-inner::-webkit-scrollbar { display: none; }
}

/* ===== Хаб услуг ===== */
/* Карточки услуг (ссылки) */
.ag-svc-grid { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: var(--ag-gap); }
.ag-svc-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: 28px 26px; text-decoration: none; transition: border-color .2s, transform .2s, box-shadow .2s; }
.ag-svc-card:hover { border-color: #fd9408; transform: translateY( -3px ); box-shadow: 0 12px 28px rgba( 0,0,0,.07 ); }
.ag-svc-ic { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: var(--ag-radius); background: #fff4e6; color: #fd9408; margin-bottom: 16px; }
.ag-svc-ic svg { width: 28px; height: 28px; }
.ag-svc-card h3 { margin: 0 0 8px; font-size: 19px; color: var(--global-palette3); }
.ag-svc-card p { margin: 0 0 16px; font-size: 15px; color: #6b655c; line-height: 1.55; flex: 1; }
.ag-svc-more { color: #fd9408; font-weight: 700; font-size: 15px; }

/* Процесс — шаги (на тёмном) */
.ag-steps { display: grid; grid-template-columns: repeat( 5, 1fr ); gap: 22px; margin-top: 8px; }
.ag-step { text-align: center; }
.ag-step-num { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; margin: 0 auto 14px; border: 2px solid #fd9408; border-radius: 50%; color: #fd9408; font-weight: 800; font-size: 20px; }
.ag-step h4 { margin: 0 0 6px; font-size: 16px; color: #fff; }
.ag-step p { margin: 0; font-size: 13px; color: #cdc8bf; line-height: 1.5; }

/* До / После — заглушки */
.ag-ba-grid { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: var(--ag-gap); margin-top: 34px; }
.ag-ba-card { display: flex; aspect-ratio: 4 / 3; border-radius: var(--ag-radius); overflow: hidden; border: 1px solid #e2ddd3; }
.ag-ba-half { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ag-ba-before { background: #dcd6ca; color: #8a8275; }
.ag-ba-after { background: #f0ece3; color: #b3a98f; }

/* CTA — кнопки рядом с формой */
.ag-cta-actions { margin-top: 28px; text-align: center; }
.ag-cta-or { display: block; color: #6b655c; font-size: 14px; margin-bottom: 14px; }
.ag-cta-btns { display: grid; gap: 12px; justify-content: center; }
.ag-cta-btns .ag-btn { display: inline-flex; align-items: center; gap: 8px; }
.ag-cta-btns .ag-btn svg { width: 18px; height: 18px; }
.ag-btn--tg { background: #2aabee; color: #fff; }
.ag-btn--tg:hover { background: #2391c9; color: #fff; }

@media (max-width: 900px) {
	.ag-svc-grid { grid-template-columns: repeat( 2, 1fr ); }
	.ag-steps { grid-template-columns: repeat( 3, 1fr ); row-gap: 30px; }
	.ag-ba-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.ag-steps { grid-template-columns: repeat( 2, 1fr ); }
	.ag-ba-grid { grid-template-columns: 1fr; }
}

/* ===== Страница услуги ===== */
/* Что входит — чек-лист */
.ag-inc-h { text-align: center; font-weight: 700; color: var(--global-palette3); margin: 32px 0 0; font-size: 17px; }
.ag-inc-list { list-style: none; margin: 18px auto 0; padding: 0; max-width: 640px; display: grid; grid-template-columns: repeat( 2, 1fr ); gap: 14px 28px; }
.ag-inc-item { display: flex; gap: 11px; align-items: center; font-size: 15px; color: #3d3d3d; }
.ag-inc-check { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: #fff4e6; color: #fd9408; display: inline-flex; align-items: center; justify-content: center; }
.ag-inc-check svg { width: 13px; height: 13px; }

/* Кросс-ссылки «Другие услуги» — 4 в ряд */
.ag-svc-grid--4 { grid-template-columns: repeat( 4, 1fr ); }

@media (max-width: 900px) {
	.ag-svc-grid--4 { grid-template-columns: repeat( 2, 1fr ); }
}
@media (max-width: 560px) {
	.ag-inc-list { grid-template-columns: 1fr; max-width: 320px; }
}

/* ===== Главная: цифры, промо, отзывы ===== */
/* Цифры */
.ag-stats { display: grid; grid-template-columns: repeat( 4, 1fr ); gap: 24px; text-align: center; }
.ag-stat { display: flex; flex-direction: column; gap: 6px; }
.ag-stat-num { font-size: clamp( 32px, 5vw, 44px ); font-weight: 800; color: #fd9408; line-height: 1; }
.ag-stat-label { font-size: 14px; color: #cdc8bf; }

/* Промо обучения (баннер с постером) */
.ag-promo { position: relative; width: 100vw; margin-left: calc( 50% - 50vw ); background-size: cover; background-position: center; padding: var(--ag-section-y) 20px; }
.ag-promo-overlay { position: absolute; inset: 0; background: linear-gradient( rgba(21,17,12,.86), rgba(21,17,12,.8) ); }
.ag-promo-content { position: relative; z-index: 1; max-width: 640px; margin: 0 auto; text-align: center; }
.ag-promo-content h2 { color: #fff; font-size: clamp( 26px, 5vw, 34px ); margin: 0 0 14px; }
.ag-promo-content p { color: #e8e2d6; font-size: 17px; line-height: 1.6; margin: 0 0 26px; }

/* Отзывы */
.ag-reviews { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: 22px; margin-top: 36px; text-align: left; }
.ag-review { background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: 28px 26px; }
.ag-review-stars { display: flex; gap: 3px; color: #fd9408; margin-bottom: 14px; }
.ag-review-stars svg { width: 18px; height: 18px; }
.ag-review-text { margin: 0 0 16px; color: #3d3d3d; font-size: 15px; line-height: 1.6; }
.ag-review-name { font-weight: 700; color: var(--global-palette3); font-size: 15px; }

@media (max-width: 900px) {
	.ag-stats { grid-template-columns: repeat( 2, 1fr ); gap: 30px 24px; }
	.ag-reviews { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
}

/* ===== Галерея работ ===== */
.ag-gw-empty { text-align: center; color: #8a8275; padding: 40px 0; }
.ag-gw-filters { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 34px; }
.ag-gw-filter { background: #f0ece3; border: 0; color: #3d3d3d; font-weight: 600; font-size: 14px; padding: 9px 18px; border-radius: 30px; cursor: pointer; transition: background .2s, color .2s; font-family: inherit; }
.ag-gw-filter:hover { background: #e6e0d4; }
.ag-gw-filter.is-active { background: #fd9408; color: #15110c; }

.ag-gw-grid { columns: 3; column-gap: 16px; }
.ag-gw-item { break-inside: avoid; margin: 0 0 16px; }
.ag-gw-item.is-hidden { display: none; }
.ag-gw-link { display: block; position: relative; border-radius: var(--ag-radius); overflow: hidden; }
.ag-gw-link img { width: 100%; height: auto; display: block; transition: transform .4s ease; }
.ag-gw-link:hover img { transform: scale( 1.04 ); }
.ag-gw-zoom { position: absolute; inset: 0; background: rgba( 21,17,12,0 ); transition: background .25s; }
.ag-gw-link:hover .ag-gw-zoom { background: rgba( 21,17,12,.18 ); }
.ag-gw-zoom::after { content: ''; position: absolute; top: 50%; left: 50%; width: 46px; height: 46px; transform: translate(-50%,-50%) scale(.8); opacity: 0; transition: opacity .25s, transform .25s; background: rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110c' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") center / 22px no-repeat; border-radius: 50%; }
.ag-gw-link:hover .ag-gw-zoom::after { opacity: 1; transform: translate(-50%,-50%) scale(1); }

@media (max-width: 900px) { .ag-gw-grid { columns: 2; } }
@media (max-width: 560px) { .ag-gw-grid { columns: 1; } }

/* Лайтбокс */
.ag-lb { position: fixed; inset: 0; z-index: 9999; background: rgba(10,8,5,.92); display: none; align-items: center; justify-content: center; padding: 40px; }
.ag-lb.is-open { display: flex; }
.ag-lb-fig { margin: 0; max-width: 92vw; max-height: 90vh; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.ag-lb-img { max-width: 92vw; max-height: 82vh; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.ag-lb-cap { color: #e8e2d6; font-size: 14px; text-align: center; }
.ag-lb-close { position: absolute; top: 18px; right: 24px; background: none; border: 0; color: #fff; font-size: 40px; line-height: 1; cursor: pointer; opacity: .85; }
.ag-lb-close:hover { opacity: 1; }
.ag-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.12); border: 0; color: #fff; width: 52px; height: 52px; border-radius: 50%; font-size: 30px; line-height: 1; cursor: pointer; transition: background .2s; }
.ag-lb-nav:hover { background: rgba(255,255,255,.25); }
.ag-lb-prev { left: 18px; } .ag-lb-next { right: 18px; }
@media (max-width: 600px) { .ag-lb-nav { width: 42px; height: 42px; font-size: 24px; } .ag-lb { padding: 16px; } .ag-lb-close { top: 10px; right: 14px; } }

/* ===== Блог: листинг ===== */
.ag-posts { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: 26px; }
.ag-post-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); overflow: hidden; transition: box-shadow .2s, transform .2s; }
.ag-post-card:hover { transform: translateY( -3px ); box-shadow: 0 14px 30px rgba(0,0,0,.08); }
.ag-post-thumb { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #ece7de; }
.ag-post-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.ag-post-card:hover .ag-post-thumb img { transform: scale( 1.04 ); }
.ag-post-noimg { display: block; width: 100%; height: 100%; background: linear-gradient( 135deg, #2a2118, #15110c ); }
.ag-post-body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; }
.ag-post-date { font-size: 13px; color: #a39d93; margin-bottom: 8px; }
.ag-post-title { margin: 0 0 10px; font-size: 19px; line-height: 1.3; }
.ag-post-title a { color: var(--global-palette3); text-decoration: none; }
.ag-post-title a:hover { color: #fd9408; }
.ag-post-excerpt { margin: 0 0 16px; font-size: 15px; color: #6b655c; line-height: 1.55; flex: 1; }
.ag-post-more { color: #fd9408; font-weight: 700; font-size: 15px; text-decoration: none; }

@media (max-width: 900px) { .ag-posts { grid-template-columns: repeat( 2, 1fr ); } }
@media (max-width: 600px) { .ag-posts { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; } }

/* ===== Статья (single post) ===== */
.single-post .entry-content { max-width: 760px; margin-left: auto; margin-right: auto; font-size: 17px; line-height: 1.7; color: #3d3d3d; }
.single-post .entry-content h2 { font-size: clamp( 22px, 3.5vw, 28px ); margin: 1.6em 0 .5em; }
.single-post .entry-content p { margin: 0 0 1.1em; }
.single-post .entry-content a:not(.ag-btn) { color: #fd9408; }
.ag-article-cta { margin: 44px auto 8px; max-width: 760px; background: var(--ag-cream); border: 1px solid var(--global-palette6); border-radius: var(--ag-radius); padding: 30px 32px; text-align: center; }
.ag-article-cta p { margin: 0 0 18px; font-size: 18px; font-weight: 600; color: var(--global-palette3); }

/* ===== Блокировка скролла фона при открытом мобильном меню =====
   Kadence лочит body (overflow:hidden), но не <html> — а на мобиле скроллится html.
   Лочим и его, иначе фон продолжает прокручиваться под дровером. */
html:has( body.showing-popup-drawer-from-right ) { overflow: hidden; }
body.showing-popup-drawer-from-right { overflow: hidden; }

/* Карточки услуг → горизонтальный слайдер на мобильных (свайп, карточка ~80% + peek).
   Кросс-ссылки .ag-svc-grid--4 остаются сеткой. */
@media (max-width: 768px) {
	.ag-svc-grid:not( .ag-svc-grid--4 ) {
		display: flex;
		flex-direction: row;
		grid-template-columns: none;
		overflow-x: auto;
		/* overflow-x:auto по спецификации делает overflow-y=auto → контейнер скроллился
		   по вертикали и «прыгал». Запрещаем Y-скролл контейнера — этого ДОСТАТОЧНО:
		   вертикальный свайп естественно уходит странице (контейнеру некуда двигаться
		   по Y), горизонтальный листает карточки.
		   touch-action:pan-x НЕ ставим — он блокирует вертикальный жест на всём
		   поддереве и НЕ делегирует его странице (палец на карточке = страница не
		   скроллится). Именно это и был баг. */
		overflow-y: hidden;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		gap: 14px;
		margin-left: -18px;
		margin-right: -18px;
		padding: 4px 18px 24px;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.ag-svc-grid:not( .ag-svc-grid--4 )::-webkit-scrollbar { display: none; }
	.ag-svc-grid:not( .ag-svc-grid--4 ) > * { flex: 0 0 80%; scroll-snap-align: start; }
}

/* ===========================================================================
   «ОЖИВЛЕНИЕ» — глубина, материя, движение (поверх базовых стилей выше)
   Кожаная мастерская: тёплые нейтрали + физичные карточки + мягкое движение.
   Всё через CSS/JS-теги, без правок контента (DB). Легко откатить блоком.
   =========================================================================== */

/* --- Карточки: physical-объекты, а не контуры (тень в покое + богаче hover) --- */
.ag-card,
.ag-svc-card,
.ag-why-card,
.ag-who-card,
.ag-review,
.ag-program-item,
.ag-post-card,
.ag-contact-item {
	border-color: var(--ag-line);
	box-shadow: var(--ag-card-shadow);
	transition: transform .32s var(--ag-ease), box-shadow .32s var(--ag-ease), border-color .32s var(--ag-ease);
}
.ag-card:hover,
.ag-svc-card:hover,
.ag-why-card:hover,
.ag-who-card:hover,
.ag-review:hover,
.ag-program-item:hover,
.ag-post-card:hover,
.ag-contact-item:hover {
	transform: translateY(-5px);
	box-shadow: var(--ag-card-shadow-hover);
	border-color: rgba(253,148,8,.55);
}
/* Тонкий верхний штрих-акцент, проявляется на hover — «оживает» под курсором */
.ag-svc-card,
.ag-why-card,
.ag-who-card { position: relative; overflow: hidden; }
.ag-svc-card::before,
.ag-why-card::before,
.ag-who-card::before {
	content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
	background: linear-gradient(90deg, var(--ag-amber), #ffc27a);
	transform: scaleX(0); transform-origin: left;
	transition: transform .38s var(--ag-ease);
}
.ag-svc-card:hover::before,
.ag-why-card:hover::before,
.ag-who-card:hover::before { transform: scaleX(1); }

/* --- Иконочные плитки: из плоского персика в тёплый объём с кольцом --- */
.ag-svc-ic,
.ag-who-ic,
.ag-feat-ic,
.ag-why-num,
.ag-program-num,
.ag-ci-ic {
	background: linear-gradient(150deg, #fff6ea, #ffe6c6) !important;
	box-shadow: inset 0 0 0 1px rgba(253,148,8,.18), 0 6px 14px -8px rgba(253,148,8,.5);
	transition: transform .32s var(--ag-ease), box-shadow .32s var(--ag-ease);
}
.ag-svc-card:hover .ag-svc-ic,
.ag-who-card:hover .ag-who-ic,
.ag-why-card:hover .ag-why-num {
	transform: translateY(-2px) rotate(-3deg);
	box-shadow: inset 0 0 0 1px rgba(253,148,8,.28), 0 10px 20px -8px rgba(253,148,8,.6);
}

/* --- Тёплая тактильная «зернистость» на плоских тёмных секциях (без картинок).
   Hero НЕ трогаем: у него есть видео/постер, а grain снижал контраст текста. --- */
.ag-section--dark,
.ag-promo { position: relative; }
.ag-section--dark::after,
.ag-promo .ag-promo-overlay::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	opacity: .45; mix-blend-mode: soft-light;
	/* Два слоя = фактура кожи: мелкое зерно + крупная патина (мягкое смешивание) */
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23g)' opacity='.5'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='500' height='500'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.014' numOctaves='3' seed='7' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='500' height='500' filter='url(%23m)' opacity='.6'/%3E%3C/svg%3E");
	background-size: 140px 140px, 460px 460px;
	background-repeat: repeat, repeat;
}
.ag-section--dark > * { position: relative; z-index: 1; }
/* Тёплое амбровое свечение сверху тёмных секций — глубина */
.ag-section--dark::before {
	content: ""; position: absolute; inset: 0 0 auto 0; height: 220px; z-index: 0; pointer-events: none;
	background: radial-gradient(120% 100% at 50% 0, rgba(253,148,8,.10), transparent 70%);
}

/* --- Секционные «надзаголовки» (eyebrow) — ритм и типо-иерархия --- */
.ag-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
	color: var(--ag-amber); margin: 0 0 12px;
}
.ag-eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--ag-amber); border-radius: 2px; }
.ag-eyebrow--center { justify-content: center; }

/* --- Telegram-кнопка: убираем чужой циан, приводим к бренд-амбру --- */
.ag-btn--tg { background: var(--ag-amber); color: var(--ag-ink); }
.ag-btn--tg:hover { background: var(--global-palette2); color: var(--ag-ink); }

/* --- До/После: осмысленное сравнение (амбровый раздел + ручка), а не мёртвая заглушка.
   Реальные фото вставляются в .ag-ba-before/.ag-ba-after как background-image. --- */
.ag-ba-card {
	position: relative; border-color: var(--ag-line);
	box-shadow: var(--ag-card-shadow); background: #efe8dc;
}
.ag-ba-before { background: linear-gradient(135deg, #d7cfc0, #c9c0ae); color: #4f4a3e; position: relative; }
.ag-ba-after  { background: linear-gradient(135deg, #fff7ec, #f6ead6); color: #7a5c26; position: relative; }
/* Амбровая линия-разделитель + круглая «ручка» между половинами */
.ag-ba-card::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 2px;
	transform: translateX(-50%); background: var(--ag-amber); opacity: .9; z-index: 2;
}
.ag-ba-card::before {
	content: ""; position: absolute; top: 50%; left: 50%; width: 34px; height: 34px;
	transform: translate(-50%,-50%); border-radius: 50%; z-index: 3;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fd9408' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6 3 12l6 6'/%3E%3Cpath d='m15 6 6 6-6 6'/%3E%3C/svg%3E") center / 18px no-repeat;
	box-shadow: 0 4px 12px rgba(43,37,30,.28);
}
.ag-ba-half { position: relative; z-index: 1; }

/* ===========================================================================
   Движение: мягкое проявление при скролле (JS навешивает .ag-reveal + .is-in).
   Только трансформ/opacity → композитно и дёшево. Уважает reduced-motion.
   =========================================================================== */
.ag-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ag-ease), transform .7s var(--ag-ease); will-change: opacity, transform; }
.ag-reveal.is-in { opacity: 1; transform: none; }
/* Стаггер внутри группы (карточки в ряд появляются каскадом) */
.ag-reveal[data-ag-delay="1"] { transition-delay: .07s; }
.ag-reveal[data-ag-delay="2"] { transition-delay: .14s; }
.ag-reveal[data-ag-delay="3"] { transition-delay: .21s; }
.ag-reveal[data-ag-delay="4"] { transition-delay: .28s; }
.ag-reveal[data-ag-delay="5"] { transition-delay: .35s; }

/* Hero — вход контента при загрузке */
.ag-hero-content > * { opacity: 0; transform: translateY(20px); animation: ag-rise .9s var(--ag-ease) forwards; }
.ag-hero-title { animation-delay: .12s; }
.ag-hero-sub { animation-delay: .26s; }
.ag-hero-actions { animation-delay: .4s; }
@keyframes ag-rise { to { opacity: 1; transform: none; } }

/* Первичная кнопка — мягкий «дышащий» акцент, зовущий к действию */
.ag-btn--primary { box-shadow: 0 10px 26px -10px rgba(253,148,8,.75); }
.ag-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -12px rgba(253,148,8,.85); }

/* --- Типографика: аккуратные переносы, длинные RO/RU слова не ломают вёрстку --- */
.ag-hero-title,
.ag-section-title,
.ag-promo-content h2,
.ag-card h3,
.ag-svc-card h3,
.ag-why-card h3,
.ag-who-card h3,
.ag-post-title { text-wrap: balance; }
.ag-hero-sub,
.ag-lead,
.ag-svc-card p,
.ag-why-card p,
.ag-who-card p,
.ag-post-excerpt { text-wrap: pretty; }
.ag-card h3,
.ag-svc-card h3,
.ag-why-card h3,
.ag-who-card h3,
.ag-post-title,
.ag-hero-title,
.ag-section-title { overflow-wrap: break-word; }

/* ===========================================================================
   Reduced motion — полностью гасим анимации/появления для тех, кто их отключил.
   =========================================================================== */
@media (prefers-reduced-motion: reduce) {
	.ag-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	.ag-hero-content > * { animation: none !important; opacity: 1 !important; transform: none !important; }
	.ag-card, .ag-svc-card, .ag-why-card, .ag-who-card, .ag-review,
	.ag-program-item, .ag-post-card, .ag-contact-item,
	.ag-btn--primary { transition: none !important; }
}

/* ===========================================================================
   ТИПОГРАФИКА: дисплейная антиква для крупных заголовков.
   Playfair Display на H1/секционных H2 → «премиум-мастерская»; компонентные
   заголовки карточек (h3/h4) остаются Montserrat как UI-подписи (чистая иерархия).
   =========================================================================== */
.ag-hero-title,
.ag-section-title,
.ag-promo-content h2,
.single-post .entry-content h2,
.ag-article-cta p {
	font-family: var(--ag-display);
	letter-spacing: 0;               /* у Playfair свой ритм — убираем тректинг Montserrat */
	font-weight: 600;
}
.ag-hero-title { font-weight: 700; line-height: 1.08; }
.ag-section-title { line-height: 1.12; }

/* ===========================================================================
   ДОСТУПНОСТЬ (a11y).
   1) Контраст: амбр-текст на светлом фоне → тёмный амбр (var(--ag-amber-text)).
      Яркий амбр остаётся для заливок, иконок и текста на ТЁМНЫХ секциях.
   2) Видимый фокус для клавиатурной навигации.
   =========================================================================== */
a { color: var(--ag-amber-text); }
.ag-svc-more,
.ag-post-more,
.single-post .entry-content a:not(.ag-btn) { color: var(--ag-amber-text); }
.ag-eyebrow { color: var(--ag-amber-text); }

/* На тёмных фонах контраст яркого амбра и так высокий — возвращаем его.
   ВАЖНО: НЕ трогаем кнопки/иконки-ссылки (.ag-footer-tg, .ag-social, .ag-map-route,
   .ag-btn) — у них амбровый ФОН и тёмный текст; красить их текст в амбр = амбр-на-амбре.
   Поэтому целимся только в текстовые ссылки, а не в «.ag-footer a» целиком. */
.ag-section--dark a:not(.ag-btn):not(.ag-map-route),
.ag-promo a:not(.ag-btn),
.ag-footer-phone:hover,
.ag-footer-links a:hover { color: var(--ag-amber); }

/* Клавиатурный фокус (не мешает мыши — только :focus-visible) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.ag-btn:focus-visible,
.wp-block-button__link:focus-visible,
.ag-gw-filter:focus-visible,
.ag-lang-toggle:focus-visible {
	outline: 2px solid var(--ag-amber-text);
	outline-offset: 2px;
	border-radius: 2px;
}
/* На тёмных секциях фокус-обводку делаем яркой (видна на тёмном) */
.ag-section--dark a:focus-visible,
.ag-promo a:focus-visible,
.ag-footer a:focus-visible,
.ag-hero a:focus-visible,
.ag-btn:focus-visible { outline-color: var(--ag-amber); }

/* ===========================================================================
   ВЫДЕЛЕНИЕ ТЕКСТА (::selection).
   Кастомного правила не было → бралась системная подсветка macOS (у пользователя
   могла быть оранжевой) и убивала контраст на амбровых элементах.
   Задаём единый бренд-хайлайт: амбр + тёмный текст — читаемо на светлом И тёмном.
   =========================================================================== */
/* ВАЖНО: хардкод-цвета, БЕЗ var() — переменные внутри ::selection в ряде версий
   Chrome не резолвятся и правило выбрасывается целиком (тогда берётся системная
   подсветка и рушит контраст на амбровых элементах). */
::selection      { background: #fd9408; color: #15110c; text-shadow: none; }
::-moz-selection { background: #fd9408; color: #15110c; text-shadow: none; }

/* Иконки соцсетей: гасим заливку выделения, иначе подсветка закрашивает кружок
   и глиф пропадает (user-select:none это не предотвращает при сквозном выделении). */
.ag-social::selection,      .ag-social *::selection      { background: transparent; }
.ag-social::-moz-selection, .ag-social *::-moz-selection { background: transparent; }

/* Кнопки и иконки-ссылки — это управляющие элементы, а не «текст для копирования».
   Исключаем их из выделения, чтобы подсветка не заливала их и не делала нечитаемыми. */
.ag-btn,
.wp-block-button__link,
.button,
input[type="submit"],
.ag-footer-tg,
.ag-map-route,
.ag-social,
.ag-gw-filter,
.ag-lang-toggle,
.ag-svc-more,
.ag-post-more {
	-webkit-user-select: none;
	user-select: none;
}

/* ===========================================================================
   МИКРО-ВЗАИМОДЕЙСТВИЯ — тактильность и единый тайминг (сдержанно).
   =========================================================================== */
/* Единый transition для кнопок + тактильный «нажим» на :active */
.ag-btn, .wp-block-button__link, .button, input[type="submit"],
.ag-footer-tg, .ag-map-route {
	transition: background-color .2s var(--ag-ease), color .2s var(--ag-ease),
	            border-color .2s var(--ag-ease), transform .12s var(--ag-ease),
	            box-shadow .2s var(--ag-ease);
}
.ag-btn:active, .wp-block-button__link:active, .button:active,
input[type="submit"]:active, .ag-footer-tg:active, .ag-map-route:active,
.ag-gw-filter:active { transform: translateY(1px) scale(.985); }

/* Ссылка-стрелка «Detalii →» / «Читать →» едет вправо при наведении на карточку */
.ag-svc-more, .ag-post-more { display: inline-block; transition: transform .25s var(--ag-ease); }
.ag-svc-card:hover .ag-svc-more,
.ag-post-card:hover .ag-post-more { transform: translateX(4px); }

@media (prefers-reduced-motion: reduce) {
	.ag-svc-more, .ag-post-more { transition: none !important; transform: none !important; }
	.ag-btn:active, .wp-block-button__link:active, .ag-footer-tg:active,
	.ag-map-route:active, .ag-gw-filter:active { transform: none !important; }
}

/* ===========================================================================
   ШАПКИ ВНУТРЕННИХ СТРАНИЦ — своя фотография на каждый раздел.
   Ключ раздела приходит классом body .ag-hero-key--* (см. functions.php,
   artigolden_hero_key), поэтому работает для всех языков без правок БД.
   Файлы: assets/img/hero/hero-<key>.jpg (1920×1080) и hero-<key>-m.jpg (900×1200).
   =========================================================================== */
.ag-hero-key--services .ag-hero--page { background-image: url('../img/hero/hero-services.jpg'); }
.ag-hero-key--auto .ag-hero--page { background-image: url('../img/hero/hero-auto.jpg'); }
.ag-hero-key--furniture .ag-hero--page { background-image: url('../img/hero/hero-furniture.jpg'); }
.ag-hero-key--bags .ag-hero--page { background-image: url('../img/hero/hero-bags.jpg'); }
.ag-hero-key--dyeing .ag-hero--page { background-image: url('../img/hero/hero-dyeing.jpg'); }
.ag-hero-key--marine .ag-hero--page { background-image: url('../img/hero/hero-marine.jpg'); }
.ag-hero-key--training .ag-hero--page { background-image: url('../img/hero/hero-training.jpg'); }
.ag-hero-key--gallery .ag-hero--page { background-image: url('../img/hero/hero-gallery.jpg'); }
.ag-hero-key--blog .ag-hero--page { background-image: url('../img/hero/hero-blog.jpg'); }
.ag-hero-key--brands .ag-hero--page { background-image: url('../img/hero/hero-brands.jpg'); }
@media (max-width: 600px) {
	.ag-hero-key--services .ag-hero--page { background-image: url('../img/hero/hero-services-m.jpg'); }
	.ag-hero-key--auto .ag-hero--page { background-image: url('../img/hero/hero-auto-m.jpg'); }
	.ag-hero-key--furniture .ag-hero--page { background-image: url('../img/hero/hero-furniture-m.jpg'); }
	.ag-hero-key--bags .ag-hero--page { background-image: url('../img/hero/hero-bags-m.jpg'); }
	.ag-hero-key--dyeing .ag-hero--page { background-image: url('../img/hero/hero-dyeing-m.jpg'); }
	.ag-hero-key--marine .ag-hero--page { background-image: url('../img/hero/hero-marine-m.jpg'); }
	.ag-hero-key--training .ag-hero--page { background-image: url('../img/hero/hero-training-m.jpg'); }
	.ag-hero-key--gallery .ag-hero--page { background-image: url('../img/hero/hero-gallery-m.jpg'); }
	.ag-hero-key--blog .ag-hero--page { background-image: url('../img/hero/hero-blog-m.jpg'); }
	.ag-hero-key--brands .ag-hero--page { background-image: url('../img/hero/hero-brands-m.jpg'); }
}
/* С реальным фото затемнение чуть легче, чем на размытом постере: фото читается, контраст текста сохраняется */
.ag-hero--page .ag-hero-overlay { background: linear-gradient( to bottom, rgba(21,17,12,.62), rgba(21,17,12,.74) ); }

/* ===========================================================================
   ЧИТАЕМОСТЬ ТЕКСТА НА ФОТО-ШАПКАХ.
   1) Радиальное затемнение под блоком текста (поверх общего градиента):
      фото по краям читается, а под заголовком/подзаголовком фон ровнее и темнее.
   2) Мягкая тень у текста — отделяет буквы от фактуры/деталей фото.
   3) Подзаголовок чуть плотнее (500) и светлее — тонкий 400 на фото «рассыпается».
   =========================================================================== */
.ag-hero--page .ag-hero-overlay {
	background:
		radial-gradient( ellipse 62% 78% at 50% 52%, rgba(21,17,12,.58), rgba(21,17,12,0) 72% ),
		linear-gradient( to bottom, rgba(21,17,12,.62), rgba(21,17,12,.74) );
}
.ag-hero-title { text-shadow: 0 1px 2px rgba(0,0,0,.45), 0 10px 30px rgba(0,0,0,.35); }
.ag-hero-sub   { color: #f2ede4; font-weight: 500; text-shadow: 0 1px 2px rgba(0,0,0,.5), 0 6px 20px rgba(0,0,0,.35); }
@media (max-width: 600px) {
	/* На мобилке текст занимает почти всю ширину — расширяем тёмное пятно */
	.ag-hero--page .ag-hero-overlay {
		background:
			radial-gradient( ellipse 90% 70% at 50% 50%, rgba(21,17,12,.6), rgba(21,17,12,0) 75% ),
			linear-gradient( to bottom, rgba(21,17,12,.66), rgba(21,17,12,.78) );
	}
}

/* ===========================================================================
   КАРТОЧКИ УСЛУГ С ФОТО (хаб услуг и главная; фото подставляет functions.php).
   Фото сверху, текст на белом — читаемость как у обычной карточки.
   Иконка «сидит» на стыке фото и текста. Ховер: мягкое приближение фото.
   =========================================================================== */
.ag-svc-card--ph { padding: 0; overflow: hidden; }
.ag-svc-card--ph .ag-svc-ph { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #efe8dc; }
.ag-svc-card--ph .ag-svc-ph img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ag-ease); }
.ag-svc-card--ph:hover .ag-svc-ph img { transform: scale(1.05); }
.ag-svc-card--ph .ag-svc-body { display: flex; flex-direction: column; flex: 1; position: relative; padding: 22px 26px 26px; }
.ag-svc-card--ph .ag-svc-ic {
	position: absolute; top: -27px; left: 26px; margin: 0;
	background: #fff !important;
	box-shadow: 0 6px 16px rgba(43,37,30,.18), inset 0 0 0 1px rgba(253,148,8,.22);
}
.ag-svc-card--ph h3 { margin-top: 28px; }
.ag-svc-card--ph::before { z-index: 2; } /* амбровый штрих на ховере — поверх фото */
@media (prefers-reduced-motion: reduce) {
	.ag-svc-card--ph .ag-svc-ph img { transition: none !important; transform: none !important; }
}

/* ===========================================================================
   РИТМ СЕКЦИЙ (правки по мобильному ревью хаба услуг).
   =========================================================================== */
/* 1) Белая полоса между цветным wp:group и полноширинной секцией: у группы
      block-gap WP 32px, а фон у неё не тянется на margin → прозрачный зазор.
      Убираем отступ у группы, если сразу за ней идёт наша секция. */
.wp-block-group.alignfull.has-background:has( + .ag-section ),
.wp-block-group.alignfull.has-background:has( + .ag-promo ) { margin-bottom: 0; }
/* 2) Заголовок секции → содержимое. Kadence (.entry-content h2) сжимает
      margin-bottom до .5em (13–17px) и перебивает .ag-section-title.
      Лид под заголовком пусть остаётся близко, а сетки/списки — на воздухе. */
.entry-content .ag-section-title:not( :has( + .ag-lead ) ) { margin-bottom: 34px; }
.entry-content .ag-section-title:has( + .ag-lead ) { margin-bottom: 14px; }
@media (max-width: 600px) {
	.entry-content .ag-section-title:not( :has( + .ag-lead ) ) { margin-bottom: 28px; }
}
/* 3) «Как мы работаем»: 6 шагов (шестой добавляет functions.php). На десктопе —
      один ряд из 6; планшет 3×2 и мобилка 2×3 берут общие правила .ag-steps. */
@media (min-width: 901px) {
	.ag-steps.ag-steps--6 { grid-template-columns: repeat( 6, 1fr ); gap: 18px; }
}

/* Сноска разработчика в нижней строке футера — намеренно неброская:
   тот же кегль, чуть приглушённее (контраст ≥4.5:1), ссылка без подчёркивания. */
.ag-footer-dev { color: #8a847a; }
.ag-footer-dev-sep { margin: 0 8px; opacity: .6; }
.ag-footer-dev a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(138,132,122,.35); }
.ag-footer-dev a:hover { color: #fd9408; border-bottom-color: currentColor; }
@media (max-width: 560px) {
	.ag-footer-dev { display: block; margin-top: 4px; }
	.ag-footer-dev-sep { display: none; }
}

/* ===== Отзывы Google на главной (подменяет заглушки из БД, см. functions.php) ===== */
.ag-review { display: flex; flex-direction: column; }
.ag-review-text { flex: 1; }
.ag-review-src { display: block; margin-top: 2px; font-size: 12px; color: #8a847a; }
.entry-content .ag-reviews-google,
.ag-reviews-google {
	display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 14px;
	margin: 34px 0 0; font-size: 15px; color: #6b655c; /* .entry-content p Kadence перебивал margin — специфичность выше */
}
.ag-reviews-google-star { display: inline-flex; color: #fd9408; }
.ag-reviews-google-star svg { width: 18px; height: 18px; }
.ag-reviews-google strong { color: var(--ag-ink); font-weight: 700; }
.ag-reviews-google a { color: var(--ag-amber-text); font-weight: 700; text-decoration: none; }
.ag-reviews-google a:hover { color: #fd9408; }

/* ===========================================================================
   СТИКИ-ШАПКА (своя, см. header.js): #masthead прилипает к верху, при
   прокрутке вниз уезжает (translateY), при прокрутке вверх возвращается.
   overflow-x: clip вместо hidden на html/body — hidden делает body
   скролл-контейнером и ломает position: sticky.
   =========================================================================== */
html, body { overflow-x: clip; }
#masthead {
	position: sticky; top: 0; z-index: 1000;
	background: #fff;
	transition: transform .22s ease-out, box-shadow .22s ease-out;
}
body.admin-bar #masthead { top: 32px; }
@media (max-width: 782px) { body.admin-bar #masthead { top: 46px; } }
body.ag-hdr-stuck #masthead { box-shadow: 0 6px 24px -12px rgba(21,17,12,.35); }
body.ag-hdr-hidden #masthead { transform: translateY(-100%); box-shadow: none; }
@media (prefers-reduced-motion: reduce) { #masthead { transition: none; } }

/* Автор отзыва: аватар (фото или инициалы) + имя и источник в две строки */
.ag-review-author { display: flex; align-items: center; gap: 12px; }
.ag-review-meta { display: flex; flex-direction: column; }
.ag-review-avatar {
	flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; object-fit: cover;
	box-shadow: inset 0 0 0 1px rgba(253,148,8,.25);
}
.ag-review-avatar--initials {
	display: inline-flex; align-items: center; justify-content: center;
	background: linear-gradient(150deg, #fff6ea, #ffe6c6); color: var(--ag-amber-text);
	font-weight: 700; font-size: 16px; letter-spacing: .02em;
}

/* ===== Формы CF7: заметные поля. Рамка и плейсхолдер были цвета #e7ded0 (контраст 1,2:1) ===== */
.wpcf7 input[type="text"], .wpcf7 input[type="tel"], .wpcf7 input[type="email"], .wpcf7 textarea {
	border: 1.5px solid #bdb3a1;                     /* 2,3:1 к белому — видна на любом фоне секции */
	box-shadow: inset 0 1px 2px rgba(43,37,30,.06);  /* лёгкая глубина, поле читается как поле */
	transition: border-color .2s ease, box-shadow .2s ease;
}
.wpcf7 input[type="text"]:hover, .wpcf7 input[type="tel"]:hover, .wpcf7 input[type="email"]:hover, .wpcf7 textarea:hover { border-color: #a89d88; }
.wpcf7 input::placeholder, .wpcf7 textarea::placeholder { color: #7d766c; opacity: 1; } /* 4,2:1 — читается, но отличим от введённого текста */
.wpcf7 input:focus, .wpcf7 textarea:focus { border-color: #fd9408; box-shadow: 0 0 0 3px rgba(253,148,8,.18); }

/* ===========================================================================
   БЛОГ: статья (single.php), автор (author.php), карточки.
   Две колонки: статья 1fr + сайдбар 320px; обложка внутри колонки,
   под ней рубрика → заголовок → мета (как в референсах клиента).
   =========================================================================== */
body.single-post, body.author { background: #fff; }
.ag-article-area .content-container.site-container, .ag-author-area .content-container.site-container { max-width: 1220px; }
.ag-article-area.content-area { margin-top: 0; }
.ag-article { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; align-items: start; padding: 36px 0 56px; }
.ag-article-main { min-width: 0; }
.ag-breadcrumbs--post .ag-breadcrumbs-inner { padding: 0 0 16px; max-width: none; margin: 0; }
/* Обложка: в колонке, 16:9, скругление */
.ag-entry-cover img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--ag-radius); }
/* Заголовок и мета под обложкой */
.ag-entry-header { margin: 26px 0 28px; }
.ag-entry-header .ag-post-cat { margin-bottom: 12px; text-decoration: none; }
.ag-entry-title { font-size: clamp(28px, 3.2vw, 38px); line-height: 1.18; font-weight: 800; color: var(--ag-ink); margin: 0 0 12px; letter-spacing: -.01em; }
.ag-entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; font-size: 14px; color: #6b655c; }
.ag-entry-meta > * + *::before { content: "·"; margin: 0 8px; color: #b3ab9e; }
.ag-entry-meta-author { font-weight: 700; color: var(--ag-ink); text-decoration: none; }
.ag-entry-meta-author:hover { color: var(--ag-amber-text); }
.ag-entry-content { margin: 0; max-width: none; }
.ag-entry-content > *:first-child { margin-top: 0; }
/* Карточки: метка рубрики + время чтения */
.ag-post-meta { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 13px; color: #7d766c; }
.ag-post-cat { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #fff4e6; color: var(--ag-amber-text); font-weight: 700; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
/* «Поделиться» */
.ag-share { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 34px 0 0; padding-top: 22px; border-top: 1px solid var(--ag-line); }
.ag-share-label { font-size: 14px; font-weight: 700; color: var(--ag-ink); margin-right: 4px; }
.ag-share-btn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--ag-line); background: #fff; color: var(--ag-ink); font-size: 14px; font-weight: 600; text-decoration: none; transition: border-color .2s ease, color .2s ease, transform .2s ease; }
.ag-share-btn svg { width: 18px; height: 18px; color: var(--ag-amber-text); }
.ag-share-btn:hover { border-color: #fd9408; color: var(--ag-amber-text); transform: translateY(-1px); }
/* Об авторе (в конце статьи) */
.ag-author { display: flex; gap: 22px; align-items: flex-start; margin: 30px 0 0; padding: 26px; background: var(--ag-cream); border-radius: var(--ag-radius); }
.ag-author-avatar { flex: 0 0 88px; width: 88px; } /* flex-item иначе сжимался длинным именем/био → овал */
.ag-author-avatar img { display: block; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px #fff, 0 0 0 4px rgba(253,148,8,.35); }
.ag-author-body { min-width: 0; }
.ag-author-name { display: inline-block; font-weight: 800; font-size: 18px; color: var(--ag-ink); text-decoration: none; }
.ag-author-name:hover { color: var(--ag-amber-text); }
.ag-author-role { display: block; font-size: 13px; color: var(--ag-amber-text); font-weight: 700; margin: 2px 0 10px; }
.ag-author-bio { margin: 0 0 12px; font-size: 15px; line-height: 1.6; color: #574f45; }
.ag-author-all { font-weight: 700; font-size: 14px; color: var(--ag-amber-text); text-decoration: none; }
.ag-author-all:hover { color: #fd9408; }
/* «Читайте также» */
.ag-related { margin-top: 44px; }
.ag-related-title { font-family: var(--ag-display); font-size: 26px; font-weight: 600; margin: 0 0 20px; color: var(--ag-ink); }
.ag-posts--2 { grid-template-columns: repeat( 2, 1fr ); }
/* Сайдбар */
.ag-sidebar { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 28px; }
.ag-side-cta { background: var(--ag-ink); color: #e8e2d6; border-radius: var(--ag-radius); padding: 26px 24px; }
.ag-side-cta h3 { margin: 0 0 8px; color: #fff; font-size: 20px; }
.ag-side-cta p { margin: 0 0 18px; font-size: 14px; line-height: 1.55; color: #cdc8bf; }
.ag-side-cta .ag-btn { width: 100%; box-sizing: border-box; }
.ag-side-phone { display: block; margin-top: 12px; text-align: center; color: #fff; font-weight: 700; text-decoration: none; }
.ag-side-phone:hover { color: #fd9408; }
.ag-side-block { border: 1px solid var(--ag-line); border-radius: var(--ag-radius); padding: 22px 22px 8px; }
.ag-side-title { margin: 0 0 14px; font-size: 16px; font-weight: 800; color: var(--ag-ink); }
.ag-side-posts, .ag-side-cats { list-style: none; margin: 0; padding: 0; }
.ag-side-posts li { border-top: 1px solid var(--ag-line); }
.ag-side-posts li:first-child { border-top: 0; }
.ag-side-posts a { display: flex; gap: 12px; align-items: center; padding: 12px 0; text-decoration: none; color: var(--ag-ink); }
.ag-side-thumb { flex: 0 0 72px; width: 72px; height: 54px; border-radius: 8px; overflow: hidden; background: #efe8dc; }
.ag-side-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ag-side-post-title { display: block; font-size: 14px; font-weight: 700; line-height: 1.35; }
.ag-side-posts a:hover .ag-side-post-title { color: var(--ag-amber-text); }
.ag-side-post-meta { display: block; font-size: 12px; color: #7d766c; margin-top: 3px; }
.ag-side-cats a { display: flex; justify-content: space-between; padding: 9px 0; border-top: 1px solid var(--ag-line); color: var(--ag-ink); font-size: 15px; text-decoration: none; }
.ag-side-cats li:first-child a { border-top: 0; }
.ag-side-cats a span { color: #7d766c; font-size: 13px; }
.ag-side-cats a:hover { color: var(--ag-amber-text); }
/* Страница автора */
.ag-author-area.content-area { padding-top: 0; margin-top: 0; } /* Kadence даёт #primary margin-top 80px — между шапкой и кремовым блоком была белая полоса */
.ag-author-area .ag-author-hero { margin-top: 0; }
.ag-author-hero { background: var(--ag-cream); padding: 28px 0 40px; }
.ag-author-card { display: flex; gap: 32px; align-items: center; }
.ag-author-card-avatar { flex: 0 0 140px; width: 140px; }
.ag-author-card-avatar img { display: block; width: 140px; height: 140px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(253,148,8,.35); }
.ag-author-card-name { margin: 0 0 4px; font-size: clamp(26px, 3vw, 34px); font-weight: 800; color: var(--ag-ink); }
.ag-author-card-role { margin: 0 0 12px; color: var(--ag-amber-text); font-weight: 700; }
.ag-author-card-bio { margin: 0 0 12px; max-width: 640px; font-size: 16px; line-height: 1.6; color: #574f45; }
.ag-author-card-stat { margin: 0; font-size: 14px; color: #6b655c; }
.ag-author-card-stat strong { color: var(--ag-ink); font-size: 18px; }
.ag-author-main { padding: 44px 0 56px; }
.ag-author-list-title { text-align: left; font-size: 26px; margin-bottom: 22px; }
@media (max-width: 1024px) {
	.ag-article { grid-template-columns: minmax(0, 1fr) 280px; gap: 36px; }
}
@media (max-width: 860px) {
	.ag-article { grid-template-columns: 1fr; gap: 40px; padding-top: 16px; }
	.ag-sidebar { position: static; }
	.ag-entry-cover img { border-radius: 10px; }
}
@media (max-width: 600px) {
	.ag-posts--2 { grid-template-columns: 1fr; }
	.ag-author { flex-direction: column; gap: 14px; padding: 20px; }
	.ag-author-card { flex-direction: column; align-items: flex-start; gap: 18px; }
	.ag-author-card-avatar img { width: 110px; height: 110px; }
}
.single-post .post-navigation, .single-post .entry-related { display: none; }

/* ===========================================================================
   СТРАНИЦА «БРЕНДЫ И МАТЕРИАЛЫ» (контент из functions.php) + ссылка из карточки «Премиум-материалы»
   =========================================================================== */
.ag-brands-lead { max-width: 760px; margin-left: auto; margin-right: auto; text-align: center; }
.ag-brand-grid { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: var(--ag-gap); margin-top: 36px; }
.ag-brand { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--ag-line); border-radius: var(--ag-radius); padding: 28px 26px; box-shadow: var(--ag-card-shadow); }
.ag-brand-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ag-brand-name { font-family: var(--ag-display); font-size: 26px; font-weight: 600; margin: 0; color: var(--ag-ink); }
.ag-brand-country { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #7d766c; }
.ag-brand-tag { margin: 6px 0 14px; font-size: 13px; font-weight: 700; color: var(--ag-amber-text); }
.ag-brand-text { margin: 0 0 16px; font-size: 15px; line-height: 1.6; color: #574f45; }
.ag-brand-use-t { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #7d766c; }
.ag-brand-use { list-style: none; margin: 0 0 22px; padding: 0; flex: 1; }
.ag-brand-use li { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; font-size: 14px; line-height: 1.5; color: var(--ag-ink); }
.ag-brand-use svg { flex: 0 0 16px; width: 16px; height: 16px; margin-top: 3px; color: #fd9408; }
.ag-brand-links { display: flex; flex-wrap: wrap; gap: 10px; }
.ag-brand-links .ag-btn { padding: 11px 18px; font-size: 14px; }
.ag-brand-links--center { justify-content: center; margin-top: 8px; }
.ag-btn--outline { background: #fff; color: var(--ag-ink); border: 1.5px solid var(--ag-line); }
.ag-btn--outline:hover { border-color: #fd9408; color: var(--ag-amber-text); }
.ag-brands-shop p { color: #cdc8bf; font-size: 16px; line-height: 1.65; margin: 0 0 20px; }
.ag-brands-two { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.ag-brands-h { text-align: left; font-size: 26px; margin-bottom: 12px; }
.ag-feat-more { display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--ag-amber-text); text-decoration: none; }
.ag-feat-more:hover { color: #fd9408; }
@media (max-width: 900px) { .ag-brand-grid { grid-template-columns: 1fr 1fr; } .ag-brands-two { grid-template-columns: 1fr; gap: 32px; } }
@media (max-width: 600px) { .ag-brand-grid { grid-template-columns: 1fr; } }

/* Футер: внешняя ссылка на магазин kcx.md — второй проект (домен выделен амбром, стрелка «наружу») */
.ag-footer-links .ag-footer-ext { white-space: nowrap; }
.ag-footer-links .ag-footer-ext .ag-footer-ext-domain { color: #fd9408; font-weight: 700; margin-left: 6px; }
.ag-footer-links .ag-footer-ext .ag-footer-ext-domain::after { content: "\2197"; font-size: 12px; margin-left: 3px; }
.ag-footer-links .ag-footer-ext:hover .ag-footer-ext-domain { text-decoration: underline; }

/* ===========================================================================
   «ДО И ПОСЛЕ» — живой слайдер (assets/js/ba.js; разметку даёт functions.php)
   =========================================================================== */
.ag-ba-grid--live .ag-ba-item { margin: 0; }
.ag-ba { position: relative; aspect-ratio: 4 / 3; border-radius: var(--ag-radius); overflow: hidden;
	--ag-ba-pos: 50%; touch-action: pan-y; cursor: ew-resize; user-select: none; -webkit-user-select: none;
	background: #efe8dc; box-shadow: var(--ag-card-shadow); }
.ag-ba-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.ag-ba-before-wrap { position: absolute; inset: 0; width: var(--ag-ba-pos); overflow: hidden; }
.ag-ba-before-wrap .ag-ba-img { width: auto; height: 100%; aspect-ratio: 4 / 3; max-width: none; } /* фиксированная ширина = ширина контейнера → фото не сжимается при движении */
.ag-ba-label { position: absolute; top: 12px; z-index: 2; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: rgba(21,17,12,.55); backdrop-filter: blur(4px); pointer-events: none; }
.ag-ba-label--before { left: 12px; }
.ag-ba-label--after { right: 12px; }
.ag-ba-handle { position: absolute; top: 0; bottom: 0; left: var(--ag-ba-pos); width: 2px; margin-left: -1px; background: #fff; z-index: 3; pointer-events: none; box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
.ag-ba-handle span { position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; transform: translate(-50%,-50%); border-radius: 50%;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fd9408' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6 3 12l6 6'/%3E%3Cpath d='m15 6 6 6-6 6'/%3E%3C/svg%3E") center / 20px no-repeat;
	box-shadow: 0 4px 14px rgba(43,37,30,.35); transition: transform .15s ease; }
.ag-ba.is-dragging .ag-ba-handle span { transform: translate(-50%,-50%) scale(1.08); }
.ag-ba-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; z-index: 4; }
.ag-ba-range:focus-visible + * , .ag-ba:has(.ag-ba-range:focus-visible) { outline: 3px solid var(--ag-amber); outline-offset: 2px; }
.ag-ba-cap { margin: 12px 2px 0; font-size: 14px; font-weight: 600; color: var(--ag-ink); }
.ag-ba-grid--live .ag-ba-item.ag-reveal { transform: none; } /* без сдвига — иначе дёргается ручка */
.ag-ba-demo { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: #efe8dc; color: #7d766c; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; vertical-align: middle; }

/* ===== Галерея: подписи, бейджи «До/После», слайдер в лайтбоксе ===== */
.ag-gw-grid { columns: 3; column-gap: 18px; }
.ag-gw-item { margin: 0 0 18px; }
.ag-gw-link { box-shadow: var(--ag-card-shadow); }
.ag-gw-cap { margin: 8px 2px 0; font-size: 13px; color: #6b655c; line-height: 1.4; }
.ag-gw-badge { position: absolute; top: 10px; left: 10px; z-index: 2; padding: 4px 9px; border-radius: 999px; background: #fd9408; color: #15110c; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; pointer-events: none; }
.ag-gw-badge--demo { left: auto; right: 10px; background: rgba(21,17,12,.6); color: #fff; }
.ag-lb-media { position: relative; max-width: 92vw; }
.ag-ba--lb { width: min( 92vw, calc( 82vh * 4 / 3 ) ); aspect-ratio: 4 / 3; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.ag-ba--lb .ag-ba-handle span { width: 48px; height: 48px; }
@media (max-width: 600px) { .ag-gw-cap { font-size: 12px; } }
.ag-lb-nav, .ag-lb-close { z-index: 5; } /* поверх слайдера в лайтбоксе (на мобилке стрелки перекрывались range) */
.ag-gw-badge { white-space: nowrap; }
@media (max-width: 600px) { .ag-gw-badge { font-size: 10px; padding: 3px 7px; top: 8px; left: 8px; } .ag-gw-badge--demo { left: auto; right: 8px; } }

/* ===== «Обучение»: выпускники и занятия (functions.php) ===== */
.ag-grads-sub { margin-top: 34px; }
.ag-grads-grid { display: grid; grid-template-columns: repeat( 4, 1fr ); gap: 14px; margin-top: 8px; }
.ag-class-grid { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: 14px; margin-top: 8px; }
.ag-grad, .ag-class-item { margin: 0; border-radius: var(--ag-radius); overflow: hidden; box-shadow: var(--ag-card-shadow); background: #efe8dc; }
.ag-grad img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; transition: transform .5s var(--ag-ease); }
.ag-class-item img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s var(--ag-ease); }
.ag-grad:hover img, .ag-class-item:hover img { transform: scale(1.04); }
@media (max-width: 900px) { .ag-grads-grid { grid-template-columns: repeat( 3, 1fr ); } .ag-class-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .ag-grads-grid { grid-template-columns: 1fr 1fr; gap: 10px; } .ag-class-grid { grid-template-columns: 1fr 1fr; gap: 10px; } }
