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

   Брейкпоинты (адаптив):
     ≤768px — внутренние отступы блока меньше; нижний внешний отступ 56px;
              карточка шага складывается в колонку (название над описанием).
     ≤560px — рельса (номер) уже; меньше gap между рельсой и карточкой.
     ≤420px — заголовок мельче; уменьшены паддинги; рельса 44px; gap 12px;
              исключён горизонтальный скролл на 320/360/420.
   ================================================================== */

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

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


.kbv2-st {
	--st-ink:#16243B;
	--st-ink-soft:#34425C;
	--st-mute:#727C8C;
	--st-paper:#FFFFFF;
	--st-line:#E5E9F1;
	--st-soft:#F4F7FB;
	--st-blue:#0088C4;
	--st-blue-line:#CDE8F4;
	--st-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(--st-ink) !important;
	background:none !important;
}

/* Сброс наследуемых элементов от темы */
.kbv2-st a { color:var(--st-blue) !important; text-decoration:underline !important; }
.kbv2-st b, .kbv2-st strong { font-weight:700 !important; }

/* ── Карточка-обёртка с фоновой сеткой ────────────────────────── */
.kbv2-st__block {
	position:relative !important;
	overflow:hidden !important;
	background:var(--st-paper) !important;
	border:1px solid var(--st-line) !important;
	border-radius:28px !important;
	padding:32px 34px 36px !important;
	margin:0 !important;
	box-shadow:0 1px 0 rgba(22,36,59,.03), 0 26px 52px -34px rgba(22,36,59,.22) !important;
}
.kbv2-st__block::before {
	content:"" !important;
	position:absolute !important;
	inset:0 !important;
	pointer-events:none !important;
	background-image:linear-gradient(var(--st-grid) 1px,transparent 1px),linear-gradient(90deg,var(--st-grid) 1px,transparent 1px) !important;
	background-size:34px 34px !important;
	opacity:.5 !important;
	-webkit-mask-image:radial-gradient(120% 130% at 90% 0%,#000 20%,transparent 64%) !important;
	        mask-image:radial-gradient(120% 130% at 90% 0%,#000 20%,transparent 64%) !important;
}

/* ── Надзаголовок ─────────────────────────────────────────────── */
.kbv2-st__eyebrow {
	position:relative !important;
	z-index:1 !important;
	margin:0 0 12px !important;
	padding:0 !important;
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:700 !important;
	font-size:12px !important;
	letter-spacing:2px !important;
	color:var(--st-mute) !important;
	text-transform:uppercase !important;
}

/* ── Заголовок ────────────────────────────────────────────────── */
.kbv2-st__head {
	position:relative !important;
	z-index:1 !important;
	margin:0 !important;
	padding:0 !important;
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:800 !important;
	font-size:31px !important;
	line-height:1.14 !important;
	letter-spacing:-.4px !important;
	color:var(--st-ink) !important;
	text-wrap:balance;
	max-width:none !important;
}
.kbv2-st__head strong,
.kbv2-st__head b {
	color:var(--st-blue) !important;
	font-weight:800 !important;
}

/* ── Таймлайн ─────────────────────────────────────────────────── */
.kbv2-st__time {
	position:relative !important;
	z-index:1 !important;
	margin-top:26px !important;
}
.kbv2-st__row {
	position:relative !important;
	display:grid !important;
	grid-template-columns:60px 1fr !important;
	gap:22px !important;
	padding-bottom:22px !important;
}
.kbv2-st__row.is-last {
	padding-bottom:0 !important;
}
.kbv2-st__rail {
	position:relative !important;
	display:flex !important;
	justify-content:center !important;
}
.kbv2-st__n {
	position:relative !important;
	z-index:2 !important;
	width:48px !important;
	height:48px !important;
	border-radius:50% !important;
	flex:0 0 auto !important;
	display:flex !important;
	align-items:center !important;
	justify-content:center !important;
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:800 !important;
	font-size:19px !important;
	color:#fff !important;
	background:var(--st-blue) !important;
	box-shadow:0 8px 18px -7px rgba(0,136,196,.6) !important;
}
/* Пунктирная соединительная линия между шагами */
.kbv2-st__row:not(.is-last) .kbv2-st__rail::after {
	content:"" !important;
	position:absolute !important;
	top:48px !important;
	bottom:-22px !important;
	left:50% !important;
	transform:translateX(-50%) !important;
	width:2px !important;
	background:repeating-linear-gradient(180deg,var(--st-blue-line) 0 7px,transparent 7px 14px) !important;
	z-index:1 !important;
}
.kbv2-st__card {
	padding-top:4px !important;
	min-width:0 !important;
}
/* строка «название шага + сколько занимает» */
.kbv2-st__cardhead {
	display:flex !important;
	align-items:baseline !important;
	gap:12px !important;
	flex-wrap:wrap !important;
	margin-bottom:7px !important;
}
.kbv2-st__st {
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:800 !important;
	font-size:17px !important;
	line-height:1.3 !important;
	color:var(--st-ink) !important;
	margin:0 !important;
	min-width:0 !important;
}
.kbv2-st__tm {
	flex:0 0 auto !important;
	white-space:nowrap !important;
	font-family:'Manrope', system-ui, sans-serif !important;
	font-weight:700 !important;
	font-size:11px !important;
	letter-spacing:1.2px !important;
	text-transform:uppercase !important;
	color:var(--st-mute) !important;
	background:var(--st-soft) !important;
	border:1px solid var(--st-line) !important;
	border-radius:999px !important;
	padding:5px 11px !important;
}
.kbv2-st__st strong, .kbv2-st__st b { color:var(--st-blue) !important; font-weight:800 !important; }
.kbv2-st__sb {
	font-size:15px !important;
	max-width:74ch !important;
	line-height:1.55 !important;
	color:var(--st-ink-soft) !important;
	min-width:0 !important;
	overflow-wrap:break-word !important;
	word-wrap:break-word !important;
}
.kbv2-st__sb b, .kbv2-st__sb strong { color:var(--st-ink) !important; font-weight:700 !important; }

/* ── Адаптив ──────────────────────────────────────────────────── */
@media (max-width:768px) {
	.kbv2-st { margin-bottom:56px !important; }
	.kbv2-st__block { padding:26px 22px 28px !important; border-radius:22px !important; }
	.kbv2-st__head { font-size:26px !important; }
	.kbv2-st__cardhead { gap:10px !important; }
}
@media (max-width:560px) {
	.kbv2-st__block { padding:22px 16px 24px !important; border-radius:18px !important; }
	.kbv2-st__head { font-size:22px !important; }
	.kbv2-st__row { grid-template-columns:48px 1fr !important; gap:16px !important; }
}
@media (max-width:420px) {
	.kbv2-st { padding:0 14px !important; }
	.kbv2-st__block { padding:18px 13px 20px !important; border-radius:16px !important; }
	.kbv2-st__head { font-size:20px !important; }
	.kbv2-st__row { grid-template-columns:44px 1fr !important; gap:12px !important; }
	.kbv2-st__n { width:44px !important; height:44px !important; font-size:17px !important; }
	.kbv2-st__row:not(.is-last) .kbv2-st__rail::after { top:44px !important; }
	.kbv2-st__st { font-size:16px !important; }
	.kbv2-st__tm { font-size:10px !important; padding:4px 9px !important; }
	.kbv2-st__sb { font-size:14px !important; }
}


/* === фронт: каркас-карточка плоский — без рамки, сетки-фона, тени (как в макете на странице) === */
.kbv2-st__block { background:transparent !important; border:none !important; box-shadow:none !important; border-radius:0 !important; padding:0 !important; overflow:visible !important; }
.kbv2-st__block::before { display:none !important; }


/* === опциональная рамка с сеткой (тумблер в админке, по умолчанию выкл) === */
.kbv2-st.is-framed { background:#fff !important; border:none !important; border-radius:24px !important; padding:32px 34px !important; box-shadow:none !important; overflow:hidden !important; position:relative !important; }
.kbv2-st.is-framed > * { position:relative !important; z-index:1 !important; }
.kbv2-st.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-st.is-framed { padding:22px 18px !important; } }