diff --git a/src/app/page.tsx b/src/app/page.tsx
index 49a7d3e..b0adaae 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -7,10 +7,10 @@ import TextAbout from "@/components/sections/about/TextAbout";
 import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
 import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
 import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
-import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
-import ContactText from "@/components/sections/contact/ContactText";
+import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterCard from "@/components/sections/footer/FooterCard";
-import { BarChart3, CheckCircle, Eye, FileCheck, FileText, Handshake, Instagram, Linkedin, PieChart, Rocket, Scissors, Sparkles, Star, Target, TrendingUp, Twitter, Users, Video, Zap, Youtube } from "lucide-react";
+import { BarChart3, CheckCircle, Eye, FileCheck, FileText, Handshake, Instagram, Linkedin, PieChart, Rocket, Scissors, Sparkles, Star, Target, TrendingUp, Twitter, Users, Video, Zap, Youtube, ArrowRight, Clock } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -32,7 +32,7 @@ export default function LandingPage() {
           navItems={[
             { name: "Leistungen", id: "features" },
             { name: "Über uns", id: "about" },
-            { name: "Projekte", id: "projects" },
+            { name: "Ablauf", id: "process" },
             { name: "Kontakt", id: "contact" }
           ]}
           button={{
@@ -165,87 +165,100 @@ export default function LandingPage() {
       </div>
 
       <div id="process" data-section="process">
-        <FeatureCardTen
+        <MetricCardEleven
           title="So funktioniert die Zusammenarbeit mit Zenit Studios"
-          description="Unser erprobter Prozess für maximale Kampagnen-Performance und Creator-Zufriedenheit."
-          tag="Ablauf"
-          features={[
+          description="Unser 5-Schritt-Prozess für maximale Kampagnen-Performance und Creator-Zufriedenheit."
+          tag="Projektablauf"
+          animationType="slide-up"
+          metrics={[
             {
-              id: "1",              title: "Strategiegespräch",              description: "Wir lernen deine Marke, Ziele und Zielgruppe kennen. Gemeinsam entwickeln wir eine maßgeschneiderte Influencer Marketing Strategie mit klaren KPIs und einem realistischen Budget.",              media: {
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/modern-strategic-planning-visualization--1773171821397-155771ff.png"
-              },
-              items: [
-                { icon: Target, text: "Zieldefinition und KPI-Festlegung" },
-                { icon: Users, text: "Zielgruppen-Analyse" },
-                { icon: BarChart3, text: "Budget-Planung" }
-              ],
-              reverse: false
+              id: "1",              value: "01",              title: "Strategiegespräch",              description: "Zieldefinition, KPI-Festlegung und Zielgruppen-Analyse für deine perfekte Kampagne.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/modern-strategic-planning-visualization--1773171821397-155771ff.png",              imageAlt: "Strategiegespräch"
             },
             {
-              id: "2",              title: "Creator Auswahl",              description: "Basierend auf deinen Anforderungen wählen wir die perfekten Influencer aus unserem Netzwerk. Jeder Creator wird geprüft auf Authentizität, Engagement-Rate und Brand-Fit.",              media: {
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/visual-representation-of-creator-selecti-1773171820831-7abde26a.png"
-              },
-              items: [
-                { icon: CheckCircle, text: "Influencer-Selektion" },
-                { icon: FileCheck, text: "Vertragsverhandlung" },
-                { icon: Handshake, text: "Briefing und Abstimmung" }
-              ],
-              reverse: true
+              id: "2",              value: "02",              title: "Creator Auswahl",              description: "Auswahl der perfekten Influencer aus unserem Netzwerk basierend auf Brand-Fit und Engagement.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/visual-representation-of-creator-selecti-1773171820831-7abde26a.png",              imageAlt: "Creator Auswahl"
             },
             {
-              id: "3",              title: "Kampagnen-Produktion",              description: "Unser Produktionsteam arbeitet mit den Influencern zusammen. Von Dreh bis Schnitt – wir stellen sicher, dass der Content hochwertig, authentisch und markenkonform ist.",              media: {
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/professional-content-production-workflow-1773171820135-dac03d99.png"
-              },
-              items: [
-                { icon: Video, text: "Content-Dreh und Produktion" },
-                { icon: Scissors, text: "Professionelle Bearbeitung" },
-                { icon: Sparkles, text: "Quality Assurance" }
-              ],
-              reverse: false
+              id: "3",              value: "03",              title: "Kampagnen-Produktion",              description: "Professionelle Erstellung von hochwertigem, authentischem Content mit unserem Produktionsteam.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/professional-content-production-workflow-1773171820135-dac03d99.png",              imageAlt: "Kampagnen-Produktion"
             },
             {
-              id: "4",              title: "Launch & Optimierung",              description: "Der Content geht live! Wir koordinieren die Veröffentlichung, optimieren in Echtzeit und maximieren die Performance durch datengesteuerte Anpassungen.",              media: {
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/campaign-launch-and-publication-process--1773171821219-90d6491e.png"
-              },
-              items: [
-                { icon: Rocket, text: "Koordinierte Veröffentlichung" },
-                { icon: TrendingUp, text: "Echtzeit-Monitoring" },
-                { icon: Zap, text: "Performance-Optimierung" }
-              ],
-              reverse: true
+              id: "4",              value: "04",              title: "Launch & Optimierung",              description: "Koordinierte Veröffentlichung mit Echtzeit-Monitoring und Performance-Optimierung.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/campaign-launch-and-publication-process--1773171821219-90d6491e.png",              imageAlt: "Launch & Optimierung"
             },
             {
-              id: "5",              title: "Analyse & Reporting",              description: "Nach der Kampagne liefern wir ein detailliertes Analysereport mit allen wichtigen Metriken, Learnings und Empfehlungen für zukünftige Kampagnen.",              media: {
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/comprehensive-campaign-analysis-and-repo-1773171821866-a7938046.png"
-              },
-              items: [
-                { icon: BarChart3, text: "Performance-Analyse" },
-                { icon: PieChart, text: "ROI-Berechnung" },
-                { icon: FileText, text: "Detailliertes Reporting" }
-              ],
-              reverse: false
+              id: "5",              value: "05",              title: "Analyse & Reporting",              description: "Detailliertes Analysereport mit ROI-Berechnung und Empfehlungen für zukünftige Kampagnen.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/comprehensive-campaign-analysis-and-repo-1773171821866-a7938046.png",              imageAlt: "Analyse & Reporting"
             }
           ]}
           textboxLayout="default"
-          animationType="slide-up"
           useInvertedBackground={false}
         />
       </div>
 
+      <div id="booking" data-section="booking" className="py-16 md:py-24">
+        <div className="max-w-6xl mx-auto px-4 md:px-8">
+          <div className="text-center mb-12 md:mb-16">
+            <div className="inline-block mb-4">
+              <span className="text-sm font-medium text-primary-cta px-4 py-2 bg-primary-cta/10 rounded-full flex items-center gap-2">
+                <Clock className="w-4 h-4" />
+                Termin vereinbaren
+              </span>
+            </div>
+            <h2 className="text-3xl md:text-5xl font-bold mb-4 text-foreground">Dein nächstes Strategiegespräch wartet</h2>
+            <p className="text-lg text-foreground/70 max-w-2xl mx-auto">Buche jetzt ein kostenloses Beratungsgespräch mit unserem Team. Wir besprechen deine Ziele, Zielgruppe und entwickeln eine maßgeschneiderte Strategie für deine Kampagne.</p>
+          </div>
+          
+          <div className="bg-card rounded-lg border border-accent/20 p-8 md:p-12 text-center">
+            <div className="mb-8">
+              <h3 className="text-2xl font-semibold mb-3 text-foreground">Calendly Integration</h3>
+              <p className="text-foreground/60 mb-6">Wähle einen Termin, der perfekt zu dir passt. Unser Team wird dich vor dem Gespräch kontaktieren.</p>
+              <a 
+                href="https://calendly.com" 
+                target="_blank" 
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-2 px-8 py-3 bg-primary-cta hover:bg-primary-cta/90 text-white rounded-full font-medium transition-all duration-300 hover:gap-3"
+              >
+                Termin buchen
+                <ArrowRight className="w-4 h-4" />
+              </a>
+            </div>
+            
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-10 pt-8 border-t border-accent/20">
+              <div className="flex flex-col items-center">
+                <Clock className="w-6 h-6 text-primary-cta mb-3" />
+                <p className="font-medium text-foreground mb-1">30-60 Minuten</p>
+                <p className="text-sm text-foreground/60">Flexible Termine</p>
+              </div>
+              <div className="flex flex-col items-center">
+                <CheckCircle className="w-6 h-6 text-primary-cta mb-3" />
+                <p className="font-medium text-foreground mb-1">Kostenlos</p>
+                <p className="text-sm text-foreground/60">Keine versteckten Gebühren</p>
+              </div>
+              <div className="flex flex-col items-center">
+                <Users className="w-6 h-6 text-primary-cta mb-3" />
+                <p className="font-medium text-foreground mb-1">Experten-Team</p>
+                <p className="text-sm text-foreground/60">Über 10 Jahre Erfahrung</p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
       <div id="contact" data-section="contact">
-        <ContactText
-          text="Bereit für deine nächste erfolgreiche Social Media Kampagne? Lass uns gemeinsam deine Marke mit den perfekten Creatorn verbinden und hochwertigen Content produzieren."
-          animationType="entrance-slide"
-          buttons={[
-            {
-              text: "Kostenloses Strategiegespräch buchen",              href: "https://calendly.com"
-            },
-            {
-              text: "Mehr erfahren",              href: "#about"
-            }
+        <ContactSplitForm
+          title="Fragen? Kontaktiere uns direkt."
+          description="Schreib uns eine Nachricht und wir antworten so schnell wie möglich. Oder buche direkt einen Termin über Calendly."
+          inputs={[
+            { name: "name", type: "text", placeholder: "Dein Name", required: true },
+            { name: "email", type: "email", placeholder: "Deine E-Mail", required: true },
+            { name: "company", type: "text", placeholder: "Dein Unternehmen", required: false }
           ]}
-          background={{ variant: "sparkles-gradient" }}
+          textarea={{
+            name: "message",            placeholder: "Erzähl uns von deinem Projekt...",            rows: 5,
+            required: true
+          }}
           useInvertedBackground={false}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AlIsq5qiq4IfbtootdlaBu0XEA/professional-contact-consultation-setup-1773171820200-5c3d2e1a.png"
+          imageAlt="Kontakt"
+          mediaAnimation="slide-up"
+          buttonText="Nachricht senden"
         />
       </div>
 
diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css
index e72f56d..39e3f3d 100644
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #4b494b;
-  --card: #ffffff;
-  --foreground: #250c0d;
-  --primary-cta: #b82b40;
+  --background: #000000;
+  --card: #0c0c0c;
+  --foreground: #ffffff;
+  --primary-cta: #cee7ff;
   --primary-cta-text: #f7f6f7;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #000000;
   --secondary-cta-text: #250c0d;
-  --accent: #b90941;
-  --background-accent: #e8a8b6;
+  --accent: #535353;
+  --background-accent: #cee7ff;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);