/* ==================================================================
   Kelpie_v2 — Таблица, фронтенд
   «Закрытые» стили: блок изолирован от глобальных стилей сайта и темы.
   База зафиксирована через !important + сброс наследования, поэтому
   чистка/перетряска глобального CSS не должна ломать вид блока.
   Все правила скоупированы внутри .kbv2-tbl.

   Принцип «таблица → карточки» портирован из блока v1 table:
   на десктопе — обычная таблица с шапкой колонок; на мобильном (≤700px)
   thead скрывается, каждая строка становится карточкой, а каждая ячейка
   показывает свою метку из data-label (заголовок соответствующей колонки).

   Брейкпоинты (без горизонтального переполнения на 320/360/420):
     ≤768px — межблочный отступ снизу 56px (общий ритм страницы);
     ≤700px — таблица схлопывается в карточки (строка = карточка, ячейки с метками);
     ≤560px / ≤420px — заголовок и паддинги мельче, всё в один столбец без overflow.
   ================================================================== */

/* ── Защитный сброс ───────────────────────────────────────────── */
.kbv2-tbl,
.kbv2-tbl *,
.kbv2-tbl *::before,
.kbv2-tbl *::after {
	box-sizing: border-box !important;
}

/* ── typography firewall: вернуть наследование голым элементам, чтобы темовые `p{font-size}` / `h*{}` / `td{}` не продавливали блок; классовые правила ниже всё равно выигрывают ── */
.kbv2-tbl :where(p,h1,h2,h3,h4,h5,h6,ul,ol,li,blockquote,figure,figcaption,small,strong,em,b,i,span,a,button,input,label,table,thead,tbody,tr,th,td) { font-size: inherit; line-height: inherit; font-family: inherit; }


.kbv2-tbl {
	--tbl-ink:#16243B;
	--tbl-ink-soft:#34425C;
	--tbl-ink-soft2:#5A6678;
	--tbl-mute:#727C8C;
	--tbl-paper:#FFFFFF;
	--tbl-line:#E5E9F1;
	--tbl-line2:#E3E9F2;
	--tbl-soft:#F4F7FB;
	--tbl-soft2:#F5FAFF;
	--tbl-blue:#0088C4;
	--tbl-blue2:#1888D6;
	--tbl-blue-deep:#006F9F;
	--tbl-orange:#FF6B1A;
	--tbl-green:#27B24A;
	--tbl-grid:#D9E4F2;

	max-width:1200px !important;
	margin:0 auto 88px !important;
	padding:0 20px !important;
	font-family:'Manrope', system-ui, -apple-system, "Segoe UI", sans-serif !important;
	font-size:16px !important;
	line-height:1.5 !important;
	text-align:left !important;
	color:var(--tbl-ink) !important;
	background:none !important;
}

/* Сброс наследуемых элементов через :where() (0 специфичности),
   чтобы классовые отступы (.kbv2-tbl__top и т.п.) не проигрывали сбросу */
.kbv2-tbl :where(h2,p,div,span,table,th,td) { margin:0 !important; padding:0; }
.kbv2-tbl a { color:var(--tbl-blue) !important; text-decoration:none !important; border-bottom:1px solid currentColor !important; }

/* ── Шапка блока ──────────────────────────────────────────────── */
.kbv2-tbl__top{ margin-bottom:36px !important; }
.kbv2-tbl__eyebrow{
	font-family:'Manrope', system-ui, sans-serif !important; font-weight:700 !important; font-size:11.5px !important;
	letter-spacing:2px !important; color:var(--tbl-mute) !important; text-transform:uppercase !important;
	margin-bottom:11px !important;
}
.kbv2-tbl__head{
	font-family:'Manrope', system-ui, sans-serif !important; font-weight:800 !important;
	font-size:31px !important; line-height:1.16 !important; letter-spacing:-.4px !important; color:var(--tbl-ink) !important;
}
.kbv2-tbl__head strong{ color:var(--tbl-blue) !important; font-weight:800 !important; }

/* ── Обёртка таблицы ──────────────────────────────────────────── */
.kbv2-tbl__scroll{
	overflow-x:auto !important;
	border:1px solid var(--tbl-line) !important;
	border-radius:16px !important;
	background:var(--tbl-paper) !important;
}

.kbv2-tbl__table{
	width:100% !important;
	border-collapse:collapse !important;
	font-size:15px !important;
	line-height:1.55 !important;
	color:var(--tbl-ink-soft) !important;
}

/* ── Заголовки колонок ────────────────────────────────────────── */
.kbv2-tbl__table thead th{
	background:var(--tbl-blue) !important;
	color:#fff !important;
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:700 !important;
	font-size:13.5px !important;
	line-height:1.4 !important;
	letter-spacing:.2px !important;
	padding:15px 22px !important;
	text-align:left !important;
	vertical-align:middle !important;
}
.kbv2-tbl__table thead th:first-child{ border-top-left-radius:0 !important; }

/* ── Ячейки тела ──────────────────────────────────────────────── */
.kbv2-tbl__table tbody td{
	padding:15px 22px !important;
	background:var(--tbl-paper) !important;
	border-top:1px solid var(--tbl-line) !important;
	vertical-align:top !important;
	font-size:15px !important;
	line-height:1.6 !important;
	color:var(--tbl-ink-soft) !important;
}
.kbv2-tbl__table tbody tr:first-child td{ border-top:none !important; }
.kbv2-tbl__table tbody tr:nth-child(even) td{ background:var(--tbl-soft) !important; }

