/* Support Center page. Builds on .legal-hero (legal.css) and .faq / .audience-card (styles.css). */

.rewrite-lp .support-hero .lede { margin-top: 16px; }

.rewrite-lp .support-wrap {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px 96px;
  display: flex;
  flex-direction: column;
  gap: 56px;
}

/* Contact card */
.rewrite-lp .support-contact {
  display: flex;
  align-items: center;
  gap: 20px;
  background: linear-gradient(150deg, var(--purple-600), var(--purple-900));
  color: #fff;
  border-radius: 20px;
  padding: 28px 30px;
  box-shadow: 0 20px 40px rgba(90,30,150,0.2);
}
.rewrite-lp .support-contact .card-icon { margin-bottom: 0; flex-shrink: 0; }
.rewrite-lp .support-contact h2 { font-size: 1.15rem; font-weight: 700; }
.rewrite-lp .support-contact p { margin-top: 4px; font-size: 0.9rem; color: rgba(255,255,255,0.75); }
.rewrite-lp .support-contact .btn { margin-left: auto; flex-shrink: 0; }

/* Section headings */
.rewrite-lp .support-section-head { text-align: center; }
.rewrite-lp .support-section-head .section-title.center { margin-top: 14px; }

/* FAQ — reuse .faq-item, without the full-bleed section padding */
.rewrite-lp .support-faq .faq-list { margin-top: 32px; max-width: none; }
.rewrite-lp .support-faq .faq-item { border: 1px solid var(--purple-100); }
.rewrite-lp .support-faq .faq-item summary { gap: 16px; }
.rewrite-lp .faq-item ul { margin: 10px 0 0; padding-left: 20px; color: var(--gray-600); font-size: 0.9rem; line-height: 1.5; }
.rewrite-lp .faq-item li { margin-bottom: 6px; }
.rewrite-lp .faq-item li strong { color: var(--gray-900); }
.rewrite-lp .faq-item a,
.rewrite-lp .support-billing a {
  color: var(--purple-600);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Billing cards */
.rewrite-lp .support-billing .audience-grid { grid-template-columns: repeat(3, 1fr); margin-top: 32px; }

/* Legal links row */
.rewrite-lp .support-legal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 26px;
  border-radius: 16px;
  background: var(--purple-50);
  font-size: 0.92rem;
}
.rewrite-lp .support-legal span { color: var(--gray-600); }
.rewrite-lp .support-legal nav { display: flex; gap: 24px; }
.rewrite-lp .support-legal nav a { color: var(--purple-600); font-weight: 600; }
.rewrite-lp .support-legal nav a:hover { color: var(--purple-700); }

@media (max-width: 900px) {
  .rewrite-lp .support-billing .audience-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .rewrite-lp .support-wrap { padding: 0 20px 72px; gap: 44px; }
  .rewrite-lp .support-contact { flex-direction: column; text-align: center; padding: 26px 22px; }
  .rewrite-lp .support-contact .btn { margin-left: 0; }
  .rewrite-lp .support-legal { flex-direction: column; text-align: center; }
}
