Update src/app/styles/variables.css

src/app/page.tsx

@@ -15,16 +15,16 @@ import { Award, CheckCircle, Clock, DollarSign, Edit, Gauge, HelpCircle, Lightbu
 export default function LandingPage() {
   return (
     <ThemeProvider
-      defaultButtonVariant="expand-hover"
+      defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="background-highlight"
+      defaultTextAnimation="reveal-blur"
-      borderRadius="soft"
+      borderRadius="rounded"
-      contentWidth="mediumSmall"
+      contentWidth="medium"
-      sizing="large"
+      sizing="mediumLargeSizeLargeTitles"
-      background="noiseDiagonalGradient"
+      background="none"
-      cardStyle="glass-elevated"
+      cardStyle="subtle-shadow"
-      primaryButtonStyle="diagonal-gradient"
+      primaryButtonStyle="gradient"
-      secondaryButtonStyle="glass"
+      secondaryButtonStyle="solid"
-      headingFontWeight="extrabold"
+      headingFontWeight="semibold"
     >
       <div id="nav" data-section="nav">
         <NavbarStyleApple
@@ -47,7 +47,7 @@ export default function LandingPage() {
           tag="Websites für kleine Unternehmen"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
-          background={{ variant: "downward-rays-animated-grid" }}
+          background={{ variant: "radial-gradient" }}
           buttons={[
             { text: "Jetzt Website kaufen", href: "#packages" },
             { text: "Beispiele ansehen", href: "#industries" }
@@ -103,7 +103,7 @@ export default function LandingPage() {
           description="Wählen Sie das perfekte Paket für Ihre Bedürfnisse. Alle Pakete enthalten Hosting, Domain und E-Mail-Support."
           textboxLayout="default"
           animationType="scale-rotate"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
           plans={[
             {
               id: "starter",              title: "Starter",              price: "299 €",              period: "Einmalig",              features: [
@@ -168,7 +168,7 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           textboxLayout="default"
           animationType="opacity"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
           features={[
             {
               id: "fast",              title: "In 48h online",              description: "Ihre Website ist innerhalb von zwei Tagen live. Schneller als traditionelle Agenturen, genauso professionell und zuverlässig.",              media: { imageSrc: "http://img.b2bpic.net/free-vector/bicycle-delivery-concept-flat-style_23-2148167861.jpg", imageAlt: "fast speed clock timer quick rapid" },
@@ -215,7 +215,7 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           animationType="slide-up"
           textboxLayout="default"
-          useInvertedBackground={false}
+          useInvertedBackground={true}
           testimonials={[
             {
               id: "1",              name: "Maria Schmidt",              role: "Inhaberin",              testimonial: "Mit SiteForge hatte ich innerhalb von zwei Tagen meine eigene Website online. Die Terminbuchung funktioniert perfekt, und meine Kunden finden mich jetzt online. Absolut empfehlenswert!",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-with-long-brown-hair-black-t-shirt-white-jacket_613910-8245.jpg",              imageAlt: "professional woman portrait business headshot",              icon: Star
@@ -242,7 +242,7 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           textboxLayout="default"
           faqsAnimation="slide-up"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
           faqs={[
             {
               id: "q1",              title: "Wie lange dauert es, bis meine Website online ist?",              content: "Ihre Website ist innerhalb von 48 Stunden online. Sie müssen nur Ihre Branche auswählen, das Design anpassen und bestätigen. Danach kümmern wir uns um den Rest – Hosting, Domain, SSL-Zertifikat und Deployment."

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f7f6f7;
+  --background: #f5f5f5;
   --card: #ffffff;
-  --foreground: #0c1325;
+  --foreground: #1c1c1c;
-  --primary-cta: #0b07ff;
+  --primary-cta: #1c1c1c;
   --primary-cta-text: #f7f6f7;
   --secondary-cta: #ffffff;
   --secondary-cta-text: #0c1325;
-  --accent: #93b7ff;
+  --accent: #15479c;
-  --background-accent: #a8bae8;
+  --background-accent: #a8cce8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);