/* ==========================================================================
   faq.css — FAQ page only
   ========================================================================== */

.faq-hero{
  padding: clamp(54px, 7vw, 94px) 0 42px;
  border-bottom: 1px solid var(--line);
}

.faq-section{
  padding-top: 42px;
}

.faq-block{
  margin-bottom: 34px;
}

.faq-list{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

.faq-item{
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 0;
  background: rgba(255,255,255,.04);
}

.faq-item summary{
  cursor: pointer;
  list-style: none;
  padding: 16px 18px;
  font-weight: 800;
  outline: none;
}

.faq-item summary::-webkit-details-marker{
  display: none;
}

.faq-item summary::after{
  content: '+';
  float: right;
  font-size: 1.4rem;
  line-height: 1;
  opacity: .7;
}

.faq-item[open] summary::after{
  content: '–';
}

.faq-content{
  padding: 0 18px 18px;
  color: var(--muted);
}

.faq-content p{
  margin: 0;
}

/* CTA */
/* Space between last FAQ item block and the CTA card */
.faq-section{
  padding-bottom: 36px;
}

/* Make the CTA feel separated from surrounding sections */
.faq-cta{
  padding: 56px 0 80px;  /* top + bottom breathing room */
}

/* If your CTA uses .cta-inner, ensure it has nice internal padding */
.faq-cta .cta-inner{
  padding: 28px;
}