Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -33,21 +33,13 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "Leistungen",
-          id: "features",
-        },
+          name: "Leistungen",          id: "features"},
         {
-          name: "Preise",
-          id: "pricing",
-        },
+          name: "Preise",          id: "pricing"},
         {
-          name: "Kontakt",
-          id: "contact",
-        },
+          name: "Kontakt",          id: "contact"},
       ]}
       brandName="Trageprofi"
     />
@@ -56,77 +48,36 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroSplitKpi
       background={{
-        variant: "gradient-bars",
-      }}
+        variant: "plain"}}
       title="Ihr Trageprofi in Baden-Baden"
       description="Zuverlässige Entrümpelungen & Umzüge mit Handschlag-Qualität. Wir erledigen das für Sie – schnell, sicher und fair."
       kpis={[
         {
-          value: "100%",
-          label: "Kundenzufriedenheit",
-        },
+          value: "100%",          label: "Kundenzufriedenheit"},
         {
-          value: "24/7",
-          label: "Erreichbar",
-        },
+          value: "24/7",          label: "Erreichbar"},
         {
-          value: "15+",
-          label: "Jahre Erfahrung",
-        },
+          value: "15+",          label: "Jahre Erfahrung"},
       ]}
       enableKpiAnimation={true}
       buttons={[
         {
-          text: "Jetzt Angebot anfordern",
-          href: "#contact",
-        },
+          text: "Jetzt Angebot anfordern",          href: "#contact"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/front-view-delivery-man-with-packagaes_23-2148684738.jpg"
       imageAlt="Trageprofi Team Baden-Baden"
-      mediaAnimation="slide-up"
+      mediaAnimation="blur-reveal"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/man-woman-with-boxes_23-2147694381.jpg",
-          alt: "Man and woman with boxes",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-woman-with-boxes_23-2147694381.jpg",          alt: "Man and woman with boxes"},
         {
-          src: "http://img.b2bpic.net/free-photo/close-up-delivery-man-with-boxes_23-2149035950.jpg",
-          alt: "Close up delivery man with boxes",
-        },
+          src: "http://img.b2bpic.net/free-photo/close-up-delivery-man-with-boxes_23-2149035950.jpg",          alt: "Close up delivery man with boxes"},
         {
-          src: "http://img.b2bpic.net/free-photo/person-presenting-their-job-resignation_23-2149445185.jpg",
-          alt: "Person presenting their job resignation",
-        },
+          src: "http://img.b2bpic.net/free-photo/person-presenting-their-job-resignation_23-2149445185.jpg",          alt: "Person presenting their job resignation"},
         {
-          src: "http://img.b2bpic.net/free-photo/front-view-smiley-man-holding-boxes_23-2148273279.jpg",
-          alt: "Front view smiley man holding boxes",
-        },
+          src: "http://img.b2bpic.net/free-photo/front-view-smiley-man-holding-boxes_23-2148273279.jpg",          alt: "Front view smiley man holding boxes"},
         {
-          src: "http://img.b2bpic.net/free-photo/front-view-delivery-man-with-packagaes_23-2148684738.jpg",
-          alt: "moving company team professional",
-        },
-      ]}
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Entrümpelung",
-        },
-        {
-          type: "text",
-          text: "Umzugsservice",
-        },
-        {
-          type: "text",
-          text: "Besenrein",
-        },
-        {
-          type: "text",
-          text: "Baden-Baden",
-        },
-        {
-          type: "text",
-          text: "Diskrete Abwicklung",
-        },
+          src: "http://img.b2bpic.net/free-photo/front-view-delivery-man-with-packagaes_23-2148684738.jpg",          alt: "moving company team professional"},
       ]}
     />
   </div>
@@ -136,73 +87,50 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Warum Trageprofi?"
       description={[
-        "Wir verstehen, dass ein Umzug oder eine Entrümpelung oft stressig ist. In Baden-Baden sind wir als Trageprofi Ihre erste Adresse für fachgerechte Unterstützung.",
-        "Unsere Experten arbeiten diskret, schnell und räumen auf, als wäre es ihr eigenes Zuhause.",
-      ]}
+        "Wir verstehen, dass ein Umzug oder eine Entrümpelung oft stressig ist. In Baden-Baden sind wir als Trageprofi Ihre erste Adresse für fachgerechte Unterstützung.",        "Unsere Experten arbeiten diskret, schnell und räumen auf, als wäre es ihr eigenes Zuhause."]}
       buttons={[
         {
-          text: "Über uns erfahren",
-          href: "#contact",
-        },
+          text: "Über uns erfahren",          href: "#contact"},
       ]}
