/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/.pnpm/css-loader@7.1.5_webpack@5.111.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/.pnpm/postcss-loader@8.2.1_postcss@8.5.28_typescript@5.9.3_webpack@5.111.1/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/.pnpm/sass-loader@17.0.1_sass@1.105.0_webpack@5.111.1/node_modules/sass-loader/dist/cjs/index.js??ruleSet[1].rules[1].use[3]!./components/blocks/dienst-intro/styles/src/dienst-intro.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.dienst-intro{
  display:flex;
  flex-flow:column nowrap;
  justify-content:center;
  min-height:80lvh;
  padding-block:calc(var(--spacing-m)*1.25);
  position:relative;
}
.dienst-intro__image-wrapper{
  height:100%;
  left:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  position:relative;
  position:absolute;
  right:50%;
  top:0;
  view-transition-name:var(--transition-name);
  width:100vw;
  z-index:-1;
}
.dienst-intro__image-wrapper:after{
  background:linear-gradient(90deg, var(--color-black) 40%, transparent 100%);
  content:"";
  height:100%;
  left:0;
  opacity:.75;
  position:absolute;
  top:0;
  width:100%;
  z-index:1;
}
@media (max-width:768px){
  .dienst-intro__image-wrapper{
    aspect-ratio:16/12;
    height:auto;
    top:0;
  }
  .dienst-intro__image-wrapper:after{
    content:none;
  }
}
.dienst-intro__image{
  height:100%;
  -o-object-fit:cover;
     object-fit:cover;
  position:absolute;
  view-transition-name:var(--name, dienst-featured-image);
  width:100%;
  z-index:-1;
}
.dienst-intro h1,.dienst-intro p{
  max-width:50rem;
  view-transition-name:var(--transition-name);
}
@media (max-width:768px){
  .dienst-intro{
    padding-top:calc(62.5% + var(--spacing-m));
  }
}

/*! Add Soul */
/*# sourceMappingURL=dienst-intro.css.map*/