/* ═══════════════════════════════════════════════════════════════
   PORTAL 3.0  |  B2B КПшка.ру
   Архитектура: Top Navbar + 3 колонки (левая/центр/правая)
   ═══════════════════════════════════════════════════════════════ */

/* ─── TOKENS ─────────────────────────────────────────────────── */
:root {
  --nb:    #0f1623;        /* navbar bg */
  --nb-h:  rgba(255,255,255,.07); /* navbar hover */
  --nb-t:  #94a3b8;        /* navbar text */
  --nb-tw: #f1f5f9;        /* navbar text white */

  --page:  #eef2f7;        /* page background */
  --card:  #ffffff;        /* card/panel bg */
  --border:#dee4ed;        /* border */
  --bord2: #f0f4f8;        /* subtle border */

  --txt:   #0f172a;        /* main text */
  --txt2:  #4b5978;        /* secondary text */
  --txt3:  #8b9ab3;        /* muted text */

  --sky:   #0284c7;        /* primary blue */
  --sky-h: #0369a1;
  --sky-l: #e0f2fe;
  --sky-ll:#f0f9ff;

  --em:    #059669;        /* emerald */
  --am:    #d97706;        /* amber */
  --rose:  #e11d48;        /* rose */
  --vio:   #7c3aed;        /* violet */
  --ind:   #4338ca;        /* indigo */
  --teal:  #0891b2;        /* teal */

  --lw: 248px;             /* left panel width */
  --rw: 268px;             /* right panel width */
  --nb-h-px: 52px;         /* navbar height */

  --r1: 12px;
  --r2: 8px;
  --r3: 5px;

  --s1: 0 1px 3px rgba(15,22,36,.08);
  --s2: 0 4px 14px rgba(15,22,36,.1);
  --s3: 0 12px 40px rgba(15,22,36,.15);

  --t: .14s ease;
}

/* ─── RESET ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { height: 100%; }
body {
  font-family: 'Inter', 'Segoe UI', -apple-system, system-ui, sans-serif;
  background: var(--page);
  color: var(--txt);
  font-size: 13px;
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
img { display: block; }
button { cursor: pointer; border: none; background: none; font: inherit; }
input, select { font: inherit; }
ul { list-style: none; }


/* ═══════════════════════════════════════════════════════════════
   TOP NAVBAR — горизонтальная шапка (fixed)
   ═══════════════════════════════════════════════════════════════ */
.pnav {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--nb-h-px);
  background: var(--nb);
  display: flex; align-items: center;
  z-index: 500;
  box-shadow: 0 1px 0 rgba(255,255,255,.06), 0 2px 12px rgba(0,0,0,.25);
}
.pnav-inner {
  width: 100%; max-width: 1680px; margin: 0 auto;
  display: flex; align-items: center;
  padding: 0 12px; gap: 0;
}

