/*breakpoints*/
.heroelement {
  --font-clr: var(--white);
}
.heroelement .hero__slide {
  --headline-clr: var(--white);
  position: relative;
  height: clamp(250px, 85rem, 70svh);
  background: black;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
}
.heroelement .hero__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
.heroelement .hero__media img, .heroelement .hero__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.heroelement .hero__content {
  position: absolute;
  inset: 0;
  bottom: 8rem;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  color: var(--white);
  z-index: 1;
}
.heroelement .swiper__controls {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  justify-content: start;
  margin-inline: auto;
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22%2Fthemes%2Fframmelsberger%2Fscss%2Fcomponents%2F_hero.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAAA%3BAAEA%3BAAAA%3BAAAA%3BAAGQ%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQI%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQJ%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaJ%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%22%7D */