Update components with German translations and localized content; modify About19, Contact21, CTA, FAQ, Feature, Footer, Hero, Pricing, and Stats sections for improved clarity and user engagement.

2026-04-21 16:14:40 +02:00
parent 6a8ee43c07
commit f42b535073
11 changed files with 141 additions and 133 deletions
--- a/src/components/about19.tsx
+++ b/src/components/about19.tsx
@@ -12,7 +12,7 @@ const About19 = ({ className }: About19Props) => {
        <div className="grid grid-cols-1 gap-15 lg:grid-cols-7 lg:gap-1">
          <div className="col-span-4 h-120">
            <img
-              src="https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri4/img2.png"
+              src="/about.jpg"
              alt=""
              className="h-full w-full object-cover rounded-xl shadow-md"
            />
@@ -20,19 +20,19 @@ const About19 = ({ className }: About19Props) => {

          <div className="col-span-3 ml-auto max-w-4xl space-y-15 lg:pl-15">
            <h1 className="text-2xl font-medium tracking-tight">
-              We are a team of creators, thinkers, and builders who believe in
-              crafting experiences that truly connect. Our story is built on
-              passion, innovation, and the drive to bring meaningful ideas to
-              life.
+              Ich bin Matthias Meister und begleite KMU auf dem Weg zu einem
+              professionellen Online-Auftritt, der klar kommuniziert und
+              Vertrauen aufbaut.
            </h1>
            <p className="text-base text-foreground/40 lg:text-lg">
-              We ask: What’s the goal? Who’s it for? How do we make it
-              effortless? we begin with why, who, and how to make it better.
+              Mein Fokus liegt auf Websites, die nicht ueberladen wirken,
+              sondern Orientierung geben und den naechsten Kontakt einfach
+              machen.
            </p>
            <div className="flex flex-col justify-between gap-4 lg:flex-row lg:items-center">
              <p className="flex-1 text-sm text-foreground/40">
-                We aim to bring diverse minds together, turning ideas into
-                experiences that matter.
+                Sie erhalten direkte Abstimmung, klare Schritte und eine
+                Umsetzung, die zu Ihrem Geschaeft passt.
              </p>
              <div className="flex w-fit items-center gap-2">
                <img
@@ -41,9 +41,9 @@ const About19 = ({ className }: About19Props) => {
                  alt="avatr"
                />
                <div>
-                  <h3 className="font-medium tracking-tight">John Doe</h3>
+                  <h3 className="font-medium tracking-tight">Matthias Meister</h3>
                  <p className="text-sm text-foreground/40">
-                    Creative Director
+                    Freelance Webdesigner
                  </p>
                </div>
              </div>
--- a/src/components/contact21.tsx
+++ b/src/components/contact21.tsx
@@ -17,12 +17,12 @@ import { Input } from "@/components/ui/input";
 import { cn } from "@/lib/utils";

 const contactFormSchema = z.object({
-  name: z.string().min(1, "Name is required"),
+  name: z.string().min(1, "Bitte geben Sie Ihren Namen ein"),
  email: z
    .string()
-    .min(1, "Email is required")
-    .email("Please enter a valid email"),
-  message: z.string().min(1, "Message is required"),
+    .min(1, "Bitte geben Sie Ihre E-Mail ein")
+    .email("Bitte geben Sie eine gueltige E-Mail ein"),
+  message: z.string().min(1, "Bitte beschreiben Sie kurz Ihr Anliegen"),
 });

 type ContactFormData = z.infer<typeof contactFormSchema>;
@@ -62,7 +62,7 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
      setTimeout(() => setIsSubmitted(false), 5000);
    } catch {
      form.setError("root", {
-        message: "Something went wrong. Please try again.",
+        message: "Beim Senden ist etwas schiefgelaufen. Bitte versuchen Sie es erneut.",
      });
    }
  };
@@ -73,9 +73,9 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
        <div className="mt-20 flex flex-col justify-between gap-15 md:gap-10 lg:flex-row">
          <div className="flex w-full max-w-lg flex-col justify-between gap-10">
            <p className="indent-[22%] text-3xl font-medium tracking-tight text-muted-foreground/50 lg:text-4xl">
-              We are a team of creators, thinkers, and builders who believe in
-              crafting experiences that truly connect.{" "}
-              <span className="text-foreground">We're here to help</span>
+              Ich unterstuetze Unternehmen dabei, online professionell
+              aufzutreten. Schreiben Sie mir kurz, worum es geht.{" "}
+              <span className="text-foreground">Ich melde mich zeitnah</span>
            </p>
            <div className="mt-5 flex items-center gap-4 lg:mt-20">
              <img
@@ -84,14 +84,18 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
                alt="avatar"
              />
              <div>
-                <h3 className="text-lg font-medium tracking-tight">John Doe</h3>
-                <p className="text-sm text-foreground/40">Creative Director</p>
+                <h3 className="text-lg font-medium tracking-tight">
+                  Matthias Meister
+                </h3>
+                <p className="text-sm text-foreground/40">
+                  Freelance Webdesigner
+                </p>
              </div>
            </div>
          </div>
          <div className="col-span-4 flex w-full flex-col gap-2 lg:pl-10">
            <h1 className="mb-7 text-6xl font-semibold tracking-tight lg:text-5xl">
-              Get in Touch
+              Projekt anfragen
            </h1>

            {isSubmitted && (
@@ -102,7 +106,7 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
                )}
              >
                <p className="text-sm font-medium text-green-600 dark:text-green-400">
-                  Thank you! We'll be in touch soon.
+                  Vielen Dank! Ich melde mich in Kuerze bei Ihnen.
                </p>
              </div>
            )}
