/* Montserrat — сабсет под кириллицу и латиницу (60 КБ вместо 447) */
@font-face {
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-SemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-ExtraBold.woff2") format("woff2");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

/* =========================================================
   Тамплиер Диджитал — лендинг v2
   Светлая тема, палитра портала, шрифт Montserrat.
   Тёмные секции переопределяют токены локально.
   ========================================================= */

.lv2 {
	/* поверхности: вся страница одного корпоративного тона */
	--bg: #0a3a45;
	--bg-soft: #0a3a45;
	--surface: rgba(255, 255, 255, .05);
	--surface-2: rgba(255, 255, 255, .075);
	--surface-3: rgba(255, 255, 255, .1);

	/* текст */
	--ink: #eef8fb;
	--body: #c2dce4;
	--muted: #a2c4ce;
	--muted-2: #85aab6;

	/* линии и тени */
	--line: rgba(255, 255, 255, .13);
	--line-2: rgba(255, 255, 255, .22);
	--accent-line: rgba(0, 212, 255, .34);
	--shadow-sm: 0 2px 12px rgba(0, 0, 0, .22);
	--shadow: 0 28px 60px -34px rgba(0, 0, 0, .7);
	--shadow-lg: 0 44px 90px -44px rgba(0, 0, 0, .8);

	/* акценты */
	--teal: #56d3ea;
	--teal-dark: #0f6b82;
	--teal-bright: #8ee6f6;
	--cyan: #00c2e0;
	--lime: #b8ff62;
	--lime-bright: #b8ff62;
	--amber: #ffc72c;

	/* Ширина полосы контента: одна на все секции. */
	--content: 1240px;
	--radius: 22px;
	--radius-sm: 14px;
	--ease: cubic-bezier(.22, .61, .36, 1);

	position: relative;
	background: var(--bg);
	color: var(--body);
	font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.6;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

.lv2 *,
.lv2 *::before,
.lv2 *::after { box-sizing: border-box; }

/* Тема задаёт свою типографику блочным темам — возвращаем Montserrat. */
.lv2 h1, .lv2 h2, .lv2 h3, .lv2 h4, .lv2 h5, .lv2 h6,
.lv2 p, .lv2 span, .lv2 a, .lv2 li, .lv2 div, .lv2 td, .lv2 th,
.lv2 button, .lv2 input, .lv2 select, .lv2 textarea {
	font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
}

.lv2 :where(h1, h2, h3, h4, h5) {
	margin: 0;
	font-weight: 700;
	line-height: 1.16;
	letter-spacing: -.02em;
	color: var(--ink);
}

.lv2 :where(p) { margin: 0; }
.lv2 :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
.lv2 :where(li) { color: inherit; }
.lv2 :where(a) { color: inherit; text-decoration: none; }
.lv2 :where(button) { font: inherit; color: inherit; }
.lv2 :where(img) { max-width: 100%; display: block; }
.lv2 :where(svg.tdi) { width: 24px; height: 24px; flex: none; }

.lv2-container {
	width: min(var(--content), 100% - 44px);
	margin-inline: auto;
}

/* --------------------------------------------------------
   Прогресс скролла
   -------------------------------------------------------- */
.lv2-progress {
	position: fixed;
	inset: 0 0 auto 0;
	height: 2px;
	z-index: 90;
	background: rgba(6, 36, 46, .08);
}
.lv2-progress__bar {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--teal), var(--cyan));
	transition: width .12s linear;
}

/* --------------------------------------------------------
   Шапка
   -------------------------------------------------------- */
.lv2-header {
	position: fixed;
	top: 2px;
	left: 0;
	right: 0;
	z-index: 80;
	padding: 14px 0;
	border-bottom: 1px solid transparent;
	transition: background .4s var(--ease), backdrop-filter .4s var(--ease), padding .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-header.is-stuck { padding: 10px 0; }
.lv2-header__inner {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 6px 6px 6px 4px;
	border: 1px solid transparent;
	border-radius: 999px;
	transition: background .4s var(--ease), border-color .4s var(--ease),
	            box-shadow .4s var(--ease), padding .4s var(--ease),
	            backdrop-filter .4s var(--ease);
}
/* При прокрутке шапка отрывается от края и превращается в плашку */
.lv2-header.is-stuck .lv2-header__inner {
	padding: 8px 14px 8px 18px;
	background: rgba(10, 58, 69, .82);
	border-color: var(--line);
	backdrop-filter: blur(18px);
	box-shadow: 0 18px 40px -26px rgba(0, 0, 0, .9);
}
.lv2-header__logo { flex: none; display: block; }
.lv2-header__logo img {
	height: 34px;
	width: auto;
	max-width: none;
	transition: opacity .3s var(--ease);
}
.lv2-header__logo:hover img { opacity: .8; }

/* Меню — капсула с бегунком: подсветка едет за курсором,
   а без курсора возвращается к разделу, который сейчас на экране. */
.lv2-nav {
	position: relative;
	display: flex;
	gap: 4px;
	margin-inline: auto;
	padding: 4px;
	border-radius: 999px;
	border: 1px solid transparent;
	white-space: nowrap;
	transition: background .4s var(--ease), border-color .4s var(--ease);
}
.lv2-header.is-stuck .lv2-nav {
	background: rgba(255, 255, 255, .04);
	border-color: var(--line);
}

.lv2-nav__link {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	/* Крупнее шрифт и просторнее кнопка: по пункту проще попасть,
	   а меню перестаёт выглядеть служебной строкой. */
	padding: 9px 14px;
	border-radius: 12px;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--muted);
	transition: color .25s var(--ease), background .25s var(--ease);
}
.lv2-nav__link:hover { color: var(--ink); background: rgba(255, 255, 255, .07); }
.lv2-nav__link:focus-visible { outline: 2px solid rgba(184, 255, 98, .6); outline-offset: 2px; }
/* Тонкая лаймовая черта под текущим разделом. */
.lv2-nav__link.is-active { color: var(--ink); font-weight: 600; }
.lv2-nav__link.is-active::after {
	content: '';
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 4px;
	height: 2px;
	border-radius: 2px;
	background: var(--lime);
}

/* --------------------------------------------------------
   Супер-меню: панель раскрывается под шапкой
   -------------------------------------------------------- */
.lv2-nav__group { display: flex; }
.lv2-nav__link--has-menu {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	appearance: none;
	-webkit-appearance: none;
	border: 0;
	background: none;
	font-family: inherit;
	cursor: pointer;
}
.lv2-nav__link--has-menu svg {
	width: 13px;
	height: 13px;
	opacity: .6;
	transition: transform .25s var(--ease), opacity .25s var(--ease);
}
.lv2-nav__group.is-open .lv2-nav__link--has-menu {
	color: var(--ink);
	background: rgba(184, 255, 98, .12);
}
.lv2-nav__group.is-open .lv2-nav__link--has-menu svg { transform: rotate(180deg); opacity: 1; color: var(--lime); }

/* Панель висит под всем меню и центрируется по нему —
   так широкая раскладка не уезжает за край экрана. */
/* Панель привязана к своей кнопке. */
.lv2-nav__group { position: relative; }

.lv2-mega {
	position: absolute;
	top: calc(100% + 12px);
	left: 50%;
	z-index: 90;
	width: min(560px, calc(100vw - 44px));
	/* В меню строки не переносятся — панели это правило не касается. */
	white-space: normal;
	/* Сдвиг вдоль экрана считает скрипт: панель центрирована по своей
	   кнопке и без него уезжает за край, когда кнопка с краю. */
	transform: translate(calc(-50% + var(--lv2-shift, 0px)), -6px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s var(--ease), transform .24s var(--ease), visibility .24s;
}
/* Ширина панели зависит от числа колонок. */
.lv2-mega--c1 { width: min(340px, calc(100vw - 44px)); }
.lv2-mega--c2 { width: min(560px, calc(100vw - 44px)); }
.lv2-mega--c3 { width: min(760px, calc(100vw - 44px)); }
/* Панель у правого края шапки прижимается к нему, а не центрируется. */
.lv2-mega--right { left: auto; right: 0; transform: translate(0, -6px); }
.lv2-mega[hidden] { display: block; }         /* прячем стилями, а не разметкой */
.lv2-nav__group.is-open .lv2-mega { opacity: 1; visibility: visible; transform: translate(calc(-50% + var(--lv2-shift, 0px)), 0); }
/* Правая панель не центрируется по кнопке — правило раскрытия идёт
   ниже общего, иначе оно сдвигало её на половину ширины влево. */
.lv2-nav__group.is-open .lv2-mega--right { transform: none; }
/* Мостик под кнопкой: курсор доходит до панели через зазор. */
.lv2-mega::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: -14px;
	height: 14px;
}

/* Телефон и кнопка «Связаться» в правой части шапки. */
.lv2-header__phone {
	color: var(--ink);
	font-size: 14.5px;
	font-weight: 600;
	white-space: nowrap;
	transition: color .25s var(--ease);
}
.lv2-header__phone:hover { color: var(--lime); }
.lv2-header__contact { position: relative; }
.lv2-header__contact .lv2-nav__link--has-menu { gap: 8px; }
.lv2-header__contact .lv2-nav__link--has-menu svg { width: 13px; height: 13px; opacity: .7; transition: transform .25s var(--ease); }
.lv2-header__contact.is-open .lv2-nav__link--has-menu svg { transform: rotate(180deg); }

.lv2-mega__inner {
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background: rgba(9, 47, 57, .98);
	backdrop-filter: blur(18px);
	box-shadow: 0 26px 60px -28px rgba(0, 0, 0, .9);
}

.lv2-mega__list {
	display: grid;
	grid-template-columns: repeat(var(--lv2-mega-cols, 2), minmax(0, 1fr));
	gap: 2px;
}
.lv2-mega__item {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	/* Без этого длинные описания распирают колонку сетки. */
	min-width: 0;
	padding: 10px 12px;
	border-radius: 12px;
	transition: background .2s var(--ease);
}
.lv2-mega__item:hover { background: rgba(255, 255, 255, .07); }
/* Пункты услуг — кнопки-модалки, сбрасываем кнопочные умолчания. */
button.lv2-mega__item { width: 100%; border: 0; background: none; font: inherit; text-align: left; cursor: pointer; }
.lv2-mega__icon {
	display: grid;
	place-items: center;
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .06);
	color: var(--teal);
	transition: color .2s var(--ease), background .2s var(--ease);
}
.lv2-mega__icon svg { width: 17px; height: 17px; }
.lv2-mega__item:hover .lv2-mega__icon { color: var(--lime); background: rgba(184, 255, 98, .14); }
.lv2-mega__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lv2-mega__text b { color: var(--ink); font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
/* Описание — максимум две строки: панель держит ровную высоту. */
.lv2-mega__text i {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	color: var(--muted-2);
	font-size: 12px;
	font-style: normal;
	line-height: 1.4;
	overflow-wrap: anywhere;
}

/* Ссылка на раздел целиком — внизу панели. */
.lv2-mega__all {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 8px;
	padding: 11px;
	border-top: 1px solid var(--line);
	color: var(--teal);
	font-size: 13px;
	font-weight: 600;
	transition: color .25s var(--ease), gap .25s var(--ease);
}
.lv2-mega__all svg { width: 15px; height: 15px; }
button.lv2-mega__all { width: 100%; border: 0; border-top: 1px solid var(--line); background: none; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.lv2-mega__all:hover { color: var(--lime); gap: 12px; }

@media (max-width: 1360px) {
	.lv2-header__phone { display: none; }
}

/* Ниже 1180px супер-меню не помещается — уходим в бургер.
   Селектор с [hidden] нужен, чтобы перебить правило показа выше.
   Панель «Связаться» живёт не в меню, а в шапке, и её кнопка на
   телефоне остаётся — поэтому прячем только панели навигации. */
@media (max-width: 1180px) {
	.lv2-nav .lv2-mega,
	.lv2-nav .lv2-mega[hidden] { display: none; }

	/* Кнопка «Связаться» стоит почти у края, и панель, прижатая к ней,
	   уезжала бы влево за экран: на узких экранах ставим её во всю ширину
	   под шапкой. */
	.lv2-header__contact .lv2-mega {
		position: fixed;
		top: 84px;
		left: 14px;
		right: 14px;
		width: auto;
		transform: translateY(-6px);
	}
	.lv2-nav__group.lv2-header__contact.is-open .lv2-mega { transform: none; }
}

/* Группы в мобильном меню. */

.lv2-mobilenav__grouptitle {
	display: block;
	margin: 14px 0 6px;
	color: var(--muted-2);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.lv2-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: none;
}
.lv2-iconbtn {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid var(--line-2);
	background: var(--surface);
	color: var(--teal);
	transition: color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease), background .25s var(--ease);
}
.lv2-iconbtn svg { width: 19px; height: 19px; }
.lv2-iconbtn:hover {
	color: #fff;
	background: var(--teal);
	border-color: var(--teal);
	transform: translateY(-2px);
}

.lv2-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 0 9px;
	border-radius: 12px;
	border: 1px solid var(--line-2);
	background: var(--surface);
	cursor: pointer;
}
.lv2-burger span {
	display: block;
	height: 1.8px;
	background: var(--ink);
	border-radius: 2px;
	transition: transform .3s var(--ease), opacity .2s var(--ease);
}
.lv2-burger.is-open span:nth-child(1) { transform: translateY(6.8px) rotate(45deg); }
.lv2-burger.is-open span:nth-child(2) { opacity: 0; }
.lv2-burger.is-open span:nth-child(3) { transform: translateY(-6.8px) rotate(-45deg); }

.lv2-mobilenav {
	position: fixed;
	inset: 0;
	z-index: 79;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 26px;
	padding: 90px 28px 40px;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: blur(20px);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-12px);
	transition: opacity .35s var(--ease), transform .35s var(--ease), visibility .35s;
}
.lv2-mobilenav.is-open { opacity: 1; visibility: visible; transform: none; }
.lv2-mobilenav nav { display: flex; flex-direction: column; gap: 4px; }
.lv2-mobilenav nav a,
.lv2-mobilenav nav button {
	display: block;
	padding: 12px 0;
	font-size: 18px;
	font-weight: 600;
	color: var(--ink);
	border-bottom: 1px solid var(--line);
}
.lv2-mobilenav nav button { width: 100%; border-top: 0; border-left: 0; border-right: 0; background: none; font-family: inherit; text-align: left; cursor: pointer; }
/* Меню длинное: даём прокрутку и убираем центрирование по высоте. */
.lv2-mobilenav { justify-content: flex-start; overflow-y: auto; }
.lv2-mobilenav__group { display: flex; flex-direction: column; }
.lv2-mobilenav__actions { display: flex; flex-direction: column; gap: 10px; padding-bottom: 20px; }

/* --------------------------------------------------------
   Кнопки
   -------------------------------------------------------- */
