.faq-item {
  transition: background var(--transition-speed) var(--transition-function);
  margin-bottom: 20px;
  border-radius: var(--site-border-radius);
  border: 1px solid var(--site-border-color);
}
.faq-item-question {
  padding: 30px 40px;
  cursor: pointer;
  position: relative;
  user-select: none;
  font-family: var(--site-heading-font-family);
  font-weight: 600;
  font-size: 18px;
}
.faq-item-question::marker {
  content: "";
}
.faq-item-question:after {
  content: "";
  position: absolute;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='10' viewBox='0 0 16 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L8 8L15 1' stroke='%23212121' stroke-width='2'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  right: 0;
  top: 50%;
  width: 16px;
  height: 10px;
  transform: translate(-20px, -50%);
  transition: transform var(--transition-speed) var(--transition-function);
}
.faq-item-answer {
  padding: 0 40px;
  overflow: hidden;
  max-height: 0;
  transition: max-height var(--transition-speed) var(--transition-function);
  transition-behavior: allow-discrete;
}
.faq-item-answer__inner {
  margin-top: 20px;
  padding-bottom: 30px;
}
.faq-item-answer__inner p:last-child {
  margin-bottom: 0;
}
.faq-item.is-open {
  background: var(--site-primary-color);
}
.faq-item.is-open .faq-item-question:after {
  transform: translate(-20px, -50%) rotate(180deg);
}
.faq-item:not(.is-open):hover {
  background: #f5f5f5;
}