.surface-faq {
  position: relative; 
  overflow: hidden;
}

[data-per-row="2"].module__collapsible-text-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.surface-faq__background {
  height: 100%;
  left: 50%;
  min-width: 110%;
  position: absolute !important;
  top: 30px;
  transform: translate(-50%, 0) rotate(-1.5deg);
  -webkit-transform: translate(-50%, 0) rotate(-1.5deg);
  width: auto;
}

.surface-faq__overlay {
  position: absolute;
  top: 4%;
  left: -5%;
  width: 110%;
  height: 100%;
  z-index: 2;
  transform: rotate(-1.5deg);
  -webkit-transform: rotate(-1.5deg);
}

.surface-faq__container {
  position: relative;
  z-index: 9;
  margin: 0 auto;
}

.surface-faq__container {
  padding: 550px 0 150px 0;
  width: 100%;
  text-align: center;
  z-index: 999;
}

.surface-faq__buttons {
  margin-top: 30px; 
}

.surface-faq__buttons a {
  display: inline-block;
}

.surface-faq__wave {
  position: absolute;
  bottom: -2px;
  z-index: 99;
  width: 100%;
  display: flex;
  align-items: flex-end;
}

.dnd-section.z-forward {
  position: relative;
  z-index: 9999;
}

.surface-faq__background video {
  position: relative;
  object-fit: cover;
  width: 100% !important;
  height: 100%;
}

.surface-faq h1 {
  text-shadow: 2px 2px 60px rgba(0,0,0,.5);
}

.module__collapsible-text {
  border-top: 1px solid var(--collapsible-border-color);
}

.module__collapsible-text__title {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: block;
  padding: 20px;
  position: relative;
  text-align: left;
  width: 100%;
}

.module__collapsible-text__heading {
  margin: 0;
}

.module__collapsible-text__title-text {
  font-stretch: condensed;
  transition: .2s color;
  -webkit-transition: .2s color;
  display: block;
  padding-right: 54px;
  position: relative;
  font-size: 1.1em;
}

.module__collapsible-text__title:hover .module__collapsible-text__title-text {
  color: var(--links-hover-color);
}

.module__collapsible-text__title::after,
.module__collapsible-text__title::before {
  border-color: var(--h3-font-color);
  content: '';
  position: absolute;
  border-top-width: 2px;
  border-top-style: solid;
  right: 20px;
  top: 0;
  bottom: 0;
  width: 14px;
  height: 0;
  margin: auto;
  -webkit-transition: .2s transform;
  transition: .2s transform;
}

.module__collapsible-text__title::after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.module__collapsible-text--active .module__collapsible-text__title::after {
  -webkit-transform: none;
  transform: none;
}

.module__collapsible-text__title:focus-visible {
  outline: 3px solid #005fcc;
  outline-offset: 2px;
}

.module__collapsible-text__body {
  padding: 20px;
  padding-top: 0
}

.module__collapsible-text__body p:first-child {
  margin-top: 0
}

.module__collapsible-text__body-wrapper {
  margin-top: 0;
  display: none
}

.module__collapsible-text--active .module__collapsible-text__body-wrapper {
  display: block
}

@media (min-width: 800px) {

  .module__collapsible-text-wrapper .module__collapsible-text {
    margin-bottom: 1em
  }

  .module__collapsible-text-wrapper[data-per-row="1"] .module__collapsible-text {
      width: 100%;
      margin-bottom: 0
  }

  .module__collapsible-text-wrapper[data-per-row="2"] .module__collapsible-text {
      width: calc((100% / 2) - 1.5em)
  }

  .module__collapsible-text-wrapper[data-per-row="3"] .module__collapsible-text {
      width: calc((100% / 3) - 1.5em)
  }

  .module__collapsible-text-wrapper[data-per-row="4"] .module__collapsible-text {
      width: calc((100% / 4) - 1.5em)
  }

  .module__collapsible-text-wrapper[data-per-row="5"] .module__collapsible-text {
      width: calc((100% / 5) - 1.5em)
  }
}

.module-wrapper--dark .module__collapsible-text__title:hover .module__collapsible-text__title-text {
  color: var(--dark-links-hover);
}

.module-wrapper--dark .module__collapsible-text__title::after,
.module-wrapper--dark .module__collapsible-text__title::before {
  border-color: var(--dark-h3);
}

.module-wrapper--dark .module__collapsible-text {
  border-top: 1px solid var(--collapsible-dark-border-color);
}


.surface-faq__background > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-attachment: fixed;
}

@supports (-webkit-touch-callout: none) {
  .surface-faq__background > div {
    background-attachment: scroll;
  }
}

.surface-faq__background div:not(.active) {
  opacity: 0;
}

.surface-faq .active {
  opacity: 1;
}

.surface-faq__ball {
  position: absolute;
  max-width: 300px;
  z-index: 99;
}

.module__collapsible-text-wrapper {
  margin: 0 auto;
  text-align: left;
  filter: drop-shadow(2px 4px 16px rgba(0,0,0,.25));
  -webkit-filter: drop-shadow(2px 4px 16px rgba(0,0,0,.25));
}

.module__collapsible-text__title:before,
.module__collapsible-text__title:after {
  border-color: white;
}

.module__collapsible-text__title:hover .module__collapsible-text__title-text,
.module__collapsible-text--active .module__collapsible-text__title-text {
  color: var(--alpha);
}

.module__collapsible-text__title:hover:before,
.module__collapsible-text__title:hover:after,
.module__collapsible-text--active .module__collapsible-text__title:before,
.module__collapsible-text--active .module__collapsible-text__title:after {
  border-color: var(--alpha);
}

.module__collapsible-text {
  background: rgba(255, 255, 255, .1);
}

.module__collapsible-text--active {
  background: rgba(255, 255, 255, .2);
}

.surface-faq__title {
  margin-bottom: 30px;
}

.dnd-section:has(.surface-faq):before {
  position: absolute;
  content: '';
  left: 0;
  top: 98%;
  background: #1D2439;
  width: 100%;
  height: 200px;
  transform: rotate(-1.5deg);
  -webkit-transform: rotate(-1.5deg);
  z-index: 99;
}