/* ============================================================
 * 主题 1 · 商务蓝 (Business Blue)
 * PHP 站群系统 · 前台风格主题
 * 主色 #2563eb · 背景 #f5f7fa · 卡片白 · 圆角 8px · 无衬线
 * ============================================================ */

/* ---------- 1. 主题变量 ---------- */
:root{
  --c-primary:#2563eb;
  --c-primary-2:#1d4ed8;
  --c-bg:#f5f7fa;
  --c-card:#ffffff;
  --c-text:#1f2937;
  --c-text-2:#6b7280;
  --c-line:#e5e7eb;
  --radius:8px;
  --font-head:"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
}

/* ---------- 2. 基础样式 ---------- */
*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--c-bg);
  color:var(--c-text);
  line-height:1.6;
}
a{color:var(--c-primary);text-decoration:none;}
a:hover{opacity:.85;}
ul{list-style:none;}

/* ---------- 3. 布局 ---------- */
.container{max-width:1200px;margin:0 auto;padding:0 16px;}
.main-layout{
  display:grid;
  gap:24px;
  padding:20px 0;
  align-items:start;
}
.main-layout.two-col{grid-template-columns:1fr 300px;}
.main-layout.one-col{grid-template-columns:1fr;}
.main-layout.one-col .sidebar-wrap{display:none;}
.main-content{min-width:0;}
.sidebar-wrap{display:flex;flex-direction:column;gap:16px;}

/* ---------- 4. 站点头部 ---------- */
.site-header{background:var(--c-card);}
.site-header .logo a{
  display:inline-block;
  font-family:var(--font-head);
  font-size:26px;
  font-weight:800;
  color:var(--c-text);
}
.site-header .slogan{margin-top:2px;font-size:12px;color:var(--c-text-2);}
.h-a{padding:36px 0;text-align:center;}
.h-b{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid var(--c-line);
}
.h-c{padding:10px 0;}

