function FAQ() {
  const [open, setOpen] = React.useState(0);
  const items = [
    {
      q: "Does your team actually understand aviation?",
      a: "We're aviation-only. That sounds like a tagline until you realize what it actually means: when you tell us your cost per lead is climbing on Part 135 charter inquiries, we don't need a glossary. We've run campaigns for MROs, flight schools, pilot time-building facilities, and charter operators, so we know what a qualified lead looks like in your vertical, what your sales cycle actually feels like, and which keywords burn budget without converting. Generalist agencies treat aviation like any other niche. We treat it like the whole runway."
    },
    {
      q: "How fast will I see leads?",
      a: "Most clients see qualified leads within the first 14 to 30 days after launch. The first week is build week: campaign setup, tracking installation, creative production, landing page launch. Once we're live, ad delivery typically starts within 72 hours, with the system optimizing through week three as Google's algorithm dials in."
    },
    {
      q: "What does this cost?",
      a: (
        <React.Fragment>
          <p>We work on three tiers, all month-to-month:</p>
          <ul className="alg-faq-tiers">
            <li><strong>Accelerator, $1,500/mo:</strong> Google Search ads, basic remarketing, monthly reporting. Best for single-location operators testing the channel.</li>
            <li><strong>Growth Engine, $3,000/mo:</strong> Full-funnel setup, competitor targeting, display plus search, bi-weekly optimization, dedicated landing page.</li>
            <li><strong>Dominator, $4,500+/mo:</strong> Multi-channel scaling (YouTube, retargeting, CRO testing), weekly strategy access, custom dashboards.</li>
          </ul>
          <p>Ad spend is separate and stays in your account. You own everything.</p>
          <p style={{fontSize: '13px', opacity: 0.7, marginTop: '8px', fontStyle: 'italic'}}>Tier pricing may adjust annually per contract.</p>
        </React.Fragment>
      )
    },
    {
      q: "What's this \"competitor-targeting\" system you keep mentioning?",
      a: "It's our proprietary edge. We identify the 50 closest competitors to your business (same vertical, same service area, similar offer) and engineer campaigns that capture their highest-intent prospects through search behavior, retargeting signals, and display placement. The result: instead of fishing in the same generic keyword pools every agency uses, we pull from the exact audience already shopping for what you sell. It's not legal trickery, it's smart targeting most agencies don't know how to build."
    },
    {
      q: "How much of my time will this actually take?",
      a: "Heaviest in week one, about 2 to 3 hours total for the kickoff call, account access, and uploading any brand assets we need. After that, we ask for roughly 30 minutes a month for the strategy review. If you're on Tier 3, it's about an hour every two weeks, but only because you've asked for that level of involvement. Most clients hear from us through reports and a monthly call. We're hired to do the work, not to add to your inbox."
    },
    {
      q: "What if it doesn't work? Am I locked into a contract?",
      a: "No long-term contracts innitially. You're on a 30-day rolling agreement, cancel anytime. We also share a transparent dashboard from day one, so you're never wondering whether the dollars are working. The risk lives with us, not you."
    },
  ];
  return (
    <section className="alg-section alg-faq" id="faq">
      <div className="alg-container alg-faq-grid">
        <div>
          <div className="alg-about-eyebrow">
            <span className="alg-rule"></span>
            <span>05 · FAQ</span>
          </div>
          <h2 className="alg-section-h2">
            The questions<br/>we get on every<br/>first call.
          </h2>
          <p className="alg-about-body">
            If yours isn't here, phone us — we'd rather answer it live.
          </p>
        </div>
        <div className="alg-faq-list">
          {items.map((it, i) => (
            <div className={`alg-faq-item ${open===i ? 'is-open' : ''}`} key={i}>
              <button className="alg-faq-q" onClick={() => setOpen(open===i ? -1 : i)}>
                <span className="alg-faq-num">{String(i+1).padStart(2,'0')}</span>
                <span className="alg-faq-text">{it.q}</span>
                <span className="alg-faq-toggle">{open===i ? '−' : '+'}</span>
              </button>
              {open===i && <div className="alg-faq-a">{it.a}</div>}
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.FAQ = FAQ;