/*
 * assets/css/pages/knowledge.css — /knowledge/
 *
 * Только раскладка, которой нет в components.css: hero с маскотом, сетка карточек-статей,
 * отступы вокруг таблицы рубрик и пустого состояния. Только var(--am-*).
 */

.am-knowledge__hero-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--am-s-6);
}

.am-knowledge__hero-mascot {
    flex-shrink: 0;
}

.am-knowledge__hero-inner h1 {
    text-wrap: balance;
}

/* Заголовок-вопрос (GEO-требование SEO_STRUCTURE.md §3) — визуально спокойнее H2 секции,
 * чтобы не спорить с H1 за внимание на первом экране. */
.am-knowledge__lead-q {
    margin-top: var(--am-s-4);
    color: var(--am-text-muted);
    font-weight: var(--am-fw-semi);
}

.am-knowledge__rubrics-title {
    margin-top: var(--am-s-8);
}

.am-knowledge__rubrics-count {
    margin-top: var(--am-s-2);
    color: var(--am-text-subtle);
}

.am-knowledge__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--am-s-4);
    margin-top: var(--am-s-6);
}

.am-knowledge__card {
    display: flex;
    flex-direction: column;
    gap: var(--am-s-2);
    color: var(--am-text);
}

.am-knowledge__card-meta {
    color: var(--am-text-subtle);
    text-transform: uppercase;
    letter-spacing: var(--am-ls-eyebrow);
}

.am-knowledge__card-link {
    margin-top: auto;
}

.am-knowledge__empty {
    margin-top: var(--am-s-6);
}