/* Стили страниц из tools/pages (посадочные, сравнения, справочник).
   ------------------------------------------------------------------
   Токены — из UI-кита «kosareva.cloud» (Реклама/UI Kit): палитра, радиусы
   10/14/20/28, тени, Manrope + JetBrains Mono, контейнер 1280 с полями 24.
   Префикс kp- (kosareva pages). Тема только тёмная — как весь сайт.

   На проде поверх этого файла лежит site.css сборки (Tailwind preflight),
   поэтому веса заголовков и базовые отступы задаём явно, а не полагаемся
   на браузерные значения. */

:root {
  --kp-primary: #14B8A6;
  --kp-primary-hover: #2DD4BF;
  --kp-primary-active: #0D9488;
  --kp-primary-deep: #115E59;
  --kp-primary-soft: rgba(20, 184, 166, .12);
  --kp-primary-border: rgba(20, 184, 166, .32);
  --kp-on-primary: #04211D;
  --kp-bg: #0A0B0B;
  --kp-bg-elevated: #0E1010;
  --kp-surface: #121414;
  --kp-surface-raised: #1A1E1E;
  --kp-field: #151918;
  --kp-field-border: #262B2B;
  --kp-border: #202424;
  --kp-border-strong: #2E3434;
  --kp-text: #FFFFFF;
  --kp-body: #E8ECEC;
  --kp-secondary: #A7AFAF;
  --kp-muted: #6F7878;
  --kp-warn: #D29922;
  --kp-bad: #E5534B;
  --kp-r-sm: 8px;
  --kp-r-md: 10px;
  --kp-r-lg: 14px;
  --kp-r-xl: 20px;
  --kp-r-2xl: 28px;
  --kp-shadow-md: 0 8px 24px rgba(0, 0, 0, .45);
  --kp-shadow-lg: 0 24px 64px rgba(0, 0, 0, .6);
  --kp-glow: 0 0 44px rgba(20, 184, 166, .22);
  --kp-t: .16s ease;
  --kp-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --kp-sans: Manrope, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* совместимость с плашкой доверия (trust-strip.css читает --line/--muted) */
  --line: var(--kp-border);
  --muted: var(--kp-secondary);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-gutter: stable; }
