/* Minimal, clean styles for the custom blog templates */
.ms-blog-archive, .ms-blog-single { max-width: 1200px; margin: 0 auto; padding: 40px 20px; }
.ms-btn { display: inline-block; padding: 10px 18px; border-radius: 6px; text-decoration: none; font-weight: 600; background:#111; color:#fff; }
.ms-hero { display: grid; grid-template-columns: 1fr 2fr; gap: 24px; align-items: start; margin-bottom: 40px; }
.ms-hero-left .widget, .ms-hero-placeholder { background:#f6f7fb; padding: 20px; border-radius: 12px; }
.ms-hero-placeholder h2 { margin: 0 0 8px; }
.ms-featured { display: grid; grid-template-columns: 1fr; gap: 16px; }
.ms-featured img { width:100%; height:auto; border-radius: 12px; display:block; }
.ms-featured-content h2 { margin: 0 0 8px; font-size: 1.8rem; line-height:1.2; }
.ms-meta { opacity: 0.7; font-size: 0.9rem; margin: 0 0 8px; }

.ms-grid-header h2 { margin: 0 0 16px; }
.ms-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ms-card { background:#fff; border:1px solid #eee; border-radius: 12px; overflow:hidden; display:flex; flex-direction: column; }
.ms-thumb img, .ms-thumb-placeholder { width:100%; height:300px; object-fit:cover; display:block; background:#eaeaea; }
.ms-card-body { padding: 14px 16px 18px; }
.ms-card-cats { color:#7a7a7a; font-size: 0.85rem; margin-bottom: 6px; }
.ms-card-title { margin: 0 0 8px; font-size:1.1rem; line-height:1.3; }
.ms-card-title a { text-decoration:none; color:#111; }
.ms-card-excerpt { margin: 0 0 10px; color:#444; }
.ms-card-meta { opacity: 0.7; font-size: 0.85rem; margin: 0; }

.ms-pagination { margin-top: 28px; }
.ms-pagination ul { display:flex; gap:10px; list-style:none; padding:0; }
.ms-pagination a, .ms-pagination span { padding:8px 12px; border:1px solid #ddd; border-radius:8px; text-decoration:none; color:#111; }
.ms-pagination .current { background:#111; color:#fff; border-color:#111; }

.ms-article-header { margin-bottom: 24px; }
.ms-title { margin: 0 0 6px; font-size: 2.2rem; line-height:1.15; }
.ms-hero-image img { width:100%; height:auto; border-radius: 12px; margin-top: 12px; }
.ms-content { font-size: 1.05rem; line-height:1.75; }
.ms-article-footer { margin-top: 24px; padding-top: 16px; border-top:1px solid #eee; display:flex; justify-content: space-between; gap:16px; flex-wrap:wrap; }
.ms-related { margin-top: 40px; }

@media (max-width: 900px) {
  .ms-hero { grid-template-columns: 1fr; }
  .ms-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .ms-cards { grid-template-columns: 1fr; }
}