/* Tabs */
.content > .frame-type-tabs.-itempadding > .tabs__content > .grid__main > .grid__col > .grid__main {
  padding-bottom: var(--p);
}

.content > .frame-type-tabs.-itempadding > .tabs__content > .grid__main > .grid__col > .frame-bg-grey,
.content > .frame-type-tabs.-itempadding > .tabs__content > .grid__main > .grid__col > .frame-bg-grey + .frame,
.content > .frame-type-tabs.-itempadding > .tabs__content > .grid__main > .grid__col > .grid__main:first-child {
  padding-top: var(--p);
}

.content > .frame-type-tabs.-itempadding {
  padding-bottom: 0 !important;
}

.content > .frame-type-tabs,
.content > .frame-type-tabs > .tabs__content > .grid__main.frame-type-col1-100 {
  display: block;
}

.content > .frame-type-tabs > .tabs__content > .grid__main,
.content > .frame-type-tabs > .tabs__content > .grid__main.frame-type-col1-100 > .grid__col > .grid__main {
  display: grid;
}

.tabs__content {
  display: none;
}

.frame-type-tabs:not(.-itempadding) > .tabs__content {
  margin-top: var(--g-gap);
}

.tabs__content.-active {
  display: block;
}

.tabs__nav {
  display: flex;
  justify-content: center;
  gap: var(--g-gap-s);
  flex-wrap: wrap;
}

/* Tabs vertical */
.tabs.-vertical .tabs__nav {
  margin-bottom: var(--g-gap);
}

/* Accordion general */
.accordion__content {
  display: none;
}

.accordion__header.-active + .accordion__content {
  display: block;
}

.accordion__header {
  position: relative;
  font-size: var(--f-size);
}

.accordion__button {
  width: 100%;
  text-align: left;
}

/* Accordion vertical */
.accordion.-vertical .accordion__content > div > .headline {
  display: none;
}

.accordion.-vertical .accordion__header::after {
  content: '\f078';
  font-family: 'FaLight', sans-serif;
  font-size: var(--f-size-l-2);
  line-height: 100%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: var(--g-gap);
}

.accordion.-vertical .accordion__header.-active::after {
  content: '\f077';
}

/* Accordion horizontal */
.accordion.-horizontal {
  display: flex;
  flex-direction: column;
  gap: var(--g-gap-s);
}

.accordion.-horizontal .accordion__header.-active {
  display: none;
}

/* =============================================================================
   Media Queries
   ========================================================================== */

@media (min-width: 640px) {
  /* Tabs vertical */
  .tabs.-vertical {
    display: grid;
    grid-gap: 0 var(--g-gap);
    grid-template-columns: 1fr 2fr;

    & .tabs__nav {
      grid-column: 1;
      flex-direction: column;
      justify-content: start;
    }

    & .tabs__content {
      grid-column: 2;
    }
  }
}

@media (min-width: 800px) {
  /* Accordion horizontal */
  .accordion.-horizontal {
    flex-direction: row;
    height: 36vw;
  }

  .accordion.-horizontal .accordion__buttontext {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
  }

  .accordion.-horizontal .accordion__button,
  .accordion.-horizontal .accordion__header {
    height: 100%;
  }

  .accordion.-horizontal .accordion__button {
    text-align: center;
  }

  .accordion.-horizontal .accordion__item {
    transition: flex-grow 0.3s ease;
    -moz-transition: none;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
  }

  @-moz-document url-prefix() {
    .accordion.-horizontal .accordion__item {
      transition: none !important;
    }
  }

  .accordion.-horizontal .accordion__header.-active + .accordion__content {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
}

@media (min-width: 1580px) {
  /* Accordion horizontal */
  .accordion.-horizontal {
    height: 500px;
  }
}