.accordion {
  border: 0;
}

.accordion .accordion-heading {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 0;
  cursor: pointer;
  list-style: none;
}

.accordion .accordion-heading::-webkit-details-marker {
  display: none;
}

.accordion .accordion-title {
  color: var(--blue-90);
  margin-bottom: 0;
  margin-right: 35px;
}

.accordion .accordion-heading i {
  position: absolute;
  right: 0;
  color: var(--blue-90);
  transition: opacity 0.2s ease;
}

.accordion .accordion-heading .fa-circle-plus {
  opacity: 1;
}

.accordion .accordion-heading .fa-circle-minus {
  opacity: 0;
}

.accordion[open] .accordion-heading .fa-circle-plus {
  opacity: 0;
}

.accordion[open] .accordion-heading .fa-circle-minus {
  opacity: 1;
}

.accordion .accordion-body {
  min-height: 0;
  overflow: hidden;
  padding-bottom: 0;
}

.accordion > .accordion-collapse {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: grid-template-rows 220ms ease, opacity 180ms ease;
}

.accordion[open] > .accordion-collapse {
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.accordion[open] .accordion-body {
  padding-bottom: 15px;
}

@media (min-width: 576px) {
  .accordion .accordion-title {
    font-size: 25px;
    margin-right: 50px;
  }

  .accordion .accordion-heading i {
    font-size: 40px;
  }
}
