/* global React */
function HomeBanner({ onCta }) {
  return (
    <section className="hbanner" id="ingles">
      <div className="hbanner-wrap">
        <div>
          <div className="hbanner-eyebrow">NUEVO INTENSIVO · 2026</div>
          <h2 className="hbanner-title">
            English for <span style={{ color: 'var(--acmp-orange)' }}>Impact</span>
          </h2>
          <p className="hbanner-lead">
            El inglés para comunicar en entornos profesionales internacionales. 6 semanas de entrenamiento con el método ACMP: voz, presencia y vocabulario estratégico.
          </p>
          <div style={{ display: 'flex', gap: 14, flexWrap: 'wrap' }}>
            <button className="acmp-btn acmp-btn-primary" onClick={onCta}>Ver el programa →</button>
            <button className="acmp-btn hbanner-ghost" onClick={onCta}>Hablar con el equipo</button>
          </div>
        </div>
        <div className="hbanner-art">
          <img src={R("assets/hero-ingles.avif")} alt="English for Impact — Academia Comunica de Mai Pistiner" />
        </div>
      </div>
    </section>
  );
}
Object.assign(window, { HomeBanner });