.article-container { max-width: 800px; margin: 0 auto; padding: 40px 20px; }
    .article-header { margin-bottom: 30px; }
    .article-header .bc-category { display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; margin-bottom: 12px; }
    .article-header h1 { font-size: 2rem; font-weight: 900; color: #0c1c30; line-height: 1.3; margin-bottom: 16px; }
    .article-author { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
    .article-author img, .article-author .avatar-initials { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
    .article-author .avatar-initials { background: #3793D1; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 700; }
    .article-author .author-name { font-weight: 700; color: #0c1c30; }
    .article-author .author-role { font-size: 0.85rem; color: #64748b; }
    .article-stats { display: flex; gap: 16px; padding: 12px 0; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; margin-bottom: 30px; }
    .article-stats span { display: flex; align-items: center; gap: 6px; font-size: 0.85rem; color: #64748b; }
    .article-content { font-size: 1.05rem; line-height: 1.8; color: #334155; }
    .article-content h2 { font-size: 1.5rem; font-weight: 800; color: #0c1c30; margin: 30px 0 12px; }
    .article-content h3 { font-size: 1.2rem; font-weight: 700; color: #1e293b; margin: 24px 0 10px; }
    .article-content p { margin-bottom: 16px; }
    .article-content ul, .article-content ol { margin-bottom: 16px; padding-left: 24px; }
    .article-content li { margin-bottom: 6px; }
    .article-content a { color: #3793D1; text-decoration: underline; }
    .article-actions { display: flex; gap: 16px; align-items: center; padding: 20px 0; border-top: 1px solid #e2e8f0; margin: 30px 0; }
    .like-btn { display: flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: 50px; border: 1px solid #e2e8f0; background: #fff; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: all 0.2s; }
    .like-btn.liked { color: #ef4444; border-color: #fecaca; background: #fef2f2; }
    .share-btn { padding: 10px 20px; border-radius: 50px; border: 1px solid #e2e8f0; background: #fff; font-size: 0.9rem; font-weight: 600; cursor: pointer; }
    .comments-section { margin-top: 40px; }
    .comments-section h3 { font-size: 1.2rem; font-weight: 800; margin-bottom: 16px; }
    .comment { display: flex; gap: 12px; padding: 16px 0; border-bottom: 1px solid #f1f5f9; }
    .comment .c-avatar { width: 36px; height: 36px; border-radius: 50%; background: #e2e8f0; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 700; color: #64748b; flex-shrink: 0; }
    .comment .c-name { font-weight: 700; font-size: 0.9rem; }
    .comment .c-time { font-size: 0.75rem; color: #94a3b8; }
    .comment .c-text { font-size: 0.9rem; color: #495057; margin-top: 4px; }
    .comment-input { display: flex; gap: 12px; margin-top: 20px; }
    .comment-input input { flex: 1; padding: 12px; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 0.9rem; }
    .comment-input button { padding: 12px 20px; background: #3793D1; color: #fff; border: none; border-radius: 10px; font-weight: 600; cursor: pointer; }
    .related-posts { margin-top: 40px; }
    .related-posts h3 { font-size: 1.1rem; font-weight: 800; margin-bottom: 16px; }
    .related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
    .related-card { padding: 16px; border: 1px solid #e2e8f0; border-radius: 12px; cursor: pointer; transition: all 0.2s; }
    .related-card:hover { border-color: #3793D1; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
    .related-card .rc-title { font-size: 0.9rem; font-weight: 700; margin-bottom: 4px; }
    .related-card .rc-author { font-size: 0.75rem; color: #64748b; }
    .coming-soon { text-align:center; padding:80px 20px; max-width:500px; margin:0 auto; }
    .coming-soon .cs-icon { width:80px; height:80px; border-radius:50%; background:linear-gradient(135deg, #dbeafe, #bfdbfe); display:flex; align-items:center; justify-content:center; margin:0 auto 24px; }
    .coming-soon .cs-icon i { font-size:2rem; color:#3793D1; }
    .coming-soon h2 { font-size:1.8rem; font-weight:900; color:#0c1c30; margin-bottom:12px; }
    .coming-soon p { font-size:1rem; color:#64748b; line-height:1.7; margin-bottom:24px; }
    .coming-soon .cs-btn { display:inline-flex; align-items:center; gap:8px; padding:12px 28px; background:#0c1c30; color:#fff; border-radius:50px; font-weight:700; font-size:0.9rem; text-decoration:none; transition:all 0.2s; }
    .coming-soon .cs-btn:hover { background:#1B3A5C; transform:translateY(-2px); }