/* Give the AI / mascot interaction room above and below the first slide. */
.hero-slide-roomy .hero-slide-image,
.hero-slide-roomy.active .hero-slide-image {
  inset: 13% 0 auto auto;
  width: 90%;
  height: 78%;
  object-fit: contain;
  object-position: right center;
  transform: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 83%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 83%, transparent);
}

@media (max-width: 820px) {
  .hero-slide-roomy .hero-slide-image,
  .hero-slide-roomy.active .hero-slide-image {
    inset: 15% -8% auto auto;
    width: 180%;
    height: 36%;
  }

  .hero-slide-roomy .hero-shade {
    background: linear-gradient(to top, rgba(7, 23, 47, .98) 0%, rgba(7, 23, 47, .90) 38%, rgba(7, 23, 47, .08) 66%, rgba(7, 23, 47, .12) 100%);
  }
}