.page_category-teaching {
  --grid-gap-mobile: 1.5rem;
  --grid-gap-desktop: 2rem;
  --text-font-size: 18px;
  --media-max-height: 400px;
}

/* --- GENERAL STYLING --- */
.page_category-teaching h1 {
  padding: 3rem 0 2rem 0;
}

/* Create 2 columns for text */
.page_category-teaching p {
  -moz-column-count: 2;
  column-count: 2;
  -moz-column-gap: 2rem;
  column-gap: 2rem;
  max-width: 100%;
  font-size: var(--text-font-size);
  line-height: 1.5;
  /* Prevent awkward breaks within paragraphs */
  -moz-column-break-inside: avoid;
  break-inside: avoid-column;
  page-break-inside: avoid;
}


/* Force single column for any paragraph with links */
.page_category-teaching p:has(a) {
  -moz-column-count: 1 !important;
  column-count: 1 !important;
  -moz-column-span: all;
  column-span: all;
  width: 100%;
}

/* Make links display as blocks to prevent breaking */
.page_category-teaching p a {
  display: block;
  width: 100%;
  font-size: var(--text-font-size);
  line-height: 1.5;
}

/* image dont stick to text vertically */
.page_category-teaching .text-image-column img {
  padding: 1.5rem 0;
}

/* For browsers that don't support :has(), use this alternative approach */
@supports not (selector(:has(*))) {}

/* Target short paragraphs by adding a class in WordPress */
.page_category-teaching p.short-paragraph,
.page_category-teaching p.link-paragraph {
  column-count: 1 !important;
  width: 100%;
}

/* padding ooon the page so content is less wide */
/* Alternative approach using attribute selector to match any number */
.page_category-teaching .wp-block-columns.teaching-column-container[class*='wp-container-core-columns-is-layout'] {
  padding: 0 10rem !important;
  margin: 0;
}

/* Method 3: Target specific sections that have shorter paragraphs */
.wp-block-columns.is-layout-flex.wp-container-core-columns-is-layout-3 p,
.wp-block-columns.is-layout-flex.wp-container-core-columns-is-layout-4 p {
  column-count: 1 !important;
  width: 100%;
}

/* Ensure all paragraphs with links stay in one column */
.page_category-teaching p:has(a) {
  column-count: 1 !important;
  width: 100%;
}

/* Bio paragraph spanning full width if needed */
.page_category-teaching .bio-paragraph {
  max-width: 100%;
}

/* --- COLUMNS IMAGE + TEXT STYLING --- */
.page_category-teaching .text-image-pattern {
  align-items: stretch;
  /* Make columns same height */
  gap: var(--grid-gap-desktop);
  padding-left: 5rem;
  padding-right: 5rem;
}

/* Make each column stretch */
.page_category-teaching .text-image-pattern .wp-block-column {
  display: flex;
  flex-direction: column;
}

/* Make image container fill column */
.page_category-teaching .text-image-pattern .wp-block-image {
  flex: 1;
  display: flex;
}


/* Responsive cropping for images */
.page_category-teaching img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  padding-top: 0;
  /* remove top padding */
  border-radius: .5rem;
  }
.page_category-teaching .text-image-column img {
  padding: 0;
  margin: 1rem 0
}

/* Global image tweaks */
.page_category-teaching img {
  width: 100%;
  padding-top: 0;
  height: auto;
}

.page_category-teaching img:nth-of-type(n+2) {
  width: 100%;
  padding-top: 2rem;
  height: auto;
}

/* --- YOUTUBE EMBED STYLING --- */
.page_category-teaching iframe {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain;
  border: none;
  padding: 0.625rem 0;
}

.page_category-teaching .wp-block-embed-youtube .wp-block-embed__wrapper::before {
  content: none !important;
  display: none !important;
}

/* --- HEADINGS --- */
.page_category-teaching .entry-content h2 {
  padding: 1rem 0 0.5rem 0;
  max-width: 100%;
}

/* --- REMOVE EXTRA MARGINS FROM BLOCKS --- */
.page_category-teaching :where(.is-layout-flow)>* {
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: 0;
  margin-block-end: 0;
}


/* --- RESPONSIVE STYLES --- */
@media (max-width: 1150px) and (min-width: 1025px) {
  .page_category-teaching .text-image-pattern {
    flex-direction: column;
    gap: var(--grid-gap-desktop);
  }

  /* Remove column count for smaller screens */
  .page_category-teaching p {
    -moz-column-count: 1;
    column-count: 1;
    -moz-column-gap: 0rem;
    column-gap: 0rem;
    font-size: var(--text-font-size);
    line-height: 1.5;
  }

  .page_category-teaching .text-image-pattern .wp-block-column {
    flex: 1 1 100%;
  }
}

@media (max-width: 1024px) {
  .wp-block-columns.teaching-column-container.is-layout-flex.wp-container-core-columns-is-layout-4.wp-block-columns-is-layout-flex {
    padding: 0;
    margin: 0;
  }

  .page_category-teaching .text-image-pattern {
    flex-direction: column;
    gap: var(--grid-gap-mobile);
    padding-left: 0 !important;
    /* ← Removed padding */
    padding-right: 0 !important;
    /* ← Removed padding */
  }

  .page_category-teaching .text-image-pattern .wp-block-column {
    flex: 1 1 100%;
  }

  .page_category-teaching .text-image-pattern .wp-block-image img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
  }

  .page_category-teaching p {
    -moz-column-count: 1;
    column-count: 1;
    -moz-column-gap: 0rem;
    column-gap: 0rem;
    font-size: var(--text-font-size);
    line-height: 1.5;
  }

  .page_category-teaching .wp-block-columns.teaching-column-container[class*='wp-container-core-columns-is-layout'] {
    padding: 0 !important;
    margin: 0;
  }


}