body.kp-body {
  margin: 0; overflow-x: hidden;
  background: var(--kp-bg); color: var(--kp-body);
  font: 16px/1.6 var(--kp-sans);
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
  -webkit-font-smoothing: antialiased; text-wrap: pretty;
}
.kp-main a { color: inherit; text-decoration: none; }
.kp-main a:hover { color: var(--kp-primary-hover); }
.kp-main button { font: inherit; }
.kp-main code, .kp-main pre, .kp-main kbd { font-family: var(--kp-mono); font-variant-ligatures: none; }
.kp-main code, .kp-main kbd { padding: 2px 6px; border-radius: 6px; background: var(--kp-surface-raised); color: var(--kp-text); font-size: .88em; }
.kp-main h1, .kp-main h2, .kp-main h3 { color: var(--kp-text); margin: 0; text-wrap: balance; }
.kp-main h1, .kp-main h2 { font-weight: 800; letter-spacing: -.03em; }
.kp-main h3 { font-weight: 700; letter-spacing: -.01em; }
.kp-main p { margin: 0; }
::selection { background: var(--kp-primary); color: var(--kp-on-primary); }
/* Скроллбар — как на главной (index.html). */
html { overflow-y: scroll; scrollbar-gutter: stable; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0A0A0A; }
::-webkit-scrollbar-thumb { background: #14B8A6; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #2BD3C0; }
.kp-main :focus-visible { outline: 2px solid var(--kp-primary); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .kp-main * { transition: none !important; } }

.kp-container { width: min(1280px, 100% - 48px); margin-inline: auto; }

/* ---------- шапка/подвал (сборка их заменяет на общие) ---------- */
.kp-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--kp-border); background: rgba(10, 11, 11, .84); backdrop-filter: blur(14px); }
.kp-header-row { height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.kp-brand { display: flex; align-items: center; gap: 12px; color: var(--kp-text); text-decoration: none; font-size: 17px; font-weight: 650; letter-spacing: -.02em; }
.kp-brand em { font-style: normal; color: var(--kp-secondary); font-weight: 400; }
.kp-nav { display: flex; gap: 24px; font-size: 14px; color: var(--kp-body); }
.kp-nav a { color: inherit; text-decoration: none; }
/* Шапка — как на главной (SiteHeader.astro), без Tailwind: те же размеры и цвета. */
#kc-site-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(38, 38, 38, .6); background: rgba(10, 10, 10, .8); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.kc-header-inner { max-width: 80rem; margin: 0 auto; padding: 0 1.5rem; height: 4rem; display: flex; align-items: center; justify-content: space-between; }
.kc-logo-link { display: flex; align-items: center; gap: .75rem; color: var(--kp-text); text-decoration: none; }
.kc-logo-image { display: block; height: 1.75rem; width: auto; flex: 0 0 auto; }
.kc-logo-wordmark { font-weight: 600; font-size: 17px; letter-spacing: -.025em; line-height: 1; user-select: none; }
.kc-logo-domain { color: #A3A3A3; font-weight: 400; }
.kc-header-nav { display: none; align-items: center; gap: 1.5rem; font-size: .875rem; }
.kc-header-nav a { color: #E5E5EA; text-decoration: none; transition: color .15s; }
.kc-header-nav a:hover { color: #fff; }
.kc-header-nav a.text-accent, #kc-mobile-menu a.text-accent { color: #14B8A6; }
.kc-header-auth { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; }
.kc-login-link { display: none; height: 2.25rem; align-items: center; justify-content: center; border-radius: .375rem; background: #14B8A6; padding: 0 1rem; font-size: .875rem; font-weight: 500; color: #fff; text-decoration: none; transition: background .15s; }
.kc-login-link:hover { background: #2BD3C0; }
.kc-menu-button { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border: 0; border-radius: .375rem; background: transparent; color: #A3A3A3; cursor: pointer; }
.kc-menu-button:hover { color: #fff; background: #141414; }
.kc-menu-button svg { width: 1.25rem; height: 1.25rem; }
.kc-menu-button[aria-expanded="true"] .kc-menu-icon-open, .kc-menu-button:not([aria-expanded="true"]) .kc-menu-icon-close { display: none; }
#kc-mobile-menu { position: sticky; top: 4rem; z-index: 40; border-bottom: 1px solid rgba(38, 38, 38, .6); background: rgba(10, 10, 10, .95); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
#kc-mobile-menu.hidden { display: none; }
.kc-mobile-inner { max-width: 80rem; margin: 0 auto; padding: .75rem 1.5rem; display: flex; flex-direction: column; }
#kc-mobile-menu .mobile-nav-link { padding: .75rem 0; font-size: .875rem; color: #E5E5EA; text-decoration: none; border-bottom: 1px solid rgba(38, 38, 38, .3); }
#kc-mobile-menu .kc-login-link { display: inline-flex; height: 2.75rem; margin: 1rem 0 .5rem; border-bottom: 0; }
@media (min-width: 768px) {
  .kc-header-nav { display: flex; }
  .kc-header-auth { min-width: 136px; }
  .kc-login-link { display: inline-flex; }
  .kc-menu-button, #kc-mobile-menu { display: none; }
}

/* Выпадающий список — как в разделе «Цены» кабинета. */
.kcsel { position: relative; }
.kcsel > select { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.kcsel-btn { width: 100%; min-height: 46px; display: flex; align-items: center; gap: 8px; text-align: left; background: var(--kp-field); border: 1px solid var(--kp-field-border); border-radius: var(--kp-r-md); padding: 0 14px; font-size: 15px; color: var(--kp-text); cursor: pointer; font-family: inherit; }
.kcsel-btn:hover { border-color: var(--kp-border-strong); }
.kcsel-btn span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kcsel-btn svg { width: 16px; height: 16px; color: #14B8A6; flex-shrink: 0; transition: transform .16s ease; }
.kcsel.open .kcsel-btn { border-color: #14B8A6; box-shadow: 0 0 0 3px rgba(20, 184, 166, .15); }
.kcsel.open .kcsel-btn svg { transform: rotate(180deg); }
.kcsel-list { display: none; position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 6px); max-height: 260px; overflow-y: auto; background: #141414; border: 1px solid #262626; border-radius: 10px; padding: 4px; box-shadow: 0 16px 40px rgba(0, 0, 0, .55); }
.kcsel.open .kcsel-list { display: block; }
.kcsel-opt { padding: 8px 10px; border-radius: 6px; font-size: 14px; color: #D4D6DD; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kcsel-opt:hover { background: #1f1f1f; color: #FAFAFA; }
.kcsel-opt.sel { background: rgba(20, 184, 166, .14); color: #2BD3C0; }

/* Подвал — как на основных страницах сайта (SiteFooter.astro). */
.kc-footer { box-sizing: border-box; width: 100%; padding: 4rem 0 2.5rem; border-top: 1px solid var(--kp-border); background: var(--kp-bg, #0a0a0a); color: var(--kp-text); font-size: 16px; line-height: 1.5; text-align: left; }
.kc-footer * { box-sizing: border-box; }
.kc-footer-inner { width: 100%; max-width: 80rem; margin: 0 auto; padding: 0 1.5rem; }
.kc-footer-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2.5rem; margin: 0 0 3rem; }
.kc-footer-brand { grid-column: span 2 / span 2; min-width: 0; }
.kc-footer-logo { display: flex; align-items: center; gap: .75rem; margin: 0 0 1rem; color: inherit; text-decoration: none; }
.kc-footer-logo img { display: block; width: auto; height: 1.5rem; max-width: none; flex: 0 0 auto; }
.kc-footer-wordmark { color: var(--kp-text); font-size: 17px; font-weight: 600; line-height: 1; letter-spacing: -.025em; user-select: none; }
.kc-footer-domain { color: var(--kp-secondary); font-weight: 400; }
.kc-footer-description { max-width: 28rem; margin: 0; color: var(--kp-secondary); font-size: .875rem; line-height: 1.625; }
.kc-footer-legal { margin-top: 1.5rem; color: var(--kp-muted); font-size: .75rem; line-height: 1.625; }
.kc-footer-heading { margin: 0 0 1rem; color: var(--kp-text); font-size: .875rem; font-weight: 600; line-height: 1.25rem; }
.kc-footer-links { margin: 0; padding: 0; color: var(--kp-secondary); font-size: .875rem; line-height: 1.25rem; list-style: none; }
.kc-footer-links li { margin: 0; padding: 0; }
.kc-footer-links li + li { margin-top: .5rem; }
.kc-footer-contacts li + li { margin-top: .75rem; }
.kc-footer-links a, .kc-footer-bottom a { color: inherit; text-decoration: none; transition: color .15s; }
.kc-footer-links a:hover, .kc-footer-bottom a:hover { color: #fff; }
.kc-footer-phone { display: flex; align-items: center; gap: .625rem; font-size: 1.25rem; font-weight: 500; line-height: 1.75rem; }
.kc-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0; padding-top: 2rem; border-top: 1px solid var(--kp-border); color: var(--kp-muted); font-size: .75rem; line-height: 1rem; }
@media (max-width: 1023px) { .kc-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .kc-footer { padding-top: 3rem; } .kc-footer-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; } .kc-footer-brand { grid-column: auto; } .kc-footer-bottom { flex-direction: column; align-items: flex-start; } }
@media (max-width: 900px) { .kp-nav { display: none; } }

/* ---------- кнопки ---------- */
.kp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border: 1px solid transparent; border-radius: var(--kp-r-md); font-weight: 700; font-size: 15px; letter-spacing: -.005em; cursor: pointer; transition: background var(--kp-t), border-color var(--kp-t), color var(--kp-t); white-space: nowrap; }
.kp-btn-primary { background: var(--kp-primary); color: var(--kp-on-primary) !important; }
.kp-btn-primary:hover { background: var(--kp-primary-hover); }
.kp-btn-primary:active { background: var(--kp-primary-active); }
.kp-btn-secondary { border-color: var(--kp-border-strong); background: var(--kp-surface); color: var(--kp-text) !important; }
.kp-btn-secondary:hover { border-color: var(--kp-primary-border); background: var(--kp-surface-raised); }
.kp-btn-sm { min-height: 38px; padding: 0 16px; font-size: 14px; }
.kp-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.kp-inline-cta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 28px; color: var(--kp-secondary); font-size: 14px; }

/* ---------- типографика блоков ---------- */
.kp-eyebrow { color: var(--kp-primary); font: 500 12px/1.4 var(--kp-mono); text-transform: uppercase; letter-spacing: .12em; }
/* Крошки — те же, что в новостях: полоса под шапкой, моно, путь как в адресной строке. */
.kp-crumbs { padding: 16px 0; border-bottom: 1px solid var(--kp-border); font: 12px/1.4 var(--kp-mono); color: var(--kp-secondary); }
.kp-crumbs a { color: inherit; transition: color .15s; } .kp-crumbs a:hover { color: #fff; }
.kp-crumbs i { font-style: normal; margin: 0 8px; color: var(--kp-border-strong); }
.kp-crumbs span { color: var(--kp-body); }

/* ---------- первый экран ---------- */
.kp-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--kp-border); }
.kp-hero::before { content: ""; position: absolute; inset: -30% -10% auto 40%; height: 680px; background: radial-gradient(circle, rgba(20, 184, 166, .13), transparent 66%); pointer-events: none; }
.kp-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(340px, 5fr); gap: 56px; align-items: center; padding: 64px 0 72px; }
.kp-hero-grid > * { min-width: 0; }
.kp-hero-solo { grid-template-columns: minmax(0, 8fr) 4fr; }
/* Заголовок — не больше двух строк, размер как у аккуратных посадочных: 32–52px,
   подпись 20px с воздухом 24px между ними и 32px до кнопок. */
.kp-main .kp-h1 { margin: 0 0 24px; font-size: clamp(32px, 4vw, 52px); line-height: 1.15; letter-spacing: -.03em; }
.kp-main .kp-lead { max-width: 620px; margin: 0 0 32px; color: var(--kp-body); font-size: 20px; line-height: 1.5; }
.kp-hero-copy .kp-actions, .kp-hero-center .kp-actions { margin-top: 0; }
/* шаблон «большой заголовок»: всё по центру, без артефакта */
.kp-hero-center { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 84px 0 72px; }
.kp-hero-big::before { inset: -30% 20% auto 20%; }
.kp-main .kp-hero-big .kp-h1 { max-width: 920px; font-size: clamp(36px, 5.4vw, 64px); line-height: 1.1; }
.kp-main .kp-hero-big .kp-lead { max-width: 700px; }
.kp-hero-big .kp-actions { justify-content: center; }
.kp-hint { margin: 14px 0 0; color: var(--kp-muted); font-size: 13px; }

/* артефакт: консоль */
.kp-console { position: relative; border: 1px solid var(--kp-primary-border); border-radius: var(--kp-r-xl); background: linear-gradient(145deg, #13211F, #0D0F0F 72%); box-shadow: var(--kp-shadow-lg), 0 30px 100px rgba(20, 184, 166, .1); overflow: hidden; }
.kp-console-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; border-bottom: 1px solid rgba(255, 255, 255, .08); color: #B9CBC8; font: 12px var(--kp-mono); }
.kp-console-head > span:last-child { min-width: 0; overflow-wrap: anywhere; text-align: right; }
.kp-dots { display: flex; gap: 7px; flex: 0 0 auto; }
.kp-dots i { width: 8px; height: 8px; border-radius: 50%; background: #46504E; }
.kp-dots i:first-child { background: var(--kp-primary); }
.kp-console-body { padding: 22px 24px; }
.kp-console-line { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, .065); font: 13px/1.45 var(--kp-mono); }
.kp-console-line:last-child { border-bottom: 0; }
.kp-console-line span { color: #74817F; }
.kp-console-line strong { color: #EAFFFC; font-weight: 500; overflow-wrap: anywhere; }
.kp-status { display: inline-flex; align-items: center; gap: 7px; color: #65D8CB; }
.kp-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--kp-primary); box-shadow: 0 0 12px var(--kp-primary); }
.kp-console-code .kp-code-panel pre { padding: 22px 24px; }

/* артефакт: картинка */
.kp-hero-image { margin: 0; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-xl); overflow: hidden; background: var(--kp-surface); box-shadow: var(--kp-shadow-lg); }
.kp-hero-image img { display: block; width: 100%; height: auto; }
.kp-hero-image figcaption { padding: 12px 16px; border-top: 1px solid var(--kp-border); color: var(--kp-muted); font-size: 12px; }

/* артефакт: чат */
.kp-chat { border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-xl); background: var(--kp-surface); box-shadow: var(--kp-shadow-lg); overflow: hidden; }
.kp-chat-body { display: flex; flex-direction: column; gap: 12px; padding: 22px; }
.kp-chat-msg { max-width: 88%; padding: 12px 16px; border-radius: var(--kp-r-lg); font-size: 14px; line-height: 1.55; }
.kp-chat-user { align-self: flex-end; background: var(--kp-surface-raised); color: var(--kp-text); border-bottom-right-radius: 4px; }
.kp-chat-bot { align-self: flex-start; background: var(--kp-primary-soft); border: 1px solid var(--kp-primary-border); color: var(--kp-body); border-bottom-left-radius: 4px; }
.kp-chat-foot { display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-top: 1px solid var(--kp-border); font: 12px var(--kp-mono); color: var(--kp-secondary); }

/* ---------- плашка доверия ---------- */
.kp-trust { padding: 36px 0 0; }

/* ---------- секции ---------- */
.kp-section { padding: 88px 0; border-bottom: 1px solid var(--kp-border); }
.kp-section-soft { background: linear-gradient(180deg, rgba(20, 184, 166, .03), transparent 60%); }
.kp-section-head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; margin-bottom: 40px; align-items: end; }
.kp-section-head h2, .kp-answer h2 { margin-top: 10px; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.08; }
.kp-section-head p { color: var(--kp-secondary); font-size: 17px; line-height: 1.65; max-width: 640px; }

/* короткий ответ */
.kp-answer { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.kp-answer-copy { border-left: 2px solid var(--kp-primary); padding-left: 26px; color: var(--kp-body); font-size: 17px; line-height: 1.72; max-width: 680px; }
.kp-answer-copy p + p { margin-top: 14px; }
.kp-source { margin-top: 14px; color: var(--kp-muted); font-size: 12.5px; line-height: 1.5; }

/* сетки */
.kp-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.kp-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }

/* карточки */
.kp-card { min-height: 200px; padding: 26px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-lg); background: linear-gradient(145deg, var(--kp-surface-raised), var(--kp-surface)); }
.kp-card-num { color: var(--kp-primary); font: 12px var(--kp-mono); }
.kp-card h3 { margin: 28px 0 10px; font-size: 19px; }
.kp-card p { color: var(--kp-secondary); font-size: 14.5px; line-height: 1.6; }

/* сценарии */
.kp-scenario { display: flex; flex-direction: column; padding: 26px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-lg); background: var(--kp-surface); transition: border-color var(--kp-t), transform var(--kp-t); }
.kp-scenario:hover { border-color: var(--kp-primary-border); transform: translateY(-2px); }
.kp-scenario-role { display: inline-flex; align-self: flex-start; padding: 5px 10px; border-radius: 999px; background: var(--kp-primary-soft); color: #7EE0D5; font: 500 11px var(--kp-mono); text-transform: uppercase; letter-spacing: .08em; }
.kp-scenario h3 { margin: 18px 0 10px; font-size: 19px; }
.kp-scenario p { color: var(--kp-secondary); font-size: 14.5px; line-height: 1.6; flex: 1; }
.kp-scenario-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 18px; color: var(--kp-primary); font-size: 14px; font-weight: 600; }
.kp-scenario-link svg { width: 16px; height: 16px; }
.kp-chip { display: inline-flex; align-self: flex-start; margin-top: 16px; padding: 5px 9px; border: 1px solid var(--kp-primary-border); border-radius: 6px; background: var(--kp-primary-soft); color: #7EE0D5; font: 11px var(--kp-mono); }

/* код */
.kp-code-wrap { border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-lg); background: var(--kp-bg-elevated); overflow: hidden; }
.kp-code-tabs { display: flex; align-items: center; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--kp-border); background: var(--kp-surface); }
.kp-code-tabs button { border: 0; border-radius: 6px; padding: 8px 12px; background: transparent; color: var(--kp-secondary); font-size: 13px; cursor: pointer; transition: background var(--kp-t), color var(--kp-t); }
.kp-code-tabs button:hover { color: var(--kp-text); }
.kp-code-tabs button.active { background: var(--kp-primary-soft); color: #7EE0D5; }
.kp-code-panel { display: none; position: relative; }
.kp-code-panel.active { display: block; }
.kp-code-panel pre, .kp-code-inline pre { margin: 0; padding: 24px; overflow: auto; color: #DCE7E5; font-size: 13.5px; line-height: 1.75; tab-size: 2; }
.kp-copy { position: absolute; top: 12px; right: 12px; border: 1px solid var(--kp-border-strong); border-radius: 6px; padding: 6px 10px; background: var(--kp-surface-raised); color: var(--kp-secondary); font-size: 11px; cursor: pointer; transition: color var(--kp-t), border-color var(--kp-t); }
.kp-copy:hover { color: var(--kp-text); border-color: var(--kp-muted); }
.kp-copy.done { color: var(--kp-primary); border-color: var(--kp-primary-border); }
.kp-step, .kp-step-body { min-width: 0; }
.kp-code-inline { position: relative; min-width: 0; margin-top: 14px; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-md); background: var(--kp-bg-elevated); }
.kp-code-inline pre { padding: 14px 16px; font-size: 12.5px; }
.kp-connect-with-aside { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 24px; align-items: start; }
.kp-connect-aside { display: grid; gap: 14px; }
.kp-connect-fact { padding: 18px 20px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); background: var(--kp-surface); }
.kp-connect-fact b { display: block; color: var(--kp-text); font-size: 15px; margin-bottom: 4px; }
.kp-connect-fact p { color: var(--kp-secondary); font-size: 14px; line-height: 1.55; }

/* шаги */
.kp-step { display: flex; flex-direction: column; padding-top: 22px; border-top: 1px solid var(--kp-border-strong); }
.kp-step > b { color: var(--kp-primary); font: 12px var(--kp-mono); }
.kp-step h3 { margin: 16px 0 8px; font-size: 18px; }
.kp-step p { color: var(--kp-secondary); font-size: 14.5px; line-height: 1.6; }
.kp-step .kp-btn { align-self: flex-start; margin-top: 16px; }
.kp-step-figure { margin: 16px 0 0; border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); overflow: hidden; background: var(--kp-surface); }
.kp-step-figure img { display: block; width: 100%; height: auto; }
.kp-step-body { display: flex; flex-direction: column; }
.kp-step-body .kp-btn { align-self: flex-start; margin-top: 16px; }
/* шаги-таймлайн: рельса слева, текст и картинка в ряд, каждый шаг проявляется при прокрутке */
.kp-timeline { display: flex; flex-direction: column; }
.kp-timeline .kp-step { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: center; padding: 36px 0 36px 60px; border-top: 0; }
.kp-timeline .kp-step::before { content: ""; position: absolute; left: 15px; top: 0; bottom: 0; width: 2px; background: var(--kp-border-strong); }
.kp-timeline .kp-step::after { content: ""; position: absolute; left: 15px; top: 0; width: 2px; height: 0; background: var(--kp-primary); transition: height .9s ease .15s; }
.kp-timeline .kp-step.is-in::after { height: 100%; }
.kp-timeline .kp-step:first-child::before, .kp-timeline .kp-step:first-child::after { top: 36px; }
.kp-timeline .kp-step:last-child::before { bottom: auto; height: 60px; }
.kp-timeline .kp-step:last-child.is-in::after { height: 60px; }
.kp-timeline .kp-step > b { position: absolute; left: 0; top: 36px; z-index: 1; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--kp-border-strong); background: var(--kp-surface); color: var(--kp-muted); font: 600 11px var(--kp-mono); transition: border-color .4s, color .4s, box-shadow .4s; }
.kp-timeline .kp-step.is-in > b { border-color: var(--kp-primary); color: var(--kp-primary); box-shadow: 0 0 0 6px rgba(20, 184, 166, .14); }
.kp-timeline .kp-step h3 { margin-top: 0; font-size: 22px; }
.kp-timeline .kp-step p { font-size: 15.5px; }
.kp-timeline .kp-step-figure { margin: 0; }
/* проявление шагов (только с JS и без reduce-motion; без JS всё видно сразу) */
.kp-js .kp-step { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.kp-js .kp-step:nth-child(2) { transition-delay: .1s; } .kp-js .kp-step:nth-child(3) { transition-delay: .2s; } .kp-js .kp-step:nth-child(4) { transition-delay: .3s; }
.kp-js .kp-timeline .kp-step { transition-delay: 0s; }
.kp-js .kp-step.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .kp-js .kp-step { opacity: 1; transform: none; transition: none; } .kp-timeline .kp-step::after { transition: none; } }
/* плашка доверия с тремя своими карточками */
.kp-trust .sl-trust-card--3 { grid-template-columns: repeat(3, 1fr); }

/* модели */
.kp-model { display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-lg); background: var(--kp-surface); color: inherit !important; transition: transform var(--kp-t), border-color var(--kp-t), box-shadow var(--kp-t); }
.kp-model:hover { transform: translateY(-2px); border-color: var(--kp-primary-border); box-shadow: var(--kp-shadow-md); }
.kp-model-top { display: flex; justify-content: space-between; gap: 12px; font: 11px var(--kp-mono); color: var(--kp-muted); text-transform: uppercase; letter-spacing: .08em; }
.kp-model h3 { margin: 16px 0 8px; font-size: 18px; }
.kp-model p { color: var(--kp-secondary); font-size: 13.5px; line-height: 1.55; flex: 1; }
.kp-model-price { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--kp-border); color: var(--kp-muted); font-size: 12.5px; }
.kp-model-price span { color: var(--kp-text); font-weight: 600; font-variant-numeric: tabular-nums; }

/* сравнение */
.kp-compare { overflow-x: auto; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-lg); }
.kp-compare table { width: 100%; min-width: 680px; border-collapse: collapse; }
.kp-compare th, .kp-compare td { padding: 18px 22px; text-align: left; border-bottom: 1px solid var(--kp-border); font-size: 14.5px; vertical-align: top; }
.kp-compare thead th { color: var(--kp-secondary); font-weight: 500; background: var(--kp-surface); font-size: 13px; }
.kp-compare thead th.kp-us { color: var(--kp-text); font-weight: 700; }
.kp-compare tbody th { color: var(--kp-secondary); font-weight: 500; width: 28%; }
.kp-compare td.kp-us { background: rgba(20, 184, 166, .05); color: var(--kp-text); }
.kp-compare tr:last-child th, .kp-compare tr:last-child td { border-bottom: 0; }
.kp-table table { min-width: 880px; }
.kp-table th, .kp-table td { text-align: left; font-size: 13.5px; padding: 14px 16px; }
.kp-table tbody th { width: auto; white-space: nowrap; color: var(--kp-text); font-weight: 600; }
.kp-table .kp-us-row td, .kp-table .kp-us-row th { background: rgba(20, 184, 166, .06); }
.kp-yes, .kp-no, .kp-part { display: inline-flex; align-items: center; gap: 8px; }
.kp-yes svg, .kp-no svg, .kp-part svg { width: 18px; height: 18px; flex: 0 0 auto; }
.kp-yes { color: #70D8CD; } .kp-no { color: var(--kp-muted); } .kp-part { color: var(--kp-warn); }
.kp-yes i, .kp-no i, .kp-part i { font-style: normal; }

/* калькулятор */
.kp-calc { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 24px; }
.kp-calc-form { padding: 28px; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-xl); background: var(--kp-surface); display: grid; gap: 16px; }
.kp-calc-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.kp-calc-presets button { border: 1px solid var(--kp-border-strong); border-radius: 999px; padding: 8px 14px; background: transparent; color: var(--kp-secondary); font-size: 13px; cursor: pointer; transition: all var(--kp-t); }
.kp-calc-presets button:hover { color: var(--kp-text); border-color: var(--kp-muted); }
.kp-calc-presets button.active { background: var(--kp-primary-soft); border-color: var(--kp-primary-border); color: #7EE0D5; }
.kp-calc-form label { display: grid; gap: 6px; font-size: 13px; color: var(--kp-secondary); }
.kp-calc-form input, .kp-calc-form select { width: 100%; min-height: 46px; padding: 0 14px; border: 1px solid var(--kp-field-border); border-radius: var(--kp-r-md); background: var(--kp-field); color: var(--kp-text); font: 15px var(--kp-sans); font-variant-numeric: tabular-nums; transition: border-color var(--kp-t), box-shadow var(--kp-t); }
.kp-calc-form input[type=number] { -moz-appearance: textfield; appearance: textfield; }
.kp-calc-form input[type=number]::-webkit-inner-spin-button, .kp-calc-form input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.kp-calc-form input:focus, .kp-calc-form select:focus { outline: none; border-color: var(--kp-primary); box-shadow: 0 0 0 3px var(--kp-primary-soft); }
.kp-calc-hint { color: var(--kp-muted); font-size: 12.5px; line-height: 1.5; }
.kp-calc-result { display: flex; flex-direction: column; gap: 10px; padding: 28px; border: 1px solid var(--kp-primary-border); border-radius: var(--kp-r-xl); background: linear-gradient(145deg, rgba(20, 184, 166, .12), rgba(20, 184, 166, .02)); box-shadow: var(--kp-glow); }
.kp-calc-main { display: grid; gap: 4px; padding-bottom: 16px; border-bottom: 1px solid var(--kp-primary-border); }
.kp-calc-main span { color: var(--kp-secondary); font-size: 13px; }
.kp-calc-main strong { color: var(--kp-text); font-size: clamp(34px, 4vw, 48px); font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1.05; }
.kp-calc-row { display: flex; justify-content: space-between; gap: 16px; font-size: 14px; color: var(--kp-secondary); }
.kp-calc-row b { color: var(--kp-text); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.kp-calc-result .kp-btn { margin-top: auto; }

/* для юрлиц */
.kp-business { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 48px; align-items: center; padding: 40px; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-2xl); background: var(--kp-surface); }
.kp-business h2 { margin-top: 10px; font-size: clamp(26px, 3vw, 36px); line-height: 1.1; }
.kp-business p { margin-top: 14px; color: var(--kp-secondary); font-size: 16px; line-height: 1.65; }
.kp-doc-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.kp-doc-list li { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); background: var(--kp-bg-elevated); color: var(--kp-text); font-weight: 600; font-size: 15px; }
.kp-doc-list svg { width: 18px; height: 18px; color: var(--kp-primary); flex: 0 0 auto; }

/* два пути */
.kp-ways { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.kp-way { display: flex; flex-direction: column; padding: 32px; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-xl); background: var(--kp-surface); }
.kp-way-primary { border-color: var(--kp-primary-border); background: linear-gradient(145deg, rgba(20, 184, 166, .09), var(--kp-surface) 60%); }
.kp-way h3 { margin: 12px 0 10px; font-size: 24px; letter-spacing: -.02em; }
.kp-way p { color: var(--kp-secondary); font-size: 15px; line-height: 1.6; }
.kp-way ul { list-style: none; margin: 20px 0 26px; padding: 0; display: grid; gap: 10px; flex: 1; }
.kp-way li { display: flex; gap: 10px; font-size: 14.5px; color: var(--kp-body); }
.kp-way li svg { width: 18px; height: 18px; color: var(--kp-primary); flex: 0 0 auto; margin-top: 2px; }
.kp-way .kp-btn { align-self: flex-start; }

/* пакеты с ценой — та же карточка, что у «двух путей», плюс цена и ярлык */
.kp-ways-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kp-ways-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kp-plan { position: relative; }
.kp-plan h3 { margin-top: 0; }
.kp-plan-price { font-size: clamp(26px, 2.6vw, 32px); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kp-plan-note { margin-top: 6px; color: var(--kp-muted); font-size: 13px; }
.kp-plan-badge { position: absolute; top: -11px; left: 28px; padding: 3px 12px; border: 1px solid var(--kp-primary-border); border-radius: 999px; background: var(--kp-bg); color: #7EE0D5; font-size: 12px; font-weight: 600; white-space: nowrap; }

/* форма заявки */
.kp-leadform { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.kp-leadform-copy h2 { margin-top: 10px; font-size: clamp(26px, 3vw, 36px); line-height: 1.1; }
.kp-leadform-copy p { margin-top: 14px; color: var(--kp-secondary); font-size: 16px; line-height: 1.65; }
.kp-leadform-copy .kp-doc-list { margin-top: 24px; }
.kp-leadform-fields { padding: 32px; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-xl); background: var(--kp-surface); }
.kp-leadform-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.kp-field { display: grid; gap: 6px; font-size: 13px; color: var(--kp-secondary); }
.kp-field-wide { grid-column: 1 / -1; }
.kp-field input, .kp-field textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--kp-field-border); border-radius: var(--kp-r-md); background: var(--kp-field); color: var(--kp-text); font: 15px var(--kp-sans); transition: border-color var(--kp-t), box-shadow var(--kp-t); }
.kp-field input { min-height: 46px; padding: 0 14px; }
.kp-field textarea { resize: vertical; min-height: 88px; line-height: 1.5; }
.kp-field input::placeholder, .kp-field textarea::placeholder { color: var(--kp-muted); }
.kp-field input:focus, .kp-field textarea:focus { outline: none; border-color: var(--kp-primary); box-shadow: 0 0 0 3px var(--kp-primary-soft); }
.kp-field input[aria-invalid="true"] { border-color: #F87171; }
.kp-field-error { margin: 0; color: #F87171; font-size: 12px; }
.kp-leadform-fields .kp-btn { margin-top: 20px; width: 100%; justify-content: center; border: 0; cursor: pointer; font: 600 15px var(--kp-sans); }
.kp-leadform-note { margin: 14px 0 0; color: var(--kp-muted); font-size: 12.5px; line-height: 1.55; }
.kp-leadform-note a { color: var(--kp-secondary); text-decoration: underline; text-underline-offset: 2px; }
/* Капчу вставляет /captcha.js перед кнопкой отправки — в нашей вёрстке ей
   нужен только отступ, свои классы там от старой разметки на Tailwind. */
.kp-leadform-fields .smart-captcha-wrap { margin-top: 20px; font-size: 14px; color: var(--kp-body); }

/* ОС */
.kp-os { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.kp-os-card { padding: 22px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-lg); background: var(--kp-surface); }
.kp-os-card svg { width: 26px; height: 26px; color: var(--kp-primary); }
.kp-os-card b { display: block; margin: 14px 0 6px; color: var(--kp-text); font-size: 16px; }
.kp-os-card p { color: var(--kp-secondary); font-size: 14px; line-height: 1.55; }

/* цифры */
.kp-proof { border-bottom: 1px solid var(--kp-border); background: var(--kp-bg-elevated); }
.kp-proof-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; padding: 32px 0; }
.kp-proof-row strong { display: block; color: var(--kp-text); font-size: 30px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.kp-proof-row span { color: var(--kp-secondary); font-size: 13.5px; }

/* галерея */
.kp-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.kp-gallery-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kp-gallery figure { margin: 0; border: 1px solid var(--kp-border-strong); border-radius: var(--kp-r-lg); overflow: hidden; background: var(--kp-surface); }
/* Кадр 4:3: три вертикальных скриншота иначе растягивают блок на два экрана. Показываем верх, полный размер — по клику. */
.kp-gallery .kp-shot-frame { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--kp-raised); }
.kp-shot-bottom img { object-position: bottom center; }
.kp-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.kp-shot-contain img { object-fit: contain; padding: 12px; box-sizing: border-box; }
.kp-gallery figcaption { padding: 14px 16px; border-top: 1px solid var(--kp-border); color: var(--kp-secondary); font-size: 13.5px; line-height: 1.5; }

/* проза и вердикт */
.kp-prose { max-width: 760px; color: var(--kp-body); font-size: 16.5px; line-height: 1.72; }
.kp-prose p + p, .kp-prose ul + p, .kp-prose p + ul { margin-top: 14px; }
.kp-prose ul { margin: 0; padding-left: 22px; }
.kp-prose li { margin-bottom: 8px; }
.kp-prose li::marker { color: var(--kp-primary); }
.kp-verdict { display: grid; gap: 12px; }
.kp-verdict-row { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 24px; padding: 20px 24px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); background: var(--kp-surface); }
.kp-verdict-row b { color: var(--kp-text); font-size: 15px; }
.kp-verdict-row p { color: var(--kp-secondary); font-size: 14.5px; line-height: 1.6; }

/* FAQ */
.kp-faq { display: grid; gap: 10px; max-width: 900px; }
.kp-faq details { border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); background: var(--kp-surface); padding: 0 22px; }
.kp-faq details[open] { border-color: var(--kp-border-strong); }
.kp-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0; cursor: pointer; color: var(--kp-text); font-weight: 600; font-size: 15.5px; list-style: none; }
.kp-faq summary::-webkit-details-marker { display: none; }
.kp-faq summary::after { content: "+"; color: var(--kp-primary); font-size: 22px; font-weight: 300; line-height: 1; }
.kp-faq details[open] summary::after { content: "−"; }
.kp-faq details p { padding: 0 40px 20px 0; color: var(--kp-secondary); font-size: 14.5px; line-height: 1.65; }

