/* ===== Blog grid: 3 columns desktop, 2 tablet, 1 mobile ===== */
.com-content-category-blog, .com-content-article.item-page {
  margin-top:120px;
}

.com-content-category-blog__items.blog-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;            /* space between cards */
  align-items: start;
}

@media (max-width: 1024px) {
  .com-content-category-blog__items.blog-items {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .com-content-category-blog__items.blog-items {
    grid-template-columns: 1fr;
  }
}

/* ===== Blog item card basics ===== */
.com-content-category-blog__item.blog-item {
  display: flex;
  flex-direction: column;
}

/* ===== Featured image: 4:3, cover, responsive ===== */
.com-content-category-blog__item .item-image.left {
  float: none; /* override Joomla's .left float */
}

.com-content-category-blog__item .item-image {
  width: 100%;
  margin: 0 0 0 0;
  aspect-ratio: 4 / 3;     /* keeps 4:3 ratio */
  overflow: hidden;
  border-radius: 0px;
  background: #f5f5f5;     /* subtle placeholder bg */
}

.com-content-category-blog__item .item-image > a,
.com-content-category-blog__item .item-image > img {
  display: block;
  width: 100%;
  height: 100%;
}

.com-content-category-blog__item .item-image img {
  object-fit: cover;       /* crop to fill */
  object-position: center;
  height:100%;
}

/* ===== Show only title and meta inside item-content ===== */
.com-content-category-blog__item .item-content > :not(.page-header):not(.article-info.text-muted) {
  display: none !important;
}

/* Keep these visible */
.com-content-category-blog__item .item-content .page-header,
.com-content-category-blog__item .item-content .article-info.text-muted {
  display: block;
}

/* Optional: tidy typography */
.com-content-category-blog__item .page-header h2 {
  margin: 0 0 .25rem 0;
  font-size: clamp(1.125rem, 2.2vw, 1.5rem);
  line-height: 1.25;
}

.com-content-category-blog__item .article-info.text-muted {
  margin: .25rem 0 0 0;
  font-size: .9rem;
  color: #6c757d; /* ensure muted look across templates */
}

/* Remove "Details" term label if you don't want it */
.com-content-category-blog__item .article-info.text-muted .article-info-term {
  display: none;
}

/* Spacing between image and content */
.com-content-category-blog__item .item-content {
  padding: 0;
}

.com-content-category-blog__item .page-header {
  margin-bottom:0px;
  padding-bottom:0px;
}