/* === UNIVERSAL: Soft corners for all featured images === */
.wp-block-post-featured-image img,
.blog .post .wp-post-image,
.archive .post .wp-post-image,
.single .entry-content figure.wp-block-image img {
  border-radius: 12px;
  display: block;
}

/* === DESKTOP: Uniform grid images (no gaps) === */
@media (min-width: 783px) {
  /* Blog/archive cards */
  .blog .post .wp-post-image,
  .archive .post .wp-post-image {
    width: 100% !important;
    height: 220px !important;      /* control the card height */
    object-fit: cover !important;  /* crops neatly */
    margin-bottom: 0;
    display: block;
  }

  /* remove unexpected white gaps between cards */
  .blog .post,
  .archive .post {
    margin-bottom: 24px;
  }
}
/* === DESKTOP: tidy images inside articles so there are no big gaps === */
@media (min-width: 783px) {
  /* Cap the height of images that sit next to text (Media & Text / Columns) */
  .single .entry-content .wp-block-media-text .wp-block-media-text__media,
  .single .entry-content .wp-block-columns .wp-block-column figure {
    max-height: 420px;          /* adjust to taste: 360–480px */
    overflow: hidden;
    border-radius: 12px;        /* keep the soft corners */
  }

  .single .entry-content .wp-block-media-text .wp-block-media-text__media img,
  .single .entry-content .wp-block-columns .wp-block-column figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;          /* crops excess vertical length */
    display: block;
  }

  /* Gentle, consistent rhythm inside articles on desktop */


/* === MOBILE: keep images natural size (just rounded) === */
@media (max-width: 782px) {
  .blog .post .wp-post-image,
  .archive .post .wp-post-image,
  .single .entry-content figure.wp-block-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }
/* ===== yourworld.life — Homepage gap fix ===== */

/* 1) Kill sneaky gaps from inline images/figures */
.home img { display: block; }            /* removes baseline gap */
.home figure { margin: 0; }              /* reset default figure margin */

/* 2) Make featured images uniform on desktop, natural on mobile */
@media (min-width: 783px) {
  .home .post .wp-post-image {
    width: 100% !important;
    height: 220px !important;            /* adjust 200–280px if you prefer */
    object-fit: cover !important;
    margin: 0;
    border-radius: 12px;
  }
}
@media (max-width: 782px) {
  .home .post .wp-post-image {
    width: 100% !important;
    height: auto !important;             /* keep mobile natural */
    object-fit: cover;
    margin: 0;
    border-radius: 12px;
  }
}
/* ==== yourworld.life — solid 3-up homepage grid with no gaps (Apostrophe 2) ==== */

/* 0) Reset sneaky spacing that causes micro-gaps */
.home figure { margin: 0; }
.home img { display: block; }

/* === yourworld.life — force 3-column, no-gap homepage grid (Apostrophe 2) === */

