.px-leistungen {
  container-type: inline-size;
  --tab-spalte: 420px;
}
.px-leistungen-inner {
  position: relative;
  border-radius: var(--baseBorderRadius);
  background-color: var(--backgroundColor);
  box-shadow: var(--bigBoxShadow);
  overflow: hidden;
}
@container (width <= 960px) {
  .px-leistungen-inner {
    --tab-spalte: 100%;
  }
}
.px-leistungen .px-leistung-toggle {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.px-leistungen .px-leistung-label {
  width: var(--tab-spalte);
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: clamp(1.25rem, 1.1148648649rem + 0.6756756757vw, 1.75rem) clamp(1.25rem, 1.0810810811rem + 0.8445945946vw, 1.875rem);
  cursor: pointer;
  position: relative;
  transition: var(--baseTransition);
}
.px-leistungen .px-leistung-label:not(:first-of-type)::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(1.25rem, 1.0810810811rem + 0.8445945946vw, 1.875rem);
  right: clamp(1.25rem, 1.0810810811rem + 0.8445945946vw, 1.875rem);
  height: 1px;
  background-color: rgba(var(--contrastColorRGB), 0.1);
}
.px-leistungen .px-leistung-label::after {
  content: "";
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  margin-left: auto;
  background-color: var(--mainColor);
  mask: url("../../img/arrow-right.svg") no-repeat center/100% auto;
  transition: var(--baseTransition);
}
.px-leistungen .px-leistung-label .icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.px-leistungen .px-leistung-label .icon img, .px-leistungen .px-leistung-label .icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.px-leistungen .px-leistung-label .text {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.px-leistungen .px-leistung-label .title {
  font-weight: 700;
  line-height: 1.3;
  color: var(--fontColor);
}
.px-leistungen .px-leistung-label .subtitle {
  font-size: var(--smallFontSize);
  line-height: 1.4;
  color: var(--greySolid);
}
.px-leistungen .px-leistung-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: var(--tab-spalte);
  overflow-y: auto;
  display: none;
  padding: clamp(1.875rem, 1.5371621622rem + 1.6891891892vw, 3.125rem);
  min-width: 0;
}
.px-leistungen .px-leistung-panel > *:first-child {
  margin-top: 0;
}
.px-leistungen .px-leistung-panel > *:last-child {
  margin-bottom: 0;
}
@container (width <= 960px) {
  .px-leistungen .px-leistung-panel {
    position: static;
    overflow: visible;
  }
}
.px-leistungen .px-leistung-toggle:checked + .px-leistung-label {
  background-color: var(--greyLight);
}
.px-leistungen .px-leistung-toggle:checked + .px-leistung-label::after {
  transform: translateX(4px);
}
.px-leistungen .px-leistung-toggle:checked + .px-leistung-label + .px-leistung-panel {
  display: block;
}
.px-leistungen-inner:not(:has(.px-leistung-toggle:checked)) > .px-leistung-label:first-of-type {
  background-color: var(--greyLight);
}
.px-leistungen-inner:not(:has(.px-leistung-toggle:checked)) > .px-leistung-panel:first-of-type {
  display: block;
}
.px-leistungen .px-leistung-toggle:focus-visible + .px-leistung-label {
  outline: 2px solid var(--mainColor);
  outline-offset: -2px;
}