/* //ANCHOR -----Schriftbild______ */
/* //ANCHOR text */
.text {
  display: block;
  line-height: var(--text-line-height);
  max-width: var(--text-max-width);
  hyphens: auto;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  word-wrap: break-word;
  hyphenate-limit-chars: var(--text-hyphenate-limit-chars);
  margin-bottom: var(--text-margin-bottom);
  letter-spacing: var(--text-letter-spacing);
  font-family: var(--font-family-p);
  font-weight: 400;
}
.text--column-count {
  max-width: var(--column-count-max-width);
  column-count: var(--column-count);
  column-gap: var(--column-gap);
  column-width: var(--column-width);
  column-rule: var(--column-rule);
}
.text--einzug {
  text-indent: var(--einzug);
}
.text--line-height-change {
  line-height: var(--text-line-height-change);
}
.text--width-change {
  max-width: var(--text-max-witdh-change);
}
.text__initial-letter {
  float: left;
  height: calc(var(--font-size-basic) * var(--text-line-height) * 2.5);
  font-size: calc(
    var(--font-size-basic) * 3.3 * min(var(--text-line-height), 5)
  );
  line-height: var(--inital-letter-line-height);
  vertical-align: baseline;
  margin: 0.5% calc(var(--font-size-basic) * 0.6) 0
    calc(var(--font-size-basic) * var(--inital-letter-margin-left));
  padding: 0;
  font-weight: 300;
  font-style: normal;
}
.text br {
  margin-bottom: var(--space-1);
}
.text--line-height-change .text__initial-letter {
  height: calc(var(--font-size-basic) * var(--text-line-height-change) * 2.5);
  font-size: calc(
    var(--font-size-basic) * 3.45 * min(var(--text-line-height-change), 5)
  );
}
.text--smallcaps {
  font-variant: small-caps;
}
.text--uppercase {
  text-transform: uppercase;
}
.text-decoration-none {
  text-decoration: none;
}
/* //ANCHOR liste */
.list {
  font-family: var(--font-p);
  line-height: var(--list-line-height);
  max-width: var(--list-max-width);
  hyphens: auto;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  word-wrap: break-word;
  hyphenate-limit-chars: var(--list-hyphenate-limit-chars);
  padding-left: calc(0.00000001px + var(--font-size-basic));
}
.list > li {
  margin-top: var(--space-n2);
  margin-bottom: var(--space-1);
}
.list > li ul li {
  margin-top: var(--space-n1);
  margin-bottom: var(--space-n1);
}
.list--stil-2 {
  font-family: var(--font-p);
  line-height: var(--list-line-height-2);
  max-width: var(--list-max-width-2);
}
.list--stil-2 li {
  margin-top: 0;
  margin-bottom: var(--space-1);
}
/* list style none */
.list--style-type-none {
  list-style-type: none;
  margin-left: calc(0.000000001px - var(--font-size-basic));
}
/* marker color */
.list--marker-color > li::marker {
  color: rgba(var(--list-style-type-marker), var(--alpha, 1));
  font-size: var(--list-style-type-size);
}
.list--marker-color-2 > li::marker {
  color: rgba(var(--list-style-type-marker-2), var(--alpha, 1));
  font-size: var(--list-style-type-size);
}
/* list style content */
.list--style-type-content > li::before {
  content: var(--list-style-type-content);
  color: inherit;
  font-size: var(--list-style-type-size);
}
.list--style-type-content-2 > li::before {
  content: var(--list-style-type-content-2);
  color: inherit;
  font-size: var(--list-style-type-size);
}
/* icon */
.list--with-icons > li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.list--with-icons path {
  fill: var(--list-icon-fill) !important;
}
.list--with-icons li > *:first-child {
  text-align: center;
  font-size: var(--list-icon-size);
  width: var(--list-icon-size);
}
/* img */
.list--style-type-img {
  min-height: var(--list-img-width);
  padding-left: calc(var(--list-img-width) * 0.5) !important;
  margin-left: calc(
    var(--list-img-width) * 0.5 - var(--font-size-basic)
  ) !important;
}
.list--style-type-img img {
  position: absolute;
  align-self: center;
  width: var(--list-img-width);
  height: auto;
  aspect-ratio: 1 / 1;
  margin-left: calc(0.0000001px - var(--list-img-width));
  object-fit: cover;
  object-position: center;
}
.list--style-type-img span {
  padding-left: var(--space-1);
}
/* link */
.list__link {
  text-decoration: none;
  color: inherit;
}
.list__link--u {
  color: inherit;
}
.list__link--active {
  color: rgb(var(--info));
  text-decoration: underline;
}
/* //ANCHOR Tabellen */
/* Tabelle - Block */
.table {
  width: 100%;
  overflow-x: auto;
  background: var(--table-bg);
  -webkit-overflow-scrolling: touch;
}
/* Tabelle - Elements */
.table__element {
  width: 100%;
  min-width: var(--table-min-width);
  border-collapse: collapse;
  font-family: var(--font-family-p);
  font-size: var(--table-font-size);
  color: var(--table-color-text);
  background: var(--table-bg);
}
.table__caption {
  caption-side: top;
  text-align: left;
  font-family: var(--font-family-p);
  font-size: var(--table-font-size-caption);
  color: var(--table-color-text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: var(--table-padding-v) var(--table-padding-h);
  border-bottom: var(--table-border-divider);
}
.table__head {
  background: var(--table-bg-head);
}
.table__foot {
  background: var(--table-bg-foot);
  border-top: var(--border-2) solid rgba(var(--fcolor), 0.15);
}
.table__row {
  border-bottom: var(--table-border-divider);
}
.table__row:last-child {
  border-bottom: none;
}
.table__body .table__row:nth-child(even) {
  background: var(--table-bg-row-even);
}
.table__body .table__row:hover {
  background: var(--table-bg-row-hover);
}
.table__row--success {
  background: var(--table-success-bg) !important;
  color: var(--table-success-text);
}
.table__row--warning {
  background: var(--table-warning-bg) !important;
  color: var(--table-warning-text);
}
.table__row--danger {
  background: var(--table-danger-bg) !important;
  color: var(--table-danger-text);
}
.table__head-cell {
  padding: var(--table-padding-v) var(--table-padding-h);
  text-align: left;
  vertical-align: middle;
  font-family: var(--font-family-p);
  font-size: var(--table-font-size-head);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--table-color-text-head);
  border-right: var(--table-border-head);
  white-space: nowrap;
}
.table__head-cell:last-child {
  border-right: none;
}
.table__cell {
  padding: var(--table-padding-v) var(--table-padding-h);
  text-align: left;
  vertical-align: middle;
  border-right: var(--table-border-divider);
}
.table__cell:last-child {
  border-right: none;
}
.table__cell--right,
.table__head-cell--right {
  text-align: right;
}
.table__cell--center,
.table__head-cell--center {
  text-align: center;
}
.table__cell--mono {
  font-family: monospace;
  font-size: 0.9em;
  letter-spacing: 0.02em;
}
.table__cell--muted,
.table__head-cell--muted {
  color: var(--table-color-text-muted);
  font-size: var(--font-size-n1);
}
.table__cell--accent {
  color: var(--table-info-text);
  font-weight: 700;
}
.table__badge {
  display: inline-block;
  padding: 0.15em 0.55em;
  border-radius: 100px;
  font-family: var(--font-family-p);
  font-size: var(--table-font-size-head);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.table__badge--success {
  background: var(--table-success-bg);
  color: var(--table-success-text);
}
.table__badge--warning {
  background: var(--table-warning-bg);
  color: var(--table-warning-text);
}
.table__badge--danger {
  background: var(--table-danger-bg);
  color: var(--table-danger-text);
}
.table__badge--info {
  background: var(--table-info-bg);
  color: var(--table-info-text);
}
.table__sort {
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
  cursor: pointer;
  user-select: none;
  color: inherit;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}
.table__sort::after {
  content: "↕";
  opacity: 0.35;
  font-size: 0.9em;
  transition: opacity 0.15s ease;
}
.table__sort:hover::after {
  opacity: 0.7;
}
.table__sort--asc::after {
  content: "↑";
  opacity: 1;
}
.table__sort--desc::after {
  content: "↓";
  opacity: 1;
}
/* Tabelle - Modifire */
.table--bordered {
  border: var(--table-border);
}
.table--compact .table__cell,
.table--compact .table__head-cell {
  padding: var(--table-padding-compact-v) var(--table-padding-compact-h);
}
.table--no-stripe .table__body .table__row:nth-child(even) {
  background: transparent;
}
.table--no-hover .table__body .table__row:hover {
  background: inherit;
}
/* //ANCHOR */
/* //ANCHOR -----Buttons ______*/
/* //ANCHOR btn */
.btn {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-weight: 400;
  font-size: var(--font-size-1);
  font-family: var(--font-family-p);
  border: solid var(--border-1) rgba(var(--bcolor), var(--alpha, 1));
  background-color: var(--btn-bg-color);
}
.btn[data-state="active"] {
  cursor: pointer;
  opacity: 1;
}
.btn[data-state="inactive"] {
  cursor: not-allowed;
  opacity: 0.4;
  box-shadow: none;
}
.btn span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 400;
  padding: var(--btn-padidng);
  color: var(--btn-text-color);
  pointer-events: none;
  line-height: 1;
}
.btn__icon > img,
.btn__icon > svg {
  width: 45px;
  background-color: var(--btn__icon-bg-color);
  margin: 0;
  padding: 5px;
}
.btn__icon path {
  fill: var(--btn__icon-path-fill) !important;
}
.btn--wide {
  display: flex;
}
.btn--uppercase {
  text-transform: uppercase;
}
.btn--pill {
  border-radius: 50px;
}
.btn--pill img {
  border-radius: 50px;
}
.btn--small span {
  padding: 5px 10px 5px 10px;
}
.btn--small.btn__icon > img,
.btn--small.btn__icon > svg {
  width: 30px;
  padding: 5px;
}
.btn--large.btn__icon > img,
.btn--large.btn__icon > svg {
  width: 52px;
}
.btn--large span {
  font-size: var(--font-size-2);
  padding: 12px 20px 12px 20px;
  color: rgba(var(--fcolor-static), var(--alpha, 1));
}
/* hover standart */
.btn:hover[data-state="active"],
.btn:focus-visible[data-state="active"] {
  filter: brightness(1.07);
}
.btn:hover > span[data-state="active"],
.btn:focus-visible > span[data-state="active"] {
  color: var(--hover-text-color);
}
/* active standart */
.btn:active[data-state="active"] {
  box-shadow: none;
  transition: all 50ms ease-in-out;
  filter: brightness(0.95);
}

