function Info() {
  return (
    <section id="informacoes">
      <div className="padding-global">
        <div className="container mid">
          <div className="section-header" style={{ marginBottom: '3rem' }}>
            <div className="section-eyebrow">Informações</div>
            <h2 className="h2-bold" style={{ margin: 0 }}>Duas datas. Mesma experiência. Vagas curadas.</h2>
          </div>
          <div className="info-wrap">
            <div className="dates-stack">
              <div className="text-small-bold" style={{ opacity: .55, letterSpacing: '.14em', textTransform: 'uppercase' }}>Edições</div>
              <div className="date-card">
                <div className="date-num">18</div>
                <div style={{ display: 'flex', flexDirection: 'column', gap: '.25rem' }}>
                  <div className="date-month">Junho · 2026</div>
                  <div className="date-when">Quinta-feira, das 9h às 13h</div>
                </div>
                <div className="date-tag">Edição 1</div>
              </div>
              <div className="date-card">
                <div className="date-num">25</div>
                <div style={{ display: 'flex', flexDirection: 'column', gap: '.25rem' }}>
                  <div className="date-month">Junho · 2026</div>
                  <div className="date-when">Quinta-feira, das 9h às 13h</div>
                </div>
                <div className="date-tag">Edição 2</div>
              </div>
              <div className="text-small opacity-60" style={{ marginTop: '.5rem' }}>
                Durante a inscrição, você poderá indicar a data de preferência. A confirmação será enviada após análise do perfil e disponibilidade de vagas.
              </div>
            </div>
            <div className="info-meta">
              <div className="info-row">
                <div className="info-key">Formato</div>
                <div className="info-val">Presencial · grupos curados</div>
              </div>
              <div className="info-row">
                <div className="info-key">Local</div>
                <div className="info-val">Escritório da Maitha Tech<br /><span style={{ fontWeight: 400, opacity: .65, fontSize: '.875rem' }}>São Paulo · endereço enviado aos confirmados</span></div>
              </div>
              <div className="info-row">
                <div className="info-key">Horário</div>
                <div className="info-val">9h às 13h<br /><span style={{ fontWeight: 400, opacity: .65, fontSize: '.875rem' }}>Coffee + check-in das 8h30 às 9h</span></div>
              </div>
              <div className="info-row">
                <div className="info-key">Investimento</div>
                <div className="info-val">Gratuito · sujeito à curadoria</div>
              </div>
              <div className="info-row">
                <div className="info-key">Pré-requisitos</div>
                <div className="info-val">Notebook próprio<br /><span style={{ fontWeight: 400, opacity: .65, fontSize: '.875rem' }}>Sem conhecimento técnico em IA</span></div>
              </div>
              <div className="info-row">
                <div className="info-key">Vagas</div>
                <div className="info-val">Limitadas · perfil avaliado pela equipe Maitha</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Info });