/* breakpoints */
.heroelement {
  --min-height: clamp(500px, 60rem, 80svh);
}
.heroelement .heroslide {
  min-height: var(--min-height);
  position: relative;
}
.heroelement .heroslide .hero__overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25);
  background: linear-gradient(90deg, black 0%, rgba(255, 255, 255, 0) 100%);
}
.heroelement .heroslide .hero__content {
  z-index: 10;
  position: relative;
}
.heroelement .heroslide .hero__content--holder {
  --space: 3rem;
  position: relative;
  height: 100% !important;
  min-height: var(--min-height);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space);
  padding-block: var(--space);
}
@media (min-width: 992px) {
  .heroelement .heroslide .hero__content--holder {
    --space: 6rem;
  }
}
@media (min-width: 1400px) {
  .heroelement .heroslide .hero__content--holder {
    --space: 8rem;
  }
}
.heroelement .heroslide .hero__content .hero__text * {
  font-size: 1.125rem;
}
@media (max-width: 575.98px) {
  .heroelement .heroslide .hero__content .hero__text * {
    font-size: 1rem;
    line-height: 1.25;
  }
}
.heroelement .heroslide .hero__content .hero__text p:last-of-type {
  margin-bottom: 0;
}
.heroelement .heroslide .hero__content .btn-group > .btn {
  flex: unset;
}
.heroelement .heroslide .hero__content .hero__title, .heroelement .heroslide .hero__content .hero__title * {
  margin-bottom: 0;
}
.heroelement .heroslide .hero__content .hero__title strong, .heroelement .heroslide .hero__content .hero__title * strong {
  font-weight: 700 !important;
}
.heroelement .hero__cards .hero__card a {
  text-decoration: none;
}
.heroelement .hero__cards .hero__card--content {
  background-color: var(--black);
  position: relative;
  text-align: center;
  padding: 1rem 1.5rem;
}
.heroelement .hero__cards .hero__card--content:before {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  content: "";
  background: black;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  height: 4rem;
}
.heroelement .hero__cards .hero__card--content .text {
  --font-clr: var(--clr-grey-light);
  opacity: 0;
  pointer-events: none;
  transition: var(--transition);
}
@media (hover: none) {
  .heroelement .hero__cards .hero__card--content .text {
    opacity: 1;
  }
}
.heroelement .hero__cards .hero__card:hover .hero__card--content .text {
  opacity: 1;
}
@media (max-width: 575.98px) {
  .heroelement .swiper__pagination {
    bottom: 0;
  }
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22%2Fthemes%2Fkarl24%2Fscss%2Felements%2F_heroelement.scss%22%2C%22%2Fthemes%2Fkarl24%2Fscss%2Felements%2F..%2Fsettings%2Fbreakpoints.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAAA%3BAACA%3BAAAA%3BAAAA%3BAAEE%3BAAAA%3BAAAA%3BAAAA%3BAAKI%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASF%3BAAAA%3BAAAA%3BAAAA%3BAAIE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BACmBF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BADCI%3BAAAA%3BAAAA%3BACDJ%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BADSI%3BAAAA%3BAAAA%3BAAOA%3BAAAA%3BAAAA%3BAAKF%3BAAAA%3BAAAA%3BAAIE%3BAAAA%3BAAAA%3BAASF%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAME%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAWA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAME%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQA%3BAAAA%3BAAAA%3BACrEN%3BAAAA%3BAAAA%3BAAAA%3BAAAA%22%7D */