/* 1) Turn the homepage post list into a flex grid at desktop size */
@media (min-width: 1024px) {
  /* Try the common wrappers used by the theme; whichever exists will apply */
  .home .site-main,
  .home .content-area,
  .home .hfeed {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;                 /* even spacing both ways */
  }

  /* 2) Each post becomes a flex item that takes exactly 1/3 width */
  .home article,
  .home .hentry,
  .home .type-post {
    box-sizing: border-box !important;
    margin: 0 !important;                 /* grid handles spacing */
    padding: 0 !important;
    flex: 0 0 calc((100% - 2 * 24px) / 3) !important;  /* 3 per row with 24px gaps */
    display: flex !important;
    flex-direction: column !important;
    border-radius: 12px;
    overflow: hidden;
    background: var(--card, #fff);
  }

  /* 3) Uniform thumbnail height so rows align */
  .home article .wp-post-image {
    display: block !important;
    width: 100% !important;
    height: 220px !important;             /* tweak 200–260px to taste */
    object-fit: cover !important;
  }

  /* 4) Tidy inner spacing so text doesn’t create random gaps */
  .home article .entry-header,
  .home article .entry-summary,
  .home article .entry-content,
  .home article .entry-footer {
    margin: 0 !important;
    padding: 12px 14px !important;
  }

  .home article .entry-title {
    margin: 0 0 8px !important;
    line-height: 1.25 !important;
  }

  /* 5) Keep card heights consistent when excerpts vary */
  .home article .entry-summary {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;                 /* show up to 3 lines */
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    flex-grow: 1 !important;               /* pushes footer to bottom */
  }
}

/* Mobile/tablet keep natural stacking; rounded corners stay */
@media (max-width: 1023px) {
  .home article .wp-post-image { border-radius: 12px; }
}

/* micro-gap killers */
.home figure { margin: 0 !important; }
.home img { display: block !important; }
	/* ===== yourworld.life/blog — fix gaps & force tidy grid ===== */

/* Kill sneaky inline gaps */
.blog figure { margin: 0; }
.blog img { display: block; }

/* Desktop: true 3-column grid */
@media (min-width: 1024px) {
  /* The container that holds the list of posts (classic themes) */
  .blog .site-main,
  .blog .hfeed {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  /* Each post becomes a card; grid handles spacing, so remove margins */
  .blog article,
  .blog .hentry,
  .blog .type-post {
    margin: 0 !important;
    display: flex !important;
    flex-direction: column;
    border-radius: 12px;
    overflow: hidden;
    background: var(--card, #fff);
  }

  /* Uniform featured image so rows align */
  .blog article .wp-post-image {
    width: 100% !important;
    height: 220px !important;   /* tweak: 200–260px to taste */
    object-fit: cover !important;
    display: block !important;
  }

  /* If a post has NO featured image, keep the space so the row doesn’t collapse */
  .blog article:not(.has-post-thumbnail) .entry-header::before {
    content: "";
    display: block;
    width: 100%;
    height: 220px;              /* must match the rule above */
    background: #f1f3f5;
  }

  /* Tidy inner spacing */
  .blog article .entry-header,
  .blog article .entry-summary,
  .blog article .entry-content,
  .blog article .entry-footer { margin: 0; padding: 12px 14px; }

  .blog article .entry-title { margin: 0 0 8px; line-height: 1.25; }

  /* Keep card heights even if excerpts differ */
  .blog article .entry-summary {
    display: -webkit-box;
    -webkit-line-clamp: 3;      /* show up to ~3 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-grow: 1;                /* pushes footer to bottom */
  }
}

/* Tablet: 2 columns */
@media (min-width: 600px) and (max-width: 1023px) {
  .blog .site-main,
  .blog .hfeed {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }
}

/* Mobile: 1 column, natural image height (rounded corners keep) */
@media (max-width: 599px) {
  .blog .site-main,
  .blog .hfeed { display: grid; grid-template-columns: 1fr; gap: 18px; }
  .blog article .wp-post-image { width: 100%; height: auto; object-fit: cover; border-radius: 12px; }
}
	/* ==== yourworld.life/blog — force tidy 3-up grid, live version ==== */

/* Kill sneaky gaps */
.blog figure { margin: 0 !important; }
.blog img { display: block !important; }

/* Desktop: true 3 columns */
@media (min-width: 1024px) {
  /* Make the list of posts a grid (hit the common wrappers) */
  .blog .site-main,
  .blog .hfeed,
  .blog .content-area {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  /* Each post is a card; grid controls spacing */
  .blog article,
  .blog .hentry,
  .blog .type-post {
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #fff; /* adjust if you’re using dark */
  }

  /* Uniform featured image height so rows align */
  .blog article .wp-post-image {
    width: 100% !important;
    height: 220px !important;   /* 200–260px to taste */
    object-fit: cover !important;
    display: block !important;
  }

  /* If a post has no featured image, reserve space so the row doesn’t collapse */
  .blog article:not(.has-post-thumbnail) .entry-header::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 220px !important;   /* match above */
    background: #f1f3f5 !important;
  }

  /* Tidy inner spacing */
  .blog article .entry-header,
  .blog article .entry-summary,
  .blog article .entry-content,
  .blog article .entry-footer {
    margin: 0 !important;
    padding: 12px 14px !important;
  }

  .blog article .entry-title {
    margin: 0 0 8px !important;
    line-height: 1.25 !important;
  }

  /* Keep card heights consistent even if excerpts vary */
  .blog article .entry-summary {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;              /* ~3 lines */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    flex-grow: 1 !important;
  }
}

/* Tablet: 2 columns */
@media (min-width: 600px) and (max-width: 1023px) {
  .blog .site-main,
  .blog .hfeed,
  .blog .content-area {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }
}

/* Mobile: 1 column, natural height, rounded corners */
@media (max-width: 599px) {
  .blog .site-main,
  .blog .hfeed,
  .blog .content-area {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .blog article .wp-post-image {
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
    border-radius: 12px !important;
  }
}