/* ============================================================
   КПшка.ру — Главная 2026 (редизайн)
   Чистая 3-колоночная сетка, спокойные карточки, единые бейджи.
   ============================================================ */

/* ---------- Tokens ---------- */
:root{
  --c-bg:           #eef3fb;          /* фон страницы */
  --c-panel:        #ffffff;          /* белые панели */
  --c-border:       #e4ebf5;          /* лёгкие линии */
  --c-border-2:     #d9e3f0;
  --c-ink:          #0f1e35;          /* основной текст */
  --c-ink-2:        #3a4a63;          /* вторичный */
  --c-ink-3:        #6b7c93;          /* третичный, мета */
  --c-ink-4:        #94a3b8;          /* очень светлый */

  --c-brand:        #2563eb;          /* основной бренд */
  --c-brand-2:      #1d4ed8;
  --c-brand-3:      #1e40af;
  --c-nav:          #0f2942;          /* шапка */
  --c-nav-2:        #1d3a5f;

  --c-accent:       #f97316;          /* акцент-оранж (CTA, hot) */
  --c-accent-2:     #ea580c;
  --c-success:      #16a34a;
  --c-warning:      #d97706;
  --c-danger:       #dc2626;
  --c-purple:       #7c3aed;
  --c-pink:         #db2777;
  --c-teal:         #0d9488;

  /* Бейджи типов публикаций — насыщенные с белым текстом */
  --b-co-bg:#16a34a;    --b-co-fg:#ffffff;     /* Компания — зелёный */
  --b-of-bg:#f97316;    --b-of-fg:#ffffff;     /* Оферта — оранжевый */
  --b-pr-bg:#2563eb;    --b-pr-fg:#ffffff;     /* Процедура — синий */
  --b-tn-bg:#1e40af;    --b-tn-fg:#ffffff;     /* Тендер — тёмно-синий */
  --b-vc-bg:#7c3aed;    --b-vc-fg:#ffffff;     /* Вакансия — фиолетовый */
  --b-rl-bg:#db2777;    --b-rl-fg:#ffffff;     /* Пресс-релиз — розовый */
  --b-vd-bg:#0e7490;    --b-vd-fg:#ffffff;     /* Видео — бирюзовый */
  --b-nw-bg:#d97706;    --b-nw-fg:#ffffff;     /* Новость — янтарный */

  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius:   12px;
  --radius-lg:16px;
  --radius-xl:20px;

  --shadow-1: 0 1px 2px rgba(15,30,53,.04), 0 1px 3px rgba(15,30,53,.04);
  --shadow-2: 0 2px 6px rgba(15,30,53,.06), 0 4px 12px rgba(15,30,53,.05);
  --shadow-3: 0 8px 28px rgba(15,30,53,.10);

  --container-max: 1680px;
  --col-l: 248px;
  --col-r: 268px;
  --gap:   20px;

  --font: 'Inter', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
}

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ overflow-x: hidden; }
body{
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  color: var(--c-ink);
  background: var(--c-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  max-width: 100vw;
}
img, svg, video, canvas{ max-width: 100%; }
a{ color: var(--c-brand); text-decoration:none; }
a:hover{ color: var(--c-brand-2); }
img{ max-width:100%; display:block; }
button{ font-family: inherit; cursor:pointer; }

.k-container{
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 24px;
}

/* ============================================================
   1. ШАПКА
   ============================================================ */
.k-header{
  background: var(--c-panel);
  border-bottom: 1px solid var(--c-border);
  position: sticky;
  top: 0;
  z-index: 100;
}
.k-header-inner{
  display:flex;
  align-items:center;
  gap: 32px;
  height: 64px;
}
.k-logo{
  display:flex;
  align-items:center;
  gap: 10px;
  text-decoration:none;
  flex-shrink: 0;
}
.k-logo-mark{
  width: 38px; height: 38px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--c-brand) 0%, var(--c-brand-3) 100%);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: -0.02em;
  box-shadow: 0 4px 12px rgba(37,99,235,.25);
}
.k-logo-text{ display:flex; flex-direction:column; line-height:1.1; }
.k-logo-name{
  font-weight: 800;
  font-size: 17px;
  color: var(--c-ink);
  letter-spacing: -0.02em;
}
.k-logo-tagline{
  font-size: 11px;
  color: var(--c-ink-3);
  margin-top: 2px;
}
.k-nav{
  display:flex;
  align-items:center;
  gap: 14px;
  flex:1;
}
.k-nav a{
  color: var(--c-ink-2);
  font-size: 14px;
  font-weight: 500;
  padding: 6px 2px;
  position: relative;
  white-space: nowrap;
  transition: color .15s;
}
.k-nav a:hover{ color: var(--c-brand); }
.k-nav a.active{ color: var(--c-brand); }
.k-nav a.active::after{
  content:''; position:absolute; left:0; right:0; bottom:-22px;
  height:2px; background: var(--c-brand); border-radius: 2px 2px 0 0;
}
.k-header-right{ display:flex; align-items:center; gap: 8px; flex-shrink: 0; }
.k-header-right > *{ flex-shrink: 0; } /* ничего не сжимаем — кнопки всегда видны целиком */
/* Компактные кнопки в шапке (Кабинет / Выйти / Войти / Регистрация) */
.k-header-right .k-btn{ padding: 8px 12px; font-size: 13px; }
.k-header-right .k-btn i{ font-size: 13px; }
.k-mail-link, .k-phone-link, .k-help-link{
  display:inline-flex;
  align-items:center;
  gap: 7px;
  padding: 8px 12px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  color: var(--c-ink-2);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  transition: all .15s;
}
.k-mail-link i, .k-phone-link i, .k-help-link i{ color: var(--c-ink-3); font-size: 13px; }
.k-mail-link:hover, .k-phone-link:hover, .k-help-link:hover{
  background:#fff;
  border-color: var(--c-brand);
  color: var(--c-brand);
}
.k-mail-link:hover i, .k-phone-link:hover i, .k-help-link:hover i{ color: var(--c-brand); }
.k-help-link{ background: linear-gradient(135deg, rgba(2,132,199,.06) 0%, rgba(124,58,237,.05) 100%); }
.k-phone-link{ background: linear-gradient(135deg, rgba(34,197,94,.07) 0%, rgba(34,197,94,.02) 100%); }
.k-phone-link i{ color: #16a34a; }

/* ── Колокольчик сообщений в шапке ── */
.k-bell-wrap{ position: relative; }
.k-bell{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  color: var(--c-ink-2);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
  transition: all .15s;
  position: relative;
  font-size: 15px;
  padding: 0;
}
.k-bell:hover{
  background:#fff;
  border-color: var(--c-brand);
  color: var(--c-brand);
}
.k-bell-badge{
  position:absolute;
  top:-5px;
  right:-5px;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  background: #e11d48;
  color:#fff;
  font-size: 10px;
  font-weight: 700;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 0 5px;
  border: 2px solid #fff;
  line-height: 1;
  box-shadow: 0 1px 3px rgba(225, 29, 72, .35);
}
.k-bell-dd{
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 380px;
  max-height: 460px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, .15), 0 4px 10px rgba(15, 23, 42, .06);
  display: none;
  overflow: hidden;
  z-index: 9999;
  animation: kBellIn .18s cubic-bezier(.2,.7,.3,1);
}
@keyframes kBellIn { from { opacity:0; transform: translateY(-6px); } to { opacity:1; transform: translateY(0); } }
.k-bell-dd.open{ display: block; }
.k-bell-dd-hd{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
  font-size: 13px;
  background: linear-gradient(90deg, rgba(2,132,199,.04) 0%, rgba(124,58,237,.03) 100%);
}
.k-bell-dd-hd strong{ color: var(--c-ink); display:flex; align-items:center; gap: 7px; font-weight: 700; }
.k-bell-dd-hd strong i{ color: var(--c-brand); }
.k-bell-dd-hd a{ color: var(--c-brand); text-decoration: none; font-weight: 600; font-size: 12px; }
.k-bell-dd-hd a:hover{ text-decoration: underline; }
.k-bell-dd-list{ max-height: 380px; overflow-y: auto; }
.k-bell-dd-item{
  display:flex;
  gap: 11px;
  padding: 12px 16px;
  border-bottom: 1px solid #f1f5f9;
  transition: background .12s;
  cursor: pointer;
}
.k-bell-dd-item:hover{ background: #f8fafc; }
.k-bell-dd-item:last-child{ border-bottom: none; }
.k-bell-dd-av{
  width: 38px;
  height: 38px;
  border-radius: 9px;
  background: #e0f2fe;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  font-weight: 700;
  color: var(--c-brand);
  flex-shrink: 0;
  overflow: hidden;
}
.k-bell-dd-av img{ width:100%; height:100%; object-fit: cover; }
.k-bell-dd-body{ flex: 1; min-width: 0; }
.k-bell-dd-name{ font-size: 13px; font-weight: 600; color: var(--c-ink); margin-bottom: 2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.k-bell-dd-text{
  font-size: 12px;
  color: var(--c-ink-2);
  line-height: 1.4;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.k-bell-dd-meta{
  font-size: 11px;
  color: var(--c-ink-3);
  margin-top: 4px;
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap: wrap;
}
.k-bell-dd-meta i{ font-size: 9px; }
.k-bell-dd-empty{
  padding: 36px 16px;
  text-align: center;
  color: var(--c-ink-3);
  font-size: 13px;
}
.k-bell-dd-empty::before{
  content: '\f0f3';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', FontAwesome;
  font-weight: 900;
  display: block;
  font-size: 28px;
  margin-bottom: 10px;
  opacity: .25;
}
@media (max-width: 768px){
  .k-bell-dd{ width: 320px; right: -50px; }
}
.k-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height: 38px;
  padding: 0 18px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
  text-decoration: none;
}
.k-btn--ghost{ background: transparent; color: var(--c-ink-2); border-color: var(--c-border-2); }
.k-btn--ghost:hover{ background: var(--c-bg); color: var(--c-ink); border-color: var(--c-ink-4); }
.k-btn--primary{ background: var(--c-brand); color: #fff; border-color: var(--c-brand); }
.k-btn--primary:hover{ background: var(--c-brand-2); border-color: var(--c-brand-2); color:#fff; }
.k-btn--accent{ background: var(--c-accent); color:#fff; border-color: var(--c-accent); }
.k-btn--accent:hover{ background: var(--c-accent-2); border-color: var(--c-accent-2); color:#fff; }
.k-btn--lg{ height: 44px; padding: 0 22px; font-size: 14px; }
.k-btn--sm{ height: 32px; padding: 0 14px; font-size: 12.5px; border-radius: 7px; }
.k-btn--block{ width: 100%; }

/* ============================================================
   2. ОСНОВНАЯ СЕТКА
   ============================================================ */
.k-main{
  padding: 24px 0 40px;
}
.k-grid{
  display: grid;
  grid-template-columns: var(--col-l) minmax(0, 1fr) var(--col-r);
  gap: var(--gap);
  align-items: start;
}
/* Все три колонки должны быть min-width:0 чтобы их содержимое не выпирало */
.k-col-l, .k-col-c, .k-col-r{ min-width: 0; }
.k-grid > *{ min-width: 0; }

/* Защита от выпирания длинных слов/URL */
.k-card, .k-card-title, .k-card-desc, .k-card-meta,
.k-snews-title, .k-org-name, .k-hot-title, .k-cbr-name,
.k-geo-lbl, .k-sal-lbl{
  word-break: break-word;
  overflow-wrap: anywhere;
}

.k-panel{
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 18px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-1);
}
.k-panel-title{
  display:flex;
  align-items:center;
  justify-content: space-between;
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 700;
  color: var(--c-ink);
}
.k-panel-title .k-panel-link{
  font-size: 12px;
  font-weight: 500;
  color: var(--c-brand);
}

/* ============================================================
   3. ЛЕВАЯ КОЛОНКА
   ============================================================ */

/* Личный кабинет */
.k-acc{
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 18px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-1);
}
.k-acc-hd{
  display:flex; align-items:center; gap: 10px;
  margin-bottom: 4px;
}
.k-acc-ic{
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--c-bg);
  color: var(--c-brand);
  display:flex; align-items:center; justify-content:center;
  font-size: 14px;
}
.k-acc-title{ font-size: 14px; font-weight: 700; color: var(--c-ink); }
.k-acc-sub{ font-size: 12px; color: var(--c-ink-3); margin-bottom: 14px; }
.k-acc .k-btn{ margin-bottom: 8px; }
.k-acc .k-btn:last-child{ margin-bottom: 0; }

/* ── Авторизованный «Личный кабинет» (новый дизайн) ── */
.k-acc--auth{
  padding: 0;
  overflow: hidden;
  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
  border: 1px solid var(--c-border);
  position: relative;
}
.k-acc-row{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 16px 14px;
}
.k-acc-av{
  width: 52px;
  height: 52px;
  border-radius: 10px;            /* квадратная со скруглением */
  background: linear-gradient(135deg, #0284c7 0%, #7c3aed 100%);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .5px;
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(2,132,199,.25);
  position: relative;
}
.k-acc-av.has-img{
  background: #fff;
  border: 1px solid var(--c-border);
  box-shadow: 0 2px 8px rgba(15,23,42,.06);
}
.k-acc-av img{ width:100%; height:100%; object-fit: contain; padding: 4px; }
.k-acc-av span{ position: relative; z-index: 1; }
.k-acc-info{ min-width: 0; flex: 1; }
.k-acc-name{
  font-size: 14px;
  font-weight: 700;
  color: var(--c-ink);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom: 4px;
}
.k-acc-role{
  font-size: 11px;
  color: var(--c-ink-3);
  display:inline-flex;
  align-items:center;
  gap: 5px;
  font-weight: 500;
}
.k-acc-dot{
  display:inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34,197,94,.6);
  animation: kAccPulse 2s infinite;
  flex-shrink: 0;
}
@keyframes kAccPulse{
  0%   { box-shadow: 0 0 0 0 rgba(34,197,94,.55); }
  70%  { box-shadow: 0 0 0 6px rgba(34,197,94,0);  }
  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0);    }
}
.k-acc-actions{
  padding: 0 16px 16px;
}
.k-acc-actions .k-btn{
  margin-bottom: 10px;
  font-size: 13px;
  padding: 10px 14px;
}
.k-acc-quick{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.k-acc-quick-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  height: 36px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--c-border);
  color: var(--c-ink-2);
  font-size: 13px;
  text-decoration: none;
  transition: all .15s;
}
.k-acc-quick-btn:hover{
  background: var(--c-bg);
  border-color: var(--c-brand);
  color: var(--c-brand);
  transform: translateY(-1px);
}
.k-acc-quick-btn--danger:hover{
  border-color: #e11d48;
  color: #e11d48;
  background: #fef2f2;
}

