import { site } from '@/lib/site';

const Contact = () => (
	<section id="contact" className="container-page pt-12 pb-24">
		<div className="flex flex-col items-start justify-between gap-6 panel p-6 sm:flex-row sm:items-center md:p-9">
			<div>
				<h2 className="font-display text-2xl font-normal tracking-tight text-ink md:text-3xl">
					Get in touch
				</h2>
				<p className="mt-1.5 text-sm text-ink/70">
					Have a project, role, or panel in mind? Let&apos;s talk.
				</p>
			</div>

			<div className="flex flex-wrap gap-3 text-sm font-medium">
				<a href={`mailto:${site.email}`} className="btn-primary">
					{site.email} →
				</a>
				<a
					href={site.gitlab}
					target="_blank"
					rel="noreferrer"
					className="btn-ghost"
				>
					GitLab ↗
				</a>
			</div>
		</div>
	</section>
);

export default Contact;