Update theme colors

Merge version_12 into main

src/app/page.tsx

@@ -7,10 +7,11 @@ import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwent
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 import HeroBillboard from '@/components/sections/hero/HeroBillboard';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
+import TeamCardOne from '@/components/sections/team/TeamCardOne';
 import { Award, CheckCircle, Shield, Zap } from "lucide-react";
 
 export default function LandingPage() {
@@ -29,88 +30,58 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarLayoutFloatingInline
       navItems={[
         {
-          name: "Home",
+          name: "Home",          id: "hero"},
-          id: "hero",
-        },
         {
-          name: "Services",
+          name: "Services",          id: "features"},
-          id: "features",
-        },
         {
-          name: "Case Studies",
+          name: "Case Studies",          id: "testimonials"},
-          id: "testimonials",
-        },
         {
-          name: "Contact",
+          name: "Contact",          id: "contact"},
-          id: "contact",
-        },
       ]}
       brandName="VertexLabs"
+      button={{ text: "Get Started", href: "#contact" }}
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroBillboard
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       title="Scaling Global Tech Infrastructure"
       description="We architect high-performance software ecosystems for enterprises aiming for exponential growth."
       buttons={[
         {
-          text: "Consult With Experts",
+          text: "Consult With Experts",          href: "#contact"},
-          href: "#contact",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/digital-blue-hud-interface-laptop-concept_53876-15831.jpg"
       mediaAnimation="blur-reveal"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139320.jpg",
+          src: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139320.jpg",          alt: "Executive 1"},
-          alt: "Executive 1",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/programmer-developing-software-large-computer-screen_53876-101149.jpg",
+          src: "http://img.b2bpic.net/free-photo/programmer-developing-software-large-computer-screen_53876-101149.jpg",          alt: "Executive 2"},
-          alt: "Executive 2",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/futuristic-time-machine_23-2151599416.jpg",
+          src: "http://img.b2bpic.net/free-photo/futuristic-time-machine_23-2151599416.jpg",          alt: "Executive 3"},
-          alt: "Executive 3",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139360.jpg",
+          src: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139360.jpg",          alt: "Executive 4"},
-          alt: "Executive 4",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/digital-blue-hud-interface-laptop-concept_53876-15831.jpg",
+          src: "http://img.b2bpic.net/free-photo/digital-blue-hud-interface-laptop-concept_53876-15831.jpg",          alt: "Executive 5"},
-          alt: "Executive 5",
-        },
       ]}
       avatarText="Trusted by 500+ global tech leaders"
       marqueeItems={[
         {
-          type: "text",
+          type: "text",          text: "Cloud Architecture"},
-          text: "Cloud Architecture",
-        },
         {
-          type: "text",
+          type: "text",          text: "Predictive AI"},
-          text: "Predictive AI",
-        },
         {
-          type: "text",
+          type: "text",          text: "DevSecOps"},
-          text: "DevSecOps",
-        },
         {
-          type: "text",
+          type: "text",          text: "Data Engineering"},
-          text: "Data Engineering",
-        },
         {
-          type: "text",
+          type: "text",          text: "Cybersecurity"},
-          text: "Cybersecurity",
-        },
       ]}
     />
   </div>
@@ -128,6 +99,22 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="team" data-section="team">
+      <TeamCardOne 
+        title="Our Leadership"
+        description="Meet the experts steering our vision."
+        textboxLayout="default"
+        gridVariant="three-columns-all-equal-width"
+        animationType="slide-up"
+        useInvertedBackground={false}
+        members={[
+            { id: "1", name: "Game", role: "CEO", imageSrc: "https://img.b2bpic.net/free-photo/smiling-young-man-with-crossed-arms_1142-261.jpg" },
+            { id: "2", name: "Oh", role: "CTO", imageSrc: "https://img.b2bpic.net/free-photo/portrait-successful-man-having-stubble-posing-with-folded-arms-looking-camera_171337-12643.jpg" },
+            { id: "3", name: "Rung", role: "Design Director", imageSrc: "https://img.b2bpic.net/free-photo/thoughtful-woman-with-her-hand-near-face_1142-259.jpg" }
+        ]}
+      />
+  </div>
+
   <div id="features" data-section="features">
       <FeatureCardTwentyOne
       useInvertedBackground={true}
