/* ===== sections/hubs.css ===== */
/* Хабы тем журнала (/tema/<тема>/, SEO-ПЛАН П-У4) поверх стилей журнала (journal.css): вступление, «Начните с этого», список статей.
   Тема: templates/topic.php, inc/hubs.php. Шапка, карточки, .help__list и список статей — готовые компоненты журнала. */
.hub-intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--cg); row-gap: var(--s-4); align-items: start; padding-top: clamp(56px, 6vw, 96px); border-top: 1px solid var(--rule); }
.hub-intro__k { grid-column: 1 / span 3; color: var(--ivory); }
.hub-intro__body { grid-column: 5 / span 7; min-width: 0; max-width: 66ch; font: var(--t-body); color: var(--ivory-2); }
.hub-intro__body > * + * { margin-top: 1em; }
.hub-intro__body > p:first-child { font: var(--t-lede); color: var(--ivory); }
.hub-intro__body a { color: var(--ivory); background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; padding-bottom: 1px; transition: background-size .6s var(--slow); }
.hub-intro__body a:hover { background-size: 0 1px; background-position: 100% 100%; }
.hub-start .sec-head, .hub-res .sec-head { margin-bottom: clamp(32px, 3.4vw, 56px); }
.hub-res { padding-top: 0; }
.hub-all { padding-bottom: var(--room); }
.hub-list { padding-top: clamp(24px, 3vw, 48px); }
@media (max-width: 959px) {
  .hub-intro__k, .hub-intro__body { grid-column: 1 / -1; }
}