Update src/app/styles/variables.css

Merge version_1 into main

src/app/page.tsx

@@ -11,6 +11,11 @@ import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
 
 export default function LandingPage() {
+  const handleGenerationSubmit = (email: string) => {
+    console.log("Sending generation confirmation to:", email);
+    console.log("Sending admin notification with generation details and payment info...");
+  };
+
   return (
     <ThemeProvider
         defaultButtonVariant="expand-hover"
@@ -29,17 +34,11 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Generieren",
-          id: "hero",
-        },
+          name: "Generieren",          id: "hero"},
         {
-          name: "Features",
-          id: "features",
-        },
+          name: "Features",          id: "features"},
         {
-          name: "Testimonials",
-          id: "testimonials",
-        },
+          name: "Testimonials",          id: "testimonials"},
       ]}
       brandName="GenAI Pro"
     />
@@ -48,39 +47,26 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroBillboardGallery
       background={{
-        variant: "sparkles-gradient",
-      }}
+        variant: "sparkles-gradient"}}
       title="KI Bild- & Videogenerator"
       description="Erstelle atemberaubende visuelle Inhalte in Sekunden. Gib einfach deinen Prompt ein und lass dich von der KI begeistern."
       buttons={[
         {
-          text: "Bild generieren",
-        },
+          text: "Bild generieren"},
         {
-          text: "Video generieren",
-        },
+          text: "Video generieren"},
       ]}
       mediaItems={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=1",
-          imageAlt: "AI Output Gallery 1",
-        },
+          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=1",          imageAlt: "AI Output Gallery 1"},
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=2",
-          imageAlt: "AI Output Gallery 2",
-        },
+          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=2",          imageAlt: "AI Output Gallery 2"},
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=3",
-          imageAlt: "AI Output Gallery 3",
-        },
+          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=3",          imageAlt: "AI Output Gallery 3"},
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=4",
-          imageAlt: "AI Output Gallery 4",
-        },
+          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=4",          imageAlt: "AI Output Gallery 4"},
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=5",
-          imageAlt: "AI Output Gallery 5",
-        },
+          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg?_wi=5",          imageAlt: "AI Output Gallery 5"},
       ]}
       mediaAnimation="blur-reveal"
     />
@@ -93,23 +79,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          title: "Blitzschnell",
-          description: "Unsere leistungsstarke KI generiert deine Inhalte in nur wenigen Sekunden.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-92639.jpg",
-          imageAlt: "Fast Generation",
-        },
+          title: "Blitzschnell",          description: "Unsere leistungsstarke KI generiert deine Inhalte in nur wenigen Sekunden.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-92639.jpg",          imageAlt: "Fast Generation"},
         {
-          title: "Höchste Qualität",
-          description: "Hochauflösende Ergebnisse, die genau deinen Anforderungen entsprechen.",
-          imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24189.jpg",
-          imageAlt: "High Quality",
-        },
+          title: "Höchste Qualität",          description: "Hochauflösende Ergebnisse, die genau deinen Anforderungen entsprechen.",          imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24189.jpg",          imageAlt: "High Quality"},
         {
-          title: "Intuitive Steuerung",
-          description: "Einfach Prompt eingeben, Knopf drücken, fertig.",
-          imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg",
-          imageAlt: "Easy Usage",
-        },
+          title: "Intuitive Steuerung",          description: "Einfach Prompt eingeben, Knopf drücken, fertig.",          imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg",          imageAlt: "Easy Usage"},
       ]}
       title="Warum GenAI Pro?"
       description="Deine kreative Vision, direkt in die Realität umgesetzt."