/* ---------- 5. 主导航 ---------- */
.main-nav{margin:0;}
.main-nav ul{list-style:none;margin:0;padding:0;}
.main-nav li{list-style:none;}
.main-nav a{
  display:inline-block;
  color:var(--c-text);
  background:var(--c-card);
  padding:8px 18px;
  border-radius:var(--radius);
  font-size:14px;
  transition:background .15s,color .15s;
}
.main-nav a:hover{opacity:1;background:var(--c-primary);color:#fff;}
.n-a ul{
  display:flex;
  gap:8px;
  background:var(--c-card);
  border-radius:var(--radius);
  padding:8px;
  margin-top:16px;
}
.n-a a{padding:8px 18px;border-radius:var(--radius);}
.n-a a.active{background:var(--c-primary);color:#fff;}
.n-b{
  background:var(--c-card);
  border-radius:var(--radius);
  padding:10px 16px;
  margin-top:16px;
}
.n-b summary{cursor:pointer;font-weight:600;}
.n-b ul{margin-top:10px;display:grid;gap:4px;}
.n-c ul{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
.n-c a{padding:6px 16px;border-radius:999px;border:1px solid var(--c-line);background:var(--c-card);}
.n-c a.active{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}

/* ---------- 6. 面包屑 / 关键词标签 ---------- */
.breadcrumb{margin:16px 0 0;font-size:13px;color:var(--c-text-2);}
.breadcrumb a{color:var(--c-text-2);}
.kw-tags{margin:12px 0;display:flex;flex-wrap:wrap;gap:8px;}
.kw-tags a{
  background:var(--c-card);
  border:1px solid var(--c-line);
  padding:4px 12px;
  border-radius:999px;
  font-size:13px;
}

/* ---------- 7. 卡片列表 ---------- */
.list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px;}
.card{
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  overflow:hidden;
  transition:transform .15s ease,box-shadow .15s ease;
}
.card:hover{box-shadow:0 6px 16px rgba(37,99,235,.12);transform:translateY(-2px);}
.card .thumb{
  height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:42px;
  font-weight:700;
  color:#fff;
  background:var(--c-primary);
}
.card:nth-child(3n+2) .thumb{background:#4f46e5;}
.card:nth-child(3n) .thumb{background:#0891b2;}
.card h3{
  padding:10px 12px 0;
  font-size:15px;
  line-height:1.5;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.card h3 a{color:var(--c-text);}
.card .meta{padding:8px 12px 12px;font-size:12px;color:var(--c-text-2);}
.card .meta .kw{color:var(--c-primary);}

/* ---------- 8. 头条 + 行列表 (list-mix) ---------- */
.list-mix{margin-top:16px;}
.featured{
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-top:3px solid var(--c-primary);
  border-radius:var(--radius);
  padding:20px;
}
.featured h2 a{font-size:20px;color:var(--c-text);}
.featured .desc{margin-top:8px;color:var(--c-text-2);font-size:14px;}
.mix-row-list{
  margin-top:16px;
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
}
.mix-row{
  display:flex;
  justify-content:space-between;
  padding:10px 16px;
  border-bottom:1px dashed var(--c-line);
}
.mix-row:last-child{border-bottom:0;}
.mix-row a{color:var(--c-text);font-size:14px;}
.mix-row .date{color:var(--c-text-2);font-size:12px;}

/* ---------- 9. 文字列表 ---------- */
.list-text{
  margin-top:16px;
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
}
.list-text li{
  display:flex;
  justify-content:space-between;
  padding:10px 16px;
  border-bottom:1px dashed var(--c-line);
}
.list-text li:last-child{border-bottom:0;}
.list-text .t a{font-size:14px;color:var(--c-text);}
.list-text .d{font-size:12px;color:var(--c-text-2);}

/* ---------- 10. 分页 ---------- */
.pagination{margin:20px 0 8px;display:flex;gap:6px;flex-wrap:wrap;}
.pagination a{
  min-width:32px;
  text-align:center;
  padding:6px 8px;
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  color:var(--c-text-2);
}
.pagination a:hover{border-color:var(--c-primary);color:var(--c-primary);}
.pagination .current{
  min-width:32px;
  text-align:center;
  padding:6px 8px;
  background:var(--c-primary);
  color:#fff;
  border-radius:var(--radius);
}

/* ---------- 11. 文章详情 ---------- */
.detail-main{
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  padding:24px;
}
.detail-main.wide{max-width:900px;}
.article-title{
  font-family:var(--font-head);
  font-size:24px;
  line-height:1.4;
  margin-bottom:12px;
}
.article-meta{
  font-size:12px;
  color:var(--c-text-2);
  border-bottom:1px solid var(--c-line);
  padding-bottom:12px;
  margin-bottom:16px;
}
.article-content{font-size:15px;line-height:1.9;}
.article-content p{margin-bottom:14px;}
.article-content img{max-width:100%;border-radius:var(--radius);}

/* ---------- 12. 相关阅读 ---------- */
.related{
  margin-top:24px;
  padding-top:16px;
  border-top:1px solid var(--c-line);
}
.related h4{margin-bottom:10px;font-size:15px;}
.related-list li{padding:6px 0;border-bottom:1px dashed var(--c-line);}
.related-list a{font-size:14px;color:var(--c-text);}
.related-list .rank-num{
  display:inline-block;
  min-width:20px;
  text-align:center;
  margin-right:8px;
  font-size:12px;
  color:var(--c-text-2);
}
.related-list li:nth-child(-n+3) .rank-num{
  color:#fff;
  background:var(--c-primary);
  border-radius:4px;
}

/* ---------- 13. 侧栏盒子 ---------- */
.side-box{
  background:var(--c-card);
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  padding:14px 16px;
}
.side-box h4{
  font-size:14px;
  padding-bottom:8px;
  border-bottom:2px solid var(--c-primary);
  margin-bottom:8px;
  display:inline-block;
}
.side-box ul li{padding:6px 0;border-bottom:1px dashed var(--c-line);font-size:13px;}
.side-box ul li:last-child{border-bottom:0;}
.side-box ul li a{color:var(--c-text);}
.side-box .rank-num{
  display:inline-block;
  min-width:18px;
  text-align:center;
  margin-right:6px;
  font-size:12px;
  color:var(--c-text-2);
}
.side-box li:nth-child(-n+3) .rank-num{
  color:#fff;
  background:var(--c-primary);
  border-radius:4px;
}

/* ---------- 14. 站点页脚 ---------- */
.site-footer{
  margin-top:32px;
  padding:24px 0;
  border-top:1px solid var(--c-line);
  font-size:12px;
  color:var(--c-text-2);
  text-align:center;
}
.site-footer .flinks{margin-bottom:10px;}
.site-footer .flinks a{margin:0 8px;color:var(--c-text-2);}
.site-footer .tip{margin-top:4px;}
.f-b{display:flex;justify-content:center;gap:16px;align-items:center;}

/* ---------- 15. 倒计时页 ---------- */
.countdown-wrap{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
}
.countdown-title{font-family:var(--font-head);font-size:26px;}
.countdown-num{
  font-size:88px;
  font-weight:800;
  color:var(--c-primary);
  margin:20px 0;
}
.countdown-tip{color:var(--c-text-2);}
.countdown-go a{
  display:inline-block;
  margin-top:16px;
  padding:10px 28px;
  background:var(--c-primary);
  color:#fff;
  border-radius:var(--radius);
  font-size:15px;
}

/* ---------- 16. 空状态 / 404 ---------- */
.empty-tip{padding:40px;text-align:center;color:var(--c-text-2);}
.notfound{
  min-height:60vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.notfound .code{
  font-size:120px;
  font-weight:800;
  color:var(--c-primary);
  line-height:1;
}
.notfound a{
  margin-top:16px;
  padding:8px 24px;
  border:1px solid var(--c-primary);
  color:var(--c-primary);
  border-radius:var(--radius);
}

/* ---------- 17. 响应式 ---------- */
@media (max-width:768px){
  .main-layout.two-col{grid-template-columns:1fr;}
  .list-grid{grid-template-columns:repeat(2,1fr);}
  .site-header .slogan{display:none;}
  .n-a ul{flex-wrap:wrap;}
}