.lv2-btn {
	position: relative;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 26px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: transform .25s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.lv2-btn svg { width: 18px; height: 18px; transition: transform .3s var(--ease); }
.lv2-btn:hover { transform: translateY(-2px); }
.lv2-btn:hover svg { transform: translateX(3px); }
.lv2-btn:active { transform: translateY(0); }

/* Залитая кнопка всегда одна и та же — фирменный лайм. */
.lv2-btn--primary,
.lv2-btn--lime {
	background: var(--lime-bright);
	color: #16320a;
	box-shadow: 0 14px 30px -16px rgba(120, 190, 40, .85);
}
.lv2-btn--primary:hover,
.lv2-btn--lime:hover { box-shadow: 0 20px 38px -16px rgba(120, 190, 40, .95); }

.lv2-btn--outline {
	border-color: var(--line-2);
	background: var(--surface);
	color: var(--ink);
	box-shadow: var(--shadow-sm);
}
.lv2-btn--outline:hover { border-color: var(--teal); color: var(--teal); }

.lv2-btn--ghost {
	border-color: var(--line-2);
	background: transparent;
	color: var(--muted);
}
.lv2-btn--ghost:hover { color: var(--teal); border-color: var(--teal); }

/* Кнопки внутри тёмных секций */
.lv2-guide .lv2-btn--outline,
.lv2-final .lv2-btn--outline,
.lv2-promo .lv2-btn--outline {
	background: rgba(255, 255, 255, .1);
	color: #fff;
	border-color: rgba(255, 255, 255, .3);
	box-shadow: none;
}
.lv2-guide .lv2-btn--outline:hover,
.lv2-final .lv2-btn--outline:hover,
.lv2-promo .lv2-btn--outline:hover {
	background: rgba(255, 255, 255, .18);
	color: #fff;
	border-color: #fff;
}

.lv2-btn--sm { padding: 11px 18px; font-size: 13.5px; }
.lv2-btn--lg { padding: 18px 34px; font-size: 16px; }
.lv2-btn--block { width: 100%; }

.lv2-linkbtn {
	border: 0;
	background: none;
	padding: 0;
	color: var(--teal);
	font-weight: 600;
	cursor: pointer;
	border-bottom: 1px solid var(--accent-line);
}
.lv2-linkbtn:hover { border-bottom-color: var(--teal); }

/* --------------------------------------------------------
   Секции и заголовки
   -------------------------------------------------------- */
.lv2-section {
	position: relative;
	padding: clamp(42px, 4.6vw, 72px) 0;
}

.lv2-head {
	max-width: 780px;
	margin: 0 auto clamp(24px, 2.6vw, 38px);
	text-align: center;
}
.lv2-head--left { margin-inline: 0; text-align: left; }
.lv2-head__tag {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 15px 7px 11px;
	margin-bottom: 18px;
	border: 1px solid var(--accent-line);
	border-radius: 999px;
	background: rgba(0, 122, 148, .08);
	color: var(--teal);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
}
.lv2-head__tag svg { width: 16px; height: 16px; }
.lv2-head__title { font-size: clamp(29px, 4vw, 50px); }
.lv2-head__lead {
	margin-top: 16px;
	color: var(--muted);
	font-size: clamp(15px, 1.4vw, 17.5px);
}

.lv2-kicker {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 8px 17px 8px 12px;
	border: 1px solid rgba(201, 133, 0, .3);
	border-radius: 999px;
	background: rgba(255, 199, 44, .16);
	color: var(--amber);
	font-size: 13px;
	font-weight: 600;
}
.lv2-kicker svg { width: 17px; height: 17px; }
.lv2-kicker--lime {
	border-color: rgba(184, 255, 98, .4);
	background: rgba(184, 255, 98, .14);
	color: var(--lime-bright);
}

/* --------------------------------------------------------
   Появление при скролле
   -------------------------------------------------------- */
.lv2-reveal {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity .8s var(--ease), transform .8s var(--ease);
	transition-delay: var(--lv2-delay, 0ms);
}
.lv2-reveal.is-in { opacity: 1; transform: none; }

.lv2-word {
	display: inline-block;
	opacity: 0;
	transform: translateY(.45em);
	transition: opacity .7s var(--ease), transform .7s var(--ease);
	transition-delay: calc(var(--i, 0) * 55ms);
}
.is-in .lv2-word { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.lv2-reveal, .lv2-word { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* --------------------------------------------------------
   Hero
   -------------------------------------------------------- */
.lv2-hero {
	position: relative;
	min-height: min(100svh, 900px);
	display: flex;
	align-items: center;
	padding: 148px 0 96px;
	overflow: hidden;
	background:
		radial-gradient(980px 620px at 74% 24%, rgba(0, 168, 200, .2), transparent 62%),
		radial-gradient(720px 520px at 3% 80%, rgba(0, 122, 148, .12), transparent 64%),
		linear-gradient(168deg, #ffffff 0%, #eef6f9 54%, var(--bg) 100%);
}
.lv2-hero__canvas {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	/* Сцена живёт в той же полосе, что и контент, плюс небольшой
	   вылет: на широком мониторе знак не убегает к краю экрана. */
	/* Холст шире экрана: его границы уходят за края и не видны.
	   Знак при этом стоит по правому краю полосы контента —
	   его позицию считает scenes.js, а не ширина холста. */
	width: 132vw;
	height: 100%;
	transform: translateX(-50%);
}
.lv2-hero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .9) 34%, rgba(255, 255, 255, .35) 52%, rgba(255, 255, 255, 0) 70%);
	pointer-events: none;
}
.lv2-hero__inner { position: relative; z-index: 2; }
.lv2-hero__content { max-width: min(760px, 64%); }
.lv2-hero__title {
	margin: 0;
	font-size: clamp(31px, 4.2vw, 50px);
	font-weight: 800;
	letter-spacing: -.03em;
	color: var(--ink);
}
.lv2-hero__lead {
	margin-top: 24px;
	max-width: 560px;
	font-size: clamp(16px, 1.6vw, 19px);
	color: var(--body);
}
.lv2-hero__sub {
	margin-top: 10px;
	color: var(--muted);
	font-size: 16px;
}
.lv2-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 34px;
}
.lv2-hero__marks {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 26px;
	margin-top: 42px;
	padding-top: 24px;
	border-top: 1px solid var(--line);
}
.lv2-hero__marks li {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--muted);
	font-size: 13.5px;
}
.lv2-hero__marks svg { width: 19px; height: 19px; color: var(--teal); }

.lv2-hero__scroll {
	position: absolute;
	left: 50%;
	bottom: 26px;
	transform: translateX(-50%);
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid var(--line-2);
	color: var(--teal);
	background: rgba(255, 255, 255, .85);
	z-index: 3;
	animation: lv2-bob 2.4s ease-in-out infinite;
}
@keyframes lv2-bob {
	0%, 100% { transform: translate(-50%, 0); }
	50% { transform: translate(-50%, 8px); }
}

/* --------------------------------------------------------
   Цифры
   -------------------------------------------------------- */
.lv2-stats {
	position: relative;
	padding: 40px 0;
	background: var(--surface);
	border-block: 1px solid var(--line);
}
.lv2-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}
/* Каждый факт — отдельная плитка: строка перестаёт быть набором
   парящих в пустоте цифр. Высота строки со значением фиксирована,
   поэтому подписи во всех четырёх плитках стоят на одной линии,
   хотя «Золотой» набран мельче цифр. */
.lv2-stat {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 26px 24px 24px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: linear-gradient(178deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015));
	text-align: left;
	transition: border-color .45s var(--ease), background .45s var(--ease), transform .45s var(--ease);
}
.lv2-stat:hover {
	transform: translateY(-3px);
	border-color: rgba(184, 255, 98, .3);
	background: linear-gradient(178deg, rgba(184, 255, 98, .09), rgba(255, 255, 255, .02));
}
.lv2-stat__value {
	display: flex;
	align-items: flex-end;
	gap: 4px;
	min-height: clamp(38px, 3.6vw, 48px);
	padding-right: 42px;
	font-size: clamp(30px, 3.2vw, 42px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--lime);
	font-variant-numeric: tabular-nums;
}
.lv2-stat__suffix { font-size: .58em; font-weight: 700; opacity: .78; }
/* Словесное значение («Золотой») набираем мельче: иначе оно
   перевешивает цифры и ряд разваливается. */
.lv2-stat--text .lv2-stat__value {
	font-size: clamp(21px, 2vw, 27px);
	letter-spacing: -.01em;
	padding-bottom: 3px;
}
.lv2-stat__label {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.45;
}

/* --------------------------------------------------------
   Боли → решения (флип)
   -------------------------------------------------------- */
/* --------------------------------------------------------
   Услуги
   -------------------------------------------------------- */
/* --------------------------------------------------------
   Что мы делаем: папки
   Корешки стоят в ряд, активная разворачивается. Ширина
   анимируется только через flex-grow — шорткат flex здесь
   залипает. Содержимое въезжает ступеньками, по папке один
   раз пробегает блик.
   -------------------------------------------------------- */
.lv2-fold {
	display: flex;
	gap: 6px;
	align-items: stretch;
	min-height: 400px;
}
.lv2-fold__f {
	position: relative;
	flex: 0 1 48px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: linear-gradient(178deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .018));
	cursor: pointer;
	overflow: hidden;
	outline: none;
	transition: flex-grow .62s cubic-bezier(.22, .85, .25, 1), transform .45s var(--ease),
		background .5s var(--ease), border-color .5s var(--ease);
}
/* Кант слева вырастает сверху вниз, а не просто проявляется. */
.lv2-fold__f::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: linear-gradient(180deg, var(--lime), rgba(184, 255, 98, .25));
	transform: scaleY(0);
	transform-origin: top;
	transition: transform .6s cubic-bezier(.22, .85, .25, 1);
}
/* Блик пробегает по папке один раз в момент раскрытия. */
.lv2-fold__f::after {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0;
	background: linear-gradient(102deg, transparent 32%, rgba(255, 255, 255, .13) 48%, transparent 64%);
	background-size: 260% 100%;
}
.lv2-fold__f:hover {
	background: linear-gradient(178deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .03));
	transform: translateY(-3px);
}
.lv2-fold__f:hover .lv2-fold__spine i { color: var(--teal); }
.lv2-fold__f.is-on {
	flex-grow: 1;
	transform: none;
	border-color: rgba(184, 255, 98, .34);
	background: linear-gradient(150deg, rgba(184, 255, 98, .15), rgba(15, 107, 130, .22) 55%, rgba(255, 255, 255, .02));
}
.lv2-fold__f.is-on::before { transform: scaleY(1); }
.lv2-fold__f.is-on::after { animation: lv2-fold-sheen .95s cubic-bezier(.3, .7, .3, 1) .1s; }
.lv2-fold__f:focus-visible { border-color: rgba(184, 255, 98, .6); }

@keyframes lv2-fold-sheen {
	0%   { opacity: 0; background-position: 130% 0; }
	22%  { opacity: 1; }
	100% { opacity: 0; background-position: -30% 0; }
}

.lv2-fold__spine {
	position: absolute;
	left: 0;
	top: 0;
	width: 48px;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 18px 0 20px;
}
.lv2-fold__no {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .06em;
	color: var(--muted-2);
	transition: color .4s var(--ease);
}
.lv2-fold__spine b {
	writing-mode: vertical-rl;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color .4s var(--ease);
}
.lv2-fold__spine i {
	display: block;
	width: 22px;
	height: 22px;
	margin-top: auto;
	color: var(--muted-2);
	flex: none;
	transition: color .4s var(--ease), transform .5s cubic-bezier(.3, 1.4, .5, 1);
}
.lv2-fold__spine i svg { width: 100%; height: 100%; display: block; }
.lv2-fold__f.is-on .lv2-fold__no,
.lv2-fold__f.is-on .lv2-fold__spine b { color: var(--ink); }
.lv2-fold__f.is-on .lv2-fold__spine i { color: var(--lime); transform: scale(1.16); }

.lv2-fold__body {
	position: absolute;
	left: 48px;
	top: 0;
	width: min(500px, 40vw);
	height: 100%;
	padding: 34px 30px 30px 12px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	pointer-events: none;
}
.lv2-fold__f.is-on .lv2-fold__body { pointer-events: auto; }
/* Содержимое въезжает ступеньками: рубрика, заголовок, текст, кнопка. */
.lv2-fold__body > * {
	opacity: 0;
	transform: translate3d(-18px, 0, 0);
	transition: opacity .45s var(--ease), transform .55s cubic-bezier(.22, .85, .25, 1);
}
.lv2-fold__f.is-on .lv2-fold__body > * { opacity: 1; transform: none; }
.lv2-fold__f.is-on .lv2-fold__body > :nth-child(1) { transition-delay: .14s; }
.lv2-fold__f.is-on .lv2-fold__body > :nth-child(2) { transition-delay: .2s; }
.lv2-fold__f.is-on .lv2-fold__body > :nth-child(3) { transition-delay: .26s; }
.lv2-fold__f.is-on .lv2-fold__body > :nth-child(4) { transition-delay: .32s; }

.lv2-fold__tag {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 12px;
	border: 1px solid rgba(184, 255, 98, .32);
	border-radius: 999px;
	background: rgba(184, 255, 98, .1);
	color: var(--lime);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.lv2-fold__body h3 { margin: 16px 0 10px; font-size: 27px; line-height: 1.18; max-width: 16ch; }
.lv2-fold__body p { margin: 0; color: var(--body); font-size: 14.5px; max-width: 40ch; }
.lv2-fold__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	padding: 11px 20px;
	border: 0;
	border-radius: 999px;
	background: var(--lime);
	color: #0a3a45;
	font: inherit;
	font-size: 13.5px;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 0 0 0 rgba(184, 255, 98, .35);
	transition: opacity .45s var(--ease), transform .55s cubic-bezier(.22, .85, .25, 1), box-shadow .35s var(--ease);
}
.lv2-fold__cta:hover { box-shadow: 0 10px 26px -8px rgba(184, 255, 98, .6); }
.lv2-fold__cta span { display: inline-flex; width: 16px; height: 16px; transition: transform .35s var(--ease); }
.lv2-fold__cta span svg { width: 100%; height: 100%; }
.lv2-fold__cta:hover span { transform: translateX(4px); }
.lv2-fold__big {
	position: absolute;
	right: 24px;
	bottom: 8px;
	font-size: 104px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.05em;
	color: rgba(255, 255, 255, .05);
	pointer-events: none;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .6s var(--ease), transform .7s cubic-bezier(.22, .85, .25, 1);
}
.lv2-fold__f.is-on .lv2-fold__big { opacity: 1; transform: none; transition-delay: .1s; }

@media (max-width: 1240px) {
	.lv2-fold__body { width: min(360px, 32vw); padding: 26px 20px 24px 10px; }
	.lv2-fold__body h3 { font-size: 21px; }
	.lv2-fold__body p { font-size: 13.5px; }
	.lv2-fold__big { font-size: 74px; }
}

/* Узкий экран: обычная вертикальная гармошка. */
@media (max-width: 1000px) {
	.lv2-fold { flex-direction: column; min-height: 0; }
	.lv2-fold__f { flex: none; }
	.lv2-fold__f:hover { transform: none; }
	.lv2-fold__spine {
		position: static;
		width: auto;
		height: auto;
		flex-direction: row;
		align-items: center;
		gap: 12px;
		padding: 16px 18px;
	}
	.lv2-fold__spine b { writing-mode: horizontal-tb; font-size: 15px; }
	.lv2-fold__spine i { margin: 0 0 0 auto; }
	.lv2-fold__body {
		position: static;
		width: auto;
		height: auto;
		padding: 0 18px 22px;
		display: none;
	}
	.lv2-fold__f.is-on .lv2-fold__body { display: flex; }
	.lv2-fold__body h3 { margin: 8px 0 6px; font-size: 20px; max-width: none; }
	.lv2-fold__body p { max-width: none; }
	.lv2-fold__cta { margin-top: 14px; }
	.lv2-fold__big { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.lv2-fold__f,
	.lv2-fold__f::before,
	.lv2-fold__body > *,
	.lv2-fold__big { transition: none; }
	.lv2-fold__f.is-on::after { animation: none; }
}

.lv2-services__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}
.lv2-service {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 13px;
	padding: 28px 24px 24px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	transform-style: preserve-3d;
	transition: border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-service:hover {
	border-color: var(--accent-line);
	box-shadow: var(--shadow);
}
.lv2-service__glow {
	position: absolute;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(0, 168, 200, .16), transparent 66%);
	left: var(--mx, 50%);
	top: var(--my, 0%);
	transform: translate(-50%, -50%);
	opacity: 0;
	transition: opacity .4s var(--ease);
	pointer-events: none;
}
.lv2-service:hover .lv2-service__glow { opacity: 1; }
.lv2-service__icon {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 15px;
	background: linear-gradient(140deg, rgba(0, 122, 148, .14), rgba(0, 194, 224, .08));
	border: 1px solid var(--accent-line);
	color: var(--teal);
	transform: translateZ(28px);
}
.lv2-service__title { font-size: 17.5px; transform: translateZ(18px); }
.lv2-service__text { color: var(--muted); font-size: 14px; line-height: 1.55; }
.lv2-service__link {
	margin-top: auto;
	padding: 0;
	border: 0;
	background: none;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--teal);
	font-size: 13.5px;
	font-weight: 600;
	cursor: pointer;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.lv2-service__link svg { width: 16px; height: 16px; }
.lv2-service:hover .lv2-service__link,
/* Ссылка «Подробнее» открыта до наведения, когда её выбрали с клавиатуры. */
.lv2-service__link:focus-visible { opacity: 1; transform: none; }

/* --------------------------------------------------------
   Процесс
   -------------------------------------------------------- */
