initial

2026-06-23 21:17:01 +02:00
commit 5e0a26677e
72 changed files with 8592 additions and 0 deletions
@@ -0,0 +1,110 @@
+import Image from 'next/image'
+
+import { Button } from '@/components/Button'
+import { Container } from '@/components/Container'
+import { SelectField, TextField } from '@/components/Fields'
+import backgroundImage from '@/images/background-call-to-action.jpg'
+
+export function FinalCta() {
+  return (
+    <section
+      id="partner-werden"
+      className="relative overflow-hidden bg-blue-600 py-20 sm:py-28"
+    >
+      <Image
+        className="absolute left-1/2 top-1/2 max-w-none -translate-x-1/2 -translate-y-1/2"
+        src={backgroundImage}
+        alt=""
+        width={2347}
+        height={1244}
+        unoptimized
+      />
+      <Container className="relative">
+        <div className="mx-auto max-w-2xl text-center">
+          <h2 className="font-display text-3xl tracking-tight text-white sm:text-4xl">
+            Werden Sie GebOS Partner und bieten Sie Ihren Kunden eine fertige
+            UVI-Lösung an.
+          </h2>
+          <div className="mt-10 flex flex-col items-center justify-center gap-y-4 sm:flex-row sm:gap-x-6 sm:gap-y-0">
+            <Button href="#beratung" color="white">
+              Partnergespräch buchen
+            </Button>
+            <Button href="#beratung" variant="outline" color="white">
+              Infopaket anfordern
+            </Button>
+          </div>
+        </div>
+
+        <div
+          id="beratung"
+          className="mx-auto mt-16 max-w-2xl scroll-mt-24 rounded-3xl bg-white p-8 shadow-xl shadow-blue-900/20 sm:p-10"
+        >
+          <h3 className="font-display text-xl font-medium text-slate-900">
+            Senden Sie uns Ihre Eckdaten
+          </h3>
+          <p className="mt-2 text-sm text-slate-600">
+            Wir melden uns für ein unverbindliches Partnergespräch bei Ihnen.
+          </p>
+          <form
+            action="#"
+            className="mt-8 grid grid-cols-1 items-end gap-x-6 gap-y-6 sm:grid-cols-2"
+          >
+            <TextField
+              label="Name"
+              name="name"
+              type="text"
+              autoComplete="name"
+              required
+            />
+            <TextField
+              label="Betrieb"
+              name="company"
+              type="text"
+              autoComplete="organization"
+            />
+            <TextField
+              label="Ort / Region"
+              name="region"
+              type="text"
+              autoComplete="address-level2"
+            />
+            <TextField
+              label="Anzahl Vermieter-/Hausverwaltungskunden"
+              name="customer_count"
+              type="text"
+            />
+            <SelectField label="Gewerk" name="trade" defaultValue="">
+              <option value="" disabled>
+                Bitte wählen
+              </option>
+              <option>Elektro</option>
+              <option>Sanitär</option>
+              <option>SHK</option>
+              <option>Sonstiges</option>
+            </SelectField>
+            <SelectField label="Interesse an" name="interest" defaultValue="">
+              <option value="" disabled>
+                Bitte wählen
+              </option>
+              <option>Installation</option>
+              <option>Vertrieb</option>
+              <option>Beidem</option>
+            </SelectField>
+            <div className="col-span-full">
+              <Button
+                type="submit"
+                variant="solid"
+                color="blue"
+                className="w-full"
+              >
+                <span>
+                  Anfrage senden <span aria-hidden="true">&rarr;</span>
+                </span>
+              </Button>
+            </div>
+          </form>
+        </div>
+      </Container>
+    </section>
+  )
+}