src/app/page.tsx

@@ -37,6 +37,7 @@ export default function LandingPage() {
         { name: "Leistungen", id: "features" },
         { name: "Produkte", id: "products" },
         { name: "Kontakt", id: "contact" },
+        { name: "Preise", id: "/upgrade-plan" },
       ]}
       brandName="Oesterle & Haug & Co."
     />

src/app/upgrade-plan/page.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import { CheckCircle } from "lucide-react";
+
+export default function UpgradePlanPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="mediumLarge"
+        sizing="mediumLargeSizeMediumTitles"
+        background="none"
+        cardStyle="outline"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Startseite", id: "/" },
+              { name: "Preise", id: "/upgrade-plan" }
+            ]}
+            brandName="Oesterle & Haug & Co."
+          />
+        </div>
+
+        <div id="pricing" data-section="pricing">
+          <PricingCardEight
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            title="Wählen Sie Ihren Schutz"
+            description="Sicherheit in verschiedenen Stufen – passend zu Ihren Bedürfnissen."
+            plans={[
+              {
+                id: "basic",                badge: "Basis",                price: "0€",                subtitle: "Grundlegender Schutz für Einsteiger.",                features: ["Einbruchschutz-Check", "Basis-Beratung", "24/7 Notfall-Hotline"],
+                buttons: [{ text: "Jetzt starten", href: "#contact" }]
+              },
+              {
+                id: "pro",                badge: "Pro",                badgeIcon: CheckCircle,
+                price: "49€",                subtitle: "Umfassende Sicherheit für Ihr Zuhause.",                features: ["Alles aus Basis", "Smarthome-Integration", "Video-Überwachung"],
+                buttons: [{ text: "Jetzt upgraden", href: "#contact" }]
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            logoText="Oesterle & Haug & Co."
+            columns={[
+              { title: "Unternehmen", items: [{ label: "Kontakt", href: "/" }] }
+            ]}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}