/* Sweep Geophysical — FAQ page */
const { Accordion: FqAcc, Button: FqB, SectionHeading: FqH } = window.SweepGeophysicalDesignSystem_5187bc;

function FaqPage({ navigate }) {
  const I = window.Icons;
  return (
    <React.Fragment>
      {window.PageHero({
        eyebrow: 'Support',
        title: 'Frequently asked questions',
        children: 'Answers about geophysical surveying, our methods, accuracy and how to get started on a subsurface investigation.',
      })}
      <section className="section">
        <div className="wrap" style={{ maxWidth: 860 }}>
          <FqAcc defaultOpen={0} items={window.FAQS} />
          <div style={{ marginTop: 'var(--space-12)', textAlign: 'center', display: 'flex', flexDirection: 'column', gap: 'var(--space-4)', alignItems: 'center' }}>
            <p style={{ color: 'var(--text-muted)', margin: 0 }}>Still have a question about your project?</p>
            <FqB variant="primary" size="lg" iconRight={<I.arrowRight size={20} />} onClick={() => navigate('contact')}>Contact our team</FqB>
          </div>
        </div>
      </section>
    </React.Fragment>
  );
}

window.FaqPage = FaqPage;