@@ -137,14 +141,14 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
                  render={({ field, fieldState }) => (
                    <Field data-invalid={fieldState.invalid}>
                      <FieldLabel htmlFor={field.name} className="sr-only">
-                        Email
+                        E-Mail
                      </FieldLabel>
                      <Input
                        {...field}
                        id={field.name}
                        type="email"
                        aria-invalid={fieldState.invalid}
-                        placeholder="Email*"
+                        placeholder="E-Mail*"
                        className="h-15 rounded-none border-0 border-b border-b-foreground/25 bg-transparent! shadow-none placeholder:text-foreground/20 focus-visible:ring-0 lg:text-base"
                      />
                      {fieldState.invalid && (
@@ -160,13 +164,13 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
                  render={({ field, fieldState }) => (
                    <Field data-invalid={fieldState.invalid}>
                      <FieldLabel htmlFor={field.name} className="sr-only">
-                        Message
+                        Nachricht
                      </FieldLabel>
                      <Input
                        {...field}
                        id={field.name}
                        aria-invalid={fieldState.invalid}
-                        placeholder="Message (Tell us about your project)"
+                        placeholder="Nachricht (Worum geht es bei Ihrem Projekt?)"
                        className="h-15 rounded-none border-0 border-b border-b-foreground/25 bg-transparent! shadow-none placeholder:text-foreground/20 focus-visible:ring-0 lg:text-base"
                      />
                      {fieldState.invalid && (
@@ -189,12 +193,12 @@ const Contact21 = ({ className, onSubmit }: Contact21Props) => {
                  {form.formState.isSubmitting ? (
                    <>
                      <LoaderIcon className="size-5 animate-spin" />
-                      Sending...
+                      Wird gesendet...
                    </>
                  ) : (
                    <>
                      <CornerDownRight className="size-5" />
-                      Get in touch
+                      Unverbindlich anfragen
                    </>
                  )}
                </Button>
--- a/src/components/cta.tsx
+++ b/src/components/cta.tsx
@@ -7,18 +7,19 @@ export default function CTASection() {
        <div className="rounded-2xl bg-linear-to-r bg-[url('https://images.unsplash.com/photo-1739785890803-7a2191a37ef5?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D')] bg-cover bg-bottom px-8 py-10 md:px-16 md:py-20">
          <header className="mb-8 max-w-2xl space-y-4">
            <h2 className="font-heading text-4xl leading-10 text-black lg:text-4xl">
-              Benefit up to 33% when connecting to Sentium for 4 months or more
+              Lassen Sie uns ueber Ihre neue Website sprechen
            </h2>
            <p className="text-lg text-black/60">
-              Register and start using our cloud solutions today
+              Ob Neuprojekt oder Redesign: Sie erhalten eine klare Empfehlung
+              und einen realistischen naechsten Schritt.
            </p>
          </header>

          {/* CTA Buttons */}
          <div className="flex flex-wrap gap-4">
-            <Button size="lg">Get Started</Button>
+            <Button size="lg">Unverbindlich anfragen</Button>
            <Button size="lg" variant="secondary">
-              Contact
+              Erstgespraech vereinbaren
            </Button>
          </div>
        </div>
--- a/src/components/faq7.tsx
+++ b/src/components/faq7.tsx
@@ -9,29 +9,29 @@ import { cn } from "@/lib/utils";

 const faqs = [
  {
-    question: "What is a FAQ and why is it important?",
+    question: "Wie lange dauert die Umsetzung einer neuen Website?",
    answer:
-      "FAQ stands for Frequently Asked Questions. It is a list that provides answers to common questions people may have about a specific product, service, or topic.",
+      "Das haengt vom Umfang ab. Nach einem kurzen Erstgespraech erhalten Sie einen klaren Ablauf mit realistischem Zeitrahmen.",
  },
  {
-    question: "Why should I use a FAQ on my website or app?",
+    question: "Unterstuetzen Sie auch bei Struktur und Texten?",
    answer:
-      "Utilizing a FAQ section on your website or app is a practical way to offer instant assistance to your users or customers. Instead of waiting for customer support responses, they can find quick answers to commonly asked questions. ",
+      "Ja. Ich helfe Ihnen dabei, Inhalte sinnvoll zu ordnen und Texte klar zu formulieren, damit Besucher schnell verstehen, was Sie anbieten.",
  },
  {
-    question: "How do I effectively create a FAQ section?",
+    question: "Ist die Website auch auf dem Smartphone optimiert?",
    answer:
-      "Creating a FAQ section starts with gathering the most frequent questions you receive from your users or customers. Once you have a list, you need to write clear, detailed, and helpful answers to each question.",
+      "Ja. Jede Website wird responsive umgesetzt und auf gaengigen Bildschirmgroessen sauber dargestellt.",
  },
  {
-    question: "What are the benefits of having a well-maintained FAQ section?",
+    question: "Wie laufen Korrekturen und Abstimmungen ab?",
    answer:
-      "There are numerous advantages to maintaining a robust FAQ section. Firstly, it provides immediate answers to common queries, which improves the user experience.",
+      "Wir stimmen zentrale Punkte frueh ab und arbeiten mit klaren Feedbackrunden, damit der Prozess planbar und effizient bleibt.",
  },
  {
-    question: "How do I effectively create a FAQ section?",
+    question: "Was kostet eine Website fuer mein Unternehmen?",
    answer:
-      "Creating a FAQ section starts with gathering the most frequent questions you receive from your users or customers. Once you have a list, you need to write clear, detailed, and helpful answers to each question.",
+      "Die Kosten richten sich nach Ziel, Seitenumfang und gewuenschten Funktionen. Sie erhalten ein transparentes Angebot statt pauschaler Standardpreise.",
  },
 ];

@@ -46,21 +46,21 @@ const Faq7 = ({ className }: Faq7Props) => {
        <div className="mx-auto grid max-w-7xl gap-10 md:grid-cols-2">
          <div className="flex flex-col gap-6">
            <h2 className="text-4xl font-semibold">
-              Need Help?
+              Fragen vor dem Start?
              <br />
              <span className="text-muted-foreground/70">
-                We&apos;re here to assist.
+                Hier finden Sie schnelle Antworten.
              </span>
            </h2>
            <p className="text-lg text-muted-foreground md:text-xl">
-              Still have questions? Feel free to contact our friendly
+              Falls noch etwas offen ist, schreiben Sie mir gern ueber das
              <a href="#" className="mx-1 whitespace-nowrap underline">
-                support team
+                Kontaktformular
              </a>
-              specialists.
+              .
            </p>
            <Button size="lg" variant="outline" className="w-fit">
-              View all FAQs
+              Alle Fragen ansehen
            </Button>
          </div>
          <Accordion type="multiple">
--- a/src/components/feature284.tsx
+++ b/src/components/feature284.tsx
@@ -6,38 +6,38 @@ import { cn } from "@/lib/utils";

 const featureData = [
  {
-    desc: "Lorem ipsum dolor sit amet consec adipisicing elit. Quisquam, quos.",
+    desc: "Ihre Website erklaert in wenigen Sekunden, fuer wen Sie arbeiten und was Sie konkret anbieten.",
    img: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri3/img1.jpeg",
-    title: "Quality",
-    badgeTitle: "#1 Block",
+    title: "Klare Positionierung",
+    badgeTitle: "Vorteil 01",
    gridClass: "md:col-span-1",
  },
  {
-    desc: "Consectetur adipiscing elit sed do eiusmod tempor incididunt ut labore. Lorem ipsum dolor sit amet consec adipisicing elit.",
+    desc: "Ein zeitgemaesses Design sorgt fuer einen starken ersten Eindruck und passt zu Ihrem Unternehmen.",
    img: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri3/img7.jpeg",
-    title: "Innovation",
-    badgeTitle: "#2 Block",
+    title: "Modernes Erscheinungsbild",
+    badgeTitle: "Vorteil 02",
    gridClass: "lg:col-span-2",
  },
  {
-    desc: "Ut enim ad minim veniam quis nostrud exercitation ullamco laboris.",
+    desc: "Ihre Inhalte funktionieren sauber auf Smartphone, Tablet und Desktop - ohne Umwege fuer Besucher.",
    img: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri3/img11.jpeg",
-    title: "Performance",
-    badgeTitle: "#3 Block",
+    title: "Mobil optimiert",
+    badgeTitle: "Vorteil 03",
    gridClass: "md:col-span-1 lg:row-span-2  ",
  },
  {
-    desc: "Consectetur adipiscing elit sed do eiusmod tempor incididunt ut labore. Lorem ipsum dolor sit amet consec adipisicing elit.",
+    desc: "Klare Kontaktwege mit gut sichtbaren Handlungsaufforderungen machen den naechsten Schritt leicht.",
    img: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri3/img2.jpeg",
-    title: "Innovation",
-    badgeTitle: "#2 Block",
+    title: "Anfragen ohne Huerden",
+    badgeTitle: "Vorteil 04",
    gridClass: "lg:col-span-2",
  },
  {
-    desc: "Duis aute irure dolor in reprehenderit in voluptate velit esse.",
+    desc: "Die Seite bleibt wartbar aufgebaut, damit Inhalte spaeter schnell angepasst oder erweitert werden koennen.",
    img: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/guri3/img4.jpeg",
-    title: "Reliability",
-    badgeTitle: "#4 Block",
+    title: "Pflegeleicht aufgebaut",
+    badgeTitle: "Vorteil 05",
    gridClass: "md:col-span-1",
  },
 ];
--- a/src/components/footer27.tsx
+++ b/src/components/footer27.tsx
@@ -13,8 +13,8 @@ interface Footer27Props {

 const Footer27 = ({ className }: Footer27Props) => {
  const socialLinks = [
-    { name: "Instagram", href: "#" },
-    { name: "X (Twitter)", href: "#" },
+    { name: "E-Mail", href: "#" },
+    { name: "LinkedIn", href: "#" },
  ];

  const containerVariants = {
@@ -52,15 +52,15 @@ const Footer27 = ({ className }: Footer27Props) => {
              <div className="space-y-8">
                <motion.div variants={itemVariants} className="space-y-6">
                  <h2 className="text-4xl leading-tight font-bold text-foreground lg:text-5xl">
-                    Connect with Me
+                    Bereit fuer einen professionellen Webauftritt?
                  </h2>
                  <p className="max-w-md text-lg leading-relaxed text-muted-foreground">
-                    No commitments. Just a quick chat to see if we click.
+                    Unverbindlich, klar und ohne Verkaufsdruck.
                  </p>
                </motion.div>

                <motion.div variants={itemVariants}>
-                  <Button size="lg">Get in Touch</Button>
+                  <Button size="lg">Erstgespraech vereinbaren</Button>
                </motion.div>
              </div>

@@ -110,14 +110,14 @@ const Footer27 = ({ className }: Footer27Props) => {
                className="flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center"
              >
                <p className="text-sm text-muted-foreground">
-                  © Copyright 2025. All rights Reserved.
+                  © 2025 Matthias Meister. Alle Rechte vorbehalten.
                </p>

                <div className="flex items-center gap-6 text-sm">
                  <span className="text-muted-foreground">
-                    Made by{" "}
+                    Website von{" "}
                    <motion.a
-                      href="https://x.com/shadcnblocks"
+                      href="#"
                      className="underline underline-offset-4 transition-colors hover:text-foreground"
                      whileHover={{ scale: 1.05 }}
                      transition={{
@@ -126,7 +126,7 @@ const Footer27 = ({ className }: Footer27Props) => {
                        damping: 20,
                      }}
                    >
-                      shadcnblocks
+                      Matthias Meister
                    </motion.a>
                  </span>
                </div>
--- a/src/components/hero235.tsx
+++ b/src/components/hero235.tsx
@@ -10,21 +10,21 @@ interface Hero235Props {
 const SERVICES = [
  {
    icon: Sparkles,
-    title: "Visual Identity",
+    title: "Webdesign mit Klarheit",
    description:
-      "We shape visual systems that blend craft and clarity to spark recognition and connection.",
+      "Ein moderner Auftritt, der Ihr Unternehmen auf den ersten Blick professionell wirken laesst.",
  },
  {
    icon: LayoutGrid,
-    title: "Interactive Experiences",
+    title: "Struktur und Texte",
    description:
-      "Experiences that tie design and technology together to tell your story in motion.",
+      "Ich unterstuetze bei Seitenstruktur und Inhalten, damit Besucher schnell verstehen, was Sie anbieten.",
  },
  {
    icon: BookOpen,
-    title: "Workshops",
+    title: "Pflege und Weiterentwicklung",
    description:
-      "Hands-on sessions that adapt to your goals and help you grow with practical guidance.",
+      "Auf Wunsch betreue ich Ihre Website weiter, halte Inhalte aktuell und passe Details laufend an.",
  },
 ];

@@ -58,17 +58,17 @@ const Hero235 = ({ className }: Hero235Props) => {
      </div>
      <div className="relative container flex h-full flex-col justify-between">
        <div className="flex flex-1 items-center justify-center">
-          <div className="mx-auto flex max-w-2xl flex-col items-center text-center">
-            <h1 className="text-4xl font-semibold tracking-tight text-balance text-foreground md:text-5xl lg:text-6xl">
-              Shadcnblocks. Digital craft with an eye for detail
+          <div className="mx-auto flex max-w-4xl flex-col items-center text-center">
+            <h1 className="text-4xl font-semibold tracking-tight text-balance text-foreground md:text-5xl lg:text-8xl">
+              Eine moderne Webseite kostet kein Vermögen.
            </h1>
            <p className="mt-8 max-w-xl text-pretty text-muted-foreground md:text-lg">
-              We build clear, thoughtful interfaces that work as well as they
-              look. If you want a partner who turns your vision into something
-              real, you&apos;re in the right place.
+              Ich gestalte klare Unternehmenswebsites, die Vertrauen aufbauen,
+              Ihre Leistungen verständlich zeigen und Anfragen einfacher
+              machen.
            </p>
            <Button size="lg" className="mt-10">
-              Explore our work
+              Projekt anfragen
              <ArrowDown className="shrink-0" aria-hidden />
            </Button>
          </div>
--- a/src/components/pricing4.tsx
+++ b/src/components/pricing4.tsx
@@ -27,46 +27,48 @@ interface Pricing4Props {
 }

 const Pricing4 = ({
-  title = "Pricing",
-  description = "Check out our affordable pricing plans.",
+  title = "Pakete für Ihre Unternehmenswebsite",
+  description =
+    "Sie wählen den passenden Leistungsumfang. Preise nenne ich transparent im Angebot - abgestimmt auf Ziele, Inhalte und Umfang.",
  plans = [
    {
-      name: "Free",
-      badge: "Free",
-      monthlyPrice: "$0",
-      yearlyPrice: "$0",
+      name: "Basis",
+      badge: "Basis",
+      monthlyPrice: "auf Anfrage",
+      yearlyPrice: "auf Anfrage",
      features: [
-        "Unlimited Integrations",
-        "Windows, Linux, Mac support",
-        "24/7 Support",
-        "Free updates",
+        "Bis zu 5 Inhaltsseiten",
+        "Individuelles Design auf Basis Ihres Unternehmensauftritts",
+        "Kontaktformular und rechtliche Standardseiten",
+        "Responsive Umsetzung für alle geraetetypischen Ansichten",
      ],
-      buttonText: "Get Started",
+      buttonText: "Paket anfragen",
    },
    {
-      name: "Pro",
-      badge: "Pro",
-      monthlyPrice: "$29",
-      yearlyPrice: "$249",
+      name: "Plus",
+      badge: "Plus",
+      monthlyPrice: "auf Anfrage",
+      yearlyPrice: "auf Anfrage",
      features: [
-        "Everything in FREE",
-        "Live call support every month",
-        "Unlimited Storage",
+        "Alles aus Basis plus mehr Seitenumfang",
+        "Unterstuetzung bei Struktur und Textfeinschliff",
+        "Grundlagen für SEO und schnelle Ladezeiten",
+        "Korrekturschleifen mit klarer Abstimmung",
      ],
-      buttonText: "Purchase",
+      buttonText: "Paket anfragen",
    },
    {
-      name: "Elite",
-      badge: "Elite",
-      monthlyPrice: "$59",
-      yearlyPrice: "$549",
+      name: "Komplett",
+      badge: "Komplett",
+      monthlyPrice: "auf Anfrage",
+      yearlyPrice: "auf Anfrage",
      features: [
-        "Everything in PRO",
-        "Advanced analytics",
-        "Custom branding",
-        "Unlimited users",
+        "Alles aus Plus plus erweiterte Inhaltsstruktur",
+        "Priorisierte Abstimmung waehrend der Umsetzung",
+        "Optionales Pflegepaket für Updates und laufende Anpassungen",
+        "Technische Basis fuer eine langfristig wartbare Website",
      ],
-      buttonText: "Purchase",
+      buttonText: "Paket anfragen",
      isPopular: true,
    },
  ],
@@ -90,20 +92,20 @@ const Pricing4 = ({
                setIsAnnually(value === "annually")
              }
              className="w-fit shrink-0"
-              aria-label="Billing period"
+              aria-label="Leistungsvariante"
            >
              <TabsList className="grid h-11 w-max grid-cols-2 gap-0 rounded-md p-1 text-lg">
                <TabsTrigger
                  value="monthly"
                  className="h-full min-h-0 px-7 py-0 font-semibold text-muted-foreground data-active:text-foreground"
                >
-                  Monthly
+                  Projekt
                </TabsTrigger>
                <TabsTrigger
                  value="annually"
                  className="h-full min-h-0 px-7 py-0 font-semibold text-muted-foreground data-active:text-foreground"
                >
-                  Yearly
+                  Projekt + Pflege
                </TabsTrigger>
              </TabsList>
            </Tabs>
@@ -122,10 +124,10 @@ const Pricing4 = ({
                <h3 className="font-mono text-4xl lg:text-5xl">
                  {isAnnually ? plan.yearlyPrice : plan.monthlyPrice}
                </h3>
-                <p
-                  className={`text-muted-foreground ${plan.monthlyPrice === "$0" ? "invisible" : ""}`}
-                >
-                  {isAnnually ? "Per year" : "Per month"}
+                <p className="text-muted-foreground">
+                  {isAnnually
+                    ? "Variante: Projekt + Pflege"
+                    : "Variante: Projekt"}
                </p>
                <Separator className="my-6" />
                <div className="flex h-full flex-col justify-between gap-20">
--- a/src/components/stats11.tsx
+++ b/src/components/stats11.tsx
@@ -13,11 +13,12 @@ const Stats11 = ({ className }: Stats11Props) => {

          <div>
            <h2 className="mb-16 max-w-3xl text-3xl leading-10 font-semibold sm:mb-24 md:mx-10">
-              Revolutionizing healthcare with AI technology.
+              Eine gute Unternehmenswebsite braucht keinen Hype, sondern einen
+              klaren Ablauf.
              <span className="font-medium text-primary/50">
                {" "}
-                Our advanced diagnostic platform helps doctors make accurate
-                diagnoses in seconds.
+                Von der Struktur bis zur Veroeffentlichung arbeite ich
+                transparent und nachvollziehbar.
              </span>
            </h2>
            <div className="relative grid max-w-2xl gap-4 border-x border-border pb-32 sm:grid-cols-2 sm:gap-10 sm:pb-44 md:ml-10 md:border-0">
@@ -25,37 +26,37 @@ const Stats11 = ({ className }: Stats11Props) => {
              <div className="flex flex-col gap-2">
                <span className="flex gap-5 text-3xl font-semibold">
                  <span className="relative -left-px w-px bg-primary/50"></span>
-                  1,000,000+
+                  1
                </span>
                <p className="pl-5 font-medium text-muted-foreground/80">
-                  Diagnoses Made
+                  Ansprechpartner
                </p>
              </div>
              <div className="flex flex-col gap-2">
                <span className="flex gap-5 text-3xl font-semibold">
                  <span className="relative -left-px w-px bg-primary/50"></span>
-                  95%
+                  3
                </span>
                <p className="pl-5 font-medium text-muted-foreground/80">
-                  Diagnostic Accuracy
+                  Klare Schritte
                </p>
              </div>
              <div className="flex flex-col gap-2">
                <span className="flex gap-5 text-3xl font-semibold">
                  <span className="relative -left-px w-px bg-primary/50"></span>
-                  3,000+
+                  100 %
                </span>
                <p className="pl-5 font-medium text-muted-foreground/80">
-                  Healthcare Providers
+                  Responsive
                </p>
              </div>
              <div className="flex flex-col gap-2">
                <span className="flex gap-5 text-3xl font-semibold">
                  <span className="relative -left-px w-px bg-primary/50"></span>
-                  2.5s
+                  Klar
                </span>
                <p className="pl-5 font-medium text-muted-foreground/80">
-                  Latency
+                  Angebot und Umfang
                </p>
              </div>
            </div>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -18,7 +18,7 @@ import "@/styles/global.css";
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width" />
    <meta name="generator" content={Astro.generator} />
-    <title>Matthias Meister Webdesign</title>
+    <title>Webdesign für KMU | Matthias Meister Webdesign</title>
    <script
      src="https://rybbit.matthias.lol/api/script.js"
      data-site-id="60abc81e438a"