.wl-faq {
  --faq-space-y: clamp(72px, 10.4167vw, 200px);
  --faq-title-size: clamp(25px, 1.875vw, 36px);
  --faq-question-size: clamp(16px, 1.3542vw, 26px);
  --faq-answer-size: clamp(14px, 0.9375vw, 18px);
  --faq-gap: clamp(24px, 2.6042vw, 50px);
  --faq-row-pad-x: clamp(18px, 1.5625vw, 30px);
  --faq-row-pad-y: clamp(20px, 1.5625vw, 30px);
  --faq-rule: rgba(var(--color-text-rgb), 0.25);
  padding-block: var(--faq-space-y);
  color: var(--color-dark);
  background: #ececec;
}

.wl-faq__title {
  position: relative;
  max-width: clamp(640px, 45.8333vw, 880px);
  margin: 0 0 var(--faq-gap);
  padding-bottom: var(--faq-gap);
  font-size: var(--faq-title-size);
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.06em;
}

.wl-faq__title::after {
  content: '';
  position: absolute;
  inset-inline-start: calc(-1 * max(var(--space-page-fluid), (100vw - var(--container-max)) / 2));
  inset-inline-end: 0;
  bottom: 0;
  height: 1px;
  background: var(--faq-rule);
  pointer-events: none;
}

.wl-faq__item {
  border-bottom: 1px solid var(--faq-rule);
  transition: background-color 380ms ease, border-color 380ms ease;
}
.wl-faq__item[open] { border-color: transparent; background: var(--color-white); }
.wl-faq__list.is-enhanced .wl-faq__item:not(.is-expanded) {
  border-color: var(--faq-rule);
  background: transparent;
}
.wl-faq__item.is-animating { overflow: hidden; }

.wl-faq__question {
  font-family: var(--font-heading);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  min-height: 44px;
  padding: var(--faq-row-pad-y) var(--faq-row-pad-x);
  font-size: var(--faq-question-size);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.04em;
  list-style: none;
  cursor: pointer;
}
.wl-faq__question::-webkit-details-marker { display: none; }
.wl-faq__question svg {
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  transition: transform 200ms ease;
}
.wl-faq__item[open] .wl-faq__question svg { transform: rotate(180deg); }
.wl-faq__list.is-enhanced .wl-faq__item:not(.is-expanded) .wl-faq__question svg { transform: none; }
.wl-faq__question:focus-visible { outline-color: var(--color-dark); outline-offset: -3px; }
.wl-faq__answer {
  padding: 0 var(--faq-row-pad-x) var(--faq-row-pad-y);
  font-size: var(--faq-answer-size);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.wl-faq__answer > :first-child { margin-top: 0; }
.wl-faq__answer > :last-child { margin-bottom: 0; }
.wl-faq__answer a:focus-visible { outline-color: var(--color-dark); }

@media (prefers-reduced-motion: reduce) {
  .wl-faq__item,
  .wl-faq__question svg { transition: none; }
}