/* ============================================================================
   分组栏目落地页版面
   ----------------------------------------------------------------------------
   分组栏目（CategoryType = 1：航校概况 / 飞行训练 / 对外公告）本身没有直属内容，
   落地页的作用是把子栏目逐行摆出来，每行带一段该栏目的内容摘要。

   与首页的入口卡（home.css 的 .home-entry-card）刻意分开写：两处的卡片密度与留白要求不同，
   共用一套样式反而要写一堆覆盖规则。

   颜色一律引用 variables.css 的变量，不写字面色值。
   ========================================================================= */

.group-layout {
    padding-block: 56px 80px;
}

/* ── 子栏目行 ──────────────────────────────────────────────────────────── */

/* 一行一个子栏目：左侧栏目名、中间内容摘要、右侧「了解更多」。
   早先是并排的入口卡，只有栏目名，页面没有可读信息 —— 见 docs/05 落地页口径。

   ⚠️ 行高不靠 min-height 撑：摘要行数随内容变，写死高度要么留白要么溢出。 */
.entry-rows {
    border-top: 1px solid var(--border-light);
}

.entry-row {
    display: grid;
    /* 第一列固定：栏目名长短不一，固定宽度才能让摘要左边缘对齐成一列 */
    grid-template-columns: 200px minmax(0, 1fr) auto;
    align-items: start;
    gap: 32px;
    padding-block: 28px;
    border-bottom: 1px solid var(--border-light);
}

.entry-row__name {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 0.01em;
    transition: color var(--transition);
}

.entry-row__desc {
    color: var(--text-muted);
    font-size: 15px;
    line-height: 1.8;
}

.entry-row__more {
    color: var(--text-faint);
    font-size: 13px;
    letter-spacing: 0.04em;
    white-space: nowrap;
    transition: color var(--transition);
}

.entry-row:hover .entry-row__name,
.entry-row:hover .entry-row__more {
    color: var(--brand);
}

/* ── 响应式 ────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .group-layout {
        padding-block: 40px 64px;
    }

    /* 窄屏三列挤不下：改成纵向堆叠，栏目名 → 摘要 → 了解更多 */
    .entry-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        padding-block: 24px;
    }

    .entry-row__name {
        font-size: 18px;
    }

    .entry-row__desc {
        font-size: 14px;
    }
}