function FAQ() {
  const items = [
    { q: 'Are these online degrees recognized?', a: 'Yes. Every partner program is either UGC-entitled or approved by the relevant statutory body, and recognized for government jobs, higher studies and employment in India and abroad.' },
    { q: 'Can working professionals apply?', a: 'Absolutely. Over 70% of our enrolees are working professionals. Evening and weekend live classes, plus recorded sessions, make it possible to finish a degree without pausing your career.' },
    { q: 'How do I choose the right course?', a: 'Start with the AI match or book a free counseling call. Most students finalize a program after 1–2 calls, with a shortlist of 3 options compared side-by-side.' },
    { q: 'Is there placement support?', a: 'Yes — 9 months of active placement assistance after enrolment, including resume review, mock interviews, curated openings and mentor introductions.' },
    { q: 'Are EMI and scholarship options available?', a: '0% EMI plans up to 36 months across most programs, plus scholarship matching where you qualify. Your advisor will walk through the full fee structure upfront.' },
    { q: 'What documents are needed for admission?', a: 'Typically: ID proof, academic transcripts, work experience letter (if applicable), and two passport photos. Your advisor handles the full checklist and liaison.' },
  ];
  const [open, setOpen] = useState(0);
  return (
    <section className="section" id="faq">
      <div className="container">
        <FadeUp>
          <div className="section-head" style={{margin: '0 auto 56px', textAlign: 'center'}}>
            <div className="section-eyebrow" style={{justifyContent: 'center'}}>Frequently asked</div>
            <h2 className="section-title">Questions, <span className="serif">answered clearly.</span></h2>
          </div>
        </FadeUp>
        <div className="faq-wrap">
          {items.map((it, i) => (
            <FadeUp key={i} delay={(i % 3) + 1}>
              <div className={`faq-item ${open === i ? 'open' : ''}`} onClick={() => setOpen(open === i ? -1 : i)}>
                <div className="faq-q">
                  <div className="faq-q-text">{it.q}</div>
                  <div className="faq-toggle">+</div>
                </div>
                <div className="faq-a">{it.a}</div>
              </div>
            </FadeUp>
          ))}
        </div>
      </div>
    </section>
  );
}
window.FAQ = FAQ;