/* Первый столбец — «фактор», жирный акцент */
.kbv2-tbl__table tbody td.kbv2-tbl__cell--first{
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:800 !important;
	color:var(--tbl-ink) !important;
	font-size:15px !important;
	line-height:1.45 !important;
	width:34% !important;
}

.kbv2-tbl__table strong,
.kbv2-tbl__table b{ color:var(--tbl-ink) !important; font-weight:700 !important; }
.kbv2-tbl__table em,
.kbv2-tbl__table i{ font-style:italic !important; }

/* ── Адаптив ──────────────────────────────────────────────────── */
@media (max-width:768px){
	.kbv2-tbl{ margin-bottom:56px !important; }
	.kbv2-tbl__head{ font-size:25px !important; }
}

/* ── ≤700px: таблица превращается в карточки ──────────────────── */
@media (max-width:700px){
	.kbv2-tbl__scroll{
		overflow:visible !important;
		border:none !important;
		background:transparent !important;
		border-radius:0 !important;
	}

	.kbv2-tbl__table,
	.kbv2-tbl__table thead,
	.kbv2-tbl__table tbody,
	.kbv2-tbl__table tr,
	.kbv2-tbl__table th,
	.kbv2-tbl__table td{
		display:block !important;
		width:100% !important;
	}

	.kbv2-tbl__table thead{
		position:absolute !important;
		width:1px !important; height:1px !important;
		padding:0 !important; margin:-1px !important;
		overflow:hidden !important; clip:rect(0,0,0,0) !important;
		white-space:nowrap !important; border:0 !important;
	}

	.kbv2-tbl__table tbody{
		display:flex !important;
		flex-direction:column !important;
		gap:14px !important;
	}

	.kbv2-tbl__table tbody tr,
	.kbv2-tbl__table tbody tr:nth-child(even){
		background:var(--tbl-paper) !important;
		border:1px solid var(--tbl-line) !important;
		border-radius:14px !important;
		padding:6px 18px !important;
		box-shadow:0 1px 0 rgba(22,36,59,.03), 0 18px 36px -30px rgba(22,36,59,.22) !important;
	}

	.kbv2-tbl__table tbody td,
	.kbv2-tbl__table tbody tr:nth-child(even) td{
		background:transparent !important;
		border:none !important;
		padding:12px 0 !important;
		width:100% !important;
	}

	.kbv2-tbl__table tbody td + td{
		border-top:1px solid var(--tbl-line) !important;
	}

	/* Метка-подпись из data-label (заголовок колонки) */
	.kbv2-tbl__table tbody td[data-label]::before{
		content:attr(data-label) !important;
		display:block !important;
		font-family:'Manrope', system-ui, sans-serif !important;
		font-size:10.5px !important;
		font-weight:700 !important;
		letter-spacing:1.2px !important;
		text-transform:uppercase !important;
		color:var(--tbl-mute) !important;
		margin-bottom:6px !important;
	}

	/* Первый столбец-«фактор» на мобильном — без принудительной ширины */
	.kbv2-tbl__table tbody td.kbv2-tbl__cell--first{
		width:100% !important;
		font-size:16px !important;
	}
}

@media (max-width:560px){
	.kbv2-tbl__head{ font-size:22px !important; }
	.kbv2-tbl__table tbody tr{ padding:4px 15px !important; }
}

@media (max-width:420px){
	.kbv2-tbl{ padding:0 14px !important; }
	.kbv2-tbl__head{ font-size:20px !important; }
	.kbv2-tbl__table{ font-size:14.5px !important; }
	.kbv2-tbl__table tbody td{ font-size:14.5px !important; }
	.kbv2-tbl__table tbody td.kbv2-tbl__cell--first{ font-size:15px !important; }
	.kbv2-tbl__table tbody tr{ padding:2px 13px !important; }
}


/* === опциональная рамка с сеткой (тумблер в админке, по умолчанию выкл) === */
.kbv2-tbl.is-framed { background:#fff !important; border:1px solid #E3E9F2 !important; border-radius:24px !important; padding:32px 34px !important; box-shadow:0 1px 0 rgba(22,36,59,.03), 0 26px 52px -34px rgba(22,36,59,.22) !important; overflow:hidden !important; position:relative !important; }
.kbv2-tbl.is-framed > * { position:relative !important; z-index:1 !important; }
.kbv2-tbl.is-framed::before { content:"" !important; position:absolute !important; inset:0 !important; pointer-events:none !important; z-index:0 !important; border-radius:24px !important; background-image:linear-gradient(#D9E4F2 1px,transparent 1px),linear-gradient(90deg,#D9E4F2 1px,transparent 1px) !important; background-size:34px 34px !important; opacity:.55 !important; -webkit-mask-image:radial-gradient(120% 130% at 92% 0%,#000 22%,transparent 66%) !important; mask-image:radial-gradient(120% 130% at 92% 0%,#000 22%,transparent 66%) !important; }
@media (max-width:768px){ .kbv2-tbl.is-framed { padding:22px 18px !important; } }