/* hover-Varianten */
.btn-hover-2:hover[data-state="active"],
.btn-hover-2:focus-visible[data-state="active"] {
  overflow: hidden;
}

.btn-hover-2::before,
.btn-hover-2::before {
  content: "";
  position: absolute;
  top: 0%;
  left: -100%;
  width: 100%;
  height: 100%;
  background-color: var(--hover-2-color);
  z-index: -1;
}

.btn-hover-2:hover > span {
  color: var(--hover-text-color);
  transition: all 200ms ease-out;
}

.btn-hover-2:hover::before,
.btn-hover-2:active::before,
.btn-hover-2:focus::before {
  left: 0%;
  transition: all 250ms ease-out;
}

.btn-hover-2:active[data-state="active"] {
  box-shadow: none;
  transition: all 50ms ease-in-out;
  filter: brightness(1.2);
}
/* //ANCHOR Top-Link */
.top-link {
  position: fixed;
  bottom: var(--space-1);
  right: calc((100vw - min(100%, var(--side-max-width))) / 2 + var(--space-n1));
  width: 50px;
  height: 50px;
  border-radius: var(--br-top-left) var(--br-top-right) var(--br-bottom-right)
    var(--br-bottom-left);
  margin: var(--space-2);
  font-weight: 700;
  text-transform: uppercase;
  background-color: rgba(var(--background-2), var(--alpha, 0.75));
  z-index: 9;
}
.top-link[data-state="inactive"] {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.5s ease,
    visibility 0.5s ease;
}
.top-link[data-state="active"] {
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.5s ease,
    visibility 0.5s ease;
}
.top-link p {
  color: rgba(var(--fcolor-invert), 0.8) !important;
}
.top-link > :first-child {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-decoration: none;
}
.top-link:hover {
  transform: scale(1.1);
}
.top-link img {
  width: 30px;
  padding: 0;
  margin: 0;
}
.top-link__arrow {
  width: 3px;
  height: 20px;
  border-radius: 0px 0px 15px 15px;
  background-color: rgba(var(--fcolor-invert), 0.8);
}
.top-link__arrow:first-child {
  transform: rotate(-45deg) translatex(6px) translatey(5px);
}
.top-link__arrow:last-child {
  transform: rotate(45deg) translatex(-6px) translatey(5px);
}
.top-link--icon {
  bottom: var(--space-1);
  right: var(--space-1);
  width: 50px;
  height: 50px;
  border-radius: 0;
  margin: var(--space-2);
  font-weight: 700;
  background-color: rgba(var(--background-2), var(--alpha, 0));
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  z-index: 9;
}
.top-link--icon img,
.top-link--icon svg {
  width: 40px;
  height: auto;
}
.top-link--icon path {
  fill: rgba(var(--fcolor), var(--alpha, 1)) !important;
}
.top-link--small {
  width: 40px;
  height: 40px;
}
.top-link--small * {
  font-size: var(--font-size-n1);
}
.top-link--small img {
  width: 20px;
  height: auto;
}
.top-link--round {
  border-radius: 50%;
}
/* //ANCHOR */
/* //ANCHOR -----Cards ______*/
.card {
  position: relative;
  width: 100%;
  border: var(--border-1) solid rgba(var(--bcolor), var(--alpha, 1));
  background-color: rgba(var(--neutral-00), var(--alpha, 1));
  transition: all 80ms ease-in-out;
}
.card__header {
  flex-shrink: 0;
  overflow: hidden;
}
.card__image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}
.card__profil {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
}
.card__content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.card__title {
  color: rgba(var(--fcolor-static), var(--alpha, 1));
}
.card__text {
  line-height: var(--card-text-line-height);
  color: rgba(var(--fcolor-static), var(--alpha, 1));
}
.card__social * {
  height: var(--social-icon-height);
}
.card__social img:hover,
.card__social svg:hover {
  padding: 0;
  transform: rotate(20deg);
  transition: all 200ms ease-in-out;
}
.card--full {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.card--row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 480px) {
  .card--row-sm {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .card--row-md {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .card--row-lg {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1280px) {
  .card--row-xl {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1440px) {
  .card--row-xxl {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}
.card--dark {
  background-color: rgba(var(--neutral-1500), var(--alpha, 1)) !important;
  border-color: rgba(var(--bcolor-invert), var(--alpha, 1)) !important;
}
.card--dark .btn {
  background-color: rgba(var(--neutral-1300), var(--alpha, 1)) !important;
  border-color: rgba(var(--bcolor-static-invert), var(--alpha, 1)) !important;
  color: rgb(var(--fcolor-static-invert), var(--alpha, 1)) !important;
}
.card--dark .btn span {
  color: rgb(var(--fcolor-static-invert), var(--alpha, 1)) !important;
}
.card--dark .card__text {
  color: rgba(var(--fcolor-static-invert), var(--alpha, 1));
}
.card--dark .card__title {
  color: rgba(var(--warning), var(--alpha, 1));
}
.card--medium {
  max-width: 350px;
}
.card--small {
  max-width: 200px;
}
.card__social--trans {
  transform: translateY(var(--sozial-trans));
  margin-bottom: var(--sozial-trans);
}
.card__text--compact {
  line-height: var(--card-text-line-height-compact);
  color: rgba(var(--fcolor-static), var(--alpha, 1));
}
.card--hover-1:hover {
  transform: scale(1.05);
  transition: all 50ms ease-in-out;
  z-index: 4;
}
.card--hover-2:hover {
  transform: scale(1.04);
  transform-origin: bottom center;
  transition: all 150ms ease-in-out;
  z-index: 4;
}
.card--hover-3:hover {
  transform: translateY(-17px);
  transition: all 100ms ease-in-out;
  z-index: 4;
}
/* //ANCHOR */
/*  //ANCHOR -----Window______ */
.window {
  position: absolute;
  top: var(--window-position-top);
  left: var(--window-position-left);
}
.window__movable {
  cursor: move;
}
/* //ANCHOR */
/* //ANCHOR -----Navigation ______*/
/* //ANCHOR top-navigation */
/* block */
.nav {
  position: sticky;
  top: var(--navbar-top-position);
  left: var(--navbar-left-position);
  z-index: 8;
}
/* elements */

.nav__menu ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  text-align: center;
  background-color: var(--nav-item-bg-color);
  overflow: hidden;
}
.nav__menu--column ul {
  flex-direction: column;
}
.nav__menu--row ul {
  flex-direction: row;
}
.nav__menu ul li {
  display: flex;
  flex-direction: column;
  padding: 0;
  flex: 1;
}
.nav__menu ul a {
  text-decoration: none;
  color: var(--nav-item-text-color);
  padding: var(--nav-item-pd);
}
.nav__menu ul li a:hover,
.nav__menu ul li a:focus-visible {
  padding: var(--nav-item-pd-hover);
  color: var(--nav-item-text-color-hover);
  background-color: var(--nav-item-bg-color-hover);
  transition: all 200ms ease-in-out;
}
.nav__menu ul li a.active {
  color: var(--nav-item-text-color-hover);
  background-color: var(--nav-item-bg-color-hover);
  transition: all 200ms ease-in-out;
}
.nav__bar {
  background-color: var(--nav-hamburger-bg-color);
}
/* Hamburger */
.nav__hamburger {
  display: flex;
  flex-direction: column;
  width: var(--hamburger-width);
  height: var(--hamburger-height);
  justify-content: center;
  align-items: var(--hamburger-X-position);
  margin: var(--hamburger-margin);
}
.nav__hamburger:hover,
.nav__hamburger:active,
.nav__hamburger:focus {
  cursor: pointer;
}
/* slices-1 */
.nav__slice-1 {
  width: var(--slice-1-width);
  height: var(--slice-1-height);
  margin: var(--slice-1-margin);
  border-radius: 15px;
  transition: all 150ms ease-in-out;
  background-color: var(--nav-hamburger-color);
}
/* slices-2 */
.nav__slice-2 {
  width: var(--slice-2-width);
  height: var(--slice-2-height);
  margin: var(--slice-2-margin);
  transition: all 150ms ease-in-out;
  background-color: var(--nav-hamburger-color);
}
.nav__cross .nav__slice-2 > span:nth-of-type(1) {
  display: none;
}
/* slices-3 */
.nav__slice-3 {
  width: var(--slice-3-width);
  height: var(--slice-3-height);
  margin: var(--slice-3-margin);
  border-radius: 50%;
  transition: all 150ms ease-in-out;
  background-color: var(--nav-hamburger-color);
}
/* slices-4 */
.nav__slice-4 {
  width: var(--slice-4-width);
  height: var(--slice-4-height);
  margin: var(--slice-4-margin);
  transition: all 150ms ease-in-out;
  background-color: var(--nav-hamburger-color);
}
/* cross-1 */
.nav__cross .nav__slice:nth-of-type(1) {
  transform-origin: left;
  transform: rotate(45deg);
}
.nav__cross .nav__slice:nth-of-type(2) {
  opacity: 0;
}
.nav__cross .nav__slice:nth-of-type(3) {
  transform-origin: left;
  transform: rotate(-45deg);
}
/* cross-2 */
.nav__cross .nav__slice-2:nth-of-type(1) {
  transform-origin: left;
  transform: scaleX(0.53);
}
.nav__cross .nav__slice-2:nth-of-type(2) {
  transform-origin: right;
  transform: scaleX(0.53);
}
/* cross-3 */
.nav__cross .nav__slice-3:nth-of-type(1) {
  transform-origin: center;
  transform: scaleX(6);
  border-radius: 0;
}

.nav__cross .nav__slice-3:nth-of-type(2) {
  transform-origin: center;
  transform: scaleX(6);
  border-radius: 0;
}

.nav__cross .nav__slice-3:nth-of-type(3) {
  transform-origin: center;
  transform: scaleX(6);
  border-radius: 0;
}
/* cross-4 */
.nav__cross .nav__slice-4:nth-of-type(1) {
  transform-origin: right;
  transform: scaleX(1.1);
}

.nav__cross .nav__slice-4:nth-of-type(2) {
  transform-origin: right;
  transform: scaleX(0.76);
}

.nav__cross .nav__slice-4:nth-of-type(3) {
  transform-origin: right;
  transform: scaleX(0.43);
}
/* ----------------------------------------------------------------- */
.nav__nested {
  position: absolute;
  display: flex;
  flex-direction: column;
  background-color: var(--nav-nested-item-bg-color) !important;
  transform-origin: var(--nested-transform-origin-out);
  transform: var(--nested-transform-out);
  z-index: -1;
}
.nav__nested-open {
  top: var(--nested-top-position);
  left: var(
    --nested-left-position
  ); /* left entfernen für dropdown (an viewport denken!) */
  width: 100%;
  transform-origin: var(--nested-transform-origin-in);
  transform: var(--nested-transform-in);
  transition: all 150ms ease-in-out;
  z-index: 9;
}
.nav__nested-open a {
  padding: var(--nav-nested-item-pd) !important;
  color: var(--nav-nested-item-text-color) !important;
  transition: all 50ms ease-in-out;
}
.nav__nested-open a:hover,
.nav__nested-open a:focus-visible,
.nav__nested-open a:active {
  padding: var(--nav-nested-item-pd-hover) !important;
  color: var(--nav-nested-item-text-color-hover) !important;
  background-color: var(--nav-nested-item-bg-color-hover) !important;
  transition: all 50ms ease-in-out;
}
.nav__arrow {
  display: inline-block;
  width: var(--nav-arrow-size);
  height: var(--nav-arrow-size);
  border-right: 1.5px solid var(--nav-arrow-color);
  border-bottom: 1.5px solid var(--nav-arrow-color);
  transform: rotate(45deg) translateY(-4px);
  transition: transform 200ms ease;
}
.nav__arrow-open {
  transform: rotate(-135deg);
  transition: transform 200ms ease;
}
.nav__logo svg,
.nav__logo img {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: var(--nav-logo-height);
  padding: var(--nav-logo-padding);
}
.nav__logo a {
  padding: 0 !important;
  margin: 0 !important;
}
/* modifier */
.nav--transform {
  position: absolute;
  width: 100%;
  transform-origin: var(--menu-transform-origin-out);
  transform: var(--menu-transform-out);
  transition: all 150ms ease-in-out;
}
.nav--transform-open {
  position: absolute;
  transform-origin: var(--menu-transform-origin-in);
  transform: var(--menu-transform-in);
  transition: all 150ms ease-in-out;
}
.nav__menu--h100 ul,
.nav__menu--h100 ul li ul {
  padding-bottom: 100svh !important;
}
.nav--vertical {
  position: sticky;
  width: var(--nav-width-vertical);
}
.nav--vertical .nav__bar {
  height: 100svh;
  flex-direction: column !important;
}
@media (min-width: 480px) {
  .nav__bar--off-sm {
    display: none !important;
  }
  .nav__bar--off-sm ~ .nav--transform {
    transform: scale(1);
  }
  .nav__menu--column-sm ul {
    flex-direction: column !important;
  }
  .nav__menu--row-sm ul {
    flex-direction: row !important;
  }
  .nav__menu--h100-sm ul,
  .nav__menu--h100-sm ul li ul {
    padding-bottom: 100svh !important;
  }
}
@media (min-width: 768px) {
  .nav__bar--off-md {
    display: none !important;
  }
  .nav__bar--off-md ~ .nav--transform {
    transform: scale(1);
  }
  .nav__menu--column-md ul {
    flex-direction: column !important;
  }
  .nav__menu--row-md ul {
    flex-direction: row !important;
  }
  .nav__menu--h100-md ul,
  .nav__menu--h100-md ul li ul {
    padding-bottom: 100svh !important;
  }
}
@media (min-width: 1024px) {
  .nav__bar--off-lg {
    display: none !important;
  }
  .nav__bar--off-lg ~ .nav--transform {
    transform: scale(1);
  }
  .nav__menu--column-lg ul {
    flex-direction: column !important;
  }
  .nav__menu--row-lg ul {
    flex-direction: row;
  }
  .nav__menu--h100-lg ul,
  .nav__menu--h100-lg ul li ul {
    padding-bottom: 100svh !important;
  }
}
@media (min-width: 1280px) {
  .nav__bar--off-xl {
    display: none !important;
  }
  .nav__bar--off-xl ~ .nav--transform {
    transform: scale(1);
  }
  .nav__menu--column-xl ul {
    flex-direction: column !important;
  }
  .nav__menu--row-xl ul {
    flex-direction: row !important;
  }
  .nav__menu--h100-xl ul,
  .nav__menu--h100-xl ul li ul {
    padding-bottom: 100svh !important;
  }
}
@media (min-width: 1440px) {
  .nav__bar--off-xxl {
    display: none !important;
  }
  .nav__bar--off-xxl ~ .nav--transform {
    transform: scale(1);
  }
  .nav__menu--column-xxl ul {
    flex-direction: column !important;
  }
  .nav__menu--row-xxl ul {
    flex-direction: row !important;
  }
  .nav__menu--h100-xxl ul,
  .nav__menu--h100-xxl ul li ul {
    padding-bottom: 100svh !important;
  }
}

/* //ANCHOR Tab-Navigation */
/* Block */
.tabs {
  display: flex;
  flex-direction: column;
}

/* Elements */
.tabs__tab {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-weight: 400;
  font-size: var(--font-size-1);
  font-family: var(--font-family-p);
  border: solid var(--border-1) rgba(var(--bcolor), var(--alpha, 1));
  background-color: var(--tab-bg-color);
  overflow: hidden;
  cursor: pointer;
}

.tabs__tab span {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 400;
  padding: 11px 20px 11px 20px;
  color: var(--tab-text-color);
  pointer-events: none;
  padding: var(--tab-padding-y) var(--tab-padding-x);
}

.tabs__tab:hover {
  background: var(--tab-hover-bg-color);
  color: var(--tab-hover-text-color);
}

.tabs__tab:hover > span {
  color: var(--tab-hover-text-color);
}

.tabs__tab--active span {
  background: var(--tab-active-bg-color);
  color: var(--tab-active-text-color);
}

.tabs__tab--active:hover > span {
  color: var(--tab-active-hover-text-color);
}
.tabs__tab--active:hover {
  color: var(--tab-active-hover-text-color);
  cursor: auto;
}

.tabs__tab--active::after {
  content: "";
  position: absolute;
  background: var(--tab-indicator-color);
  inset: auto 0 0 0;
  height: var(--tab-indicator-size);
}

.tabs__panels {
  flex: 1;
}

.tabs__panel {
  display: none;
  background: var(--panel-bg-color);
  color: var(--panel-text-color);
  padding: var(--panel-padding);
}

.tabs__panel--active {
  display: block;
  animation: scale-x 150ms 1 ease-in-out;
}

.tabs__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tab-gap);
  background: var(--tablist-bg-color);
  padding: 0.4rem;
  flex-shrink: 0;
}

/* Modifiers */
.tabs--bottom {
  flex-direction: column-reverse;
}

.tabs--left {
  flex-direction: row;
}

.tabs--right {
  flex-direction: row-reverse;
}

.tabs--right .tabs__panel,
.tabs--left .tabs__panel {
  height: 100%;
}

.tabs--left .tabs__list,
.tabs--right .tabs__list {
  flex-direction: column;
  width: max-content;
}

.tabs--bottom .tabs__tab--active::after {
  inset: 0 0 auto 0;
}

.tabs--left .tabs__tab--active::after {
  inset: 0 0 0 auto;
  width: var(--tab-indicator-size);
  height: auto;
}

.tabs--right .tabs__tab--active::after {
  inset: 0 auto 0 0;
  width: var(--tab-indicator-size);
  height: auto;
}

@media (min-width: 480px) {
  .tabs--top-sm {
    flex-direction: column;
  }

  .tabs--bottom-sm {
    flex-direction: column-reverse !important;
  }

  .tabs--left-sm {
    flex-direction: row;
  }

  .tabs--right-sm {
    flex-direction: row-reverse;
  }

  .tabs--right-sm .tabs__panel,
  .tabs--left-sm .tabs__panel {
    height: 100%;
  }

  .tabs--left-sm .tabs__list,
  .tabs--right-sm .tabs__list {
    flex-direction: column;
    width: max-content;
  }

  .tabs--top-sm .tabs__list,
  .tabs--bottom-sm .tabs__list {
    flex-direction: row;
    width: 100%;
  }

  .tabs--top-sm .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--bottom-sm .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--left-sm .tabs__tab--active::after {
    inset: 0 0 0 auto;
    width: var(--tab-indicator-size);
    height: auto;
  }

  .tabs--right-sm .tabs__tab--active::after {
    inset: 0 auto 0 0;
    width: var(--tab-indicator-size);
    height: auto;
  }
}

@media (min-width: 768px) {
  .tabs--top-md {
    flex-direction: column;
  }

  .tabs--bottom-md {
    flex-direction: column-reverse !important;
  }

  .tabs--left-md {
    flex-direction: row;
  }

  .tabs--right-md {
    flex-direction: row-reverse;
  }

  .tabs--right-md .tabs__panel,
  .tabs--left-md .tabs__panel {
    height: 100%;
  }

  .tabs--left-md .tabs__list,
  .tabs--right-md .tabs__list {
    flex-direction: column;
    width: max-content;
  }

  .tabs--top-md .tabs__list,
  .tabs--bottom-md .tabs__list {
    flex-direction: row;
    width: 100%;
  }

  .tabs--top-md .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--bottom-md .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--left-md .tabs__tab--active::after {
    inset: 0 0 0 auto;
    width: var(--tab-indicator-size);
    height: auto;
  }

  .tabs--right-md .tabs__tab--active::after {
    inset: 0 auto 0 0;
    width: var(--tab-indicator-size);
    height: auto;
  }
}

@media (min-width: 1024px) {
  .tabs--top-lg {
    flex-direction: column;
  }

  .tabs--bottom-lg {
    flex-direction: column-reverse !important;
  }

  .tabs--left-lg {
    flex-direction: row;
  }

  .tabs--right-lg {
    flex-direction: row-reverse;
  }

  .tabs--right-lg .tabs__panel,
  .tabs--left-lg .tabs__panel {
    height: 100%;
  }

  .tabs--left-lg .tabs__list,
  .tabs--right-lg .tabs__list {
    flex-direction: column;
    width: max-content;
  }

  .tabs--top-lg .tabs__list,
  .tabs--bottom-lg .tabs__list {
    flex-direction: row;
    width: 100%;
  }

  .tabs--top-lg .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--bottom-lg .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--left-lg .tabs__tab--active::after {
    inset: 0 0 0 auto;
    width: var(--tab-indicator-size);
    height: auto;
  }

  .tabs--right-lg .tabs__tab--active::after {
    inset: 0 auto 0 0;
    width: var(--tab-indicator-size);
    height: auto;
  }
}

@media (min-width: 1280px) {
  .tabs--top-xl {
    flex-direction: column;
  }

  .tabs--bottom-xl {
    flex-direction: column-reverse !important;
  }

  .tabs--left-xl {
    flex-direction: row;
  }

  .tabs--right-xl {
    flex-direction: row-reverse;
  }

  .tabs--right-xl .tabs__panel,
  .tabs--left-xl .tabs__panel {
    height: 100%;
  }

  .tabs--left-xl .tabs__list,
  .tabs--right-xl .tabs__list {
    flex-direction: column;
    width: max-content;
  }

  .tabs--top-xl .tabs__list,
  .tabs--bottom-xl .tabs__list {
    flex-direction: row;
    width: 100%;
  }

  .tabs--top-xl .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--bottom-xl .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--left-xl .tabs__tab--active::after {
    inset: 0 0 0 auto;
    width: var(--tab-indicator-size);
    height: auto;
  }

  .tabs--right-xl .tabs__tab--active::after {
    inset: 0 auto 0 0;
    width: var(--tab-indicator-size);
    height: auto;
  }
}

@media (min-width: 1440px) {
  .tabs--top-xxl {
    flex-direction: column;
  }

  .tabs--bottom-xxl {
    flex-direction: column-reverse !important;
  }

  .tabs--left-xxl {
    flex-direction: row;
  }

  .tabs--right-xxl {
    flex-direction: row-reverse;
  }

  .tabs--right-xxl .tabs__panel,
  .tabs--left-xxl .tabs__panel {
    height: 100%;
  }

  .tabs--left-xxl .tabs__list,
  .tabs--right-xxl .tabs__list {
    flex-direction: column;
    width: max-content;
  }

  .tabs--top-xxl .tabs__list,
  .tabs--bottom-xxl .tabs__list {
    flex-direction: row;
    width: 100%;
  }

  .tabs--top-xxl .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--bottom-xxl .tabs__tab--active::after {
    inset: auto 0 0 0;
    height: var(--tab-indicator-size);
    width: auto;
  }

  .tabs--left-xxl .tabs__tab--active::after {
    inset: 0 0 0 auto;
    width: var(--tab-indicator-size);
    height: auto;
  }

  .tabs--right-xxl .tabs__tab--active::after {
    inset: 0 auto 0 0;
    width: var(--tab-indicator-size);
    height: auto;
  }
}
/* //ANCHOR */
/* //ANCHOR -----Search-Bar ______*/
.search label {
  height: var(--heightBar);
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: #ffffff00;
}
.search svg,
.search img {
  height: 100%;
  width: 100%;
}
.search label:focus-within {
  outline: 4px solid rgba(var(--highlight), var(--alpha, 0.7)) !important;
}
.search label:hover {
  outline: 2px solid rgba(var(--highlight), var(--alpha, 0.7));
}
.search__input {
  width: 100%;
  border: 0;
  background-color: #00000000;
}
.search__input:focus {
  outline: none;
}
.search__results {
  display: none;
  position: absolute;
  top: var(--top-destance);
  right: 0;
  left: auto;
  width: 100%;
  max-height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  touch-action: pan-y;
  isolation: isolate;
  border-bottom: solid var(--border-1) rgba(var(--bcolor), var(--alpha, 1));
  border-top: solid var(--border-1) rgba(var(--bcolor), var(--alpha, 1));
  z-index: 10;
}
.search__result-item {
  padding: var(--result-item-padding);
}
.search__result-item:not(:last-child) {
  border-bottom: var(--trennlinie);
}
.search-result-link {
  cursor: pointer;
  display: block;
  width: 100%;
}
.search-result-link--heading {
  font-weight: bold;
}
.search__results-empty {
  padding: var(--empty-padding);
  text-align: var(--empty-align);
}
.search__button {
  position: relative;
  height: var(--heightButton);
  background-color: #ffffff00;
  justify-content: center;
  align-items: center;
  align-self: center;
  text-align: center;
  border: 0;
}
.search__button[data-state="active"] {
  cursor: pointer;
  opacity: 1;
}
.search__button[data-state="inactive"] {
  cursor: not-allowed;
  opacity: 0.4;
  box-shadow: none;
}
.search--small label {
  width: var(--heightBar);
  transition: all 150ms ease-in-out;
}
.search--small input {
  width: 1px;
  transition: all 150ms ease-in-out;
}
.search--small label:hover,
.search--small label:hover input {
  width: 100%;
  transition: all 150ms ease-in-out;
}
/* //ANCHOR */
/* //ANCHOR -----Accordion ______*/
.accordion {
  width: 100%;
  overflow: hidden;
}
.accordion__item {
  border-bottom: var(--accordion-separator);
}
.accordion__item:last-child {
  border-bottom: none;
}
.accordion__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--accordion-trigger-padding);
  background: var(--accordion-trigger-bg-color);
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-family-p);
  font-size: var(--type-size-1);
  font-weight: 700;
  color: var(--accordion-trigger-color);
  transition:
    background var(--accordion-transition),
    color var(--accordion-transition);
}
.accordion__trigger:hover {
  background: var(--accordion-trigger-bg-color-hover);
  color: var(--accordion-trigger-color-hover);
}
.accordion__trigger:hover * {
  color: var(--accordion-trigger-color-hover);
}
.accordion__item--open > .accordion__trigger {
  background: var(--accordion-trigger-bg-color-open);
}
.accordion__trigger:focus-visible {
  outline: 3px solid rgba(var(--highlight), var(--alpha), 1);
  outline-offset: -3px;
}
.accordeon__icon {
  display: flex;
  align-items: center;
}
.accordeon__icon * {
  display: flex;
  width: var(--accordion-icon-size);
  height: var(--accordion-icon-size);
}
.accordion__arrow {
  display: inline-block;
  width: var(--nav-arrow-size);
  height: var(--nav-arrow-size);
  border-right: 1.5px solid var(--nav-arrow-color);
  border-bottom: 1.5px solid var(--nav-arrow-color);
  transform: rotate(45deg) translateY(-4px);
  transition: transform 200ms ease;
}
.accordion__item--open > .accordion__trigger .accordion__arrow {
  transform: rotate(-135deg);
  transition: transform 200ms ease;
}
.accordion__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--accordion-transition);
}
.accordion__item--open > .accordion__panel {
  padding: inherit;
}
.accordion__content {
  padding: var(--accordion-content-padding);
  background: var(--accordion-content-bg-color);
  border-top: var(--accordion-separator);
}
.accordion__item--inactive > .accordion__trigger {
  opacity: var(--accordion-disabled-opacity);
  cursor: not-allowed;
  pointer-events: none;
}
/* //ANCHOR */
/* //ANCHOR -----pixel ______*/
.pixel {
  width: max-content;
}
.pixel__1 {
  min-width: var(--pixel-h);
  min-height: var(--pixel-h);
}
.pixel__2 {
  min-width: var(--pixel2-h);
  min-height: var(--pixel2-h);
}
.pixel__3 {
  min-width: var(--pixel3-h);
  min-height: var(--pixel3-h);
}