/* ============================================
   资讯页专属：头条卡 / 分类筛选
============================================ */

.news-featured {
  display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 44px; align-items: center;
  background: var(--bg-card); border: 1px solid var(--border-light);
  border-radius: var(--radius-lg); padding: 40px; overflow: hidden;
  transition: border-color .35s, transform .35s;
}
.news-featured:hover { border-color: rgba(139, 92, 246, 0.45); transform: translateY(-4px); }
.news-featured-cover { border-radius: var(--radius-md); overflow: hidden; }
.news-featured-body h2 { font-size: clamp(22px, 2.8vw, 32px); line-height: 1.4; margin: 18px 0 14px; }
.news-featured-body p { color: var(--text-secondary); font-size: 15.5px; }

.news-filter { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 40px; }
.filter-btn {
  padding: 10px 26px; border-radius: 999px; font-size: 14.5px;
  border: 1px solid var(--border-light); background: var(--bg-card); color: var(--text-secondary);
  transition: all .3s;
}
.filter-btn:hover { color: var(--text-primary); border-color: var(--border-strong); }
.filter-btn.active { background: var(--gradient-main); color: #fff; border-color: transparent; box-shadow: 0 6px 18px rgba(99, 102, 241, 0.35); }

.no-result { text-align: center; color: var(--text-muted); padding: 48px 0; }

@media (max-width: 992px) {
  .news-featured { grid-template-columns: 1fr; padding: 24px; gap: 24px; }
}

/* ===== 文章详情页 ===== */
.article-hero { padding-bottom: 40px; }
.article-hero .article-tag { margin-bottom: 18px; }
.article-title { font-size: clamp(26px, 3.2vw, 38px); line-height: 1.35; margin: 0 0 18px; max-width: none; }
.article-meta-top { justify-content: flex-start; }
.article-hero .crumbs { margin-bottom: 28px; }

.article-detail {
  max-width: 860px; margin: 0 auto; background: var(--bg-card);
  border: 1px solid var(--border-light); border-radius: 20px;
  padding: clamp(24px, 4vw, 48px);
}
.article-detail-cover { border-radius: 14px; overflow: hidden; margin-bottom: 28px; }
.article-detail-cover img { width: 100%; display: block; }
.article-lead {
  color: var(--text-secondary); font-size: 16.5px; line-height: 1.9;
  border-left: 3px solid var(--primary); padding: 4px 0 4px 16px; margin: 0 0 28px;
}
.article-content { color: var(--text-secondary); font-size: 16px; line-height: 2; }
.article-content h1, .article-content h2, .article-content h3 {
  color: var(--text-primary); line-height: 1.5; margin: 34px 0 14px; font-weight: 700;
}
.article-content h1 { font-size: 26px; } .article-content h2 { font-size: 22px; } .article-content h3 { font-size: 18px; }
.article-content p { margin: 0 0 18px; }
.article-content strong, .article-content b { color: var(--text-primary); }
.article-content a { color: var(--primary); }
.article-content ul, .article-content ol { padding-left: 24px; margin: 0 0 18px; }
.article-content li { margin-bottom: 8px; }
.article-content img { max-width: 100%; border-radius: 12px; margin: 10px auto; display: block; }
.article-content blockquote {
  margin: 20px 0; padding: 14px 18px; border-left: 3px solid var(--primary);
  background: rgba(99, 102, 241, 0.08); border-radius: 0 10px 10px 0; color: var(--text-secondary);
}
.article-content pre { background: rgba(0,0,0,.35); border: 1px solid var(--border-light); border-radius: 10px; padding: 16px; overflow-x: auto; }
.article-content code { font-family: Consolas, Monaco, monospace; font-size: 14px; }
.article-content table { border-collapse: collapse; width: 100%; margin: 18px 0; }
.article-content th, .article-content td { border: 1px solid var(--border-light); padding: 10px 14px; text-align: left; }
.article-content hr { border: none; border-top: 1px solid var(--border-light); margin: 30px 0; }

.article-back { max-width: 860px; margin: 28px auto 0; text-align: center; }
.article-back .btn { display: inline-block; padding: 12px 32px; border-radius: 999px; text-decoration: none; }