/**
 * NOMA: единая fluid-типографика и отступы — точная модель Тильды (t396 zero-блоки).
 *
 * Механика из скриптов исходника (tilda-zero-1.1.min.js):
 *   артборд = наибольший из [360, 720, 1200] ≤ ширины окна  (t396_detectResolution)
 *   zoom    = ширина / артборд                               (без потолка, растёт и >1200)
 * Внутри диапазона всё (шрифты, высоты, паддинги) умножается на zoom.
 * Диапазоны: <720 → артборд 360; 720–1199 → 720; ≥1200 → 1200.
 * На границах 719/720 и 1199/1200 есть «скачки» — аутентичное поведение Тильды.
 *
 * --noma-vw  — «эффективная» ширина вьюпорта: Тильда считает зум от clientWidth
 *              (без скроллбара), 100vw его включает — 99vw компенсирует.
 * --noma-px  — «дизайн-пиксель» текущего артборда (= zoom × 1px). Любой размер из
 *              макета: calc(N * var(--noma-px)), N — значение артборда этого диапазона.
 *
 * Применение:
 *  1) Elementor Global Fonts / поля размеров: единица «custom» = var(--noma-fs-…) или
 *     calc(N * var(--noma-px)). Респонсив-вкладки Elementor = поля res-1200/720/360 Тильды.
 *  2) Точечно: классы .noma-t-* (шрифт) и .noma-pad-* (отступ) в CSS Classes виджета.
 *  3) Hero-высоты — vh (как height_vh в оригинале), не через --noma-px.
 */

:root {
	--noma-vw: 99vw;

	/* дизайн-пиксель артборда 1200 */
	--noma-px: calc(var(--noma-vw) / 1200);

	/* ----- шрифтовые роли: база артборда × --noma-px -----
	   Базы из data-field-fontsize исходника (1200 / 720 / 360):
	   display 60/40/26, h2 30/22/16, h3 25/20/22, text-lg 16/14/15,
	   text 15/14/15, text-xs 12/12/13, label 20/16/13. */
	--noma-fs-display: calc(60 * var(--noma-px));
	--noma-fs-h2: calc(30 * var(--noma-px));
	--noma-fs-h3: calc(25 * var(--noma-px));
	--noma-fs-text-lg: calc(16 * var(--noma-px));
	--noma-fs-text: calc(15 * var(--noma-px));
	--noma-fs-text-xs: calc(12 * var(--noma-px));
	--noma-fs-label: calc(20 * var(--noma-px));

	/* ----- кнопки: «стандартные» блоки Тильды НЕ зумятся (фикс. ступени) ----- */
	--noma-fs-btn-xl: 30px; /* .t-btnflex_xxl; @≤640 → 26px */
	--noma-fs-btn-lg: 22px; /* .t-btnflex_lg;  @≤640 → 18px */
	--noma-fs-btn: 16px;    /* .t-btnflex_md */

	/* ----- роли отступов (зумятся; базы из data-artboard-padding) -----
	   section 80/60/48, section-sm 40/40/24 */
	--noma-sp-section: calc(80 * var(--noma-px));
	--noma-sp-section-sm: calc(40 * var(--noma-px));
}

/* артборд 720 (окно 720–1199) */
@media (max-width: 1199px) {
	:root {
		--noma-px: calc(var(--noma-vw) / 720);

		--noma-fs-display: calc(40 * var(--noma-px));
		--noma-fs-h2: calc(22 * var(--noma-px));
		--noma-fs-h3: calc(20 * var(--noma-px));
		--noma-fs-text-lg: calc(14 * var(--noma-px));
		--noma-fs-text: calc(14 * var(--noma-px));
		--noma-fs-text-xs: calc(12 * var(--noma-px));
		--noma-fs-label: calc(16 * var(--noma-px));

		--noma-sp-section: calc(60 * var(--noma-px));
		--noma-sp-section-sm: calc(40 * var(--noma-px));
	}
}

/* артборд 360 (окно <720) */
@media (max-width: 719px) {
	:root {
		--noma-px: calc(var(--noma-vw) / 360);

		--noma-fs-display: calc(26 * var(--noma-px));
		--noma-fs-h2: calc(16 * var(--noma-px));
		--noma-fs-h3: calc(22 * var(--noma-px));
		--noma-fs-text-lg: calc(15 * var(--noma-px));
		--noma-fs-text: calc(15 * var(--noma-px));
		--noma-fs-text-xs: calc(13 * var(--noma-px));
		--noma-fs-label: calc(13 * var(--noma-px));

		--noma-sp-section: calc(48 * var(--noma-px));
		--noma-sp-section-sm: calc(24 * var(--noma-px));
	}
}

/* кнопки: мобильная ступень стандартных блоков */
@media (max-width: 640px) {
	:root {
		--noma-fs-btn-xl: 26px;
		--noma-fs-btn-lg: 18px;
	}
}

/* -------------------------------------------------------------------------
   Утилитарные классы — для точечного применения через CSS Classes виджета.
   !important осознанно: класс должен перебивать захардкоженный размер
   виджета Elementor (.elementor-element-XXXX … { font-size: … }).
   ------------------------------------------------------------------------- */

.noma-t-display,
.noma-t-display .elementor-heading-title {
	font-size: var(--noma-fs-display) !important;
}

.noma-t-h2,
.noma-t-h2 .elementor-heading-title {
	font-size: var(--noma-fs-h2) !important;
}

.noma-t-h3,
.noma-t-h3 .elementor-heading-title {
	font-size: var(--noma-fs-h3) !important;
}

.noma-t-text-lg,
.noma-t-text-lg .elementor-widget-container {
	font-size: var(--noma-fs-text-lg) !important;
}

.noma-t-text,
.noma-t-text .elementor-widget-container {
	font-size: var(--noma-fs-text) !important;
}

.noma-t-text-xs,
.noma-t-text-xs .elementor-widget-container {
	font-size: var(--noma-fs-text-xs) !important;
}

.noma-t-label,
.noma-t-label .elementor-widget-container {
	font-size: var(--noma-fs-label) !important;
}

.noma-t-btn-xl,
.noma-t-btn-xl .elementor-button {
	font-size: var(--noma-fs-btn-xl) !important;
}

.noma-t-btn-lg,
.noma-t-btn-lg .elementor-button {
	font-size: var(--noma-fs-btn-lg) !important;
}

.noma-t-btn,
.noma-t-btn .elementor-button {
	font-size: var(--noma-fs-btn) !important;
}

/* ----- отступы: самые частые случаи (низ секции, как data-artboard-padding) ----- */

.noma-pad-section {
	padding-bottom: var(--noma-sp-section) !important;
}

.noma-pad-section-sm {
	padding-bottom: var(--noma-sp-section-sm) !important;
}