.lv2-process { background: var(--bg-soft); }
.lv2-process__stage { position: relative; }
.lv2-process__layout {
	display: grid;
	grid-template-columns: 0.95fr 1.05fr;
	gap: 56px;
	align-items: start;
}
.lv2-process__visual {
	position: sticky;
	top: 108px;
	aspect-ratio: 1 / 1;
	border: 1px solid rgba(6, 36, 46, .18);
	border-radius: 28px;
	background:
		radial-gradient(circle at 50% 42%, rgba(0, 168, 200, .22), transparent 64%),
		linear-gradient(160deg, #093040, #05202b 70%);
	box-shadow: var(--shadow);
	overflow: hidden;
}
.lv2-process__visual canvas { width: 100%; height: 100%; display: block; }
.lv2-process__counter {
	position: absolute;
	left: 26px;
	bottom: 22px;
	z-index: 2;
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-weight: 800;
	font-size: 40px;
	letter-spacing: -.03em;
	color: var(--teal);
}
.lv2-process__counter { color: #7fe3f5; }
.lv2-process__counter-total { font-size: 16px; color: rgba(232, 246, 250, .55); font-weight: 600; }

.lv2-process__list { display: flex; flex-direction: column; gap: 14px; }
.lv2-process__item {
	display: flex;
	gap: 20px;
	padding: 26px 26px 26px 22px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	/* Клик по соседней карточке прокручивает ленту к её этапу. */
	cursor: pointer;
	opacity: .55;
	transform: translateX(12px);
	transition: opacity .5s var(--ease), transform .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease);
}
.lv2-process__item.is-active {
	cursor: default;
	opacity: 1;
	transform: none;
	border-color: var(--accent-line);
	box-shadow: var(--shadow);
}
.lv2-process__num {
	font-size: 15px;
	font-weight: 800;
	color: var(--muted-2);
	letter-spacing: .04em;
	padding-top: 3px;
}
.lv2-process__item.is-active .lv2-process__num { color: var(--teal); }
.lv2-process__body h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 20px;
	margin-bottom: 9px;
}
.lv2-process__body h3 svg { width: 21px; height: 21px; color: var(--teal); }
.lv2-process__body p { color: var(--muted); font-size: 14.5px; }
.lv2-process__result {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 7px 14px 7px 10px;
	border-radius: 999px;
	background: rgba(120, 190, 40, .12);
	border: 1px solid rgba(120, 190, 40, .28);
	color: var(--lime);
	font-size: 12.5px;
	font-weight: 600;
}
.lv2-process__result svg { width: 15px; height: 15px; }

/* --------------------------------------------------------
   Отрасли: широкие строки
   -------------------------------------------------------- */
/* --------------------------------------------------------
   Отраслевая экспертиза: горизонтальная гармошка
   Открытая отрасль разворачивается на всю ширину, соседние
   стоят корешками. На узком экране — обычный аккордеон.
   -------------------------------------------------------- */
.lv2-ind {
	display: flex;
	gap: 12px;
	/* Высота — по содержимому открытой полосы: её контент лежит
	   в потоке, у свёрнутых вынут из него. Прокрутки внутри нет,
	   а смену высоты плавно ведёт landing.js. */
	align-items: stretch;
	min-height: 420px;
	/* Ширина и высота идут одной кривой: раскрытие читается
	   как единое спокойное движение. */
	transition: height .62s cubic-bezier(.22, .85, .25, 1);
}

/* Пока скрипт считает целевую высоту, переходы выключены —
   иначе замер попадает в середину анимации. */
.lv2-ind.is-measuring,
.lv2-ind.is-measuring * { transition: none !important; }

.lv2-ind__panel {
	position: relative;
	/* Раскрытие как в блоке команды: все полосы равны, активная
	   растёт по flex-grow с длинной мягкой кривой. */
	flex: 1 1 0;
	min-width: 0;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	overflow: hidden;
	transition: flex-grow .62s cubic-bezier(.22, .85, .25, 1), background .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-ind__panel:hover { border-color: var(--accent-line); background: rgba(255, 255, 255, .07); }
.lv2-ind__panel.is-open {
	flex-grow: 13;
	border-color: rgba(184, 255, 98, .35);
	background:
		radial-gradient(80% 120% at 100% 0%, rgba(0, 194, 224, .12), transparent 62%),
		linear-gradient(150deg, rgba(184, 255, 98, .08), rgba(255, 255, 255, .04));
}

/* Корешок закрытой панели: иконка и название вертикально. */
.lv2-ind__spine {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	width: 100%;
	padding: 22px 0;
	appearance: none;
	-webkit-appearance: none;
	border: 0;
	background: none;
	color: var(--ink);
	font-family: inherit;
	cursor: pointer;
	transition: opacity .4s var(--ease);
}
/* Корешок уступает место содержимому, но не пропадает рывком. */
.lv2-ind__panel.is-open .lv2-ind__spine { opacity: 0; pointer-events: none; transition: opacity .18s var(--ease); }
.lv2-ind__spinetitle {
	writing-mode: vertical-rl;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .01em;
	white-space: nowrap;
}
.lv2-ind__spinenum { margin-top: auto; color: var(--muted-2); font-size: 12px; font-weight: 700; }

/* Свёрнутые панели держат содержимое вне потока — иначе текст в
   узкой колонке растягивал бы всю гармошку. У открытой контент
   возвращается в поток и сам задаёт высоту блока. */
.lv2-ind__content {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	padding: clamp(22px, 2.4vw, 32px);
	overflow: hidden;
	opacity: 0;
	transition: opacity .22s var(--ease);
	pointer-events: none;
}

/* Строки выходят по очереди — раскрытие читается как одно движение. */
.lv2-ind__head,
.lv2-ind__lead,
.lv2-ind__clients,
.lv2-ind__foot {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .18s var(--ease), transform .18s var(--ease);
}
.lv2-ind__panel.is-open .lv2-ind__head,
.lv2-ind__panel.is-open .lv2-ind__lead,
.lv2-ind__panel.is-open .lv2-ind__clients,
.lv2-ind__panel.is-open .lv2-ind__foot {
	opacity: 1;
	transform: none;
	transition: opacity .38s var(--ease), transform .5s cubic-bezier(.22, .61, .36, 1);
}
/* Задержка только на входе: при уходе курсора контент пропадает сразу,
   поэтому быстрый проход по полосам не оставляет мельтешения. */
.lv2-ind__panel.is-open .lv2-ind__head { transition-delay: .12s; }
.lv2-ind__panel.is-open .lv2-ind__lead { transition-delay: .18s; }
.lv2-ind__panel.is-open .lv2-ind__clients { transition-delay: .24s; }
.lv2-ind__panel.is-open .lv2-ind__foot { transition-delay: .3s; }
.lv2-ind__panel.is-open .lv2-ind__content {
	position: static;
	opacity: 1;
	pointer-events: auto;
	transition-delay: .1s;
}

.lv2-ind__head { display: flex; align-items: center; gap: 16px; }
.lv2-ind__title { font-size: clamp(20px, 2vw, 26px); line-height: 1.15; }
.lv2-ind__tag { color: var(--muted-2); font-size: 13px; }
.lv2-ind__num { margin-left: auto; color: var(--muted-2); font-size: 13px; font-weight: 700; letter-spacing: .06em; }

.lv2-ind__lead {
	margin-top: 18px;
	max-width: 860px;
	color: var(--body);
	font-size: clamp(14.5px, 1.35vw, 16.5px);
	line-height: 1.6;
}

.lv2-ind__coltitle {
	display: block;
	margin-bottom: 16px;
	color: var(--muted-2);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

/* Логотипы клиентов отрасли. */
.lv2-ind__clients {
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--line);
}
.lv2-ind__logos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
	gap: 10px;
}
.lv2-ind__logo {
	position: relative;
	display: grid;
	place-items: center;
	height: 68px;
	padding: 10px 14px;
	border: 1px solid var(--line);
	border-radius: 14px;
	background: rgba(255, 255, 255, .03);
	transition: border-color .3s var(--ease), background .3s var(--ease);
}
.lv2-ind__logoimg {
	grid-area: 1 / 1;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	opacity: .72;
	transition: opacity .3s var(--ease);
}
.lv2-ind__logo:hover { border-color: rgba(184, 255, 98, .35); background: rgba(184, 255, 98, .07); }
.lv2-ind__logo:hover .lv2-ind__logoimg { opacity: 1; }

/* Название компании вместо системной подсказки: появляется сразу,
   без задержки браузера, и не спорит со стилем блока. */
.lv2-ind__logo::after {
	content: attr(data-name);
	position: absolute;
	left: 50%;
	bottom: calc(100% + 8px);
	z-index: 4;
	padding: 6px 12px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: rgba(6, 40, 50, .96);
	color: var(--ink);
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	opacity: 0;
	transform: translate(-50%, 4px);
	transition: opacity .2s var(--ease), transform .2s var(--ease);
	pointer-events: none;
}
.lv2-ind__logo:hover::after { opacity: 1; transform: translate(-50%, 0); }

.lv2-ind__foot {
	display: flex;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 22px;
}

/* Узкий экран: гармошка становится вертикальной. */
@media (max-width: 1024px) {
	.lv2-ind { flex-direction: column; height: auto !important; gap: 10px; }
	.lv2-ind__panel { flex: none; }
	.lv2-ind__spine {
		position: static;
		flex-direction: row;
		align-items: center;
		gap: 14px;
		padding: 18px 20px;
		text-align: left;
	}
	.lv2-ind__spinetitle { writing-mode: horizontal-tb; white-space: normal; font-size: 16px; line-height: 1.25; }
	.lv2-ind__spinenum { margin-top: 0; margin-left: auto; }
	.lv2-ind__panel.is-open .lv2-ind__spine { opacity: 1; pointer-events: auto; }
	.lv2-ind__content { position: static; display: none; padding-top: 0; }
	.lv2-ind__panel.is-open .lv2-ind__content { display: flex; }
	.lv2-ind__head { display: none; }
	.lv2-ind__lead { margin-top: 0; }
}

/* --------------------------------------------------------
   Отзывы: колода карточек
   Активная стоит прямо, соседние отклонены, уменьшены и
   приглушены. Переменные --active, --dist и --zIndex
   каждый кадр проставляет landing.js.
   -------------------------------------------------------- */
.lv2-deck {
	position: relative;
	height: min(64vw, 540px);
	margin-top: clamp(26px, 3vw, 42px);
	perspective: 1600px;
	cursor: grab;
	user-select: none;
	-webkit-user-select: none;
	touch-action: pan-y;
}
.lv2-deck:active { cursor: grabbing; }

.lv2-deck__item {
	--width: min(30vw, 344px);
	--height: min(48vw, 460px);
	position: absolute;
	top: 50%;
	left: 50%;
	width: var(--width);
	height: var(--height);
	margin: calc(var(--height) / -2) 0 0 calc(var(--width) / -2);
	z-index: var(--zIndex, 1);
	transform:
		translateX(calc(var(--active, 0) * 64%))
		rotateY(calc(var(--active, 0) * -15deg))
		scale(calc(1 - var(--dist, 0) * 0.09));
	opacity: calc(1 - var(--dist, 0) * 0.42);
	filter: blur(calc(var(--dist, 0) * 1.1px));
	transition: transform .45s var(--ease), opacity .45s var(--ease), filter .45s var(--ease);
	will-change: transform;
}
.lv2-deck__item[aria-hidden="true"] { pointer-events: none; }
.lv2-deck__item[aria-hidden="false"] { pointer-events: auto; }

.lv2-deck__box {
	display: flex;
	flex-direction: column;
	gap: 14px;
	height: 100%;
	padding: 28px 26px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	/* Плотный фон: соседние карточки не просвечивают сквозь активную. */
	background: linear-gradient(160deg, #0d4a59, #0a3a45);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .95);
	overflow: hidden;
}
.lv2-deck__item[aria-hidden="false"] .lv2-deck__box { border-color: var(--accent-line); }

.lv2-deck__avatar {
	display: block;
	flex: none;
	width: 74px;
	height: 74px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(255, 255, 255, .07);
}
.lv2-deck__avatar img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; }

.lv2-deck__content { display: flex; flex-direction: column; min-height: 0; }
.lv2-deck__name { color: var(--ink); font-size: 17px; font-weight: 700; line-height: 1.25; }
.lv2-deck__where { color: var(--muted-2); font-size: 13px; line-height: 1.4; }
.lv2-deck__rating { display: flex; gap: 3px; margin: 12px 0 10px; }
.lv2-deck__rating svg { width: 15px; height: 15px; color: var(--lime-bright); }
.lv2-deck__text {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 6;
	overflow: hidden;
	color: var(--body);
	font-size: 14px;
	line-height: 1.55;
}
.lv2-deck__more {
	align-self: flex-start;
	margin-top: 14px;
	padding: 9px 16px;
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	background: none;
	color: var(--muted);
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: border-color .25s var(--ease), color .25s var(--ease);
}
.lv2-deck__more:hover { border-color: var(--lime); color: var(--lime-bright); }

.lv2-deck__nav {
	position: absolute;
	top: 50%;
	z-index: 60;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	transform: translateY(-50%);
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid var(--line-2);
	border-radius: 50%;
	background: rgba(10, 58, 69, .8);
	backdrop-filter: blur(10px);
	color: var(--ink);
	cursor: pointer;
	transition: border-color .25s var(--ease), color .25s var(--ease), background .25s var(--ease);
}
.lv2-deck__nav svg { width: 20px; height: 20px; }
.lv2-deck__nav:hover { border-color: var(--lime); color: var(--lime-bright); }
.lv2-deck__nav--prev { left: clamp(4px, 3vw, 40px); }
.lv2-deck__nav--next { right: clamp(4px, 3vw, 40px); }

/* Кнопки под колодой. */
.lv2-cases__actions {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: clamp(26px, 3vw, 40px);
}

@media (max-width: 1024px) {
	.lv2-deck__item { --width: min(56vw, 380px); --height: min(78vw, 470px); }
}

/* --------------------------------------------------------
   Клиенты: сфера логотипов
   Знаки расставлены по сфере спиралью Фибоначчи, позиции
   каждый кадр считает landing.js. Шар крутится сам, тянется
   мышью и листается колесом.
   -------------------------------------------------------- */
.lv2-clients { position: relative; overflow: hidden; }

.lv2-orb {
	position: relative;
	width: 100%;
	max-width: 900px;
	aspect-ratio: 1 / 1;
	max-height: 640px;
	margin: clamp(6px, 1.5vw, 18px) auto 0;
	perspective: 900px;
	cursor: grab;
	/* Перетаскивание не должно выделять подписи и таскать картинки. */
	user-select: none;
	-webkit-user-select: none;
	touch-action: none;
}
.lv2-orb:active { cursor: grabbing; }

/* Свечение в центре шара — даёт объём. */
.lv2-orb__core {
	position: absolute;
	inset: 20%;
	border-radius: 50%;
	background:
		radial-gradient(circle at 50% 50%, rgba(0, 194, 224, .2), transparent 66%),
		radial-gradient(circle at 40% 36%, rgba(184, 255, 98, .12), transparent 60%);
	filter: blur(22px);
	animation: lv2-orb-breathe 9s ease-in-out infinite;
	pointer-events: none;
}

@keyframes lv2-orb-breathe {
	0%, 100% { transform: scale(1); opacity: .85; }
	50%      { transform: scale(1.07); opacity: 1; }
}

.lv2-orb__item {
	position: absolute;
	top: 50%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 132px;
	height: 52px;
	margin: -26px 0 0 -66px;
	padding: 4px 6px;
	border-radius: 10px;
	will-change: transform, opacity;
	transition: background .25s var(--ease);
}
.lv2-orb__item img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	pointer-events: none;
	-webkit-user-drag: none;
}
.lv2-orb__item:hover { background: rgba(184, 255, 98, .12); }

/* Подпись компании — вместо системного тултипа. */
.lv2-orb__item::after {
	content: attr(data-name);
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 3;
	margin-top: 6px;
	padding: 5px 10px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: rgba(6, 40, 50, .94);
	color: var(--ink);
	font-size: 11.5px;
	font-weight: 600;
	white-space: nowrap;
	opacity: 0;
	transform: translate(-50%, 4px);
	transition: opacity .2s var(--ease), transform .2s var(--ease);
	pointer-events: none;
}
.lv2-orb__item:hover::after { opacity: 1; transform: translate(-50%, 0); }
.lv2-orb.is-drag .lv2-orb__item::after { opacity: 0 !important; }
.lv2-orb.is-drag .lv2-orb__item { background: none; }

/* Пока скрипт не расставил знаки — держим их скрытыми. */
.lv2-orb:not(.is-ready) .lv2-orb__item { opacity: 0; }


@media (max-width: 900px) {
	.lv2-orb { max-width: 560px; perspective: 620px; }
	.lv2-orb__item { width: 92px; height: 36px; margin: -18px 0 0 -46px; }
	.lv2-orb__item::after { display: none; }
}

@media (max-width: 480px) {
	.lv2-orb__item { width: 72px; height: 28px; margin: -14px 0 0 -36px; }
}

/* Без анимации шар складывается в обычную сетку. */
@media (prefers-reduced-motion: reduce) {
	.lv2-orb {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
		gap: 10px;
		max-width: none;
		aspect-ratio: auto;
		max-height: none;
		perspective: none;
		cursor: default;
	}
	.lv2-orb__core { display: none; }
	.lv2-orb__item {
		position: static;
		margin: 0;
		width: auto;
		height: 60px;
		transform: none !important;
		opacity: .75 !important;
		filter: none !important;
	}
}

