/* Contact + footer */

function Contact() {
  const LINKS = [
    { label: "Email", value: "quintin@quantesic.com", href: "mailto:quintin@quantesic.com" },
    { label: "LinkedIn", value: "linkedin.com/in/quintin-c-82114552", href: "https://linkedin.com/in/quintin-c-82114552" },
    { label: "Quantesic", value: "quantesic.com", href: "https://quantesic.com" },
  ];

  return (
    <section id="contact" className="contact">
      <div className="container">
        <div className="contact-grid">
          <Reveal>
            <div>
              <h2>
                Let's <em>talk</em>.
              </h2>
              <p className="contact-blurb">
                Hiring for a founding engineer, principal architect, or senior TAM role? Building something in the
                customer success / enterprise AI space? Want a 15-minute walkthrough of Quantesic? Email me. I
                answer everything personally.
              </p>
              <div style={{ marginTop: 32, display: "flex", gap: 12, flexWrap: "wrap" }}>
                <a href="assets/Quintin-Christopher-Resume.pdf" download className="btn btn-primary">
                  <Icons.download /> Download resume
                </a>
                <a href="mailto:quintin@quantesic.com?subject=Portfolio%20conversation" className="btn btn-ghost">
                  Start a conversation <Icons.arrowUR />
                </a>
              </div>
            </div>
          </Reveal>

          <Reveal delay={120}>
            <div className="contact-card">
              {LINKS.map((l) => (
                <a key={l.label} className="contact-link" href={l.href} target={l.href.startsWith("http") ? "_blank" : undefined} rel="noopener">
                  <div>
                    <span className="label">{l.label}</span>
                    <span className="value">{l.value}</span>
                  </div>
                  <Icons.arrowUR className="arrow" />
                </a>
              ))}
            </div>
          </Reveal>
        </div>
      </div>
    </section>
  );
}

function Footer() {
  return (
    <footer className="footer">
      <div className="footer-inner">
        <span>(c) 2026 Quintin Christopher</span>
        <span>Hand-built / Orlando, FL / Last updated July 2026</span>
      </div>
    </footer>
  );
}

Object.assign(window, { Contact, Footer });