.oa-faq-section {
  background: #fff;
  padding: 120px var(--oa-content-padding);
  box-sizing: border-box;
}
.oa-faq-section * { box-sizing: border-box; }
.oa-faq-section img { display: block; max-width: 100%; }
.oa-faq-section p { margin: 0; }

.oa-faq-wrap {
  display: grid;
  grid-template-columns: minmax(420px, 620px) minmax(360px, 512px);
  gap: clamp(72px, 9vw, 130px);
  align-items: start;
  justify-content: space-between;
}

.oa-faq-questions { display: flex; flex-direction: column; gap: 24px; }
.oa-faq-item {
  background: #f6f7f8;
  border-radius: 7px;
  padding: 30px 28px;
}
.oa-faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 0.36px;
  color: #212b35;
  list-style: none;
  font-family: var(--oa-font-body);
}
.oa-faq-item summary::-webkit-details-marker { display: none; }
.oa-faq-toggle-icon {
  position: relative;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
.oa-faq-toggle-icon::before,
.oa-faq-toggle-icon::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px;
  height: 2px;
  border-radius: 1px;
  background: #151e29;
  transform: translate(-50%, -50%);
}
.oa-faq-toggle-icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.oa-faq-item[open]:not(.is-closing) .oa-faq-toggle-icon { transform: rotate(45deg); }
.oa-faq-answer-panel { overflow: hidden; }
.oa-faq-item .oa-faq-answer { max-width: 548px; margin-top: 22px; font-size: 16px; line-height: 1.42; color: #5b6570; letter-spacing: 0.16px; font-family: var(--oa-font-body); }
.oa-faq-item:not([open]) {
  min-height: 82px;
  display: flex;
  align-items: center;
}
.oa-faq-item:not([open]) summary { width: 100%; }

.oa-faq-cta {
  height: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  gap: 88px;
  padding-top: 0;
}
/* position: sticky clamps against its own containing block — its nearest
   block/flex/grid-container ancestor — never against a later sibling of that
   ancestor. .oa-faq-heading-group used to be that ancestor's direct child,
   sharing .oa-faq-cta with .oa-faq-call-card, so its sticky clamp let it
   travel the full height of .oa-faq-cta — including sliding on top of the
   card once the FAQ list scrolled far enough for the pinned heading to reach
   that far down. (A CSS grid with the heading in its own 1fr row looks like
   it should fix this — same idea, row instead of ancestor — but grid ROWS
   don't create separate containing blocks for their items' sticky offset;
   verified this the hard way with an actual scrolled render before finding
   that out.) .oa-faq-sticky-zone is what actually fixes it: a real wrapper
   around just the heading, flex: 1 1 auto so it fills exactly the space
   above the card and nothing more, and IT — not .oa-faq-cta — is what
   .oa-faq-heading-group's sticky offset is clamped against. Since the zone's
   own bottom edge can never extend past where .oa-faq-call-card begins (they
   are plain adjacent flex children), neither can the sticky heading inside
   it. */
.oa-faq-sticky-zone { flex: 1 1 auto; min-height: 0; }
.oa-faq-heading-group {
  position: sticky;
  top: 120px;
  z-index: 1;
}
.oa-faq-cta .oa-faq-heading-group { display: flex; flex-direction: column; gap: 18px; }
.oa-faq-eyebrow {
  font-family: var(--oa-font-mono);
  font-size: 14px;
  line-height: 1;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--oa-text-regular);
}
.oa-faq-heading {
  font-family: var(--oa-font-heading);
  font-size: 48px;
  line-height: 1.08;
  font-weight: 400;
  color: var(--oa-text-dark);
  margin: 0;
}
.oa-faq-heading-accent {
  display: block;
  font-family: var(--oa-font-accent);
  font-style: italic;
  font-weight: 500;
  font-size: 62px;
  line-height: .82;
  color: var(--oa-green-600);
  letter-spacing: -1.24px;
}

.oa-faq-call-card {
  position: relative;
  background: #f6f7f8;
  border: 1px solid #fff;
  border-radius: 7px;
  min-height: 365px;
  padding: 23px 22px;
  overflow: hidden;
}
.oa-faq-call-card::after {
  content: '';
  position: absolute;
  right: 22px;
  top: 22px;
  width: 12px;
  height: 12px;
  background: linear-gradient(45deg, transparent 0 50%, #dfe3e7 50% 100%);
}
.oa-faq-call-card-inner {
  min-height: 303px;
  padding: 16px 38px 38px;
  border-top: 1px solid #dfe3e7;
  border-right: 1px solid #dfe3e7;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.oa-faq-call-card .oa-avatar { width: 73px; height: 73px; border-radius: 50%; overflow: hidden; background: #7a8686; flex-shrink: 0; border: 3px solid #fff; box-shadow: 0 18px 26px rgba(0, 35, 42, .1); margin-bottom: 30px; }
.oa-faq-call-card .oa-avatar img { width: 100%; height: 100%; object-fit: cover; }
.oa-faq-call-copy { margin-bottom: 42px; }
.oa-faq-call-card h4 { font-size: 20px; line-height: 1.2; font-weight: 700; margin: 0 0 16px; color: #151e29; font-family: var(--oa-font-body); }
.oa-faq-call-card p { max-width: 320px; font-size: 18px; line-height: 1.42; color: #3f494f; letter-spacing: 0.18px; font-family: var(--oa-font-body); }
.oa-faq-call-card .oa-btn { margin-top: auto; border-radius: 4px; }
.oa-faq-call-card .oa-btn-label { min-width: 174px; padding: 15px 24px 14px; justify-content: center; text-align: center; color: #061f24; }
.oa-faq-call-card .oa-btn-icon { padding: 15px; }
.oa-faq-call-card .oa-btn-icon svg { width: 18px; height: 18px; }

@media (max-width: 980px) {
  .oa-faq-wrap { grid-template-columns: 1fr; }
  .oa-faq-cta {
    height: auto;
    min-height: 0;
    gap: 48px;
  }
  .oa-faq-heading-group {
    position: static;
  }
}

@media (max-width: 767px) {
  .oa-faq-section {
    width: 100%;
    max-width: 100%;
    padding: 64px 20px 72px;
  }
  .oa-faq-wrap { gap: 56px; }
  .oa-faq-cta {
    order: -1;
    width: 100%;
    gap: 36px;
  }
  .oa-faq-questions {
    order: 1;
    width: 100%;
  }
  .oa-faq-questions { gap: 14px; }
  .oa-faq-item { width: 100%; padding: 22px 18px; }
  .oa-faq-item summary { align-items: flex-start; font-size: 16px; line-height: 1.35; }
  .oa-faq-item:not([open]) { min-height: 70px; }
  .oa-faq-item .oa-faq-answer { margin-top: 16px; font-size: 15px; }
  .oa-faq-heading { font-size: clamp(34px, 9vw, 40px); }
  .oa-faq-heading-accent { font-size: clamp(46px, 13vw, 54px); }
  .oa-faq-call-card { min-height: 0; padding: 16px 14px; }
  .oa-faq-call-card-inner { min-height: 0; padding: 16px 18px 28px; }
  .oa-faq-call-card p { font-size: 16px; }
  .oa-faq-call-card .oa-btn { width: 100%; }
  .oa-faq-call-card .oa-btn-label { min-width: 0; flex: 1; }
}

@media (max-width: 380px) {
  .oa-faq-section { padding-left: 16px; padding-right: 16px; }
}