@media (max-width: 680px) {
	.lv2-ind__logos { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
	.lv2-ind__logo { height: 60px; padding: 8px 10px; border-radius: 12px; }
	.lv2-ind__foot .lv2-btn { width: 100%; }
}

/* --------------------------------------------------------
   Наши компетенции: крупный список
   Названия набраны большим кеглем и приглушены; под курсором
   строка загорается и выпускает описание. Ни карточек, ни
   рамок — только типографика и линии.
   -------------------------------------------------------- */
.lv2-cbig { border-top: 1px solid var(--line); }
.lv2-cbig__i {
	display: grid;
	grid-template-columns: 78px minmax(0, 1fr);
	align-items: start;
	gap: 20px;
	padding: 22px 4px;
	border-bottom: 1px solid var(--line);
	transition: padding-left .4s var(--ease), background .4s var(--ease);
}
.lv2-cbig__i:hover { padding-left: 18px; background: rgba(184, 255, 98, .05); }
.lv2-cbig__no {
	padding-top: 12px;
	color: var(--muted-2);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .08em;
	transition: color .4s var(--ease);
}
.lv2-cbig__i:hover .lv2-cbig__no { color: var(--lime); }
.lv2-cbig__main h3 {
	margin: 0;
	font-size: clamp(22px, 3vw, 34px);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -.02em;
	color: rgba(238, 248, 251, .55);
	transition: color .35s var(--ease);
}
.lv2-cbig__i:hover .lv2-cbig__main h3 { color: var(--lime); }
/* Описание раскрывается только под курсором — строка держит ритм. */
.lv2-cbig__main p {
	max-height: 0;
	margin: 0;
	overflow: hidden;
	color: var(--muted);
	font-size: 14.5px;
	max-width: 62ch;
	opacity: 0;
	transition: max-height .45s var(--ease), opacity .35s var(--ease), margin .35s var(--ease);
}
.lv2-cbig__i:hover .lv2-cbig__main p { max-height: 92px; margin-top: 10px; opacity: 1; }
/* На тач-экранах наведения нет — описание показываем сразу. */
@media (max-width: 1000px) {
	.lv2-cbig__i {
		grid-template-columns: 52px minmax(0, 1fr);
		gap: 14px;
		padding: 18px 2px;
	}
	.lv2-cbig__i:hover { padding-left: 2px; background: none; }
	.lv2-cbig__no { padding-top: 6px; font-size: 12px; }
	.lv2-cbig__main p { max-height: none; margin-top: 8px; opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.lv2-cbig__i,
	.lv2-cbig__main p { transition: none; }
}

.lv2-comps__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}
.lv2-comp {
	position: relative;
	padding: 30px 24px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
}
.lv2-comp:hover { transform: translateY(-5px); border-color: rgba(184, 255, 98, .42); box-shadow: var(--shadow); }
.lv2-comp__num {
	position: absolute;
	top: 12px;
	right: 18px;
	font-size: 54px;
	font-weight: 800;
	color: rgba(6, 36, 46, .05);
	letter-spacing: -.04em;
}
.lv2-comp__icon {
	display: grid;
	place-items: center;
	width: 50px;
	height: 50px;
	border-radius: 15px;
	background: rgba(184, 255, 98, .16);
	border: 1px solid rgba(184, 255, 98, .28);
	color: var(--lime);
	margin-bottom: 16px;
}
.lv2-comp h3 { font-size: 18px; margin-bottom: 8px; }
.lv2-comp p { color: var(--muted); font-size: 14px; }

/* --------------------------------------------------------
   Тарифы сопровождения
   -------------------------------------------------------- */
.lv2-tariffs { background: var(--bg-soft); }

.lv2-tariff {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px 28px;
	border: 1px solid var(--line);
	border-radius: 26px;
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	transform-style: preserve-3d;
	transition: transform .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-tariff:hover { border-color: var(--accent-line); box-shadow: var(--shadow); }
.lv2-tariff--featured {
	border-color: var(--teal);
	box-shadow: 0 30px 60px -34px rgba(0, 122, 148, .7);
}
.lv2-tariff__badge {
	position: absolute;
	top: -12px;
	left: 28px;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--lime-bright);
	color: #22300a;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.lv2-tariff__icon {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 15px;
	background: rgba(0, 122, 148, .1);
	border: 1px solid var(--accent-line);
	color: var(--teal);
}
.lv2-tariff__title { font-size: 22px; }
.lv2-tariff__tagline { color: var(--muted); font-size: 13.5px; line-height: 1.5; margin-top: -6px; }
.lv2-tariff__hours {
	display: flex;
	align-items: baseline;
	gap: 9px;
	padding-top: 14px;
	border-top: 1px solid var(--line);
}
.lv2-tariff__hoursnum { font-size: 24px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; }
.lv2-tariff__hourssub { color: var(--muted-2); font-size: 13px; }
.lv2-tariff__price {
	font-size: clamp(28px, 2.8vw, 36px);
	font-weight: 800;
	letter-spacing: -.03em;
	color: var(--teal);
}
.lv2-tariff__meta { display: flex; flex-direction: column; gap: 9px; margin-top: -4px; }
.lv2-tariff__meta li {
	display: flex;
	align-items: center;
	gap: 9px;
	color: var(--muted);
	font-size: 13.5px;
}
.lv2-tariff__meta svg { width: 17px; height: 17px; color: var(--teal); flex: none; }
.lv2-tariff .lv2-btn { margin-top: auto; }

/* Акция */
.lv2-promo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 24px;
	margin-top: 26px;
	padding: 30px 34px;
	border-radius: 26px;
	background: linear-gradient(120deg, #06303d, #0a4a5c);
	box-shadow: var(--shadow-lg);
}
.lv2-promo__text { max-width: 780px; }
.lv2-promo__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px 6px 10px;
	border-radius: 999px;
	background: rgba(184, 255, 98, .16);
	color: var(--lime-bright);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.lv2-promo__badge svg { width: 15px; height: 15px; }
.lv2-promo__title {
	margin: 14px 0 8px;
	font-size: clamp(23px, 2.6vw, 32px);
	color: #fff;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 12px;
}
/* Условие акции: на какой тариф она распространяется. */
.lv2-promo__note {
	margin-top: 6px;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.55;
}
.lv2-promo__old {
	font-size: 15px;
	font-weight: 500;
	color: rgba(232, 246, 250, .6);
	text-decoration: line-through;
}
.lv2-promo p { color: rgba(232, 246, 250, .82); font-size: 14.5px; }

/* Проектное сопровождение */
.lv2-matrix {
	margin-top: 30px;
	border: 1px solid var(--line);
	border-radius: 26px;
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
}
.lv2-matrix__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	width: 100%;
	padding: 24px 30px;
	border: 0;
	background: none;
	text-align: left;
	cursor: pointer;
}
.lv2-matrix__headtext { display: flex; flex-direction: column; gap: 6px; }
.lv2-matrix__title { font-size: 22px; font-weight: 700; color: var(--ink); letter-spacing: -.02em; }
.lv2-matrix__sub { color: var(--muted); font-size: 14px; }
.lv2-matrix__chevron {
	display: grid;
	place-items: center;
	flex: none;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid var(--line-2);
	color: var(--teal);
	transition: transform .4s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.lv2-matrix__head:hover .lv2-matrix__chevron { background: var(--teal); color: #fff; border-color: var(--teal); }
.lv2-matrix__head[aria-expanded="true"] .lv2-matrix__chevron { transform: rotate(180deg); }
.lv2-matrix__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .5s var(--ease);
}
.lv2-matrix__head[aria-expanded="true"] + .lv2-matrix__panel { grid-template-rows: 1fr; }
.lv2-matrix__scroll { overflow: hidden; min-height: 0; }
.lv2-matrix__head[aria-expanded="true"] + .lv2-matrix__panel .lv2-matrix__scroll { overflow-x: auto; }
.lv2-matrix__table {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
	font-size: 14px;
}
.lv2-matrix__table th,
.lv2-matrix__table td {
	padding: 14px 18px;
	text-align: center;
	border-top: 1px solid var(--line);
	vertical-align: middle;
}
.lv2-matrix__table thead th { border-top: 0; }
.lv2-matrix__table th.lv2-matrix__rowhead,
.lv2-matrix__table td.lv2-matrix__rowhead {
	text-align: left;
	color: var(--ink);
	font-weight: 600;
	width: 34%;
	padding-left: 30px;
}
.lv2-matrix__table thead .lv2-matrix__rowhead {
	color: var(--muted-2);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.lv2-matrix__colname { display: block; font-weight: 700; color: var(--ink); font-size: 15px; }
.lv2-matrix__colsub { display: block; margin-top: 3px; color: var(--muted-2); font-size: 12px; font-weight: 500; }
.lv2-matrix__table tbody tr:nth-child(even) { background: var(--surface-2); }
.lv2-matrix__yes,
.lv2-matrix__no {
	display: inline-grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
}
.lv2-matrix__yes { background: rgba(120, 190, 40, .18); color: var(--lime); }
.lv2-matrix__no { background: rgba(6, 36, 46, .06); color: var(--muted-2); }
.lv2-matrix__yes svg,
.lv2-matrix__no svg { width: 16px; height: 16px; }
.lv2-matrix__limit {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(0, 122, 148, .1);
	color: var(--teal);
	font-size: 12.5px;
	font-weight: 600;
}

/* --------------------------------------------------------
   Переключатели (лицензии/маркетплейс)
   -------------------------------------------------------- */
.lv2-switches {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	margin-bottom: 34px;
}
.lv2-switch {
	display: inline-flex;
	padding: 5px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}
.lv2-switch__btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 10px 20px;
	border: 0;
	border-radius: 999px;
	background: none;
	color: var(--muted);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: color .3s var(--ease), background .3s var(--ease);
}
.lv2-switch__btn.is-active { background: var(--teal); color: #fff; }
.lv2-switch__save {
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(120, 190, 40, .18);
	color: var(--lime);
	font-size: 11px;
	font-weight: 700;
}
.lv2-switch__btn.is-active .lv2-switch__save { background: rgba(255, 255, 255, .22); color: #fff; }

/* --------------------------------------------------------
   Лицензии
   -------------------------------------------------------- */
.lv2-lic__group { display: none; }
.lv2-lic__group.is-active { display: block; animation: lv2-fade .5s var(--ease); }
@keyframes lv2-fade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

.lv2-lic__legend {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 26px;
	margin: -8px 0 26px;
	color: var(--muted-2);
	font-size: 12.5px;
}
.lv2-lic__legenditem { display: inline-flex; align-items: center; gap: 8px; }

.lv2-lic__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	align-items: start;
}
.lv2-lic {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	transition: border-color .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-lic:hover { border-color: var(--accent-line); transform: translateY(-4px); box-shadow: var(--shadow); }
.lv2-lic--featured { border-color: var(--teal); box-shadow: var(--shadow); }

.lv2-lic__head { padding: 24px 22px 18px; min-height: 152px; }
.lv2-lic__badge {
	display: inline-block;
	padding: 5px 12px;
	margin-bottom: 12px;
	border-radius: 999px;
	background: rgba(0, 122, 148, .1);
	border: 1px solid var(--accent-line);
	color: var(--teal);
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.lv2-lic--featured .lv2-lic__badge { background: var(--teal); border-color: var(--teal); color: #fff; }
.lv2-lic__title { font-size: 21px; }
.lv2-lic__desc { margin-top: 8px; color: var(--muted-2); font-size: 13px; line-height: 1.45; }

/* Блок покупки — плашка корпоративного цвета, как на tamplier.su */
.lv2-lic__buy {
	padding: 20px 22px 22px;
	background: linear-gradient(160deg, var(--teal-dark), #07303a);
	color: #dff0f5;
}
.lv2-lic__users { display: flex; align-items: baseline; gap: 8px; }
.lv2-lic__usersnum { font-size: 26px; font-weight: 800; color: #fff; letter-spacing: -.02em; }
.lv2-lic__userslabel { color: rgba(223, 240, 245, .7); font-size: 12.5px; }
.lv2-lic__select {
	padding: 7px 10px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, .28);
	background: rgba(255, 255, 255, .1);
	color: #fff;
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}
.lv2-lic__select option { color: #06242e; }
.lv2-lic__price {
	display: flex;
	align-items: baseline;
	gap: 5px;
	margin-top: 12px;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.03em;
	color: #fff;
}
.lv2-lic__suffix { font-size: 13px; font-weight: 500; color: rgba(223, 240, 245, .72); }
.lv2-lic__subprice { margin-top: 2px; color: rgba(223, 240, 245, .66); font-size: 12.5px; }
.lv2-lic__buy .lv2-btn { margin-top: 16px; background: var(--lime-bright); color: #1d2a00; border-color: var(--lime-bright); }
.lv2-lic__buy .lv2-btn:hover { background: #dcf400; border-color: #dcf400; }

/* Состав тарифа — всегда на виду, как в сравнении редакций */
/* Список возможностей сворачивается. Открывается и закрывается
   сразу во всех карточках — иначе колонки разъезжаются по высоте
   и сравнивать редакции неудобно. */
.lv2-lic__more {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	margin-top: auto;
	padding: 15px 22px;
	border: 0;
	border-top: 1px solid var(--line);
	background: none;
	color: var(--muted);
	font: inherit;
	font-size: 13.5px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
	transition: color .3s var(--ease), background .3s var(--ease);
}
.lv2-lic__more:hover { color: var(--ink); background: rgba(255, 255, 255, .04); }
.lv2-lic__more svg {
	width: 16px;
	height: 16px;
	flex: none;
	color: var(--lime);
	transition: transform .45s cubic-bezier(.22, .85, .25, 1);
}
.lv2-lic__more[aria-expanded="true"] svg { transform: rotate(180deg); }
/* Высоту ведёт скрипт: карточки лежат в сетке равной высоты,
   и fr-трек здесь схлопывается, поэтому анимируем max-height. */
.lv2-lic__featwrap {
	overflow: hidden;
	max-height: 0;
	transition: max-height .55s cubic-bezier(.22, .85, .25, 1);
}
.lv2-lic__features { padding: 6px 22px 22px; }
.lv2-lic__feature { padding: 9px 0; border-bottom: 1px solid var(--line); }
.lv2-lic__feature:last-child { border-bottom: 0; }
.lv2-lic__frow { display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 10px; }
.lv2-lic__flabel { color: var(--ink); font-weight: 600; font-size: 13.5px; }

/* Три деления показывают объём возможностей в редакции */
.lv2-lic__level {
	position: relative;
	width: 18px;
	height: 8px;
	border-radius: 3px;
	background: rgba(0, 122, 148, .16);
	overflow: hidden;
}
.lv2-lic__level::after {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 100%;
	background: var(--teal);
}
.lv2-lic__level--halfBar::after { width: 58%; }
.lv2-lic__level--lowBar::after { width: 28%; }
.lv2-lic__mark {
	display: grid;
	place-items: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: rgba(120, 190, 40, .18);
	color: var(--lime);
}
.lv2-lic__mark svg { width: 12px; height: 12px; }
.lv2-lic__mark--off { background: rgba(6, 36, 46, .07); color: var(--muted-2); }
.lv2-lic__feature--off .lv2-lic__flabel { color: var(--muted-2); font-weight: 500; }
.lv2-lic__fsub {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	margin: 6px 0 0 28px;
}
.lv2-lic__fsub li {
	position: relative;
	padding-left: 12px;
	color: var(--muted);
	font-size: 12.5px;
}
.lv2-lic__fsub li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--accent-line);
}

/* --------------------------------------------------------
   Маркетплейс
   -------------------------------------------------------- */
.lv2-market { background: var(--bg-soft); }
.lv2-mp__group { display: none; }
.lv2-mp__group.is-active { display: block; animation: lv2-fade .5s var(--ease); }
.lv2-mp__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	align-items: stretch;
}
.lv2-mp {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 26px 22px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	transition: border-color .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-mp:hover { border-color: rgba(120, 190, 40, .45); transform: translateY(-4px); box-shadow: var(--shadow); }
.lv2-mp__badge {
	align-self: flex-start;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(120, 190, 40, .14);
	border: 1px solid rgba(120, 190, 40, .3);
	color: var(--lime);
	font-size: 11.5px;
	font-weight: 600;
}
.lv2-mp__title { font-size: 19px; }
.lv2-mp__users { color: var(--muted-2); font-size: 13px; }
.lv2-mp__price { font-size: 23px; font-weight: 800; letter-spacing: -.02em; color: var(--ink); margin-top: auto; }
.lv2-mp__subprice { color: var(--muted-2); font-size: 12.5px; margin-top: -6px; }

/* --------------------------------------------------------
   Гайд по Вайбкоду (тёмная секция)
   -------------------------------------------------------- */
.lv2-guide {
	position: relative;
	overflow: hidden;
	color: #d7e9ef;
}
.lv2-guide__canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .14; }
.lv2-guide__inner { position: relative; z-index: 2; }
.lv2-guide__intro { max-width: 900px; }
.lv2-guide__title {
	margin-top: 20px;
	font-size: clamp(28px, 3.6vw, 46px);
	color: #fff;
}
.lv2-guide__lead { margin-top: 18px; font-size: clamp(15px, 1.5vw, 18px); color: rgba(215, 233, 239, .9); }

.lv2-guide__facts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .14);
}
.lv2-guide__fact { display: flex; flex-direction: column; gap: 4px; }
.lv2-guide__factvalue { font-size: clamp(24px, 2.2vw, 30px); font-weight: 800; letter-spacing: -.03em; color: var(--lime-bright); }
.lv2-guide__factlabel { font-size: 13px; line-height: 1.45; color: rgba(215, 233, 239, .7); }

.lv2-guide__inner {
	display: grid;
	grid-template-columns: 1.15fr .85fr;
	gap: clamp(28px, 4vw, 60px);
	align-items: center;
}
.lv2-guide__intro { max-width: 620px; }

.lv2-guide__card {
	padding: clamp(24px, 3vw, 34px);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 26px;
	background: rgba(4, 22, 30, .55);
}
.lv2-guide__insidetitle { font-size: 19px; color: #fff; margin-bottom: 16px; }
.lv2-guide__list { display: grid; gap: 11px; }
.lv2-guide__list li { display: flex; gap: 11px; align-items: flex-start; font-size: 14.5px; color: rgba(215, 233, 239, .84); }
.lv2-guide__list svg { width: 19px; height: 19px; flex: none; margin-top: 2px; color: var(--lime-bright); }

.lv2-guide__cta { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
.lv2-guide__cta .lv2-btn svg { width: 18px; height: 18px; }

@media (max-width: 1024px) {
	.lv2-guide__inner { grid-template-columns: 1fr; }
	.lv2-guide__intro { max-width: none; }
}

/* --------------------------------------------------------
   Блог
   -------------------------------------------------------- */
.lv2-blog { background: var(--bg-soft); }
.lv2-blog__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}
.lv2-post {
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	transition: transform .45s var(--ease), border-color .45s var(--ease), box-shadow .45s var(--ease);
}
.lv2-post:hover { transform: translateY(-5px); border-color: var(--accent-line); box-shadow: var(--shadow); }
.lv2-post__link { display: flex; flex-direction: column; height: 100%; }
.lv2-post__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	background-color: #dceaf0;
	overflow: hidden;
	transition: transform .6s var(--ease);
}
.lv2-post:hover .lv2-post__media { transform: scale(1.04); }
.lv2-post__placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: rgba(0, 122, 148, .35);
}
.lv2-post__placeholder svg { width: 40px; height: 40px; }
.lv2-post__body {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 22px;
	flex: 1;
}
.lv2-post__date { color: var(--teal); font-size: 12.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.lv2-post__title { font-size: 17px; font-weight: 700; line-height: 1.32; color: var(--ink); }
.lv2-post__excerpt { color: var(--muted); font-size: 13.5px; line-height: 1.55; }
.lv2-post__more {
	margin-top: auto;
	padding-top: 12px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--teal);
	font-size: 13.5px;
	font-weight: 600;
}
.lv2-post__more svg { width: 16px; height: 16px; transition: transform .3s var(--ease); }
.lv2-post:hover .lv2-post__more svg { transform: translateX(4px); }
.lv2-blog__actions { display: flex; justify-content: center; margin-top: 32px; }

/* --------------------------------------------------------
   Финальный CTA (тёмная секция)
   -------------------------------------------------------- */
.lv2-final {
	position: relative;
	overflow: hidden;
	text-align: center;
	background: linear-gradient(150deg, #05303d, #062b36 60%, #041d26);
}
.lv2-final__canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .6; }
.lv2-final__inner { position: relative; z-index: 2; max-width: 820px; }
.lv2-final__title { font-size: clamp(28px, 3.8vw, 48px); color: #fff; }
.lv2-final__lead { margin-top: 18px; color: rgba(232, 246, 250, .82); font-size: 17px; }
.lv2-final__cta { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 34px; }
.lv2-final__contacts {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 30px;
	justify-content: center;
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid rgba(255, 255, 255, .14);
}
.lv2-final__contacts a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: rgba(232, 246, 250, .82);
	font-size: 14.5px;
	font-weight: 500;
	transition: color .25s var(--ease);
}
.lv2-final__contacts a:hover { color: #fff; }
.lv2-final__contacts svg { width: 18px; height: 18px; color: var(--cyan); }

/* --------------------------------------------------------
   Футер
   -------------------------------------------------------- */
.lv2-footer {
	padding: clamp(48px, 6vw, 76px) 0 26px;
	border-top: 1px solid var(--line);
	background: var(--surface);
}

.lv2-footer__inner {
	display: grid;
	grid-template-columns: 1.45fr 1.55fr .95fr 1.05fr;
	gap: 44px 40px;
	padding-bottom: 38px;
}

/* --- Колонка бренда ------------------------------------- */
.lv2-footer__logo { display: inline-block; }
.lv2-footer__brand img { height: 38px; width: auto; }
.lv2-footer__about {
	margin-top: 18px;
	max-width: 340px;
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.6;
}
.lv2-footer__badge {
	display: inline-flex;
	align-items: flex-start;
	gap: 9px;
	max-width: 320px;
	margin-top: 20px;
	padding: 9px 15px 9px 12px;
	border: 1px solid rgba(255, 199, 44, .32);
	border-radius: 14px;
	background: rgba(255, 199, 44, .1);
	color: var(--amber);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.4;
}
.lv2-footer__badge svg { flex: none; width: 17px; height: 17px; }

.lv2-footer__social { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 22px; }
/* Дзен — текстом: своей иконки в наборе нет, а чужую тащить не хочется. */
.lv2-iconbtn--text {
	width: auto;
	padding: 0 14px;
	font-size: 13px;
	font-weight: 600;
}

/* --- Колонки со ссылками -------------------------------- */
.lv2-footer__title {
	margin-bottom: 18px;
	color: var(--ink);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.lv2-footer__title a { color: inherit; transition: color .25s var(--ease); }
.lv2-footer__title a:hover { color: var(--teal); }

.lv2-footer__list { display: flex; flex-direction: column; gap: 10px; }
.lv2-footer__list a {
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.4;
	transition: color .25s var(--ease);
}
.lv2-footer__list a:hover { color: var(--teal); }
.lv2-footer__list button {
	padding: 0;
	border: 0;
	background: none;
	color: var(--muted);
	font: inherit;
	font-size: 13.5px;
	line-height: 1.4;
	text-align: left;
	cursor: pointer;
	transition: color .25s var(--ease);
}
.lv2-footer__list button:hover { color: var(--teal); }

/* Двенадцать услуг в одну колонку не помещаются — ставим в две. */
.lv2-footer__list--two {
	display: block;
	columns: 2;
	column-gap: 26px;
}
.lv2-footer__list--two li { margin-bottom: 10px; break-inside: avoid; }

/* --- Контакты ------------------------------------------- */
.lv2-footer__col--contacts { display: flex; flex-direction: column; align-items: flex-start; }
.lv2-footer__phone {
	color: var(--ink);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -.01em;
	transition: color .25s var(--ease);
}
.lv2-footer__mail {
	margin-top: 7px;
	color: var(--body);
	font-size: 14.5px;
	font-weight: 600;
	transition: color .25s var(--ease);
}
.lv2-footer__phone:hover,
.lv2-footer__mail:hover { color: var(--teal); }

.lv2-footer__address,
.lv2-footer__hours {
	display: flex;
	gap: 9px;
	margin-top: 16px;
	color: var(--muted);
	font-size: 13px;
	line-height: 1.5;
}
.lv2-footer__address svg,
.lv2-footer__hours svg { flex: none; width: 16px; height: 16px; margin-top: 1px; color: var(--teal); }

.lv2-footer__cta { display: flex; flex-direction: column; gap: 10px; margin-top: 22px; width: 100%; }
.lv2-footer__cta .lv2-btn { justify-content: center; }

/* --- Нижняя строка -------------------------------------- */
.lv2-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px 26px;
	padding-top: 22px;
	border-top: 1px solid var(--line);
	color: var(--muted-2);
	font-size: 12.5px;
}
.lv2-footer__legalnav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 22px;
}
.lv2-footer__bottom a { color: var(--muted-2); transition: color .25s var(--ease); }
.lv2-footer__bottom a:hover { color: var(--teal); }
.lv2-footer__top { display: inline-flex; align-items: center; gap: 6px; }
.lv2-footer__top svg { width: 15px; height: 15px; transform: rotate(-90deg); }

/* --------------------------------------------------------
   Модальные окна
   -------------------------------------------------------- */
.lv2-modal {
	position: fixed;
	inset: 0;
	z-index: 120;
	display: grid;
	place-items: center;
	padding: 24px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .35s var(--ease), visibility .35s;
}
.lv2-modal.is-open { opacity: 1; visibility: visible; }
.lv2-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(4, 26, 34, .5);
	backdrop-filter: blur(6px);
}
.lv2-modal__panel {
	position: relative;
	width: min(560px, 100%);
	max-height: min(86vh, 820px);
	overflow-y: auto;
	overscroll-behavior: contain;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 50px 120px -50px rgba(4, 26, 34, .7);
	transform: translateY(22px) scale(.97);
	transition: transform .4s var(--ease);
}
.lv2-modal.is-open .lv2-modal__panel { transform: none; }
.lv2-modal--wide .lv2-modal__panel { width: min(760px, 100%); }
.lv2-modal__head {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	padding: 22px 24px;
	border-bottom: 1px solid var(--line);
	background: rgba(255, 255, 255, .95);
	backdrop-filter: blur(8px);
}
.lv2-modal__title { font-size: 20px; }
.lv2-modal__sub { display: block; margin-top: 5px; color: var(--muted-2); font-size: 13px; }
.lv2-modal__close {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	flex: none;
	border: 1px solid var(--line-2);
	border-radius: 50%;
	background: none;
	color: var(--muted);
	cursor: pointer;
	transition: color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.lv2-modal__close:hover { color: var(--teal); border-color: var(--teal); transform: rotate(90deg); }
.lv2-modal__close svg { width: 18px; height: 18px; }
.lv2-modal__body { padding: 24px; }

/* Формы Битрикс24 внутри модалки */
.lv2-b24 { min-height: 120px; }
.lv2-modal__body .b24-form,
.lv2-modal__body .b24-window-panel { background: transparent !important; }
.lv2-modal__body .b24-form-wrapper { box-shadow: none !important; background: transparent !important; }
.lv2-modal__body .b24-form-header,
.lv2-modal__body .b24-form-sign { display: none !important; }
.lv2-modal__body .b24-form-content { padding: 0 !important; background: transparent !important; }
.lv2-modal__body .b24-form-control { border-radius: 12px !important; }

.lv2-casefull { display: flex; flex-direction: column; gap: 20px; margin-bottom: 22px; }
.lv2-casefull h4 {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--teal);
	margin-bottom: 8px;
}
.lv2-casefull h4 svg { width: 18px; height: 18px; }
.lv2-casefull p { color: var(--body); font-size: 14.5px; line-height: 1.62; }
.lv2-casefull--result p { color: var(--lime); font-weight: 500; }

/* --------------------------------------------------------
   Адаптив
   -------------------------------------------------------- */
/* Осталось от прежней шапки с восемью пунктами: сейчас их четыре,
   и кегль ужимаем только там, где ряд действительно поджимает. */
@media (max-width: 1320px) {
	.lv2-nav__link { font-size: 13.5px; padding: 8px 12px; }
}

/* Восемь пунктов меню и кнопка не помещаются рядом с иконками —
   на таких ширинах контакты остаются в подвале и финальном блоке. */
@media (max-width: 1320px) {
	.lv2-header__actions .lv2-iconbtn { display: none; }
}

/* До 1600px полоса контента остаётся 1280px, а меню в полный кегль
   уже не помещается рядом с телефоном и кнопкой кабинета: ряд
   переполнялся, и кнопка вылезала за скруглённую рамку шапки. */
@media (max-width: 1599px) {
	.lv2-nav__link { padding-inline: 9px; }
}

/* На широких мониторах полоса контента шире: она не должна
   тонуть в пустых полях. Меняем переменную — подстраиваются
   и контейнер, и секции со своей раскладкой. */
@media (min-width: 1600px) {
	:root, .lv2 { --content: 1440px; }
	.lv2-container { width: min(var(--content), 100% - 80px); }
}
@media (min-width: 2000px) {
	:root, .lv2 { --content: 1600px; }
	.lv2-container { width: min(var(--content), 100% - 120px); }
}

/* Ниже 1200px супер-меню не помещается — уходит в бургер,
   а карточки перестраиваются в две колонки. */
@media (max-width: 1200px) {
	.lv2-nav { display: none; }
	.lv2-burger { display: flex; }
	.lv2-services__grid,
	.lv2-lic__grid,
	.lv2-mp__grid,
	.lv2-comps__grid { grid-template-columns: repeat(2, 1fr); }
}

/* Карточки лицензий и тарифов маркетплейса высокие: на планшете
   в две колонки они ещё читаются, ниже — по одной. */
@media (max-width: 900px) {
	.lv2-lic__grid,
	.lv2-mp__grid { grid-template-columns: 1fr; }
	.lv2-header__cta { display: none; }
}

@media (max-width: 1024px) {
	.lv2-process__layout { grid-template-columns: 1fr; gap: 30px; }
	.lv2-process__visual { position: relative; top: 0; aspect-ratio: 16 / 10; }
	.lv2-blog__grid,
	.lv2-tariffs__grid { grid-template-columns: repeat(2, 1fr); }
	.lv2-burger { display: flex; }
	.lv2-footer__inner { grid-template-columns: 1fr 1fr; }
	/* Бренд занимает всю ширину — раскладываем его содержимое в строку,
	   иначе половина полосы остаётся пустой. */
	.lv2-footer__brand {
		grid-column: 1 / -1;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 20px 40px;
	}
	.lv2-footer__logo { flex: 0 0 100%; }
	.lv2-footer__about { flex: 1 1 300px; margin-top: 0; }
	.lv2-footer__badge { flex: 0 1 320px; margin-top: 0; }
	.lv2-footer__social { flex: 0 0 100%; margin-top: 0; }
}

@media (max-width: 860px) {
	.lv2-container { width: min(var(--content), 100% - 32px); }
	.lv2-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.lv2-stat { padding: 20px 18px 18px; }
	.lv2-stat__value { padding-right: 0; }
	.lv2-stat__label { font-size: 12.5px; overflow-wrap: anywhere; }
	/* На узкой плитке иконка возвращается в поток: в углу длинное
	   слово («Золотой») заезжало под неё. */
	.lv2-stat__icon {
		position: static;
		width: 26px;
		height: 26px;
		margin-bottom: 12px;
	}
	.lv2-stat__icon svg { width: 13px; height: 13px; }
	.lv2-hero { padding: 124px 0 84px; min-height: auto; }
	.lv2-hero__veil { background: linear-gradient(180deg, rgba(255, 255, 255, .72) 0%, rgba(255, 255, 255, .5) 46%, rgba(238, 244, 247, .92) 88%, var(--bg) 100%); }
}

@media (max-width: 680px) {
	.lv2-services__grid,
	.lv2-lic__grid,
	.lv2-mp__grid,
	.lv2-comps__grid,
	.lv2-blog__grid,
	.lv2-tariffs__grid,
	.lv2-footer__inner { grid-template-columns: 1fr; gap: 34px; }
	.lv2-footer__list--two { columns: 1; }
	.lv2-footer__cta { max-width: 320px; }
	.lv2-section { padding: 58px 0; }
	.lv2-cases__actions,
	.lv2-final__cta { flex-direction: column; }
	.lv2-cases__actions .lv2-btn,
	.lv2-final__cta .lv2-btn { width: 100%; }
	.lv2-footer__bottom { flex-direction: column; }
	.lv2-modal { padding: 14px; }
	.lv2-modal__body { padding: 18px; }
	.lv2-promo { padding: 24px; }
	.lv2-matrix__head { padding: 20px; }
	.lv2-matrix__title { font-size: 19px; }
	.lv2-deck { height: min(126vw, 520px); }
	.lv2-deck__item { --width: min(70vw, 300px); --height: min(112vw, 460px); }
	.lv2-deck__box { padding: 22px 18px; gap: 10px; }
	.lv2-deck__avatar { width: 62px; height: 62px; }
	.lv2-deck__name { font-size: 16.5px; }
	.lv2-deck__where { font-size: 12.5px; }
	.lv2-deck__rating { margin: 10px 0 8px; }
	.lv2-deck__text { font-size: 13px; -webkit-line-clamp: 4; }
	.lv2-deck__more { margin-top: 12px; padding: 8px 15px; font-size: 12.5px; }
	.lv2-deck__nav { width: 38px; height: 38px; background: rgba(10, 58, 69, .72); }
	.lv2-deck__nav--prev { left: 4px; }
	.lv2-deck__nav--next { right: 4px; }
	.lv2-matrix__table th.lv2-matrix__rowhead,
	.lv2-matrix__table td.lv2-matrix__rowhead { padding-left: 20px; }
}

/* На тач-устройствах ссылка в карточке услуги видна сразу */
@media (hover: none) {
	.lv2-service__link { opacity: 1; transform: none; }
}

/* =========================================================
   Блоки, добавленные после первой ревизии
   ========================================================= */

/* --------------------------------------------------------
   Команда: гармошка из полос
   -------------------------------------------------------- */
.lv2-crew {
	display: flex;
	gap: 10px;
	height: clamp(420px, 58vh, 560px);
}

.lv2-crew__panel {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	border-radius: 22px;
	border: 1px solid var(--line);
	overflow: hidden;
	cursor: pointer;
	outline: none;
	transition: flex-grow .72s cubic-bezier(.32, .72, 0, 1), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.lv2-crew__panel.is-active {
	flex-grow: 3.6;
	border-color: var(--accent-line);
	box-shadow: var(--shadow);
}
.lv2-crew__panel:focus-visible { border-color: var(--teal); }

.lv2-crew__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 18%;
	/* Все портреты цветные; свёрнутые чуть притушены, чтобы имя
	   поверх них оставалось читаемым. */
	filter: brightness(.82) saturate(1.04);
	transform: scale(1.04);
	transition: filter .6s var(--ease), transform .8s cubic-bezier(.32, .72, 0, 1);
}
.lv2-crew__panel.is-active .lv2-crew__photo {
	filter: none;
	transform: scale(1);
}

.lv2-crew__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(6, 32, 40, .1) 0%, rgba(6, 32, 40, .5) 52%, rgba(6, 32, 40, .92) 100%);
	transition: opacity .6s var(--ease);
}