@@ -135,20 +122,11 @@ export default function LandingPage() {
       description="Our suite of services covers the entire product development lifecycle, from concept to global deployment."
       accordionItems={[
         {
-          id: "a1",
+          id: "a1",          title: "Scalable Cloud Architecture",          content: "Robust cloud strategies tailored for multi-region performance."},
-          title: "Scalable Cloud Architecture",
-          content: "Robust cloud strategies tailored for multi-region performance.",
-        },
         {
-          id: "a2",
+          id: "a2",          title: "Predictive AI Systems",          content: "Machine learning models designed for real-world impact and automation."},
-          title: "Predictive AI Systems",
-          content: "Machine learning models designed for real-world impact and automation.",
-        },
         {
-          id: "a3",
+          id: "a3",          title: "DevSecOps Integration",          content: "Seamless deployment pipelines with security at the core."},
-          title: "DevSecOps Integration",
-          content: "Seamless deployment pipelines with security at the core.",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139229.jpg"
       mediaAnimation="slide-up"
@@ -162,23 +140,14 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "m1",
+          id: "m1",          icon: Award,
-          icon: Award,
+          title: "Years Experience",          value: "12+"},
-          title: "Years Experience",
-          value: "12+",
-        },
         {
-          id: "m2",
+          id: "m2",          icon: CheckCircle,
-          icon: CheckCircle,
+          title: "Projects Completed",          value: "150+"},
-          title: "Projects Completed",
-          value: "150+",
-        },
         {
-          id: "m3",
+          id: "m3",          icon: Shield,
-          icon: Shield,
+          title: "Security Patches",          value: "500+"},
-          title: "Security Patches",
-          value: "500+",
-        },
       ]}
       title="Measurable Impact"
       description="Tangible results across every project phase."
@@ -193,25 +162,15 @@ export default function LandingPage() {
       author="Sarah Chen, VP Engineering at CloudScale"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/smiling-female-staff-airport-terminal_107420-85049.jpg",
+          src: "http://img.b2bpic.net/free-photo/smiling-female-staff-airport-terminal_107420-85049.jpg",          alt: "Sarah Chen"},
-          alt: "Sarah Chen",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/upbeat-saleswoman-hired-explain-vehicle-pricing-options-clients_482257-118422.jpg",
+          src: "http://img.b2bpic.net/free-photo/upbeat-saleswoman-hired-explain-vehicle-pricing-options-clients_482257-118422.jpg",          alt: "Director 1"},
-          alt: "Director 1",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-smiling-waitress_107420-12307.jpg",
+          src: "http://img.b2bpic.net/free-photo/portrait-smiling-waitress_107420-12307.jpg",          alt: "Manager 1"},
-          alt: "Manager 1",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/businesswoman-glasses-portrait_1262-1461.jpg",
+          src: "http://img.b2bpic.net/free-photo/businesswoman-glasses-portrait_1262-1461.jpg",          alt: "Lead 1"},
-          alt: "Lead 1",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/close-up-shot-successful-beautiful-confident-senior-businesswoman-her-fifties-with-gray-hair-blue-wise-eyes-posing-indoors-keeping-arms-folded-looking-with-charming-smile_344912-1851.jpg",
+          src: "http://img.b2bpic.net/free-photo/close-up-shot-successful-beautiful-confident-senior-businesswoman-her-fifties-with-gray-hair-blue-wise-eyes-posing-indoors-keeping-arms-folded-looking-with-charming-smile_344912-1851.jpg",          alt: "Executive 1"},
-          alt: "Executive 1",
-        },
       ]}
       ratingAnimation="blur-reveal"
       avatarsAnimation="blur-reveal"
@@ -223,14 +182,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       names={[
-        "AlphaTech",
+        "AlphaTech",        "BetaSystems",        "GammaCloud",        "DeltaInnovate",        "EpsilonSoft",        "ZetaGrid",        "EtaPulse"]}
-        "BetaSystems",
-        "GammaCloud",
-        "DeltaInnovate",
-        "EpsilonSoft",
-        "ZetaGrid",
-        "EtaPulse",
-      ]}
       title="Trusted by Leaders"
       description="Collaborating with global innovators."
     />
@@ -240,8 +192,7 @@ export default function LandingPage() {
       <ContactSplit
       useInvertedBackground={true}
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       tag="Get in Touch"
       title="Architecting the Future"
       description="Ready to scale your next major initiative? Let's discuss your roadmap."
@@ -255,29 +206,19 @@ export default function LandingPage() {
       logoText="VertexLabs"
       columns={[
         {
-          title: "Company",
+          title: "Company",          items: [
-          items: [
             {
-              label: "About",
+              label: "About",              href: "#about"},
-              href: "#about",
-            },
             {
-              label: "Careers",
+              label: "Careers",              href: "#"},
-              href: "#",
-            },
           ],
         },
         {
-          title: "Resources",
+          title: "Resources",          items: [
-          items: [
             {
-              label: "Blog",
+              label: "Blog",              href: "#"},
-              href: "#",
-            },
             {
-              label: "Guides",
+              label: "Guides",              href: "#"},
-              href: "#",
-            },
           ],
         },
       ]}
@@ -286,4 +227,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
+  --background: #f5faff;
-  --card: #0c0c0c;
+  --card: #f1f8ff;
-  --foreground: #ffffff;
+  --foreground: #001122;
-  --primary-cta: #106EFB;
+  --primary-cta: #15479c;
-  --primary-cta-text: #ffffff;
+  --primary-cta-text: #f5faff;
-  --secondary-cta: #000000;
+  --secondary-cta: #ffffff;
-  --secondary-cta-text: #ffffff;
+  --secondary-cta-text: #001122;
-  --accent: #535353;
+  --accent: #02a420;
-  --background-accent: #106EFB;
+  --background-accent: #006704;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);