@@ -123,40 +97,15 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "1",
-          name: "Sarah Miller",
-          role: "Designerin",
-          testimonial: "Unglaubliche Geschwindigkeit und Qualität. Mein Workflow hat sich verdoppelt.",
-          imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-3693.jpg",
-        },
+          id: "1",          name: "Sarah Miller",          role: "Designerin",          testimonial: "Unglaubliche Geschwindigkeit und Qualität. Mein Workflow hat sich verdoppelt.",          imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-3693.jpg"},
         {
-          id: "2",
-          name: "Markus Weber",
-          role: "Content Creator",
-          testimonial: "Einfacher als alles andere, was ich bisher ausprobiert habe.",
-          imageSrc: "http://img.b2bpic.net/free-photo/expressive-black-model-with-colorful-powder_23-2149339795.jpg",
-        },
+          id: "2",          name: "Markus Weber",          role: "Content Creator",          testimonial: "Einfacher als alles andere, was ich bisher ausprobiert habe.",          imageSrc: "http://img.b2bpic.net/free-photo/expressive-black-model-with-colorful-powder_23-2149339795.jpg"},
         {
-          id: "3",
-          name: "Elena Rossi",
-          role: "Marketerin",
-          testimonial: "Die Ergebnisse sind atemberaubend. Sehr empfehlenswert!",
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-fair-haired-girl-using-tablet-after-photoshoot-sitting-table-with-computer-camera-charming-female-student-glasses-black-shirt-working-project_197531-25383.jpg",
-        },
+          id: "3",          name: "Elena Rossi",          role: "Marketerin",          testimonial: "Die Ergebnisse sind atemberaubend. Sehr empfehlenswert!",          imageSrc: "http://img.b2bpic.net/free-photo/stylish-fair-haired-girl-using-tablet-after-photoshoot-sitting-table-with-computer-camera-charming-female-student-glasses-black-shirt-working-project_197531-25383.jpg"},
         {
-          id: "4",
-          name: "David Choi",
-          role: "Entwickler",
-          testimonial: "Die API-Integration ist nahtlos und die Ergebnisse sind konsistent.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-receiving-phone-call-from-friend-while-working-from-home-laptop_482257-92903.jpg",
-        },
+          id: "4",          name: "David Choi",          role: "Entwickler",          testimonial: "Die API-Integration ist nahtlos und die Ergebnisse sind konsistent.",          imageSrc: "http://img.b2bpic.net/free-photo/man-receiving-phone-call-from-friend-while-working-from-home-laptop_482257-92903.jpg"},
         {
-          id: "5",
-          name: "Julia Schmidt",
-          role: "Künstlerin",
-          testimonial: "Genau das Werkzeug, das ich für meine digitale Kunst brauchte.",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-middle-aged-woman-white-hoodie_23-2149051802.jpg",
-        },
+          id: "5",          name: "Julia Schmidt",          role: "Künstlerin",          testimonial: "Genau das Werkzeug, das ich für meine digitale Kunst brauchte.",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-middle-aged-woman-white-hoodie_23-2149051802.jpg"},
       ]}
       title="Das sagen unsere Nutzer"
       description="Kreative weltweit nutzen GenAI Pro täglich."
@@ -172,52 +121,28 @@ export default function LandingPage() {
       description="Flexible Optionen für jeden Bedarf."
       plans={[
         {
-          id: "starter",
-          badge: "Starter",
-          price: "0€",
-          subtitle: "Ideal für erste Experimente",
-          buttons: [
+          id: "starter",          badge: "Starter",          price: "0€",          subtitle: "Ideal für erste Experimente",          buttons: [
             {
-              text: "Jetzt starten",
-            },
+              text: "Jetzt starten"},
           ],
           features: [
-            "10 Bilder/Monat",
-            "Standardqualität",
-            "Web-Interface",
-          ],
+            "10 Bilder/Monat",            "Standardqualität",            "Web-Interface"],
         },
         {
-          id: "pro",
-          badge: "Pro",
-          price: "29€",
-          subtitle: "Für professionelle Creator",
-          buttons: [
+          id: "pro",          badge: "Pro",          price: "29€",          subtitle: "Für professionelle Creator",          buttons: [
             {
-              text: "Jetzt wählen",
-            },
+              text: "Jetzt wählen"},
           ],
           features: [
-            "Unbegrenzte Bilder",
-            "HD Video-Generierung",
-            "Priorisierter Support",
-          ],
+            "Unbegrenzte Bilder",            "HD Video-Generierung",            "Priorisierter Support"],
         },
         {
-          id: "enterprise",
-          badge: "Enterprise",
-          price: "Auf Anfrage",
-          subtitle: "Für Teams & Unternehmen",
-          buttons: [
+          id: "enterprise",          badge: "Enterprise",          price: "Auf Anfrage",          subtitle: "Für Teams & Unternehmen",          buttons: [
             {
-              text: "Kontakt aufnehmen",
-            },
+              text: "Kontakt aufnehmen"},
           ],
           features: [
-            "API-Zugang",
-            "Custom Modelle",
-            "Dedizierter Ansprechpartner",
-          ],
+            "API-Zugang",            "Custom Modelle",            "Dedizierter Ansprechpartner"],
         },
       ]}
     />
@@ -227,14 +152,13 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={false}
       background={{
-        variant: "sparkles-gradient",
-      }}
+        variant: "sparkles-gradient"}}
       tag="Jetzt loslegen"
       title="Bereit für deine nächste Idee?"
       description="Starte sofort ohne Anmeldung und generiere deine ersten Werke."
       buttons={[
         {
-          text: "Jetzt kostenlos testen",
+          text: "Jetzt kostenlos testen",          onClick: () => handleGenerationSubmit("customer@example.com")
         },
       ]}
     />
@@ -244,16 +168,12 @@ export default function LandingPage() {
       <FooterLogoReveal
       logoText="GenAI Pro"
       leftLink={{
-        text: "Impressum",
-        href: "/impressum",
-      }}
+        text: "Impressum",        href: "/impressum"}}
       rightLink={{
-        text: "Datenschutz",
-        href: "/datenschutz",
-      }}
+        text: "Datenschutz",        href: "/datenschutz"}}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -12,7 +12,7 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #f5f5f5;
+  --foreground: #ffffff;
   --primary-cta: #ffdf7d;
   --primary-cta-text: #0a0a0a;
   --secondary-cta: #1a1a1a;