/* ============================================
   MK体育在线官网 - 文章详情页样式
   article.css
   ============================================ */

.article-section{padding:60px 0}
.article-layout{display:grid;grid-template-columns:1fr 300px;gap:48px}

.article-header{margin-bottom:40px}
.article-header h1{font-size:32px;line-height:1.3;margin-bottom:20px}
.article-meta{display:flex;align-items:center;gap:24px;font-size:14px;color:#5D6D7E;margin-bottom:24px}
.article-meta span{display:flex;align-items:center;gap:6px}

.article-body{font-size:16px;line-height:1.8;color:#A0A0A0}
.article-body h2{font-size:24px;color:#FFF;margin:40px 0 20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}
.article-body h3{font-size:20px;color:#D5D8DC;margin:32px 0 16px}
.article-body p{margin-bottom:1em}
.article-body a{color:#FF6600;text-decoration:none}
.article-body a:hover{text-decoration:underline}
.article-body ul,.article-body ol{margin:16px 0 16px 24px;color:#A0A0A0}
.article-body ul li,.article-body ol li{margin-bottom:8px}
.article-body strong{color:#D5D8DC}

.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px;padding-top:32px;border-top:1px solid rgba(255,255,255,.08)}

.article-related{margin-top:48px}
.article-related h3{font-size:20px;margin-bottom:20px}
.related-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.related-item{padding:20px;background:#141414;border-radius:12px;border:1px solid rgba(255,255,255,.05);transition:all .2s}
.related-item:hover{border-color:rgba(255,102,0,.2)}
.related-item-title{font-size:15px;font-weight:600;color:#FFF;line-height:1.4;margin-bottom:8px}
.related-item-meta{font-size:12px;color:#5D6D7E}

.sidebar-widget{background:#141414;border-radius:16px;padding:28px;margin-bottom:24px;border:1px solid rgba(255,255,255,.05)}
.sidebar-widget h4{font-size:16px;color:#FFF;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar-links li{margin-bottom:12px}
.sidebar-links a{font-size:14px;color:#808080;transition:color .2s;display:block;line-height:1.5}
.sidebar-links a:hover{color:#FF6600}
.sidebar-tags{display:flex;flex-wrap:wrap;gap:6px}

@media(max-width:1024px){
.article-layout{grid-template-columns:1fr}
.sidebar{display:none}
}