/*
 * Верх внутренних страниц (includes/inner-top.php, решение владельца 20.10.2026): белый фон,
 * хлебные крошки, H1 раздела и плитки категорий раздела. Крошки и H1 - как в выдаче справочника
 * (dir-search.css), плитки - как «Категории» хаба (dir-hub.css), только компактнее.
 * Контейнер - общий .tus-container (1440 + поля шапки), своего max-width нет.
 */
.itop{background:#FFFFFF;color:var(--tus-ink,#1E2A32);font-family:var(--tus-font,'Onest',system-ui,sans-serif)}
.itop *,.itop *::before,.itop *::after{box-sizing:border-box}
.itop .itop__in{padding-top:28px;padding-bottom:24px}

/* Крошки - как .ids-crumbs */
.itop .itop__crumbs{font-size:14px;line-height:1.4;color:var(--tus-ink-3,#5B7385)}
.itop .itop__crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;padding:0;list-style:none}
.itop .itop__crumbs li{margin:0;padding:0}
.itop .itop__crumbs a{color:var(--tus-ink-2,#39505E);text-decoration:none}
.itop .itop__crumbs a:hover,.itop .itop__crumbs a:focus-visible{color:var(--tus-sky-text,#1F6FA6);text-decoration:underline}
.itop .itop__crumbs [aria-current]{font-weight:600;color:var(--tus-ink,#1E2A32)}
[dir="rtl"] .itop .itop__sep{display:inline-block;transform:scaleX(-1)}

/* Заголовок - как .ids-h1 */
.itop .itop__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px}
.itop .itop__h1{margin:12px 0 0;padding:0;font-family:var(--tus-font,'Onest',system-ui,sans-serif);font-size:clamp(26px,2vw,38px);line-height:1.15;font-weight:700;letter-spacing:-.02em;color:var(--tus-ink,#1E2A32);text-wrap:balance}
.itop .itop__actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.itop .itop__sub{margin:10px 0 0;max-width:72ch;font-size:16px;line-height:1.55;color:var(--tus-ink-2,#39505E)}

/* Плитки категорий раздела */
.itop .itop__nav{margin-top:20px}
.itop .itop__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.itop .itop__tiles>li{display:flex;margin:0;padding:0;min-width:0}
.itop .itop__tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;width:100%;min-height:104px;margin:0;padding:16px 10px 14px;border:1px solid var(--tus-line,#E3ECF2);border-radius:16px;background:#FFFFFF;box-shadow:none;color:var(--tus-ink,#1E2A32);font:600 14px/1.3 var(--tus-font,'Onest',system-ui,sans-serif);text-align:center;text-decoration:none;overflow-wrap:break-word;hyphens:auto;cursor:pointer;transition:border-color .15s,background-color .15s}
/* Тема красит a:hover в #dc7000 - цвет задаём и в :hover (CLAUDE.md, «Gotcha»). */
.itop .itop__tile:hover,.itop .itop__tile:focus-visible{border-color:var(--tus-orange,#F5820A);color:var(--tus-ink,#1E2A32);background:#FFFFFF;text-decoration:none}
.itop .itop__tile:focus-visible{outline:2px solid #2E86C1;outline-offset:2px}
.itop .itop__tile.is-on,.itop .itop__tile[aria-pressed="true"],.itop .itop__tile[aria-current]{border-color:var(--tus-orange,#F5820A);background:var(--tus-warm,#FFF7EC);color:var(--tus-ink,#1E2A32)}
.itop .itop__ic{display:flex;flex:0 0 48px;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--tus-orange-tint,#FDE9CF);color:var(--tus-orange-hover,#DC7000)}
.itop .itop__ic svg{display:block;width:26px;height:26px}
.itop .itop__t{display:block;max-width:100%}

.itop .itop__after{margin-top:20px}

/* Телефон: плитки одной строкой с прокруткой внутри ленты (страница вбок не едет). */
@media (max-width:640px){
  .itop .itop__in{padding-top:18px}
  .itop .itop__h1{margin-top:10px}
  .itop .itop__nav{margin-top:16px}
  .itop .itop__tiles{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 calc(-1 * var(--tus-container-pad,16px));padding:0 var(--tus-container-pad,16px) 4px;scroll-padding-inline:var(--tus-container-pad,16px)}
  .itop .itop__tiles::-webkit-scrollbar{display:none}
  .itop .itop__tiles>li{flex:0 0 auto;min-width:104px;max-width:168px;scroll-snap-align:start}
  .itop .itop__tile{min-height:96px;padding:12px 10px;font-size:13px;hyphens:manual}
  .itop .itop__ic{flex-basis:44px;width:44px;height:44px}
  .itop .itop__ic svg{width:24px;height:24px}
}

@media (prefers-reduced-motion:reduce){.itop .itop__tile{transition:none}}
html.xx-a11y-motion .itop .itop__tile{transition:none}

/* ── Встраивание в разделы ── */
/* Лента встреч: верх белый; панель фильтров больше не заходит на hero (его нет) - без подъёма и тени. */
.ibd-feed-wrapper--itop{background:#FFFFFF}
.ibd-feed-wrapper--itop .ibd-feed-fpanel{margin-top:0;box-shadow:none}
.ibd-feed-wrapper--itop .ibd-feed-main{padding-top:0}
/* Справка: поиск по вопросам - под плитками, слева; карточки тем ниже не повторяются. */
.itop .ibd-hc-search-wrap{max-width:600px;margin:0}
.ibd-hc-main .itop ~ .ibd-hc-content{padding-top:16px}
/* О проекте: якоря разделов не прячутся под шапкой. */
.ibd-ab-main [id^="ibd-ab-"]{scroll-margin-top:96px}
.ibd-ab-main .itop ~ .ibd-ab-content{padding-top:24px}
/* Документы: длинные названия («Политика конфиденциальности») - плитки шире; редакция и печать - справа от H1. */
.itop--legal .itop__tiles{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.itop .ibd-lg-meta{margin:0}
/* «Скоро» (клубы, карты): действия слева, как весь верх; блок формы ниже - без большого отступа сверху. */
.itop .ibd-cs-actions{justify-content:flex-start;margin:0}
.ibd-cs.ibd-cs--itop{padding-top:8px}