/* Collapse the tall placeholder between the post image and title */
.wp-block-post-featured-image,
.post-thumbnail,
.entry-media {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important; /* kills “ratio box” spacers */
}

.wp-block-post-featured-image img,
.post-thumbnail img,
.entry-media img {
  display: block;
  width: 100%;
  height: auto !important;
  margin-bottom: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
}

/* If a lazy-load wrapper is adding space, collapse it */
.wp-block-post-featured-image .lazyload,
.wp-block-post-featured-image .lazyloading,
.wp-block-post-featured-image .lazyloaded,
.post-thumbnail .lazyload,
.post-thumbnail .lazyloading,
.post-thumbnail .lazyloaded {
  padding-bottom: 0 !important;
  height: auto !important;
}
/* 1) Kill any fixed heights / ratio padding on featured-image wrappers */
:where(.blog, .archive, .home, .wp-block-query, .wp-site-blocks)
  :where(figure.wp-block-post-featured-image, .post-thumbnail, .entry-media, .card-media) {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  aspect-ratio: auto !important;
  position: relative !important;
}

/* Many themes make a tall 'ratio box' with ::before. Turn it off. */
figure.wp-block-post-featured-image::before,
figure.wp-block-post-featured-image a::before,
.post-thumbnail::before,
.entry-media::before {
  content: none !important;
  display: none !important;
  padding-bottom: 0 !important;
}

/* 2) Make the actual image behave normally */
figure.wp-block-post-featured-image img,
.post-thumbnail img,
.entry-media img,
img.wp-post-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: cover; /* safe even if you later set a fixed height somewhere */
}

/* 3) If a lazy-load wrapper adds padding, collapse it */
figure.wp-block-post-featured-image :is(.lazyload, .lazyloading, .lazyloaded,
  .jetpack-lazy-image, .rocket-lazyload, .perfmatters-lazy),
.post-thumbnail :is(.lazyload, .lazyloading, .lazyloaded,
  .jetpack-lazy-image, .rocket-lazyload, .perfmatters-lazy) {
  padding: 0 !important;
  height: auto !important;
}

/* 4) Remove extra gap under the image in card/grid layouts */
.wp-block-post-excerpt,
.entry-summary,
.card-content {
  margin-top: 1rem !important;  /* small, consistent spacing */
}
/* Remove extra spacing under blog excerpt on homepage */
.blog-item,
.blog-post,
.collection-item,
.article {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* If pagination is creating space */
.pagination,
.section-footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Optional: tighten layout below Read More */
.blog-item .read-more,
.blog-item .article__read-more {
  margin-bottom: 0 !important;
}