/*
 * LockOff — brand-токены поверх Bootstrap 5 (переменные BS5 + Manrope + CTA-классы).
 * Загружается ПОСЛЕ bootstrap.min.css, ДО app.css (см. inc/enqueue.php).
 */

@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('../fonts/manrope/manrope-cyrillic.woff2') format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('../fonts/manrope/manrope-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Символа ₸ (U+20B8) в Manrope физически нет (проверено: HTTP 400 на попытку
 * узкого сабсета + fonttools cmap полного шрифта) — ₸ намеренно рендерится
 * fallback-шрифтом стека (system-ui и т.п.), не Manrope. Принятый риск, см.
 * docs/specs/S2-lokalnye-assety.md → «Риски». Доп. @font-face здесь НЕ заводим. */

/* Oswald (condensed) — eyebrow и крупные цифры прототипа (SP-B: вес 600).
 * Самохост (правило «без CDN» про рантайм; файлы в теме, как Manrope). */
@font-face {
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/oswald/oswald-cyrillic.woff2') format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/oswald/oswald-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--bs-body-font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--bs-primary: #003ee9;
	--bs-primary-rgb: 0, 62, 233;
	--bs-link-color: var(--bs-primary);
	--bs-link-color-rgb: var(--bs-primary-rgb);
	--bs-link-hover-color: #0034cc;
	--bs-link-hover-color-rgb: 0, 52, 204;

	/* Bootstrap-мост (S8.1): холодная палитра прототипа глобально —
	   fallback'и var(--bs-border-color,#dee2e6) и т.п. мигрируют каскадно. */
	--bs-body-color: #2a3142;      /* = --ink-700 */
	--bs-body-bg: #f9f9fb;         /* = --surface-50 (фон страницы) */
	--bs-border-color: #e6e9f0;    /* = --line-200 (холоднее #dee2e6) */
	--bs-secondary-color: #5a6275; /* = --ink-500 (S8.4: холодный muted вместо тёплого BS rgba(33,37,41,.75); ловит .text-secondary/-muted-утилиты) */

	--bs-border-radius: 1rem; /* карточки/поверхности 12–24px (brand-guidelines.md) */

	--lockoff-primary-600: #0034cc;
	--lockoff-emergency: #e5342b;
	--lockoff-whatsapp: #25d366;
	--lockoff-success: #1fa463;
	--lockoff-amber: #e8a317;
	--lockoff-blue-50: #f1f5ff;

	/* SP-B (S7) — визуальная система страницы услуги */
	--font-condensed: 'Oswald', 'Manrope', system-ui, sans-serif;
	--lockoff-blue-100: #e3e9ff;
	--lockoff-red-100: #fde6e4;
	--lockoff-green-100: #e3f5ec;
	--lockoff-gradient: linear-gradient(135deg, #2a5bff 0%, #003ee9 55%, #0029a8 100%);
	--lockoff-shadow-blue: 0 10px 28px rgba(0, 62, 233, .28);
}

/* ============================================================
   LockOff — Design-System токен-слой (S8.1).
   Дословный перенос :root прототипа docs/design/index.html.
   Тени ХОЛОДНЫЕ rgba(10,14,26,…). --space-11 в прототипе НЕТ.
   ============================================================ */
:root {
	/* --- Brand blue (primary) --- */
	--blue-900: #001440;
	--blue-800: #001b6b;
	--blue-700: #0029a8;
	--blue-600: #0034cc;
	--blue-500: #003ee9;
	--blue-400: #2a5bff;
	--blue-300: #6e8fff;
	--blue-200: #b3c4ff;
	--blue-100: #e3e9ff;
	--blue-50:  #f1f5ff;

	/* --- Brass / warm detail --- */
	--brass-700: #70461c;
	--brass-500: #b8862f;
	--brass-300: #d9b878;

	/* --- Neutrals (cool grey) --- */
	--ink-900: #0a0e1a;
	--ink-800: #161b2b;
	--ink-700: #2a3142;
	--ink-500: #5a6275;
	--ink-400: #8a91a3;
	--ink-300: #c2c8d4;
	--line-200: #e6e9f0;
	--line-100: #eef1f6;

	--white: #ffffff;
	--surface-50: #f9f9fb;
	--surface-100: #f3f5f9;
	--surface-200: #eceff5;

	/* --- Semantic status --- */
	--green-500: #1fa463;
	--green-100: #e3f5ec;
	--amber-500: #e8a317;
	--amber-100: #fdf2dc;
	--red-600: #d62518;
	--red-500: #e5342b;
	--red-100: #fde6e4;
	--whatsapp: #25d366;

	/* --- Semantic aliases (предпочтительны в компонентах) --- */
	--color-primary:        var(--blue-500);
	--color-primary-hover:  var(--blue-600);
	--color-primary-active: var(--blue-700);
	--color-primary-tint:   var(--blue-100);
	--color-on-primary:     var(--white);
	--color-emergency:       var(--red-500);
	--color-emergency-hover: var(--red-600);
	--color-whatsapp:        var(--whatsapp);
	--text-strong:  var(--ink-900);
	--text-body:    var(--ink-700);
	--text-muted:   var(--ink-500);
	--text-faint:   var(--ink-400);
	--text-on-dark: var(--white);
	--text-link:    var(--blue-500);
	--surface-page:   var(--surface-50);
	--surface-card:   var(--white);
	--surface-sunken: var(--surface-100);
	--surface-invert: var(--blue-900);
	--surface-tint:   var(--blue-50);
	--border-subtle: var(--line-200);
	--border-strong: var(--ink-300);
	--border-focus:  var(--blue-500);

	/* --- Signature gradients --- */
	--gradient-blob: linear-gradient(135deg, #2a5bff 0%, #003ee9 55%, #0029a8 100%);
	--gradient-blue-soft: linear-gradient(180deg, #f1f5ff 0%, #ffffff 100%);

	/* --- Typography --- */
	--font-display:   'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-body:      'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-condensed: 'Oswald', 'Manrope', system-ui, sans-serif;
	--fw-regular: 400;
	--fw-medium:  500;
	--fw-semibold:600;
	--fw-bold:    700;
	--fw-black:   800;
	--fs-display: 4rem;
	--fs-h1:      2.75rem;
	--fs-h2:      2.125rem;
	--fs-h3:      1.625rem;
	--fs-h4:      1.25rem;
	--fs-lead:    1.125rem;
	--fs-body:    1rem;
	--fs-sm:      0.875rem;
	--fs-xs:      0.75rem;
	--lh-tight:   1.05;
	--lh-snug:    1.2;
	--lh-normal:  1.45;
	--lh-relaxed: 1.65;
	--ls-tight:   -0.02em;
	--ls-normal:  0;
	--ls-wide:    0.04em;
	--ls-eyebrow: 0.16em;

	/* --- Spacing & layout (4px grid; --space-11 намеренно ОТСУТСТВУЕТ) --- */
	--space-0:  0;
	--space-1:  4px;
	--space-2:  8px;
	--space-3:  12px;
	--space-4:  16px;
	--space-5:  24px;
	--space-6:  32px;
	--space-7:  48px;
	--space-8:  64px;
	--space-9:  80px;
	--space-10: 96px;
	--space-12: 128px;
	--section-y:       var(--space-12);
	--section-y-tight: var(--space-10);
	--container-sm:  540px;
	--container-md:  720px;
	--container-lg:  960px;
	--container-xl:  1140px;
	--container-xxl: 1320px;
	--container-max: 1320px;
	--gutter:        24px;
	--header-h:      80px; /* высота sticky-шапки .hd__bar; офсет scroll-margin якорей (SP-C) */

	/* --- Corner radii --- */
	--radius-xs:   6px;
	--radius-sm:   10px;
	--radius-md:   16px;
	--radius-lg:   24px;
	--radius-xl:   32px;
	--radius-pill: 999px;

	/* --- Shadows (ХОЛОДНЫЕ rgba(10,14,26), НЕ rgba(0,0,0)) --- */
	--shadow-xs: 0 1px 2px rgba(10, 14, 26, 0.06);
	--shadow-sm: 0 2px 8px rgba(10, 14, 26, 0.06);
	--shadow-md: 0 8px 24px rgba(10, 14, 26, 0.08);
	--shadow-lg: 0 18px 48px rgba(10, 14, 26, 0.12);
	--shadow-xl: 0 30px 80px rgba(10, 14, 26, 0.16);
	--shadow-blue:      0 10px 28px rgba(0, 62, 233, 0.28);
	--shadow-blue-lg:   0 18px 44px rgba(0, 62, 233, 0.34);
	--shadow-emergency: 0 10px 28px rgba(229, 52, 43, 0.3);
	--shadow-whatsapp:  0 10px 28px rgba(37, 211, 102, 0.3); /* симметрия к emergency; для WhatsApp-CTA (осознанное отклонение S7) — прототип DS её не имеет */

	/* --- Borders --- */
	--border-hairline: 1px solid var(--border-subtle);
	--border-width: 1px;

	/* --- Motion --- */
	--ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--dur-fast: 0.15s;
	--dur-base: 0.25s;
	--dur-slow: 0.45s;
	--transition-base: all var(--dur-base) var(--ease-out);

	/* --- Focus ring + glass blur --- */
	--focus-ring: 0 0 0 3px rgba(0, 62, 233, 0.35);
	--blur-glass: saturate(180%) blur(14px);
}

.btn-emergency {
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--lockoff-emergency);
	--bs-btn-border-color: var(--lockoff-emergency);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #c32c25;
	--bs-btn-hover-border-color: #c32c25;
	--bs-btn-focus-shadow-rgb: 229, 52, 43;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #b72a22;
	--bs-btn-active-border-color: #b72a22;
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: var(--lockoff-emergency);
	--bs-btn-disabled-border-color: var(--lockoff-emergency);
}

.btn-whatsapp {
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--lockoff-whatsapp);
	--bs-btn-border-color: var(--lockoff-whatsapp);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #1fb357;
	--bs-btn-hover-border-color: #1fb357;
	--bs-btn-focus-shadow-rgb: 37, 211, 102;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #1ea952;
	--bs-btn-active-border-color: #1ea952;
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: var(--lockoff-whatsapp);
	--bs-btn-disabled-border-color: var(--lockoff-whatsapp);
}

/* Заголовки (S8.1) — дословно из :root/base прототипа.
   Размеры per-heading НЕ задаём: секционный заголовок берёт 34px из
   .lo-section__title (app.css); остальные — на дефолтах Bootstrap. */
h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.4em;
	font-family: var(--font-display);
	color: var(--text-strong); /* = #0a0e1a — иначе заголовки посветлеют */
	font-weight: var(--fw-black);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	text-wrap: balance;
}
h4 { font-weight: var(--fw-bold); }

/* Контейнер (гибрид, S8.1). (а) Легаси .container → ширина/поля прототипа
   ОДНИМ правилом (снимает 16 class="container" без переименования сейчас;
   переопределяет адаптивную лесенку Bootstrap, т.к. загружаемся после него).
   (б) Новая обвязка S8.2/8.3 верстается на .lo-container (28px, 18px ≤760). */
.container { max-width: 1320px; --bs-gutter-x: 3.5rem; }

.lo-container {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: 28px;
}
@media (max-width: 760px) {
	.lo-container { padding-inline: 18px; }
}