/* Регистрация */
.k-reg-box{
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 14px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-1);
  display:flex; align-items:center; gap: 10px;
  text-decoration: none;
  transition: all .15s;
}
.k-reg-box:hover{ border-color: var(--c-brand); transform: translateY(-1px); box-shadow: var(--shadow-2); }
.k-reg-ic{
  width: 32px; height: 32px;
  border-radius: 8px;
  background: #e0e7ff;
  color: var(--c-brand);
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
}
.k-reg-txt{
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-ink);
  line-height: 1.3;
}

/* Каталог */
.k-cat-list{ list-style:none; margin:0; padding:0; }
.k-cat-list li{
  margin: 0;
}
.k-cat-list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 9px 8px;
  margin: 0 -8px;
  border-radius: 7px;
  color: var(--c-ink-2);
  font-size: 13px;
  transition: all .15s;
}
.k-cat-list a:hover{ background: var(--c-bg); color: var(--c-ink); }
.k-cat-list a .k-cat-l{ display:flex; align-items:center; gap: 9px; }
.k-cat-list a .k-cat-ic{
  width: 18px; height: 18px;
  color: var(--c-ink-4);
  display:flex; align-items:center; justify-content:center;
  font-size: 13px;
}
.k-cat-list a:hover .k-cat-ic{ color: var(--c-brand); }
.k-cat-list a .k-cat-cnt{
  font-size: 12px;
  color: var(--c-ink-3);
  font-variant-numeric: tabular-nums;
}

/* Новости в сайдбаре */
.k-snews{ display:flex; flex-direction:column; gap: 12px; }
.k-snews-it{
  display:flex;
  gap: 10px;
  text-decoration:none;
  color: inherit;
  position: relative;          /* для absolute zoom-превью */
}
.k-snews-img{
  width: 44px; height: 44px;
  border-radius: 7px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  flex-shrink: 0;
  overflow: visible;           /* чтобы zoom мог выходить за пределы */
  display:flex; align-items:center; justify-content:center;
  color: var(--c-ink-4);
  position: relative;
}
.k-snews-img > img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius: 6px;
}
/* Zoom-превью 320×220 при наведении (выровнено по правому краю строки —
   sidebar у нас правый, поэтому превью раскрывается влево, чтобы не уходило за viewport) */
