/* ===== News Detail Page ===== */
.detail-layout {
  display: grid; grid-template-columns: 1fr 320px; gap: 48px;
}

/* Article */
.detail-content { background: #fff; padding: 32px; border-radius: var(--radius-lg); border: 1px solid var(--border); }
.detail-header { margin-bottom: 24px; }
.detail-date { font-size: 14px; color: var(--text-light); margin-right: 16px; }
.detail-tag { background: var(--primary-light); color: var(--primary); padding: 2px 10px; border-radius: 4px; font-size: 13px; font-weight: 600; }

.detail-cover {
  width: 100%; border-radius: var(--radius); margin-bottom: 32px; max-height: 400px; object-fit: cover;
}

.detail-body h2 { font-size: 22px; margin: 32px 0 16px; border-left: 4px solid var(--primary); padding-left: 12px; }
.detail-body h3 { font-size: 18px; margin: 24px 0 12px; }
.detail-body p { margin-bottom: 16px; font-size: 16px; line-height: 1.8; }
.detail-body ul { margin-bottom: 16px; padding-left: 20px; }
.detail-body ul li { margin-bottom: 8px; list-style: disc; color: var(--text-light); }

/* Sidebar */
.detail-sidebar { display: flex; flex-direction: column; gap: 24px; }
.sidebar-card { background: #fff; padding: 24px; border-radius: var(--radius-lg); border: 1px solid var(--border); }
.sidebar-card h3 { font-size: 16px; margin-bottom: 16px; border-bottom: 2px solid var(--primary); padding-bottom: 8px; }
.related-list li { margin-bottom: 12px; }
.related-list li a { font-size: 14px; color: var(--text); display: block; transition: color 0.2s; }
.related-list li a:hover { color: var(--primary); }
.related-list li a::before { content: '•'; color: var(--primary); margin-right: 8px; }

.cta-card { background: var(--bg-alt); text-align: center; border-color: var(--primary); }
.cta-card h3 { border: none; }
.cta-card p { font-size: 14px; margin-bottom: 16px; color: var(--text-light); }

@media (max-width: 768px) {
  .detail-layout { grid-template-columns: 1fr; }
}
