Update src/app/styles/variables.css

Merge version_1 into main

src/app/page.tsx

@@ -3,15 +3,15 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
-import FooterCard from '@/components/sections/footer/FooterCard';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
+import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
-import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
+import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
 import { Github, Globe, Linkedin, Rocket, Sparkles, Twitter, Users } from "lucide-react";
 
 export default function LandingPage() {
@@ -93,19 +93,22 @@ export default function LandingPage() {
   </div>
 
   <div id="pricing" data-section="pricing">
-      <PricingCardOne
-      animationType="depth-3d"
+      <PricingCardThree
+      animationType="blur-reveal"
       textboxLayout="default"
       useInvertedBackground={true}
       plans={[
         {
-          id: "basic",          badge: "Entry",          price: "$5,000",          subtitle: "For early-stage startups",          features: ["Brand Identity", "Landing Page", "Basic Analytics"],
+          id: "basic",          badge: "Entry",          price: "$5,000",          name: "Startup",          buttons: [{ text: "Get Started" }],
+          features: ["Brand Identity", "Landing Page", "Basic Analytics"],
         },
         {
-          id: "pro",          badge: "Scale",          price: "$15,000",          subtitle: "For growing enterprises",          features: ["Full Web App", "AI Integration", "Priority Support"],
+          id: "pro",          badge: "Scale",          price: "$15,000",          name: "Growth",          buttons: [{ text: "Scale Up" }],
+          features: ["Full Web App", "AI Integration", "Priority Support"],
         },
         {
-          id: "ultra",          badge: "Visionary",          price: "$45,000",          subtitle: "For market leaders",          features: ["Custom Blockchain", "Global Cloud", "Full Service Team"],
+          id: "ultra",          badge: "Visionary",          price: "$45,000",          name: "Enterprise",          buttons: [{ text: "Build Vision" }],
+          features: ["Custom Blockchain", "Global Cloud", "Full Service Team"],
         },
       ]}
       title="Tailored Solutions"
@@ -153,21 +156,16 @@ export default function LandingPage() {
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardSix
-      animationType="slide-up"
+      <TestimonialCardTen
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "1",          name: "Alex Rivet",          handle: "@rivet",          testimonial: "Nexus delivered an incredible experience.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ea8ojl"},
+          id: "1",          title: "Incredible",          quote: "Nexus delivered an incredible experience.",          name: "Alex Rivet",          role: "Founder",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ea8ojl"},
         {
-          id: "2",          name: "Sarah Chen",          handle: "@sarah",          testimonial: "Pure genius in every line of code.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=axhplm"},
+          id: "2",          title: "Genius",          quote: "Pure genius in every line of code.",          name: "Sarah Chen",          role: "CTO",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=axhplm"},
         {
-          id: "3",          name: "Mark Jones",          handle: "@jones",          testimonial: "The best design agency I have worked with.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a7eixx"},
-        {
-          id: "4",          name: "Emily P.",          handle: "@emilyp",          testimonial: "Future-ready solutions for our needs.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xrxnt7"},
-        {
-          id: "5",          name: "David Wu",          handle: "@dwu",          testimonial: "Exceptional communication and execution.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=n25ylb"},
+          id: "3",          title: "Best Ever",          quote: "The best design agency I have worked with.",          name: "Mark Jones",          role: "CEO",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a7eixx"},
       ]}
       title="Client Perspectives"
       description="What industry leaders say about our work."
@@ -175,25 +173,22 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactCTA
       useInvertedBackground={true}
-      background={{
-        variant: "gradient-bars"}}
+      background={{ variant: "sparkles-gradient" }}
       tag="CONTACT US"
       title="Build Your Vision"
       description="Let's create the next big thing together."
-      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=fmsgu9"
-      mediaAnimation="blur-reveal"
+      buttons={[{ text: "Get Started" }]}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterCard
+      <FooterBaseCard
       logoText="NEXUS"
-      socialLinks={[
-        { icon: Twitter, href: "https://x.com", ariaLabel: "Twitter" },
-        { icon: Github, href: "https://github.com", ariaLabel: "Github" },
-        { icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
+      columns={[
+        { title: "Agency", items: [{ label: "Home", href: "#" }, { label: "Work", href: "#work" }] },
+        { title: "Services", items: [{ label: "Web", href: "#services" }, { label: "Design", href: "#services" }] }
       ]}
     />
   </div>

src/app/styles/variables.css

@@ -12,12 +12,12 @@
 
   --background: #0a0a0a;
   --card: #121212;
-  --foreground: #ffffff;
-  --primary-cta: #00f2ff;
+  --foreground: #f5f5f5;
+  --primary-cta: #ffffff;
   --primary-cta-text: #000000;
-  --secondary-cta: #7000ff;
+  --secondary-cta: #333333;
   --secondary-cta-text: #ffffff;
-  --accent: #00f2ff;
+  --accent: #00ff9d;
   --background-accent: #1a1a1a;
 
   /* text sizing - set by ThemeProvider */