/* Имя вдоль полосы, пока она сжата */
.lv2-crew__spine {
	position: absolute;
	left: 50%;
	bottom: 22px;
	z-index: 2;
	writing-mode: vertical-rl;
	transform: translateX(-50%) rotate(180deg);
	max-height: calc(100% - 90px);
	overflow: hidden;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .01em;
	color: #eaf8fc;
	white-space: nowrap;
	text-shadow: 0 2px 12px rgba(0, 0, 0, .6);
	opacity: 1;
	/* Появляется с задержкой — когда полоса уже сжалась. */
	transition: opacity .4s var(--ease) .26s;
}
/* Уходит сразу, чтобы не наезжать на раскрывающуюся подпись. */
.lv2-crew__panel.is-active .lv2-crew__spine { opacity: 0; transition: opacity .16s var(--ease); }

.lv2-crew__info {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;
	/* Ширина фиксированная, а не по полосе: иначе текст переверстывается
	   на каждом кадре, пока полоса растёт, и строки прыгают. */
	width: max(300px, 27vw);
	padding: 24px 26px 26px;
	pointer-events: none;
}

/* Строки выходят по очереди — так раскрытие читается как одно
   движение, а не как одновременная вспышка всего блока. */
.lv2-crew__name,
.lv2-crew__role,
.lv2-crew__about {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .14s var(--ease), transform .14s var(--ease);
}
.lv2-crew__panel.is-active .lv2-crew__name,
.lv2-crew__panel.is-active .lv2-crew__role,
.lv2-crew__panel.is-active .lv2-crew__about {
	opacity: 1;
	transform: none;
	transition: opacity .42s var(--ease), transform .58s cubic-bezier(.22, .61, .36, 1);
}
/* Задержка только на входе: при уходе курсора текст пропадает сразу,
   поэтому быстрый проход по полосам не оставляет мельтешения. */
