/* Wisdom — Contacto: datos + formulario. */
(function () {
  const { WPageHero, WField, WSelect, WTextarea, WContactForm } = window;

  const SERVICIOS = [
    "Inteligencia Artificial",
    "Data Architecture y Data Governance",
    "Intelligent Automation",
    "No lo tengo claro aún",
  ];

  function Contacto() {
    return (
      <React.Fragment>
        <WPageHero
          eyebrow="Contacto"
          title="Hablemos de tu próximo" gold="proyecto."
          lead="Contanos qué desafío estás enfrentando y te respondemos en menos de 24 horas."
        />
        <section className="section">
          <div className="wrap">
            <div className="contact-grid">
              <aside className="contact-info">
                <div className="contact-info-item">
                  <p className="contact-info-label">Email</p>
                  <a className="contact-info-value" href="mailto:contacto@wisdomdai.com">contacto@wisdomdai.com</a>
                </div>
                <div className="contact-info-item">
                  <p className="contact-info-label">Dirección</p>
                  <p className="contact-info-value">Av. Corrientes 800 · CABA, Argentina</p>
                </div>
                <div className="contact-info-item">
                  <p className="contact-info-label">LinkedIn</p>
                  <a className="contact-info-value" href="https://www.linkedin.com/company/wisdom-dai">/company/wisdom-dai</a>
                </div>
                <div className="contact-info-item">
                  <p className="contact-info-label">Tiempo de respuesta</p>
                  <p className="contact-info-value">Menos de 24 hs</p>
                </div>
              </aside>

              <div className="contact-form-wrap">
                <WContactForm
                  button="Enviar mensaje"
                  fields={
                    <React.Fragment>
                      <WField label="Nombre completo" name="nombre" required />
                      <WField label="Email corporativo" type="email" name="email" placeholder="nombre@empresa.com" required />
                      <WField label="Empresa" name="empresa" required />
                      <WSelect label="Servicio de interés" name="servicio" options={SERVICIOS} required />
                      <WTextarea label="Contanos sobre tu proyecto" name="mensaje" placeholder="Qué desafío estás enfrentando…" required />
                    </React.Fragment>
                  }
                />
              </div>
            </div>
          </div>
        </section>
      </React.Fragment>
    );
  }

  window.WContacto = Contacto;
})();