/* === BLOG SECTION === */
.blogs-section { background: var(--bg-card); }
.blog-layout { display: grid; grid-template-columns: 1fr; gap: 16px; }
.blog-featured { background: var(--bg); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); }
.blog-feat-img { background: linear-gradient(135deg, #EFF6FF, #FEF3C7); padding: 30px; text-align: center; font-size: 2.5rem; }
.blog-feat-content { padding: 16px; }
.blog-category { display: inline-block; background: #DBEAFE; color: var(--primary); padding: 3px 8px; border-radius: 4px; font-size: 0.65rem; font-weight: 700; margin-bottom: 8px; }
.blog-feat-content h3 { font-size: 0.95rem; font-weight: 700; margin-bottom: 6px; line-height: 1.4; }
.blog-feat-content p { font-size: 0.8rem; color: var(--text-muted); margin-bottom: 10px; line-height: 1.5; }
.blog-meta { display: flex; gap: 6px; font-size: 0.7rem; color: var(--text-muted); flex-wrap: wrap; }
.blog-list { display: flex; flex-direction: column; gap: 1px; background: var(--border); border-radius: var(--radius); overflow: hidden; }
.blog-list-item { display: flex; gap: 12px; padding: 14px; background: var(--bg-card); align-items: center; }
.blog-list-icon { font-size: 1.4rem; flex-shrink: 0; }
.blog-list-item h4 { font-size: 0.82rem; font-weight: 600; margin-bottom: 3px; }
.blog-meta-sm { font-size: 0.7rem; color: var(--text-muted); }

@media (min-width: 1024px) {
    .blog-layout { grid-template-columns: 1.5fr 1fr; }
    .blog-feat-img { padding: 50px; font-size: 3rem; }
}