.referenzen {
  position: relative;
  container-type: inline-size;
  width: 100%;
  padding: 0 0 clamp(4.7058823529rem, 3.5930047695rem + 5.9121621622vw, 8.8235294118rem) 0;
}
.referenzen-inner {
  padding-bottom: 100px;
  position: relative;
}
.referenzen-inner .referenz-grid {
  margin: auto;
  width: 86%;
  max-width: 1287px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  justify-content: center;
  gap: 50px clamp(1.1764705882rem, 0.7790143084rem + 2.1114864865vw, 2.6470588235rem);
}
.referenzen-inner .item {
  position: relative;
}
.referenzen-inner .item .image {
  width: 100%;
  height: 280px;
}
.referenzen-inner .item .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.referenzen-inner .item .content {
  box-shadow: 0 2px 15px 0 rgba(var(--contrastColorRGB), 0.1);
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateY(0) translateX(-50%);
  background-color: var(--contrastColorInverted);
  margin: auto;
  width: 300px;
  padding: 20px;
  text-align: center;
  border-radius: 30px 50px 50px 0px;
  transition: var(--baseTransition);
}
.referenzen-inner .item .content .headline {
  margin-bottom: 0px;
  margin-top: 0;
  transition: var(--baseTransition);
}
.referenzen-inner .item .content .wp-block-button.is-style-icon-arrow > a.wp-block-button__link:not(.has-text-color) {
  display: none;
}
.referenzen-inner .item:hover {
  transition: var(--baseTransition);
}
.referenzen-inner .item:hover .content .headline {
  padding-bottom: 15px;
  transition: var(--baseTransition);
}
.referenzen-inner .item:hover .content .wp-block-button.is-style-icon-arrow > a.wp-block-button__link:not(.has-text-color) {
  display: block;
}
.referenzen-inner .item:hover .content .link {
  color: var(--mainColor);
}
.referenzen-inner .item:hover .content .link::after {
  transition: var(--baseTransition);
}
.referenzen-inner .item:nth-child(n+4) {
  display: none;
}
.referenzen-inner .item .full-link {
  display: block;
  height: 115%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline {
  text-align: center;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline.show-less {
  display: none;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline > a.wp-block-button__link:not(.has-text-color) {
  color: var(--contrastColorInverted);
  margin-top: 90px;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline > a.wp-block-button__link:not(.has-text-color)::after {
  mask-image: url("../../img/underlines.svg");
  mask-size: 100%;
  mask-repeat: no-repeat;
  mask-position: top;
  background-color: var(--contrastColorInverted);
  background-image: none;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline > a.wp-block-button__link:not(.has-text-color):hover {
  padding-bottom: 15px;
}
.referenzen-inner .show-more.wp-block-button.is-style-outline > a.wp-block-button__link:not(.has-text-color):hover::after {
  bottom: 0;
}
.referenzen-inner::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 85%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: bottom center;
  background-image: url("../../img/bottom_bubble.svg");
}
@container (width <=1135px) {
  .referenzen-inner::before {
    height: 90%;
    border-radius: 200px 0;
    background: var(--mainColor);
  }
}
@container (width <=775px) {
  .referenzen-inner::before {
    border-radius: 100px 0;
  }
}
.referenzen.show .item {
  display: block;
}
.referenzen.show .show-more.wp-block-button.is-style-outline {
  text-align: center;
  display: none;
}
.referenzen.show .show-more.wp-block-button.is-style-outline.show-less {
  display: block;
}
