/* bx-content-104 – aus Brixies „Content Section 104“ (0036-content-section-104.json) */
.bx-content-104 { overflow: hidden; }
.bx-content-104__container { row-gap: var(--wf-container-gap); align-items: center; }
.bx-content-104__container-info { align-items: center; row-gap: var(--wf-space-s); width: 1080px; align-self: center; }
.bx-content-104__tagline { font-weight: 600; color: var(--wf-color-neutral-950); margin-bottom: 0px; }
.bx-content-104__heading { font-size: var(--wf-text-2xl); text-align: center; }
.bx-content-104__description { text-align: center; width: 540px; }
.bx-content-104__list { margin-top: 0px; margin-bottom: 0px; padding-top: var(--wf-space-s); padding-right: var(--wf-space-s); padding-bottom: var(--wf-space-s); padding-left: var(--wf-space-s); display: grid; gap: var(--wf-space-s); grid-template-columns: var(--wf-grid-4); border-top-left-radius: var(--wf-radius-l); border-top-right-radius: var(--wf-radius-l); border-bottom-right-radius: var(--wf-radius-l); border-bottom-left-radius: var(--wf-radius-l); background-color: var(--wf-color-neutral-25); align-items: initial; }
@media (max-width: 991px) {
	.bx-content-104__list { grid-template-columns: var(--wf-grid-2); }
}
@media (max-width: 478px) {
	.bx-content-104__list { grid-template-columns: var(--wf-grid-1); }
}
.bx-content-104__list-item-slider { grid-column: span 2; grid-row: span 2; }
@media (max-width: 991px) {
	.bx-content-104__list-item-slider { grid-row: auto; grid-column: span 3; }
}
@media (max-width: 478px) {
	.bx-content-104__list-item-slider { grid-column: auto; }
}
.bx-content-104__list-item { grid-column: span 2; }
@media (max-width: 478px) {
	.bx-content-104__list-item { grid-column: auto; }
}
.bx-card-content-104 { row-gap: var(--wf-container-gap); overflow: hidden; position: relative; background-color: var(--wf-color-white); padding-top: var(--wf-space-xl); padding-right: var(--wf-space-xl); padding-bottom: var(--wf-space-xl); padding-left: var(--wf-space-xl); border-top-left-radius: var(--wf-radius-m); border-top-right-radius: var(--wf-radius-m); border-bottom-right-radius: var(--wf-radius-m); border-bottom-left-radius: var(--wf-radius-m); }
@media (max-width: 478px) {
	.bx-card-content-104 { align-items: stretch; }
}
.bx-card-content-104__img-container { position: relative; isolation: isolate; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; width: auto; }
.bx-card-content-104__img { aspect-ratio: 3 / 4; object-fit: cover; object-position: 50%; z-index: -1; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-style: solid; border-color: var(--wf-color-white-trans-20); border-top-left-radius: var(--wf-radius-s); border-top-right-radius: var(--wf-radius-s); border-bottom-right-radius: var(--wf-radius-s); border-bottom-left-radius: var(--wf-radius-s); width: 100px; position: absolute; top: 5%; height: auto; }
.bx-card-content-104__container-info { row-gap: var(--wf-space-s); }
.bx-card-content-104__heading { font-size: var(--wf-text-xl); }
.bx-card-content-104__description { max-width: 540px; }
.bx-card-content-104-counter { row-gap: var(--wf-space-3xl); background-color: var(--wf-color-white); padding-top: var(--wf-space-xl); padding-right: var(--wf-space-xl); padding-bottom: var(--wf-space-xl); padding-left: var(--wf-space-xl); height: 100%; border-top-left-radius: var(--wf-radius-m); border-top-right-radius: var(--wf-radius-m); border-bottom-right-radius: var(--wf-radius-m); border-bottom-left-radius: var(--wf-radius-m); }
.bx-card-content-104-counter__heading { font-weight: 600; font-size: var(--wf-text-m); }
.bx-card-content-104-counter__container-info { flex-direction: column; flex-wrap: nowrap; row-gap: var(--wf-space-s); margin-top: auto; }
.bx-card-content-104-counter__counter .wf-count { color: var(--wf-color-neutral-950); font-size: var(--wf-text-2xl); font-weight: 700; line-height: 1.2; }
.bx-card-content-104-counter__counter .wf-prefix { color: var(--wf-color-neutral-950); font-size: var(--wf-text-2xl); font-weight: 700; line-height: 1.2; }
.bx-card-content-104-counter__counter .wf-suffix { font-size: var(--wf-text-2xl); color: var(--wf-color-neutral-950); font-weight: 700; line-height: 1.2; }
.bx-content-104__img { object-fit: cover; object-position: 50%; width: 100%; height: 100%; border-top-left-radius: var(--wf-radius-m); border-top-right-radius: var(--wf-radius-m); border-bottom-right-radius: var(--wf-radius-m); border-bottom-left-radius: var(--wf-radius-m); }
@media (max-width: 478px) {
	.bx-content-104__img { height: auto; aspect-ratio: 4 / 3; }
}
.bx-content-104__slider { height: 100%; }
.bx-content-104__slider .wf-dot.wf-active { background-color: var(--wf-color-white); }
.bx-content-104__slider .wf-dot { background-color: var(--wf-color-white-trans-20); }
.bx-content-104__slider-slide { height: 100%; }
.bx-card-content-104-slider { position: relative; isolation: isolate; flex-direction: column; align-items: flex-start; justify-content: flex-end; row-gap: var(--wf-space-s); overflow: hidden; border-top-left-radius: var(--wf-radius-m); border-top-right-radius: var(--wf-radius-m); border-bottom-right-radius: var(--wf-radius-m); border-bottom-left-radius: var(--wf-radius-m); height: 100%; aspect-ratio: 4 / 3; }
@media (max-width: 478px) {
	.bx-card-content-104-slider { aspect-ratio: 3 / 4; }
}
.bx-card-content-104-slider__img { width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; z-index: -1; object-fit: cover; object-position: 50%; transition: transform .3s ease; }
.bx-card-content-104-slider__overlay { background-image: linear-gradient(180deg, var(--wf-color-neutral-trans-10) 35, var(--wf-color-neutral-trans-50) 100); width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; z-index: -1; }
.bx-card-content-104-slider__heading { color: var(--wf-color-white); font-size: var(--wf-text-l); }
.bx-card-content-104-slider__description { color: var(--wf-color-white); }
.bx-card-content-104-slider__container-info { justify-content: flex-end; align-items: flex-start; row-gap: var(--wf-space-s); padding-top: var(--wf-space-xl); padding-right: var(--wf-space-xl); padding-bottom: 80px; padding-left: var(--wf-space-xl); aspect-ratio: 4 / 3; cursor: grab; }
.bx-card-content-104-slider__container-info:active { cursor: grabbing; }
@media (max-width: 478px) {
	.bx-card-content-104-slider__container-info { aspect-ratio: 3 / 4; }
}
/* -- The root styles must go in the element of the structure with the name "Process"(Section). --*/

.bx-content-104 {
  
  /* Slider Styles */
  .bx-content-104__slider{
    
    /* Slider Layout Styles */
    .splide__pagination{
      width: 100%;
      padding-inline: var(--wf-space-xl);
      padding-block-end: var(--wf-space-xl);
      
      > li{
        display: inline-flex;
        flex-grow: 1;
      }
      
      .splide__pagination__page{
          width: 100%;
        }
    }
  }

  .bx-card-content-104__img{
    /* Styles for the first image */
    &:first-child{
      position: static;
      transform: translateY(-5px);
      z-index: 0;	
    }

    /* Styles for the last image */
    &:last-child{
      transform: rotate(10deg) translateX(50%);
      top: -5%;
    }
  }
}