/* ==========================================================================
   东成大学 - 全站统一布局宽度 v4.0
   --------------------------------------------------------------------------
   目标：所有层级页面（二级 / 三级 / 四级 …）共用同一套「外壳宽度」，
   消除原先 900 / 1000 / 1100 / 1200 / 1240 / 1400 混用造成的宽窄不一。

   统一基准（与 academy.css 原始设计一致）：
     · ≤768px        → 100%（左右 14px，由 mobile.css 兜底）
     · 769 ~ 1919px  → 1280px
     · ≥1920px       → 1400px
     · ≥2560px       → 1520px

   外壳类名：.container / .detail-container / .header-inner / .main-container /
            .content-wrapper / .page-container / .section-inner /
            .content-area / .main-content / .page-content / .body-content 等。
   页面若直接用 body 作为外壳（body{max-width:...}），已统一改为
   max-width: var(--dc-shell)，与本文件联动。
   ========================================================================== */

:root {
    --dc-shell: 1280px;   /* 页面内容外壳宽度（唯一基准） */
    --dc-gutter: 40px;    /* 外壳左右内边距 */
}

@media (min-width: 1920px) {
    :root { --dc-shell: 1400px; }
}

@media (min-width: 2560px) {
    :root { --dc-shell: 1520px; }
}

/* ==========================================================================
   1. 窄屏覆盖
   ========================================================================== */
@media (max-width: 768px) {
    :root { --dc-gutter: 14px; }

    .container,
    .header-inner,
    .main-container,
    .content-wrapper,
    .page-container,
    .section-inner,
    .detail-container,
    .body-content {
        max-width: 100% !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .site-header .container,
    .site-header > div,
    header .container,
    header > div[style*="max-width"] {
        max-width: 100% !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .content-area,
    .main-content,
    .page-content {
        max-width: 100% !important;
    }

    /* 小屏下导航链接允许折行 */
    .nav-link,
    .nav-list a,
    .header-nav a,
    .main-nav a,
    .site-nav a,
    .nav-links a {
        white-space: normal !important;
        word-break: break-all;
    }
}

/* ==========================================================================
   2. 统一外壳宽度（桌面端唯一基准）
   ========================================================================== */

/* 2.1 通用外壳：统一宽度 + 内边距 + 居中 */
.container,
.header-inner,
.main-container,
.content-wrapper,
.page-container,
.section-inner {
    max-width: var(--dc-shell) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--dc-gutter) !important;
    padding-right: var(--dc-gutter) !important;
}

/* 2.2 各学院 header 内宽（与外壳一致） */
.site-header .container,
.site-header > div,
header .container,
header > div[style*="max-width"] {
    max-width: var(--dc-shell) !important;
    padding-left: var(--dc-gutter) !important;
    padding-right: var(--dc-gutter) !important;
}

/* 2.3 卡片式详情外壳：只统一宽度、居中，保留各自的卡片内边距 */
.detail-container {
    max-width: var(--dc-shell) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 2.4 内容区宽度（仅限宽，不强制内边距） */
.content-area,
.main-content,
.page-content,
.body-content {
    max-width: var(--dc-shell) !important;
}

/* 2.5 页脚与外壳对齐 */
.footer-inner,
.footer-content,
.footer-grid {
    max-width: var(--dc-shell) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   3. 超宽屏（1920px+）：网格只做列数自适应，不改外壳宽度
   ========================================================================== */
@media (min-width: 1920px) {
    .card-grid,
    .modules-grid,
    .tools-grid,
    .course-grid,
    .knowledge-grid,
    .grid-container {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    }

    .stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    }
}

/* ==========================================================================
   4. 4K 超宽屏（2560px+）
   ========================================================================== */
@media (min-width: 2560px) {
    .card-grid,
    .modules-grid,
    .tools-grid,
    .course-grid,
    .knowledge-grid,
    .grid-container {
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
    }

    .stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    }

    body {
        font-size: 17px;
    }

    h1 { font-size: 2.5rem !important; }
    h2 { font-size: 2rem !important; }
    h3 { font-size: 1.5rem !important; }
}

/* Hero / Banner 内容与外壳左右对齐 */
.hero,
.hero-section,
.banner {
    padding-left: max(var(--dc-gutter), calc((100% - var(--dc-shell)) / 2)) !important;
    padding-right: max(var(--dc-gutter), calc((100% - var(--dc-shell)) / 2)) !important;
}

/* ==========================================================================
   5. 通用宽屏优化
   ========================================================================== */

/* 表格在宽屏下自动扩展 */
table {
    width: 100%;
}

/* 两栏布局在宽屏下合理分配 */
.two-column,
.sidebar-layout,
.split-layout {
    gap: 40px;
}

@media (min-width: 1920px) {
    .two-column,
    .sidebar-layout,
    .split-layout {
        gap: 60px;
    }
}

/* 导航栏链接间距优化 */
@media (min-width: 1600px) {
    .main-nav a,
    .nav-links a,
    .site-nav a {
        padding: 0 18px;
    }
}

/* 底部页脚全宽，内容由 .footer-inner 对齐外壳 */
.site-footer,
footer {
    max-width: 100%;
}

/* ==========================================================================
   6. 全局修复：导航菜单文字不折行 + 子页面标题居中
   ========================================================================== */

/* 路径页面 Hero 居中：结构为 .hero > .container > .hero-eyebrow/h2/p */
.hero:has(> .container > .hero-eyebrow) .hero-eyebrow,
.hero:has(> .container > .hero-eyebrow) h2,
.hero:has(> .container > .hero-eyebrow) p {
    text-align: center !important;
}
.hero:has(> .container > .hero-eyebrow) > .container > p {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 所有导航链接禁止折行（四字菜单保持一行或两行各二字，不再出现三一拆分） */
.nav-link,
.nav-list a,
.header-nav a,
.main-nav a,
.site-nav a,
.nav-links a {
    white-space: nowrap !important;
}

/* 子学院页面 .section-head 标题居中 */
.section-head,
.section-header,
.page-head {
    text-align: center !important;
}

/* 子学院页面 Hero 标题居中（通过 hero-eyebrow 直接子元素区分子学院） */
.hero-inner:has(> .hero-eyebrow) h2 {
    text-align: center !important;
    letter-spacing: 3px !important;
    max-width: 100% !important;
}

/* 子学院页面 section-head 内 h2/h3 标题居中分散 */
.section-head h2,
.section-head h3,
.section-header h2,
.section-header h3,
.page-head h2,
.page-head h3 {
    letter-spacing: 2px !important;
}

/* 子学院页面 Hero 整体居中 */
.hero-inner:has(> .hero-eyebrow) {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

/* 子学院页面 Hero 段落下也居中 */
.hero-inner:has(> .hero-eyebrow) > p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 子学院页面 Hero 统计数字居中 */
.hero-inner:has(> .hero-eyebrow) > .hero-stats,
.hero-stats:has(> .hero-stat) {
    justify-content: center !important;
}

/* 子学院页面 Hero 中 eyebrow 标签也居中 */
.hero-inner:has(> .hero-eyebrow) .hero-eyebrow {
    display: block !important;
    text-align: center !important;
}

/* 子学院页面 section-sub 副标题居中 */
.section-sub,
.section-desc,
.page-subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 导航容器在窄屏时允许折行，但单项不折行 */
.nav-list,
.header-nav,
.site-nav,
.nav-links {
    flex-wrap: wrap !important;
    justify-content: center !important;
}

/* 下拉菜单内的链接也保持不折行 */
.dropdown-content a,
.nav-list .dropdown-content a {
    white-space: nowrap !important;
}