Merge version_4 into main

Merge version_4 into main

src/app/page.tsx

@@ -32,16 +32,12 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        {
-          name: "Startseite",          id: "hero"},
-        {
-          name: "Über uns",          id: "about"},
-        {
-          name: "Leistungen",          id: "features"},
-        {
-          name: "Produkte",          id: "products"},
-        {
-          name: "Kontakt",          id: "contact"},
+        { name: "Startseite", id: "hero" },
+        { name: "Über uns", id: "about" },
+        { name: "Leistungen", id: "features" },
+        { name: "Produkte", id: "products" },
+        { name: "Kontakt", id: "contact" },
+        { name: "Preise", id: "/upgrade-plan" },
       ]}
       brandName="Oesterle & Haug & Co."
     />
@@ -49,30 +45,22 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboard
-      background={{
-        variant: "radial-gradient"}}
+      background={{ variant: "radial-gradient" }}
       title="Sicherheit, die Sie schützt."
       description="Oesterle & Haug & Co. – Ihr verlässlicher Partner für professionelle Einbruchsicherungen und moderne Sicherheitstechnik seit Generationen."
       buttons={[
-        {
-          text: "Jetzt beraten lassen",          href: "#contact"},
-        {
-          text: "Mehr erfahren",          href: "#about"},
+        { text: "Jetzt beraten lassen", href: "#contact" },
+        { text: "Mehr erfahren", href: "#about" },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/hacker-with-laptop_23-2147985343.jpg"
       imageAlt="High-security lock mechanism"
       mediaAnimation="slide-up"
       avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/woman-s-eye-with-smart-contact-lens-biometric-secu-technology-concept_53876-97883.jpg",          alt: "Expert technician 1"},
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-smartphone-atm_23-2148264023.jpg",          alt: "Expert technician 2"},
-        {
-          src: "http://img.b2bpic.net/free-photo/thieves-wear-black-hats-pry-windows-steal-things_1150-15146.jpg",          alt: "Expert technician 3"},
-        {
-          src: "http://img.b2bpic.net/free-photo/protection-surveillance-safety-privacy-policy-concept_53876-128098.jpg",          alt: "Expert technician 4"},
-        {
-          src: "gen-stock-rsv-4",          alt: "Expert technician 5"},
+        { src: "http://img.b2bpic.net/free-photo/woman-s-eye-with-smart-contact-lens-biometric-secu-technology-concept_53876-97883.jpg", alt: "Expert technician 1" },
+        { src: "http://img.b2bpic.net/free-photo/close-up-smartphone-atm_23-2148264023.jpg", alt: "Expert technician 2" },
+        { src: "http://img.b2bpic.net/free-photo/thieves-wear-black-hats-pry-windows-steal-things_1150-15146.jpg", alt: "Expert technician 3" },
+        { src: "http://img.b2bpic.net/free-photo/protection-surveillance-safety-privacy-policy-concept_53876-128098.jpg", alt: "Expert technician 4" },
+        { src: "gen-stock-rsv-4", alt: "Expert technician 5" },
       ]}
       avatarText="Über 50 Jahre Experten-Erfahrung"
       marqueeItems={[
@@ -98,15 +86,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       features={[
-        {
-          id: "f1",          title: "Mechanischer Schutz",          subtitle: "Hochwertige Verriegelungen",          category: "Mechanik",          value: "Sicher",          buttons: [{ text: "Details" }],
-        },
-        {
-          id: "f2",          title: "Elektronische Systeme",          subtitle: "Biometrie & Smarthome",          category: "Technik",          value: "Smart",          buttons: [{ text: "Details" }],
-        },
-        {
-          id: "f3",          title: "Überwachung",          subtitle: "Professionelle Kameras",          category: "Service",          value: "24/7",          buttons: [{ text: "Details" }],
-        },
+        { id: "f1", title: "Mechanischer Schutz", subtitle: "Hochwertige Verriegelungen", category: "Mechanik", value: "Sicher", buttons: [{ text: "Details" }] },
+        { id: "f2", title: "Elektronische Systeme", subtitle: "Biometrie & Smarthome", category: "Technik", value: "Smart", buttons: [{ text: "Details" }] },
+        { id: "f3", title: "Überwachung", subtitle: "Professionelle Kameras", category: "Service", value: "24/7", buttons: [{ text: "Details" }] },
       ]}
       title="Unsere Sicherheitstechnologien"
       description="Wir kombinieren langjährige Erfahrung mit modernster Technik für Ihren maximalen Schutz."
@@ -142,8 +124,8 @@ export default function LandingPage() {
         { id: "m2", icon: CheckCircle, title: "Installationen", value: "10k+" },
         { id: "m3", icon: Users, title: "Zufriedene Kunden", value: "5k+" },
       ]}
-      title="Zahlen sprechen für uns"
-      description="Erfahrung, auf die Sie bauen können."
+      title="Vertrauenswürdige Kennzahlen"
+      description="Erfahrung und Kompetenz, auf die Sie bauen können."
     />
   </div>
 
@@ -153,15 +135,13 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={true}
       testimonials={[
-        { id: "t1", name: "Sarah Müller", handle: "@sarah", testimonial: "Perfekte Beratung und schnelle Montage. Sehr sicher!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-with-both-hands-white-t-shirt-zip-front-black-hoodie-looking-serious-front-view_176474-45412.jpg" },
-        { id: "t2", name: "Thomas Weber", handle: "@thomas", testimonial: "Oesterle & Haug ist mein Partner für alle Sicherheitsthemen.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-successful-businessman-smiling-posing-with-crossed-arms-office_176420-913.jpg" },
-        { id: "t3", name: "Familie Schneider", handle: "@schneider", testimonial: "Wir fühlen uns jetzt deutlich sicherer zuhause.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/christmas-concept-with-young-parents_23-2147724423.jpg" },
-        { id: "t4", name: "Hildegard Kraus", handle: "@hilde", testimonial: "Sehr kompetent und absolut zuverlässig.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/older-couple-embraced-outdoors-city_23-2149007079.jpg" },
-        { id: "t5", name: "Michael B.", handle: "@michael", testimonial: "Hervorragendes Preis-Leistungs-Verhältnis.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/concentrated-bearded-man-sitting-pillow-using-tablet_1262-17832.jpg" },
+        { id: "t1", name: "Sarah Müller", handle: "@sarah", testimonial: "Perfekte Beratung und schnelle Montage. Wir fühlen uns absolut sicher!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-with-both-hands-white-t-shirt-zip-front-black-hoodie-looking-serious-front-view_176474-45412.jpg" },
+        { id: "t2", name: "Thomas Weber", handle: "@thomas", testimonial: "Oesterle & Haug ist mein Partner für alle Sicherheitsthemen. Sehr professionell.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-successful-businessman-smiling-posing-with-crossed-arms-office_176420-913.jpg" },
+        { id: "t3", name: "Familie Schneider", handle: "@schneider", testimonial: "Wir sind sehr zufrieden mit der neuen Alarmanlage. Top Service.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/christmas-concept-with-young-parents_23-2147724423.jpg" },
       ]}
       showRating={true}
-      title="Kundenstimmen"
-      description="Was unsere Kunden über uns sagen."
+      title="Kundenfeedback"
+      description="Das sagen unsere Kunden über unsere Sicherheitslösungen."
     />
   </div>
 
@@ -169,11 +149,12 @@ export default function LandingPage() {
       <FaqSplitText
       useInvertedBackground={false}
       faqs={[
-        { id: "q1", title: "Bieten Sie auch Notdienste an?", content: "Ja, wir bieten einen 24/7 Sicherheits-Notdienst an." },
-        { id: "q2", title: "Wie schnell montieren Sie?", content: "Nach Beratung meist innerhalb von 48 Stunden." },
-        { id: "q3", title: "Sind die Produkte zertifiziert?", content: "Alle unsere Produkte entsprechen deutschen Sicherheitsstandards." },
+        { id: "q1", title: "Bieten Sie auch Notdienste an?", content: "Ja, wir bieten einen 24/7 Sicherheits-Notdienst für unsere Kunden an." },
+        { id: "q2", title: "Wie schnell montieren Sie?", content: "Nach einem Vor-Ort-Termin erfolgt die Montage in der Regel innerhalb von 48 Stunden." },
+        { id: "q3", title: "Sind die Produkte zertifiziert?", content: "Selbstverständlich. Alle unsere Produkte entsprechen den geltenden deutschen Sicherheitsnormen (DIN/VdS)." },
       ]}
-      sideTitle="Fragen?"
+      sideTitle="Häufige Fragen"
+      sideDescription="Hier finden Sie Antworten auf die wichtigsten Fragen zur Sicherheitstechnik."
       faqsAnimation="slide-up"
     />
   </div>
@@ -183,11 +164,11 @@ export default function LandingPage() {
       useInvertedBackground={true}
       background={{ variant: "radial-gradient" }}
       tag="Kontakt"
-      title="Kontakt aufnehmen"
-      description="Sie haben Fragen oder benötigen eine Sicherheitsberatung? Unser Team steht Ihnen zur Seite."
+      title="Sprechen Sie mit unseren Experten"
+      description="Gerne beraten wir Sie unverbindlich zu Ihrem persönlichen Schutzkonzept."
       buttons={[
-        { text: "Jetzt Nachricht senden", href: "mailto:info@oesterle-haug.de" },
-        { text: "Anrufen: 0711 123456", href: "tel:+49711123456" }
+        { text: "Jetzt Nachricht schreiben", href: "mailto:info@oesterle-haug.de" },
+        { text: "Direkt anrufen", href: "tel:+49711123456" }
       ]}
     />
   </div>
@@ -195,26 +176,28 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterMedia
       imageSrc="http://img.b2bpic.net/free-photo/close-up-perforated-metal-sheet-with-circular-holes-rust_9975-133006.jpg"
-      logoText="Oesterle & Haug & Co. Einbruchsicherungen GmbH"
+      logoText="Oesterle & Haug & Co."
       copyrightText="© 2025 Oesterle & Haug & Co. Einbruchsicherungen GmbH. Alle Rechte vorbehalten."
       columns={[
         {
-          title: "Unternehmen",          items: [
+          title: "Unternehmen", items: [
             { label: "Über uns", href: "#about" },
+            { label: "Karriere", href: "#" },
             { label: "Kontakt", href: "#contact" }
           ],
         },
         {
-          title: "Rechtliches",          items: [
+          title: "Rechtliches", items: [
             { label: "Impressum", href: "/impressum" },
             { label: "Datenschutz", href: "/datenschutz" },
             { label: "AGB", href: "/agb" }
           ],
         },
         {
-          title: "Standort",          items: [
+          title: "Kontakt", items: [
             { label: "Sicherheitsstraße 1", href: "#" },
-            { label: "70173 Stuttgart", href: "#" }
+            { label: "70173 Stuttgart", href: "#" },
+            { label: "Tel: 0711 123456", href: "tel:+49711123456" }
           ]
         }
       ]}

src/app/upgrade-plan/page.tsx

@@ -0,0 +1,68 @@
+"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: "/" }] }
+            ]}
+            videoSrc="https://player.vimeo.com/external/494057866.sd.mp4?s=d4538e1467474a2754641617498c474005c21966&profile_id=165"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}