/* CompanyHub — Stas-Clear. Шаблоны списков: Карточки, Лента, Компактный список, Карусель, Мозаика.
   Число колонок зависит от ширины самого списка (container queries): во вкладке профиля и на широкой странице — по-разному. */
.companyhub-list { container:companyhub-list/inline-size; margin:0 0 24px; }
.companyhub-list--profile { margin-bottom:16px; }
.companyhub-list a:focus-visible,.companyhub-list button:focus-visible,.companyhub-list__track:focus-visible { outline:3px solid var(--ch-accent,#3867d6); outline-offset:3px; }

/* Заголовок, поля, инфопанель — общие для всех шаблонов */
.companyhub-list .companyhub-list__title { margin:0; font-size:17px; line-height:1.35; overflow-wrap:anywhere; }
.companyhub-list .companyhub-list__title a { color:inherit; text-decoration:none; }
.companyhub-list .companyhub-list__title a:hover { color:var(--ch-accent,#3867d6); }
.companyhub-list__title .is_private { margin-left:6px; font-size:13px; }
.companyhub-list__field { min-width:0; color:#536174; font-size:14px; line-height:1.5; }
/* Темы оформляют поля списков по имени (.f_<поле>), иногда абсолютно — значком в углу своей карточки (neuro: .f_free_access, .f_localization).
   В шаблонах CompanyHub поля идут потоком и по ширине содержимого, а любое абсолютное остаётся внутри карточки, не улетая на обложку профиля. */
.companyhub-list__card,.companyhub-list__row,.companyhub-list__line { position:relative; }
.companyhub-list .companyhub-list__field { position:static; align-self:flex-start; max-width:100%; }
.companyhub-list__field .value>*:last-child { margin-bottom:0; }
.companyhub-list__field.ft_string .value,.companyhub-list__field.ft_text .value,.companyhub-list__field.ft_html .value { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.companyhub-list__field--left { display:flex; flex-wrap:wrap; gap:0 4px; }
.companyhub-list__label { color:#3d4a5c; font-weight:500; }
.companyhub-list__meta { display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px; margin-top:auto; padding-top:10px; border-top:1px solid #edf0f4; color:#7a8491; font-size:13px; line-height:1.35; }
.companyhub-list__meta .bar_item { display:inline-flex; align-items:center; gap:5px; margin:0; padding:0; }
.companyhub-list__meta svg { flex:none; width:12px; height:12px; fill:currentColor; opacity:.75; }
.companyhub-list__meta .time,.companyhub-list__date .time,.companyhub-list__tile-date .time { margin-left:.35em; }
.companyhub-list__meta a { color:inherit; text-decoration:none; }
.companyhub-list__meta a:hover { color:var(--ch-accent,#3867d6); }

/* Компания записи — лента «Все компании» виджета «Материалы компании». Над ссылкой-плиткой мозаики, чтобы оставалась кликабельной. */
.companyhub-list .companyhub-list__company { position:relative; z-index:2; display:inline-flex; align-self:flex-start; align-items:center; gap:7px; max-width:100%; margin:0 0 2px; color:#536174; font-size:13px; font-weight:500; line-height:1.3; text-decoration:none; }
.companyhub-list .companyhub-list__company:hover { color:var(--ch-accent,#3867d6); }
.companyhub-list__company img { flex:none; width:20px; height:20px; border-radius:5px; object-fit:contain; background:#fff; box-shadow:0 0 0 1px #e2e7ef; }
.companyhub-list__company-initial { flex:none; display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:5px; background:var(--ch-accent,#3867d6); color:#fff; font-size:11px; font-weight:700; line-height:1; }
.companyhub-list__company>span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.companyhub-list .companyhub-list__tile .companyhub-list__company { color:rgba(255,255,255,.92); }
.companyhub-list .companyhub-list__tile--text .companyhub-list__company,.companyhub-list--contain .companyhub-list__tile .companyhub-list__company { color:#536174; }
.companyhub-list__line-main { flex:1; min-width:0; }

/* Карточки (и карточки карусели) */
.companyhub-list__grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
.companyhub-list__card { display:flex; flex-direction:column; min-width:0; margin:0; overflow:hidden; border:1px solid #e2e7ef; border-radius:10px; background:#fff; }
.companyhub-list__media { flex:none; aspect-ratio:16/9; overflow:hidden; background:#f3f5f8; }
.companyhub-list__media>a { display:block; height:100%; }
.companyhub-list__media img { display:block; width:100%; height:100%; object-fit:cover; }
.companyhub-list--contain .companyhub-list__media { display:flex; align-items:center; justify-content:center; aspect-ratio:3/2; padding:18px; background:#f5f7fb; }
.companyhub-list--contain .companyhub-list__media>a { display:flex; align-items:center; justify-content:center; width:100%; }
.companyhub-list--contain .companyhub-list__media img { object-fit:contain; }
.companyhub-list .companyhub-list__media--empty { display:flex; align-items:center; justify-content:center; background:#f3f5f8; color:#c3cad4; }
.companyhub-list__media--empty svg { width:36px; height:36px; fill:currentColor; }
.companyhub-list__thumb.companyhub-list__media--empty svg { width:26px; height:26px; }
.companyhub-list__body { display:flex; flex:1; flex-direction:column; gap:8px; min-width:0; padding:14px 16px 16px; }
@container companyhub-list (min-width:480px) { .companyhub-list__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; } }
@container companyhub-list (min-width:900px) { .companyhub-list__grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; } }

/* Лента: миниатюра слева, текст справа */
.companyhub-list__rows { display:flex; flex-direction:column; }
.companyhub-list__row { display:flex; align-items:flex-start; gap:16px; min-width:0; margin:0; padding:16px 0; border-top:1px solid #edf0f4; }
.companyhub-list__row:first-child { padding-top:0; border-top:0; }
.companyhub-list__row:last-child { padding-bottom:0; }
.companyhub-list__thumb { flex:0 0 176px; aspect-ratio:3/2; overflow:hidden; border-radius:8px; background:#f3f5f8; }
.companyhub-list__thumb>a { display:block; height:100%; }
.companyhub-list__thumb img { display:block; width:100%; height:100%; object-fit:cover; }
.companyhub-list--contain .companyhub-list__thumb { display:flex; align-items:center; justify-content:center; flex-basis:112px; aspect-ratio:1; padding:10px; background:#f5f7fb; }
.companyhub-list--contain .companyhub-list__thumb>a { display:flex; align-items:center; justify-content:center; width:100%; }
.companyhub-list--contain .companyhub-list__thumb img { object-fit:contain; }
.companyhub-list__text { display:flex; flex:1; flex-direction:column; gap:6px; min-width:0; }
.companyhub-list--feed .companyhub-list__field .value { -webkit-line-clamp:2; }
.companyhub-list--feed .companyhub-list__meta { margin-top:2px; padding-top:0; border-top:0; }
@container companyhub-list (max-width:479px) {
    .companyhub-list__row { gap:12px; padding:14px 0; }
    .companyhub-list__thumb { flex-basis:96px; aspect-ratio:1; }
    .companyhub-list--contain .companyhub-list__thumb { flex-basis:80px; padding:8px; }
    .companyhub-list--feed .companyhub-list__title { font-size:15px; }
    .companyhub-list--feed .companyhub-list__field { font-size:13px; }
}

/* Компактный список: заголовок и дата */
.companyhub-list__lines { margin:0; padding:0; list-style:none; }
.companyhub-list__line { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin:0; padding:11px 0; border-top:1px solid #edf0f4; }
.companyhub-list__line:first-child { padding-top:0; border-top:0; }
.companyhub-list--compact .companyhub-list__title { flex:1; min-width:0; font-size:16px; font-weight:500; }
.companyhub-list__date { flex:none; color:#7a8491; font-size:13px; white-space:nowrap; }
.companyhub-list .companyhub-list__date .time { display:none; }
@container companyhub-list (max-width:479px) {
    .companyhub-list__line { flex-direction:column; gap:3px; }
    .companyhub-list--compact .companyhub-list__title { font-size:15px; }
}

/* Карусель: карточки в ряд, листаются стрелками, свайпом или мышью */
.companyhub-list__track { display:flex; align-items:stretch; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:2px; overscroll-behavior-x:contain; scrollbar-width:none; padding:2px 2px 6px; cursor:grab; }
.companyhub-list__track::-webkit-scrollbar { display:none; }
.companyhub-list__track.is-dragging { cursor:grabbing; scroll-snap-type:none; user-select:none; }
.companyhub-list__track>.companyhub-list__card { flex:0 0 84%; scroll-snap-align:start; }
.companyhub-list__controls { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:12px; }
.companyhub-list__controls[hidden] { display:none; }
.companyhub-list__controls output { min-width:84px; text-align:center; color:#697586; font-size:13px; }
.companyhub-list__controls button { width:40px; height:40px; padding:0; border:1px solid #e1e3e7; border-radius:9px; background:#fff; color:#263442; font-size:20px; line-height:1; cursor:pointer; }
.companyhub-list__controls button:disabled { opacity:.35; cursor:default; }
@container companyhub-list (min-width:480px) { .companyhub-list__track>.companyhub-list__card { flex-basis:calc((100% - 16px)/2.25); } }
@container companyhub-list (min-width:900px) { .companyhub-list__track>.companyhub-list__card { flex-basis:calc((100% - 32px)/3.25); } }

/* Мозаика: первая запись крупно, остальные плитками; название поверх фото */
.companyhub-list__mosaic { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.companyhub-list__mosaic--top-1 { grid-template-columns:minmax(0,1fr); }
.companyhub-list__mosaic-rest { display:flex; flex-wrap:wrap; gap:12px; margin-top:12px; }
.companyhub-list__mosaic-rest>.companyhub-list__tile { flex:1 1 calc((100% - 12px)/2); }
.companyhub-list__tile { position:relative; isolation:isolate; display:flex; flex-direction:column; justify-content:flex-end; min-width:0; min-height:140px; margin:0; overflow:hidden; border-radius:10px; background:#1f2a37; color:#fff; }
.companyhub-list__tile--big { grid-column:1/-1; min-height:0; aspect-ratio:16/10; }
.companyhub-list__mosaic--top-2 .companyhub-list__tile { aspect-ratio:4/3; min-height:0; }
.companyhub-list__tile-media { position:absolute; inset:0; z-index:-1; }
.companyhub-list__tile-media img { display:block; width:100%; height:100%; object-fit:cover; }
.companyhub-list__tile-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,23,34,0) 30%,rgba(15,23,34,.85) 100%); }
.companyhub-list__tile-text { display:flex; flex-direction:column; gap:6px; padding:14px; }
.companyhub-list .companyhub-list__tile .companyhub-list__title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; color:#fff; font-size:15px; line-height:1.3; }
.companyhub-list .companyhub-list__tile .companyhub-list__title a { color:#fff; }
.companyhub-list .companyhub-list__tile .companyhub-list__title a:hover { color:#fff; text-decoration:underline; }
/* Вся плитка — ссылка заголовка */
.companyhub-list__tile .companyhub-list__title a::after { content:""; position:absolute; inset:0; z-index:1; }
.companyhub-list .companyhub-list__tile--big .companyhub-list__title { font-size:21px; }
.companyhub-list__tile-lead { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; color:rgba(255,255,255,.88); font-size:14px; line-height:1.45; }
.companyhub-list__tile-date { color:rgba(255,255,255,.78); font-size:12px; }
.companyhub-list__tile:focus-within { outline:3px solid var(--ch-accent,#3867d6); outline-offset:2px; }
.companyhub-list__tile a:focus-visible { outline:none; }
/* Запись без картинки — светлая плитка */
.companyhub-list__tile--text { border:1px solid #e2e7ef; background:#f3f6fb; color:#263442; }
.companyhub-list .companyhub-list__tile--text .companyhub-list__title,.companyhub-list .companyhub-list__tile--text .companyhub-list__title a { color:#1f2a37; }
.companyhub-list__tile--text .companyhub-list__tile-lead,.companyhub-list__tile--text .companyhub-list__tile-date { color:#5b6778; }
/* Логотипы целиком: картинка на светлом поле, подпись снизу на белом */
.companyhub-list--contain .companyhub-list__tile { border:1px solid #e2e7ef; background:#f5f7fb; color:#263442; }
.companyhub-list--contain .companyhub-list__tile-media { position:relative; inset:auto; z-index:auto; flex:1 1 auto; min-height:84px; }
.companyhub-list--contain .companyhub-list__tile-media img { position:absolute; inset:14px; width:calc(100% - 28px); height:calc(100% - 28px); object-fit:contain; }
.companyhub-list--contain .companyhub-list__tile-media::after { display:none; }
.companyhub-list--contain .companyhub-list__tile-text { flex:none; border-top:1px solid #e2e7ef; background:#fff; padding:10px 14px; }
.companyhub-list--contain .companyhub-list__tile .companyhub-list__title,.companyhub-list--contain .companyhub-list__tile .companyhub-list__title a { color:#1f2a37; }
.companyhub-list--contain .companyhub-list__tile-lead,.companyhub-list--contain .companyhub-list__tile-date { color:#5b6778; }
@container companyhub-list (min-width:480px) {
    .companyhub-list__mosaic--top-3 { grid-template-columns:minmax(0,2fr) minmax(0,1fr); }
    .companyhub-list__mosaic--top-3 .companyhub-list__tile--big { grid-column:1; grid-row:1/span 2; aspect-ratio:auto; }
    .companyhub-list__mosaic--top-1 .companyhub-list__tile--big { aspect-ratio:21/9; }
    .companyhub-list__tile { min-height:160px; }
    .companyhub-list__mosaic-rest>.companyhub-list__tile { flex-basis:calc((100% - 24px)/3); }
}
@container companyhub-list (min-width:900px) {
    .companyhub-list__tile { min-height:200px; }
    .companyhub-list .companyhub-list__tile--big .companyhub-list__title { font-size:24px; }
}
@media (prefers-reduced-motion:no-preference) {
    .companyhub-list__tile-media img { transition:transform .3s ease; }
    .companyhub-list__tile:hover .companyhub-list__tile-media img { transform:scale(1.03); }
    .companyhub-list--contain .companyhub-list__tile:hover .companyhub-list__tile-media img { transform:none; }
}
