/* AVE Design Studio — облако тегов и «Рекомендуем» для /stati/ и /baza/.
   Разметку выдаёт migration/articles/tools/kb_sidebar.js. */

/* ---------- облако тегов ---------- */
.ar-cloud { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0; padding: 0; list-style: none; }
.ar-cloud li { margin: 0; padding: 0; }
.ar-cloud__t { display: inline-block; color: var(--bl-ink); font-weight: 800; line-height: 1.2; letter-spacing: -.01em; text-decoration: none; transition: color .2s, opacity .2s; }
.ar-cloud__t:hover,
.ar-cloud__t:focus-visible { color: var(--bl-red); text-decoration: none; }
.ar-cloud__t sup { top: -.75em; margin-left: 2px; color: var(--bl-muted); font-size: 10.5px; font-weight: 600; letter-spacing: 0; }
.ar-cloud__t--1, .ar-cloud__t--2 { color: #7b808b; font-weight: 600; }
.ar-cloud__t--3 { color: #3d424d; font-weight: 700; }
.ar-cloud__t.is-cur,
.ar-cloud__t[aria-pressed="true"] { color: var(--bl-red); }
.ar-cloud__t[aria-pressed="true"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ar-cloud__t.is-zero { opacity: .35; pointer-events: none; }

.ar-cloud--s { gap: 2px 10px; }
.ar-cloud--s .ar-cloud__t--1 { font-size: 13px; }
.ar-cloud--s .ar-cloud__t--2 { font-size: 14px; }
.ar-cloud--s .ar-cloud__t--3 { font-size: 15.5px; }
.ar-cloud--s .ar-cloud__t--4 { font-size: 17.5px; }
.ar-cloud--s .ar-cloud__t--5 { font-size: 20px; }

.ar-cloud--l { justify-content: center; gap: 6px 16px; }
.ar-cloud--l .ar-cloud__t--1 { font-size: 14px; }
.ar-cloud--l .ar-cloud__t--2 { font-size: 16px; }
.ar-cloud--l .ar-cloud__t--3 { font-size: 19px; }
.ar-cloud--l .ar-cloud__t--4 { font-size: 23px; }
.ar-cloud--l .ar-cloud__t--5 { font-size: 29px; }
.ar-cloud--l .ar-cloud__t sup { font-size: 11px; }

.ar-tags__all { display: inline-block; margin-top: 14px; color: var(--bl-red); font-size: 13.5px; font-weight: 700; text-decoration: none; }
.ar-tags__all:hover { text-decoration: underline; }

/* блок облака над каталогом базы и в списке статей */
.ar-tagsec { margin: 0 0 36px; padding: 30px 28px 34px; border: 1px solid var(--bl-line); border-radius: var(--bl-radius); background: #fff; text-align: center; }
.ar-tagsec__h { max-width: 660px; margin: 0 auto 22px; }
.ar-tagsec__k { display: block; margin-bottom: 8px; color: var(--bl-red); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.bl-main .ar-tagsec__t { margin: 0 0 8px; color: var(--bl-ink); font-size: 26px; font-weight: 800; line-height: 1.2; text-transform: none; }
.ar-tagsec__h p { margin: 0; color: var(--bl-muted); font-size: 14.5px; line-height: 1.5; }
.ar-tagsec--list { margin: 6px 0 30px; }

/* ---------- «Рекомендуем» ---------- */
.ar-recs__l { margin: 0; padding: 0; list-style: none; }
.ar-recs__l li { margin: 0; padding: 0; }
.ar-recs__l li + li { border-top: 1px solid #eef0f3; }
.ar-recs__l a { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; color: var(--bl-text); text-decoration: none; }
.ar-recs__l li:first-child a { padding-top: 2px; }
.ar-recs__l li:last-child a { padding-bottom: 0; }
.ar-recs__img { flex: none; width: 72px; aspect-ratio: 3 / 2; border-radius: 8px; overflow: hidden; background: #eef0f3; }
.ar-recs__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ar-recs__b { min-width: 0; }
.ar-recs__b b { display: -webkit-box; overflow: hidden; color: var(--bl-ink); font-size: 13.5px; font-weight: 700; line-height: 1.35; -webkit-line-clamp: 3; -webkit-box-orient: vertical; transition: color .2s; }
.ar-recs__b small { display: block; margin-top: 4px; color: var(--bl-muted); font-size: 12px; line-height: 1.35; }
.ar-recs__b em { color: var(--bl-red); font-style: normal; font-weight: 800; }
.ar-recs__l a:hover b,
.ar-recs__l a:focus-visible b { color: var(--bl-red); }

/* правая колонка: без внутренней прокрутки — js/kb-side.js задаёт --ar-side-top так, чтобы высокая колонка
   прокручивалась вместе со страницей и останавливалась, когда виден её низ */
@media (min-width: 992px) {
    .bl-side__in.ar-sidex { top: var(--ar-side-top, 100px); max-height: none; overflow: visible; }
}
@media (max-width: 767px) {
    .ar-tagsec { padding: 24px 16px 26px; }
    .bl-main .ar-tagsec__t { font-size: 22px; }
    .ar-cloud--l { gap: 4px 12px; }
    .ar-cloud--l .ar-cloud__t--1 { font-size: 13.5px; }
    .ar-cloud--l .ar-cloud__t--2 { font-size: 15px; }
    .ar-cloud--l .ar-cloud__t--3 { font-size: 17px; }
    .ar-cloud--l .ar-cloud__t--4 { font-size: 20px; }
    .ar-cloud--l .ar-cloud__t--5 { font-size: 24px; }
}
