/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./components/blocks/werkwijze-slider/styles/src/werkwijze-slider.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
.werkwijze-slider-item:before,.werkwijze-slider-item__image{
  height:100%;
  left:0;
  position:absolute;
  top:0;
  width:100%;
}

.werkwijze-slider{
  left:50%;
  margin:4rem -50vw 20rem;
  overflow:hidden;
  position:relative;
  right:50%;
  width:100vw;
}
.werkwijze-slider__container{
  display:flex;
  flex-flow:row nowrap;
  gap:1rem;
  max-width:unset;
  touch-action:pan-y;
  width:-moz-max-content;
  width:max-content;
}

.werkwijze-slider-item{
  border-radius:var(--border-radius-m);
  box-shadow:-16px 0 24px -24px #000;
  color:var(--color-background);
  display:block;
  height:50rem;
  max-height:80vh;
  max-width:45vw;
  overflow:hidden;
  position:relative;
  width:32.5rem;
}
.werkwijze-slider-item:before{
  backdrop-filter:blur(1rem);
  background:rgba(0,0,0,.9);
  content:"";
  -webkit-mask-image:linear-gradient(0deg, #000 10%, transparent 50%);
          mask-image:linear-gradient(0deg, #000 10%, transparent 50%);
  transform-origin:bottom;
  z-index:2;
}
.werkwijze-slider-item__image{
  max-width:inherit;
  width:inherit;
  z-index:1;
}
.werkwijze-slider-item .chromatic-image-container-wrapper{
  position:absolute !important;
  top:0;
}
.werkwijze-slider-item__title{
  font-size:clamp(3rem, 5vw, 4rem);
}
.werkwijze-slider-item__content{
  display:flex;
  flex-direction:column;
  height:100%;
  justify-content:space-between;
  padding:4rem;
  position:relative;
  width:100%;
  z-index:3;
}
@media (max-width:768px){
  .werkwijze-slider-item{
    max-width:80vw;
    width:80vw;
  }
}

/*! Add Soul */
/*# sourceMappingURL=werkwijze-slider.css.map*/