/* дальше */
.kp-related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.kp-related a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-md); color: var(--kp-body); font-size: 14.5px; font-weight: 600; transition: border-color var(--kp-t), color var(--kp-t); }
.kp-related a:hover { border-color: var(--kp-primary-border); color: var(--kp-text); }
.kp-dir { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.kp-dir-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kp-dir-card { display: flex; flex-direction: column; gap: 8px; padding: 24px; border: 1px solid var(--kp-border); border-radius: var(--kp-r-lg); background: linear-gradient(145deg, var(--kp-surface-raised), var(--kp-surface)); color: var(--kp-body); transition: border-color var(--kp-t), transform var(--kp-t); }
.kp-dir-card:hover { border-color: var(--kp-primary-border); transform: translateY(-2px); }
.kp-dir-sub { color: var(--kp-primary); font: 12px var(--kp-mono); letter-spacing: .02em; }
.kp-dir-card h3 { margin: 0; font-size: 18px; color: var(--kp-text); }
.kp-dir-card p { margin: 0; color: var(--kp-secondary); font-size: 14.5px; line-height: 1.6; }
.kp-dir-count { margin-top: auto; padding-top: 10px; color: var(--kp-secondary); font: 12.5px var(--kp-mono); }
.kp-related svg { width: 18px; height: 18px; color: var(--kp-primary); flex: 0 0 auto; }

/* финал */
.kp-cta { padding: 80px 0; }
.kp-cta-box { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 44px; border: 1px solid var(--kp-primary-border); border-radius: var(--kp-r-2xl); background: linear-gradient(135deg, rgba(20, 184, 166, .14), rgba(20, 184, 166, .02)); }
.kp-cta h2 { font-size: clamp(26px, 3vw, 36px); line-height: 1.1; }
.kp-cta p { margin-top: 10px; color: var(--kp-secondary); font-size: 16px; line-height: 1.55; max-width: 560px; }
.kp-cta .kp-actions { margin: 0; flex: 0 0 auto; }

/* липкая кнопка на мобильных */
.kp-sticky { display: none; }
@media (max-width: 760px) {
  .kp-sticky { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60; display: flex; align-items: center; justify-content: center; min-height: 52px; border-radius: var(--kp-r-md); background: var(--kp-primary); color: var(--kp-on-primary) !important; font-weight: 700; box-shadow: var(--kp-shadow-lg); transform: translateY(120%); opacity: 0; transition: transform .25s ease, opacity .25s ease; }
  .kp-sticky.show { transform: none; opacity: 1; }
}

/* ---------- адаптив ---------- */
@media (max-width: 1000px) {
  .kp-hero-grid, .kp-hero-solo { grid-template-columns: 1fr; gap: 36px; padding: 48px 0 56px; }
  .kp-console, .kp-chat, .kp-hero-image { max-width: 640px; }
  .kp-section-head, .kp-answer { grid-template-columns: 1fr; gap: 20px; }
  .kp-grid-3, .kp-grid-4, .kp-gallery, .kp-dir, .kp-ways-3, .kp-ways-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kp-leadform { grid-template-columns: 1fr; gap: 28px; }
  .kp-connect-with-aside, .kp-calc, .kp-business { grid-template-columns: 1fr; }
  .kp-business { padding: 28px; gap: 28px; }
}
@media (max-width: 650px) {
  .kp-container { width: min(100% - 32px, 1280px); }
  .kp-section { padding: 60px 0; }
  .kp-main .kp-h1 { font-size: 32px; }
  .kp-timeline .kp-step { grid-template-columns: 1fr; gap: 20px; padding: 28px 0 28px 48px; }
  .kp-timeline .kp-step > b, .kp-timeline .kp-step:first-child::before, .kp-timeline .kp-step:first-child::after { top: 28px; }
  .kp-main .kp-lead { font-size: 17px; }
  .kp-actions { display: grid; grid-template-columns: 1fr; }
  .kp-actions .kp-btn { width: 100%; }
  .kp-grid-3, .kp-grid-4, .kp-gallery, .kp-gallery-2, .kp-ways, .kp-ways-3, .kp-ways-4, .kp-related, .kp-dir, .kp-dir-2 { grid-template-columns: minmax(0, 1fr); }
  .kp-leadform-grid { grid-template-columns: minmax(0, 1fr); }
  .kp-leadform-fields { padding: 22px; }
  .kp-verdict-row { grid-template-columns: 1fr; gap: 8px; }
  .kp-cta-box { display: block; padding: 28px; }
  .kp-cta .kp-actions { margin-top: 22px; }
  .kp-console-body { padding: 16px; }
  .kp-console-line { grid-template-columns: 70px minmax(0, 1fr); }
  .kp-faq details p { padding-right: 0; }
  .kp-code-panel pre { padding: 18px; font-size: 12.5px; }
  .kp-calc-form, .kp-calc-result { padding: 20px; }
  .kp-cta { padding-bottom: 110px; } /* место под липкую кнопку */
}
