/*
@include max($tablet) {
	height: 60px;
}
*/
/*
Beispiel:
@include default_text_specs(
    $css-variable-prepend: "kc-teaser-title",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include default_h1_specs(
    $css-variable-prepend: "",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include default_h2_specs(
    $css-variable-prepend: "",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include css_variable_prepend(
    $property: "font-size",
    $prepend-string: 'kc-teaser-title',
    $default-value: 20px
);
*/
/*
@extend %transition;
*/
/*
@extend %transition-timing;
*/
/*
@include max($tablet) {
	height: 60px;
}
*/
#home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background * {
  --text-color: var(--white);
}
#home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background > .heading-h1 {
  --block-default-width: 0%;
  --block-default-padding-left: 0;
  --block-default-padding-right: 0;
  --h1-font-size: 60px;
  position: absolute;
  z-index: 100;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  overflow: hidden;
  transition: width 2s;
  transition-delay: 0s;
}
@media (min-width: 580px) {
  #home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background > .heading-h1 {
    --h1-font-size: 80px;
  }
}
@media (min-width: 960px) {
  #home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background > .heading-h1 {
    --h1-font-size: 150px;
    top: 50%;
  }
}
#home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background > .wp-block-group__inner-container {
  position: absolute;
  z-index: 100;
  bottom: 50px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  padding: 30px var(--global-padding);
  border: 2px solid var(--primary-color-lightest);
  border-radius: 10px;
  max-width: calc(100% - var(--global-padding) * 2);
  -webkit-filter: blur(10px);
          filter: blur(10px);
  opacity: 0;
  transition: all 2s;
  transition-delay: 0s;
  width: auto;
}
@media (min-width: 580px) {
  #home-slider-container > #home-slider swiper-slide > .group-container .wp-block-group.has-background > .wp-block-group__inner-container {
    bottom: 100px;
    padding: 30px 50px;
  }
}
#home-slider-container > #home-slider swiper-slide.swiper-slide-fully-visible > .group-container .wp-block-group.has-background:after {
  -webkit-backdrop-filter: blur(0);
          backdrop-filter: blur(0);
  transition-delay: 2s;
}
#home-slider-container > #home-slider swiper-slide.swiper-slide-fully-visible > .group-container .wp-block-group.has-background > .heading-h1 {
  --block-default-width: 100%;
  transition-delay: 2s;
}
#home-slider-container > #home-slider swiper-slide.swiper-slide-fully-visible > .group-container .wp-block-group.has-background > .wp-block-group__inner-container {
  -webkit-filter: blur(0);
          filter: blur(0);
  opacity: 1;
  transition-delay: 2s;
}

swiper-slide > .group-container .wp-block-group.has-background:before {
  background-color: rgba(0, 0, 0, 0.5);
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  z-index: 2;
}
swiper-slide > .group-container .wp-block-group.has-background:after {
  background-color: var(--primary-color);
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  z-index: 1;
  mix-blend-mode: soft-light;
  -webkit-backdrop-filter: blur(100px);
          backdrop-filter: blur(100px);
  transition: -webkit-backdrop-filter 2s;
  transition: backdrop-filter 2s;
  transition: backdrop-filter 2s, -webkit-backdrop-filter 2s;
  transition-delay: 0s;
}
swiper-slide > .group-container .wp-block-group.has-background section {
  z-index: 100;
}
swiper-slide.swiper-slide-fully-visible > .group-container .wp-block-group.has-background > .wp-block-group__inner-container {
  -webkit-filter: blur(0);
          filter: blur(0);
  opacity: 1;
  transition-delay: 2s;
}

swiper-container[effect=slide] .wp-block-group.has-background:after {
  -webkit-backdrop-filter: none !important;
          backdrop-filter: none !important;
}

.gallery-slide-container swiper-container swiper-slide > .group-container.has-background {
  --swiper-height-value: auto;
  height: 100%;
}

@media (max-width: 768px) {
  swiper-container#intro {
    --swiper-height-value: 16 / 9;
  }
}