/* Лого */
.pnav-logo {
  display: flex; align-items: center; gap: 9px;
  padding: 0 14px 0 0; margin-right: 4px;
  border-right: 1px solid rgba(255,255,255,.1);
  flex-shrink: 0; text-decoration: none;
}
.pnav-logo-mark {
  width: 38px; height: 38px; border-radius: 9px;
  background: var(--sky); display: flex; align-items: center;
  justify-content: center; font-weight: 900; font-size: 15px;
  color: #fff; flex-shrink: 0; letter-spacing: -.3px;
  box-shadow: 0 1px 8px rgba(2,132,199,.45);
}
.pnav-logo-text {}
.pnav-logo-name { font-weight: 700; font-size: 22px; color: #f1f5f9; line-height: 1; }
.pnav-logo-sub  { font-size: 13px; color: rgba(255,255,255,.7); margin-top: 2px; }

/* Кнопки навбара */
.pnav-btn-help {
  font-size: 11px; color: #94a3b8; white-space: nowrap;
  padding: 4px 10px; border: 1px solid rgba(255,255,255,.12);
  border-radius: 5px; text-decoration: none;
  display: inline-flex; align-items: center; gap: 5px;
  transition: background .15s, color .15s, border-color .15s;
}
.pnav-btn-help:hover { background: rgba(255,255,255,.1); color: #e2e8f0; border-color: rgba(255,255,255,.25); }
.pnav-btn-help i { font-size: 10px; }

.pnav-btn-appeal {
  font-size: 11px; background: var(--sky); color: #fff; font-weight: 600;
  white-space: nowrap; padding: 4px 11px; border-radius: 5px;
  text-decoration: none; border: 1px solid transparent;
  display: inline-flex; align-items: center; gap: 5px;
  transition: background .15s, box-shadow .15s;
}
.pnav-btn-appeal:hover { background: #0369a1; box-shadow: 0 2px 8px rgba(2,132,199,.35); }
.pnav-btn-appeal i { font-size: 10px; }

/* Основная навигация */
.pnav-menu {
  display: flex; align-items: center; gap: 0;
  margin-left: 8px; flex: 1;
}
.pnav-lnk {
  display: flex; align-items: center; gap: 5px;
  padding: 0 11px; height: var(--nb-h-px);
  font-size: 12.5px; font-weight: 500; color: var(--nb-t);
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color var(--t), border-color var(--t), background var(--t);
}
.pnav-lnk:hover { color: var(--nb-tw); background: var(--nb-h); }
.pnav-lnk.on { color: #7dd3fc; border-bottom-color: #7dd3fc; }
.pnav-lnk i { font-size: 11px; }
.pnav-lnk-cnt {
  background: rgba(255,255,255,.1); color: #94a3b8;
  font-size: 9px; font-weight: 700; padding: 1px 5px;
  border-radius: 8px; line-height: 1.5;
}
.pnav-lnk.on .pnav-lnk-cnt { background: rgba(125,211,252,.2); color: #7dd3fc; }

/* Поиск в шапке */
.pnav-search {
  display: flex; align-items: center; gap: 0;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px; overflow: hidden; height: 32px;
  transition: border-color var(--t), box-shadow var(--t);
  flex-shrink: 0; min-width: 220px;
}
.pnav-search:focus-within {
  border-color: rgba(125,211,252,.4);
  background: rgba(255,255,255,.12);
  box-shadow: 0 0 0 3px rgba(2,132,199,.2);
}
.pnav-search i { padding: 0 8px; color: #64748b; font-size: 11px; flex-shrink: 0; }
.pnav-s-in {
  flex: 1; border: none; background: transparent;
  font-size: 12.5px; color: #f1f5f9; outline: none;
  padding: 0 8px 0 0; min-width: 0;
}
.pnav-s-in::placeholder { color: #64748b; }
.pnav-s-go {
  padding: 0 12px; height: 100%;
  background: var(--sky); color: #fff;
  font-size: 11px; font-weight: 600;
  transition: background var(--t); flex-shrink: 0;
}
.pnav-s-go:hover { background: var(--sky-h); }

/* Контактная полоса в навбаре */
.pnav-info-lnk:hover { color: #e2e8f0 !important; }

/* Правая часть шапки — авторизация */
.pnav-right { display: flex; align-items: center; gap: 8px; margin-left: 12px; flex-shrink: 0; }
.pnav-btn {
  padding: 0 14px; height: 30px; border-radius: 6px;
  font-size: 12px; font-weight: 600; display: flex; align-items: center; gap: 5px;
  white-space: nowrap; transition: var(--t);
}
.pnav-btn-out { border: 1px solid rgba(255,255,255,.2); color: #cbd5e1; }
.pnav-btn-out:hover { border-color: rgba(255,255,255,.4); color: #f1f5f9; background: rgba(255,255,255,.07); }
.pnav-btn-fill { background: var(--sky); color: #fff; }
.pnav-btn-fill:hover { background: var(--sky-h); color: #fff; }
.pnav-user { display: flex; align-items: center; gap: 7px; color: var(--nb-t); cursor: pointer; }
.pnav-user-av {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--sky); display: flex; align-items: center;
  justify-content: center; font-size: 10px; font-weight: 700;
  color: #fff; flex-shrink: 0; border: 2px solid rgba(255,255,255,.15);
}
.pnav-user-name { font-size: 12px; color: var(--nb-tw); }
.pnav-user:hover .pnav-user-name { color: #fff; }


/* ═══════════════════════════════════════════════════════════════
   BODY LAYOUT — 3 колонки под навбаром
   ═══════════════════════════════════════════════════════════════ */
.portal-body { padding-top: var(--nb-h-px); }
.pcols {
  display: flex; align-items: flex-start;
  max-width: 1680px; margin: 0 auto;
  padding: 14px 12px;
  gap: 12px;
  min-height: calc(100vh - var(--nb-h-px));
}

/* ─── ЛЕВАЯ ПАНЕЛЬ ────────────────────────────────────────────── */
.pcol-l {
  width: var(--lw); flex-shrink: 0;
  position: sticky;
  align-self: flex-start;
}

/* ─── ЦЕНТРАЛЬНАЯ КОЛОНКА ─────────────────────────────────────── */
.pcol-c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }

/* ─── ПРАВАЯ КОЛОНКА ──────────────────────────────────────────── */
.pcol-r {
  width: var(--rw); flex-shrink: 0;
  position: sticky;
  align-self: flex-start;
}

/* ─── ОБЁРТКА КОНТЕНТА САЙДБАРА (без overflow, без обрезки) ──── */
.pcol-scroll {
  display: flex; flex-direction: column; gap: 10px;
  padding: 0 2px 10px 0;
}


/* ═══════════════════════════════════════════════════════════════
   PANEL — базовый блок карточек/виджетов
   ═══════════════════════════════════════════════════════════════ */
.panel {
  background: var(--card); border-radius: var(--r1);
  border: 1px solid var(--border);
  box-shadow: var(--s1); overflow: hidden;
}
.panel-hd {
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--bord2);
  display: flex; align-items: center; justify-content: space-between;
}
.panel-ttl { font-weight: 700; font-size: 12px; color: var(--txt); text-transform: uppercase; letter-spacing: .05em; }
.panel-all { font-size: 11px; color: var(--sky); font-weight: 600; }
.panel-all:hover { color: var(--sky-h); }
.panel-bd { padding: 12px 14px; }


/* ═══════════════════════════════════════════════════════════════
   ЛЕВАЯ ПАНЕЛЬ — содержимое
   ═══════════════════════════════════════════════════════════════ */

/* Блок авторизации */
/* ── Авторизован ── */
.l-auth-panel { padding: 14px; }
.l-auth-user  { display: flex; align-items: center; gap: 10px; }
.l-auth-av {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--sky), var(--sky-h));
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px; color: #fff;
  overflow: hidden;
}
.l-auth-av-img {
  background: #f1f5f9;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.l-auth-av img {
  width: 100%; height: 100%; object-fit: contain;
}
.l-auth-info { flex: 1; min-width: 0; }
.l-auth-nm   { font-weight: 600; font-size: 13px; color: var(--txt1);
               overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-auth-cab  { font-size: 11px; color: var(--sky); display: block; margin-top: 2px; }
.l-auth-out  { color: var(--txt3); font-size: 14px; transition: color var(--t); flex-shrink: 0; }
.l-auth-out:hover { color: var(--rose); }

/* ── Гость ── */
.l-auth-guest       { display: flex; flex-direction: column; gap: 10px; padding-bottom: 2px; }
.l-auth-guest-ttl   { font-size: 13px; font-weight: 700; color: var(--txt1);
                      display: flex; align-items: center; gap: 7px; }
.l-auth-guest-ttl i { font-size: 16px; color: var(--sky); }
.l-auth-guest-sub   { font-size: 11px; color: var(--txt3); margin-top: -4px; }
.l-abtn {
  display: block; text-align: center; padding: 8px 10px;
  border-radius: var(--r2); font-size: 12px; font-weight: 600;
  transition: var(--t);
}
.l-abtn-out { border: 1.5px solid var(--border); color: var(--txt2); }
.l-abtn-out:hover { border-color: var(--sky); color: var(--sky); }
.l-abtn-sky { background: var(--sky); color: #fff; }
.l-abtn-sky:hover { background: var(--sky-h); color: #fff; }

/* ── Добавить / Моя компания ── */
.l-add-co {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; text-decoration: none;
  color: var(--txt1); font-size: 12.5px; font-weight: 600;
  transition: background var(--t), color var(--t);
}
.l-add-co:hover { background: #f0f9ff; color: var(--sky); }
.l-add-co i:first-child {
  width: 28px; height: 28px; flex-shrink: 0; border-radius: 7px;
  background: #eff6ff; color: var(--sky); font-size: 12px;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--t);
}
.l-add-co:hover i:first-child { background: var(--sky); color: #fff; }
.l-add-co span { flex: 1; }
.l-add-co-arr  { font-size: 10px; color: var(--txt3); }

/* Навигация левой панели */
.l-nav { padding: 6px 8px; }
.l-nav-sec { padding: 8px 8px 3px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--txt3); }
.l-nav-lnk {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 9px; border-radius: var(--r3);
  color: var(--txt2); font-size: 12.5px; font-weight: 500;
  transition: background var(--t), color var(--t);
}
.l-nav-lnk:hover { background: var(--sky-ll); color: var(--sky); }
.l-nav-lnk.on { background: var(--sky-l); color: var(--sky-h); font-weight: 600; }
.l-nav-ic { width: 17px; text-align: center; font-size: 12px; flex-shrink: 0; }
.l-nav-cnt {
  margin-left: auto; font-size: 9.5px; font-weight: 700;
  background: var(--bord2); color: var(--txt3);
  padding: 1px 6px; border-radius: 10px;
}
.l-nav-lnk.on .l-nav-cnt { background: var(--sky-l); color: var(--sky); }

/* Статистика левой панели */
.l-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 12px 14px; }
.l-stat {
  background: var(--bord2); border-radius: var(--r2);
  padding: 9px 10px; text-align: center;
}
.l-stat-n { font-weight: 800; font-size: 18px; line-height: 1; margin-bottom: 3px; }
.l-stat-l { font-size: 9px; color: var(--txt3); line-height: 1.3; }
.l-live { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #34d399; vertical-align: middle; margin-right: 2px; animation: pulse 2s ease infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)} 70%{box-shadow:0 0 0 8px rgba(52,211,153,0)} 100%{box-shadow:0 0 0 0 rgba(52,211,153,0)} }

/* Контакты в левой панели */
.l-contact { padding: 10px 14px 14px; }
.l-contact-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; font-size: 11.5px; }
.l-contact-row i { color: var(--txt3); font-size: 10px; margin-top: 2px; width: 12px; flex-shrink: 0; }
.l-contact-row a { color: var(--txt2); }
.l-contact-row a:hover { color: var(--sky); }
.l-contact-row span { color: var(--txt2); line-height: 1.4; }


/* ═══════════════════════════════════════════════════════════════
   ЦЕНТР — поиск, вкладки, лента
   ═══════════════════════════════════════════════════════════════ */

/* Строка поиска в центре */
.c-searchbox {
  background: var(--card); border-radius: var(--r1);
  border: 2px solid var(--sky); 
  box-shadow: 0 0 0 4px rgba(2,132,199,.08), 0 4px 12px rgba(2,132,199,.15);
  padding: 14px 16px;
  transition: all 0.3s ease;
  animation: pulseGlow 3s ease-in-out infinite;
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 4px rgba(2,132,199,.08), 0 4px 12px rgba(2,132,199,.15); }
  50% { box-shadow: 0 0 0 6px rgba(2,132,199,.12), 0 6px 20px rgba(2,132,199,.25); }
}
.c-searchbox:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 0 4px rgba(2,132,199,.12), 0 8px 24px rgba(2,132,199,.25);
}
.c-sb-form {
  display: flex; align-items: stretch;
  border: 2px solid var(--sky);
  border-radius: 12px; overflow: hidden;
  background: var(--page);
  transition: all 0.25s ease;
  margin-bottom: 10px;
  position: relative;
}
.c-sb-form:focus-within {
  border-color: var(--sky);
  box-shadow: 0 0 0 4px rgba(2,132,199,.15), 0 4px 12px rgba(2,132,199,.2);
  background: var(--card);
  transform: scale(1.01);
}
.c-sb-ico { padding: 0 12px; color: var(--txt3); font-size: 13px; display: flex; align-items: center; background: var(--card); border-right: 1.5px solid var(--border); flex-shrink: 0; }
.c-sb-in { flex: 1; border: none; background: transparent; padding: 11px 12px; font-size: 14px; color: var(--txt); outline: none; }
.c-sb-in::placeholder { color: var(--txt3); }
.c-sb-city { border-left: 1.5px solid var(--border); display: flex; align-items: center; position: relative; z-index: 1; }
.c-sb-city input { border: none; background: transparent; padding: 11px 13px; font-size: 13px; color: var(--txt); outline: none; width: 130px; position: relative; z-index: 1; }
.c-sb-city input::placeholder { color: var(--txt3); }
.c-sb-section { border-left: 1.5px solid var(--border); display: flex; align-items: center; flex-shrink: 0; }
.c-sb-section select { 
  border: none; background: transparent; padding: 11px 13px; 
  font-size: 13px; color: var(--txt); outline: none; cursor: pointer;
  min-width: 140px; font-weight: 500;
}
.c-sb-section select:hover { color: var(--sky); }
.c-sb-go {
  background: var(--sky); color: #fff; padding: 0 22px;
  font-size: 13.5px; font-weight: 700; flex-shrink: 0;
  transition: background var(--t);
}
.c-sb-go:hover { background: var(--sky-h); }

/* Теги быстрого поиска */
.c-sb-tags { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.c-sb-tags-lbl { font-size: 10.5px; color: var(--txt3); flex-shrink: 0; }
.c-sb-tag {
  padding: 3px 10px; border-radius: 20px;
  border: 1px solid var(--border); background: var(--card);
  font-size: 11px; color: var(--txt2); cursor: pointer;
  transition: var(--t);
}
.c-sb-tag:hover { border-color: var(--sky); color: var(--sky); background: var(--sky-ll); }

/* Вкладки контента */
.c-tabs {
  background: var(--card); border-radius: var(--r1);
  border: 1px solid var(--border); box-shadow: var(--s1);
  display: flex; align-items: center; overflow-x: auto;
  scrollbar-width: none; padding: 5px 6px; gap: 3px;
}
.c-tabs::-webkit-scrollbar { display: none; }
.c-tab {
  display: flex; align-items: center; gap: 5px;
  padding: 6px 12px; font-size: 12.5px; font-weight: 500;
  color: var(--txt2); border-radius: 8px;
  border: 1px solid transparent;
  white-space: nowrap; flex-shrink: 0; cursor: pointer;
  transition: all .18s ease; background: transparent;
  user-select: none;
}
.c-tab:hover {
  color: var(--sky); background: #eff6ff; border-color: #bfdbfe;
}
.c-tab.on {
  color: #fff; background: var(--sky); border-color: var(--sky);
  font-weight: 700; box-shadow: 0 2px 8px rgba(2,132,199,.35);
}
.c-tab i { font-size: 11px; }
.c-tab-n {
  font-size: 9px; font-weight: 700; padding: 1px 5px;
  border-radius: 10px; background: rgba(0,0,0,.07); color: inherit; opacity: .8;
}
.c-tab:hover .c-tab-n { background: rgba(2,132,199,.15); color: var(--sky); opacity: 1; }
.c-tab.on .c-tab-n  { background: rgba(255,255,255,.25); color: #fff; opacity: 1; }

/* ═══ Статс-бар ═══ */
.c-stats { display: grid; grid-template-columns: repeat(8,1fr); gap: 8px; }

.c-stat {
  display: flex; align-items: center; gap: 9px;
  padding: 10px 11px; border-radius: var(--r1);
  border: 1px solid transparent;
  text-decoration: none; color: inherit;
  transition: transform var(--t), box-shadow var(--t);
  position: relative; overflow: hidden;
}
.c-stat:hover { transform: translateY(-3px); }

.c-stat-ic {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: #fff; flex-shrink: 0;
}
.c-stat-body { flex: 1; min-width: 0; text-align: center; }
.c-stat-n {
  font-weight: 800; font-size: 20px; line-height: 1;
  letter-spacing: -.5px;
}
.c-stat-l {
  font-size: 9px; margin-top: 3px;
  line-height: 1.3; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}

/* Компании — изумруд */
.cs1 { background: linear-gradient(135deg,#f0fdf4,#dcfce7); border-color: #bbf7d0; }
.cs1 .c-stat-ic { background: linear-gradient(135deg,#059669,#047857); box-shadow: 0 4px 12px rgba(5,150,105,.3); }
.cs1 .c-stat-n  { color: #065f46; }
.cs1 .c-stat-l  { color: #4b7a62; }
.cs1:hover { box-shadow: 0 8px 24px rgba(5,150,105,.18); border-color: #6ee7b7; }

/* Процедуры — синий */
.cs2 { background: linear-gradient(135deg,#eff6ff,#dbeafe); border-color: #bfdbfe; }
.cs2 .c-stat-ic { background: linear-gradient(135deg,#0284c7,#0369a1); box-shadow: 0 4px 12px rgba(2,132,199,.3); }
.cs2 .c-stat-n  { color: #1e40af; }
.cs2 .c-stat-l  { color: #3b5fa8; }
.cs2:hover { box-shadow: 0 8px 24px rgba(2,132,199,.18); border-color: #93c5fd; }

/* Оферты — янтарь */
.cs3 { background: linear-gradient(135deg,#fffbeb,#fef3c7); border-color: #fde68a; }
.cs3 .c-stat-ic { background: linear-gradient(135deg,#d97706,#b45309); box-shadow: 0 4px 12px rgba(217,119,6,.3); }
.cs3 .c-stat-n  { color: #92400e; }
.cs3 .c-stat-l  { color: #a0611a; }
.cs3:hover { box-shadow: 0 8px 24px rgba(217,119,6,.18); border-color: #fbbf24; }

/* Тендеры — роза */
.cs4 { background: linear-gradient(135deg,#fff1f2,#ffe4e6); border-color: #fecdd3; }
.cs4 .c-stat-ic { background: linear-gradient(135deg,#e11d48,#be123c); box-shadow: 0 4px 12px rgba(225,29,72,.3); }
.cs4 .c-stat-n  { color: #9f1239; }
.cs4 .c-stat-l  { color: #b02040; }
.cs4:hover { box-shadow: 0 8px 24px rgba(225,29,72,.18); border-color: #fda4af; }

/* Вакансии — бирюза */
.cs5 { background: linear-gradient(135deg,#ecfeff,#cffafe); border-color: #a5f3fc; }
.cs5 .c-stat-ic { background: linear-gradient(135deg,#0891b2,#0e7490); box-shadow: 0 4px 12px rgba(8,145,178,.3); }
.cs5 .c-stat-n  { color: #155e75; }
.cs5 .c-stat-l  { color: #246b80; }
.cs5:hover { box-shadow: 0 8px 24px rgba(8,145,178,.18); border-color: #67e8f9; }

/* Новости — индиго */
.cs6 { background: linear-gradient(135deg,#eef2ff,#e0e7ff); border-color: #c7d2fe; }
.cs6 .c-stat-ic { background: linear-gradient(135deg,#4338ca,#3730a3); box-shadow: 0 4px 12px rgba(67,56,202,.3); }
.cs6 .c-stat-n  { color: #3730a3; }
.cs6 .c-stat-l  { color: #4338a8; }
.cs6:hover { box-shadow: 0 8px 24px rgba(67,56,202,.18); border-color: #a5b4fc; }

/* Пресс-релизы — фиолет */
.cs7 { background: linear-gradient(135deg,#faf5ff,#ede9fe); border-color: #ddd6fe; }
.cs7 .c-stat-ic { background: linear-gradient(135deg,#7c3aed,#6d28d9); box-shadow: 0 4px 12px rgba(124,58,237,.3); }
.cs7 .c-stat-n  { color: #5b21b6; }
.cs7 .c-stat-l  { color: #6b2fc2; }
.cs7:hover { box-shadow: 0 8px 24px rgba(124,58,237,.18); border-color: #c4b5fd; }

.cs8 { background: linear-gradient(135deg,#fff1f2,#ffe4e6); border-color: #fecdd3; }
.cs8 .c-stat-ic { background: linear-gradient(135deg,#e11d48,#be123c); box-shadow: 0 4px 12px rgba(225,29,72,.3); }
.cs8 .c-stat-n  { color: #9f1239; }
.cs8 .c-stat-l  { color: #be123c; }
.cs8:hover { box-shadow: 0 8px 24px rgba(225,29,72,.18); border-color: #fda4af; }

/* Promo-баннер */
.c-promo {
  background: linear-gradient(120deg, #0c2d6b 0%, #1d4ed8 55%, #2563eb 100%);
  border-radius: var(--r1); padding: 18px 22px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
  box-shadow: 0 4px 20px rgba(37,99,235,.25);
}
.c-promo-h { font-weight: 800; font-size: 16px; color: #fff; margin-bottom: 4px; }
.c-promo-s { font-size: 12px; color: rgba(255,255,255,.75); max-width: 500px; line-height: 1.5; }
.c-promo-btns { display: flex; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
.c-promo-btn {
  padding: 7px 14px; border-radius: 7px; font-size: 11.5px; font-weight: 700;
  white-space: nowrap; transition: var(--t); display: inline-flex; align-items: center; gap: 5px;
}
.c-promo-btn-w { background: #fff; color: #1d4ed8; }
.c-promo-btn-w:hover { background: #eff6ff; }
.c-promo-btn-gov { background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.c-promo-btn-gov:hover { background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #fff; }

/* Заголовок секции ленты */
.c-feed-hd {
  display: flex; align-items: center; justify-content: space-between;
}
.c-feed-ttl {
  font-weight: 700; font-size: 13.5px; color: var(--txt);
  display: flex; align-items: center; gap: 7px;
}
.c-feed-ttl-ic {
  width: 24px; height: 24px; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; flex-shrink: 0;
}
.c-feed-all { font-size: 11.5px; font-weight: 600; color: var(--sky); padding: 4px 10px; border-radius: var(--r3); border: 1px solid var(--sky-l); transition: var(--t); }
.c-feed-all:hover { background: var(--sky-l); }


/* ═══════════════════════════════════════════════════════════════
   КАРТОЧКИ — 4 колонки, КВАДРАТНЫЕ (aspect-ratio: 1/1)
   ═══════════════════════════════════════════════════════════════ */
.c-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.c-grid--co { grid-template-columns: repeat(3, 1fr); }

.gc {                               /* grid card */
  aspect-ratio: 1 / 1;             /* КВАДРАТ */
  display: flex; flex-direction: column;
  background: var(--card);
  border-radius: var(--r1);
  border: 1px solid var(--border);
  overflow: hidden;
  box-shadow: var(--s1);
  transition: transform var(--t), box-shadow var(--t);
  text-decoration: none; color: var(--txt);
}
.gc:hover { transform: translateY(-3px); box-shadow: var(--s2); border-color: #c3dafe; }

/* Картинка/обложка карточки — 60% высоты */
.gc-img {
  flex: 0 0 60%; position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.gc-img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .35s ease;
}
.gc:hover .gc-img img { transform: scale(1.06); }

/* Заглушки-градиенты */
.gc-co   { background: linear-gradient(145deg, #047857, #10b981); }
.gc-proc { background: linear-gradient(145deg, #1e3a8a, #3b82f6); }
.gc-off  { background: linear-gradient(145deg, #92400e, #f59e0b); }
.gc-tnd  { background: linear-gradient(145deg, #881337, #f43f5e); }
.gc-vac  { background: linear-gradient(145deg, #155e75, #06b6d4); }
.gc-nws  { background: linear-gradient(145deg, #312e81, #6366f1); }
.gc-prs  { background: linear-gradient(145deg, #4c1d95, #8b5cf6); }
.gc-vid  { background: linear-gradient(145deg, #701a75, #c026d3); }

/* Иконка-заглушка */
.gc-ico { font-size: 40px; color: rgba(255,255,255,.22); position: absolute; }

/* Бейдж типа */
.gc-badge {
  position: absolute; bottom: 7px; left: 7px; z-index: 2;
  font-size: 9px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .05em; padding: 2px 8px; border-radius: 4px;
  backdrop-filter: blur(8px);
}
.gb-co   { background: rgba(5,150,105,.88);   color: #fff; }
.gb-proc { background: rgba(37,99,235,.88);   color: #fff; }
.gb-off  { background: rgba(217,119,6,.88);   color: #fff; }
.gb-tnd  { background: rgba(225,29,72,.88);   color: #fff; }
.gb-vac  { background: rgba(8,145,178,.88);   color: #fff; }
.gb-nws  { background: rgba(79,70,229,.88);   color: #fff; }
.gb-prs  { background: rgba(124,58,237,.88);  color: #fff; }

/* Цена / дедлайн поверх фото */
.gc-price {
  position: absolute; top: 7px; right: 7px; z-index: 2;
  background: rgba(5,150,105,.9); color: #fff;
  font-size: 9.5px; font-weight: 700; padding: 2px 8px; border-radius: 4px;
  max-width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gc-dead {
  position: absolute; top: 7px; left: 7px; z-index: 2;
  background: rgba(220,38,38,.9); color: #fff;
  font-size: 9px; font-weight: 700; padding: 2px 7px; border-radius: 4px;
}

/* Тело карточки — 40% */
.gc-body {
  flex: 1; padding: 8px 10px 7px;
  display: flex; flex-direction: column; gap: 3px;
  min-height: 0; overflow: hidden;
}
.gc-title {
  font-weight: 700; font-size: 11.5px; line-height: 1.4; color: var(--txt);
}
.gc:hover .gc-title { color: var(--sky); }
.gc-meta {
  display: flex; align-items: center; justify-content: space-between;
  gap: 4px; flex-shrink: 0;
}
.gc-src { font-size: 10px; color: var(--txt3); flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.gc-dt    { font-size: 10px; color: var(--txt3); white-space: nowrap; flex-shrink: 0; }
.gc-views { font-size: 10px; color: var(--txt3); white-space: nowrap; flex-shrink: 0; display: flex; align-items: center; gap: 3px; }
.gc-views i { font-size: 9px; }
.gc-desc { font-size: 10.5px; color: var(--txt2); line-height: 1.5; }
.gc-meta { margin-top: auto; }
.gc-gov { color: #2563eb; margin-right: 3px; }
.gc-vrf { color: #059669; margin-right: 3px; }
.gc-tag { display: inline-block; background: #eff6ff; color: #3b82f6; font-size: 9px; padding: 1px 6px; border-radius: 4px; margin-top: 3px; margin-right: 3px; }
.gb-feat { background: #fbbf24 !important; color: #78350f !important; }
.gb-prem { background: linear-gradient(135deg,#f59e0b,#d97706) !important; color: #fff !important; }
.cof-drop { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.1); z-index: 20; max-height: 200px; overflow-y: auto; }
.cof-drop-item { padding: 8px 12px; font-size: 12px; cursor: pointer; }
.cof-drop-item:hover { background: #eff6ff; }
/* ── Featured карточка + бейдж ── */
.gc-co-feat { border-color: #fbbf24; box-shadow: 0 0 0 1px #fef3c7, var(--s1); }
.gc-co-feat:hover { border-color: #f59e0b; box-shadow: 0 6px 24px rgba(251,191,36,.2); }
.gc-co-b-feat { background: linear-gradient(135deg,#fbbf24,#f59e0b); color: #fff; }
.gc-co-req-tag { color: #4f46e5; }
.gc-co-req-tag i { color: #818cf8; }

.cof-tags-wrap { display: flex; flex-wrap: wrap; gap: 5px; }
.cof-tag-btn { padding: 3px 9px; border-radius: 5px; font-size: 11px; border: 1px solid var(--border); background: #f8fafc; color: var(--txt2); cursor: pointer; transition: var(--t); }
.cof-tag-btn small { color: var(--txt3); font-size: 10px; }
.cof-tag-btn:hover { border-color: var(--sky); color: var(--sky); }
.cof-tag-btn.on { background: var(--sky); color: #fff; border-color: var(--sky); }
.cof-tag-btn.on small { color: rgba(255,255,255,.7); }

/* Компания — своя разметка */
.gc-co-hd {
  flex: 0 0 60%; position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.gc-co-hd img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 14px; background: #fff; }
.gc-co-ini { font-weight: 900; font-size: 48px; letter-spacing: -3px; color: rgba(255,255,255,.8); }
.gc-co-bd { flex: 1; padding: 7px 10px 7px; display: flex; flex-direction: column; gap: 3px; min-height: 0; overflow: hidden; }
.gc-co-nm { font-weight: 700; font-size: 11.5px; color: var(--txt); line-height: 1.35; flex: 1; }
.gc:hover .gc-co-nm { color: var(--sky); }
.gc-co-city { font-size: 10px; color: var(--txt3); flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gc-co-tags { display: flex; gap: 3px; flex-wrap: wrap; flex-shrink: 0; }
.gc-co-tag { font-size: 8.5px; font-weight: 700; padding: 1px 5px; border-radius: 3px; }
.gct-ver { background: #d1fae5; color: #065f46; }
.gct-gov { background: #dbeafe; color: #1e40af; }
.gct-prm { background: #fef3c7; color: #92400e; }


/* ═══════════════════════════════════════════════════════════════
   INFINITE SCROLL
   ═══════════════════════════════════════════════════════════════ */
.c-grid-sentinel { height: 1px; }
.gc-loader { display: none; grid-column: 1/-1; text-align: center; padding: 20px; color: var(--txt3); font-size: 12.5px; }
.gc-loader.on { display: block; }
.gc-loader i { animation: spin .7s linear infinite; margin-right: 6px; }
@keyframes spin { to { transform: rotate(360deg); } }
.gc-done { display: none; grid-column: 1/-1; text-align: center; padding: 14px; font-size: 12px; color: var(--txt3); border-top: 1px solid var(--bord2); }
.gc-done.on { display: block; }

/* Скелетон */
@keyframes skpulse { 0%,100%{opacity:.6} 50%{opacity:1} }
.gc.sk { pointer-events: none; animation: skpulse 1.5s ease infinite; }
.gc.sk .gc-img { background: #e2eaf4 !important; }
.sk-line { background: #e2eaf4; border-radius: 4px; display: block; }


/* ═══════════════════════════════════════════════════════════════
   ПРАВАЯ КОЛОНКА — виджеты
   ═══════════════════════════════════════════════════════════════ */

/* Мини-статистика */
.r-stats { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.r-stat-row { display: flex; align-items: center; gap: 10px; }
.r-stat-ic { width: 30px; height: 30px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; }
.r-stat-n { font-weight: 800; font-size: 16px; line-height: 1; }
.r-stat-l { font-size: 10px; color: var(--txt3); margin-top: 1px; }

/* Последние новости в правой колонке */
.r-news { display: flex; flex-direction: column; }
.r-news-item { display: flex; align-items: flex-start; gap: 9px; padding: 9px 14px; border-bottom: 1px solid var(--bord2); transition: background var(--t); }
.r-news-item:last-child { border-bottom: none; }
.r-news-item:hover { background: var(--sky-ll); }
.r-news-img { width: 46px; height: 46px; border-radius: 6px; object-fit: cover; flex-shrink: 0; background: var(--bord2); }
.r-news-img-ph { width: 46px; height: 46px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.r-news-body { flex: 1; min-width: 0; }
.r-news-t { font-size: 11.5px; font-weight: 600; line-height: 1.38; color: var(--txt); }
.r-news-item:hover .r-news-t { color: var(--sky); }
.r-news-dt { font-size: 10px; color: var(--txt3); margin-top: 3px; }

/* Контактный виджет */
.r-contact { padding: 12px 14px; display: flex; flex-direction: column; gap: 7px; }
.r-c-row { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; }
.r-c-row i { color: var(--sky); font-size: 11px; margin-top: 2px; width: 14px; flex-shrink: 0; }
.r-c-row a { color: var(--txt); font-weight: 500; }
.r-c-row a:hover { color: var(--sky); }
.r-c-row span { color: var(--txt2); line-height: 1.4; }

/* График в правой колонке */
.r-chart { padding: 12px 14px; }
.r-chart-ttl { font-size: 11px; font-weight: 700; color: var(--txt); margin-bottom: 10px; }
.r-chart-area { height: 120px; }

/* ── Донат-виджет «Платформа» ── */
.r-donut-wrap { padding: 10px 14px 16px; }
.r-donut-cv   { position: relative; height: 165px; margin-bottom: 14px; }
.r-donut-leg  { display: flex; flex-direction: column; gap: 8px; }
.r-dleg       { display: flex; align-items: center; gap: 8px; }
.r-dleg-dot   { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.r-dleg-lbl   { font-size: 11px; color: var(--txt2); flex: 1; }
.r-dleg-bar   { flex: 0 0 52px; height: 4px; background: var(--bord2); border-radius: 2px; overflow: hidden; }
.r-dleg-bar span { display: block; height: 4px; border-radius: 2px; transition: width .6s ease; }
.r-dleg-n     { font-size: 12px; font-weight: 700; color: var(--txt1); min-width: 22px; text-align: right; }


/* ═══════════════════════════════════════════════════════════════
   CHART (центральный)
   ═══════════════════════════════════════════════════════════════ */
.c-chart {
  background: var(--card); border-radius: var(--r1);
  border: 1px solid var(--border); padding: 16px 18px;
}
.c-chart-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; flex-wrap: wrap; gap: 8px; }
.c-chart-ttl { font-weight: 700; font-size: 13px; }
.c-chart-sub { font-size: 10.5px; color: var(--txt3); margin-top: 2px; }
.c-chart-leg { display: flex; flex-wrap: wrap; gap: 10px; }
.leg { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--txt2); }
.leg-dot { width: 7px; height: 7px; border-radius: 50%; }
.c-chart-area { height: 170px; }


/* ═══ Карточка компании ═══ */
.gc-co-card {
  aspect-ratio: unset;          /* снимаем квадрат от .gc */
  overflow: hidden;             /* скругляем все углы */
  display: flex; flex-direction: column; gap: 0;
  text-decoration: none; color: inherit;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--r1); box-shadow: var(--s1);
  transition: box-shadow var(--t), transform var(--t), border-color var(--t);
}
.gc-co-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.1); transform: translateY(-2px); border-color: #bfdbfe; }

/* Premium — золотая рамка */
.gc-co-prem { border-color: #fbbf24; box-shadow: 0 0 0 1px #fde68a, var(--s1); }
.gc-co-prem:hover { border-color: #f59e0b; box-shadow: 0 6px 24px rgba(251,191,36,.25); }
.gc-co-demo { border-color: #f87171; box-shadow: 0 0 0 1px #fecaca, var(--s1); }
.gc-co-demo:hover { border-color: #ef4444; box-shadow: 0 6px 24px rgba(239,68,68,.2); }

/* ── Шапка карточки ── */
.gc-co-top {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 16px 14px;
  position: relative;
  background: #fff;
}

/* Аватар 80×80 */
.gc-co-av {
  width: 80px; height: 80px; border-radius: 14px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; position: relative;
  border: 1px solid rgba(0,0,0,.07);
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.gc-co-av img   { width: 100%; height: 100%; object-fit: contain; }
.gc-co-av-gov   { background: #f1f5f9; }
.gc-co-av-gov i { font-size: 34px; color: #94a3b8; }
.gc-co-av-com   { background: #f1f5f9; }
.gc-co-av-com i { font-size: 34px; color: #94a3b8; }

/* Корона premium поверх аватара */
.gc-co-crown {
  position: absolute; top: -4px; right: -4px;
  width: 17px; height: 17px; border-radius: 50%;
  background: #f59e0b; display: flex; align-items: center; justify-content: center;
  font-size: 8px; color: #fff; border: 2px solid #fff;
  box-shadow: 0 1px 4px rgba(245,158,11,.5);
}

/* Инфо справа от аватара */
.gc-co-info     { flex: 1; min-width: 0; padding-right: 52px; }
.gc-co-nm       {
  font-size: 14px; font-weight: 700; color: #0f172a;
  line-height: 1.35; word-break: break-word; margin-bottom: 7px;
}
.gc-co-sub-row  { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.gc-co-type     { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px;
                  font-weight: 600; padding: 3px 8px; border-radius: 20px; }
.gct-gov        { background: #dbeafe; color: #1d4ed8; }
.gct-com        { background: #d1fae5; color: #065f46; }
.gc-co-city     { display: inline-flex; align-items: center; gap: 4px;
                  font-size: 11px; color: #64748b; font-weight: 500; }
.gc-co-city i   { font-size: 9px; color: #94a3b8; }

/* Бейджи — колонка в правом верхнем углу */
.gc-co-badges   {
  position: absolute; top: 14px; right: 14px;
  display: flex; flex-direction: column; gap: 5px; align-items: center;
}
.gc-co-badge    {
  width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; cursor: default;
}
.gc-co-b-ver  { background: #059669; color: #fff; box-shadow: 0 2px 6px rgba(5,150,105,.35); }
.gc-co-b-unv  { background: #94a3b8; color: #fff; box-shadow: 0 2px 6px rgba(148,163,184,.35); }
.gc-co-b-prm  { background: #f59e0b; color: #fff; box-shadow: 0 2px 6px rgba(245,158,11,.35); }
.gc-co-b-top  { background: #7c3aed; color: #fff; box-shadow: 0 2px 6px rgba(124,58,237,.35); }
.gc-co-b-demo { background: #ef4444; color: #fff; box-shadow: 0 2px 6px rgba(239,68,68,.35); }
.gc-co-b-urg  { background: #f97316; color: #fff; box-shadow: 0 2px 6px rgba(249,115,22,.35); }
.gc-co-b-gov  { background: #3b82f6; color: #fff; box-shadow: 0 2px 6px rgba(59,130,246,.35); }

/* Аватар-плейсхолдеры — единый стиль */
.gc-co-av-vac, .gc-co-av-com, .gc-co-av-gov, .gc-off-av-ph, .gc-nws-av-ph {
  background: #f1f5f9; display: flex; align-items: center; justify-content: center;
}
.gc-co-av-vac i, .gc-co-av-com i, .gc-co-av-gov i, .gc-off-av-ph i, .gc-nws-av-ph i {
  font-size: 28px; color: #94a3b8;
}
.gc-co-av-gov { background: #eff6ff; }
.gc-co-av-gov i { color: #3b82f6; }

/* Vacancy type badges */
.gct-vac-fmt { background: rgba(99,102,241,.12); color: #6366f1; }
.gct-vac-emp { background: rgba(20,184,166,.12); color: #0d9488; }

/* Vacancy card tweaks */
.gc-vac-card .gc-co-foot { grid-template-columns: 1fr 1fr; }

/* Карточка оферты — аватар и типы */
.gc-off-av { border-radius: 8px; }
.gc-off-av img { border-radius: 8px; object-fit: cover; }
.gct-off-prod { background: rgba(217,119,6,.12) !important; color: #b45309 !important; }
.gct-off-work { background: rgba(37,99,235,.12) !important; color: #2563eb !important; }
.gct-off-svc  { background: rgba(5,150,105,.12) !important; color: #059669 !important; }

/* Procedure type badges */
.gct-proc-goods { background: rgba(37,99,235,.12); color: #2563eb; }
.gct-proc-works { background: rgba(217,119,6,.12); color: #b45309; }
.gct-proc-svc   { background: rgba(124,58,237,.12); color: #7c3aed; }
.gc-proc-card .gc-co-okved i { color: #059669; }

/* Tender type badges */
.gct-tnd-44  { background: rgba(239,68,68,.12); color: #dc2626; }
.gct-tnd-223 { background: rgba(59,130,246,.12); color: #2563eb; }
.gct-tnd-com { background: rgba(20,184,166,.12); color: #0d9488; }
.gc-tnd-card .gc-co-okved i { color: #14b8a6; }
.gc-tnd-price { background: #f0fdf4 !important; border-top-color: #bbf7d0 !important; }
.gc-tnd-price i { color: #059669 !important; }
.gc-tnd-price span { font-weight: 700; color: #065f46; font-size: 13px; }
.gc-tnd-desc span { font-size: 11.5px; line-height: 1.45; color: #475569; }

/* Tender details list */
.gc-tnd-details {
  padding: 0; border-top: 1px solid #e2e8f0; background: #fff;
}
.gc-tnd-row {
  display: flex; align-items: baseline; gap: 8px;
  padding: 6px 16px; border-bottom: 1px solid #f1f5f9;
  font-size: 11.5px; color: #475569; line-height: 1.4;
  word-break: break-word;
}
.gc-tnd-row:last-child { border-bottom: none; }
.gc-tnd-row i { font-size: 10px; flex-shrink: 0; width: 14px; text-align: center; margin-top: 2px; }
.gc-tnd-row b { color: #334155; font-weight: 600; white-space: nowrap; margin-right: 4px; }
.gc-tnd-row span { flex: 1; min-width: 0; }

/* Tender footer — only dates, 2-col */
.gc-tnd-card .gc-co-foot {
  grid-template-columns: 1fr 1fr;
}
.gc-tnd-card .gc-co-foot span {
  word-break: break-word; overflow-wrap: break-word;
}

/* Карточка новости в gc-co-card формате */
.gc-nws-av { border-radius: 8px; }
.gc-nws-av img { border-radius: 8px; object-fit: cover; }
.gc-nws-av-ph { background: linear-gradient(145deg, #312e81, #6366f1); }
.gc-nws-av-ph i { font-size: 28px; color: rgba(255,255,255,.5); }
.gc-nws-badge { background: rgba(79,70,229,.12) !important; color: #4f46e5 !important; }
.gc-nws-desc { }

/* ── Video card ── */
.gc-vid-card { }
.gc-vid-av { border-radius: 8px; position: relative; }
.gc-vid-av img { border-radius: 8px; object-fit: cover; }
.gc-vid-av-ph { background: linear-gradient(145deg, #4c1d95, #9333ea); }
.gc-vid-av-ph i { font-size: 32px; color: rgba(255,255,255,.5); }
.gc-vid-dur { position: absolute; bottom: 6px; right: 6px; background: rgba(0,0,0,.75); color: #fff; font-size: 11px; padding: 2px 6px; border-radius: 4px; font-weight: 600; }
.gc-vid-dur i { margin-right: 3px; font-size: 10px; }
.gc-vid-src { position: absolute; top: 6px; left: 6px; background: rgba(0,0,0,.6); color: #fff; font-size: 12px; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.gc-vid-cat { background: rgba(147,51,234,.12) !important; color: #7c3aed !important; }
.gc-nws-desc span {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; font-size: 11px; line-height: 1.45;
}

/* Описание карточки — 3 строки */
.gc-card-desc { }
.gc-card-desc span {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; font-size: 11.5px; line-height: 1.45; color: #475569;
}

/* Ключевые навыки — компактные теги */
.gc-skills { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 16px; border-top: 1px solid #e2e8f0; background: #fff; }
.gc-skill-tag {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10px; font-weight: 500; padding: 2px 7px; border-radius: 10px;
  background: #f1f5f9; color: #475569; white-space: nowrap; max-width: 140px;
  overflow: hidden; text-overflow: ellipsis;
}
.gc-skill-tag i { font-size: 8px; color: #94a3b8; }
.gc-skill-more { font-size: 10px; color: #64748b; font-weight: 600; padding: 2px 7px;
  border-radius: 10px; background: #e2e8f0; white-space: nowrap; }

/* Бенефиты — иконки в ряд */
.gc-benefits { display: flex; gap: 6px; flex-wrap: wrap; padding: 6px 16px; border-top: 1px solid #e2e8f0; background: #fff; }
.gc-benefit {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10px; font-weight: 500; color: #059669; padding: 2px 8px;
  border-radius: 10px; background: #ecfdf5;
}
.gc-benefit i { font-size: 9px; }

/* Расписание */
.gc-schedule { font-size: 11px; color: #6366f1; font-weight: 500; }

/* Футер карточки: даты, просмотры, отклики */
.gc-co-foot {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px 8px;
  padding: 8px 16px; border-top: 1px solid #e2e8f0; background: #fff;
}
.gc-co-foot span {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; color: #64748b;
}
.gc-co-foot b { color: #475569; font-weight: 600; }
.gc-co-foot i { font-size: 10px; flex-shrink: 0; }
.gc-co-foot .fa-calendar-plus { color: #0ea5e9; }
.gc-co-foot .fa-calendar-times { color: #ef4444; }
.gc-co-foot .fa-eye { color: #8b5cf6; }
.gc-co-foot .fa-paper-plane { color: #f59e0b; }



/* ── Секции внутри карточки ── */
.gc-co-okved, .gc-co-reqs, .gc-co-contacts {
  background: #fff;
  padding: 10px 16px;
  border-top: 1px solid #e2e8f0;
}

/* ОКВЭД */
.gc-co-okved {
  display: flex; align-items: flex-start; gap: 8px;
  border-top: 1px solid #e2e8f0;
}
.gc-co-okved i    { font-size: 11px; color: #6366f1; flex-shrink: 0; margin-top: 2px; }
.gc-co-okved span { font-size: 11.5px; color: #3730a3; line-height: 1.5; flex: 1; }

/* Реквизиты — ИНН и ОГРН рядом */
.gc-co-reqs {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.gc-co-req-item {
  display: flex; align-items: center; gap: 5px;
  font-size: 12px; color: #374151;
}
.gc-co-req-item b { color: #1e293b; font-weight: 700; }
.gc-co-req-item i { font-size: 10px; color: #94a3b8; }

/* Бейдж «лет на рынке» — янтарный */
.gc-co-req-age {
  display: inline-flex; align-items: center; gap: 5px;
  background: linear-gradient(135deg,#fef3c7,#fde68a);
  color: #92400e; font-weight: 700; font-size: 11.5px;
  padding: 3px 9px; border-radius: 20px; border: 1px solid #fbbf24;
  white-space: nowrap; flex: none;
}
.gc-co-req-age i { color: #d97706; font-size: 10px; }

/* Бейдж «на платформе» — бирюзовый */
.gc-co-req-site {
  display: inline-flex; align-items: center; gap: 5px;
  background: linear-gradient(135deg,#ccfbf1,#99f6e4);
  color: #0f766e; font-weight: 700; font-size: 11.5px;
  padding: 3px 9px; border-radius: 20px; border: 1px solid #5eead4;
  white-space: nowrap; flex-shrink: 0;
}
.gc-co-req-site i { color: #0d9488; font-size: 10px; }

/* Телефон + бейдж возраста */
.gc-co-phone {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 16px; border-top: 1px solid #e2e8f0; background: #fff; gap: 8px;
}
.gc-co-phone-num {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: #374151;
}
.gc-co-phone-num i { font-size: 10px; color: #059669; flex-shrink: 0; }

/* ═══ Панель фильтров компаний ═══ */
.cof-panel { padding: 0; }
.cof-panel .panel-hd { padding: 11px 14px; border-bottom: 1px solid var(--border); }

.cof-sec { padding: 10px 14px; border-bottom: 1px solid var(--border); }
.cof-sec:last-child { border-bottom: none; }

.cof-lbl { font-size: 10.5px; font-weight: 700; color: var(--txt3); text-transform: uppercase;
           letter-spacing: .05em; margin-bottom: 7px; }
.cof-lbl-sub { font-size: 10px; font-weight: 600; color: var(--txt3); text-transform: none;
               letter-spacing: 0; margin: 8px 0 4px; }

.cof-type-tabs { display: flex; gap: 4px; }
.cof-ttab {
  flex: 1; padding: 5px 4px; border-radius: 6px; font-size: 11px; font-weight: 600;
  border: 1px solid var(--border); background: var(--bg); color: var(--txt2);
  cursor: pointer; transition: all var(--t); display: flex; align-items: center; justify-content: center; gap: 4px;
}
.cof-ttab:hover { border-color: var(--sky); color: var(--sky); }
.cof-ttab.on    { background: var(--sky); border-color: var(--sky); color: #fff; }
.cof-ttab i     { font-size: 9px; }

.cof-select {
  width: 100%; padding: 7px 10px; border-radius: 7px; font-size: 12px;
  border: 1px solid var(--border); background: var(--bg); color: var(--txt1);
  cursor: pointer; outline: none; transition: border-color var(--t);
}
.cof-select:focus { border-color: var(--sky); }

.cof-input {
  width: 100%; padding: 7px 10px; border-radius: 7px; font-size: 12px;
  border: 1px solid var(--border); background: var(--bg); color: var(--txt1);
  outline: none; transition: border-color var(--t); box-sizing: border-box;
}
.cof-input:focus { border-color: var(--sky); }

.cof-drop {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 50;
  background: #fff; border: 1px solid var(--border); border-radius: 7px;
  box-shadow: var(--s2); max-height: 180px; overflow-y: auto; margin-top: 2px;
}
.cof-drop-item { padding: 7px 11px; font-size: 12px; cursor: pointer; color: var(--txt1); }
.cof-drop-item:hover { background: var(--sky-ll); color: var(--sky); }

.cof-radio {
  display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--txt2);
  cursor: pointer; padding: 3px 0;
}
.cof-radio input { display: none; }
.cof-radio span {
  width: 14px; height: 14px; border-radius: 50%; border: 2px solid #cbd5e1;
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  transition: border-color var(--t);
}
.cof-radio input:checked ~ span { border-color: var(--sky); background: var(--sky); }
.cof-radio input:checked ~ span::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #fff; }

.cof-chk {
  display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--txt2);
  cursor: pointer; padding: 3px 0;
}
.cof-chk input { display: none; }
.cof-chk span {
  width: 14px; height: 14px; border-radius: 4px; border: 2px solid #cbd5e1;
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  transition: all var(--t);
}
.cof-chk input:checked ~ span { border-color: var(--sky); background: var(--sky); }
.cof-chk input:checked ~ span::after { content: '✓'; font-size: 9px; color: #fff; font-weight: 800; }

/* ═══ Виджет курса валют ═══ */
/* ── Градиентная шапка панели (Каталог / Статистика / Курс валют) ── */
.phg-panel { padding: 0; overflow: hidden; }
.phg {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px 10px;
  background: linear-gradient(135deg, #1e3a5f, #1a56db);
  border-radius: var(--r1) var(--r1) 0 0;
}
.phg-ttl { font-size: 12.5px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 6px; }
.phg-ttl i { color: #93c5fd; font-size: 11px; }
.phg-all { font-size: 10px; color: rgba(255,255,255,.65); display: flex; align-items: center; gap: 4px; transition: color .15s; }
.phg-all:hover { color: #fff; }

.cbr-widget { padding: 0; overflow: hidden; }

.cbr-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px 10px;
  background: linear-gradient(135deg,#1e3a5f,#1a56db);
  border-radius: var(--r1) var(--r1) 0 0;
}
.cbr-title { font-size: 12.5px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 6px; }
.cbr-title i { color: #93c5fd; font-size: 11px; }
.cbr-date { font-size: 10px; color: rgba(255,255,255,.6); }

.cbr-rows { display: flex; flex-direction: column; }

.cbr-row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 14px;
  border-bottom: 1px solid var(--border);
  transition: background var(--t);
}
.cbr-row:last-child { border-bottom: none; }
.cbr-row:hover { background: #f8fafc; }

.cbr-flag-wrap {
  width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-size: 18px;
}
.cbr-info { flex: 1; min-width: 0; }
.cbr-code { display: block; font-size: 13px; font-weight: 700; line-height: 1.2; }
.cbr-name { display: block; font-size: 9.5px; color: var(--txt3); }

.cbr-rate-wrap { text-align: right; flex-shrink: 0; }
.cbr-rate { font-size: 16px; font-weight: 800; color: var(--txt1); letter-spacing: -.3px; }
.cbr-rub  { font-size: 11px; font-weight: 600; color: var(--txt3); margin-left: 2px; }

.cbr-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 14px; background: #f8fafc;
  font-size: 9.5px; color: var(--txt3); gap: 6px;
  border-top: 1px solid var(--border);
}
.cbr-footer i { color: #94a3b8; }
.cbr-src { color: #94a3b8; }

/* ═══════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════ */
.pfooter { background: #0c1322; margin-top: 24px; }

/* Полоса преимуществ */
.pfooter-strip {
  background: rgba(255,255,255,.03);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 12px 24px;
}
.pfooter-strip-in { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 0; }
.pfs-item { display: flex; align-items: center; gap: 7px; font-size: 12px; color: rgba(200,210,225,.85); padding: 5px 14px; letter-spacing: .01em; transition: color .2s; }
.pfs-item:hover { color: #fff; }
.pfs-item i { font-size: 12px; transition: transform .2s; }
.pfs-item:hover i { transform: scale(1.2); }
.pfs-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(148,163,184,.25); flex-shrink: 0; }
.pfs-sky i { color: #38bdf8; }
.pfs-emerald i { color: #34d399; }
.pfs-violet i { color: #a78bfa; }
.pfs-rose i { color: #fb7185; }
.pfs-amber i { color: #fbbf24; }
.pfs-teal i { color: #2dd4bf; }
.pfs-indigo i { color: #818cf8; }

/* Основная сетка */
.pfooter-main {
  display: grid; grid-template-columns: 2fr 1.2fr 1.2fr 1.4fr;
  gap: 32px; max-width: 1680px; margin: 0 auto;
  padding: 32px 24px 28px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

/* Колонка бренд */
.pf-logo-row {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 12px; text-decoration: none;
}
.pf-logo-mark {
  width: 32px; height: 32px; background: var(--sky); border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 11px; color: #fff; flex-shrink: 0;
}
.pf-logo-name { font-weight: 700; font-size: 15px; color: #f1f5f9; }
.pf-logo-b2b {
  font-size: 9px; font-weight: 800; padding: 1px 6px; border-radius: 4px;
  background: rgba(2,132,199,.4); color: #7dd3fc; letter-spacing: .05em;
}
.pf-desc { font-size: 12px; color: rgba(148,163,184,.8); line-height: 1.65; margin-bottom: 6px; }

/* Trust badges */
.pf-trust { margin: 10px 0; display: flex; flex-direction: column; gap: 5px; }
.pf-trust-item { display: flex; align-items: center; gap: 7px; font-size: 12px; color: rgba(148,163,184,.85); }
.pf-trust-item .fa-check-circle { color: #34d399; }
.pf-trust-item .fa-lock         { color: var(--sky); }
.pf-trust-item .fa-award        { color: #fbbf24; }

/* Социальные сети */
.pf-social { margin-top: 14px; }
.pf-social-lbl { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: rgba(148,163,184,.5); display: block; margin-bottom: 8px; }
.pf-social-icons { display: flex; gap: 8px; }
.pf-si {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; color: #fff; transition: transform var(--t), opacity var(--t);
}
.pf-si:hover { transform: scale(1.1); opacity: .9; }
.pf-si-max { background: #6c3ce1; }
.pf-si-max img { border-radius: 3px; }
.pf-si-vk { background: #0077ff; }
.pf-si-tg { background: #26a5e4; }

/* Заголовки колонок */
.pf-col-h {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: rgba(241,245,249,.8);
  margin-bottom: 12px; display: flex; align-items: center; gap: 7px;
}
.pf-col-h i { font-size: 10px; color: var(--sky); }
.pf-col-h-mt { margin-top: 20px; }

/* Навигационные ссылки */
.pf-nav { list-style: none; display: flex; flex-direction: column; gap: 1px; }
.pf-nav a {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: rgba(148,163,184,.8); padding: 4px 0;
  transition: color var(--t); text-decoration: none;
}
.pf-nav a:hover { color: #7dd3fc; }
.pf-nav a i { font-size: 10px; color: rgba(148,163,184,.4); width: 14px; text-align: center; flex-shrink: 0; }

/* Карточки контактов */
.pf-contacts { display: flex; flex-direction: column; gap: 6px; }
.pf-cc {
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px; padding: 8px 11px; text-decoration: none;
  transition: background var(--t), border-color var(--t);
}
.pf-cc:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); }
.pf-cc-ic {
  width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; color: #fff;
}
.pf-cc-green  { background: linear-gradient(135deg,#059669,#047857); }
.pf-cc-teal   { background: linear-gradient(135deg,#14b8a6,#0d9488); }
.pf-cc-blue   { background: linear-gradient(135deg,#0284c7,#0369a1); }
.pf-cc-purple { background: linear-gradient(135deg,#7c3aed,#6d28d9); }
.pf-cc-amber  { background: linear-gradient(135deg,#d97706,#b45309); }
.pf-cc-body { flex: 1; min-width: 0; }
.pf-cc-body span   { display: block; font-size: 9.5px; color: rgba(148,163,184,.55); margin-bottom: 1px; }
.pf-cc-body strong { display: block; font-size: 12px; color: #e2e8f0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Нижняя полоса */
.pfooter-bot {
  max-width: 1680px; margin: 0 auto; padding: 14px 24px;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 8px;
}
.pfooter-bot-left { display: flex; flex-direction: column; gap: 3px; }
.pf-copy { font-size: 11.5px; color: rgba(148,163,184,.5); }
.pf-req  { font-size: 11px;   color: rgba(148,163,184,.35); }
.pfooter-bot-right { display: flex; align-items: center; gap: 10px; }
.pf-pay-lbl { font-size: 11px; color: rgba(148,163,184,.4); }
.pf-pay-logo { opacity: .85; transition: opacity var(--t); }
.pf-pay-logo:hover { opacity: 1; }


/* ═══════════════════════════════════════════════════════════════
   ЖИВАЯ ЛЕНТА — FEED GRID (tab=all)
   Masonry-style mixed-size cards with type ribbons
   ═══════════════════════════════════════════════════════════════ */

/* --- Feed: CSS-columns masonry (true Pinterest layout) --- */
.c-grid--feed {
  display: block !important;
  column-count: 3;
  column-gap: 14px;
}
.c-grid--feed .gc-loader,
.c-grid--feed .gc-done {
  column-span: all;
}

/* --- Type Ribbon (top-left label) --- */
.gf-ribbon {
  position: absolute; top: 12px; left: -6px; z-index: 4;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 12px 4px 10px;
  font-size: 11px; font-weight: 700; letter-spacing: .02em;
  color: #fff; border-radius: 0 6px 6px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  line-height: 1;
  text-transform: uppercase;
}
.gf-ribbon i { font-size: 10px; }
.gf-ribbon::before {
  content: ''; position: absolute; left: 0; bottom: -6px;
  border: 3px solid transparent;
}
/* ribbon colors per type */
.gf-rb-co  { background: linear-gradient(135deg, #059669, #10b981); }
.gf-rb-co::before  { border-right-color: #047857; border-top-color: #047857; }
.gf-rb-off { background: linear-gradient(135deg, #d97706, #f59e0b); }
.gf-rb-off::before { border-right-color: #b45309; border-top-color: #b45309; }
.gf-rb-vac { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.gf-rb-vac::before { border-right-color: #6d28d9; border-top-color: #6d28d9; }
.gf-rb-tnd { background: linear-gradient(135deg, #4338ca, #6366f1); }
.gf-rb-tnd::before { border-right-color: #3730a3; border-top-color: #3730a3; }
.gf-rb-proc{ background: linear-gradient(135deg, #0284c7, #38bdf8); }
.gf-rb-proc::before{ border-right-color: #0369a1; border-top-color: #0369a1; }
.gf-rb-nws { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.gf-rb-nws::before { border-right-color: #0e7490; border-top-color: #0e7490; }
.gf-rb-pr  { background: linear-gradient(135deg, #e11d48, #fb7185); }
.gf-rb-pr::before  { border-right-color: #be123c; border-top-color: #be123c; }
.gf-rb-vid { background: linear-gradient(135deg, #9333ea, #c084fc); }
.gf-rb-vid::before { border-right-color: #7e22ce; border-top-color: #7e22ce; }

/* --- Feed card wrapper --- */
.gf-card {
  position: relative;
  break-inside: avoid;
  margin-bottom: 14px;
  display: inline-block;
  width: 100%;
}
.gf-card .gc {
  aspect-ratio: unset;
}
.gf-card .gc-co-card {
  height: auto;
}
/* No truncation in feed — show full content */
.gf-card .gc-card-desc span,
.gf-card .gc-co-okved span {
  -webkit-line-clamp: unset;
  display: inline;
  overflow: visible;
}

/* colored left accent border per type */
.gf-card--co  .gc-co-card { border-left: 3px solid #10b981; }
.gf-card--off .gc-co-card { border-left: 3px solid #f59e0b; }
.gf-card--vac .gc-co-card { border-left: 3px solid #8b5cf6; }
.gf-card--tnd .gc-co-card { border-left: 3px solid #6366f1; }
.gf-card--proc .gc-co-card{ border-left: 3px solid #38bdf8; }
.gf-card--nws .gc-co-card { border-left: 3px solid #22d3ee; }
.gf-card--pr  .gc-co-card { border-left: 3px solid #fb7185; }

/* Premium override */
.gf-card .gc-co-prem { border-left-color: #fbbf24 !important; }

/* --- Featured cards — highlighted border --- */
.gf-card--wide .gc-co-card {
  border-width: 2px;
  border-color: #fbbf24;
  box-shadow: 0 4px 16px rgba(251,191,36,.15);
}

/* --- Tall cards (news / press with images) --- */
.gf-card--hero .gc-co-card {
  min-height: 280px;
}
.gf-card--hero .gf-hero-img {
  width: 100%; height: 160px; overflow: hidden;
  border-radius: var(--r1) var(--r1) 0 0;
  background: linear-gradient(135deg, #e2e8f0, #f1f5f9);
}
.gf-card--hero .gf-hero-img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .3s;
}
.gf-card--hero:hover .gf-hero-img img {
  transform: scale(1.04);
}

/* --- Offer image card layout --- */
.gf-card--off .gf-off-img {
  width: 100%; height: 140px; overflow: hidden;
  background: linear-gradient(135deg, #fef3c7, #fffbeb);
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--r1) var(--r1) 0 0;
}
.gf-card--off .gf-off-img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .3s;
}
.gf-card--off:hover .gf-off-img img { transform: scale(1.04); }
.gf-card--off .gf-off-img .gf-off-ico {
  font-size: 32px; color: #d97706; opacity: .4;
}

/* --- Vacancy accent --- */
.gf-card--vac .gc-co-top {
  background: linear-gradient(135deg, #faf5ff 0%, #fff 60%);
}

/* --- Tender accent --- */
.gf-card--tnd .gc-co-top {
  background: linear-gradient(135deg, #eef2ff 0%, #fff 60%);
}

/* --- Procedure accent --- */
.gf-card--proc .gc-co-top {
  background: linear-gradient(135deg, #f0f9ff 0%, #fff 60%);
}

/* --- Compact stat pills for feed --- */
.gf-stats {
  display: flex; flex-wrap: wrap; gap: 4px;
  padding: 0 14px 10px;
}
.gf-pill {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 2px 8px; border-radius: 10px;
  font-size: 10.5px; font-weight: 600;
  background: #f1f5f9; color: #64748b;
}
.gf-pill i { font-size: 9px; }
.gf-pill--green { background: #ecfdf5; color: #059669; }
.gf-pill--amber { background: #fffbeb; color: #d97706; }
.gf-pill--red   { background: #fef2f2; color: #dc2626; }
.gf-pill--blue  { background: #eff6ff; color: #2563eb; }

/* --- Feed card hover glow per type --- */
.gf-card--co:hover  .gc-co-card { border-color: #a7f3d0; box-shadow: 0 8px 24px rgba(16,185,129,.12); }
.gf-card--off:hover .gc-co-card { border-color: #fde68a; box-shadow: 0 8px 24px rgba(245,158,11,.12); }
.gf-card--vac:hover .gc-co-card { border-color: #c4b5fd; box-shadow: 0 8px 24px rgba(139,92,246,.12); }
.gf-card--tnd:hover .gc-co-card { border-color: #a5b4fc; box-shadow: 0 8px 24px rgba(99,102,241,.12); }
.gf-card--proc:hover .gc-co-card{ border-color: #bae6fd; box-shadow: 0 8px 24px rgba(56,189,248,.12); }
.gf-card--nws:hover .gc-co-card { border-color: #a5f3fc; box-shadow: 0 8px 24px rgba(34,211,238,.12); }
.gf-card--pr:hover  .gc-co-card { border-color: #fecdd3; box-shadow: 0 8px 24px rgba(251,113,133,.12); }

/* ═══════════════════════════════════════════════════════════════
   MOBILE
   ═══════════════════════════════════════════════════════════════ */
.p-mob-toggle { display: none; }
.pnav-mob { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 500; background: var(--nb); border-top: 1px solid rgba(255,255,255,.1); flex; padding: 4px 0 env(safe-area-inset-bottom,0); }

/* Dropdown city */
.city-drop { 
  position: fixed; 
  min-width: 200px; 
  background: #ffffff; 
  border: 2px solid #0284c7; 
  border-radius: 8px; 
  box-shadow: 0 8px 24px rgba(0,0,0,0.15); 
  z-index: 999999; 
  display: none; 
  max-height: 280px; 
  overflow-y: auto; 
}
.city-opt { 
  padding: 10px 14px; 
  font-size: 14px; 
  cursor: pointer; 
  color: #1e293b; 
  border-bottom: 1px solid #f1f5f9; 
  background: #ffffff; 
}
.city-opt:last-child { border-bottom: none; }
.city-opt:hover { 
  background: #eff6ff; 
  color: #0284c7; 
  font-weight: 500; 
}

@media(max-width:1400px){ .c-stats{grid-template-columns:repeat(4,1fr)} .c-grid{grid-template-columns:repeat(3,1fr)} .c-grid--co{grid-template-columns:repeat(2,1fr)} .c-grid--feed{column-count:2!important} }
@media(max-width:1200px){ :root{--lw:220px;--rw:240px} .c-stats{grid-template-columns:repeat(4,1fr)} .pfooter-main{grid-template-columns:1fr 1fr;gap:24px} }
@media(max-width:1050px){ .pcol-r{display:none} .c-stats{grid-template-columns:repeat(3,1fr)} }
@media(max-width:1200px){ .pnav-desc{display:none} }
@media(max-width:1050px){ .pnav-info .pnav-info-lnk:last-of-type{display:none} }
@media(max-width:860px){
  .pcol-l{display:none}
  .pcols{padding:10px 10px}
  .pnav-menu{display:none}
  .pnav-info{display:none!important}
  .c-stats{grid-template-columns:repeat(3,1fr)}
  .c-grid{grid-template-columns:repeat(2,1fr)}
  .c-grid--feed{column-count:2!important}
}
@media(max-width:560px){
  .c-stats{grid-template-columns:repeat(2,1fr)}
  .c-grid{grid-template-columns:repeat(2,1fr);gap:7px}
  .c-grid--feed{column-count:1!important}
  .gf-ribbon{font-size:10px;padding:3px 8px 3px 7px}
  .pnav-search{min-width:120px}
}


/* ═══════════════════════════════════════════════════════════════
   PORTAL WIDGETS — sidebar & news ticker
   ═══════════════════════════════════════════════════════════════ */

/* ── Dzen-style News Widget ── */
.dzen-news {
  margin-bottom: 12px; border-radius: var(--r1); overflow: hidden;
  background: var(--card); border: 1px solid var(--border);
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

/* Header */
.dzen-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px; background: linear-gradient(135deg, #0f172a, #1e293b);
}
.dzen-hd-left { display: flex; align-items: center; gap: 8px; }
.dzen-live-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #ef4444;
  box-shadow: 0 0 6px #ef4444; animation: livePulse 2s ease-in-out infinite;
}
@keyframes livePulse { 0%,100%{opacity:1;box-shadow:0 0 4px #ef4444} 50%{opacity:.5;box-shadow:0 0 12px #ef4444} }
.dzen-hd-title { font-size: 14px; font-weight: 700; color: #fff; letter-spacing: .3px; }
.dzen-hd-right { display: flex; align-items: center; gap: 6px; }
.dzen-updated { font-size: 10px; color: #94a3b8; }

/* Tabs row */
.dzen-tabs {
  display: flex; overflow-x: auto; scrollbar-width: none;
  background: #f8fafc; border-bottom: 1px solid var(--border);
}
.dzen-tabs::-webkit-scrollbar { display: none; }
.dzen-tab {
  flex: 1; padding: 9px 4px; font-size: 13px; font-weight: 500; color: var(--txt3);
  background: none; border: none; cursor: pointer; white-space: nowrap;
  border-bottom: 2px solid transparent; transition: all .15s;
  text-align: center;
}
.dzen-tab:hover { color: var(--txt); background: #f1f5f9; }
.dzen-tab.on { color: var(--sky); border-bottom-color: var(--sky); font-weight: 700; background: #fff; }

/* News list */
.dzen-list { display: flex; flex-direction: column; min-height: 60px; }
.dzen-loading { padding: 24px; text-align: center; color: var(--txt3); font-size: 13px; }
.dzen-empty { padding: 24px; text-align: center; color: var(--txt3); font-size: 13px; }
.dzen-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 16px; text-decoration: none; color: var(--txt);
  border-bottom: 1px solid #f1f5f9; transition: all .12s;
  animation: dzenFadeIn .3s ease;
}
@keyframes dzenFadeIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:none} }
.dzen-item:last-child { border-bottom: none; }
.dzen-item:hover { background: #f0f9ff; padding-left: 20px; }
.dzen-src {
  flex-shrink: 0; font-size: 9px; font-weight: 700; padding: 2px 6px;
  border-radius: 4px; color: #fff; min-width: 42px; text-align: center;
  letter-spacing: .2px; text-transform: uppercase;
}
.dzen-ttl {
  flex: 1; font-size: 13px; line-height: 1.4; color: var(--txt);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dzen-item:hover .dzen-ttl { color: var(--sky); }
.dzen-time {
  flex-shrink: 0; font-size: 10px; color: var(--txt3); font-variant-numeric: tabular-nums;
  background: #f1f5f9; padding: 2px 6px; border-radius: 4px;
}

/* More button */
.dzen-more {
  display: block; width: 100%; padding: 10px; text-align: center;
  font-size: 13px; font-weight: 600; color: var(--sky); cursor: pointer;
  background: linear-gradient(0deg, #f0f9ff, #fff); border: none;
  border-top: 1px solid var(--border); transition: all .15s;
}
.dzen-more:hover { background: var(--sky-ll); letter-spacing: .3px; }
.dzen-more i { font-size: 10px; margin-right: 4px; transition: transform .2s; }
.dzen-more:hover i { transform: translateY(2px); }

/* ── Deadlines Widget ── */
.w-dead-list { display: flex; flex-direction: column; }
.w-dead-item {
  display: block; padding: 10px 14px; text-decoration: none; color: var(--txt);
  border-bottom: 1px solid var(--border); transition: background .15s;
}
.w-dead-item:last-child { border-bottom: none; }
.w-dead-item:hover { background: var(--sky-ll); }
.w-dead-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.w-dead-type { font-size: 10px; font-weight: 600; color: var(--txt3); text-transform: uppercase; letter-spacing: .3px; }
.w-dead-type i { margin-right: 3px; }
.w-dead-days {
  font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 8px;
}
.w-dead-red    { background: #fef2f2; color: #dc2626; }
.w-dead-orange { background: #fffbeb; color: #d97706; }
.w-dead-green  { background: #ecfdf5; color: #059669; }
.w-dead-ttl { font-size: 12px; font-weight: 600; color: var(--txt); line-height: 1.35; margin-bottom: 3px; }
.w-dead-budget { font-size: 11px; font-weight: 700; color: var(--sky); margin-bottom: 2px; }
.w-dead-co { font-size: 10px; color: var(--txt3); }

/* ── New Companies Widget ── */
.w-org-list { display: flex; flex-direction: column; }
.w-org-item {
  display: flex; align-items: center; gap: 10px; padding: 8px 14px;
  text-decoration: none; color: var(--txt);
  border-bottom: 1px solid var(--border); transition: background .15s;
}
.w-org-item:last-child { border-bottom: none; }
.w-org-item:hover { background: var(--sky-ll); }
.w-org-av {
  width: 34px; height: 34px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; color: #fff; overflow: hidden;
}
.w-org-av-img { background: #f1f5f9; }
.w-org-av-img img { width: 100%; height: 100%; object-fit: contain; }
.w-org-av-com { background: linear-gradient(135deg, #0284c7, #06b6d4); }
.w-org-av-gov { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.w-org-info { flex: 1; min-width: 0; }
.w-org-nm { font-size: 12px; font-weight: 600; color: var(--txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.w-org-meta { font-size: 10px; color: var(--txt3); display: flex; align-items: center; gap: 6px; }
.w-org-meta i { font-size: 9px; color: var(--sky); }
.w-org-dt { margin-left: auto; }

/* ── Categories Tag Cloud ── */
.w-cat-cloud { padding: 10px 12px; display: flex; flex-wrap: wrap; gap: 4px; }
.w-cat-tag {
  display: inline-block; padding: 3px 7px; border-radius: 8px;
  background: #f1f5f9; color: var(--txt2); text-decoration: none;
  font-size: 11px; font-weight: 500; transition: all .15s; line-height: 1.3;
  word-break: break-word; white-space: normal;
}
.w-cat-tag:hover { background: var(--sky); color: #fff; }
.w-cat-tag sup { font-size: 9px; color: var(--sky); margin-left: 2px; vertical-align: super; }
.w-cat-tag:hover sup { color: rgba(255,255,255,.7); }

/* ── Top Vacancies Widget ── */
.w-vac-list { display: flex; flex-direction: column; }
.w-vac-item {
  display: block; padding: 10px 14px; text-decoration: none;
  border-bottom: 1px solid var(--border); transition: background .15s;
}
.w-vac-item:last-child { border-bottom: none; }
.w-vac-item:hover { background: var(--sky-ll); }
.w-vac-sal {
  font-size: 13px; font-weight: 700; color: #059669; margin-bottom: 2px;
}
.w-vac-ttl { font-size: 12px; font-weight: 600; color: var(--txt); line-height: 1.3; margin-bottom: 2px; }
.w-vac-co { font-size: 10px; color: var(--txt3); }

/* ── Geography Widget ── */
.w-geo-list { padding: 10px 14px; display: flex; flex-direction: column; gap: 8px; }
.w-geo-row { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: center; }
.w-geo-city { font-size: 12px; color: var(--txt); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.w-geo-cnt { font-size: 11px; font-weight: 700; color: var(--sky); text-align: right; }
.w-geo-bar { grid-column: 1 / -1; height: 4px; background: #f1f5f9; border-radius: 2px; overflow: hidden; }
.w-geo-fill { height: 100%; background: linear-gradient(90deg, #0284c7, #06b6d4); border-radius: 2px; transition: width .5s ease; }

/* ── Responsive for widgets ── */
@media(max-width:1050px) {
  .dzen-tab { font-size: 12px; padding: 8px 3px; }
}
@media(max-width:860px) {
  .dzen-tab { font-size: 11px; }
  .dzen-ttl { font-size: 12px; }
}
@media(max-width:560px) {
  .dzen-tabs { overflow-x: auto; }
  .dzen-tab { flex: 0 0 auto; padding: 7px 8px; font-size: 11px; }
  .dzen-item { padding: 7px 12px; gap: 6px; }
  .dzen-time { display: none; }
  .dzen-src { font-size: 8px; min-width: 32px; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE NAV — hamburger + drawer + footer compact
   ═══════════════════════════════════════════════════════════════ */

.pnav-burger {
  display: none; background: none; border: none; cursor: pointer;
  width: 36px; height: 36px; flex-direction: column; align-items: center;
  justify-content: center; gap: 5px; padding: 6px; margin-left: auto; flex-shrink: 0;
}
.pnav-burger span {
  display: block; width: 20px; height: 2px; background: #e2e8f0;
  border-radius: 2px; transition: transform .25s, opacity .25s;
}
.mob-menu-open .pnav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mob-menu-open .pnav-burger span:nth-child(2) { opacity: 0; }
.mob-menu-open .pnav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.pnav-drawer {
  display: none; position: fixed; inset: 0; z-index: 10000;
  background: rgba(15,22,36,.6); backdrop-filter: blur(4px);
}
.pnav-drawer-inner {
  position: absolute; top: 0; right: 0; width: 280px; max-width: 85vw; height: 100%;
  background: #0f1623; overflow-y: auto; display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .3s ease;
}
.mob-menu-open .pnav-drawer { display: block; }
.mob-menu-open .pnav-drawer-inner { transform: translateX(0); }
.mob-menu-open { overflow: hidden; }

.pnav-drawer-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,.08);
}
.pnav-drawer-hd .pnav-logo { gap: 8px; }
.pnav-drawer-hd .pnav-logo-mark { width: 28px; height: 28px; font-size: 10px; }
.pnav-drawer-hd .pnav-logo-name { font-size: 13px; }
.pnav-drawer-close {
  background: none; border: none; color: #94a3b8; font-size: 18px;
  cursor: pointer; padding: 6px; width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
}
.pnav-drawer-close:hover { color: #fff; }

.pnav-drawer-links {
  display: flex; flex-direction: column; padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.pnav-drawer-links a {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 20px; font-size: 14px; color: #cbd5e1;
  text-decoration: none; transition: background .15s, color .15s;
}
.pnav-drawer-links a:hover { background: rgba(255,255,255,.06); color: #fff; }
.pnav-drawer-links a i { width: 18px; text-align: center; font-size: 13px; color: #64748b; }

.pnav-drawer-contacts {
  display: flex; flex-direction: column; padding: 12px 20px; gap: 8px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.pnav-drawer-contacts a {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #94a3b8; text-decoration: none;
}
.pnav-drawer-contacts a:hover { color: #e2e8f0; }
.pnav-drawer-contacts a i { width: 16px; text-align: center; font-size: 11px; }

.pnav-drawer-auth {
  display: flex; flex-direction: column; gap: 8px; padding: 16px 20px; margin-top: auto;
}
.pnav-drawer-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 16px; border-radius: 8px; font-size: 13px; font-weight: 600;
  text-decoration: none; transition: background .15s;
  background: rgba(255,255,255,.08); color: #cbd5e1; border: 1px solid rgba(255,255,255,.12);
}
.pnav-drawer-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
.pnav-drawer-btn-fill { background: #0284c7; color: #fff; border-color: #0284c7; }
.pnav-drawer-btn-fill:hover { background: #0369a1; }

@media (max-width: 860px) {
  .pnav-burger { display: flex; }
  .pnav-right { display: none !important; }
  .pnav-inner { padding: 0 12px; }
  .pnav-logo-sub { display: none; }
  /* Footer */
  .pfooter-strip { padding: 8px 12px; }
  .pfooter-strip-in { gap: 4px 0; }
  .pfs-item { padding: 3px 8px; font-size: 11px; }
  .pfs-dot { display: none; }
  .pf-col-brand { grid-column: 1 / -1; }
  .pf-trust { flex-direction: row; flex-wrap: wrap; gap: 4px 14px; }
  .pfooter-bot { padding: 12px 16px; flex-direction: column; align-items: flex-start; gap: 6px; }
}

@media (max-width: 560px) {
  :root { --nb-h-px: 46px; }
  .pnav { height: 46px; }
  .pnav-inner { height: 46px; }
  .pnav-logo-mark { width: 28px; height: 28px; font-size: 10px; }
  .pnav-logo-name { font-size: 12px; }
  /* Footer compact */
  .pfooter-strip { display: none; }
  .pfooter-main { grid-template-columns: 1fr; gap: 16px; padding: 18px 14px 14px; }
  .pfooter-main > .pf-col:not(.pf-col-brand):not(:last-child) { display: none; }
  .pf-desc { font-size: 11px; }
  .pf-trust-item { font-size: 10px; }
  .pf-si { width: 30px; height: 30px; font-size: 13px; }
  .pf-col-h { font-size: 10px; margin-bottom: 6px; }
  .pf-cc { padding: 6px 8px; gap: 8px; }
  .pf-cc-ic { width: 26px; height: 26px; font-size: 11px; }
  .pf-cc-body span { font-size: 9px; }
  .pf-cc-body strong { font-size: 11px; }
  .pfooter-bot { padding: 10px 14px; }
  .pf-copy { font-size: 10px; }
  .pf-req { font-size: 9.5px; }
}

/* ── Favorite button on cards ── */
.gc-fav-btn{width:26px;height:26px;border-radius:50%;background:rgba(148,163,184,.88);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;font-size:11px;color:#fff;box-shadow:0 2px 6px rgba(148,163,184,.35);flex-shrink:0;margin:0;padding:0}
.gc-fav-btn:hover{background:#e11d48;transform:scale(1.1);box-shadow:0 2px 8px rgba(225,29,72,.4)}
.gc-fav-btn.active{background:#e11d48;box-shadow:0 2px 6px rgba(225,29,72,.35)}
.gc-fav-btn.active i{font-weight:900}
.gc{position:relative}

/* ── Detail page actions bar ── */
.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
.detail-act-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:.2s;border:1px solid #dee4ed;background:#fff;color:#475569;text-decoration:none}
.detail-act-btn:hover{border-color:#0284c7;color:#0284c7;background:#f0f9ff}
.detail-act-btn.fav-active{border-color:#e11d48;color:#e11d48;background:#fff1f2}
.detail-act-btn.msg-btn{border-color:#0284c7;color:#0284c7;background:#f0f9ff}
.detail-act-btn.msg-btn:hover{background:#0284c7;color:#fff}

/* ── Message modal ── */
.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}

/* ── Social links block ── */
.org-socials{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.org-social-link{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:10px;font-size:13px;font-weight:600;color:#fff;text-decoration:none;transition:.2s}
.org-social-link:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.org-social-link.soc-vk{background:#0077ff}
.org-social-link.soc-ok{background:#ee8208}
.org-social-link.soc-tg{background:#26a5e4}
.org-social-link.soc-x{background:#0f1419}

/* ── Detail page action buttons ── */
.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.detail-act-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;transition:.2s;border:1px solid #dee4ed;background:#fff;color:#475569;text-decoration:none}
.detail-act-btn:hover{border-color:#94a3b8;transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.detail-act-btn.detail-fav-btn i{color:#e11d48;transition:.2s}
.detail-act-btn.detail-fav-btn.fav-active{background:rgba(225,29,72,.06);border-color:rgba(225,29,72,.25);color:#e11d48}
.detail-act-btn.detail-fav-btn.fav-active i{transform:scale(1.15)}
.detail-act-btn.msg-btn{background:#0284c7;color:#fff;border-color:#0284c7}
.detail-act-btn.msg-btn:hover{background:#0369a1;border-color:#0369a1}

/* ── Support modal ── */
#supportModal.modal{display:none;position:fixed;z-index:9999;inset:0;background:rgba(15,22,36,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:40px 16px}
#supportModal.modal.show{display:flex}
#supportModal .modal-content{position:relative;background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.22);max-width:450px;width:100%;animation:supFadeIn .25s ease}
#supportModal .close{position:absolute;top:12px;right:16px;font-size:28px;font-weight:300;color:#94a3b8;cursor:pointer;background:none;border:none;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:.15s}
#supportModal .close:hover{color:#1f2937;background:#f1f5f9}
@keyframes supFadeIn{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}