// Conversion — final CTA block before footer, on gold-wash with laurel watermark
const Conversion = () => {
  const bullets = t("conversion.bullets");
  return (
    <section id="agendar" className="scl-section scl-section--conversion">
      <div className="scl-container scl-conversion">
        <img
          src="/assets/seal-only-black.png"
          alt=""
          className="scl-conversion__watermark"
          aria-hidden="true"
        />
        <div className="scl-conversion__content">
          <div className="scl-eyebrow"><span className="scl-rule" /> {t("conversion.eyebrow")}</div>
          <h2 className="scl-h1 scl-conversion__headline">
            {t("conversion.headlinePre")}
          </h2>
          <p className="scl-lead scl-conversion__sub">
            {t("conversion.sub")}
          </p>

          <div className="scl-conversion__cta">
            <a href={scWhatsAppHref()} target="_blank" rel="noopener noreferrer" className="scl-btn scl-btn--primary scl-btn--lg">
              {t("common.ctaPrimary")} <Icon name="arrow-right" size={18} />
            </a>
            <a href="tel:+14167126090" className="scl-btn scl-btn--secondary scl-btn--lg scl-phone-cta">
              <Icon name="phone" size={16} /> {t("common.phone")}
            </a>
          </div>

          <ul className="scl-conversion__bullets">
            {bullets.map((b, i) => (
              <li key={i}><Icon name="check" size={16} /> {b}</li>
            ))}
          </ul>
        </div>
      </div>
    </section>
  );
};

window.Conversion = Conversion;