/* Courses (Online Courses hub) page — page-specific overrides only.
   Auto-enqueued by functions.php because this file exists and the page slug
   is "courses". Does not edit any shared file (ib-flex.css /
   core-layouts.php).

   1) Hero (split_content, image_display=full, section_bg=teal): the live
      page's text column is a teal-to-navy gradient, not flat teal.
   2) Featured In (featured_in): the shared layout grayscales its logos
      (.ib-featured__logos img filter:grayscale(1)); the live courses page
      shows them in full color. Also widens the max-height slightly to match
      the live logo strip. NOTE (gap, see report): the live page also shows
      a "bed cover" photograph band behind the "Featured In" heading, then a
      separate plain-white row for the logos underneath — the shared
      featured_in layout has no background-image field to reproduce that
      photo band, so it is intentionally left off here rather than dropped
      behind the logos (which would hurt legibility/contrast).
   3) CTA band (cta_band): add the same pattern-texture overlay already used
      on ib-page-newsletter.css's cta_band, matching the live navy band. */

.ib-split--full.ib-bg--teal {
	background: linear-gradient(135deg, var(--ib-teal), var(--ib-navy));
}

.ib-featured__logos img {
	filter: none;
	opacity: 1;
	max-height: 46px;
}

.ib-cta {
	position: relative;
	overflow: hidden;
}
.ib-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url('/wp-content/uploads/2026/02/IntraBalance_Patterns_5-scaled.png');
	background-size: cover;
	background-position: center center;
	opacity: 0.25;
	pointer-events: none;
}
.ib-cta .ib-container {
	position: relative;
}

@media (max-width: 900px) {
	.ib-split--full .ib-split__media img {
		height: 260px;
	}
}