.custom-trading-banner-picture {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  background: #07161b;
  line-height: 0;
}

.custom-trading-banner-picture .custom-trading-banner-image {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: auto !important;
  max-height: none !important;
  min-height: 0;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
}

.custom-trading-banner-caption {
  display: grid;
  gap: .35rem;
  margin-top: .65rem;
  color: inherit;
  font-size: .85rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.custom-trading-banner-credit a {
  color: inherit;
}

@media (max-width: 699px) {
  .custom-trading-banner-picture .custom-trading-banner-image {
    aspect-ratio: 4 / 5;
  }
}

@media (min-width: 700px) {
  .custom-trading-banner-picture .custom-trading-banner-image {
    aspect-ratio: 16 / 9;
  }
}

/* Defeat inherited fixed card/hero heights without affecting any other image. */
.article-card .custom-trading-banner-picture .custom-trading-banner-image,
.bento-card .custom-trading-banner-picture .custom-trading-banner-image,
.article-hero.custom-trading-banner .custom-trading-banner-image {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
}
