import ContactUsForm from "@/app/_contact-us/form";
import { Metadata } from "next";

export const metadata: Metadata = {
  title: "Opp lens - Contact Us",
  description:
    "Automated tender management platform for SMEs. Find tailored tenders, automate document handling, and get real-time alerts. Win more opportunities with less effort.",
  keywords:
    "tender management, AI tender search, SME tenders, public procurement, automated bidding, tender alerts",
  authors: [{ name: "PBL Partners AB" }],
  openGraph: {
    title: "Opp lens - AI-Powered Tender Management",
    description: "Win more tenders automatically with our AI-powered platform",
    type: "website",
    locale: "en_US",
    siteName: "Opp lens",
  },
  icons: {
    icon: "/fav-icon.svg",
  },
};

const ContactUsPage = () => {
  return (
    <>
      <div className="flex flex-col gap-6 items-center">
        <p className="bg-(--primary)/20 w-fit px-2.5 py-1.5 text-(--primary) rounded-full">
          Contact Us
        </p>
        <h1 className="font-extrabold text-5xl">Let's Get In Touch</h1>
        <p className="text-[16px] font-normal">
          Or just reach out manually to
          <a
            href="mailto:info@opplens.com"
            className="text-(--primary) mx-1">
            info@opplens.com
          </a>
        </p>
      </div>
      <div className="flex flex-col items-center mt-16 px-8 ">
        <section className="border border-gray-300 rounded-4xl w-full lg:max-w-2/3 flex flex-col items-center bg-white">
          <ContactUsForm columnsPerRow={1} />
        </section>
      </div>
    </>
  );
};

export default ContactUsPage;