Auth fertig erstellt. Aktuell läuft review durch KI

2026-08-29 14:07:44 +02:00
commit 625d026f59
70 changed files with 17032 additions and 0 deletions
@@ -0,0 +1,56 @@
+import { Brain, HardHat, Stethoscope } from "lucide-react";
+
+const audiences = [
+    {
+        icon: HardHat,
+        title: "Handwerksbetriebe",
+        text: "Anfragen aus der Region, ohne dass Sie ständig Marketing machen müssen. Referenzen, Leistungen und Kontaktdaten stehen dort, wo Kunden sie suchen.",
+    },
+    {
+        icon: Stethoscope,
+        title: "Praxen & Ärzte",
+        text: "Neue Patienten und weniger Rückfragen am Telefon. Sprechzeiten, Leistungsspektrum und Anfahrt sofort auf einen Blick - auch am Smartphone.",
+    },
+    {
+        icon: Brain,
+        title: "Therapeuten & Berater",
+        text: "Ein Auftritt, der Vertrauen weckt - bevor der Erstkontakt zustande kommt. Persönlich, ruhig, ohne Marketing-Lärm.",
+    },
+];
+
+export const Services = () => {
+    return (
+        <section
+            id="zielgruppen"
+            className="mx-auto max-w-6xl px-4 py-16 md:px-6 md:py-24"
+        >
+            <div className="mx-auto max-w-2xl text-center">
+                <span className="island-kicker">Für wen ist das?</span>
+                <h2 className="mt-3 font-heading text-3xl font-bold leading-tight tracking-tight text-(--sea-ink) sm:text-4xl">
+                    Finden Sie sich wieder?
+                </h2>
+                <p className="mt-4 text-(--sea-ink-soft) sm:text-lg">
+                    Meine Kunden verbindet eines: Sie sind Meister ihres Fachs -
+                    und wollen sich nicht mit ihrer Webseite herumärgern.
+                </p>
+            </div>
+
+            <ul className="mt-12 grid gap-5 md:grid-cols-3">
+                {audiences.map(({ icon: Icon, title, text }) => (
+                    <li
+                        key={title}
+                        className="feature-card rounded-2xl border border-(--line) p-6"
+                    >
+                        <span className="mb-4 inline-flex h-11 w-11 items-center justify-center rounded-xl bg-(--lagoon)/15 text-(--lagoon-deep)">
+                            <Icon className="h-5 w-5" aria-hidden />
+                        </span>
+                        <h3 className="font-heading text-lg font-semibold text-(--sea-ink)">
+                            {title}
+                        </h3>
+                        <p className="mt-2 text-sm text-(--sea-ink-soft)">{text}</p>
+                    </li>
+                ))}
+            </ul>
+        </section>
+    );
+};