/* ============================================================
   detail.css - 详情页样式
   ============================================================ */
.detail-hero{
  background:var(--dark);background-size:cover;background-position:center;
  padding:180px 0 80px;position:relative;
}
.detail-hero .container{position:relative;z-index:1;}
.detail-hero .breadcrumb{color:rgba(255,255,255,0.5);font-size:14px;margin-bottom:16px;}
.detail-hero .breadcrumb a{color:rgba(255,255,255,0.5);}
.detail-hero .breadcrumb a:hover{color:var(--accent);}
.detail-meta{display:flex;align-items:center;gap:16px;margin-bottom:16px;}
.detail-cat{background:var(--primary);color:#fff;font-size:12px;font-weight:600;padding:4px 12px;border-radius:100px;}
.detail-date{color:rgba(255,255,255,0.5);font-size:14px;}
.detail-title{font-size:clamp(26px,4vw,40px);font-weight:800;color:#fff;line-height:1.3;margin-bottom:20px;max-width:800px;}
.detail-tags{display:flex;flex-wrap:wrap;gap:8px;}
.tag-item{background:rgba(255,255,255,0.1);color:rgba(255,255,255,0.7);font-size:13px;padding:6px 14px;border-radius:100px;border:1px solid rgba(255,255,255,0.15);}

/* 详情主体 */
.detail-body{padding:60px 0;background:#fff;}
.detail-content{max-width:800px;margin:0 auto;}
.detail-content h2{font-size:20px;font-weight:700;color:var(--text);margin:36px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--primary);}
.detail-content p{font-size:15px;line-height:1.9;color:var(--text);margin-bottom:16px;}
.detail-content ul{margin:16px 0;}
.detail-content li{font-size:14px;line-height:1.8;color:var(--text-muted);margin-bottom:10px;padding-left:22px;position:relative;}
.detail-content li::before{content:'•';color:var(--primary);font-weight:bold;position:absolute;left:0;}

/* 成果卡片 */
.detail-result{max-width:800px;margin:48px auto 0;}
.result-card{display:flex;align-items:center;gap:20px;background:linear-gradient(135deg,rgba(26,109,255,0.08),rgba(0,201,167,0.08));border:1px solid rgba(26,109,255,0.15);border-radius:var(--radius);padding:24px 28px;}
.result-icon{font-size:36px;}
.result-label{font-size:13px;color:var(--text-muted);margin-bottom:4px;}
.result-value{font-size:20px;font-weight:700;color:var(--primary);}

/* 相关推荐 */
/* 详情页推荐区块收紧顶部间距：全站.section为96px，但详情页正文/导航下方已有缓冲，叠加后"更多资讯"标签悬空 */
#relatedSection{padding-top:64px;}
.related-cases{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;}
.news-related-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;}
/* 详情页推荐卡片化：覆盖全局横条列表样式，图上文下卡片，与相关案例网格统一 */
.news-related-list .news-item{display:flex;flex-direction:column;background:#fff;border:1px solid var(--gray-2);border-radius:var(--radius);overflow:hidden;padding:0;transition:0.3s;}
.news-related-list .news-item:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.08);margin:0;padding:0;border-radius:var(--radius);}
.news-related-list .news-item-img{width:100%;height:170px;border-radius:0;}
.news-related-list .news-item-body{padding:18px 20px 20px;justify-content:flex-start;}

/* 新闻详情 */
.news-detail-hero{background:var(--dark);padding:180px 0 60px;}
.news-detail-meta{display:flex;align-items:center;gap:16px;color:rgba(255,255,255,0.6);font-size:14px;margin-bottom:20px;}
.news-detail-title{font-size:clamp(26px,4vw,40px);font-weight:800;color:#fff;line-height:1.3;max-width:800px;}
.news-detail-cover{max-width:900px;margin:40px auto 0;border-radius:var(--radius);overflow:hidden;}
.news-detail-cover img{width:100%;height:auto;}
.news-detail-body{max-width:800px;margin:0 auto;padding:48px 24px;}
.news-detail-body p{font-size:15px;line-height:1.9;color:var(--text);margin-bottom:20px;}
.news-detail-body h2{font-size:19px;font-weight:700;margin:32px 0 14px;color:var(--text);}

/* 上下篇导航 */
.detail-nav{display:flex;justify-content:space-between;gap:16px;max-width:800px;margin:40px auto 36px;padding-top:28px;border-top:1px solid var(--gray-2);}
.detail-nav a{display:flex;flex-direction:column;gap:6px;padding:16px 20px;background:var(--gray);border:1px solid transparent;border-radius:var(--radius);flex:1;min-width:0;transition:0.3s;}
.detail-nav a:hover{background:#fff;border-color:var(--primary);transform:translateY(-2px);}
.detail-nav-label{font-size:12px;color:var(--text-muted);}
.detail-nav-title{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

@media(max-width:640px){
  .detail-hero{padding:140px 0 48px;}
  .result-card{flex-direction:column;text-align:center;}
  .detail-nav{flex-direction:column;}
  .detail-nav a{max-width:100%;}
}