update

app/leistungen/[slug]/page.tsx

@@ -13,6 +13,74 @@ import FaqSection from "@/components/faq/FaqSection";
 import { leistungenFaq } from "@/components/faq/faqData";
 import ContactCtaSection from "@/components/contact/ContactCtaSection";
 
+import type { Metadata } from "next";
+
+const siteUrl = "https://basiclean.de";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}): Promise<Metadata> {
+  const { slug } = await params;
+  const leistung = leistungen.find((item) => item.slug === slug);
+
+  if (!leistung) {
+    return {
+      title: "Nicht gefunden",
+      robots: { index: false, follow: false },
+    };
+  }
+
+  const hasCustomSeo = Boolean(leistung.metaTitle);
+
+  // Eigener metaTitle vorhanden -> Suffix "| Basiclean" unterdrücken (title.absolute).
+  // Kein metaTitle gesetzt -> Fallback auf titleMain, Template aus dem Layout greift normal.
+  const title = hasCustomSeo
+    ? { absolute: leistung.metaTitle as string }
+    : leistung.titleMain;
+
+  const description = leistung.metaDescription ?? leistung.text;
+  const url = `${siteUrl}/leistungen/${leistung.slug}`;
+  const ogImageUrl = leistung.ogImage ?? leistung.image;
+
+  // Für OpenGraph/Twitter braucht es einen reinen String-Titel (kein title.absolute-Objekt).
+  const flatTitle = hasCustomSeo
+    ? (leistung.metaTitle as string)
+    : leistung.titleMain;
+
+  return {
+    title,
+    description,
+    alternates: {
+      canonical: url,
+    },
+    openGraph: {
+      type: "website",
+      siteName: "Basiclean",
+      locale: "de_DE",
+      title: flatTitle,
+      description,
+      url,
+      images: [
+        {
+          url: ogImageUrl,
+          alt: leistung.imageAlt,
+          width: 1200,
+          height: 628,
+        },
+      ],
+    },
+    twitter: {
+      card: "summary_large_image",
+      site: "@basiclean",
+      title: flatTitle,
+      description,
+      images: [{ url: ogImageUrl, alt: leistung.imageAlt }],
+    },
+  };
+}
+
 export function generateStaticParams() {
   return leistungen.map((item) => ({
     slug: item.slug,
@@ -110,9 +178,9 @@ export default async function LeistungDetail({
         />
       </section>
 
-<section>
-  <ContactCtaSection {...leistung.contactCtaSection} />
-</section>
+      <section>
+        <ContactCtaSection {...leistung.contactCtaSection} />
+      </section>
     </main>
   );
 }