/* 首页区块样式 —— 从 index.php 内联样式抽出，独立缓存 */
/* ================= Cosy 演示站结构复刻 ================= */
.zkh-wrap { background:#fff; }
.zkh-container { width:1320px; max-width:100%; margin:0 auto; }
.zkh-sec { padding:22px 0; }
.zkh-sec.bg-light { background:#f1f1f1; }
.zkh-sec.bg-white { background:#fff; }
.zkh-h2 { font-size:22px; font-weight:700; color:#1c1c1c; margin:0 0 14px; line-height:1.3; }
.zkh-grid { display:grid; gap:20px; }
.zkh-c4 { grid-template-columns:repeat(4, 1fr); }
.zkh-c5 { grid-template-columns:repeat(4, 1fr); }

/* 媒体框比例 */
.zkh-media, .zkh-ph { position:relative; overflow:hidden; background:#e9edf2; display:block; }
.zkh-media img { width:100%; height:100%; object-fit:cover; display:block; }
.zkh-r-16x9 { aspect-ratio:16/9; }
.zkh-r-3x2  { aspect-ratio:3/2; }
.zkh-r-1x1  { aspect-ratio:1/1; }
.zkh-r-2x1  { aspect-ratio:2/1; }
.zkh-r-4x3  { aspect-ratio:4/3; }
.zkh-ph { display:flex; flex-direction:column; align-items:center; justify-content:center; color:#b8c0cb; gap:6px; }
.zkh-ph-ico { font-size:22px; line-height:1; opacity:.75; }
.zkh-ph em { font-style:normal; font-size:12px; color:#c2cad4; }

/* 首屏：左大方图 + 右 2×2 */
.zkh-hero { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:4px; }
.zkh-big, .zkh-quad > a { padding:4px; }
.zkh-hero .zkh-big { position:relative; aspect-ratio:2/1; overflow:hidden; background:#e9edf2; }
.zkh-hero .zkh-big img { width:100%; height:100%; object-fit:cover; display:block; }
.zkh-hero .zkh-quad { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.zkh-hero .zkh-quad > a { position:relative; aspect-ratio:2/1; overflow:hidden; background:#e9edf2; display:block; }
.zkh-hero .zkh-quad img { width:100%; height:100%; object-fit:cover; display:block; }
.zkh-ov-title { position:absolute; left:0; right:0; bottom:0; padding:26px 14px 10px; background:linear-gradient(180deg,transparent,rgba(0,0,0,.75)); color:#fff; font-size:15px; font-weight:600; line-height:1.45;
	display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.zkh-big .zkh-ov-title { font-size:20px; padding:30px 18px 12px; }

/* 卡片（4 列网格） */
.zkh-card { display:block; background:transparent; }
.zkh-card .zkh-title { font-size:15px; font-weight:600; color:#1c1c1c; line-height:1.5; margin:10px 0 6px;
	display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:45px; }
.zkh-card:hover .zkh-title { color:#2f6bff; }
.zkh-meta { font-size:12px; color:#9aa4b2; display:flex; gap:12px; }

/* 分类区块：1/4 大卡 + 3/4 小卡网格 */
.zkh-split { display:grid; grid-template-columns:1fr 3fr; gap:20px; align-items:start; }
.zkh-split.rev { grid-template-columns:3fr 1fr; }
.zkh-split.rev .zkh-split-side { order:2; }
.zkh-split.rev .zkh-split-main { order:1; }
.zkh-split-side .zkh-media, .zkh-split-side .zkh-ph { aspect-ratio:3/2; }
.zkh-split-main { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; }

/* 2 列横排卡片 */
.zkh-h2col { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.zkh-hrow { display:flex; gap:16px; align-items:center; background:#fff; padding:25px 18px; }
.zkh-hrow .zkh-hrow-text { flex:1; min-width:0; }
.zkh-hrow .zkh-title { margin:0 0 8px; }
.zkh-hrow .zkh-media, .zkh-hrow .zkh-ph { width:120px; flex:0 0 120px; aspect-ratio:4/3; }

/* overlay 小卡行 */
.zkh-topic a { position:relative; display:block; }
.zkh-topic .zkh-topic-title { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:17px; font-weight:700;
	text-shadow:0 1px 6px rgba(0,0,0,.45); background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.35)); }
@media (max-width:1340px) { .zkh-container { width:100%; padding:0 12px; } }
@media (max-width:900px) {
	.zkh-hero, .zkh-split, .zkh-split.rev, .zkh-h2col { grid-template-columns:1fr; }
	.zkh-c4, .zkh-split-main { grid-template-columns:repeat(2, 1fr); }
}

/* ===== 手机端：缩短页面 ===== */
@media (max-width:768px) {
	/* 每个分类栏目只展示前 4 篇（其余不删，仅隐藏，桌面端不受影响） */
	body.home .zkh-split-main > a:nth-child(n+5) { display:none; }
	/* 「最新内容」手机上只展示前 8 篇（16 → 8） */
	body.home .zkh-sec:not(.bg-light):not(.bg-white) .zkh-grid.zkh-c4 > .zkh-card:nth-child(n+9) { display:none; }
	/* 首屏右侧 2×2 在手机上压成一行两列，省一屏高度 */
	.zkh-hero .zkh-quad { grid-template-columns:1fr 1fr; }
	.zkh-hero .zkh-big { aspect-ratio:16/9; }
	.zkh-h2 { font-size:19px; }
	.zkh-sec { padding:16px 0; }
	.zkh-grid { gap:14px; }
	/* 快讯列表在手机上更紧凑 */
	.zkh-hrow { padding:16px 12px; gap:12px; }
	.zkh-hrow .zkh-media, .zkh-hrow .zkh-ph { width:96px; flex:0 0 96px; }
	/* 热门阅读手机上 8 → 4 条 */
	body.home .zkh-sec.bg-light .zkh-grid.zkh-c4 > .zkh-card:nth-child(n+5) { display:none; }
}