+      buttonAnimation="slide-up"
     />
   </div>
 
   <div id="features" data-section="features">
       <FeatureCardOne
-      animationType="slide-up"
+      animationType="depth-3d"
       textboxLayout="split"
-      gridVariant="uniform-all-items-equal"
+      gridVariant="bento-grid"
       useInvertedBackground={false}
       features={[
         {
-          title: "Entrümpelung",
-          description: "Von der Garage bis zum Dachboden – wir machen Platz.",
-          imageSrc: "http://img.b2bpic.net/free-photo/courier-doing-jobs-logistics_23-2149229211.jpg",
-        },
+          title: "Entrümpelung",          description: "Von der Garage bis zum Dachboden – wir machen Platz.",          imageSrc: "http://img.b2bpic.net/free-photo/courier-doing-jobs-logistics_23-2149229211.jpg"},
         {
-          title: "Umzüge",
-          description: "Sicherer Transport von Möbeln und Hab und Gut.",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working_23-2148902557.jpg",
-        },
+          title: "Umzüge",          description: "Sicherer Transport von Möbeln und Hab und Gut.",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working_23-2148902557.jpg"},
         {
-          title: "Fachgerechte Entsorgung",
-          description: "Umweltbewusste Trennung und Entsorgung aller Materialien.",
-          imageSrc: "http://img.b2bpic.net/free-photo/sustainable-development-goals-still-life_23-2150196655.jpg",
-        },
+          title: "Fachgerechte Entsorgung",          description: "Umweltbewusste Trennung und Entsorgung aller Materialien.",          imageSrc: "http://img.b2bpic.net/free-photo/sustainable-development-goals-still-life_23-2150196655.jpg"},
       ]}
       title="Unsere Leistungen"
       description="Wir packen an, wo Sie Entlastung brauchen."
+      buttonAnimation="slide-up"
     />
   </div>
 
   <div id="metrics" data-section="metrics">
       <MetricCardOne
-      animationType="slide-up"
+      animationType="depth-3d"
       textboxLayout="split"
-      gridVariant="uniform-all-items-equal"
+      gridVariant="bento-grid"
       useInvertedBackground={false}
       metrics={[
         {
-          id: "m1",
-          value: "500+",
-          title: "Umzüge",
-          description: "Glückliche Kunden in Baden-Baden",
-          icon: Truck,
+          id: "m1",          value: "500+",          title: "Umzüge",          description: "Glückliche Kunden in Baden-Baden",          icon: Truck,
         },
         {
-          id: "m2",
-          value: "1200+",
-          title: "Entrümpelungen",
-          description: "Besenrein und sauber",
-          icon: Trash2,
+          id: "m2",          value: "1200+",          title: "Entrümpelungen",          description: "Besenrein und sauber",          icon: Trash2,
         },
         {
-          id: "m3",
-          value: "98%",
-          title: "Weiterempfehlung",
-          description: "Durch unsere Qualität überzeugt",
-          icon: ThumbsUp,
+          id: "m3",          value: "98%",          title: "Weiterempfehlung",          description: "Durch unsere Qualität überzeugt",          icon: ThumbsUp,
         },
       ]}
       title="Erfahrung, die zählt"
@@ -215,93 +143,47 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "1",
-          name: "Familie Müller",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-married-people-moving-rented-apartment-flat-starting-new-beginnings-future-feeling-positive-about-relocation-household-carrying-carton-containers-packages_482257-42552.jpg",
-        },
+          id: "1",          name: "Familie Müller",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-married-people-moving-rented-apartment-flat-starting-new-beginnings-future-feeling-positive-about-relocation-household-carrying-carton-containers-packages_482257-42552.jpg"},
         {
-          id: "2",
-          name: "Herr Schmidt",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-family-moving-into-new-home_23-2149196337.jpg",
-        },
+          id: "2",          name: "Herr Schmidt",          imageSrc: "http://img.b2bpic.net/free-photo/young-family-moving-into-new-home_23-2149196337.jpg"},
         {
-          id: "3",
-          name: "Frau Fischer",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-decorating-new-living-room_329181-243.jpg",
-        },
-        {
-          id: "4",
-          name: "Max B.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-young-latin-woman-unpacking-things-her-new-apartment-opening-carton-box_74855-10209.jpg",
-        },
-        {
-          id: "5",
-          name: "Anja K.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-couple-carrying-cardboard-boxes-new-home_329181-145.jpg",
-        },
+          id: "3",          name: "Frau Fischer",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-decorating-new-living-room_329181-243.jpg"},
       ]}
       cardTitle="Stimmen unserer Kunden"
       cardTag="Erfahrungsberichte"
