import styles from '../styles/components/Contact.module.scss';

export default function Contact() {
  return (
    <section id="contact" className={styles.contact}>
      <div className={styles.inner}>
        <div className={styles.header}>
          <span className={styles.sectionNum}>03.</span>
          <h2 className={styles.sectionTitle}>Get in touch</h2>
          <div className={styles.line} />
        </div>

        <div className={styles.body}>
          <p className={styles.lede}>
            I'm currently employed, but my inbox is always open. Whether you have a question or 
            just want to say hi, I'll try my best to get back to you!
          </p>
          <p>I also have a small company if you are interested in collaboration or services.</p>

          <a
            href="mailto:veikko@lintujarvi.fi"
            className={styles.emailBtn}
          >
            Say hello ↗
          </a>

          <ul className={styles.socials}>
            {[
              { label: 'Gitea', href: 'https://gitea.tietokonepaja.fi/' },
              { label: 'LinkedIn', href: 'https://www.linkedin.com/in/veikko-lintuj%C3%A4rvi-5888a6175/' },
              { label: 'Company', href: 'https://www.tietokonepaja.fi/' },
            ].map(({ label, href }) => (
              <li key={label}>
                <a href={href} target="_blank" rel="noreferrer">
                  {label}
                </a>
              </li>
            ))}
          </ul>
        </div>
      </div>
    </section>
  );
}