/* Preserve the template layout while native buttons own the FAQ state. */
.expandable-single[data-ry-faq-ready] {
  cursor: default;
}

.expandable-single[data-ry-faq-ready] > .expandable-top {
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.expandable-single[data-ry-faq-ready] > .expandable-top:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 8px;
}

/* Webflow may reapply inline height/opacity on load or breakpoint changes. */
.expandable-single[data-ry-faq-ready] > .expandable-bottom {
  width: auto !important;
  height: auto !important;
  opacity: 1 !important;
}

.expandable-single[data-ry-faq-ready] > .expandable-bottom[hidden] {
  display: none !important;
}

.ry-faq-content {
  width: 100%;
  overflow: hidden;
}

.ry-faq-content-body {
  display: flow-root;
}

details.ry-pages-faq[data-ry-faq-ready] > .ry-faq-answer {
  margin-top: 0;
}

details.ry-pages-faq[data-ry-faq-ready] .ry-faq-content-body {
  padding-top: var(--spacing--24);
}

details.ry-pages-faq[data-ry-faq-ready] .ry-pages-question-number {
  flex: 0 0 auto;
  white-space: nowrap;
}

.expandable-single[data-ry-faq-ready] .faq-vertical {
  transform: rotate(0deg) !important;
  transition: transform 180ms ease;
}

.expandable-single[data-ry-faq-open="true"] .faq-vertical {
  transform: rotate(90deg) !important;
}

@media (prefers-reduced-motion: reduce) {
  .expandable-single[data-ry-faq-ready] .faq-vertical {
    transition: none;
  }
}