/* ═══════════════════════════════════════════════════════════
   FEITO POR DENTISTAS — os 4 fundadores, fotos e CRO/CREA reais
   Prova social real, verificável, enquanto a Klyvo não tem
   clientes públicos.
   ═══════════════════════════════════════════════════════════ */

const founderStyles = {};

const FOUNDERS = [
  {
    name: 'Igor Nicolas',
    role: 'Cirurgião-dentista & Engenheiro de Software',
    reg: 'CRO-BA 21248',
    img: 'img/fundadores/igor-nicolas.jpg',
  },
  {
    name: 'Beatriz Amorim',
    role: 'Cirurgiã-dentista',
    reg: 'CRO-BA 19835',
    img: 'img/fundadores/beatriz-amorim.jpg',
  },
  {
    name: 'Brunna Spósito',
    role: 'Cirurgiã-dentista',
    reg: 'CRO-BA 24406',
    img: 'img/fundadores/brunna-spozito.jpeg',
  },
  {
    name: 'Gabriel Andrade',
    role: 'Engenheiro & Especialista em Tecnologia',
    reg: 'CREA-BA 0521136784',
    img: 'img/fundadores/gabriel-andrade.jpeg',
  },
];

function Founders() {
  return (
    <section className="section section-alt" id="por-dentistas">
      <div className="container">
        <div className="section-header">
          <div className="tag">Nosso diferencial</div>
          <h2>Dentistas que criaram o sistema que sempre quiseram usar</h2>
          <p>
            O Klyvo não nasceu numa sala de reunião de uma empresa de software. Nasceu dentro do
            consultório — das frustrações reais de quem atende pacientes todos os dias.
          </p>
        </div>

        <div className="founders-grid reveal">
          {FOUNDERS.map((f) => (
            <figure className="founder-card" key={f.name}>
              <img src={f.img} alt={`${f.name}, ${f.role.toLowerCase()}, fundador(a) do Klyvo`} loading="lazy" />
              <figcaption className="founder-caption">
                <strong>{f.name}</strong>
                <span>
                  {f.role} • {f.reg}
                </span>
              </figcaption>
            </figure>
          ))}
        </div>

        <div className="founders-bottom reveal">
          <a href={LINKS.quemSomos} className="founders-link">
            Conheça a equipe e nossos registros no CRO
            <Icon d={ICONS.arrowRight} size={16} strokeWidth={2.5} />
          </a>

          <div className="founders-cta">
            <span>15 dias grátis, sem cartão de crédito.</span>
            <a href={LINKS.cadastro} className="btn btn-primary">
              Começar grátis
            </a>
          </div>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Founders });
