import { ContactForm } from "@/components/contact-form";
import { LocationsSection } from "@/components/locations-section";

export default function ContactPage() {
  return (
    <div className="bg-slate-50">
      <section className="py-10 sm:py-12 md:py-16">
        <div className="mx-auto max-w-5xl px-4 md:px-6">
          <header className="mb-8 space-y-3">
            <p className="text-xs font-semibold uppercase tracking-[0.2em] text-slate-500">
              Contact
            </p>
            <h1 className="text-2xl font-semibold tracking-tight text-slate-900 sm:text-3xl">
              We&apos;re here to help
            </h1>
            <p className="max-w-2xl text-sm text-slate-600 sm:text-base">
              Have a question about your taxes, insurance, or bookkeeping? Send
              us a message and our team will respond as soon as possible.
            </p>
          </header>
          <div className="grid gap-6 md:grid-cols-[3fr,2fr]">
            <ContactForm mode="contact" />
            <div className="rounded-2xl border border-slate-200 bg-white p-5 text-sm text-slate-800">
              <h2 className="text-base font-semibold text-slate-900">
                Phone &amp; email
              </h2>
              <p className="mt-2 text-slate-700">
                You can also reach us by phone or email using the office
                details below.
              </p>
              <p className="mt-3 text-xs text-slate-600">
                For time‑sensitive questions during tax season, calling one of
                our offices is usually the fastest way to get help.
              </p>
            </div>
          </div>
        </div>
      </section>
      <LocationsSection />
    </div>
  );
}

