/* ============================================================
   ENTERPRISE BAND — MasterClass-style photo bleed, SLB brand
   ------------------------------------------------------------
   Consolidated from home-teasers.css, home-fixes.css, and
   home-additions.css, then deduplicated (merged the duplicate
   .ent-band / .ent-band .wrap rules to their resolved values and
   dropped the retired left-column / card-list rules, unused in markup).
   Linked after home-additions.css, before checkout.css.
   ============================================================ */

/* .section provides the vertical rhythm; .ent-band adds overflow
   clipping for the photo's transform scale + negative-margin bleed,
   and a stacking context for the wrap. */
.ent-band {
  position: relative;
  overflow: hidden;
}
.ent-band .wrap { position: relative; z-index: 1; }

.ent-mc {
  max-width: 1100px;
  margin: 0 auto;
  background: var(--darkblue);
  border-radius: 0;
  padding: var(--space-12);
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.1fr);
  gap: var(--space-16);
  align-items: stretch;
  position: relative;
}
.ent-mc-photo {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 520px;
  background: var(--surface-subtle);
  border-radius: 0;
  overflow: hidden;
  margin-top: -120px;
  margin-bottom: -120px;
}
.ent-mc-photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  transform: scale(1.5);
}

.ent-mc-body { padding: var(--space-2) 0; }
.ent-mc-body .eyebrow { color: var(--aqua-500); }
.ent-mc-body h2 { color: var(--white); margin-top: var(--space-4); }
.ent-mc-body h2 .serif-em { color: var(--aqua-500); font-style: normal; font-weight: var(--font-bold); }
.ent-mc-body .lede { color: var(--brand-deep-accent); margin-top: var(--space-6); max-width: 56ch; }
.ent-actions {
  margin-top: var(--space-16);
  display: flex;
  gap: var(--space-3);
}

/* RESPONSIVE — side-by-side photo + content stacks below 1024. */
@media (max-width: 1023px) {
  .ent-mc { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .ent-actions { flex-wrap: wrap; }
}