.faq {
  border-top:1px solid var(--hairline)
}
.faq-layout {
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:70px;
  align-items:start
}
.faq-intro {
  position:sticky;
  top:130px
}
.faq-intro .eyebrow {
  margin-bottom:18px
}
.faq-intro h2 {
  font-size:clamp(2.3rem,4vw,4.2rem);
  line-height:1.04;
  margin-bottom:18px
}
.faq-list {
  border-top:1px solid var(--hairline)
}
.faq-item {
  border-bottom:1px solid var(--hairline)
}
.faq-question {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:22px 0;
  text-align:left;
  cursor:pointer
}
.faq-question span:first-child {
  font-family:var(--font-display);
  font-size:1rem;
  font-weight:700
}
.faq-plus {
  display:grid;
  place-items:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border:1px solid var(--border);
  border-radius:50%;
  color:var(--purple-300);
  transition:transform .3s var(--ease),background .3s ease
}
.faq-item.is-open .faq-plus {
  transform:rotate(45deg);
  background:rgba(139,92,246,.09)
}
.faq-answer {
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .45s var(--ease)
}
.faq-answer>div {
  overflow:hidden
}
.faq-answer p {
  padding:0 54px 0 0;
  font-size:.91rem
}
.faq-item.is-open .faq-answer {
  grid-template-rows:1fr
}
.faq-item.is-open .faq-answer p {
  padding-bottom:22px
}
