/* Let the transparent artwork fill the hero without a rectangular backdrop. */
.atelier-home .hero-art {
  object-fit: contain;
  object-position: center;
  max-width: none;
  mask-image: none;
  -webkit-mask-image: none;
  mix-blend-mode: normal;
}

@media (min-width: 901px) {
  .atelier-home .hero-art {
    width: min(94vw, 1200px);
    height: 100%;
    top: 0;
    right: 20px;
    translate: none;
  }

  .atelier-home .hero-shade {
    background: linear-gradient(90deg, #11120f 0%, #11120ff7 42%, #11120fe0 56%, transparent 74%), linear-gradient(0deg, #11120f 0%, transparent 20%);
  }
}

/* Allow the intro, actions and location line to grow without colliding. */
@media (max-width: 900px) {
  .atelier-home .hero {
    max-height: none;
  }
  .atelier-home .hero-foot {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    margin-top: 36px;
  }
}

@media (min-width: 601px) and (max-width: 900px) {
  .atelier-home .hero {
    height: auto;
    min-height: 0;
    padding-bottom: 120px;
  }

  .atelier-home .hero-art {
    width: calc(100% + 90px);
    height: 460px;
    top: 330px;
    right: -20px;
    translate: none;
  }

  .atelier-home .hero-bottom {
    margin-top: 510px;
  }
}

@media (max-width: 600px) {
  .atelier-home .hero-art {
    width: 125%;
    height: 340px;
    top: 255px;
    right: 0;
    translate: none;
  }

  .atelier-home .hero-bottom {
    margin-top: 430px;
  }
}