/* eslint-disable */

const TESTIMONIALS = [
  {
    lead: true,
    quote: "AlbertMed pulled $186k out of aged A/R we had written off. They earned their first year's fee in 60 days.",
    name: "Dr. Mara Whitfield",
    role: "Owner, Whitfield Internal Medicine · Ohio",
    initial: "MW"
  },
  {
    quote: "The first month we could finally see exactly where revenue was leaking. I've never had that clarity from a billing team.",
    name: "James Park, MD",
    role: "Lakeshore Cardiology",
    initial: "JP"
  },
  {
    quote: "Our denial rate dropped from 11% to under 4%. The difference shows up directly on payroll.",
    name: "Priya Anand",
    role: "Practice Manager · Cedar Pediatrics",
    initial: "PA"
  }
];

function Testimonials() {
  return (
    <section className="social">
      <div className="container">
        <header className="section-head">
          <div>
            <div className="eyebrow"><span className="dot"></span> What clients say</div>
            <h2 className="h-section" style={{marginTop:18}}>
              We measure success in <em>dollars</em><br/>recovered—not invoices sent.
            </h2>
          </div>
        </header>

        <div className="testimonial-grid">
          {TESTIMONIALS.map((t, i) => (
            <article className={"tcard " + (t.lead ? "lead" : "")} key={i}>
              <div>
                <div className="stars">
                  {Array.from({length: 5}).map((_, k) => <Ico.star key={k} />)}
                </div>
                <p className="quote" style={{marginTop:16}}>"{t.quote}"</p>
              </div>
              <div className="author">
                <div className="avatar">{t.initial}</div>
                <div>
                  <div className="name">{t.name}</div>
                  <div className="role">{t.role}</div>
                </div>
              </div>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ---------------- FAQ ---------------- */

const FAQS = [
  {
    q: "How is AlbertMed priced?",
    a: "A flat percentage of net collections—no setup fees, no long-term contracts, no per-claim charges. You pay only on what we collect, which keeps incentives perfectly aligned."
  },
  {
    q: "Does our staff get replaced?",
    a: "No. Most clients keep their front-desk and clinical staff exactly as-is. We slot into the back office. If you'd like to retire a vacant biller role, we can absorb that workload."
  },
  {
    q: "Which PMS / EHR systems do you support?",
    a: "All major systems: AthenaHealth, eClinicalWorks, Kareo, AdvancedMD, NextGen, Epic, Cerner, DrChrono, Practice Fusion, OfficeAlly and more. If you have a system, we've likely worked it."
  },
  {
    q: "How long does onboarding take?",
    a: "Typical onboarding is 10–14 business days from contract signature to first claims submission. Larger groups with multiple TINs may run 3–4 weeks. We never let your existing revenue stream drop while we migrate."
  },
  {
    q: "Are you HIPAA compliant?",
    a: "Yes. We're HIPAA compliant, SOC 2 Type II audited, and every staff member completes quarterly compliance training. A signed BAA is part of every engagement."
  },
  {
    q: "Is the team U.S. based?",
    a: "Your account lead, coding reviewers and denial specialists are all U.S. based. We use a small offshore team only for high-volume charge entry, and only when clients opt in—you'll always know who's working your account."
  }
];

function FAQ() {
  const [open, setOpen] = React.useState(0);
  return (
    <section className="faq" id="faq">
      <div className="container faq-grid">
        <div>
          <div className="eyebrow"><span className="dot"></span> Common questions</div>
          <h2 className="h-section" style={{marginTop:18}}>
            Short answers,<br/>before you ask.
          </h2>
          <p className="lede" style={{marginTop:20}}>
            Have a more specific question? Send it directly to our founder—replies usually within the same day.
          </p>
        </div>

        <div className="faq-list">
          {FAQS.map((f, i) => (
            <div className={"faq-item " + (open === i ? "open" : "")} key={i}>
              <button className="faq-q" onClick={() => setOpen(open === i ? -1 : i)} aria-expanded={open === i}>
                <span>{f.q}</span>
                <span className="toggle"><Ico.plus /></span>
              </button>
              <div className="faq-a">
                <div className="faq-a-inner">{f.a}</div>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Testimonials, FAQ });