/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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/diensten/styles/src/diensten.scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.diensten-container{
  display:grid;
  gap:8rem;
  margin-top:calc(var(--spacing-m)/2);
  position:relative;
}
.diensten-container:before{
  aspect-ratio:1/1;
  background-image:url(/wp-content/themes/tibeg/assets/img/pattern.svg);
  background-size:contain;
  content:"";
  height:auto;
  left:50%;
  min-width:200rem;
  mix-blend-mode:lighten;
  position:absolute;
  top:50%;
  transform:translate(-50%, -50%);
  width:250%;
}

.dienst{
  left:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  padding-block:calc(var(--spacing-m)*.25);
  position:relative;
  right:50%;
  width:100vw;
}
.dienst__content{
  width:50%;
}
.dienst__title{
  font-size:clamp(2.5rem, 8vw, 3rem);
}
.dienst__title:after{
  background-image:url(/wp-content/themes/tibeg/assets/img/icons/chevron-tilt.svg);
  background-position:100% 0;
  background-repeat:no-repeat;
  background-size:contain;
  content:"";
  display:inline-block;
  height:1lh;
  transform:translateY(9px);
  transition:transform .45s var(--ease-spring);
  width:2rem;
}
.dienst__title:focus:after,.dienst__title:hover:after{
  transform:translateX(.25em);
}
.dienst__items{
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr));
  list-style:none;
  margin-top:1rem;
  padding:0;
}
.dienst__item-title{
  display:flex;
  flex-flow:row nowrap;
  gap:.75rem;
}
.dienst__item-title:before{
  background-color:var(--color-red-light);
  content:"";
  display:block;
  height:1lh;
  -webkit-mask-image:url(/wp-content/themes/tibeg/assets/img/pointer.svg);
          mask-image:url(/wp-content/themes/tibeg/assets/img/pointer.svg);
  -webkit-mask-position:center;
          mask-position:center;
  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  -webkit-mask-size:contain;
          mask-size:contain;
  width:1rem;
}
.dienst__image-wrapper:after{
  background:linear-gradient(90deg, var(--color-black) 40%, transparent 100%);
  content:"";
  height:100%;
  left:0;
  opacity:0;
  position:absolute;
  top:0;
  width:100%;
  z-index:1;
}
.dienst__image{
  height:100%;
  position:absolute;
  right:0;
  top:0;
  view-transition-name:var(--name, dienst-featured-image);
  width:calc(50% - 4rem);
}
.dienst a{
  text-decoration:none;
}
@media (max-width:1140px){
  .dienst{
    padding-top:calc(56.25vw + 4rem);
  }
  .dienst .dienst__content{
    width:100%;
  }
  .dienst .dienst__image{
    aspect-ratio:16/9;
    height:auto;
    left:0;
    right:unset;
    top:0;
    width:100%;
  }
}

/*! Add Soul */
/*# sourceMappingURL=diensten.css.map*/