Contact Section Four

1import { Button } from '@/components/ui/button'
2import { Label } from '@/components/ui/label'
3import { Textarea } from '@/components/ui/textarea'
4import { Input } from '@/components/ui/input'
5 
6export default function ContactSectionFour() {
7  return (
8    <section className="min-h-screen px-4 text-foreground">
9      <div className="mx-auto max-w-6xl border-x border-border bg-border dark:bg-border">
10        <div className="grid min-h-screen gap-px border-y border-border">
11          {/* Header box */}
12          <div className="flex min-h-50 flex-col items-center justify-center rounded-b-sm bg-background px-6 text-center">
13            <h1 className="text-4xl font-semibold tracking-tight text-zinc-800 md:text-6xl dark:text-zinc-200">
14              Get in Touch?
15            </h1>
16 
17            <p className="mt-5 max-w-md text-base leading-7 text-balance text-muted-foreground md:text-lg">
18              Tell me what you&apos;re working on and let&apos;s explore how we can bring it to
19              life.
20            </p>
21          </div>
22 
23          <div className="grid gap-px bg-zinc-200 md:grid-cols-[1fr_minmax(0,552px)_1fr] dark:bg-border">
24            <div className="hidden rounded-sm bg-background md:block" />
25 
26            <form className="rounded-sm bg-background px-6 py-10 shadow-xs md:px-12 md:py-12">
27              <div className="space-y-5">
28                <div className="grid gap-4 sm:grid-cols-2">
29                  <div className="space-y-2">
30                    <Label htmlFor="name">Name</Label>
31                    <Input
32                      id="name"
33                      name="name"
34                      type="text"
35                      autoComplete="name"
36                      placeholder="Your name"
37                    />
38                  </div>
39 
40                  <div className="space-y-2">
41                    <Label htmlFor="email">Email</Label>
42                    <Input
43                      id="email"
44                      name="email"
45                      type="email"
46                      autoComplete="email"
47                      placeholder="you@example.com"
48                    />
49                  </div>
50                </div>
51 
52                <div className="space-y-2">
53                  <Label htmlFor="project">Company or project</Label>
54                  <Input id="project" type="text" placeholder="Acme Inc." />
55                </div>
56 
57                <div className="space-y-2">
58// … truncated