@charset "utf-8";
/* 592下载站 PC —— 专题(special) 列表页 / 内容页
   注意：本文件必须独立于模板（PHPCMS 模板引擎会把 CSS 里的裸 {..} 误解析为模板标签）。 */

/* ============ 专题网格（列表页，4 列） ============ */
.zt-grid { padding: 20px 10px 4px; }
.zt-grid ul { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.zt-grid li { width: 25%; box-sizing: border-box; padding: 0 10px; margin-bottom: 20px; }
.zt-grid li a {
    display: block; background: #fff; border: 1px solid #eef0f2;
    border-radius: 8px; overflow: hidden; transition: all .25s;
}
.zt-grid li a:hover {
    border-color: #1fbd7a; box-shadow: 0 8px 20px rgba(31,189,122,.16);
    transform: translateY(-3px);
}
/* 专题缩略图多为 2.2:1 横版带字图，用 contain 保证图片文字不被裁切 */
.zt-grid .zt-pic { width: 100%; height: 158px; overflow: hidden; background: #f4f5f7; }
.zt-grid .zt-pic img {
    width: 100%; height: 100%; object-fit: contain; display: block;
    transition: transform .4s;
}
.zt-grid li a:hover .zt-pic img { transform: scale(1.06); }
.zt-grid .zt-name {
    font-size: 14px; line-height: 20px; height: 20px; margin: 12px 12px 14px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: #333; text-align: center;
}
.zt-grid li a:hover .zt-name { color: #1fbd7a; }

/* 列表页分页：当前页高亮（PHPCMS 用 <span> 表示当前页） */
.xz-page.zt-page-wrap { margin: 0 20px; }
.xz-page.zt-page-wrap span {
    background: #1fbd7a; border-color: #1fbd7a; color: #fff;
}

/* ============ 内容页：专题头图 + 简介 ============ */
.spec-hero {
    display: flex; background: #fff; border-radius: 10px; overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.05); margin-bottom: 20px;
}
.spec-hero .sh-img { flex: 0 0 340px; }
.spec-hero .sh-img img {
    width: 100%; height: 100%; min-height: 240px; object-fit: cover; display: block;
}
.spec-hero .sh-info {
    flex: 1; padding: 26px 28px; display: flex; flex-direction: column;
    justify-content: center;
}
.spec-hero .sh-info h1 { font-size: 24px; color: #222; margin-bottom: 14px; line-height: 1.35; }
.spec-hero .sh-desc { font-size: 14px; line-height: 1.9; color: #666; max-height: 200px; overflow: hidden; }

/* ============ 内容页：热门专题（6 列） ============ */
.zt-hot { padding: 20px 12px 4px; }
.zt-hot ul { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.zt-hot li { width: 16.6667%; box-sizing: border-box; padding: 0 8px; margin-bottom: 16px; }
.zt-hot li a {
    display: block; background: #fff; border: 1px solid #eef0f2;
    border-radius: 8px; overflow: hidden; transition: all .25s;
}
.zt-hot li a:hover {
    border-color: #1fbd7a; box-shadow: 0 6px 16px rgba(31,189,122,.14);
    transform: translateY(-2px);
}
.zt-hot .zh-pic { width: 100%; height: 100px; overflow: hidden; background: #f4f5f7; }
.zt-hot .zh-pic img {
    width: 100%; height: 100%; object-fit: contain; display: block;
    transition: transform .4s;
}
.zt-hot li a:hover .zh-pic img { transform: scale(1.06); }
.zt-hot .zh-name {
    font-size: 13px; line-height: 18px; height: 18px; margin: 10px 8px 12px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: #333; text-align: center;
}
.zt-hot li a:hover .zh-name { color: #1fbd7a; }

/* ============ 内容页：合集应用（横排 3 条） ============
   与列表页全局 .xz-list 隔离，避免 width:100% 整行被复用。 */
.zt-apps {
    display: flex; flex-wrap: wrap; gap: 16px 18px;
    padding: 18px 10px 6px; list-style: none;
}
.zt-apps > li {
    width: calc((100% - 36px) / 3);
    box-sizing: border-box;
    display: flex; align-items: center; gap: 12px;
    background: #fff; border: 1px solid #eef0f2; border-radius: 10px;
    padding: 14px; transition: all .25s;
}
.zt-apps > li:hover {
    border-color: #1fbd7a; box-shadow: 0 6px 16px rgba(31,189,122,.14);
    transform: translateY(-2px);
}
.zt-apps .l-ico {
    flex: 0 0 64px; width: 64px; height: 64px; border-radius: 14px; overflow: hidden;
}
.zt-apps .l-ico img { width: 64px; height: 64px; object-fit: cover; display: block; transition: transform .3s; }
.zt-apps > li:hover .l-ico img { transform: scale(.92); }
.zt-apps .l-info { flex: 1 1 0%; min-width: 0; }
.zt-apps .l-info h3 {
    font-size: 15px; line-height: 24px; height: 24px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; font-weight: bold;
}
.zt-apps .l-info h3 a { color: #333; }
.zt-apps .l-info h3 a:hover { color: #1fbd7a; }
.zt-apps .l-info .l-meta { font-size: 12px; color: #a8a8a8; margin-top: 6px; }
.zt-apps .l-act { flex: 0 0 auto; }
.zt-apps .l-act .xz-btn { margin: 0; }

/* 内容页第二个标题降级为 h2（合集→列表），复用 .c-head 绿色标题+绿条样式，仅专题页生效 */
.c-head h2 {
    float: left; font-size: 20px; font-weight: bold; color: #1fbd7a;
}
.c-head h2:before {
    content: ''; float: left; width: 5px; height: 24px; background: #1fbd7a;
    margin: 14px 12px 0 0;
}

@media (max-width: 900px) {
    .zt-apps > li { width: calc((100% - 18px) / 2); }
}
@media (max-width: 560px) {
    .zt-apps > li { width: 100%; }
}

@media (max-width: 768px) {
    .spec-hero { flex-direction: column; }
    .spec-hero .sh-img { flex: none; }
    .spec-hero .sh-img img { min-height: auto; }
}