/*
Theme Name:   Avada Child
Theme URI:    https://www.homeopathy-bulgaria.com
Description:  Child тема на Avada за Хомеопатичен център „Ханеман“. Съдържа дизайн системата
              и стиловете на преработената начална страница. Родителската тема не се пипа.
Author:       Evol.bg
Template:     Avada
Version:      1.0.0
Text Domain:  avada-child
*/

/* ==========================================================================
   ДИЗАЙН СИСТЕМА — Фаза 0
   Цветовете са извлечени от макета (docs/design/home-0*.jpg) и съвпадат с вече
   зададените Avada Theme Options, затова нищо не е измислено:
     #8dc641 = button_gradient_top_color   #7bb3b1 = button_gradient_bottom_color / primary_color
   ========================================================================== */

:root {
	/* Цветове */
	--hb-teal: #009584;          /* акцент: eyebrow, H3 в карти, текстови връзки */
	--hb-teal-dark: #00776a;     /* hover на акцента */
	--hb-grad-start: #7bb3b1;    /* начало на градиента (тюркоаз) */
	--hb-grad-end: #8dc641;      /* край на градиента (лайм) */
	--hb-ink: #201f1d;           /* заглавия H1/H2 */
	--hb-body: #333331;          /* основен текст */
	--hb-muted: #6f6f6c;         /* второстепенен текст */

	/* Повърхности */
	--hb-surface: #ffffff;
	--hb-surface-alt: #f6f6f6;   /* сивите секции от макета */
	--hb-surface-tint: #eef5f2;  /* много светъл тюркоазен фон (икон-боксове) */
	--hb-border: #e9e9e9;

	/* Форма */
	--hb-radius: 10px;
	--hb-radius-sm: 6px;
	--hb-radius-pill: 999px;
	--hb-shadow: 0 2px 10px rgba(32, 31, 29, 0.06);
	--hb-shadow-lg: 0 12px 40px rgba(32, 31, 29, 0.10);

	/* Типография */
	--hb-font-head: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	--hb-font-body: "Roboto", Arial, Helvetica, sans-serif;
	--hb-fs-h1: 48px;
	--hb-fs-h2: 36px;
	--hb-fs-h3: 22px;
	--hb-fs-body: 16px;
	--hb-fs-small: 15px;
	--hb-fs-eyebrow: 13px;

	/* Ритъм */
	--hb-section-pad: 90px;

	/* Композитни.
	   Брандовият градиент е взет буквално от Avada Theme Options → Custom CSS,
	   където вече се ползва за .konteiner и .fusion-secondary-header. */
	--hb-grad: linear-gradient(to left, #8dc641, #6cc66e, #5bc291, #62bca8, #7bb3b1);
	--hb-grad-diag: linear-gradient(to top left, #8dc641, #6cc66e, #5bc291, #62bca8, #7bb3b1);
}

@media only screen and (max-width: 800px) {
	:root {
		--hb-fs-h1: 32px;
		--hb-fs-h2: 26px;
		--hb-fs-h3: 20px;
		--hb-section-pad: 56px;
	}
}

/* --------------------------------------------------------------------------
   Общи класове за секциите на началната страница.
   Всичко е скоупнато под .hb-* класове, за да не засяга останалите страници.
   -------------------------------------------------------------------------- */

/* Eyebrow — малкият тюркоазен етикет над всяко H2 */
.hb-eyebrow .fusion-title-heading,
.hb-eyebrow h2,
.hb-eyebrow h3,
.hb-eyebrow p {
	font-family: var(--hb-font-body);
	font-size: var(--hb-fs-eyebrow);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--hb-teal);
	margin: 0;
}

/* Заглавие на секция */
.hb-heading .fusion-title-heading,
.hb-heading h2 {
	font-family: var(--hb-font-head);
	font-size: var(--hb-fs-h2);
	font-weight: 700;
	line-height: 1.22;
	letter-spacing: -0.01em;
	color: var(--hb-ink);
	margin: 0;
}

/* Подзаглавие под H2 */
.hb-subhead,
.hb-subhead p {
	font-family: var(--hb-font-body);
	font-size: var(--hb-fs-body);
	line-height: 1.75;
	color: var(--hb-body);
}

.hb-subhead p:last-child {
	margin-bottom: 0;
}

/* Късата градиентна чертичка под подзаглавието */
.hb-rule .fusion-separator-border,
.hb-rule .fusion-separator {
	border: 0 !important;
}

.hb-rule {
	position: relative;
}

.hb-rule::after {
	content: "";
	display: block;
	width: 64px;
	height: 3px;
	border-radius: 2px;
	background: var(--hb-grad);
}

/* --------------------------------------------------------------------------
   Бутони — макетът иска хоризонтален градиент, а Avada рисува вертикален.
   -------------------------------------------------------------------------- */

.hb-btn-primary .fusion-button,
.fusion-button.hb-btn-primary {
	background: var(--hb-grad) !important;
	border: 0 !important;
	border-radius: var(--hb-radius-sm) !important;
	color: #fff !important;
	font-family: var(--hb-font-body);
	font-weight: 700;
	letter-spacing: 0.06em;
	box-shadow: 0 2px 8px rgba(123, 179, 177, 0.35);
	transition: filter 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.hb-btn-primary .fusion-button:hover,
.fusion-button.hb-btn-primary:hover {
	filter: saturate(1.1) brightness(1.04);
	box-shadow: 0 6px 18px rgba(123, 179, 177, 0.45);
	transform: translateY(-1px);
}

.hb-btn-outline .fusion-button,
.fusion-button.hb-btn-outline {
	background: transparent !important;
	border: 2px solid var(--hb-teal) !important;
	border-radius: var(--hb-radius-sm) !important;
	color: var(--hb-teal) !important;
	font-family: var(--hb-font-body);
	font-weight: 700;
	letter-spacing: 0.06em;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.hb-btn-outline .fusion-button:hover,
.fusion-button.hb-btn-outline:hover {
	background: var(--hb-teal) !important;
	color: #fff !important;
}

/* Avada слага собствен span за текста на бутона — цветът се наследява оттам. */
.hb-btn-primary .fusion-button .fusion-button-text,
.hb-btn-primary .fusion-button-text {
	color: #fff !important;
}

.hb-btn-outline .fusion-button .fusion-button-text,
.hb-btn-outline .fusion-button-text {
	color: inherit !important;
}

/* Текстова връзка със стрелка, каквато има до бутоните в макета */
.hb-link-arrow a {
	color: var(--hb-teal);
	font-family: var(--hb-font-body);
	font-size: var(--hb-fs-small);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.hb-link-arrow a:hover {
	color: var(--hb-teal-dark);
	border-bottom-color: currentColor;
}

/* На телефон тези връзки са призиви за действие („Запази час“, „Вижте цените“),
   а не връзки насред абзац — стоят самостоятелно до бутоните. Височината им
   обаче беше 19 px, колкото е редът на текста, което е малка цел за пръст
   (WCAG 2.5.8 иска поне 24 px).

   Целта се разширява на 44 px, без да се мести текстът: `inline-flex` с
   `min-height` центрира етикета, а отрицателният вертикален margin поема
   добавената височина, за да не се разместят съседните елементи. Подчертаването
   при задържане остава на самия текст, защото `border-bottom` е на реда, не на
   кутията. */
@media only screen and (max-width: 640px) {
	.hb-link-arrow a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
		margin-top: -12px;
		margin-bottom: -12px;
	}
}

/* --------------------------------------------------------------------------
   CTA в главното меню — „ЗАПАЗИ ЧАС“ (клас hb-menu-cta на меню елемента).
   Заданието го иска като визуално различим бутон в desktop и mobile менюто.
   -------------------------------------------------------------------------- */

/* Avada дава на пунктовете височината на хедъра; бутонът се центрира вътре
   в li-то, за да не изскача нагоре. */
.fusion-main-menu > ul > li.hb-menu-cta {
	display: flex;
	align-items: center;
}

.fusion-main-menu > ul > li.hb-menu-cta > a {
	background: var(--hb-grad);
	border-radius: var(--hb-radius-sm);
	color: #fff !important;
	padding: 0 22px !important;
	margin-left: 14px;
	height: 42px !important;
	line-height: 42px !important;
	box-shadow: 0 2px 8px rgba(123, 179, 177, 0.32);
	transition: filter 0.2s ease, box-shadow 0.2s ease;
}

.fusion-main-menu > ul > li.hb-menu-cta > a:hover {
	filter: brightness(1.06);
	box-shadow: 0 6px 16px rgba(123, 179, 177, 0.42);
}

.fusion-main-menu > ul > li.hb-menu-cta > a .menu-text {
	color: #fff !important;
}

/* Avada рисува подчертаваща лента под активния пункт — при бутона пречи. */
.fusion-main-menu > ul > li.hb-menu-cta > a::after,
.fusion-main-menu > ul > li.hb-menu-cta > a::before {
	display: none !important;
}

.fusion-mobile-nav-holder li.hb-menu-cta > a {
	background: var(--hb-grad);
	color: #fff !important;
	font-weight: 700;
}

/* --------------------------------------------------------------------------
   Помощни
   -------------------------------------------------------------------------- */

.hb-section-alt {
	background-color: var(--hb-surface-alt);
}

/* Медицинската забележка — задължителна по задание, не се маха. */
.hb-medical-note,
.hb-medical-note p {
	font-family: var(--hb-font-body);
	font-size: 13px;
	line-height: 1.6;
	color: var(--hb-muted);
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   ШАПКАТА НА ТЕЛЕФОН — логото и бургерът на един ред.

   Avada рисува логото с `float: left`, а бутона на менюто с `float: right`, и
   двата в `.fusion-header > .fusion-row`. При 375 px редът е 315 px, а логото
   е 297 px. За бургера остават 18 px, а той е 21 px — не се събира и пада на
   собствен ред под логото. Оттам идват и излишните 132 px височина на шапката.

   Редът става flex: логото отляво, бургерът отдясно, центрирани по вертикала.
   Логото се ограничава до наличната ширина и се смалява пропорционално,
   вместо да изтласква бутона.
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 800px) {
	.fusion-header > .fusion-row {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		column-gap: 14px;
		row-gap: 0;
	}

	/* Avada чисти float-овете с `::before`/`::after` (`content: ""; display: table`).
	   Във flex контейнер обаче псевдоелементите СА flex елементи: те заемат двата
	   крайни края при `space-between` и изтикват логото и бутона по 14 px навътре.
	   Затова се изключват — редът вече е flex и няма float за чистене. */
	.fusion-header > .fusion-row::before,
	.fusion-header > .fusion-row::after {
		display: none;
	}

	.fusion-header > .fusion-row > .fusion-logo {
		float: none;
		flex: 0 1 auto;
		/* 44 px за бутона + 14 px разстояние. */
		max-width: calc(100% - 58px);
	}

	.fusion-header > .fusion-row > .fusion-logo picture,
	.fusion-header > .fusion-row > .fusion-logo img {
		max-width: 100%;
		height: auto;
	}

	.fusion-header > .fusion-row > .fusion-mobile-menu-icons {
		float: none;
		flex: 0 0 auto;
		width: auto;
		margin: 0;
	}

	/* Иконата е `float: right` вътре в собствената си обвивка — в flex ред
	   това само ѝ пречи да се центрира. */
	.fusion-header > .fusion-row > .fusion-mobile-menu-icons a {
		float: none;
		display: flex;
		align-items: center;
		justify-content: center;
		/* Самата икона е 21×21 px — под 44-те, които WCAG 2.5.8 иска за цел
		   за пръст. Кликаемата площ се разширява, без иконата да се уголемява. */
		width: 44px;
		height: 44px;
		margin: 0;
	}

	/* Отвореното меню е СЪЩО дете на реда, тоест и то става flex елемент: при
	   отваряне заставаше ВДЯСНО ДО логото, свито до ширината на текста, и
	   покриваше шапката. Тук му се дава собствен ред под логото и бутона.

	   Ширината е `100% + 60px`, а не `100%`. Avada нарочно изнася панела извън
	   отстъпа на шапката с `margin: 0 -30px` (проверено: същата стойност и при
	   375, и при 768 px), за да опира в двата ръба на екрана, а пунктовете в
	   него имат собствен вътрешен отстъп от 30 px и така се подравняват със
	   съдържанието на страницата. При `width: 100%` кутията остава колкото
	   вътрешността на реда и панелът излизаше изместен наляво — 0 до 315 px
	   при екран 375. 60 = двата отстъпа на шапката по 30 px. */
	.fusion-header > .fusion-row > .fusion-mobile-nav-holder {
		flex: 0 0 calc(100% + 60px);
		width: auto;
		order: 99;
	}
}

/* Видим маркер за неодобрено съдържание. Не бива да остане на живо — виж
   раздел 8 в docs/plan.md. */
.hb-placeholder {
	display: inline-block;
	padding: 2px 8px;
	border: 1px dashed #d08b00;
	border-radius: var(--hb-radius-sm);
	background: #fff8e8;
	color: #8a5c00;
	font-family: var(--hb-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
}

/* --------------------------------------------------------------------------
   ЛОГО (Фаза 19.4, преработена на 11.08.2026)

   Тук стоеше flex редът „лого + надпис „Ханеман Академия““. Надписът отпадна —
   биеше се с марката „Хомеопатичен център „Ханеман““ и повтаряше думата
   „Ханеман“, която вече е вътре в знака. Виж `hb_child_logo_academy_text()` в
   `functions.php` за това как се връща, ако потрябва.

   Затова тук няма правила: `.fusion-logo` се връща към поведението на Avada.
   Новото лого е 88 x 70 и се ограничава по височина, не по ширина, тоест
   височината на шапката не се променя. Мобилният ред лого + бургер се урежда
   по-горе, в блока `.fusion-header > .fusion-row` — той не зависи от надписа.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   ЛЕПКАВА ШАПКА — ДВАТА РЕДА ЗАЕДНО (Фаза 20.1 и 20.2)

   Искането: при скрол на desktop зеленият contact bar и навигацията да останат
   видими и да се държат като една обща лепкава зона, без скок и без
   разместване.

   Защо не с опция на Avada. Оформлението е v3 → `avada-header.js` задава
   `window.sticky_header_type = 1`, а при тип 1 лепне само `.fusion-header`.
   `.fusion-secondary-header` стои извън лепкавата зона и няма настройка, която
   да го вкара. `header_sticky_type2_layout = menu_only` важи само за v4/v5.

   Затова лепненето на Avada е изключено през филтър в `functions.php` (не през
   Theme Options — така никой не може да го върне случайно и двата механизма да
   се сбият), а тук цялата обвивка `.fusion-header-wrapper`, която съдържа и
   двата реда, се вади от потока с `position: fixed` и мястото ѝ се държи от
   отстъп върху `#wrapper`.

   ⚠️ Защо НЕ `position: sticky`. Първата реализация беше точно такава и лепнеше
   правилно, но падна на второто изискване. Лепкавият елемент остава В ПОТОКА:
   свиването на шапката с 20 px скъсява документа с 20 px и всичко под нея се
   вдига. Измерено с `shot-scroll.js` — заявен скрол до 140 px връщаше 121 px,
   защото Chrome компенсира със scroll anchoring. Тоест страницата подскача точно
   в мига на превключването, което клиентът изрично забранява.

   С `fixed` шапката не участва в потока изобщо: подложката пази ПЪЛНАТА ѝ
   височина през цялото време, а свиването се случва над нея. Съдържанието не
   мърда нито при лепването, нито при свиването, нито при връщането нагоре.

   Второ предимство: `#boxed-wrapper` е с `overflow: hidden` и това щеше да убие
   `sticky` (прави го scroll-container и лепненето тихо спира). `fixed` не се
   влияе от него — `#boxed-wrapper` няма `transform`, значи не образува
   containing block и не отрязва фиксирани деца. Така чужд селектор не се пипа.

   Само desktop — `header_sticky_tablet` и `header_sticky_mobile` са 0 и искането
   е само за desktop.

   ⚠️ Прагът е 1024 px, а НЕ 800-те, на които се сменя мобилният ред лого + бургер
   по-горе. Двете граници не съвпадат: Avada показва десктоп менюто чак от
   **1024 px**, тоест между 801 и 1023 px на екрана стои МОБИЛНАТА шапка — три
   реда контакти плюс бургер, 163–178 px висока. Първата версия лепнеше от 801 px
   и в целия този диапазон залепваше точно нея: почти една пета от изгледа
   оставаше заета за постоянно. Хванато от QA пробега (снимка
   `_local/shots/qa-sticky810-810-y400.png`).

   Стойността е и в `header-sticky.js` — двете се сверяват, иначе класът виси
   там, където лепненето не важи.
   -------------------------------------------------------------------------- */

@media only screen and (min-width: 1024px) {

	.fusion-header-wrapper {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		/* Стойността е на Avada; изписана изрично, за да не зависи от реда на
		   зареждане на файловете. */
		z-index: 10011;
		transition: box-shadow 0.28s ease;
	}

	/* Подложката. Резервната стойност е ПЪЛНАТА височина на шапката при сегашното
	   лого (38 px зелен ред + 81 px основен) и служи само за първото рисуване —
	   `header-sticky.js` я замества с измерената. Без резервна стойност
	   съдържанието щеше да се вдига с 119 px до изпълнението на скрипта и да пада
	   обратно, тоест видим скок при всяко зареждане. */
	#wrapper {
		padding-top: var(--hb-hdr-total-h, 119px);
	}

	/* ВЛЯЗЪЛ В АДМИНА ПОТРЕБИТЕЛ

	   WordPress бута страницата надолу с `html { margin-top: 32px !important }`,
	   но фиксираният елемент не се влияе от този отстъп — шапката оставаше на
	   `top: 0` и лентата на админа покриваше 32 от 38-те пиксела на зеления ред.
	   Avada решава същото със своя клас `.fusion-is-sticky`, който вече не се
	   слага.

	   Има значение, защото клиентът гледа собствения си сайт влязъл — и щеше да
	   го върне като „пак се счупи“. Хванато от QA пробега. */
	body.admin-bar .fusion-header-wrapper {
		top: 32px;
	}

	/* ВЪТРЕШНИТЕ КОТВИ

	   Менюто и текстът водят към `#napravleniya`, `#obuchenie`, `#ekip`,
	   `#otzivi`, `#kontakti`. Фиксираната шапка ги покриваше — целта заставаше на
	   `top: 0`, а шапката стига до 99 px, тоест първите 99 px от секцията оставаха
	   зад нея (измерено: заглавието „КОНТАКТИ“ срязано наполовина).

	   Изчисляването на отместването в Avada е вързано за нейния собствен sticky,
	   който е изключен, затова се задава тук. Стойността следва измерената
	   височина, а не твърдо число. */
	[id]:target,
	.fusion-fullwidth[id],
	.fusion-builder-row[id] {
		scroll-margin-top: calc(var(--hb-hdr-total-h, 119px) + 16px);
	}

	/* Под лепнатата шапка минава съдържание — двата реда трябва да са плътни.
	   Задават се изрично, защото Avada ги рисува с настройки, които клиентът
	   може да смени от Theme Options. */
	.fusion-header-wrapper .fusion-secondary-header {
		background: var(--hb-grad);
	}

	.fusion-header-wrapper .fusion-header {
		background-color: var(--hb-surface);
	}

	/* Отделянето от страницата се появява чак когато шапката е лепната —
	   в начално положение сянка под нея няма в макета. */
	.fusion-header-wrapper.hb-sticky-on {
		box-shadow: 0 2px 14px rgba(32, 31, 29, 0.13);
	}

	/* ЛОГОТО КАТО ЕДИН ГРАФИЧЕН ЕЛЕМЕНТ (20.2)

	   `sticky_header_logo` е празно, тоест Avada мащабира основното лого
	   (88 x 70, retina 176 x 140). Avada го изписва с инлайн
	   `style="max-height:70px;height:auto"` и с атрибут `width="88"`. Атрибутът
	   е presentational hint, тоест ширината НЕ е `auto`: ограничаването по
	   височина само сплесква знака, вместо да го смали.

	   Затова височината се задава изрично, а ширината се пуска на `auto` — така
	   съотношението се пази от самия браузър и логото се смалява като едно цяло.

	   И трите свойства носят `!important`, защото се бият с ИНЛАЙН стил на самия
	   таг (`style="max-height:70px;height:auto"`). Инлайн стилът бие всяка
	   специфичност — без `!important` правилото се прилага „успешно“ и не прави
	   нищо, което е точно капанът, в който се влиза мълчаливо. */
	.fusion-header-wrapper .fusion-header .fusion-logo img {
		width: auto !important;
		max-height: none !important;
		transition: height 0.28s ease;
	}

	/* СВИВАНЕТО НА ЦЯЛАТА ШАПКА

	   Само логото не стига. Avada изписва височините на `.fusion-header`,
	   `.fusion-row`, `.fusion-logo` и на пунктовете от менюто като твърди
	   пиксели в динамичния си CSS (81 / 80 / 70 / 80 px, пресметнати от логото).
	   Проверено на живо: смаляване само на снимката оставя шапката 81 px висока
	   и логото увисва в средата ѝ.

	   Затова се свиват всичките, но не с наши твърди числа, а с една обща
	   разлика, извадена от ИЗМЕРЕНИТЕ стойности. `header-sticky.js` мери
	   шапката в несвито състояние и записва променливите върху самата обвивка.
	   Така смяна на логото от Theme Options не разсинхронизира нищо.

	   Ако скриптът не се зареди, променливите липсват, `calc()` е невалиден,
	   декларациите отпадат и шапката просто не се свива — лепненето остава. */
	.fusion-header-wrapper .fusion-header,
	.fusion-header-wrapper .fusion-header > .fusion-row,
	.fusion-header-wrapper .fusion-header .fusion-logo,
	.fusion-header-wrapper .fusion-main-menu > ul > li > a {
		transition: height 0.28s ease;
	}

	.fusion-header-wrapper.hb-sticky-on .fusion-header {
		height: calc(var(--hb-hdr-h) - var(--hb-hdr-delta)) !important;
	}

	.fusion-header-wrapper.hb-sticky-on .fusion-header > .fusion-row {
		height: calc(var(--hb-hdr-row-h) - var(--hb-hdr-delta)) !important;
	}

	.fusion-header-wrapper.hb-sticky-on .fusion-header .fusion-logo {
		height: calc(var(--hb-hdr-logo-h) - var(--hb-hdr-delta)) !important;
	}

	.fusion-header-wrapper.hb-sticky-on .fusion-header .fusion-logo img {
		height: calc(var(--hb-hdr-img-h) - var(--hb-hdr-delta)) !important;
	}

	/* Пунктовете от менюто са високи колкото реда и се центрират вертикално със
	   собствената си височина — оставането им на 80 px в свит ред ги избутва
	   извън шапката.

	   ⚠️ Изключението за `li.hb-menu-cta` не е дребнавост. Правилото важи за
	   ВСЯКА връзка от първо ниво, а една от тях не е текстов пункт: бутонът
	   „ЗАПАЗИ ЧАС“ има собствена височина 42 px (виж блока за CTA по-горе).
	   Без изключението той ставаше 60 px в свито състояние, опираше в двата ръба
	   на шапката и от пилюл се превръщаше в блок — тоест точно „промяна на
	   разположението на елементите“, която клиентът забранява в точка 1.
	   Хванато от QA пробега: 42 → 60 px, отстояние отгоре 19 → 0 px.

	   Иконата за търсене СЕ свива с реда (80 → 60 px) и това е правилно — тя се
	   центрира в собствената си височина и следва реда като текстовите пунктове. */
	.fusion-header-wrapper.hb-sticky-on .fusion-main-menu > ul > li:not(.hb-menu-cta) > a {
		height: calc(var(--hb-hdr-link-h) - var(--hb-hdr-delta)) !important;
	}

	/* БУТОНЪТ „ЗАПАЗИ ЧАС“ СЕ СВИВА ЗАЕДНО С ЛЕНТАТА

	   Изключването му от правилото по-горе поправи един дефект и създаде друг.
	   Той остана 42 px, а лентата слезе от 81 на 61 — тоест въздухът около него
	   падна от 19 на 9 px и бутонът започна да изглежда залепен за зеления ред.
	   Измерено на живо, не на око.

	   Тук височината му следва лентата, но с ПОСТОЯНЕН въздух от 12 px отгоре и
	   отдолу, вместо да се лепи за ръбовете ѝ (това беше първата грешка) и вместо
	   да стои непроменен (втората).

	   Трите граници:
	     `min(42px, …)`  — никога по-голям от естествения си размер, иначе при
	                       по-плитко свиване бутонът щеше да ПОРАСНЕ;
	     `max(34px, …)`  — никога толкова тесен, че да е трудна цел за клик;
	     между тях — лентата минус 24 px въздух.

	   `line-height` също се сменя — в блока за CTA по-горе той е 42 px и без това
	   текстът увисва под средата на свития бутон. */
	.fusion-header-wrapper.hb-sticky-on .fusion-main-menu > ul > li.hb-menu-cta > a {
		height: min(42px, max(34px, calc(var(--hb-hdr-h) - var(--hb-hdr-delta) - 24px))) !important;
		line-height: min(42px, max(34px, calc(var(--hb-hdr-h) - var(--hb-hdr-delta) - 24px))) !important;
		transition: height 0.28s ease, line-height 0.28s ease;
	}

	/* Обявена анимация значи, че някой ще поиска да няма анимация. */
	@media (prefers-reduced-motion: reduce) {
		.fusion-header-wrapper,
		.fusion-header-wrapper .fusion-header,
		.fusion-header-wrapper .fusion-header > .fusion-row,
		.fusion-header-wrapper .fusion-header .fusion-logo,
		.fusion-header-wrapper .fusion-header .fusion-logo img,
		.fusion-header-wrapper .fusion-main-menu > ul > li > a {
			transition: none;
		}
	}
}

/* --------------------------------------------------------------------------
   СКРИТО СЪДЪРЖАНИЕ НА КЛИЕНТА (Фаза 19.5)

   Клиентът беше написал в Customizer CSS ръчно правило `.hide { display: none }`
   и с него държеше скрити две неща: двамата специалисти в „Екип" и празната
   таблица „Курсове" в „Цени".

   Правилото беше махнато във Фаза 19.1, защото щеше да скрие и новите хора,
   които клиентът ще качи. Това обаче ИЗКАРА НАЯВЕ таблицата „Курсове" — с два
   реда без цени. Дефектът мина покрай проверката, защото тя търсеше точно
   `class="hide"`, а там е `class="table-1 hide"`.

   Затова таблицата вече носи собствен клас. `hb-hidden` не може да бъде
   написан случайно в билдъра, докато `hide` е дума, която всеки би ползвал.
   -------------------------------------------------------------------------- */

.hb-hidden {
	display: none !important;
}

/* --------------------------------------------------------------------------
   ФУТЪР — четирите кутии с връзки да лежат на един ред

   Петте колони на футъра (`fusion_builder_column_1_5`) са настроени от
   билдъра, а не оттук. Четирите с кутии са получили ПРЕОБЪРНАТИ стойности:
   „Информация“ и „Основни услуги“ са с 15 px горе/долу и 10 px отстрани,
   „Последни новини“ и „За контакти“ — с 10 px горе/долу и 15 px отстрани.

   Кутиите са подравнени (всичките започват на y = 10698,8 px), но текстът в
   тях не е: заглавията излизат на 10713,8 срещу 10708,8 px, а отстъпът отляво
   се различава с 5 px. На всяка страница, защото футърът е един.

   Истинската поправка е в настройките на колоните в билдъра — това е запис в
   базата и не влиза в обхвата тук.

   Изравнява се на 15 px вертикално и 10 px хоризонтално — тоест по всяка ос се
   взима СТОЙНОСТТА, КОЯТО ВЕЧЕ СЪЩЕСТВУВА и не стеснява нито една кутия.
   ⚠️ Не 15 px отстрани: под 1024 px текстът във футъра и без това се реже в
   кутиите си (виж отчета), а по-широкият отстъп щеше да отнеме още 10 px.
   -------------------------------------------------------------------------- */

.fusion-footer .fusion_builder_column_1_5 > .fusion-column-wrapper:has(> .fusion-title) {
	padding: 15px 10px !important;
}