.lv2-crew__panel.is-active .lv2-crew__name { transition-delay: .2s; }
.lv2-crew__panel.is-active .lv2-crew__role { transition-delay: .27s; }
.lv2-crew__panel.is-active .lv2-crew__about { transition-delay: .34s; }

.lv2-crew__name {
	font-size: clamp(19px, 1.6vw, 23px);
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
}
.lv2-crew__role {
	display: inline-block;
	margin-top: 8px;
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(0, 194, 224, .2);
	border: 1px solid rgba(0, 194, 224, .4);
	color: #bdf0fb;
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
}
.lv2-crew__about {
	margin-top: 12px;
	max-width: 44ch;
	font-size: 14px;
	line-height: 1.5;
	color: rgba(232, 246, 250, .86);
}

/* Узкий экран: та же гармошка, только строками */
@media (max-width: 860px) {
	.lv2-crew {
		flex-direction: column;
		height: auto;
		gap: 8px;
	}
	.lv2-crew__panel { flex: 0 0 74px; height: 74px; transition: height .6s var(--ease), flex-basis .6s var(--ease); }
	.lv2-crew__panel.is-active { flex: 0 0 clamp(300px, 74vw, 380px); height: clamp(300px, 74vw, 380px); }
	.lv2-crew__photo { object-position: 50% 22%; }
	/* В свёрнутой строке в кадр попадает случайный фрагмент лица,
	   поэтому притемняем сильнее — имя должно читаться. */
	.lv2-crew__panel:not(.is-active) .lv2-crew__photo { filter: brightness(.5) saturate(1.04); }
	.lv2-crew__panel:not(.is-active) .lv2-crew__veil { background: linear-gradient(90deg, rgba(6, 32, 40, .92) 30%, rgba(6, 32, 40, .55) 100%); }

	.lv2-crew__spine {
		writing-mode: horizontal-tb;
		left: 20px;
		right: 18px;
		bottom: auto;
		top: 50%;
		max-height: none;
		transform: translateY(-50%);
		font-size: 15.5px;
	}
	.lv2-crew__info { width: auto; right: 0; padding: 18px 18px 20px; }
	.lv2-crew__name { white-space: normal; }
	.lv2-crew__about { font-size: 13.5px; }
}

/* --------------------------------------------------------
   Липкая панель действий на мобильном
   -------------------------------------------------------- */
.lv2-sticky {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 78;
	display: none;
	gap: 10px;
	padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(14px);
	border-top: 1px solid var(--line);
	box-shadow: 0 -10px 30px -22px rgba(6, 36, 46, .6);
	transform: translateY(110%);
	transition: transform .4s var(--ease);
}
.lv2-sticky.is-visible { transform: none; }
.lv2-sticky .lv2-btn { flex: 1; padding: 14px 18px; }
.lv2-sticky__call {
	flex: none !important;
	width: 52px;
	padding: 0 !important;
}
.lv2-sticky__call svg { width: 20px; height: 20px; }

@media (max-width: 860px) {
	.lv2-sticky { display: flex; }
	.lv2-footer { padding-bottom: 92px; }
}

/* --------------------------------------------------------
   Маркетплейс: цена со скидкой
   -------------------------------------------------------- */
.lv2-mp__pricewrap { margin-top: auto; }
.lv2-mp__old {
	display: block;
	color: var(--muted-2);
	font-size: 13px;
	text-decoration: line-through;
}
.lv2-mp__price { margin-top: 2px; }
.lv2-mp__save {
	display: inline-block;
	margin-top: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(109, 136, 0, .14);
	color: var(--lime);
	font-size: 11.5px;
	font-weight: 700;
}

/* --------------------------------------------------------
   Hero: изображение как фолбэк, когда WebGL недоступен
   -------------------------------------------------------- */
.lv2-hero__fallback {
	height: auto;
	position: absolute;
	right: 6%;
	top: 50%;
	transform: translateY(-50%);
	width: min(30%, 380px);
	opacity: 0;
	pointer-events: none;
	transition: opacity .6s var(--ease);
}
.lv2-hero.is-nowebgl .lv2-hero__fallback { opacity: 1; }



@media (max-width: 680px) {
	.lv2-hero__fallback { width: 62%; right: -8%; }
}

/* Иконка в полосе фактов */
/* Иконка уходит в верхний правый угол плитки — цифра ведёт,
   иконка только помечает тему. */
.lv2-stat__icon {
	position: absolute;
	top: 20px;
	right: 20px;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	border: 1px solid rgba(184, 255, 98, .22);
	background: rgba(184, 255, 98, .1);
	color: var(--lime);
	opacity: .85;
	transition: opacity .45s var(--ease);
}
.lv2-stat:hover .lv2-stat__icon { opacity: 1; }
.lv2-stat__icon svg { width: 15px; height: 15px; }

/* Обложка статьи как img — чтобы работал lazy-loading */
.lv2-post__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/* =========================================================
   Единый фон страницы
   Все секции прозрачные — цвет задаёт корневой контейнер.
   ========================================================= */
.lv2-container { position: relative; z-index: 1; }

.lv2-section,
.lv2-stats,
.lv2-cases,
.lv2-process,
.lv2-market,
.lv2-tariffs,
.lv2-blog,
.lv2-guide,
.lv2-final,
.lv2-footer { background: transparent; }

.lv2-stats { border-block: 0; }
.lv2-footer { border-top: 1px solid var(--line); }
.lv2-hero {
	background: var(--bg);
}
.lv2-hero__veil {
	background: linear-gradient(90deg, rgba(10, 58, 69, .74) 0%, rgba(10, 58, 69, .58) 32%, rgba(10, 58, 69, .3) 54%, rgba(10, 58, 69, 0) 74%);
}

/* Мобильное меню и липкая панель — в тон странице */
.lv2-header__logo img,
.lv2-footer__brand img { filter: brightness(0) invert(1); opacity: .94; }
.lv2-mobilenav { background: rgba(10, 58, 69, .97); }
.lv2-sticky { background: rgba(10, 58, 69, .95); box-shadow: 0 -10px 30px -22px rgba(0, 0, 0, .8); }
.lv2-hero__scroll { background: rgba(255, 255, 255, .07); }

/* Плашки и иконки под тёмный фон */
.lv2-head__tag {
	background: rgba(255, 255, 255, .07);
	border-color: rgba(255, 255, 255, .2);
	color: var(--teal);
}
.lv2-service__icon,
.lv2-comp__icon {
	background: rgba(255, 255, 255, .07);
	border-color: rgba(255, 255, 255, .18);
}
.lv2-comp__icon { color: var(--lime); }
.lv2-comp__num { color: rgba(255, 255, 255, .06); }
.lv2-comp:hover { border-color: rgba(184, 255, 98, .45); }
.lv2-process__visual { border-color: rgba(255, 255, 255, .16); }
.lv2-process__result { background: rgba(184, 255, 98, .12); border-color: rgba(184, 255, 98, .3); }
.lv2-matrix__no { background: rgba(255, 255, 255, .07); }
.lv2-lic__mark--off { background: rgba(255, 255, 255, .07); }
.lv2-lic__level { background: rgba(255, 255, 255, .13); }
.lv2-lic__buy { background: linear-gradient(160deg, #0f6b82, #08333f); }
.lv2-ind__metric { background: linear-gradient(160deg, #08333f, #0f6b82); }
.lv2-post__media { background: rgba(255, 255, 255, .06); }

/* Модальные окна остаются светлыми: формы Битрикс24 рисуются на белом */
.lv2-modal {
	--surface: #ffffff;
	--surface-2: #f6fafc;
	--surface-3: #eaf3f7;
	--ink: #062430;
	--body: #2f4f5c;
	--muted: #4f6f7c;
	--muted-2: #6b8794;
	--line: rgba(6, 36, 46, .10);
	--line-2: rgba(6, 36, 46, .16);
	--teal: #007a94;
	--teal-dark: #005c73;
	--lime: #6d8800;
	--amber: #c98500;
	color: var(--body);
}

/* Подводка в модалке лид-магнита (стиль переехал вместе с блоком) */
.lv2-magnet-modal__lead { margin-bottom: 18px; color: var(--muted); font-size: 14.5px; }

@media (max-width: 860px) {
	.lv2-hero__veil {
		background: linear-gradient(180deg, rgba(10, 58, 69, .8) 0%, rgba(10, 58, 69, .68) 46%, rgba(10, 58, 69, .45) 78%, rgba(10, 58, 69, .6) 100%);
	}
}

/* =========================================================
   Услуги в первом экране: спокойная бегущая строка
   ========================================================= */
.lv2-hero__ticker {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	overflow: hidden;
	padding: 14px 0;
	border-block: 1px solid var(--line);
	background: rgba(255, 255, 255, .03);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.lv2-ticker__track {
	display: flex;
	width: max-content;
	animation: lv2-ticker 46s linear infinite;
}
.lv2-hero__ticker:hover .lv2-ticker__track { animation-play-state: paused; }
.lv2-ticker__item {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 0 26px;
	color: var(--muted);
	font-size: 14.5px;
	font-weight: 600;
	white-space: nowrap;
}
.lv2-ticker__item svg { width: 19px; height: 19px; color: var(--teal); }
.lv2-ticker__item::after {
	content: "";
	width: 5px;
	height: 5px;
	margin-left: 26px;
	border-radius: 50%;
	background: var(--accent-line);
}
@keyframes lv2-ticker {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.lv2-ticker__track { animation: none; }
}

@media (max-width: 860px) {
	.lv2-hero__ticker { padding: 12px 0; }
	.lv2-ticker__item { font-size: 13.5px; padding: 0 18px; }
	.lv2-ticker__item::after { margin-left: 18px; }
}


/* Первому экрану нужен запас снизу под бегущую строку */
.lv2-hero { padding-bottom: 156px; }
.lv2-hero__scroll { bottom: 86px; }

@media (max-width: 860px) {
	.lv2-hero { padding: 124px 0 108px; }
	.lv2-hero__scroll { display: none; }
}


/* =========================================================
   Первый экран после правок: без кикера и списка преимуществ
   ========================================================= */
.lv2-hero__cta { margin-top: 38px; }

.lv2-stats { padding: 0 0 clamp(56px, 7vw, 96px); }
.lv2-stats__grid {
	padding-top: clamp(30px, 4vw, 48px);
	border-top: 1px solid var(--line);
}

@media (max-width: 860px) {
	.lv2-hero__content { max-width: 100%; }
}


/* =========================================================
   Процесс: горизонтальная лента этапов
   Блок закрепляется на экране, а вертикальная прокрутка
   двигает ленту вбок. Сцена при этом стоит на месте, и у
   каждой фигуры есть свой отрезок прокрутки.
   ========================================================= */
@media (min-width: 1025px) {
	.lv2-process__stage {
		height: 420vh;                      /* длина хода ленты: чем больше, тем медленнее */
	}

	.lv2-process__pin {
		position: sticky;
		top: 0;
		/* Ровно экран: на высоком мониторе иначе прилипало к верху,
		   а внизу оставалась пустота. Скрипт прокрутки тоже считает
		   ход ленты от innerHeight. */
		height: 100vh;
		display: flex;
		align-items: center;
		overflow: hidden;
	}

	/* Само содержимое не растягиваем — центрируем в экране. */
	.lv2-process__layout { max-height: 780px; }

	.lv2-process__layout {
		grid-template-columns: minmax(280px, 0.82fr) 1.18fr;
		gap: clamp(32px, 4vw, 64px);
		align-items: center;
		width: min(var(--content), 100% - 44px);
	}

	.lv2-process__visual {
		position: relative;
		top: 0;
		width: min(100%, 62vh);
		margin-inline: auto;
	}

	/* Лента: обрезается справа краем экрана, чтобы следующий
	   этап был виден краем и тянул листать дальше. */
	.lv2-process__rail {
		overflow: hidden;
		margin-right: calc((100vw - min(var(--content), 100vw - 44px)) / -2);
		padding-right: 6vw;
	}

	.lv2-process__list {
		flex-direction: row;
		gap: 24px;
		width: max-content;
		will-change: transform;
	}

	.lv2-process__item {
		flex: 0 0 clamp(360px, 33vw, 520px);
		min-height: clamp(240px, 30vh, 300px);
		transform: none;
		opacity: .32;
	}
	.lv2-process__item.is-active { opacity: 1; transform: none; }

	/* Точки прогресса под лентой */
	.lv2-process__progress {
		grid-column: 2;
		display: flex;
		gap: 8px;
		margin-top: 26px;
	}
	.lv2-process__tick {
		width: 26px;
		height: 3px;
		border-radius: 999px;
		background: var(--line-2);
		transition: background .35s var(--ease), width .35s var(--ease);
	}
	.lv2-process__tick.is-active { width: 46px; background: var(--teal); }
}

/* Полоска шагов — кнопки: сбрасываем вид и расширяем зону нажатия */
.lv2-process__tick {
	position: relative;
	appearance: none;
	padding: 0;
	border: 0;
	background: var(--line-2);
	cursor: pointer;
}
.lv2-process__tick::after {
	content: "";
	position: absolute;
	inset: -14px -5px;
}
.lv2-process__tick:hover { background: var(--teal-bright); }
.lv2-process__tick:focus-visible { outline: 2px solid var(--teal); outline-offset: 6px; }

/* Планшет и телефон: лента листается пальцем, без закрепления */
@media (max-width: 1024px) {
	.lv2-process__rail {
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		margin-inline: calc(50% - 50vw);
		padding-inline: max(22px, calc(50vw - 620px + 22px));
		padding-bottom: 6px;
	}
	.lv2-process__rail::-webkit-scrollbar { display: none; }

	.lv2-process__list { flex-direction: row; gap: 16px; width: max-content; }

	.lv2-process__item {
		flex: 0 0 min(78vw, 420px);
		scroll-snap-align: center;
		transform: none;
		opacity: .5;
	}
	.lv2-process__item.is-active { opacity: 1; transform: none; }

	.lv2-process__progress { display: flex; gap: 7px; justify-content: center; margin-top: 22px; }
	.lv2-process__tick { width: 22px; height: 3px; border-radius: 999px; background: var(--line-2); transition: background .35s var(--ease), width .35s var(--ease); }
	.lv2-process__tick.is-active { width: 38px; background: var(--teal); }
}

/* Планшет: сцена остаётся над лентой */
@media (min-width: 769px) and (max-width: 1024px) {
	.lv2-process__visual { width: min(100%, 46vh); margin-inline: auto; }
}

/* На телефоне сцена не создаётся — пустая рамка там ни к чему */
@media (max-width: 768px) {
	.lv2-process__visual { display: none; }
}


/* =========================================================
   Лицензии и маркетплейс: единая кнопка покупки
   ========================================================= */
.lv2-lic__buy .lv2-btn,
.lv2-mp [data-lv2-buy] {
	background: var(--lime-bright);
	border-color: var(--lime-bright);
	color: #1d2a00;
	box-shadow: 0 14px 30px -16px rgba(120, 190, 40, .8);
}
.lv2-lic__buy .lv2-btn:hover,
.lv2-mp [data-lv2-buy]:hover {
	background: #dcf400;
	border-color: #dcf400;
	color: #1d2a00;
}

/* display:flex у переключателя перебивает [hidden] из браузера */
.lv2-switch[hidden] { display: none; }

/* Коробка в маркетплейсе: карточек три, поэтому центрируем ряд */
@media (min-width: 1201px) {
	.lv2-mp__grid--onprem {
		grid-template-columns: repeat(3, minmax(0, 300px));
		justify-content: center;
	}
}


/* =========================================================
   Тарифы сопровождения: четыре равных карточки
   ========================================================= */
.lv2-tariffs__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	align-items: stretch;
}

.lv2-tariff {
	gap: 10px;
	padding: 30px 24px 26px;
}
.lv2-tariff__title { font-size: 19px; }
.lv2-tariff__tagline { min-height: 42px; font-size: 13.5px; }
.lv2-tariff__price {
	margin-top: 6px;
	font-size: clamp(26px, 2.4vw, 32px);
}
.lv2-tariff__hours { margin-bottom: 4px; }
.lv2-tariff__hoursnum { font-size: 17px; }
.lv2-tariff .lv2-btn { margin-top: auto; }

/* Условия — одна строка мелким шрифтом вместо четырёх карточек */
.lv2-tariffs__note {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 22px;
	margin-top: 26px;
	color: var(--muted-2);
	font-size: 13px;
	text-align: center;
}
.lv2-tariffs__note > span { position: relative; }
.lv2-tariffs__note > span + span::before {
	content: "";
	position: absolute;
	left: -12px;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	background: var(--line-2);
}

@media (max-width: 1200px) {
	.lv2-tariffs__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
	.lv2-tariffs__grid { grid-template-columns: 1fr; }
	.lv2-tariff__tagline { min-height: 0; }
}

@media (max-width: 560px) {
	.lv2-guide__facts { grid-template-columns: 1fr 1fr; }
}


/* =========================================================
   Тарифы: чем проектное отличается от экспертного
   ========================================================= */
.lv2-compare { margin-top: 26px; }
.lv2-compare__title {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
	color: var(--lime);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.lv2-compare__title::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--line);
}

.lv2-compare__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
}
.lv2-compare__col {
	padding: 26px 28px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
}
.lv2-compare__col.is-accent {
	border-color: rgba(184, 255, 98, .5);
	background: linear-gradient(150deg, rgba(0, 194, 224, .1), rgba(255, 255, 255, .03));
}
.lv2-compare__label {
	display: block;
	color: var(--muted-2);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
}
.lv2-compare__lead {
	display: block;
	margin-top: 8px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--line);
	color: var(--lime);
	font-size: clamp(20px, 1.9vw, 25px);
	font-weight: 700;
	letter-spacing: -.01em;
}
.lv2-compare__col ul { display: grid; gap: 12px; margin-top: 18px; }
.lv2-compare__col li {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--body);
	font-size: 14.5px;
}
.lv2-compare__dot {
	flex: none;
	width: 9px;
	height: 9px;
	background: var(--lime);
	transform: rotate(45deg);
}