.k-snews-zoom{
  position: absolute;
  right: 0;
  top: 100%;
  transform: translateY(8px) scale(.9);
  transform-origin: top right;
  width: 320px;
  height: 220px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid var(--c-border);
  box-shadow: 0 16px 48px rgba(15,23,42,.22), 0 6px 16px rgba(15,23,42,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 56px;
  color: var(--c-ink-4);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 100;
  transition: opacity .2s ease, transform .2s cubic-bezier(.2,.7,.3,1), visibility 0s linear .2s;
  overflow: hidden;
}
.k-snews-zoom img{
  width: 100%;
  height: 100%;
  object-fit: contain;            /* картинка целиком, без обрезки */
}
.k-snews-zoom::after{
  /* «носик» вверх — указывает на аватарку (слева от текста) */
  content: '';
  position: absolute;
  top: -7px;
  left: 22px;
  transform: rotate(45deg);
  width: 12px;
  height: 12px;
  background: #f8fafc;
  border-left: 1px solid var(--c-border);
  border-top: 1px solid var(--c-border);
}
.k-snews-it:hover .k-snews-zoom{
  opacity: 1;
  visibility: visible;
  transform: translateY(12px) scale(1);
  transition: opacity .2s ease, transform .2s cubic-bezier(.2,.7,.3,1), visibility 0s;
}
/* Последние 2 новости — показывать превью сверху (чтобы не вылезало за низ панели) */
.k-snews-it:nth-last-child(-n+2) .k-snews-zoom{
  top: auto;
  bottom: 100%;
  transform-origin: bottom right;
  transform: translateY(-8px) scale(.9);
}
.k-snews-it:nth-last-child(-n+2) .k-snews-zoom::after{
  top: auto;
  bottom: -7px;
  border-left: none;
  border-top: none;
  border-right: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}
.k-snews-it:nth-last-child(-n+2):hover .k-snews-zoom{
  transform: translateY(-12px) scale(1);
}
.k-snews-body{ min-width: 0; flex: 1; }
.k-snews-title{
  font-size: 12px;
  color: var(--c-ink);
  line-height: 1.3;
  margin-bottom: 4px;
  /* Заголовок новости — не обрезаем, переносим целиком */
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.k-snews-it:hover .k-snews-title{ color: var(--c-brand); }
.k-snews-date{ font-size: 11px; color: var(--c-ink-4); }

/* Топ зарплат */
.k-sal-list{ list-style:none; margin:0; padding:0; }
.k-sal-list li{ display:flex; justify-content:space-between; padding: 8px 0; border-bottom: 1px dashed var(--c-border); font-size: 13px; }
.k-sal-list li:last-child{ border-bottom: 0; }
.k-sal-list .k-sal-lbl{ color: var(--c-ink-2); }
.k-sal-list .k-sal-cnt{ color: var(--c-ink-3); font-variant-numeric: tabular-nums; }
.k-sal-list a{ display: contents; }
.k-sal-list li:hover .k-sal-lbl{ color: var(--c-brand); }

/* География и Отрасли — общий список со ссылками */
.k-geo-list{ list-style:none; margin:0; padding:0; }
.k-geo-list li{ font-size: 13px; }
.k-geo-list a{
  display:flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  text-decoration: none;
  color: inherit;
  transition: color .15s;
}
.k-geo-list .k-geo-lbl{ color: var(--c-ink-2); }
.k-geo-list .k-geo-cnt{ color: var(--c-ink-3); font-variant-numeric: tabular-nums; }
.k-geo-list li:hover .k-geo-lbl,
.k-geo-list a:hover .k-geo-lbl{ color: var(--c-brand); }

/* География С прогресс-барами (k-geo-list--bars): двухуровневый layout */
.k-geo-list--bars li{ padding: 0; }
.k-geo-list--bars a{
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  padding: 8px 0;
}
.k-geo-list--bars .k-geo-row-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.k-geo-bar{
  display:block;
  height: 4px;
  background: rgba(2, 132, 199, .08);
  border-radius: 4px;
  overflow: hidden;
}
.k-geo-bar-fill{
  display:block;
  height: 100%;
  background: linear-gradient(90deg, var(--c-brand) 0%, #38bdf8 100%);
  border-radius: 4px;
  transition: width .25s ease;
}
.k-geo-list--bars a:hover .k-geo-bar-fill{
  background: linear-gradient(90deg, var(--c-brand-dark, #0369a1) 0%, var(--c-brand) 100%);
}

/* ── Sticky-сайдбары: «прилипают» при скролле центральной колонки ──
   Без внутренней прокрутки: если сайдбар короче экрана → залипает сверху;
   если длиннее → просто скроллится вместе со страницей (никаких лишних скроллбаров). */
.k-col-l, .k-col-r{
  position: sticky;
  top: 16px;
  align-self: start;
}
/* На мобилке (там колонки прячутся) sticky отключаем */
@media (max-width: 1280px){
  .k-col-l, .k-col-r{ position: static; }
}

/* ============================================================
   ФИЛЬТРЫ В САЙДБАРЕ (показываются для активного таба, кроме all)
   ============================================================ */
.k-filters{
  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 0;
  margin-bottom: 16px;
  box-shadow: var(--shadow-1);
  overflow: hidden;
}
.k-filters-hd{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
  background: linear-gradient(90deg, rgba(2,132,199,.05) 0%, rgba(124,58,237,.04) 100%);
}
.k-filters-ttl{
  display:flex;
  align-items:center;
  gap: 8px;
  font-weight: 700;
  font-size: 14px;
  color: var(--c-ink);
}
.k-filters-ttl i{ color: var(--c-brand); }
.k-filters-reset{
  display: inline-flex;
  align-items:center;
  gap: 4px;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-brand);
  background: rgba(2,132,199,.08);
  border: 0;
  border-radius: 6px;
  padding: 5px 9px;
  cursor: pointer;
  transition: background .15s;
  text-decoration: none;
}
.k-filters-reset:hover{ background: rgba(2,132,199,.15); }
.k-filters-body{ padding: 4px 16px 16px; }

.k-filt-sec{ padding: 10px 0; border-bottom: 1px dashed rgba(0,0,0,.06); }
.k-filt-sec:last-child{ border-bottom: 0; padding-bottom: 4px; }
.k-filt-lbl{
  display:block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--c-ink-2);
  text-transform: uppercase;
  margin-bottom: 7px;
}
.k-filt-lbl-sub{
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--c-ink-3);
  text-transform: none;
  margin: 8px 0 5px;
}

/* Поля ввода */
.k-filt-input, .k-filt-select{
  width: 100%;
  padding: 9px 11px;
  font-size: 13px;
  font-family: inherit;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  color: var(--c-ink);
  transition: border-color .15s, box-shadow .15s;
  outline: none;
  box-sizing: border-box;
}
.k-filt-input:hover, .k-filt-select:hover{ border-color: rgba(2,132,199,.4); }
.k-filt-input:focus, .k-filt-select:focus{
  border-color: var(--c-brand);
  box-shadow: 0 0 0 3px rgba(2,132,199,.12);
}
.k-filt-input::placeholder{ color: rgba(0,0,0,.35); }
.k-filt-select{
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748b'%3E%3Cpath d='M5 8l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  background-size: 16px;
  padding-right: 32px;
  cursor: pointer;
}
.k-filt-range{
  display:flex;
  gap: 8px;
}
.k-filt-range .k-filt-input{ flex: 1; }

/* Pill-кнопки (типы) */
.k-filt-pills{
  display:flex;
  flex-wrap: wrap;
  gap: 5px;
}
.k-filt-pill{
  flex: 1 1 auto;
  min-width: 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 5px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 7px;
  color: var(--c-ink-2);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.k-filt-pill i{ font-size: 11px; }
.k-filt-pill:hover{
  border-color: var(--c-brand);
  color: var(--c-brand);
}
.k-filt-pill.on, .k-filt-pill.active{
  background: linear-gradient(135deg, var(--c-brand) 0%, #38bdf8 100%);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 2px 4px rgba(2,132,199,.25);
}

/* Radio группа */
.k-filt-radio, .k-filt-chk{
  display:flex;
  align-items:center;
  gap: 8px;
  padding: 5px 0;
  font-size: 13px;
  color: var(--c-ink-2);
  cursor: pointer;
  user-select: none;
}
.k-filt-radio input, .k-filt-chk input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.k-filt-radio span, .k-filt-chk span{
  display:inline-block;
  width: 16px;
  height: 16px;
  border: 1.5px solid #cbd5e1;
  background: #fff;
  flex-shrink: 0;
  transition: all .15s;
  position: relative;
}
.k-filt-radio span{ border-radius: 50%; }
.k-filt-chk span{ border-radius: 4px; }
.k-filt-radio:hover span, .k-filt-chk:hover span{ border-color: var(--c-brand); }
.k-filt-radio input:checked + span{
  border-color: var(--c-brand);
  background: var(--c-brand);
  box-shadow: inset 0 0 0 3px #fff;
}
.k-filt-chk input:checked + span{
  border-color: var(--c-brand);
  background: var(--c-brand);
}
.k-filt-chk input:checked + span::after{
  content: '';
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.k-filt-radio input:checked ~ *, .k-filt-chk input:checked ~ *{ color: var(--c-ink); font-weight: 500; }

/* Wrapper для input + dropdown автодополнения */
.k-filt-ac-wrap{ position: relative; }
.k-filt-ac-drop{
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 60;
  max-height: 260px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .14), 0 2px 6px rgba(15, 23, 42, .08);
  display: none;
}
.k-filt-ac-drop.open{ display: block; }
.k-filt-ac-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  font-size: 13px;
  cursor: pointer;
  border-bottom: 1px solid rgba(0,0,0,.04);
  transition: background .12s;
}
.k-filt-ac-item:last-child{ border-bottom: 0; }
.k-filt-ac-item:hover, .k-filt-ac-item.k-filt-ac-active{
  background: linear-gradient(90deg, rgba(2,132,199,.06) 0%, rgba(2,132,199,.02) 100%);
}
.k-filt-ac-lbl{ color: var(--c-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1; }
.k-filt-ac-hint{
  font-size: 11px;
  color: var(--c-ink-3);
  background: rgba(2,132,199,.08);
  border-radius: 4px;
  padding: 1px 6px;
  white-space: nowrap;
  flex-shrink: 0;
}
.k-filt-ac-empty, .k-filt-ac-loading{
  padding: 10px 12px;
  font-size: 12px;
  color: var(--c-ink-3);
  text-align: center;
}
.k-filt-ac-loading::before{
  content: '\f110';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', FontAwesome;
  font-weight: 900;
  margin-right: 6px;
  animation: k-spin 1s linear infinite;
  display: inline-block;
}
@keyframes k-spin{ to { transform: rotate(360deg); } }

/* ============================================================
   4. ЦЕНТР: Hero + поиск
   ============================================================ */
.k-hero{
  background: linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  padding: 36px 36px 32px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-1);
  position: relative;
  overflow: hidden;
}
/* Декоративные размытые blob'ы за заголовком */
.k-hero-blob{
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: .35;
  pointer-events: none;
  z-index: 0;
}
.k-hero-blob--1{
  width: 280px; height: 280px;
  background: radial-gradient(circle, #93c5fd 0%, transparent 70%);
  top: -100px; right: -60px;
}
.k-hero-blob--2{
  width: 220px; height: 220px;
  background: radial-gradient(circle, #c4b5fd 0%, transparent 70%);
  bottom: -80px; left: -40px;
  opacity: .25;
}
.k-hero > *:not(.k-hero-blob){ position: relative; z-index: 1; }

/* Pill-бейдж сверху */
.k-hero-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 14px 6px 10px;
  background: rgba(37, 99, 235, 0.08);
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 100px;
  font-size: 12.5px;
  color: var(--c-ink-2);
  margin-bottom: 18px;
}
.k-hero-badge strong{ color: var(--c-brand); font-weight: 700; }
.k-hero-badge-dot{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-success);
  position: relative;
  flex-shrink: 0;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.18);
  animation: kpulse 2s infinite;
}
@keyframes kpulse{
  0%, 100%{ box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.18); }
  50%{ box-shadow: 0 0 0 8px rgba(22, 163, 74, 0.06); }
}

.k-hero h1{
  margin: 0 0 16px;
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--c-ink);
}
/* Градиентное акцентное слово "бизнеса" */
.k-hero-grad{
  background: linear-gradient(120deg, #2563eb 0%, #7c3aed 50%, #db2777 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.k-hero-sub{
  margin: 0 0 24px;
  color: var(--c-ink-2);
  font-size: 15px;
  line-height: 1.55;
}
.k-hero-sub strong{ color: var(--c-ink); font-weight: 700; }

/* Trust stats */
.k-hero-stats{
  display:flex;
  align-items:center;
  flex-wrap: wrap;
  gap: 18px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(15, 30, 53, 0.06);
  border-radius: var(--radius);
  margin-bottom: 22px;
}
.k-hero-stat{ display:flex; flex-direction:column; gap: 2px; }
.k-hero-stat-n{
  font-size: 18px;
  font-weight: 800;
  color: var(--c-ink);
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.k-hero-stat-l{
  font-size: 11.5px;
  color: var(--c-ink-3);
  text-transform: lowercase;
}
.k-hero-stat-sep{
  width: 1px;
  height: 30px;
  background: var(--c-border);
}

/* Чипы "Часто ищут" */
.k-hero-chips{
  display:flex;
  flex-wrap: wrap;
  align-items:center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--c-border);
}
.k-hero-chips-lbl{
  font-size: 12.5px;
  color: var(--c-ink-3);
  display:inline-flex;
  align-items:center;
  gap: 6px;
  margin-right: 4px;
}
.k-hero-chips-lbl i{ color: var(--c-accent); }
.k-hero-chip{
  display:inline-flex;
  align-items:center;
  padding: 5px 12px;
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: 100px;
  font-size: 12.5px;
  color: var(--c-ink-2);
  text-decoration: none;
  transition: all .15s;
  white-space: nowrap;
}
.k-hero-chip:hover{
  background: var(--c-brand);
  border-color: var(--c-brand);
  color: #fff;
  transform: translateY(-1px);
}

/* Ротатор ключевых слов в hero */
.k-hero-rot{
  display: inline-grid;
  vertical-align: baseline;
  min-width: 200px;
  height: 1.2em;
  overflow: hidden;
  position: relative;
}
.k-hero-rot-item{
  grid-column: 1;
  grid-row: 1;
  display: inline-block;
  white-space: nowrap;
  color: var(--rc, var(--c-brand));
  opacity: 0;
  transform: translateY(110%);
  transition: opacity .5s ease, transform .5s cubic-bezier(.34,1.56,.64,1);
  position: relative;
}
.k-hero-rot-item::after{
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 2px;
  height: 6px;
  background: var(--rc, var(--c-brand));
  opacity: .18;
  border-radius: 3px;
  z-index: -1;
}
.k-hero-rot-item.is-active{
  opacity: 1;
  transform: translateY(0);
}
.k-hero-rot-item.is-out{
  opacity: 0;
  transform: translateY(-110%);
}
.k-search{
  display:flex;
  gap: 0;
  border: 1px solid var(--c-border-2);
  border-radius: 10px;
  background: #fff;
  margin-bottom: 14px;
  transition: border-color .15s, box-shadow .15s;
  position: relative; /* для абсолют. выпадашек */
}
.k-search > *:first-child{ border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.k-search > *:last-child{ border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.k-search:focus-within{
  border-color: var(--c-brand);
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.k-search-input{
  flex: 1;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 0 14px;
}
.k-search-input i{ color: var(--c-ink-4); font-size: 14px; }
.k-search-input input{
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  height: 46px;
  font-size: 14px;
  font-family: inherit;
  color: var(--c-ink);
  min-width: 0;
}
.k-search-input input::placeholder{ color: var(--c-ink-4); }

/* Поле города + выпадашка автокомплита */
.k-search-city{
  position: relative;
  display:flex;
  align-items:center;
  gap: 8px;
  padding: 0 12px;
  border-left: 1px solid var(--c-border);
  min-width: 180px;
  max-width: 220px;
}
.k-search-city i{ color: var(--c-ink-4); font-size: 13px; flex-shrink: 0; }
.k-search-city input{
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  height: 46px;
  font-size: 13.5px;
  font-family: inherit;
  color: var(--c-ink);
  min-width: 0;
}
.k-search-city input::placeholder{ color: var(--c-ink-4); }
.k-search-city-drop{
  display: none;
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  right: 0;
  min-width: 240px;
  max-height: 280px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: 0 -8px 28px rgba(15,30,53,.12), 0 -2px 6px rgba(15,30,53,.06);
  z-index: 60;
  scrollbar-width: thin;
}
.k-search-city-drop::-webkit-scrollbar{ width: 6px; }
.k-search-city-drop::-webkit-scrollbar-thumb{ background:#cfd9e6; border-radius:3px; }
.k-city-opt{
  padding: 9px 14px;
  font-size: 13px;
  color: var(--c-ink-2);
  cursor: pointer;
  transition: background .12s;
}
.k-city-opt:hover{ background: var(--c-bg); color: var(--c-ink); }

.k-search-sect{
  position: relative;
  border-left: 1px solid var(--c-border);
  min-width: 140px;
}
.k-search-sect select{
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  height: 46px;
  padding: 0 32px 0 14px;
  font-size: 13.5px;
  font-family: inherit;
  color: var(--c-ink-2);
  width: 100%;
  outline: 0;
  cursor: pointer;
}
.k-search-sect::after{
  content:'\f078';
  font-family:'Font Awesome 6 Free';
  font-weight: 900;
  position:absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  color: var(--c-ink-4);
  pointer-events: none;
}
.k-search-btn{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  background: var(--c-brand);
  color:#fff;
  border:0;
  padding: 0 28px;
  font-weight: 600;
  font-size: 14px;
  height: 46px;
  transition: background .15s;
}
.k-search-btn:hover{ background: var(--c-brand-2); }

/* Фильтры под поиском */
.k-filters{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  position: relative;
}
.k-filter{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 9px 14px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 13px;
  color: var(--c-ink-2);
  cursor: pointer;
  transition: all .15s;
  user-select: none;
  font-family: inherit;
}
.k-filter:hover{ background:#fff; border-color: var(--c-brand-3); color: var(--c-ink); }
.k-filter i{ font-size: 11px; color: var(--c-ink-4); }
.k-filter i.fa-chevron-down{ font-size: 9px; margin-left: 2px; }

/* Dropdown-фильтр */
.k-fdd{ position: relative; }
.k-fdd.is-set .k-filter{
  background: rgba(37, 99, 235, .08);
  border-color: var(--c-brand);
  color: var(--c-brand);
  font-weight: 600;
}
.k-fdd.is-set .k-filter i{ color: var(--c-brand); }
.k-fdd.is-open .k-filter{ border-color: var(--c-brand); background: #fff; }
.k-fdd.is-open .k-fdd-arr{ transform: rotate(180deg); }
.k-fdd-arr{ transition: transform .18s; }

.k-fdd-pop{
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 280px;
  max-width: 360px;
  max-height: 380px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-3);
  z-index: 50;
  overflow: hidden;
  flex-direction: column;
}
.k-fdd-pop--sm{ min-width: 220px; }
.k-fdd.is-open .k-fdd-pop{ display: flex; }

.k-fdd-search{
  display:flex;
  align-items:center;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--c-border);
  background: var(--c-bg);
}
.k-fdd-search i{ color: var(--c-ink-4); font-size: 12px; }
.k-fdd-search input{
  border: 0;
  outline: 0;
  background: transparent;
  width: 100%;
  font-family: inherit;
  font-size: 13px;
  color: var(--c-ink);
}

.k-fdd-list{
  flex: 1;
  overflow-y: auto;
  padding: 4px 0;
  scrollbar-width: thin;
}
.k-fdd-list::-webkit-scrollbar{ width: 6px; }
.k-fdd-list::-webkit-scrollbar-thumb{ background:#cfd9e6; border-radius:3px; }

.k-fdd-opt{
  display: block;
  padding: 9px 14px;
  font-size: 13px;
  color: var(--c-ink-2);
  text-decoration: none;
  transition: background .12s;
  cursor: pointer;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
  font-family: inherit;
}
.k-fdd-opt:hover{ background: var(--c-bg); color: var(--c-ink); }
.k-fdd-opt.is-active{ background: rgba(37, 99, 235, .08); color: var(--c-brand); font-weight: 600; }
.k-fdd-opt.is-clear{ color: var(--c-ink-3); font-style: italic; border-bottom: 1px solid var(--c-border); }

.k-filter--clear{
  background: rgba(220, 38, 38, .08);
  border-color: rgba(220, 38, 38, .25);
  color: var(--c-danger);
}
.k-filter--clear:hover{
  background: var(--c-danger);
  color: #fff;
  border-color: var(--c-danger);
}
.k-filter--clear i{ color: inherit; }

/* Сводка результатов поиска */
.k-results-hd{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 16px;
  background: rgba(37, 99, 235, .05);
  border: 1px solid rgba(37, 99, 235, .12);
  border-radius: var(--radius);
  margin-bottom: 16px;
}
.k-results-lbl{ font-size: 13.5px; color: var(--c-ink-2); }
.k-results-lbl strong{ color: var(--c-brand); font-weight: 700; }
.k-results-lbl em{ color: var(--c-ink); font-weight: 600; font-style: normal; }
.k-results-clear{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 12.5px;
  color: var(--c-ink-2);
  text-decoration: none;
  transition: all .15s;
  white-space: nowrap;
}
.k-results-clear:hover{ background: var(--c-danger); color:#fff; border-color: var(--c-danger); }

/* Пустое состояние выдачи */
.k-empty{
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  background: #fff;
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-lg);
}
.k-empty p{
  margin: 0;
  font-size: 14px;
  color: var(--c-ink-3);
  line-height: 1.5;
}
.k-empty a{ color: var(--c-brand); text-decoration: none; }
.k-empty a:hover{ text-decoration: underline; }

/* ============================================================
   5. ПЛИТКИ КАТЕГОРИЙ
   ============================================================ */
.k-cats{
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.k-cats > *{ min-width: 0; }
.k-cat-tile{
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 22px 10px 18px;
  text-align: center;
  text-decoration: none;
  color: var(--c-ink);
  transition: all .18s;
  box-shadow: var(--shadow-1);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height: 140px;
}
.k-cat-tile:hover{
  border-color: var(--c-brand);
  transform: translateY(-2px);
  box-shadow: var(--shadow-2);
  color: var(--c-ink);
}
.k-cat-tile-ic{
  margin: 0 auto 14px;
  width: 40px; height: 40px;
  display:flex; align-items:center; justify-content:center;
  color: #1e3a5f;
  transition: color .18s;
  line-height: 1;
}
.k-cat-tile-ic svg{
  width: 38px; height: 38px;
  display: block;
}
.k-cat-tile:hover .k-cat-tile-ic{ color: var(--c-brand); }
.k-cat-tile-name{
  font-size: 13.5px;
  font-weight: 600;
  margin-bottom: 4px;
  color: var(--c-ink);
  line-height: 1.25;
}
.k-cat-tile-cnt{
  font-size: 12.5px;
  color: var(--c-ink-3);
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}

/* ============================================================
   6. CTA БЛОК "Готовы строить B2B-связи?"
   ============================================================ */
.k-cta{
  background: linear-gradient(135deg, #1d3a5f 0%, #1e40af 100%);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  margin-bottom: 16px;
  color: #fff;
  box-shadow: var(--shadow-2);
  position: relative;
  overflow: hidden;
}
.k-cta::before{
  content:'';
  position: absolute;
  right: -60px;
  top: -60px;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(255,255,255,.06) 0%, transparent 70%);
  pointer-events: none;
}
.k-cta-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap: 30px;
  margin-bottom: 24px;
  position: relative;
  z-index: 1;
}
.k-cta-text{ flex: 1; min-width: 0; }
.k-cta h2{
  margin: 0 0 10px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color:#fff;
}
.k-cta-sub{
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: 13.5px;
  line-height: 1.5;
  max-width: 480px;
}
.k-cta-actions{
  display:flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
  min-width: 220px;
}
.k-cta-actions .k-btn{ width: 100%; }
.k-cta-actions .k-btn--ghost{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.2);
  color: #fff;
}
.k-cta-actions .k-btn--ghost:hover{
  background: rgba(255,255,255,.15);
  color: #fff;
}
.k-cta-feats{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  position: relative;
  z-index: 1;
}
.k-cta-feat{
  display:flex;
  align-items:center;
  gap: 10px;
  font-size: 12.5px;
  color: rgba(255,255,255,.92);
}
.k-cta-feat-ic{
  width: 30px; height: 30px;
  border-radius: 8px;
  background: rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center;
  font-size: 12px;
  flex-shrink: 0;
}
.k-cta-feat-tx{ line-height: 1.3; }

/* ============================================================
   7. ВКЛАДКИ ПУБЛИКАЦИЙ
   ============================================================ */
.k-tabs{
  display:flex;
  gap: 4px;
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 5px;
  margin-bottom: 14px;
  overflow-x: auto;
  scrollbar-width: none;
  box-shadow: var(--shadow-1);
}
.k-tabs::-webkit-scrollbar{ display:none; }
.k-tab{
  padding: 9px 16px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-ink-2);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
  flex-shrink: 0;
}
.k-tab:hover{ color: var(--c-ink); background: var(--c-bg); }
.k-tab.active{ background: var(--c-brand); color: #fff; box-shadow: 0 2px 6px rgba(37,99,235,.25); }

/* ============================================================
   8. КАРТОЧКИ ПУБЛИКАЦИЙ (унифицированные)
   ============================================================ */
.k-feed{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.k-feed > *{ min-width: 0; }
.k-card{
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: 18px 18px 16px;
  display:flex;
  flex-direction:column;
  text-decoration: none;
  color: inherit;
  transition: border-color .18s, box-shadow .18s, transform .18s;
  position: relative;
  box-shadow: var(--shadow-1);
  min-height: 280px;
  /* Stagger fade-in анимация при появлении (delay назначается из JS) */
  opacity: 0;
  transform: translateY(14px);
  animation: kCardIn .5s cubic-bezier(.2,.7,.25,1) forwards;
}
.k-card:hover{
  border-color: var(--c-brand);
  transform: translateY(-2px);
  box-shadow: var(--shadow-2);
  color: inherit;
  z-index: 50;        /* поднимаем над соседями — чтобы popover аватарки не перекрывался */
}
@keyframes kCardIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ── Премиум-обводка (золотая) ── */
.k-card--prem{
  border-color: #fbbf24;
  box-shadow: 0 0 0 1px #fde68a, var(--shadow-1);
  /* мягкий золотой блик сверху */
  background:
    linear-gradient(180deg, rgba(253,230,138,.18) 0%, rgba(253,230,138,0) 60px),
    var(--c-panel);
}
.k-card--prem:hover{
  border-color: #f59e0b;
  box-shadow: 0 0 0 1px #fcd34d, 0 8px 28px rgba(251,191,36,.30);
}
/* Декоративный «золотой уголок» — едва заметный, чтобы Premium читался даже без бейджа */
.k-card--prem::before{
  content: "";
  position: absolute;
  top: 0; right: 0;
  width: 70px; height: 70px;
  background: radial-gradient(circle at top right, rgba(251,191,36,.18), transparent 70%);
  border-top-right-radius: var(--radius);
  pointer-events: none;
}

/* ── Demo-обводка (красная) ── */
.k-card--demo{
  border-color: #f87171;
  box-shadow: 0 0 0 1px #fecaca, var(--shadow-1);
}
.k-card--demo:hover{
  border-color: #ef4444;
  box-shadow: 0 0 0 1px #fca5a5, 0 8px 24px rgba(239,68,68,.22);
}
/* Учёт системного «уменьшить движение» */
@media (prefers-reduced-motion: reduce){
  .k-card{ opacity:1; transform:none; animation:none; }
}
.k-card-hd{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
  gap: 8px;
}
/* ── Бейджи карточки (горизонтальная линия справа-сверху) ──
 * Объединяет verified/premium/demo/gov/urgent/featured + избранное
 * в один блок 26px-кругляшей, как в старом index.php но не вертикально.
 */
.k-card-badges{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}
.k-bg{
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  cursor: default;
  flex-shrink: 0;
  border: 0;
  padding: 0;
  color: #fff;
  transition: transform .15s, box-shadow .15s;
}
.k-bg--ver  { background: #059669; box-shadow: 0 2px 6px rgba(5,150,105,.30); }
.k-bg--unv  { background: #94a3b8; box-shadow: 0 2px 6px rgba(148,163,184,.30); }
.k-bg--prm  { background: linear-gradient(135deg,#fbbf24,#f59e0b); box-shadow: 0 2px 6px rgba(245,158,11,.35); }
.k-bg--top  { background: #7c3aed; box-shadow: 0 2px 6px rgba(124,58,237,.30); }
.k-bg--demo { background: #ef4444; box-shadow: 0 2px 6px rgba(239,68,68,.30); }
.k-bg--urg  { background: #f97316; box-shadow: 0 2px 6px rgba(249,115,22,.30); }
.k-bg--gov  { background: #3b82f6; box-shadow: 0 2px 6px rgba(59,130,246,.30); }
.k-bg--new  { background: linear-gradient(135deg,#10b981,#059669); box-shadow: 0 2px 6px rgba(16,185,129,.35); }

/* Срочно — лёгкая пульсация чтобы привлечь внимание */
.k-bg--urg{ animation: kBgPulse 1.6s ease-in-out infinite; }
@keyframes kBgPulse {
  0%, 100% { box-shadow: 0 2px 6px rgba(249,115,22,.30); }
  50%      { box-shadow: 0 2px 12px rgba(249,115,22,.65); }
}

/* Избранное — отдельный стиль (интерактивная кнопка) */
.k-bg--fav,
.gc-fav-btn{
  background: rgba(148,163,184,.85);
  box-shadow: 0 2px 6px rgba(148,163,184,.30);
  cursor: pointer;
  outline: 0;
}
.k-bg--fav:hover,
.gc-fav-btn:hover{
  background: #e11d48;
  transform: scale(1.1);
  box-shadow: 0 2px 8px rgba(225,29,72,.40);
}
.k-bg--fav.active,
.gc-fav-btn.active{
  background: #e11d48;
  box-shadow: 0 2px 6px rgba(225,29,72,.35);
}
.k-bg--fav.active i,
.gc-fav-btn.active i{ font-weight: 900; }

/* Бейдж типа публикации — крупный, насыщенный, белый текст */
.k-badge{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
}
.k-badge--co{ background: var(--b-co-bg); color: var(--b-co-fg); }
.k-badge--of{ background: var(--b-of-bg); color: var(--b-of-fg); }
.k-badge--pr{ background: var(--b-pr-bg); color: var(--b-pr-fg); }
.k-badge--tn{ background: var(--b-tn-bg); color: var(--b-tn-fg); }
.k-badge--vc{ background: var(--b-vc-bg); color: var(--b-vc-fg); }
.k-badge--rl{ background: var(--b-rl-bg); color: var(--b-rl-fg); }
.k-badge--vd{ background: var(--b-vd-bg); color: var(--b-vd-fg); }
.k-badge--nw{ background: var(--b-nw-bg); color: var(--b-nw-fg); }
.k-badge--hot{ background: #fee2e2; color: #dc2626; }
.k-badge--gov{ background: #e0e7ff; color: #3730a3; }

/* ───────── Унифицированный каркас карточки (для всех типов) ───────── */
.k-card-main{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}
.k-card-main-text{ flex: 1; min-width: 0; }

/* Универсальная аватарка компании рядом с заголовком — с zoom-popover при hover */
.k-av{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink: 0;
  background: linear-gradient(135deg, #0284c7 0%, #6366f1 100%);
  color: #fff;
  font-weight: 800;
  letter-spacing: .5px;
  border-radius: 9px;
  box-shadow: 0 2px 6px rgba(15,23,42,.08);
  position: relative;          /* для popover-zoom */
  overflow: visible;            /* чтобы popover мог вылезать */
}
/* Основное содержимое аватарки нужно клипать (картинка/инициалы), но не popover */
.k-av > img,
.k-av > span:not(.k-av-zoom){
  width: 100%;
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  overflow: hidden;
}
.k-av--sm{ width: 24px; height: 24px; font-size: 9px; border-radius: 6px; }
.k-av--md{ width: 40px; height: 40px; font-size: 13px; border-radius: 9px; }
.k-av--lg{ width: 48px; height: 48px; font-size: 15px; border-radius: 10px; }
.k-av--img{
  background: #fff;
  border: 1px solid var(--c-border);
  box-shadow: 0 2px 4px rgba(15,23,42,.04);
}
.k-av--img > img{ object-fit: contain; padding: 3px; }
.k-av--sm.k-av--img > img{ padding: 2px; }

/* ── Zoom-popover для аватарки при наведении (140×140) ── */
.k-av-zoom{
  position: absolute;
  left: 0;
  top: 100%;
  transform: translateY(8px) scale(.85);
  transform-origin: top left;
  width: 140px;
  height: 140px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--c-border);
  box-shadow: 0 16px 40px rgba(15,23,42,.22), 0 6px 14px rgba(15,23,42,.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  font-weight: 800;
  color: var(--c-brand);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 50;
  transition: opacity .18s ease, transform .18s cubic-bezier(.2,.7,.3,1), visibility 0s linear .18s;
  overflow: hidden;
}
.k-av-zoom img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px;
}
.k-av-zoom::after{
  content: '';
  position: absolute;
  top: -7px;
  left: 14px;
  transform: rotate(45deg);
  width: 12px;
  height: 12px;
  background: #fff;
  border-left: 1px solid var(--c-border);
  border-top: 1px solid var(--c-border);
}
/* Для маленьких аватарок (sm 24px) — носик у левого края */
.k-av--sm .k-av-zoom::after{ left: 6px; }
/* Не на градиенте (с инициалами) — фон popover тоже белый, инициалы цветные */
.k-av:not(.k-av--img) .k-av-zoom{
  background: linear-gradient(135deg, #0284c7 0%, #6366f1 100%);
  color: #fff;
}
.k-av:not(.k-av--img) .k-av-zoom::after{
  background: #0284c7;
  border-color: rgba(255,255,255,.2);
}

/* Показ popover при hover */
.k-av:hover{ z-index: 51; }
.k-av:hover .k-av-zoom{
  opacity: 1;
  visibility: visible;
  transform: translateY(12px) scale(1);
  transition: opacity .18s ease, transform .18s cubic-bezier(.2,.7,.3,1), visibility 0s;
}

/* Обложка-миниатюра (новости, пресс-релизы, видео) — справа от заголовка */
.k-card-cover{
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  border-radius: 9px;
  background: #f1f5f9;
  position: relative;
  /* overflow: visible нужно для zoom-popover. Сам img клипаем через wrapper */
  overflow: visible;
}
.k-card-cover > img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}
.k-card-cover--ph{
  color: var(--c-ink-4);
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.k-card-cover-play{
  position: absolute;
  inset: 0;
  display:flex; align-items:center; justify-content:center;
  background: rgba(0,0,0,.35);
  color: #fff;
  font-size: 18px;
  transition: background .15s;
  border-radius: inherit;
  pointer-events: none;
}
.k-card:hover .k-card-cover-play{ background: rgba(2,132,199,.6); }

/* ── Zoom-popover для обложки (220×220) при hover ── */
.k-card-cover-zoom{
  position: absolute;
  right: 0;
  top: 100%;
  transform: translateY(8px) scale(.9);
  transform-origin: top right;
  width: 220px;
  height: 220px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid var(--c-border);
  box-shadow: 0 18px 48px rgba(15,23,42,.24), 0 6px 16px rgba(15,23,42,.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 64px;
  color: var(--c-ink-4);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 60;
  transition: opacity .2s ease, transform .2s cubic-bezier(.2,.7,.3,1), visibility 0s linear .2s;
  overflow: hidden;
}
.k-card-cover-zoom img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.k-card-cover-zoom::after{
  /* «носик» вверх — указывает на маленькую обложку */
  content: '';
  position: absolute;
  top: -7px;
  right: 30px;
  transform: rotate(45deg);
  width: 12px;
  height: 12px;
  background: #f8fafc;
  border-left: 1px solid var(--c-border);
  border-top: 1px solid var(--c-border);
}
.k-card-cover:hover .k-card-cover-zoom{
  opacity: 1;
  visibility: visible;
  transform: translateY(12px) scale(1);
  transition: opacity .2s ease, transform .2s cubic-bezier(.2,.7,.3,1), visibility 0s;
}

/* Заголовок: один стиль для всех типов — тёмный, не меняет цвет на hover */
.k-card-title{
  margin: 0 0 6px;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--c-ink);
  letter-spacing: -0.01em;
  /* Заголовок НИКОГДА не обрезаем — пусть переносится на любое число строк.
   * Высота карточки подстроится; grid сам выравнивает строки. */
  word-wrap: break-word;
  overflow-wrap: anywhere;     /* очень длинные слова без пробелов тоже перенесутся */
  hyphens: auto;
}
.k-card:hover .k-card-title{ color: var(--c-brand); }

.k-card-meta{
  display:flex;
  flex-wrap: wrap;
  align-items:center;
  gap: 4px 12px;
  font-size: 12px;
  color: var(--c-ink-3);
  margin: 0;     /* отступ задаётся через k-card-main (margin-bottom: 10px) */
}
.k-card-meta span{ display:inline-flex; align-items:center; gap: 5px; }
.k-card-meta i{ color: var(--c-ink-4); font-size: 11px; }
.k-card-meta .k-meta-dot{
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--c-success);
  display:inline-block;
  flex-shrink: 0;
}
.k-card-meta .k-meta-gov{ color: var(--c-purple); }
.k-card-meta .k-meta-gov .k-meta-dot{ background: var(--c-purple); }
.k-card-meta .k-meta-comm{ color: var(--c-success); }
/* Акцент на дедлайне (срок процедуры/тендера) */
.k-card-meta .k-meta-deadline,
.k-card-info .k-meta-deadline{
  color: #d97706;
  font-weight: 600;
}
.k-card-meta .k-meta-deadline i,
.k-card-info .k-meta-deadline i{ color: #d97706; }

/* Мини-блок «компания» внизу карточки (для оферт/процедур/тендеров/вакансий) */
.k-card-co{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
}
.k-card-co-text{
  display: inline-flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  line-height: 1.15;
}
.k-card-co-name{
  font-size: 12px;
  color: var(--c-ink-2);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 260px;     /* было 180px — увеличили чтобы дольше не обрезалось */
}
.k-card-co-inn{
  font-size: 10.5px;
  color: var(--c-ink-4);
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  margin-top: 1px;
}
/* ИНН-плашка в meta — компактная, моноширинный шрифт чисел */
.k-card-meta .k-meta-inn{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  color: var(--c-ink-3);
}
/* Иконки доступных каналов связи (телефон/email/сайт) */
.k-card-contacts{
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
}
.k-card-contacts i{
  font-size: 11px;
  opacity: .85;
}

.k-card-desc{
  font-size: 13px;
  color: var(--c-ink-2);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 12px;
}

/* Дополнительный inline-блок информации (цена, дедлайн, просмотры) */
.k-card-info{
  display:flex;
  flex-wrap: wrap;
  align-items:center;
  gap: 4px 14px;
  font-size: 12.5px;
  color: var(--c-ink-3);
  margin-bottom: 10px;
}
.k-card-info span{ display:inline-flex; align-items:center; gap: 5px; }
.k-card-info i{ color: var(--c-ink-4); font-size: 11px; }

/* Низ карточки — кнопка во всю ширину */
.k-card-ft{
  margin-top: auto;
  padding-top: 12px;
}
/* Доп. строка мета над кнопкой (возраст компании, дата и т.п.) */
.k-card-subft{
  font-size: 12px;
  color: var(--c-ink-3);
  display:flex;
  flex-wrap: wrap;
  align-items:center;
  gap: 4px 12px;
  margin-bottom: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--c-border);
}
.k-card-subft span{ display:inline-flex; align-items:center; gap: 5px; }
.k-card-subft i{ color: var(--c-ink-4); }
.k-card-subft .k-sep{ width:3px; height:3px; border-radius:50%; background: var(--c-ink-4); display:inline-block; }

.k-card-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  width: 100%;
  height: 40px;
  padding: 0 14px;
  background: #f3f5f9;
  border: 1px solid var(--c-border);
  border-radius: 9px;
  color: var(--c-ink);
  font-size: 13px;
  font-weight: 600;
  transition: all .15s;
  white-space: nowrap;
}
.k-card:hover .k-card-cta{ background: var(--c-brand); border-color: var(--c-brand); color: #fff; }
.k-card-cta--accent{
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: #fff;
}
.k-card:hover .k-card-cta--accent{ background: var(--c-accent-2); border-color: var(--c-accent-2); }

/* Цена / зарплата — выделение */
.k-card-price{
  display:inline-flex;
  align-items:center;
  gap: 4px;
  font-weight: 700;
  color: var(--c-ink);
  font-size: 13.5px;
}

/* Полноширинная карточка (баннер промо/featured) */
.k-card--wide{
  grid-column: 1 / -1;
}

/* Кнопка "показать ещё" */
.k-feed-more{
  width: 100%;
  height: 48px;
  display:flex; align-items:center; justify-content:center; gap: 8px;
  background: var(--c-panel);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  color: var(--c-brand);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  box-shadow: var(--shadow-1);
}
.k-feed-more:hover{ background: var(--c-brand); color:#fff; border-color: var(--c-brand); }

/* Sentinel для бесконечной прокрутки */
.k-feed-sentinel{
  min-height: 80px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top: 4px;
}
.k-feed-loader{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 18px 22px;
  color: var(--c-ink-3);
  font-size: 13px;
  font-weight: 500;
}
.k-feed-loader i{ color: var(--c-brand); font-size: 16px; }

/* ============================================================
   9. ПРАВАЯ КОЛОНКА
   ============================================================ */

/* Курсы валют */
.k-cbr-hd{
  display:flex;
  align-items:center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.k-cbr-title{ font-size: 14px; font-weight: 700; color: var(--c-ink); }
.k-cbr-date{ font-size: 11.5px; color: var(--c-ink-3); }
.k-cbr-list{ display:flex; flex-direction:column; gap: 14px; }
.k-cbr-row{
  display:flex;
  align-items:center;
  gap: 12px;
}
.k-cbr-flag{
  width: 36px; height: 36px;
  border-radius: 10px;
  display:flex; align-items:center; justify-content:center;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: -0.02em;
}
.k-cbr-flag--usd{ background: linear-gradient(135deg, #4338ca 0%, #6366f1 100%); }
.k-cbr-flag--eur{ background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%); }
.k-cbr-flag--gbp{ background: linear-gradient(135deg, #991b1b 0%, #1e3a8a 100%); }
.k-cbr-flag--cny{ background: linear-gradient(135deg, #dc2626 0%, #f59e0b 100%); }
.k-cbr-flag--jpy{ background: #fff; border: 1px solid var(--c-border-2); position: relative; }
.k-cbr-flag--jpy::after{
  content:''; position: absolute; left: 50%; top: 50%;
  width: 14px; height: 14px; border-radius: 50%;
  background: #dc2626; transform: translate(-50%, -50%);
}

.k-cbr-info{ flex: 1; min-width: 0; overflow:hidden; }
.k-cbr-code{ font-size: 14px; font-weight: 700; color: var(--c-ink); line-height: 1.15; letter-spacing: -0.01em; }
.k-cbr-name{ font-size: 11px; color: var(--c-ink-3); white-space: nowrap; overflow:hidden; text-overflow: ellipsis; margin-top: 2px; }

.k-cbr-vals{
  flex-shrink: 0;
  display:flex;
  flex-direction:row;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.k-cbr-val{
  font-size: 15px;
  font-weight: 700;
  color: var(--c-ink);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.k-cbr-diff{
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  display: inline-flex;
  align-items:center;
  gap: 3px;
  min-width: 50px;
}
.k-cbr-diff.up{ color: var(--c-success); }
.k-cbr-diff.dn{ color: var(--c-danger); }
.k-cbr-diff.eq{ color: var(--c-ink-3); }
.k-cbr-diff-arrow{ font-size: 9px; line-height: 1; }
.k-cbr-all{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--c-border);
  text-align: center;
  font-size: 12.5px;
  color: var(--c-brand);
  font-weight: 500;
  display: block;
}

/* Статистика — donut */
.k-stat-donut-wrap{
  position: relative;
  width: 180px;
  height: 180px;
  margin: 10px auto 16px;
}
.k-stat-donut-center{
  position: absolute;
  inset: 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align: center;
  pointer-events: none;
}
.k-stat-donut-num{
  font-size: 30px;
  font-weight: 800;
  color: var(--c-ink);
  letter-spacing: -0.02em;
  line-height: 1;
}
.k-stat-donut-lbl{
  font-size: 11.5px;
  color: var(--c-ink-3);
  margin-top: 4px;
}
.k-stat-legend{ display:flex; flex-direction:column; gap: 8px; }
.k-stat-leg-row{
  display:flex;
  align-items:center;
  font-size: 12.5px;
}
.k-stat-leg-dot{
  width: 8px; height: 8px;
  border-radius: 50%;
  margin-right: 8px;
  flex-shrink: 0;
}
.k-stat-leg-lbl{ color: var(--c-ink-2); flex: 1; }
.k-stat-leg-cnt{ font-weight: 600; color: var(--c-ink); font-variant-numeric: tabular-nums; }
.k-stat-all{
  display: block;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--c-border);
  text-align: center;
  font-size: 12.5px;
  color: var(--c-brand);
  font-weight: 500;
}

/* Hot / New / Popular tabs */
.k-htabs{
  display:flex;
  gap: 4px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--c-border);
}
.k-htab{
  padding: 8px 12px;
  border: 0;
  background: transparent;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--c-ink-3);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: all .15s;
}
.k-htab:hover{ color: var(--c-ink); }
.k-htab.active{ color: var(--c-brand); border-bottom-color: var(--c-brand); }

.k-hot-list{ display:flex; flex-direction:column; gap: 14px; }
.k-hot-item{ display:flex; gap: 10px; text-decoration: none; color: inherit; }
.k-hot-ic{
  width: 28px; height: 28px;
  border-radius: 7px;
  background: #fee2e2;
  color: var(--c-danger);
  display:flex; align-items:center; justify-content:center;
  font-size: 12px;
  flex-shrink: 0;
}
.k-hot-ic--proc{ background: var(--b-pr-bg); color: var(--b-pr-fg); }
.k-hot-ic--tnd{ background: var(--b-tn-bg); color: var(--b-tn-fg); }
.k-hot-ic--off{ background: var(--b-of-bg); color: var(--b-of-fg); }
.k-hot-body{ min-width: 0; flex: 1; }
.k-hot-type{ font-size: 11px; color: var(--c-ink-3); margin-bottom: 2px; }
.k-hot-title{
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-ink);
  line-height: 1.3;
  margin-bottom: 4px;
  /* Заголовок «горячего» виджета — без обрезки */
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.k-hot-item:hover .k-hot-title{ color: var(--c-brand); }
.k-hot-meta{ font-size: 11px; color: var(--c-ink-4); line-height: 1.35; }

/* Новые компании */
.k-org-list{ display:flex; flex-direction:column; gap: 12px; }
.k-org-item{
  display:flex;
  gap: 10px;
  text-decoration:none;
  color: inherit;
  position: relative;        /* для absolute zoom-превью */
  align-items: center;
}
.k-org-av{
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  display:flex; align-items:center; justify-content:center;
  font-size: 12px;
  font-weight: 700;
  color: var(--c-brand);
  flex-shrink: 0;
  overflow: visible;          /* чтобы zoom мог выходить за пределы */
  position: relative;
  transition: transform .15s;
}
.k-org-av > img{
  width:100%; height:100%; object-fit: contain;
  padding: 2px;
  border-radius: 7px;
}
.k-org-av.has-img{ background: #fff; }
/* Zoom-превью 160×160 при наведении (выровнено по левому краю аватарки) */
.k-org-av-zoom{
  position: absolute;
  left: 0;
  top: 100%;
  transform: translateY(8px) scale(.85);
  transform-origin: top left;
  width: 160px;
  height: 160px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--c-border);
  box-shadow: 0 16px 48px rgba(15,23,42,.2), 0 6px 16px rgba(15,23,42,.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  font-weight: 800;
  color: var(--c-brand);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 100;
  transition: opacity .18s ease, transform .18s cubic-bezier(.2,.7,.3,1), visibility 0s linear .18s;
  overflow: hidden;
}
.k-org-av-zoom img{
  width: 100%;
  height: 100%;
  object-fit: contain;          /* картинка целиком, без обрезки */
  padding: 10px;
}
.k-org-av-zoom::after{
  /* «носик» сверху — указывает на аватарку */
  content: '';
  position: absolute;
  top: -7px;
  left: 14px;                   /* по центру аватарки (44px / 2 - 6px) */
  transform: rotate(45deg);
  width: 12px;
  height: 12px;
  background: #fff;
  border-left: 1px solid var(--c-border);
  border-top: 1px solid var(--c-border);
}
.k-org-item:hover .k-org-av-zoom{
  opacity: 1;
  visibility: visible;
  transform: translateY(12px) scale(1);
  transition: opacity .18s ease, transform .18s cubic-bezier(.2,.7,.3,1), visibility 0s;
}
/* Последние 2-3 элемента — показывать превью сверху (чтобы не вылезало за низ панели) */
.k-org-item:nth-last-child(-n+2) .k-org-av-zoom{
  top: auto;
  bottom: 100%;
  transform-origin: bottom left;
  transform: translateY(-8px) scale(.85);
}
.k-org-item:nth-last-child(-n+2) .k-org-av-zoom::after{
  top: auto;
  bottom: -7px;
  border-left: none;
  border-top: none;
  border-right: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}
.k-org-item:nth-last-child(-n+2):hover .k-org-av-zoom{
  transform: translateY(-12px) scale(1);
}

.k-org-body{ min-width: 0; flex: 1; }
.k-org-name{
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-ink);
  line-height: 1.3;
  /* Название компании в виджете — без обрезки (до 2-3 строк если очень длинное) */
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.k-org-item:hover .k-org-name{ color: var(--c-brand); }
.k-org-meta{ font-size: 11px; color: var(--c-ink-3); margin-top: 2px; }

/* ============================================================
   10. ПОЛОСА СТАТИСТИКИ (под лентой)
   ============================================================ */
.k-strip{
  background: var(--c-panel);
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  padding: 28px 0;
  margin-top: 24px;
}
.k-strip-grid{
  display:grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));   /* 8 разделов в строку на десктопе */
  gap: 18px;
  align-items: stretch;
}
.k-strip-it{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  background: transparent;
  border: 1px solid transparent;
  transition: background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.k-strip-it:hover{
  background: #fafbfc;
  border-color: #e5e7eb;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(15,23,42,.07);
  color: inherit;
}

/* ── Иконки: монохром, премиальный B&W стиль ── */
.k-strip-ic{
  width: 46px; height: 46px;
  border-radius: 12px;
  /* мягкий нейтральный градиент — выглядит «дорого», без насыщенного цвета */
  background: linear-gradient(135deg, #f4f5f7 0%, #e7e9ed 100%);
  color: #1f2937;     /* тёмно-графитовый */
  display:flex; align-items:center; justify-content:center;
  font-size: 18px;
  flex-shrink: 0;
  border: 1px solid #e5e7eb;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.7),     /* верхний блик — даёт «объём» */
    0 1px 2px rgba(15,23,42,.04);
  transition: background .22s ease, color .22s ease, transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.k-strip-ic i{
  /* лёгкий «отлив» — иконка не плоская */
  background: linear-gradient(180deg, #374151 0%, #111827 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.6));
  transition: filter .22s ease;
}
/* HOVER: инверсия — графитовый фон, белая иконка */
.k-strip-it:hover .k-strip-ic{
  background: linear-gradient(135deg, #1f2937 0%, #0f172a 100%);
  border-color: #0f172a;
  transform: scale(1.06) rotate(-2deg);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 6px 14px rgba(15,23,42,.25);
}
.k-strip-it:hover .k-strip-ic i{
  background: linear-gradient(180deg, #fff 0%, #cbd5e1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.25));
}

.k-strip-num{
  font-size: 22px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.k-strip-lbl{
  font-size: 12px;
  color: #64748b;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
  letter-spacing: 0.01em;
}

/* ============================================================
   11. ФУТЕР
   ============================================================ */
.k-footer{
  background: linear-gradient(135deg, #0f2942 0%, #1a3658 100%);
  color: rgba(255,255,255,.78);
  padding: 48px 0 24px;
  margin-top: 0;
}
.k-footer-grid{
  display:grid;
  grid-template-columns: 1.5fr 1fr 1.3fr 1.2fr;
  gap: 36px;
  margin-bottom: 32px;
}
.k-footer-brand{
  display:flex;
  flex-direction:column;
  gap: 14px;
}
.k-footer-logo{
  display:flex;
  align-items:center;
  gap: 10px;
}
.k-footer-logo .k-logo-mark{ box-shadow: 0 4px 14px rgba(37,99,235,.4); }
.k-footer-logo .k-logo-name{ color:#fff; font-size: 18px; }
.k-footer-desc{
  font-size: 12.5px;
  color: rgba(255,255,255,.6);
  line-height: 1.5;
}
.k-footer-col h4{
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.k-footer-col h4 i{
  color: rgba(255,255,255,.45);
  font-size: 12px;
  width: 16px;
  text-align: center;
}
/* Подзаголовок (второй <h4> в колонке) — например «Личный кабинет» под «Документы» */
.k-footer-col .k-footer-h-mt{
  margin-top: 20px;
}
.k-footer-col ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.k-footer-col li{ line-height: 1.3; }
.k-footer-col a{
  color: rgba(255,255,255,.65);
  font-size: 13px;
  transition: color .15s ease, padding-left .15s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.k-footer-col a i{
  width: 14px;
  text-align: center;
  font-size: 11px;
  color: rgba(255,255,255,.35);
  transition: color .15s ease;
  flex-shrink: 0;
}
.k-footer-col a:hover{ color: #fff; padding-left: 3px; }
.k-footer-col a:hover i{ color: var(--c-brand); }
.k-footer-contact{ display:flex; flex-direction:column; gap: 12px; font-size: 13px; }
.k-footer-contact-it{
  display:flex;
  align-items:center;
  gap: 10px;
  color: rgba(255,255,255,.78);
}
.k-footer-contact-it i{ color: rgba(255,255,255,.5); width: 14px; text-align:center; }
.k-footer-contact-it a{ color: rgba(255,255,255,.78); }
.k-footer-contact-it a:hover{ color: #fff; }

.k-footer-socials{
  display:flex; gap: 12px; margin-top: 14px;
}
/* Круглая белая «таблетка» с фирменным цветным SVG внутри */
.k-footer-soc{
  width: 48px; height: 48px;
  border-radius: 50%;
  background: #fff;
  display:inline-flex; align-items:center; justify-content:center;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,.18);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease;
}
.k-footer-soc img{
  width: 28px;
  height: 28px;
  display: block;
  transition: transform .25s cubic-bezier(.34,1.56,.64,1);
}
.k-footer-soc:hover{
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0,0,0,.30);
}
.k-footer-soc:hover img{ transform: scale(1.1); }
.k-footer-soc:active{ transform: translateY(0); }

.k-footer-bot{
  border-top: 1px solid rgba(255,255,255,.08);
  padding-top: 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size: 12.5px;
  color: rgba(255,255,255,.55);
  flex-wrap: wrap;
  gap: 12px;
}
.k-footer-bot .heart{ color: #f87171; }

/* Левая часть нижней полосы: copyright + ИНН + ОГРН */
.k-footer-bot-left{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 12px;
}
.k-footer-sep{ color: rgba(255,255,255,.20); user-select: none; }
.k-footer-req{
  color: rgba(255,255,255,.55);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.k-footer-req strong{
  color: rgba(255,255,255,.85);
  font-weight: 600;
}

/* Правая часть нижней полосы: «Сделано в России» + WDSR + Яндекс ИКС */
.k-footer-bot-right{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
}
.k-footer-made{ white-space: nowrap; }
.k-footer-dev{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-left: 14px;
  border-left: 1px solid rgba(255,255,255,.10);
}
.k-footer-dev-lbl{
  font-size: 11.5px;
  color: rgba(255,255,255,.40);
  white-space: nowrap;
}
.k-footer-wdsr{
  display: inline-flex;
  line-height: 0;
  border-radius: 6px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.k-footer-wdsr:hover{
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255,107,0,.35);
}
.k-footer-wdsr svg{ display:block; }
.k-footer-yaiks{
  display: inline-flex;
  line-height: 0;
  border-radius: 8px;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
}
.k-footer-yaiks:hover{
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.k-footer-yaiks img{ display:block; border-radius: 8px; }

/* ─────────────────────────────────────────────────────────
   Совместимость со старыми страницами (.portal-body):
   старый portal-home.css/style.css задают padding-top для
   "fixed" navbar высотой --nb-h-px, но новая шапка .k-header
   уже sticky и занимает своё место — резерв не нужен.
   ───────────────────────────────────────────────────────── */
body.portal-body{ padding-top: 0; }

/* ============================================================
   12. RESPONSIVE
   ============================================================ */

/* Уменьшаем нав, ужимаем колонки. Большие тексты email/телефона прячем поэтапно. */
@media (max-width: 1500px){
  .k-mail-text{ display:none; }    /* остаётся иконка конверта */
  .k-mail-link{ padding: 8px 10px; }
}
@media (max-width: 1380px){
  .k-nav{ gap: 10px; }
  .k-nav a{ font-size: 13px; }
  .k-phone-text, .k-help-text{ display:none; }
  .k-phone-link, .k-help-link{ padding: 8px 10px; }
  .k-header-right{ gap: 6px; }
  .k-header-right .k-btn{ padding: 7px 10px; font-size: 12px; }
}
@media (max-width: 1200px){
  :root{ --col-l: 220px; --col-r: 240px; }
  .k-nav a i{ display:none; } /* убираем иконки в навигации чтобы влезло */
}

/* Карточки 2 в ряд, скрыта правая колонка */
@media (max-width: 1280px){
  .k-feed{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-cta-feats{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Скрываем левую колонку */
@media (max-width: 1100px){
  .k-grid{ grid-template-columns: 1fr var(--col-r); }
  .k-col-l{ display: none; }
  .k-cats{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .k-strip-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
  .k-footer-grid{ grid-template-columns: 1.4fr 1fr 1fr; }
  .k-footer-grid > .k-footer-col:nth-child(4){ grid-column: 1 / -1; }
}

/* Планшет — одна колонка */
@media (max-width: 900px){
  :root{ --gap: 16px; }
  .k-container{ padding: 0 16px; }
  .k-grid{ grid-template-columns: 1fr; }
  .k-col-r{ display: none; }
  .k-feed{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-cats{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .k-hero{ padding: 24px 20px; }
  .k-hero h1{ font-size: 22px; }
  .k-hero-sub{ font-size: 13px; }
  .k-cta{ padding: 22px 20px; }
  .k-cta-top{ flex-direction: column; gap: 16px; }
  .k-cta-actions{ width:100%; }
  .k-cta-actions .k-btn{ flex:1; }
  .k-cta-feats{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-strip-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .k-footer-grid{ grid-template-columns: 1fr 1fr; }
  .k-footer-grid > .k-footer-col:nth-child(4){ grid-column: 1 / -1; }
  .k-nav{ display:none; }
  .k-header-inner{ height: 56px; }
  .k-search-input input{ font-size: 16px; } /* против зума на iOS */
  .k-search-city{ min-width: 140px; max-width: 160px; }
}
@media (max-width: 760px){
  .k-search-city{ display:none; } /* на узких экранах прячем — остаётся только поиск+селект */
}

/* Большие телефоны */
@media (max-width: 680px){
  .k-feed{ grid-template-columns: 1fr; }
  .k-cats{ grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .k-cat-tile{ padding: 14px 6px 12px; min-height: 96px; }
  .k-cat-tile-ic{ width: 36px; height: 36px; font-size: 14px; margin-bottom: 8px; }
  .k-cat-tile-name{ font-size: 12px; }
  .k-cat-tile-cnt{ font-size: 11px; }
  .k-hero{ padding: 20px 16px; border-radius: 14px; }
  .k-hero h1{ font-size: 20px; margin-bottom: 8px; }
  .k-hero-sub{ margin-bottom: 18px; }
  .k-search{ flex-wrap: wrap; }
  .k-search-input{ width: 100%; }
  .k-search-sect{ flex:1; border-left:0; border-top:1px solid var(--c-border); }
  .k-search-btn{ flex:1; border-top:1px solid var(--c-border); padding: 0 16px; }
  .k-filters{ flex-wrap: wrap; }
  .k-filter{ flex:1 1 calc(50% - 5px); justify-content: space-between; }
  .k-cta{ padding: 18px 16px; border-radius: 14px; }
  .k-cta h2{ font-size: 19px; }
  .k-cta-sub{ font-size: 13px; }
  .k-cta-actions{ flex-direction: column; }
  .k-cta-actions .k-btn{ width: 100%; }
  .k-cta-feats{ grid-template-columns: 1fr; gap: 10px; }
  .k-tabs{ padding: 4px; }
  .k-tab{ padding: 8px 12px; font-size: 12px; }
  .k-card{ padding: 14px; min-height: 0; }
  .k-card-title{ font-size: 15px; }
  .k-strip-grid{ grid-template-columns: 1fr 1fr; gap: 16px; }
  .k-strip{ padding: 22px 0; }
  .k-strip-ic{ width: 40px; height: 40px; font-size: 16px; }
  .k-strip-num{ font-size: 18px; }
  .k-footer{ padding: 36px 0 20px; }
  .k-footer-grid{ grid-template-columns: 1fr; gap: 24px; margin-bottom: 24px; }
  .k-footer-grid > .k-footer-col:nth-child(4){ grid-column: auto; }
  .k-footer-bot{ flex-direction: column; text-align: center; gap: 8px; }
  .k-logo-tagline{ display:none; }
  .k-logo-name{ font-size: 15px; }
  .k-header-right .k-btn{ height: 36px; padding: 0 14px; font-size: 12.5px; }
}

/* Маленькие телефоны */
@media (max-width: 420px){
  .k-cats{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-hero h1{ font-size: 18px; }
  .k-filter{ flex: 1 1 100%; }
  .k-strip-grid{ grid-template-columns: 1fr 1fr; gap: 10px; }
  .k-header-right .k-btn--ghost{ display:none; }
}

/* ============================================================
   13. UTIL
   ============================================================ */
.k-hidden{ display:none !important; }
.k-loader{
  display:flex; align-items:center; justify-content:center;
  padding: 24px;
  color: var(--c-ink-3);
  font-size: 13px;
}
.k-loader::before{
  content:'';
  width: 18px; height: 18px;
  border: 2px solid var(--c-border-2);
  border-top-color: var(--c-brand);
  border-radius: 50%;
  margin-right: 10px;
  animation: kspin .8s linear infinite;
}
@keyframes kspin{ to{ transform: rotate(360deg); } }

.k-empty{
  padding: 40px 20px;
  text-align: center;
  color: var(--c-ink-3);
  font-size: 13px;
}

/* Скрытое для бесконечного скролла */
#kSentinel{ height: 1px; }

/* ============================================================
   14. ПЕРЕОПРЕДЕЛЕНИЯ для модалок старых шаблонов (header/footer)
   ============================================================ */
.pnav, .pcol-l, .pcol-r, .pcol-scroll, .pfooter-strip, .pfooter-main, .pfooter-bot{ /* старые шаблоны полностью отключаем */ }

/* Если на странице вдруг загрузится стая иконка/виджет старого Bell — */
#portalBellBtn{
  background: transparent;
  border: 1px solid var(--c-border-2);
  border-radius: 8px;
  width: 38px; height: 38px;
  color: var(--c-ink-2);
  cursor: pointer;
  position: relative;
}
#portalBellBtn:hover{ color: var(--c-brand); border-color: var(--c-brand); }
#portalBellBtn .bell-badge{
  position: absolute;
  top: -5px; right: -5px;
  background: var(--c-danger);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  min-width: 16px;
  height: 16px;
  border-radius: 8px;
  padding: 0 4px;
  display:flex; align-items:center; justify-content:center;
}

/* ============================================================
   MSG MODAL — модалка «Написать сообщение» (favorites-messages.js)
   Перенесено со старой главной чтобы модалка не висела развёрнутой в подвале.
   ============================================================ */
.msg-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9999;align-items:center;justify-content:center}
.msg-modal-overlay.open{display:flex}
.msg-modal{background:#fff;border-radius:16px;width:100%;max-width:520px;box-shadow:0 20px 60px rgba(0,0,0,.2);overflow:hidden;animation:msgSlideIn .25s ease}
@keyframes msgSlideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.msg-modal-hd{padding:20px 24px;background:linear-gradient(135deg,#0284c7,#0369a1);color:#fff;display:flex;align-items:center;justify-content:space-between}
.msg-modal-hd h3{margin:0;font-size:18px;font-weight:700}
.msg-modal-close{width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.msg-modal-close:hover{background:rgba(255,255,255,.25)}
.msg-modal-body{padding:24px}
.msg-modal-to{font-size:13px;color:#64748b;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.msg-modal-to strong{color:#0f172a}
.msg-modal textarea{width:100%;min-height:120px;border:1px solid #dee4ed;border-radius:10px;padding:12px 16px;font-size:14px;font-family:Inter,sans-serif;resize:vertical;outline:none;transition:.2s}
.msg-modal textarea:focus{border-color:#0284c7;box-shadow:0 0 0 3px rgba(2,132,199,.1)}
.msg-modal-chars{font-size:12px;color:#94a3b8;text-align:right;margin-top:4px}
.msg-modal-ft{padding:16px 24px;background:#f8fafc;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid #e2e8f0}
.msg-modal-ft .btn-cancel{padding:10px 20px;border:1px solid #dee4ed;border-radius:8px;background:#fff;color:#475569;font-weight:600;cursor:pointer}
.msg-modal-ft .btn-send{padding:10px 24px;border:none;border-radius:8px;background:#0284c7;color:#fff;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px}
.msg-modal-ft .btn-send:hover{background:#0369a1}
.msg-modal-ft .btn-send:disabled{opacity:.5;cursor:not-allowed}

/* ============================================================
   13. БУРГЕР + DRAWER (мобильное меню)
   ============================================================ */

.k-burger{
  display: none;
  width: 40px; height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 10px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  transition: background .15s;
}
.k-burger:hover, .k-burger:focus-visible{ background: var(--c-bg-2, #f3f5f9); outline:none; }
.k-burger span{
  display:block;
  width: 22px; height: 2px;
  background: var(--c-ink, #0f172a);
  border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease;
  transform-origin: center;
}
.k-burger.is-open span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.k-burger.is-open span:nth-child(2){ opacity: 0; }
.k-burger.is-open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

.k-drawer-overlay{
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, .5);
  z-index: 998;
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
}
.k-drawer-overlay.open{ opacity:1; pointer-events:auto; }

.k-drawer{
  position: fixed;
  top: 0; left: 0;
  width: min(86vw, 340px);
  height: 100dvh;
  background: var(--c-panel, #fff);
  z-index: 999;
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.k-drawer.open{ transform: translateX(0); }

.k-drawer-hd{
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px 18px;
  border-bottom: 1px solid var(--c-border, #e3e7ee);
  position: sticky; top: 0;
  background: var(--c-panel, #fff);
  z-index: 1;
}
.k-drawer-logo{
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
  color: var(--c-ink, #0f172a);
  font-weight: 700;
  font-size: 16px;
}
.k-drawer-close{
  width: 36px; height: 36px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  color: var(--c-ink-2, #475569);
  font-size: 18px;
  display:flex; align-items:center; justify-content:center;
  transition: background .15s;
}
.k-drawer-close:hover{ background: var(--c-bg-2, #f3f5f9); }

.k-drawer-nav{
  display: flex;
  flex-direction: column;
  padding: 8px 8px;
}
.k-drawer-nav a{
  display:flex; align-items:center;
  gap: 12px;
  padding: 12px 14px;
  font-size: 15px;
  font-weight: 500;
  color: var(--c-ink, #0f172a);
  text-decoration: none;
  border-radius: 10px;
  transition: background .12s, color .12s;
  min-height: 44px;
}
.k-drawer-nav a i{
  width: 22px; text-align:center;
  font-size: 15px;
  color: var(--c-brand, #0d6efd);
  flex-shrink: 0;
}
.k-drawer-nav a:hover, .k-drawer-nav a:focus-visible{
  background: var(--c-bg-2, #f3f5f9);
  outline: none;
}
.k-drawer-nav a:active{ background: var(--c-bg-3, #e8ecf3); }
.k-drawer-nav--sec a{ font-size: 14px; font-weight: 500; }
.k-drawer-nav--sec a i{ color: var(--c-ink-3, #94a3b8); }

.k-drawer-sep{
  height: 1px;
  background: var(--c-border, #e3e7ee);
  margin: 6px 14px;
}

.k-drawer-ft{
  margin-top: auto;
  padding: 14px 16px 24px;
  border-top: 1px solid var(--c-border, #e3e7ee);
  display:flex; flex-direction:column; gap: 10px;
}
.k-drawer-contact{
  display:flex; align-items:center;
  gap: 10px;
  font-size: 13px;
  color: var(--c-ink-2, #475569);
  text-decoration: none;
  padding: 8px 10px;
  border-radius: 8px;
  word-break: break-all;
  min-height: 40px;
}
.k-drawer-contact i{ color: var(--c-brand, #0d6efd); width: 18px; text-align:center; }
.k-drawer-contact:hover{ background: var(--c-bg-2, #f3f5f9); }
.k-drawer-cta{
  width: 100%;
  justify-content: center;
  padding: 12px 14px !important;
  font-size: 14px !important;
  min-height: 44px;
}

/* ============================================================
   14. УЛУЧШЕННАЯ МОБИЛЬНАЯ АДАПТАЦИЯ
   ============================================================ */

img, video, iframe, svg{ max-width: 100%; height: auto; }
.k-container{ overflow-x: clip; }

/* ─── Планшет landscape ≤1100px ─── */
@media (max-width: 1100px){
  .k-logo-tagline{ display: none; }
}

/* ─── Планшет ≤960px (бургер появляется именно тут) ─── */
@media (max-width: 960px){
  .k-burger{ display: inline-flex; }
  .k-nav{ display: none !important; }
  .k-header-inner{ height: 60px; gap: 12px; }
  .k-container{ padding: 0 14px; }

  .k-mail-link, .k-help-link{ display: none; }

  .k-logo-mark{ width: 36px; height: 36px; font-size: 13px; }
  .k-logo-name{ font-size: 15px; }

  .k-header-right{ gap: 6px; margin-left: auto; }
  .k-header-right .k-btn{ padding: 8px 12px; font-size: 13px; }
  .k-header-right .k-btn--ghost{ display: none; }

  .k-col-l, .k-col-r{ display: none; }
  .k-grid{ grid-template-columns: 1fr; gap: 14px; }

  .k-feed{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 12px; }
  .k-cta-feats{ grid-template-columns: 1fr !important; }

  .k-hero{ padding: 18px 16px; }
  .k-hero h1{ font-size: 22px; line-height: 1.25; }
  .k-hero-sub{ font-size: 13.5px; }

  .k-search{ flex-wrap: wrap; gap: 8px; }
  .k-search-input{ flex: 1 1 100%; min-width: 0; }
  .k-search-input input{ font-size: 16px; }
  .k-search-city{ flex: 1 1 100%; max-width: none; }
  .k-search-select{ flex: 1 1 calc(60% - 4px); min-width: 0; }
  .k-search-btn{ flex: 1 1 calc(40% - 4px); justify-content:center; }

  .k-filters{ flex-wrap: wrap; gap: 8px; }
  .k-filter{ flex: 1 1 calc(50% - 4px); min-width: 0; }

  .k-cats{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 8px; }
  .k-cat-tile{ padding: 12px 8px; min-height: 86px; }
  .k-cat-tile .k-cat-name{ font-size: 12px; }
  .k-cat-tile .k-cat-ic{ font-size: 20px; }

  .k-strip{ padding: 24px 0; }
  .k-strip-grid{ grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 12px; }

  .k-tabs{
    overflow-x: auto;
    flex-wrap: nowrap !important;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    margin: 0 -14px;
    padding: 0 14px 6px;
  }
  .k-tabs::-webkit-scrollbar{ height: 4px; }
  .k-tab{ flex: 0 0 auto; white-space: nowrap; }

  .k-footer-grid{ grid-template-columns: 1fr 1fr !important; gap: 24px !important; }
  .k-footer-grid > *:nth-child(n+5){ grid-column: 1 / -1; }
  .k-footer-bot{ flex-direction: column; gap: 14px; text-align:center; }

  .k-bell-dd{
    width: calc(100vw - 28px) !important;
    max-width: 360px;
    right: -8px !important;
    left: auto;
  }

  .k-cta-top{ flex-direction: column; align-items: stretch; gap: 14px; }
  .k-cta-top .k-btn{ width: 100%; justify-content:center; }
}

/* ─── Большой телефон ≤640px ─── */
@media (max-width: 640px){
  body{ font-size: 15px; }

  .k-container{ padding: 0 12px; }
  .k-header-inner{ height: 56px; gap: 10px; }

  .k-feed{ grid-template-columns: 1fr !important; gap: 10px; }

  .k-strip-grid{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 10px; }
  .k-strip-ic{ width: 40px; height: 40px; font-size: 18px; }
  .k-strip-num{ font-size: 18px; }
  .k-strip-lbl{ font-size: 11px; }

  .k-cats{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }

  .k-hero h1{ font-size: 20px; }
  .k-hero-sub{ font-size: 13px; }
  .k-hero{ padding: 16px 14px; }

  .k-card{ padding: 12px !important; min-height: 0 !important; }
  .k-card-title{ font-size: 15px; line-height: 1.3; }
  .k-card-desc{ font-size: 13px; }

  .k-filter{ flex: 1 1 100%; }

  .k-footer-grid{ grid-template-columns: 1fr !important; gap: 20px !important; }

  .k-search-select{ flex: 1 1 100%; }
  .k-search-btn{ flex: 1 1 100%; }

  .k-logo-name{ font-size: 14px; }

  .k-header-right .k-btn{ padding: 7px 11px; font-size: 12.5px; }
  .k-header-right .k-btn i{ font-size: 12px; }

  .k-cta h2{ font-size: 18px !important; line-height: 1.25; }
  .k-cta p{ font-size: 13.5px; }

  .k-bell{ width: 38px; height: 38px; }
}

/* ─── Малый телефон ≤420px ─── */
@media (max-width: 420px){
  .k-container{ padding: 0 10px; }
  .k-header-inner{ gap: 8px; }
  .k-logo-text{ display: none; }
  .k-strip-grid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .k-hero h1{ font-size: 18px; }
  .k-cats{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 6px; }
  .k-cat-tile{ padding: 10px 6px; min-height: 78px; }
  .k-bell-dd{ width: calc(100vw - 20px) !important; right: -4px !important; }
  .k-header-right .k-btn{ font-size: 12px; }
}

/* ─── Очень малый ≤360px (старые айфоны) ─── */
@media (max-width: 360px){
  .k-header-right .k-btn{ padding: 7px 9px; }
}

/* ============================================================
   15. ТОЧЕЧНЫЕ ФИКСЫ МОБИЛЬНОГО (постфидбэк)
   ============================================================ */

/* === 1) КОЛОКОЛЬЧИК: dropdown — fixed по центру под шапкой === */
@media (max-width: 960px){
  .k-bell-wrap{ position: static; }      /* выходим из контекста позиционирования */
  .k-bell-dd{
    position: fixed !important;
    top: 64px;                            /* сразу под шапкой 60px + 4px */
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 80px);
    overflow-y: auto;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0,0,0,.22);
  }
  /* Внутри dropdown элементы сами растягиваются — гарантируем перенос длинного текста */
  .k-bell-dd-item{ flex-wrap: nowrap; }
  .k-bell-dd-text, .k-bell-dd-name{
    word-break: break-word;
    overflow-wrap: anywhere;
  }
}
@media (max-width: 640px){
  .k-bell-dd{ top: 60px; }                /* шапка стала 56px */
}

/* === 2) БЛОК «Готовы строить B2B-связи?» — аккуратные кнопки на мобильном === */
@media (max-width: 960px){
  .k-cta{ padding: 22px 18px !important; border-radius: 16px; }
  .k-cta-top{
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
    text-align: center;
  }
  .k-cta-text{ text-align: center; }
  .k-cta h2{
    font-size: 22px !important;
    line-height: 1.25 !important;
    margin: 0 0 6px;
  }
  .k-cta-sub{ font-size: 14px !important; }
  /* Кнопки — крупные, на всю ширину, по центру */
  .k-cta-actions{
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 10px !important;
  }
  .k-cta-actions .k-btn{
    width: 100% !important;
    justify-content: center;
    padding: 14px 18px !important;
    font-size: 15px !important;
    min-height: 48px;
    text-align: center;
  }
  /* Фичи — 2 в ряд, иконка + текст компактнее */
  .k-cta-feats{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .k-cta-feat{ font-size: 12px; }
  .k-cta-feat-ic{ width: 28px; height: 28px; font-size: 11px; }
}
@media (max-width: 480px){
  .k-cta h2{ font-size: 19px !important; }
  .k-cta-feats{ grid-template-columns: 1fr !important; gap: 8px !important; }
  .k-cta-feat{ font-size: 12.5px; }
  /* Убираем <br> в подписях, чтобы выглядело компактнее */
  .k-cta-feat-tx br{ display: none; }
  .k-cta-feat-tx{ line-height: 1.35; }
}

/* === 3) МЕНЮ ТАБОВ — горизонтальный скролл, не вылазит за экран === */
@media (max-width: 960px){
  /* Сбрасываем потенциальное -margin и принудительно ставим overflow внутри контейнера */
  .k-tabs{
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    margin: 0 0 14px !important;
    padding: 5px !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }
  .k-tabs::-webkit-scrollbar{ height: 3px; }
  .k-tabs::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.18); border-radius: 2px; }
  .k-tab{
    flex: 0 0 auto !important;
    white-space: nowrap;
    scroll-snap-align: start;
    padding: 8px 14px !important;
    font-size: 13px !important;
  }
  /* Лёгкий «градиент-намёк» что есть скролл справа */
  .k-tabs{
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 24px), transparent 100%);
            mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 24px), transparent 100%);
  }
}

/* === 4) ФУТЕР — компактный, 2 колонки даже на узких ширинах === */
@media (max-width: 960px){
  .k-footer{ padding: 32px 0 18px !important; }
  .k-footer-grid{
    grid-template-columns: 1fr 1fr !important;
    gap: 22px 18px !important;
    margin-bottom: 22px !important;
  }
  /* Первая (брендовая) колонка — на всю ширину сверху */
  .k-footer-brand{ grid-column: 1 / -1; }
  .k-footer-desc{ font-size: 12px; line-height: 1.45; }
  /* Остальные «n+2» — двумя колонками */
  .k-footer-grid > *:nth-child(n+2){ grid-column: auto !important; }
  /* Заголовки и ссылки — уменьшаем */
  .k-footer-col h4{ font-size: 13px; margin-bottom: 10px; }
  .k-footer-col .k-footer-h-mt{ margin-top: 14px; }
  .k-footer-col ul{ gap: 6px; }
  .k-footer-col a{ font-size: 12.5px; }
  .k-footer-col a i{ width: 12px; font-size: 10px; }
  /* Контакты — тот же мелкий шрифт */
  .k-footer-contact{ font-size: 12.5px; gap: 8px; }
  .k-footer-contact-it{ gap: 8px; word-break: break-all; }
  /* Соцсети — меньше, плотнее */
  .k-footer-socials{ gap: 10px; margin-top: 10px; }
  .k-footer-soc{ width: 40px; height: 40px; }
  .k-footer-soc img{ width: 22px; height: 22px; }
  /* Низ футера — копирайт по центру */
  .k-footer-bot{
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding-top: 16px;
    font-size: 11.5px;
  }
}
@media (max-width: 640px){
  .k-footer{ padding: 26px 0 16px !important; }
  .k-footer-grid{ gap: 18px 14px !important; margin-bottom: 18px !important; }
  .k-footer-col h4{ font-size: 12.5px; }
  .k-footer-col a{ font-size: 12px; }
  .k-footer-col a i{ display: none; }    /* убираем декоративные иконки в ссылках для экономии места */
  .k-footer-soc{ width: 36px; height: 36px; }
  .k-footer-soc img{ width: 20px; height: 20px; }
}
@media (max-width: 380px){
  /* На совсем узких — оставляем 2 колонки, ещё компактнее */
  .k-footer-grid{ gap: 14px 10px !important; }
  .k-footer-col a{ font-size: 11.5px; line-height: 1.35; }
}