.bcfs { display: flex; align-items: center; gap: calc(40px + 2.6%); }
.bcfs--ml { flex-direction: row-reverse; }
.bcfs__txt, .bcfs__med { flex: 1 1 0; min-width: 0; }
.bcfs__med > video, .bcfs__med > img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 767px) { .bcfs { display: block; } }

/* Feature card: the media sits on a white card */
.bcfs__med > img,
.bcfs__med > video {
  background: #fff;
  border: 1px solid #d4e8e0;
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(6, 63, 53, .06), 0 18px 40px -12px rgba(6, 63, 53, .16);
}

/* Interlock: every card except the last on the page crosses into the statement band below it */
@supports selector(:has(+ *)) {
  @media (min-width: 768px) {
    .dnd-section:has(.bcfs):has(+ .dnd-section[class*="-background-"] + .dnd-section .bcfs) {
      padding-bottom: 0 !important;
    }
    .dnd-section:has(.bcfs):has(+ .dnd-section[class*="-background-"] + .dnd-section .bcfs) .bcfs__med {
      position: relative;
      z-index: 2;
      transform: translateY(56px);
    }
    .dnd-section:has(.bcfs) + .dnd-section[class*="-background-"]:has(+ .dnd-section .bcfs) > .row-fluid {
      padding-top: 60px;
      padding-bottom: 60px;
    }
  }
}