/* Custom homepage & single article enhancements */
.home-grid {
  margin-top: 10px;
}
.card-article {
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.card-article .img {
  height: 220px;
  background-position: center;
  background-size: cover;
  display: block;
}
.card-article:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1);
}
.card-article .text {
  padding: 16px;
}
.card-article .excerpt {
  color: #6c757d;
  font-size: 0.95rem;
}
.meta-left .meta {
  color: #6c757d;
  font-size: 0.9rem;
}
.meta-left .meta span {
  margin-right: 10px;
}
.read-more {
  background: linear-gradient(90deg, #ff7a18, #af002d);
  color: #fff;
  border-radius: 24px;
  padding: 8px 14px;
  text-transform: none;
}
.read-more:hover {
  opacity: 0.95;
}
.single-article-header .article-meta {
  color: #6c757d;
  font-size: 0.95rem;
}
.single-article-header .article-meta .dot {
  margin: 0 8px;
  color: #ccc;
}
.lead {
  font-size: 1.05rem;
  color: #343a40;
}
.post-actions .btn {
  border-radius: 6px;
}
.related-posts h3 {
  margin-bottom: 1rem;
}
.related .img {
  border-radius: 4px;
}
@media (max-width: 767px) {
  .card-article .img {
    height: 160px;
  }
}

/* Single article specific styles */
.single-article-section .single-article { background: #fff; border-radius: 8px; }
.single-article .article-meta { font-size: 0.9rem; color: #6c757d; }
.single-article .article-content p { line-height: 1.8; margin-bottom: 1rem; }
.single-article .article-content h2 { margin-top: 1.5rem; margin-bottom: 1rem; }
.author-box { background: #fff; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,0.04); }
.comments .comment { background: #fff; border-radius: 6px; }
.comment-form .form-control { border-radius: 6px; }
.related-posts .related .img { width: 90px; height: 70px; background-position: center; background-size: cover; border-radius: 6px; }
.sidebar .block-21 .blog-img { width: 80px; height: 60px; background-size: cover; border-radius: 6px; }

@media (max-width: 991px) {
  .single-article-section .single-article { padding: 20px; }
}