/* Page imagery supplied for the CareWise preview. */
.resources .resource-art {
  background:
    linear-gradient(145deg, rgba(5, 11, 49, .30), rgba(37, 93, 200, .22)),
    url('../images/care-plans.webp') center / cover;
}

.approach-photo {
  background-image:
    linear-gradient(90deg, rgba(2, 7, 42, .84), rgba(2, 7, 42, .18)),
    url('../images/care-in-action.webp') !important;
  background-position: center;
  background-size: cover;
}

.video-still {
  background-image:
    linear-gradient(0deg, rgba(5, 31, 45, .78), transparent 65%),
    url('../images/clinical-learning-team.webp') !important;
  background-position: center;
  background-size: cover;
}

/* Resources hero: use the supplied online-learning image and its blue space for copy. */
.resources-hero {
  min-height: 475px;
  padding-top: 125px;
  padding-right: max(22px, 6vw);
  padding-bottom: 110px;
  padding-left: 65%;
  color: #fff;
  background: url('../images/5.webp') center / cover;
}

.resources-hero .eyebrow.dark,
.resources-hero h1 em { color: #d9d5dd; }

.resources-hero > p:last-child { color: rgba(255, 255, 255, .84); }

/* Learning page hero: show the supplied clinical-learning image on the right. */
.interior > .page-hero:has(+ .programme-strip) {
  position: relative;
  overflow: hidden;
  background: #f6f3ed;
}

.interior > .page-hero:has(+ .programme-strip)::after {
  content: '';
  position: absolute;
  inset: 0 0 0 auto;
  width: 44%;
  background:
    linear-gradient(90deg, #f6f3ed 0%, rgba(246, 243, 237, .04) 30%),
    url('../images/4.webp') center / cover;
}

.interior > .page-hero:has(+ .programme-strip) > * {
  position: relative;
  z-index: 1;
  max-width: 58%;
}

@media (max-width: 760px) {
  .resources-hero {
    min-height: 530px;
    padding: 270px 22px 55px;
    background-position: 38% center;
  }

  .interior > .page-hero:has(+ .programme-strip)::after {
    position: relative;
    display: block;
    width: calc(100% + 44px);
    height: 240px;
    margin: 38px -22px -95px;
    background: url('../images/4.webp') center / cover;
  }

  .interior > .page-hero:has(+ .programme-strip) > * { max-width: none; }
}