function CtaFinal({ onWhatsApp }) {
  return (
    <section className="cta-final">
      <div className="container cta-final-inner">
        <div>
          <span className="eyebrow">Próximo paso</span>
          <h2>Agendá un <em>diagnóstico</em> gratuito.</h2>
          <p>
            45 minutos, sin venta presionada. Si después de la llamada no tiene sentido trabajar juntos, te lo decimos y te pasamos recursos para que sigas solo/a.
          </p>
          <div style={{display:"flex", gap:12, flexWrap:"wrap"}}>
            <button className="btn btn-accent" onClick={onWhatsApp}>
              <IconWhatsApp size={16} /> Escribinos por WhatsApp
            </button>
            <a className="btn btn-secondary" href="mailto:hola@heybots.ai" style={{borderColor:"color-mix(in oklch, var(--bone) 20%, transparent)", color:"var(--bone)"}}>
              hola@heybots.ai
            </a>
          </div>
        </div>

        <div className="cta-wa-card">
          <div className="cta-wa-pre">Vista previa · WhatsApp</div>
          <div className="cta-wa-preview">
            Hola Hey Bots 👋 Vengo de la web, me gustaría agendar un diagnóstico para mi [tipo de negocio].
          </div>
          <div className="cta-wa-actions">
            <button className="btn btn-accent" onClick={onWhatsApp} style={{flex:1, justifyContent:"center"}}>
              Enviar <IconArrow size={14} />
            </button>
          </div>
          <div style={{marginTop:14, fontSize:"0.78rem", color:"color-mix(in oklch, var(--bone) 55%, transparent)", display:"flex", alignItems:"center", gap:6}}>
            <IconClock size={12} /> Respondemos en horario laboral (GMT−3), normalmente en menos de 2 horas.
          </div>
        </div>
      </div>
    </section>
  );
}
Object.assign(window, { CtaFinal });
