/* ====================================================================
   list_common.css — 产品 / 应用 / 案例 列表页（lists_common.htm）
   ====================================================================

   原名 list_product.css。它服务的是【一个模板、三种栏目】
   （lists_product / lists_application / lists_successcase 早已合并为
   lists_common.htm，见该文件头部说明），旧名带 "product" 名不副实，
   故随卡片类名重构一并改名。

   卡片与分页的公共基类在 components/card.css，必须早于本文件加载。
   本文件只保留两类内容：
     ① 本模板独有组件（.level2-card 族、@2700 断点）；
     ② 与 list_news.css 存在真实数值漂移、尚未裁定的部分（逐条注明）。
   漂移裁定前，请勿把 ② 里的值"顺手统一"。
   ==================================================================== */

/* ---------- 卡片基类的本模板侧 delta ---------- */
/* 静置阴影的漂移（列表页 0 2 8px / 新闻页 0 2 10px）已于 2026-09-22 裁定
   统一为 8px，单一来源在 components/card.css 的基类组规则，本文件不再重复。
   .level2-card / .item-card 各自覆写为 0 4px 14px（有意的层级差）。
   本文件与 list_news.css 之间仍存、尚未裁定的漂移只剩两项：
   ① .level1-card 悬停上浮（本文件 -4px / 新闻页 -5px）；
   ② .level1-img 的 min-height（170/18vw 对 180/20vw）。 */

/* 原「.level1-card:hover / .level2-card:hover / .item-card:hover
   → 0 8px 20px rgba(13,110,253,.2)」整条已删除，原因：
   • level2 与 item 改用自己组件里的 inset 阴影；
   • 而 level1 这一条从来就是死的 —— card.css 的 .level1-card:hover
     阴影带 !important，important 优先于普通声明、与加载顺序无关，
     它从没能赢过。保留它只会误导后人。 */

/* ---------- 一级目录大卡片：本模板侧 delta ---------- */
/* 2026-09-22 三项漂移已裁定并上收到 components/card.css 基类，本文件不再保留：
     .level1-img  min-height → clamp(180px, 20vw, 220px)（本侧 170/18vw → 180/20vw）
     .level1-info padding    → clamp(16px, 2.2vw, 30px) （本侧 14/2vw/24 → 16/2.2vw/30）
     .level1-card:hover 上浮  → translateY(-4px)         （本侧原值，不变）
   至此本文件与 list_news.css 之间不再有任何漂移，只剩下面这一条真实设计差异。 */

/* 【真设计差异，不是漂移】本模板图片不裁切：height:auto 随宽度等比缩放、
   整图完整可见；list_news 版是 height:100% + object-fit:cover（填满并裁切）。
   两种做法各有意图，未经裁定不得统一。 */
.level1-img img {
    width: 100%;
    height: auto;
}

/* =========================================
   二级目录卡片（一行两个，上下排列）
   =========================================
   仅 lists_common.htm 的 grade>0 分支渲染；新闻页无此组件
   （审计文档已确认 .level2-card 与新闻无关）。 */
.level2-card {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
    /* 【视觉加深】边框与 transition 由 card.css 顶部的公共基类提供，
       不在此重复。这里只把静置阴影从共用的 0 2 8px 普通灰投影
       提到更实的一档。 */
    box-shadow: 0 4px 14px rgba(10, 37, 64, 0.16);
}

/* 二级卡比条目卡大一档，上浮也更明显（-6px 对 -4px）；
   阴影与 .item-card 同值：inset 蓝环 + 0 12 28，与 .level1-card 同一套语言。 */
.level2-card:hover {
    transform: translateY(-6px);
    box-shadow: inset 0 0 0 1px #0d6efd, 0 12px 28px rgba(13, 110, 253, 0.25);
}

.level2-img {
    width: 100%;
    aspect-ratio: 16 / 12;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    padding: 30px 30px 0 30px;
}

.level2-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s;
}

.level2-card:hover .level2-img img {
    transform: scale(1.05);
}

.level2-info {
    padding: clamp(12px, 1.8vw, 15px);
    /* 【视觉加深】#fcfcfc 与白底差 1%，分隔线 #eaeaea 也接近隐形；
       提到 #f1f5f9 / #dfe5ee，与刚加深过的 .item-card-title 同值。 */
    background-color: #f1f5f9;
    border-top: 1px solid #dfe5ee;
}

.level2-info h4 {
    font-size: 1.2rem;
    font-weight: 600;
    /* 必须带 !important：模板 lists_common.htm 的 h4 带 Bootstrap 的 .text-dark
       （color:#212529 !important）。不加则本条与下面的悬停变蓝【从不生效】——
       实测常态色一直是 rgb(33,37,41)、悬停也不变蓝。
       与 card.css 的 .level1-info h3 是同一种病，那边已用 !important 解决。 */
    color: #0a2540 !important;
    margin-bottom: 10px;
    transition: color 0.3s;
}

.level2-card:hover .level2-info h4 {
    color: #0d6efd !important;
}

/* ---------- 条目卡：delta 已上收至 components/card.css ---------- */
/* 本卡全站只有 lists_common 一个活宿主。原先散在此处的 :hover transform
   （-4px；list_news 死副本里是 -5px）已并入 card.css 的 .item-card:hover，
   连同新补的边框 / 阴影 / inset 环 —— 避免同一组件的两态被拆在两个文件。 */

/* ---------- 分页：原 195-237 行整块已删除 ----------
   lists_common.htm 不含 {eyou:pagelist}（全站只有 lists_news.htm:96 与
   lists_tags.htm:75 有），本模板的分页样式从不生效，属死代码。
   其中与 list_news.css 逐字符相同的 4 条已并入 components/card.css；
   a/span 的 padding+radius 与 .disabled 两项因无活宿主，删除未搬。
   将来若给本模板加分页，请到 card.css 补齐这两项。 */

/* ---------- A6：无直挂内容时整块隐藏 ----------
   .product-section 由 {eyou:list pagesize="100"} + {eyou:eq typeid} 后置过滤填充。
   顶级栏目（如 /project-information/）一般没有直挂文章 → row 为空，
   但上方的 <h3>「{$typename}内容」仍会渲染，页面上留下一个只有标题的空区块。
   故用 :has() 判断 row 内是否存在元素子节点，无则连标题一起隐藏。
   不要用 :empty：模板换行会在 row 里留下空白文本节点，:empty 根本匹配不到。 */
.product-section:not(:has(.row > *)) {
    display: none;
}

/* =========================================
   Responsive
   =========================================
   本模板侧：只涉及 level1（level2 走 col-lg-6 栅格自适应，无需额外规则）。
   list_news.css 的同名断点成员不同（还含 .news-item / .news-img-box，
   且给图盒加了 height:200px），属真实差异，两份各留各的。 */
@media (max-width: 768px) {
    .level1-card {
        flex-direction: column;
    }

    .level1-img,
    .level1-info {
        width: 100%;
    }
}

@media (min-width: 2700px) {
    .level2-card {
        padding: 50px 50px 0 50px;
    }
    .level2-info h4 {
        font-size: 2rem;
    }
}