-      cardAnimation="blur-reveal"
+      cardAnimation="slide-up"
     />
   </div>
 
   <div id="pricing" data-section="pricing">
       <PricingCardTwo
-      animationType="slide-up"
+      animationType="scale-rotate"
       textboxLayout="default"
       useInvertedBackground={false}
       plans={[
         {
-          id: "basic",
-          badge: "Small",
-          price: "ab 299€",
-          subtitle: "Kleine Entrümpelung",
-          buttons: [
+          id: "basic",          badge: "Small",          price: "Anfrage",          subtitle: "Kleine Entrümpelung",          buttons: [
             {
-              text: "Buchen",
-              href: "#contact",
-            },
+              text: "Buchen",              href: "#contact"},
           ],
           features: [
-            "1-2 Räume",
-            "Bis zu 2 Tonnen",
-            "Besenrein",
-          ],
+            "1-2 Räume",            "Bis zu 2 Tonnen",            "Besenrein"],
         },
         {
-          id: "standard",
-          badge: "Standard",
-          price: "ab 599€",
-          subtitle: "Kompletter Umzug",
-          buttons: [
+          id: "standard",          badge: "Standard",          price: "Anfrage",          subtitle: "Kompletter Umzug",          buttons: [
             {
-              text: "Buchen",
-              href: "#contact",
-            },
+              text: "Buchen",              href: "#contact"},
           ],
           features: [
-            "3 Zimmer Wohnung",
-            "Inkl. Transport",
-            "Versicherung inklusive",
-          ],
+            "3 Zimmer Wohnung",            "Inkl. Transport",            "Versicherung inklusive"],
         },
         {
-          id: "premium",
-          badge: "Full Service",
-          price: "Individuell",
-          subtitle: "Sorglos Paket",
-          buttons: [
+          id: "premium",          badge: "Full Service",          price: "Anfrage",          subtitle: "Sorglos Paket",          buttons: [
             {
-              text: "Beratung",
-              href: "#contact",
-            },
+              text: "Beratung",              href: "#contact"},
           ],
           features: [
-            "Kompletthaus",
-            "Entrümpelung & Reinigung",
-            "Priority Service",
-          ],
+            "Kompletthaus",            "Entrümpelung & Reinigung",            "Priority Service"],
         },
       ]}
       title="Faire Preise"
@@ -315,24 +197,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "q1",
-          title: "Wie schnell sind Termine möglich?",
-          content: "Meist innerhalb von 48 Stunden.",
-        },
+          id: "q1",          title: "Wie schnell sind Termine möglich?",          content: "Meist innerhalb von 48 Stunden."},
         {
-          id: "q2",
-          title: "Sind Sie versichert?",
-          content: "Selbstverständlich ist jeder Auftrag voll versichert.",
-        },
+          id: "q2",          title: "Sind Sie versichert?",          content: "Selbstverständlich ist jeder Auftrag voll versichert."},
         {
-          id: "q3",
-          title: "Bieten Sie auch Reinigung an?",
-          content: "Auf Wunsch bieten wir besenreine Übergabe.",
-        },
+          id: "q3",          title: "Bieten Sie auch Reinigung an?",          content: "Auf Wunsch bieten wir besenreine Übergabe."},
       ]}
       title="Häufige Fragen"
       description="Alles was Sie wissen müssen."
-      faqsAnimation="blur-reveal"
+      faqsAnimation="slide-up"
     />
   </div>
 
@@ -340,8 +213,7 @@ export default function LandingPage() {
       <ContactCenter
       useInvertedBackground={false}
       background={{
-        variant: "gradient-bars",
-      }}
+        variant: "plain"}}
       tag="Kontakt"
       title="Jetzt Angebot anfordern"
       description="Schreiben Sie uns oder rufen Sie an – wir melden uns umgehend bei Ihnen."
@@ -357,4 +229,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-libre-baskerville), serif;
+  font-family: var(--font-montserrat), sans-serif;
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #106EFB;
+  --background: #f0f4f8;
+  --card: #ffffff;
+  --foreground: #1a2b3c;
+  --primary-cta: #0056b3;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #e9ecef;
   --secondary-cta-text: #000612e6;
-  --accent: #e2e2e2;
-  --background-accent: #106EFB;
+  --accent: #d1d9e6;
+  --background-accent: #f8f9fa;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);