.collection-banner .hero__img {
  height: var(--section-height);
}

@media (min-width: 900px) {
  .collection-banner .hero__img {
    height: var(--section-height-desk);
  }
}

.collection-banner .hero__title {
  color: white;
}

.collection-banner .hero--grid .hero__overlay {
  position: absolute;

  @media screen and (min-width:749px) {
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    text-align: center;
  }
}

.collection-banner .hero--grid .hero__overlay.no-image {
  position: relative;
  transform: none;
}

.collection-banner .hero--grid .hero__overlay.no-image .hero__title {
  color: black;
}