/* FAQ section — same look as the article FAQ block (blog-single.css),
   duplicated here so pages don't pull the whole article stylesheet. */

.section.faq-sec { padding-block: var(--space-l) var(--space-5xl); }

.faq { display: flex; flex-direction: column; gap: var(--space-l); }
.faq--w100 { width: 100%; }
.faq--w66 { width: 66%; }
.faq--w50 { width: 50%; }
.faq--pos-left { margin-inline: 0 auto; }
.faq--pos-center { margin-inline: auto; }
.faq--pos-right { margin-inline: auto 0; }
@media (max-width: 767px) {
  .faq--w66,
  .faq--w50 { width: 100%; }
}
.faq__heading {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: var(--fs-h-l);
  line-height: var(--lh-h-l);
  letter-spacing: var(--ls-h-l);
  color: var(--color-grey-900);
}
.faq__heading em,
.faq__heading i { font-style: italic; }
.faq__list { display: flex; flex-direction: column; padding-inline: var(--space-3xs); }
.faq__item { border-bottom: 1px solid var(--color-grey-400); }
.faq__q {
  display: flex;
  align-items: center;
  gap: var(--space-s);
  justify-content: space-between;
  padding-block: var(--space-s);
  cursor: pointer;
  list-style: none;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q-text { font-size: var(--fs-body-m); line-height: var(--lh-body-m); font-weight: 500; color: var(--color-grey-900); }
.faq__icon { flex: 0 0 auto; transition: transform .2s ease; }
.faq__item[open] .faq__icon { transform: rotate(90deg); }
.faq__q[aria-expanded="true"] .faq__icon { transform: rotate(90deg); }
.faq__q[aria-expanded="false"] .faq__icon { transform: rotate(0deg); }
.faq__a { padding-bottom: var(--space-s); font-size: var(--fs-body-m); line-height: var(--lh-body-m); color: var(--color-grey-800); }
.faq__a > * + * { margin-top: var(--space-s); }