// ============================================================
// CTA FINAL
// ============================================================

function CTA() {
  // pick 7 characters for the troop, leading with Gatito Te Amo
  const order = ["gatito-te-amo", "voxi", "miau", "automatitto", "datamiao", "codemiau", "disenita"];
  const troop = order.map(id => CHARACTERS.find(c => c.id === id));

  return (
    <section id="contacto" className="cta">
      <div className="cta-row">
        <div className="kicker" style={{ justifyContent: "center", display: "inline-flex" }}>Tu turno · diagnóstico</div>
        <h2>Diseña primero. Implementa después. <em>Cobra mejor.</em></h2>
        <p>
          Si tienes una empresa que vende algo y quiere dejar de operar con WhatsApp + Excel + intuición, agenda un diagnóstico 1:1 con Cristina. Salimos con un plan claro de bots, cursos y arquitectura. Sin pitches motivacionales.
        </p>
        <div className="cta-actions">
          <a className="btn btn-primary" href="https://wa.me/525532009853?text=Hola%20Cristina%2C%20quiero%20agendar%20un%20diagn%C3%B3stico%20con%20DIMTEL">Agendar diagnóstico →</a>
          <a className="btn btn-ghost" href="#cohorte">Ver bootcamp 2026</a>
        </div>

        <div className="cta-troop">
          {troop.map(c => <img key={c.id} src={c.img} alt={c.name} title={c.name} />)}
        </div>
      </div>
    </section>
  );
}

window.CTA = CTA;