@media (max-width: 860px) {
	.lv2-compare__grid { grid-template-columns: 1fr; }
}

/* Ссылка «Все услуги» в шапке блока — появилась вместе со страницами услуг. */
.lv2-head__more {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 18px;
	color: var(--teal);
	font-size: 14.5px;
	font-weight: 600;
	transition: gap .3s var(--ease);
}
.lv2-head__more svg { width: 17px; height: 17px; }
.lv2-head__more:hover { gap: 12px; }

/* =========================================================
   Клиенты: наклонное полотно логотипов
   Четыре ряда идут навстречу друг другу внутри рамки —
   ровно так, как в прототипе №13.
   ========================================================= */
.lv2-clients { position: relative; }

.lv2-tilt {
	position: relative;
	height: 560px;
	/* Полотно идёт от края до края и растворяется по бокам —
	   рамки и фона у блока нет, он часть страницы. */
	margin-inline: calc(50% - 50vw);
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent),
		linear-gradient(180deg, transparent, #000 12%, #000 84%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent),
		linear-gradient(180deg, transparent, #000 12%, #000 84%, transparent);
	-webkit-mask-composite: source-in;
	mask-composite: intersect;
}

.lv2-tilt__scene {
	position: absolute;
	z-index: 2;
	inset: -14%;
	display: flex;
	flex-direction: column;
	gap: 14px;
	justify-content: center;
	transform: rotateX(16deg) rotateZ(-8deg) scale(1.12);
	transform-style: preserve-3d;
}

.lv2-tilt__rail { overflow: hidden; }
.lv2-tilt__track { display: flex; gap: 14px; width: max-content; will-change: transform; }

.lv2-tilt__card {
	flex: none;
	display: grid;
	place-items: center;
	width: 150px;
	height: 62px;
	border: 1px solid var(--line);
	border-radius: 12px;
	background: rgba(255, 255, 255, .03);
}
.lv2-tilt__card img {
	max-width: 78%;
	max-height: 70%;
	object-fit: contain;
	opacity: .72;
}

@media (max-width: 900px) {
	.lv2-tilt { height: 420px; }
}


/* --------------------------------------------------------
   Кот Вайб — плавающий помощник
   -------------------------------------------------------- */
.lv2-vibe {
	position: fixed;
	right: calc(env(safe-area-inset-right, 0px) + 22px);
	bottom: calc(env(safe-area-inset-bottom, 0px) + 22px);
	z-index: 100;
	display: grid;
	justify-items: end;
	/* Кликается только сама кнопка и открытая панель. */
	pointer-events: none;
}
.lv2-vibe__toggle {
	position: relative;
	display: grid;
	justify-items: center;
	width: 92px;
	height: 92px;
	padding: 0;
	border: 1px solid var(--line-2);
	border-radius: 28px;
	background:
		radial-gradient(circle at 42% 18%, rgba(86, 211, 234, .3), transparent 42%),
		linear-gradient(150deg, #07303a, #0d4b59);
	box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .75);
	cursor: pointer;
	pointer-events: auto;
	-webkit-tap-highlight-color: transparent;
	transform: perspective(520px) rotateX(var(--lv2-vibe-x, 0deg)) rotateY(var(--lv2-vibe-y, 0deg));
	transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}
/* Аура: тот же приём, что и у прежнего виджета, но в палитре лендинга. */
.lv2-vibe__toggle::before {
	content: "";
	position: absolute;
	inset: -8px;
	z-index: -1;
	border-radius: 34px;
	background: conic-gradient(from 90deg, rgba(86, 211, 234, .12), rgba(86, 211, 234, .6), rgba(205, 232, 0, .7), rgba(86, 211, 234, .12));
	filter: blur(11px);
	opacity: .72;
	animation: lv2VibeAura 7s linear infinite;
}
.lv2-vibe__toggle:hover,
.lv2-vibe__toggle:focus-visible,
.lv2-vibe.is-open .lv2-vibe__toggle {
	outline: none;
	box-shadow: 0 30px 62px -18px rgba(0, 0, 0, .85), 0 0 0 6px rgba(86, 211, 234, .12);
	transform: perspective(520px) rotateX(var(--lv2-vibe-x, 0deg)) rotateY(var(--lv2-vibe-y, 0deg)) translateY(-3px);
}
.lv2-vibe__avatar {
	position: absolute;
	inset: 8px;
	width: 76px;
	height: 76px;
	overflow: hidden;
	border-radius: 22px;
	background:
		linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px),
		radial-gradient(circle at 50% 18%, rgba(86, 211, 234, .2), transparent 44%);
	background-size: 18px 18px, 18px 18px, auto;
	animation: lv2VibeGrid 14s linear infinite;
}
/* Блик пробегает по стеклу раз в несколько секунд. */
.lv2-vibe__avatar::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 4;
	background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .22) 50%, transparent 62%);
	transform: translateX(-120%);
	animation: lv2VibeShine 6.5s ease-in-out infinite;
	pointer-events: none;
}
/* Обёртка тянется за курсором, картинка внутри качается сама. */
.lv2-vibe__cat {
	position: absolute;
	inset: 0;
	display: block;
	transform: translate3d(var(--lv2-vibe-px, 0px), var(--lv2-vibe-py, 0px), 0);
	transition: transform .35s var(--ease);
}
/* Кот крупнее рамки и выглядывает из неё — оттого и живой.
   Дышит и качается вся стопка слоёв, а голова с хвостом живут внутри неё
   своей жизнью: так одна картинка ведёт себя как персонаж с ригом. */
.lv2-vibe__avatar img {
	position: absolute;
	left: 50%;
	bottom: -86px;
	width: auto;
	height: 164px;
	max-width: none;
	display: block;
	transform: translateX(-50%) translateY(2px) rotate(-1deg);
	transform-origin: 40% 52%;
	filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .35));
	animation: lv2VibeFloat 4.6s ease-in-out infinite;
}
/* Холст Rive: пока анимация не загрузилась, работает CSS-риг. */
.lv2-vibe__canvas {
	position: absolute;
	inset: -14px;
	width: calc(100% + 28px);
	height: calc(100% + 28px);
	display: none;
	pointer-events: none;
}
.lv2-vibe.is-rive .lv2-vibe__canvas { display: block; }
.lv2-vibe.is-rive .lv2-vibe__part { display: none; }

/* Слои-двойники поверх тела: тень им не нужна, иначе троится. */
.lv2-vibe__avatar .lv2-vibe__part--paw,
.lv2-vibe__avatar .lv2-vibe__part--head,
.lv2-vibe__avatar .lv2-vibe__part--visor { filter: none; }

/* Тело: всё, кроме головы и поднятой лапы — их рисуют свои слои. */
.lv2-vibe__avatar .lv2-vibe__part--body {
	clip-path: polygon(0 42%, 34% 42%, 34% 26%, 100% 26%, 100% 100%, 0 100%);
}
/* Голова поворачивается вокруг шеи и заходит под воротник — шва не видно.
   Поворот задан через rotate/translate, а не transform: покачивание всей
   стопки анимирует именно transform и затёрло бы его. */
.lv2-vibe__avatar .lv2-vibe__part--head {
	clip-path: polygon(18% 0, 82% 0, 82% 29%, 18% 29%);
	transform-origin: 50% 30%;
	rotate: var(--lv2-vibe-head, 0deg);
	translate: var(--lv2-vibe-headx, 0px) 0;
	transition: rotate .5s var(--ease), translate .5s var(--ease);
}
/* Лапа качается от плеча своим ритмом — кот будто здоровается с прохожими. */
.lv2-vibe__avatar .lv2-vibe__part--paw {
	clip-path: polygon(0 15%, 34% 15%, 34% 42%, 0 42%);
	transform-origin: 34% 42%;
	animation: lv2VibeFloat 4.6s ease-in-out infinite, lv2VibePaw 3.4s ease-in-out infinite;
}
/* Визор: подсвечиваем поверх, не трогая остальное. */
.lv2-vibe__avatar .lv2-vibe__part--visor {
	clip-path: polygon(22% 9%, 78% 9%, 78% 20%, 22% 20%);
	mix-blend-mode: screen;
	opacity: .35;
	animation: lv2VibeFloat 4.6s ease-in-out infinite, lv2VibeVisor 5.5s ease-in-out infinite;
}
.lv2-vibe.is-waving .lv2-vibe__avatar img { animation: lv2VibeWave 1.5s cubic-bezier(.16, 1, .3, 1) both; }
/* Пока кот машет или ныряет, голова едет вместе с телом. */
.lv2-vibe.is-waving .lv2-vibe__avatar .lv2-vibe__part--head,
.lv2-vibe.is-peeking .lv2-vibe__avatar .lv2-vibe__part--head { rotate: 0deg; translate: 0 0; transition: none; }
.lv2-vibe.is-waving .lv2-vibe__avatar .lv2-vibe__part--paw { animation: lv2VibeWave 1.5s cubic-bezier(.16, 1, .3, 1) both, lv2VibePawWave 1.5s ease-in-out both; }
.lv2-vibe.is-peeking .lv2-vibe__avatar .lv2-vibe__part--paw { animation-name: lv2VibePeek; }
.lv2-vibe.is-waving .lv2-vibe__avatar .lv2-vibe__part--visor,
.lv2-vibe.is-peeking .lv2-vibe__avatar .lv2-vibe__part--visor { opacity: 0; }
/* Раз в несколько секунд кот ныряет за рамку и выглядывает снова. */
.lv2-vibe.is-peeking .lv2-vibe__avatar img { animation: lv2VibePeek 2.6s cubic-bezier(.22, .61, .36, 1) both; }
/* Под курсором подаётся вперёд — будто заметил. */
.lv2-vibe__toggle:hover .lv2-vibe__avatar img,
.lv2-vibe.is-open .lv2-vibe__avatar img { animation: lv2VibeAlert 3.2s ease-in-out infinite; }
/* Появление: подскакивает, когда страница уже нарисована. Видимость
   на анимацию не завязана — если движение отключено или заморожено,
   кот просто стоит на месте. */
