/* icbcom.ru — страницы категорий каталога (шаблоны 44 «Категория — раздел», 45 «Категория — подраздел»).
   2x2 Digital Agency, 15.11.2026, v1.3. Работает поверх /assets/css/sol-page.css (токены .sol, кнопки, final-cta).
   Все правила только под .sol.cat, классы с префиксом cat-. После каждой открывающей скобки — пробел (Fenom). */

/* ---------- первый экран: компактный, фон как у страниц решений ---------- */
.sol.cat .cat-hero{ position:relative;padding:20px 0 24px;background:var(--primary-soft);border-bottom:1px solid var(--border)}
.sol.cat .cat-crumbs{ display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;list-style:none;margin:0 0 12px;padding:0;font-size:13px;line-height:1.4;color:var(--text-muted)}
.sol.cat .cat-crumbs li{ display:inline-flex;align-items:center;gap:8px;margin:0;padding:0}
.sol.cat .cat-crumbs li + li::before{ content:"/";color:var(--icb-grey-400, #9B9C9E)}
.sol.cat .cat-crumbs a{ color:var(--text-muted);text-decoration:none}
.sol.cat .cat-crumbs a:hover{ color:var(--primary)}
.sol.cat .cat-hero-row{ display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:wrap}
.sol.cat .cat-hero h1{ flex:1 1 520px;min-width:0;max-width:880px;margin:0;font-size:clamp(22px,2.3vw,30px);font-weight:700;line-height:1.2;letter-spacing:-.01em;color:var(--text)}
.sol.cat .cat-hero-ctas{ display:flex;flex-wrap:wrap;gap:10px;flex:none}
.sol.cat .cat-hero-ctas .sol-btn{ padding:11px 20px}

/* ---------- плитки подразделов (без заголовка «Подразделы») ---------- */
.sol.cat .cat-tiles-sec{ padding:28px 0 0}
.sol.cat .cat-sections{ display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sol.cat .cat-section{ display:flex;align-items:center;gap:14px;min-height:76px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;color:var(--text);text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease}
.sol.cat .cat-section:hover{ border-color:var(--primary);box-shadow:var(--shadow-md);color:var(--text)}
.sol.cat .cat-section .ph{ flex:none;width:64px;height:64px;border-radius:10px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden}
.sol.cat .cat-section .ph img{ width:100%;height:100%!important;object-fit:contain;padding:4px}
.sol.cat .cat-section .txt{ display:flex;flex-direction:column;min-width:0}
.sol.cat .cat-section .h{ font-size:15px;font-weight:600;line-height:1.35;margin:0 0 4px;color:var(--text)}
.sol.cat .cat-section .cnt{ font-size:13px;color:var(--text-muted)}
.sol.cat .cat-section .sub{ display:block;font-size:12.5px;line-height:1.4;color:var(--primary-dark);margin-top:4px}

/* ---------- каталог ---------- */
.sol.cat .cat-catalog{ padding:32px 0 56px}
.sol.cat .cat-catalog .sol-section-title{ margin:0 0 20px}
.sol.cat .cat-toolbar{ display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;padding:0 0 14px;margin:0 0 20px;border-bottom:1px solid var(--border)}
.sol.cat .cat-total{ font-size:14px;color:var(--text-muted)}

/* сетка: раздел — 5 в ряд без фильтра; подраздел — фильтр + 4 в ряд. Карточка 1:1 с «Популярными позициями» на главной */
.sol.cat .cat-grid{ display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.sol.cat #mse2_results.cat-grid{ display:grid;justify-content:stretch;flex-wrap:nowrap;margin:0}
.sol.cat .cat-layout{ display:grid;grid-template-columns:216px minmax(0,1fr);gap:20px;align-items:start}
.sol.cat .cat-layout .cat-grid{ grid-template-columns:repeat(4,minmax(0,1fr))}
.sol.cat .cat-layout.cat-layout--nofilter{ grid-template-columns:minmax(0,1fr)}
.sol.cat .cat-layout.cat-layout--nofilter .cat-side{ display:none}
.sol.cat .cat-layout.cat-layout--nofilter .cat-grid{ grid-template-columns:repeat(5,minmax(0,1fr))}

.sol.cat .cat-card{ display:flex;flex-direction:column;position:relative;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin:0;transition:border-color .2s ease,box-shadow .2s ease}
.sol.cat .cat-card:hover{ border-color:var(--primary);box-shadow:var(--shadow-md)}
.sol.cat .cat-card .pic{ position:relative;display:block;aspect-ratio:5/4;background:#fff;border-bottom:1px solid var(--border);overflow:hidden}
.sol.cat .cat-card .pic img{ position:absolute;inset:0;z-index:0;width:100%;height:100%!important;max-width:none;padding:10px 12px;object-fit:contain;margin:0}
.sol.cat .cat-card .body{ display:flex;flex-direction:column;gap:8px;padding:12px 14px 14px;flex:1}
.sol.cat .cat-card .ttl{ font-size:14px;font-weight:600;line-height:1.35;margin:0;overflow-wrap:break-word;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;text-align:left}
.sol.cat .cat-card .ttl a{ color:var(--text);text-decoration:none}
.sol.cat .cat-card .ttl a:hover{ color:var(--primary)}
.sol.cat .cat-card .act{ margin-top:auto}
.sol.cat .cat-card .sol-btn{ width:100%;min-height:44px;justify-content:center;padding:10px 20px;font-size:15px;box-shadow:none}

/* плашки (product__new / sert=3 / sert=2) — текстом, яркие */
.sol.cat .cat-badges{ position:absolute;top:12px;left:12px;right:12px;z-index:1;display:flex;flex-wrap:wrap;gap:6px;pointer-events:none}
.sol.cat .cat-badge{ display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:3px;font:700 12px/18.6px var(--icb-font);white-space:nowrap}
.sol.cat .cat-badge svg{ flex:none;width:13px;height:13px}
.sol.cat .cat-badge--new{ background:#C2410C;color:#fff}
.sol.cat .cat-badge--cert{ background:var(--primary);color:#fff}
.sol.cat .cat-badge--soon{ background:#FFC53D;color:#3D2E00}

/* боковой фильтр (mFilter2) */
.sol.cat .cat-side{ position:sticky;top:72px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px}
.sol.cat .cat-side-title{ font-size:17px;font-weight:700;margin:0 0 12px;color:var(--text)}
.sol.cat .cat-fgroup{ border:0;border-top:1px solid var(--border);margin:0;padding:12px 0 0;min-width:0}
.sol.cat .cat-fgroup legend{ float:left;width:100%;border:0;margin:0 0 4px;padding:0;font-size:15px;font-weight:600;line-height:1.4;color:var(--text)}
.sol.cat .cat-opts{ clear:both;display:flex;flex-direction:column;gap:2px;padding:4px 0}
.sol.cat .cat-opt{ display:flex;align-items:center;gap:10px;min-height:40px;padding:0 8px;margin:0 -8px;border-radius:8px;font-size:14px;font-weight:400;line-height:1.3;color:var(--text);cursor:pointer}
.sol.cat .cat-opt:hover{ background:var(--primary-soft)}
.sol.cat .cat-opt.disabled{ opacity:.45;cursor:default}
.sol.cat .cat-opt input{ flex:none;width:18px;height:18px;margin:0;accent-color:var(--primary)}
.sol.cat .cat-opt span{ flex:1}
.sol.cat .cat-opt sup,.sol.cat .cat-opt small{ font-size:13px;color:var(--text-muted);top:0}
.sol.cat .cat-side-btns{ display:flex;gap:8px;margin-top:16px}
.sol.cat .cat-side-btns .sol-btn{ flex:1;justify-content:center;padding:10px 12px;font-size:14px}
.sol.cat .cat-side .mse2_number_inputs,.sol.cat .cat-side .mse2_number_slider{ margin:8px 0}

/* пагинация (pdoPage / mFilter2: ul.pagination) */
.sol.cat .cat-more{ margin-top:32px}
.sol.cat .cat-more .pagination{ display:flex;gap:6px;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0;border-radius:0}
.sol.cat .cat-more .pagination > li{ display:block;margin:0;padding:0}
.sol.cat .cat-more .pagination > li > a,.sol.cat .cat-more .pagination > li > span{ float:none;display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;margin:0;padding:0 14px;border:1px solid var(--border);border-radius:var(--radius)!important;font-size:14.5px;font-weight:500;line-height:1;color:var(--text);background:var(--bg);text-decoration:none}
.sol.cat .cat-more .pagination > li > a:hover{ border-color:var(--primary);color:var(--primary);background:var(--bg)}
.sol.cat .cat-more .pagination > .active > a,.sol.cat .cat-more .pagination > .active > a:hover{ background:var(--primary);border-color:var(--primary);color:var(--text-inv)}
.sol.cat .cat-more .pagination > .disabled{ display:none}

/* SEO-текст раздела (старые тексты, свёрнуты) */
.sol.cat .cat-about{ padding:56px 0;border-top:1px solid var(--border)}
.sol.cat .cat-seo{ max-width:880px;position:relative;color:var(--text);font-size:15.5px;line-height:1.65}
.sol.cat .cat-seo.is-collapsed{ max-height:420px;overflow:hidden}
.sol.cat .cat-seo.is-collapsed::after{ content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(rgba(255,255,255,0),#fff)}
.sol.cat .cat-seo h1,.sol.cat .cat-seo h2{ font-size:24px;font-weight:700;line-height:1.25;margin:32px 0 12px;color:var(--text)}
.sol.cat .cat-seo h3,.sol.cat .cat-seo h4{ font-size:19px;font-weight:700;line-height:1.3;margin:28px 0 10px;color:var(--text)}
.sol.cat .cat-seo > :first-child{ margin-top:0}
.sol.cat .cat-seo p,.sol.cat .cat-seo li{ font-size:15.5px;line-height:1.65;color:var(--text);text-align:left;font-family:var(--icb-font)}
.sol.cat .cat-seo p{ margin:0 0 14px}
.sol.cat .cat-seo ul,.sol.cat .cat-seo ol{ margin:0 0 16px;padding-left:22px}
.sol.cat .cat-seo li{ margin:0 0 6px}
.sol.cat .cat-seo a{ color:var(--primary)}
.sol.cat .cat-seo img{ max-width:100%;height:auto}
.sol.cat .cat-seo table{ width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:14px}
.sol.cat .cat-seo th,.sol.cat .cat-seo td{ border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top}
.sol.cat .cat-seo-more{ margin-top:16px}

/* вопросы и ответы (TV faq) */
.sol.cat .cat-faq-sec{ padding:56px 0;background:var(--bg-alt, #F6F7F8)}
.sol.cat .cat-faq{ display:flex;flex-direction:column;gap:12px;max-width:880px}
.sol.cat .cat-faq details{ background:var(--bg);border:1px solid var(--border);border-radius:var(--radius)}
.sol.cat .cat-faq summary{ display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-size:16px;font-weight:600;line-height:1.4;cursor:pointer;list-style:none;min-height:44px}
.sol.cat .cat-faq summary::-webkit-details-marker{ display:none}
.sol.cat .cat-faq summary::after{ content:"";flex:none;width:10px;height:10px;border-right:2px solid var(--primary);border-bottom:2px solid var(--primary);transform:rotate(45deg);margin-top:-4px;transition:transform .15s}
.sol.cat .cat-faq details[open] summary::after{ transform:rotate(-135deg);margin-top:4px}
.sol.cat .cat-faq .ans{ padding:0 22px 20px;font-size:15px;color:var(--text-muted);line-height:1.6}
.sol.cat .cat-faq .ans p{ margin:0 0 8px;text-align:left}

@media (max-width:1240px){
  .sol.cat .cat-layout .cat-grid{ grid-template-columns:repeat(3,minmax(0,1fr))}
  .sol.cat .cat-grid,.sol.cat .cat-layout.cat-layout--nofilter .cat-grid{ grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:1024px){
  .sol.cat .cat-grid,.sol.cat .cat-layout .cat-grid,.sol.cat .cat-layout.cat-layout--nofilter .cat-grid{ grid-template-columns:repeat(3,minmax(0,1fr))}
  .sol.cat .cat-layout{ grid-template-columns:200px minmax(0,1fr)}
  .sol.cat .cat-sections{ grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .sol.cat .cat-hero{ padding:14px 0 18px}
  .sol.cat .cat-hero-ctas{ width:100%}
  .sol.cat .cat-hero-ctas .sol-btn{ flex:1;justify-content:center;padding:10px 12px;white-space:normal;text-align:center}
  .sol.cat .cat-grid,.sol.cat .cat-layout .cat-grid,.sol.cat .cat-layout.cat-layout--nofilter .cat-grid{ grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sol.cat .cat-layout{ grid-template-columns:1fr}
  .sol.cat .cat-side{ position:static}
  .sol.cat .cat-sections{ grid-template-columns:1fr;gap:10px}
  .sol.cat .cat-tiles-sec{ padding-top:18px}
  .sol.cat .cat-catalog{ padding:24px 0 40px}
  .sol.cat .cat-card .body{ padding:12px 12px 14px}
  .sol.cat .cat-card .sol-btn{ font-size:13.5px;padding:10px 8px;white-space:normal}
  .sol.cat .cat-about,.sol.cat .cat-faq-sec{ padding:40px 0}
}

/* v1.2 (15.11): мобильная сетка не распирается содержимым фильтра; плашки переносятся в узких карточках */
@media (max-width:1024px){
  .sol.cat .cat-badge{ white-space:normal;max-width:100%;line-height:1.3}
}
@media (max-width:720px){
  .sol.cat .cat-layout,.sol.cat .cat-layout.cat-layout--nofilter{ grid-template-columns:minmax(0,1fr)}
  .sol.cat .cat-side,.sol.cat .cat-main{ min-width:0}
  .sol.cat .cat-opt span{ min-width:0;overflow-wrap:anywhere}
  .sol.cat .cat-badges{ top:8px;left:8px;right:8px;gap:4px}
  .sol.cat .cat-badge{ font-size:11.5px;padding:3px 7px}
  .sol.cat .cat-more .pagination > li > a{ min-width:40px;height:40px;padding:0 10px}
}

/* v1.3 (15.11): страницы «Решения» на шаблонах 46/47 — секции хаба и карточки страниц-решений */
.sol.cat .sol-hub-sec{ padding:32px 0 8px}
.sol.cat .sol-hub-sec:last-child{ padding-bottom:56px}
.sol.cat .sol-hub-sec .sol-section-title{ margin:0 0 20px}
.sol.cat .sol-hub-sec .sol-section-title a{ color:var(--text);text-decoration:none}
.sol.cat .sol-hub-sec .sol-section-title a:hover{ color:var(--primary)}
.sol.cat .sol-card .pic img{ padding:8px}
@media (max-width:720px){
  .sol.cat .sol-hub-sec{ padding:24px 0 4px}
}