/* MB Banners 1.0.0 — the ONE banner treatment (web == app): rounded, contained, never cropped.
   Retires: .mb-mall-banner(--fullbleed/--section/--bottom), .mb-hp-lifestyle-banner, .mb-lauren-banner-wrap. */
.mb-banner{
  display:block;
  width:100%;
  max-width:1200px;
  margin:24px auto 28px;
  padding:0 16px;
  box-sizing:border-box;
  line-height:0;
  position:relative;
}
.mb-banner .mb-banner__link{display:block;width:100%}
.mb-banner .mb-banner__img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1920/600;
  object-fit:contain;
  border-radius:16px;
}
.mb-banner__sponsor{
  position:absolute;right:26px;top:10px;line-height:1;
  font:600 .68rem/1 Poppins,sans-serif;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;background:rgba(61,38,48,.55);padding:5px 9px;border-radius:999px;
}
/* tighter rhythm when a banner directly follows a band (e.g. the rose-gold "Open Your Store" box on the Mall) */
.mb-mall-cta + .mb-banner, .mb-odo2-promise + .mb-banner{margin-top:28px}
@media (max-width:600px){
  .mb-banner{padding:0 12px;margin:24px auto 22px}
  .mb-banner .mb-banner__img{border-radius:12px}
  .mb-banner__sponsor{right:20px;top:8px}
}
/* Viewport width hygiene (Boardroom 23 Aug): 100vw includes the scrollbar gutter on
   desktop browsers with classic scrollbars, so any max-width:100vw element overflows by
   that gutter and the page scrolls sideways. The lightbox card is set in functions.php
   (untouchable) — override it here. */
.mb-lightbox .mb-lightbox__card{width:100%!important;max-width:100%!important}