.lv2-vibe.is-ready .lv2-vibe__toggle { animation: lv2VibePop .6s cubic-bezier(.2, 1.25, .4, 1); }
.lv2-vibe__status {
	position: absolute;
	top: 9px;
	right: 9px;
	z-index: 2;
	width: 15px;
	height: 15px;
	border: 3px solid #07303a;
	border-radius: 999px;
	background: var(--lime-bright);
	box-shadow: 0 0 0 5px rgba(184, 255, 98, .16);
}
.lv2-vibe__label {
	position: absolute;
	bottom: -9px;
	z-index: 3;
	padding: 6px 10px;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	background: rgba(10, 58, 69, .9);
	backdrop-filter: blur(10px);
	color: var(--ink);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
}
.lv2-vibe__panel {
	position: absolute;
	right: 0;
	bottom: 110px;
	width: min(320px, calc(100vw - 28px));
	padding: 20px;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: rgba(7, 42, 51, .96);
	backdrop-filter: blur(18px);
	box-shadow: 0 30px 70px -28px rgba(0, 0, 0, .9);
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	transform: translate3d(0, 14px, 0) scale(.96);
	transform-origin: 100% 100%;
	transition: opacity .18s var(--ease), transform .22s var(--ease);
}
.lv2-vibe__panel::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 3px;
	background: linear-gradient(90deg, var(--teal), var(--lime-bright), var(--amber));
}
.lv2-vibe.is-open .lv2-vibe__panel {
	opacity: 1;
	pointer-events: auto;
	transform: none;
}
.lv2-vibe__kicker {
	margin: 4px 0 8px;
	color: var(--teal);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.lv2-vibe__panel strong {
	display: block;
	color: var(--ink);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
}
.lv2-vibe__panel p:not(.lv2-vibe__kicker) {
	margin: 8px 0 14px;
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.5;
}
.lv2-vibe__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.lv2-vibe__actions button,
.lv2-vibe__actions a {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 13px;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	background: var(--surface-2);
	color: var(--ink);
	font: inherit;
	font-size: 12.5px;
	font-weight: 600;
	cursor: pointer;
	transition: background .16s var(--ease), color .16s var(--ease), transform .16s var(--ease);
}
.lv2-vibe__actions button:first-child {
	border-color: var(--lime-bright);
	background: var(--lime-bright);
	color: #16320a;
}
.lv2-vibe__actions button:hover,
.lv2-vibe__actions a:hover {
	background: var(--teal);
	border-color: var(--teal);
	color: #04222b;
	transform: translateY(-1px);
}

@keyframes lv2VibeAura {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
@keyframes lv2VibeFloat {
	0%, 100% { transform: translateX(-50%) translateY(3px) rotate(-1deg); }
	50% { transform: translateX(-50%) translateY(-3px) rotate(1deg); }
}
/* Лапа живёт отдельным ритмом — нарочно не кратным дыханию. */
@keyframes lv2VibePaw {
	0%, 100% { rotate: -3deg; }
	50% { rotate: 4deg; }
}
/* Размашистое «привет» поверх общего взмаха. */
@keyframes lv2VibePawWave {
	0%, 100% { rotate: 0deg; }
	20% { rotate: -16deg; }
	45% { rotate: 14deg; }
	70% { rotate: -10deg; }
	88% { rotate: 6deg; }
}
/* Визор дышит светом, изредка давая яркую вспышку. */
@keyframes lv2VibeVisor {
	0%, 44%, 100% { opacity: .28; }
	22% { opacity: .5; }
	52% { opacity: .95; }
	58% { opacity: .3; }
}
@keyframes lv2VibePop {
	from { transform: translateY(26px) scale(.86); }
	to { transform: none; }
}
@keyframes lv2VibeGrid {
	from { background-position: 0 0, 0 0, 50% 18%; }
	to { background-position: 0 36px, 36px 0, 50% 18%; }
}
@keyframes lv2VibeShine {
	0%, 72% { transform: translateX(-120%); }
	86%, 100% { transform: translateX(120%); }
}
/* Ныряет вниз, выглядывает с наклоном и садится обратно. */
@keyframes lv2VibePeek {
	0% { transform: translateX(-50%) translateY(2px) rotate(-1deg); }
	22% { transform: translateX(-50%) translateY(62px) rotate(-3deg); }
	46% { transform: translateX(-46%) translateY(-8px) rotate(7deg); }
	64% { transform: translateX(-52%) translateY(-4px) rotate(-5deg); }
	82% { transform: translateX(-50%) translateY(-6px) rotate(2deg); }
	100% { transform: translateX(-50%) translateY(2px) rotate(-1deg); }
}
/* Заметил курсор: подаётся вперёд и дышит чаще. */
@keyframes lv2VibeAlert {
	0%, 100% { transform: translateX(-50%) translateY(-5px) rotate(.5deg) scale(1.05); }
	50% { transform: translateX(-50%) translateY(-10px) rotate(-1.5deg) scale(1.06); }
}
@keyframes lv2VibeWave {
	0%, 100% { transform: translateX(-50%) translateY(2px) rotate(-1deg) scale(1); }
	18% { transform: translateX(-50%) translateY(-4px) rotate(-7deg) scale(1.03); }
	36% { transform: translateX(-50%) translateY(-2px) rotate(6deg) scale(1.03); }
	54% { transform: translateX(-50%) translateY(-4px) rotate(-6deg) scale(1.03); }
	72% { transform: translateX(-50%) translateY(-1px) rotate(4deg) scale(1.02); }
}

/* --- Экраны панели, облачко и чат ------------------------ */
.lv2-vibe__head { display: flex; align-items: center; gap: 8px; }
.lv2-vibe__back {
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	background: var(--surface-2);
	color: var(--ink);
	cursor: pointer;
}
/* Стрелка «вперёд» разворачивается в «назад» — своей иконки не заводим. */
.lv2-vibe__back svg { width: 13px; height: 13px; transform: rotate(180deg); }
/* display у класса перебил бы атрибут hidden — гасим явно. */
.lv2-vibe__back[hidden] { display: none; }
.lv2-vibe__screen { display: none; }
.lv2-vibe__screen.is-on { display: block; }
.lv2-vibe__step {
	margin: 0 0 6px;
	color: var(--muted-2);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.lv2-vibe__screen strong {
	display: block;
	color: var(--ink);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
}
.lv2-vibe__screen p:not(.lv2-vibe__step) {
	margin: 8px 0 14px;
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.5;
}
/* Сводка по заявкам — только для своих. */
.lv2-vibe__client {
	display: grid;
	gap: 6px;
	margin: 12px 0 14px;
	padding: 12px;
	border: 1px solid var(--line);
	border-radius: 14px;
	background: var(--surface-2);
}
.lv2-vibe__clientline { color: var(--body); font-size: 13px; line-height: 1.45; }
.lv2-vibe__clientline b { color: var(--lime-bright); }
.lv2-vibe__clientlink {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--teal);
	font-size: 12.5px;
	font-weight: 600;
}
.lv2-vibe__clientlink svg { width: 13px; height: 13px; }

/* Чат */
.lv2-vibe__log {
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-height: 260px;
	margin-bottom: 10px;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.lv2-vibe__line {
	max-width: 88%;
	padding: 9px 12px;
	border-radius: 14px;
	font-size: 13px;
	line-height: 1.45;
	white-space: pre-wrap;
}
.lv2-vibe__line--bot { border: 1px solid var(--line); background: var(--surface-2); color: var(--body); }
.lv2-vibe__line--me { align-self: flex-end; background: var(--teal); color: #04222b; }
.lv2-vibe__form { display: flex; gap: 8px; }
.lv2-vibe__form input {
	flex: 1;
	min-width: 0;
	padding: 10px 12px;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	background: var(--surface);
	color: var(--ink);
	font: inherit;
	font-size: 13px;
}
.lv2-vibe__form input::placeholder { color: var(--muted-2); }
.lv2-vibe__form button {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	flex: none;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--lime-bright);
	color: #16320a;
	cursor: pointer;
}
.lv2-vibe__form button svg { width: 16px; height: 16px; }
.lv2-vibe__note { margin: 8px 0 0 !important; font-size: 11.5px !important; color: var(--muted-2) !important; }

/* Реплика, с которой кот заговаривает первым. */
.lv2-vibe__bubble {
	position: absolute;
	right: 0;
	bottom: 108px;
	width: min(250px, calc(100vw - 40px));
	padding: 12px 14px;
	border: 1px solid var(--line);
	border-radius: 16px 16px 4px 16px;
	background: rgba(7, 42, 51, .96);
	backdrop-filter: blur(14px);
	box-shadow: 0 20px 44px -24px rgba(0, 0, 0, .9);
	color: var(--body);
	font-size: 13px;
	line-height: 1.45;
	text-align: left;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transform: translate3d(0, 10px, 0) scale(.96);
	transform-origin: 100% 100%;
	transition: opacity .2s var(--ease), transform .25s var(--ease);
}
.lv2-vibe.has-bubble .lv2-vibe__bubble { opacity: 1; pointer-events: auto; transform: none; }
.lv2-vibe.is-open .lv2-vibe__bubble { opacity: 0; pointer-events: none; }

/* Непрочитанное приглашение — точка на кнопке. */
.lv2-vibe__dot {
	position: absolute;
	top: 4px;
	left: 6px;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background: var(--amber);
	box-shadow: 0 0 0 4px rgba(255, 199, 44, .18);
}

/* Задумался над ответом — рамка пульсирует. */
.lv2-vibe.is-thinking .lv2-vibe__toggle::before { animation-duration: 2.2s; }
.lv2-vibe.is-thinking .lv2-vibe__avatar img { animation: lv2VibeAlert 1.6s ease-in-out infinite; }

/* Ночью кот дремлет: приглушаем свет и замедляем дыхание. */
.lv2-vibe.is-night .lv2-vibe__toggle::before { opacity: .3; animation-duration: 16s; }
.lv2-vibe.is-night .lv2-vibe__avatar img { animation-duration: 9s; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .35)) saturate(.7) brightness(.82); }
.lv2-vibe.is-night .lv2-vibe__status { background: var(--amber); box-shadow: 0 0 0 5px rgba(255, 199, 44, .14); }

/* На телефоне снизу стоит липкая панель — кот садится над ней. */
@media (max-width: 860px) {
	.lv2-vibe {
		right: calc(env(safe-area-inset-right, 0px) + 14px);
		bottom: calc(env(safe-area-inset-bottom, 0px) + 86px);
	}
	.lv2-vibe__toggle { width: 74px; height: 74px; border-radius: 24px; }
	.lv2-vibe__avatar { inset: 7px; width: 60px; height: 60px; border-radius: 19px; }
	.lv2-vibe__avatar img { height: 132px; bottom: -70px; }
	.lv2-vibe__label { display: none; }
	.lv2-vibe__panel { bottom: 90px; padding: 18px; }
	.lv2-vibe__bubble { bottom: 88px; }
	.lv2-vibe__log { max-height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
	.lv2-vibe__toggle::before,
	.lv2-vibe.is-ready .lv2-vibe__toggle,
	.lv2-vibe__avatar .lv2-vibe__part--paw,
	.lv2-vibe__avatar .lv2-vibe__part--visor,
	.lv2-vibe__avatar,
	.lv2-vibe__avatar::after,
	.lv2-vibe__avatar img,
	.lv2-vibe.is-waving .lv2-vibe__avatar img,
	.lv2-vibe.is-peeking .lv2-vibe__avatar img { animation: none !important; }
	.lv2-vibe__cat { transform: none !important; }
}

/* --------------------------------------------------------
   Правовые документы
   -------------------------------------------------------- */
.lv2-doc { padding: clamp(110px, 14vw, 170px) 0 clamp(60px, 8vw, 110px); }
.lv2-doc__inner { max-width: 820px; }
.lv2-doc__title {
	margin: 0 0 8px;
	color: var(--ink);
	font-size: clamp(28px, 4vw, 42px);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -.02em;
}
.lv2-doc__meta { margin: 0 0 clamp(26px, 4vw, 40px); color: var(--muted-2); font-size: 13.5px; }
.lv2-doc__body { color: var(--body); font-size: 15.5px; line-height: 1.68; }
.lv2-doc__body h2 {
	margin: clamp(28px, 4vw, 42px) 0 12px;
	color: var(--ink);
	font-size: clamp(19px, 2.4vw, 23px);
	font-weight: 700;
	line-height: 1.25;
}
.lv2-doc__body h3 {
	margin: 24px 0 10px;
	color: var(--ink);
	font-size: 16.5px;
	font-weight: 600;
}
.lv2-doc__body p { margin: 0 0 14px; }
/* Списки в теме без маркеров — документу они нужны. */
.lv2-doc__body ul { margin: 0 0 16px; padding-left: 22px; list-style: disc; }
.lv2-doc__body ol { margin: 0 0 16px; padding-left: 22px; list-style: decimal; }
.lv2-doc__body li { margin-bottom: 8px; }
.lv2-doc__body li::marker { color: var(--teal); }
.lv2-doc__body a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.lv2-doc__body a:hover { color: var(--lime-bright); }
.lv2-doc__body strong { color: var(--ink); font-weight: 600; }
/* Реквизиты в конце документа — отдельной карточкой. */
.lv2-doc__body .lv2-doc-req {
	margin-top: clamp(28px, 4vw, 40px);
	padding: clamp(18px, 3vw, 26px);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
}
.lv2-doc__body .lv2-doc-req p { margin-bottom: 6px; }

/* --------------------------------------------------------
   Уведомление о cookie
   -------------------------------------------------------- */
.lv2-cookie {
	position: fixed;
	left: max(18px, env(safe-area-inset-left));
	bottom: max(18px, env(safe-area-inset-bottom));
	z-index: 95;
	display: flex;
	align-items: center;
	gap: 14px;
	width: min(430px, calc(100vw - 36px));
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: rgba(7, 42, 51, .96);
	backdrop-filter: blur(16px);
	box-shadow: 0 24px 54px -30px rgba(0, 0, 0, .9);
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .35s var(--ease), transform .35s var(--ease);
	pointer-events: none;
}
.lv2-cookie.is-in { opacity: 1; transform: none; pointer-events: auto; }
.lv2-cookie__text { flex: 1; min-width: 0; color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.lv2-cookie__text a { color: var(--teal); text-decoration: underline; text-underline-offset: 2px; }
.lv2-cookie__text a:hover { color: var(--lime-bright); }
.lv2-cookie__ok {
	flex: none;
	padding: 9px 18px;
	border: 0;
	border-radius: 999px;
	background: var(--lime-bright);
	color: #16320a;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.lv2-cookie__ok:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -10px rgba(184, 255, 98, .6); }

/* На телефоне баннер во всю ширину и над липкой панелью. */
@media (max-width: 860px) {
	.lv2-cookie {
		left: 12px;
		right: 12px;
		bottom: calc(env(safe-area-inset-bottom, 0px) + 78px);
		width: auto;
	}
}
@media (prefers-reduced-motion: reduce) {
	.lv2-cookie { transition: none; }
}

/* --------------------------------------------------------
   Мобильная версия: плавающие элементы не спорят друг с другом
   -------------------------------------------------------- */
/* Открыто меню: шапка сплошная, чтобы пункты не просвечивали сквозь
   логотип при прокрутке, а плавающие элементы уходят из-под пальца. */
.lv2.is-menu-open .lv2-header { background: var(--bg); }
.lv2.is-menu-open .lv2-vibe,
.lv2.is-menu-open .lv2-cookie,
.lv2.is-menu-open .lv2-sticky { display: none; }

@media (max-width: 860px) {
	/* Пока висит cookie-баннер, кот стоит над ним: высоту баннера
	   подставляет скрипт. */
	.lv2.has-cookie .lv2-vibe {
		bottom: calc(env(safe-area-inset-bottom, 0px) + 86px + var(--lv2-cookie-h, 0px));
	}

	/* Цифры: мобильное правило для иконки выше по файлу перебивалось
	   общим — иконка возвращалась в угол и наезжала на «Золотой».
	   Повторяем его здесь, после общего. */
	.lv2-stat__icon {
		position: static;
		width: 26px;
		height: 26px;
		margin-bottom: 12px;
	}
	/* Длинные слова переносим по слогам, а не рубим посреди буквы. */
	.lv2-stat__label {
		overflow-wrap: break-word;
		hyphens: auto;
		-webkit-hyphens: auto;
	}

	/* Названия услуг в аккордеоне — в две строки вместо многоточия. */
	.lv2-fold__spine b {
		white-space: normal;
		overflow: visible;
		text-overflow: clip;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		line-height: 1.25;
	}
}

@media (max-width: 680px) {
	/* Блог на телефоне — три свежие статьи, остальное по кнопке «Все
	   статьи»: шесть карточек подряд давали 3000 пикселей листания. */
	.lv2-blog__grid > :nth-child(n+4) { display: none; }
}

@media (max-width: 480px) {
	/* Кот поменьше: на узком экране он заметно закрывал текст справа. */
	.lv2-vibe__toggle { width: 62px; height: 62px; border-radius: 20px; }
	.lv2-vibe__avatar { inset: 6px; width: 50px; height: 50px; border-radius: 16px; }
	.lv2-vibe__avatar img { height: 112px; bottom: -60px; }
	.lv2-vibe__status { width: 12px; height: 12px; top: 6px; right: 6px; border-width: 2px; }
	.lv2-vibe__panel { bottom: 76px; }
	.lv2-vibe__bubble { bottom: 74px; }
	.lv2-stat { padding: 18px 14px 16px; }
}