function WhyParticipate() {
  return (
    <section id="por-que">
      <div className="padding-global">
        <div className="container mid">
          <div className="why-grid">
            <div className="why-text">
              <div className="section-eyebrow" style={{ marginBottom: '1.25rem' }}>Por que participar</div>
              <h2 className="h2-bold" style={{ margin: '0 0 2rem' }}>Saia do discurso sobre IA. Comece a desenhar aplicações reais.</h2>
              <p>Muitas empresas já entenderam que agentes de IA podem mudar a forma como o trabalho acontece, mas ainda têm dificuldade em dar o primeiro passo: <strong style={{ fontWeight: 500, color: 'var(--mt-white)' }}>identificar bons cenários, estruturar o problema certo e desenhar agentes que façam sentido para a operação</strong>.</p>
              <p>O AI Agents Lab é uma experiência prática criada para ajudar líderes de negócio a saírem da discussão genérica sobre IA e começarem a visualizar aplicações reais dentro das suas áreas.</p>
              <p style={{ opacity: 1, marginTop: '2rem' }}>
                <strong style={{ fontFamily: 'var(--font-ui)', fontWeight: 500 }}>Se você enfrenta esse desafio, seu lugar é aqui.</strong>
              </p>
              <div style={{ marginTop: '1.5rem' }}>
                <PrimaryButton>Quero transformar um desafio em agente</PrimaryButton>
              </div>
            </div>
            <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
              <div className="why-card">
                <div className="stat"><span className="ed">AI7</span></div>
                <div className="text-small-bold" style={{ textTransform: 'uppercase', letterSpacing: '.14em', opacity: .65 }}>Método AI7</div>
                <div className="desc">Redução de até 70% nas chances de falha em projetos de IA quando estruturados com a metodologia proprietária da Maitha.</div>
              </div>
              <div className="why-card" style={{ background: 'var(--mt-card-2)' }}>
                <div className="stat" style={{ fontSize: '4rem' }}>4 horas de imersão</div>
                <div className="desc">Uma manhã focada — das 9h às 13h. Duas datas presenciais em São Paulo, vagas limitadas e sujeitas à curadoria.</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { WhyParticipate });