Update src/app/about/page.tsx

Merge version_2 into main

src/app/about/page.tsx

@@ -1,147 +1,119 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
 import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
-import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
-import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
-import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
-import Link from "next/link";
-import { Award, Gem } from "lucide-react";
+import TeamCardTen from "@/components/sections/team/TeamCardTen";
+import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+import { Sparkles, Users, Award, Briefcase } from "lucide-react";
 
 export default function AboutPage() {
   const navItems = [
     { name: "Home", id: "/" },
-    { name: "Services", id: "/services" },
     { name: "About", id: "/about" },
-    { name: "Contact", id: "/contact" },
-    { name: "Portfolio", id: "/portfolio" },
+    { name: "Services", id: "services" },
+    { name: "Contact", id: "contact" },
+  ];
+
+  const teamMembers = [
+    {
+      id: "1",      name: "Viktor Volkov",      imageSrc: "/placeholders/placeholder1.jpg",      imageAlt: "Viktor Volkov, Founder & Master Tailor"},
+    {
+      id: "2",      name: "Anastasia Petrov",      imageSrc: "/placeholders/placeholder2.jpg",      imageAlt: "Anastasia Petrov, Design Director"},
+    {
+      id: "3",      name: "Dmitri Sokolov",      imageSrc: "/placeholders/placeholder3.jpg",      imageAlt: "Dmitri Sokolov, Master Craftsman"},
+    {
+      id: "4",      name: "Elena Volkova",      imageSrc: "/placeholders/placeholder4.jpg",      imageAlt: "Elena Volkova, Head of Client Services"},
+  ];
+
+  const expertiseFeatures = [
+    {
+      title: "Precision Tailoring",      description: "Expert hand-stitching and machine work with attention to every detail for perfect fit and finish.",      icon: Award,
+      mediaItems: [
+        { imageSrc: "/placeholders/placeholder5.jpg", imageAlt: "Precision tailoring work" },
+        { imageSrc: "/placeholders/placeholder6.jpg", imageAlt: "Detailed stitching example" },
+      ] as [{ imageSrc: string; imageAlt: string }, { imageSrc: string; imageAlt: string }],
+    },
+    {
+      title: "Bespoke Design",      description: "Custom design consultation and creation tailored to your unique style, body type, and preferences.",      icon: Sparkles,
+      mediaItems: [
+        { imageSrc: "/placeholders/placeholder7.jpg", imageAlt: "Design consultation" },
+        { imageSrc: "/placeholders/placeholder8.jpg", imageAlt: "Fabric selection" },
+      ] as [{ imageSrc: string; imageAlt: string }, { imageSrc: string; imageAlt: string }],
+    },
+    {
+      title: "Premium Materials",      description: "Sourced from the finest mills and suppliers worldwide, ensuring quality and durability.",      icon: Briefcase,
+      mediaItems: [
+        { imageSrc: "/placeholders/placeholder9.jpg", imageAlt: "Premium fabric collection" },
+        { imageSrc: "/placeholders/placeholder10.jpg", imageAlt: "Material samples" },
+      ] as [{ imageSrc: string; imageAlt: string }, { imageSrc: string; imageAlt: string }],
+    },
+    {
+      title: "Expert Consultants",      description: "Our experienced team provides personalized guidance throughout the entire tailoring process.",      icon: Users,
+      mediaItems: [
+        { imageSrc: "/placeholders/placeholder11.jpg", imageAlt: "Team consultation" },
+        { imageSrc: "/placeholders/placeholder12.jpg", imageAlt: "Client meeting" },
+      ] as [{ imageSrc: string; imageAlt: string }, { imageSrc: string; imageAlt: string }],
+    },
   ];
 
   return (
     <ThemeProvider
-      defaultButtonVariant="icon-arrow"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="mediumLarge"
-      sizing="largeSizeMediumTitles"
-      background="noiseDiagonalGradient"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="flat"
-      secondaryButtonStyle="layered"
-      headingFontWeight="light"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="VOLGA"
-          bottomLeftText="Luxury Excellence"
-          bottomRightText="hello@volga.luxury"
-        />
-      </div>
-
-      <div id="about" data-section="about">
+      <NavbarStyleCentered
+        navItems={navItems}
+        button={{ text: "Get Started", href: "contact" }}
+        brandName="VOLGA"
+      />
+      
+      <div id="company-story" data-section="company-story">
         <MetricSplitMediaAbout
           tag="Our Story"
-          tagIcon={Award}
-          title="Crafting Excellence for Discerning Clientele"
-          description="At VOLGA, we specialize in elevating luxury brands through strategic innovation and meticulous execution. With over a decade of experience serving premium markets, we understand the unique demands of high-end clientele. Our approach combines timeless elegance with cutting-edge methodology to deliver transformative results."
+          tagIcon={Sparkles}
+          title="VOLGA: Tradition Meets Craftsmanship"
+          description="Founded with a passion for precision tailoring, VOLGA brings decades of European tailoring expertise to discerning clients. We believe that exceptional clothing begins with exceptional craftsmanship, personal attention, and an unwavering commitment to quality. Every garment we create tells a story of dedication, skill, and an uncompromising pursuit of perfection."
           metrics={[
-            {
-              value: "500+",
-              title: "Premium Brands Elevated",
-            },
-            {
-              value: "98%",
-              title: "Client Satisfaction Rate",
-            },
+            { value: "25+", title: "Years of Experience" },
+            { value: "1000+", title: "Satisfied Clients Worldwide" },
           ]}
-          imageSrc="http://img.b2bpic.net/free-photo/fiance-with-friends-drining-wedding-day-indoors_8353-12087.jpg?_wi=2"
-          imageAlt="VOLGA Team Excellence"
+          imageSrc="/placeholders/placeholder13.jpg"
+          imageAlt="VOLGA tailoring studio"
+          useInvertedBackground={false}
           mediaAnimation="slide-up"
           metricsAnimation="slide-up"
-          useInvertedBackground={true}
-          ariaLabel="About VOLGA - luxury brand excellence story"
         />
       </div>
 
-      <div id="features" data-section="features">
-        <FeatureCardOne
-          title="Premium Services Tailored for Luxury Brands"
-          description="Comprehensive solutions designed to elevate your brand presence and drive sustainable growth in the luxury market."
-          tag="Services"
-          tagIcon={Gem}
-          features={[
-            {
-              title: "Luxury Brand Strategy",
-              description:
-                "Develop compelling narratives and positioning that resonate with affluent audiences and establish market leadership.",
-              imageSrc:
-                "http://img.b2bpic.net/free-photo/corporate-associates-looking-into-project-details-timetables_482257-115638.jpg?_wi=3",
-              imageAlt: "Premium Brand Strategy Consulting",
-            },
-            {
-              title: "Exclusive Design Excellence",
-              description:
-                "Create sophisticated visual identities and premium experiences that reflect your brand's uncompromising standards.",
-              imageSrc:
-                "http://img.b2bpic.net/free-photo/technological-background-concept_23-2148882657.jpg?_wi=3",
-              imageAlt: "Luxury Design Services",
-            },
-            {
-              title: "High-End Marketing Solutions",
-              description:
-                "Execute precision-targeted campaigns that connect with your most valuable customers and amplify brand prestige.",
-              imageSrc:
-                "http://img.b2bpic.net/free-photo/focused-man-leader-explaining-management-project-using-monitor-working-company-meeting-office-roo_482257-2924.jpg?_wi=3",
-              imageAlt: "Luxury Marketing Excellence",
-            },
-          ]}
-          gridVariant="three-columns-all-equal-width"
-          animationType="slide-up"
+      <div id="team" data-section="team">
+        <TeamCardTen
+          title="Meet Our Master Craftspeople"
+          tag="Our Team"
+          members={teamMembers}
+          memberVariant="card"
+          useInvertedBackground={true}
+          membersAnimation="slide-up"
+        />
+      </div>
+
+      <div id="expertise" data-section="expertise">
+        <FeatureCardTwentyFive
+          features={expertiseFeatures}
+          title="Our Core Expertise"
+          description="Discover the craftsmanship and dedication that define VOLGA"
+          tag="Expertise"
           textboxLayout="default"
+          animationType="slide-up"
           useInvertedBackground={false}
-          ariaLabel="Premium services section"
-        />
-      </div>
-
-      <div id="metrics" data-section="metrics">
-        <MetricCardFourteen
-          title="Proven Impact for Premium Brands"
-          tag="Impact & Excellence"
-          metrics={[
-            {
-              id: "1",
-              value: "$2.3B",
-              description:
-                "Total revenue generated for luxury clients through strategic initiatives and premium positioning.",
-            },
-            {
-              id: "2",
-              value: "45%",
-              description:
-                "Average increase in brand value and market perception among luxury brands we've partnered with.",
-            },
-          ]}
-          tagAnimation="slide-up"
-          metricsAnimation="slide-up"
-          useInvertedBackground={true}
-          ariaLabel="Impact metrics section"
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoReveal
-          logoText="VOLGA"
-          leftLink={{
-            text: "Privacy Policy",
-            href: "#",
-          }}
-          rightLink={{
-            text: "Terms of Service",
-            href: "#",
-          }}
-          ariaLabel="Site footer"
         />
       </div>
     </ThemeProvider>

src/app/contact/page.tsx

@@ -1,106 +1,63 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
-import Link from "next/link";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+import ContactCenter from "@/components/sections/contact/ContactCenter";
+import { Mail, MapPin, Phone } from "lucide-react";
 
 export default function ContactPage() {
-  const navItems = [
-    { name: "Home", id: "/" },
-    { name: "Services", id: "/services" },
-    { name: "About", id: "/about" },
-    { name: "Contact", id: "/contact" },
-    { name: "Portfolio", id: "/portfolio" },
-  ];
-
-  const handleContactSubmit = (data: Record<string, string>) => {
-    console.log("Contact form submitted:", data);
-  };
-
   return (
     <ThemeProvider
-      defaultButtonVariant="icon-arrow"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="mediumLarge"
-      sizing="largeSizeMediumTitles"
-      background="noiseDiagonalGradient"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="flat"
-      secondaryButtonStyle="layered"
-      headingFontWeight="light"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="VOLGA"
-          bottomLeftText="Luxury Excellence"
-          bottomRightText="hello@volga.luxury"
-        />
-      </div>
-
-      <div id="contact" data-section="contact">
-        <ContactSplitForm
-          title="Begin Your Luxury Transformation"
-          description="Connect with our team to explore how VOLGA can elevate your premium brand and drive exceptional growth. We're ready to discuss your vision."
-          inputs={[
-            {
-              name: "name",
-              type: "text",
-              placeholder: "Your Name",
-              required: true,
-            },
-            {
-              name: "email",
-              type: "email",
-              placeholder: "Email Address",
-              required: true,
-            },
-            {
-              name: "company",
-              type: "text",
-              placeholder: "Company Name",
-              required: true,
-            },
-            {
-              name: "phone",
-              type: "tel",
-              placeholder: "Phone Number",
-              required: false,
-            },
-          ]}
-          textarea={{
-            name: "message",
-            placeholder: "Tell us about your luxury brand and vision...",
-            rows: 5,
-            required: true,
-          }}
+      <NavbarStyleCentered
+        navItems={[
+          { name: "Home", id: "/" },
+          { name: "Contact", id: "/contact" }
+        ]}
+        button={{ text: "Get Started", href: "/contact" }}
+        brandName="Webild"
+      />
+      <div className="pt-20">
+        <ContactCenter
+          tag="Get in Touch"
+          title="Contact Us"
+          description="We'd love to hear from you. Reach out to us with any questions or inquiries."
+          background={{ variant: "plain" }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/side-view-smiling-curly-woman-talking-by-phone_171337-16735.jpg?_wi=3"
-          imageAlt="VOLGA Luxury Consultation"
-          mediaAnimation="slide-up"
-          mediaPosition="right"
-          buttonText="Schedule Consultation"
-          onSubmit={handleContactSubmit}
-          ariaLabel="Contact form section"
+          onSubmit={(email) => console.log("Email submitted:", email)}
         />
       </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoReveal
-          logoText="VOLGA"
-          leftLink={{
-            text: "Privacy Policy",
-            href: "#",
-          }}
-          rightLink={{
-            text: "Terms of Service",
-            href: "#",
-          }}
-          ariaLabel="Site footer"
-        />
+      <div id="contact-info" data-section="contact-info" className="py-20 px-8">
+        <div className="max-w-4xl mx-auto">
+          <h2 className="text-3xl font-bold mb-12 text-center">Contact Information</h2>
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+            <div className="flex flex-col items-center text-center p-6 rounded-lg border border-accent/20">
+              <Mail className="w-8 h-8 mb-4 text-primary-cta" />
+              <h3 className="text-lg font-semibold mb-2">Email</h3>
+              <p className="text-foreground/75">contact@example.com</p>
+            </div>
+            <div className="flex flex-col items-center text-center p-6 rounded-lg border border-accent/20">
+              <Phone className="w-8 h-8 mb-4 text-primary-cta" />
+              <h3 className="text-lg font-semibold mb-2">Phone</h3>
+              <p className="text-foreground/75">+1 (555) 123-4567</p>
+            </div>
+            <div className="flex flex-col items-center text-center p-6 rounded-lg border border-accent/20">
+              <MapPin className="w-8 h-8 mb-4 text-primary-cta" />
+              <h3 className="text-lg font-semibold mb-2">Location</h3>
+              <p className="text-foreground/75">123 Main St, City, State 12345</p>
+            </div>
+          </div>
+        </div>
       </div>
     </ThemeProvider>
   );

src/app/layout.tsx

@@ -1,62 +1,29 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
-import { Inter } from "next/font/google";
-import { Nunito_Sans } from "next/font/google";
-import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
+import { Geist, Geist_Mono } from "next/font/google";
+import "./styles/base.css";
+import "./styles/variables.css";
 
-const halant = Halant({
-  variable: "--font-halant",
-  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
+const geist = Geist({
+  variable: "--font-geist-sans",  subsets: ["latin"],
 });
 
-const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
-});
-
-const nunitoSans = Nunito_Sans({
-  variable: "--font-nunito-sans",
-  subsets: ["latin"],
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",  subsets: ["latin"],
 });
 
 export const metadata: Metadata = {
-  title: "VOLGA - Premium Luxury Brand Excellence",
-  description: "Transform your luxury brand with VOLGA. Strategic consulting, exclusive design, and high-end marketing for discerning clientele.",
-  keywords: "luxury brand, premium consulting, exclusive design, high-end marketing, brand excellence, luxury strategy",
-  openGraph: {
-    title: "VOLGA - Luxury Brand Excellence",
-    description: "Elevate your premium brand through sophisticated strategy and exceptional design.",
-    siteName: "VOLGA",
-    type: "website",
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "VOLGA - Premium Luxury Brands",
-    description: "Transform your luxury brand with VOLGA's strategic excellence.",
-  },
-  robots: {
-    index: true,
-    follow: true,
-  },
-};
+  title: "Create Next App",  description: "Generated by create next app"};
 
 export default function RootLayout({
   children,
-}: Readonly<{
+}: {
   children: React.ReactNode;
-}>) {
+}) {
   return (
-    <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body
-          className={`${halant.variable} ${inter.variable} ${nunitoSans.variable} antialiased`}
-        >
-          <Tag />
-          {children}
-        
+    <html lang="en">
+      <body className={`${geist.variable} ${geistMono.variable}`}>
+        {children}
+      
         <script
           dangerouslySetInnerHTML={{
             __html: `
@@ -1424,7 +1391,6 @@ export default function RootLayout({
           }}
         />
       </body>
-      </ServiceWrapper>
     </html>
   );
 }

src/app/page.tsx

@@ -1,297 +1,39 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroSplitDualMedia from "@/components/sections/hero/HeroSplitDualMedia";
-import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
-import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
-import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
-import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
-import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
 import Link from "next/link";
-import { Sparkles, Award, Gem, MessageSquare } from "lucide-react";
 
 export default function HomePage() {
-  const navItems = [
-    { name: "Home", id: "/" },
-    { name: "Services", id: "/services" },
-    { name: "About", id: "about" },
-    { name: "Contact", id: "contact" },
-    { name: "Portfolio", id: "portfolio" },
-  ];
-
   return (
     <ThemeProvider
-      defaultButtonVariant="icon-arrow"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="mediumLarge"
-      sizing="largeSizeMediumTitles"
-      background="noiseDiagonalGradient"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="flat"
-      secondaryButtonStyle="layered"
-      headingFontWeight="light"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      {/* Navbar */}
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          brandName="VOLGA"
-          navItems={navItems}
-          bottomLeftText="Luxury Excellence"
-          bottomRightText="hello@volga.luxury"
-        />
-      </div>
-
-      {/* Hero Section */}
-      <div id="hero" data-section="hero">
-        <HeroSplitDualMedia
-          title="Elevate Your Luxury Brand Experience"
-          description="Discover how VOLGA transforms premium businesses through sophisticated strategy, exceptional design, and uncompromising excellence. We create pathways to success for discerning entrepreneurs and established luxury brands."
-          tag="Premium Excellence"
-          tagIcon={Sparkles}
-          background={{ variant: "plain" }}
-          buttons={[
-            {
-              text: "Explore Our Services",
-              href: "/services",
-            },
-            {
-              text: "Schedule Consultation",
-              href: "/contact",
-            },
-          ]}
-          buttonAnimation="slide-up"
-          mediaItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021819.jpg",
-              imageAlt: "VOLGA Premium Brand Showcase",
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-with-photo-camera_23-2148938488.jpg",
-              imageAlt: "Luxury Excellence Detail",
-            },
-          ]}
-          mediaAnimation="slide-up"
-          rating={5}
-          ratingText="Trusted by Leading Luxury Brands"
-          ariaLabel="Hero section - VOLGA luxury brand introduction"
-        />
-      </div>
-
-      {/* About Section */}
-      <div id="about" data-section="about">
-        <MetricSplitMediaAbout
-          tag="Our Story"
-          tagIcon={Award}
-          title="Crafting Excellence for Discerning Clientele"
-          description="At VOLGA, we specialize in elevating luxury brands through strategic innovation and meticulous execution. With over a decade of experience serving premium markets, we understand the unique demands of high-end clientele. Our approach combines timeless elegance with cutting-edge methodology to deliver transformative results."
-          metrics={[
-            {
-              value: "500+",
-              title: "Premium Brands Elevated",
-            },
-            {
-              value: "98%",
-              title: "Client Satisfaction Rate",
-            },
-          ]}
-          imageSrc="http://img.b2bpic.net/free-photo/fiance-with-friends-drining-wedding-day-indoors_8353-12087.jpg?_wi=1"
-          imageAlt="VOLGA Team Excellence"
-          mediaAnimation="slide-up"
-          metricsAnimation="slide-up"
-          useInvertedBackground={true}
-          ariaLabel="About VOLGA - luxury brand excellence story"
-        />
-      </div>
-
-      {/* Features Section */}
-      <div id="features" data-section="features">
-        <FeatureCardOne
-          title="Premium Services Tailored for Luxury Brands"
-          description="Comprehensive solutions designed to elevate your brand presence and drive sustainable growth in the luxury market."
-          tag="Services"
-          tagIcon={Gem}
-          features={[
-            {
-              title: "Luxury Brand Strategy",
-              description: "Develop compelling narratives and positioning that resonate with affluent audiences and establish market leadership.",
-              imageSrc: "http://img.b2bpic.net/free-photo/corporate-associates-looking-into-project-details-timetables_482257-115638.jpg?_wi=1",
-              imageAlt: "Premium Brand Strategy Consulting",
-            },
-            {
-              title: "Exclusive Design Excellence",
-              description: "Create sophisticated visual identities and premium experiences that reflect your brand's uncompromising standards.",
-              imageSrc: "http://img.b2bpic.net/free-photo/technological-background-concept_23-2148882657.jpg?_wi=1",
-              imageAlt: "Luxury Design Services",
-            },
-            {
-              title: "High-End Marketing Solutions",
-              description: "Execute precision-targeted campaigns that connect with your most valuable customers and amplify brand prestige.",
-              imageSrc: "http://img.b2bpic.net/free-photo/focused-man-leader-explaining-management-project-using-monitor-working-company-meeting-office-roo_482257-2924.jpg?_wi=1",
-              imageAlt: "Luxury Marketing Excellence",
-            },
-          ]}
-          gridVariant="three-columns-all-equal-width"
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          ariaLabel="Premium services section"
-        />
-      </div>
-
-      {/* Testimonials Section */}
-      <div id="testimonials" data-section="testimonials">
-        <TestimonialCardSix
-          title="Trusted by Industry Leaders"
-          description="Hear from distinguished clients who've experienced transformation through our premium services."
-          tag="Client Stories"
-          tagIcon={MessageSquare}
-          testimonials={[
-            {
-              id: "1",
-              name: "Victoria Sterling",
-              handle: "CEO, Sterling Luxuries",
-              testimonial: "VOLGA transformed our brand positioning in the luxury market. Their strategic insights and creative excellence are unparalleled.",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3267.jpg",
-              imageAlt: "Victoria Sterling",
-            },
-            {
-              id: "2",
-              name: "Alexander Laurent",
-              handle: "Director, Laurent Heritage",
-              testimonial: "Working with VOLGA elevated our entire brand experience. They understand luxury in ways most agencies simply cannot.",
-              imageSrc: "http://img.b2bpic.net/free-photo/business-people-using-digital-tablet-airport_107420-95868.jpg",
-              imageAlt: "Alexander Laurent",
-            },
-            {
-              id: "3",
-              name: "Margot Beaumont",
-              handle: "Founder, Beaumont Atelier",
-              testimonial: "From strategy to execution, VOLGA delivered exceptional results. They are our trusted luxury brand partner.",
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-priest-his-lunch-time_23-2149284678.jpg",
-              imageAlt: "Margot Beaumont",
-            },
-            {
-              id: "4",
-              name: "Christopher Ashford",
-              handle: "Chairman, Ashford & Co",
-              testimonial: "VOLGA's premium approach and meticulous attention to detail set them apart. Highly recommended for luxury brands.",
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg",
-              imageAlt: "Christopher Ashford",
-            },
-            {
-              id: "5",
-              name: "Isabelle Montague",
-              handle: "Creative Director, Montague Designs",
-              testimonial: "Exceptional partnership with VOLGA. They genuinely understand the nuances of premium market positioning.",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-bald-senior-dressed-stylish-suit-posing-against-dark-background_613910-17578.jpg",
-              imageAlt: "Isabelle Montague",
-            },
-            {
-              id: "6",
-              name: "Sebastian Ravenna",
-              handle: "Founder, Ravenna Collective",
-              testimonial: "VOLGA delivered uncompromising excellence. They're the premium choice for luxury brand development.",
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-businessman-with-hands-crossed-smiling_158595-3406.jpg",
-              imageAlt: "Sebastian Ravenna",
-            },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          speed={40}
-          topMarqueeDirection="left"
-          ariaLabel="Client testimonials section"
-        />
-      </div>
-
-      {/* Metrics Section */}
-      <div id="metrics" data-section="metrics">
-        <MetricCardFourteen
-          title="Proven Impact for Premium Brands"
-          tag="Impact & Excellence"
-          metrics={[
-            {
-              id: "1",
-              value: "$2.3B",
-              description: "Total revenue generated for luxury clients through strategic initiatives and premium positioning.",
-            },
-            {
-              id: "2",
-              value: "45%",
-              description: "Average increase in brand value and market perception among luxury brands we've partnered with.",
-            },
-          ]}
-          tagAnimation="slide-up"
-          metricsAnimation="slide-up"
-          useInvertedBackground={true}
-          ariaLabel="Impact metrics section"
-        />
-      </div>
-
-      {/* Contact Section */}
-      <div id="contact" data-section="contact">
-        <ContactSplitForm
-          title="Begin Your Luxury Transformation"
-          description="Connect with our team to explore how VOLGA can elevate your premium brand and drive exceptional growth. We're ready to discuss your vision."
-          inputs={[
-            {
-              name: "name",
-              type: "text",
-              placeholder: "Your Name",
-              required: true,
-            },
-            {
-              name: "email",
-              type: "email",
-              placeholder: "Email Address",
-              required: true,
-            },
-            {
-              name: "company",
-              type: "text",
-              placeholder: "Company Name",
-              required: true,
-            },
-            {
-              name: "phone",
-              type: "tel",
-              placeholder: "Phone Number",
-              required: false,
-            },
-          ]}
-          textarea={{
-            name: "message",
-            placeholder: "Tell us about your luxury brand and vision...",
-            rows: 5,
-            required: true,
-          }}
-          useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/side-view-smiling-curly-woman-talking-by-phone_171337-16735.jpg?_wi=1"
-          imageAlt="VOLGA Luxury Consultation"
-          mediaAnimation="slide-up"
-          mediaPosition="right"
-          buttonText="Schedule Consultation"
-          ariaLabel="Contact form section"
-        />
-      </div>
-
-      {/* Footer */}
-      <div id="footer" data-section="footer">
-        <FooterLogoReveal
-          logoText="VOLGA"
-          leftLink={{
-            text: "Privacy Policy",
-            href: "#",
-          }}
-          rightLink={{
-            text: "Terms of Service",
-            href: "#",
-          }}
-          ariaLabel="Site footer"
-        />
+      <NavbarStyleCentered
+        navItems={[
+          { name: "Home", id: "/" },
+          { name: "Contact", id: "/contact" }
+        ]}
+        button={{ text: "Get Started", href: "/contact" }}
+        brandName="Webild"
+      />
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="text-center">
+          <h1 className="text-4xl font-bold mb-4">Welcome to your site</h1>
+          <p className="text-lg mb-8">Theme updated to tailorLock</p>
+          <Link href="/services" className="text-blue-600 hover:underline">
+            View Services
+          </Link>
+        </div>
       </div>
     </ThemeProvider>
   );

src/app/services/page.tsx

@@ -1,129 +1,113 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
-import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
-import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
-import Link from "next/link";
-import { Gem, Sparkles } from "lucide-react";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
+import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
+import { Sparkles, Shield, Zap, Palette } from "lucide-react";
 
 export default function ServicesPage() {
   const navItems = [
     { name: "Home", id: "/" },
     { name: "Services", id: "/services" },
-    { name: "About", id: "/about" },
-    { name: "Contact", id: "/contact" },
-    { name: "Portfolio", id: "/portfolio" },
+  ];
+
+  const tailoringServices = [
+    {
+      icon: Palette,
+      title: "Custom Design",      description: "Tailored design solutions crafted specifically for your brand and vision."},
+    {
+      icon: Sparkles,
+      title: "Premium Tailoring",      description: "Expert craftsmanship with meticulous attention to every detail and stitch."},
+    {
+      icon: Shield,
+      title: "Quality Guaranteed",      description: "Only the finest materials and professional-grade techniques in every piece."},
+    {
+      icon: Zap,
+      title: "Quick Turnaround",      description: "Fast delivery without compromising on quality and craftsmanship excellence."},
+  ];
+
+  const testimonials = [
+    {
+      id: "1",      name: "Sarah Johnson",      role: "Fashion Designer",      company: "Elegant Designs Co.",      rating: 5,
+      imageSrc: "/placeholder.jpg"},
+    {
+      id: "2",      name: "Michael Chen",      role: "Brand Director",      company: "Luxury Fashion Group",      rating: 5,
+      imageSrc: "/placeholder.jpg"},
+    {
+      id: "3",      name: "Emma Rodriguez",      role: "Creative Director",      company: "Premium Apparel Inc.",      rating: 5,
+      imageSrc: "/placeholder.jpg"},
+  ];
+
+  const kpiItems = [
+    { value: "500+", label: "Projects Completed" },
+    { value: "98%", label: "Client Satisfaction" },
+    { value: "12+", label: "Years Experience" },
   ];
 
   return (
     <ThemeProvider
-      defaultButtonVariant="icon-arrow"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="mediumLarge"
-      sizing="largeSizeMediumTitles"
-      background="noiseDiagonalGradient"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="flat"
-      secondaryButtonStyle="layered"
-      headingFontWeight="light"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      {/* Navbar */}
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          brandName="VOLGA"
-          navItems={navItems}
-          bottomLeftText="Luxury Excellence"
-          bottomRightText="hello@volga.luxury"
-        />
-      </div>
+      <NavbarLayoutFloatingOverlay
+        navItems={navItems}
+        brandName="TailorLock"
+        button={{ text: "Get Started", href: "#contact" }}
+      />
 
-      {/* Services Features Section */}
-      <div id="features" data-section="features">
-        <FeatureCardOne
-          title="Our Premium Service Offerings"
-          description="Comprehensive, tailored solutions designed to elevate your luxury brand and drive measurable excellence in your market segment."
-          tag="Services"
-          tagIcon={Gem}
-          features={[
-            {
-              title: "Luxury Brand Strategy",              description: "Develop compelling narratives and positioning that resonate with affluent audiences and establish market leadership.",              imageSrc: "http://img.b2bpic.net/free-photo/corporate-associates-looking-into-project-details-timetables_482257-115638.jpg",              imageAlt: "Premium Brand Strategy Consulting"},
-            {
-              title: "Exclusive Design Excellence",              description: "Create sophisticated visual identities and premium experiences that reflect your brand's uncompromising standards.",              imageSrc: "http://img.b2bpic.net/free-photo/technological-background-concept_23-2148882657.jpg",              imageAlt: "Luxury Design Services"},
-            {
-              title: "High-End Marketing Solutions",              description: "Execute precision-targeted campaigns that connect with your most valuable customers and amplify brand prestige.",              imageSrc: "http://img.b2bpic.net/free-photo/focused-man-leader-explaining-management-project-using-monitor-working-company-meeting-office-roo_482257-2924.jpg",              imageAlt: "Luxury Marketing Excellence"},
-          ]}
-          gridVariant="three-columns-all-equal-width"
+      <div id="services" data-section="services" className="py-20">
+        <FeatureHoverPattern
+          features={tailoringServices}
+          title="Our Tailoring Services"
+          description="Discover our comprehensive range of professional tailoring services designed to bring your vision to life."
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
-          ariaLabel="Premium services section"
+          tag="Services"
         />
       </div>
 
-      {/* Impact Metrics Section */}
-      <div id="metrics" data-section="metrics">
-        <MetricCardFourteen
-          title="Why Choose VOLGA for Your Luxury Brand Transformation"
-          tag="Service Excellence"
-          metrics={[
-            {
-              id: "1",              value: "15+",              description: "Years of dedicated experience in premium brand development and luxury market positioning."},
-            {
-              id: "2",              value: "98%",              description: "Client retention rate demonstrating our commitment to long-term partnership and exceptional results."},
-          ]}
-          tagAnimation="slide-up"
-          metricsAnimation="slide-up"
-          useInvertedBackground={true}
-          ariaLabel="Service impact metrics"
-        />
+      <div id="gallery" data-section="gallery" className="py-20">
+        <div className="flex items-center justify-center">
+          <div className="text-center max-w-2xl">
+            <h2 className="text-4xl font-bold mb-4">Gallery of Work Samples</h2>
+            <p className="text-lg opacity-75 mb-8">
+              Explore our portfolio of expertly crafted pieces showcasing our tailoring excellence and attention to detail.
+            </p>
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
+              <div className="aspect-square bg-gradient-to-br from-primary-cta to-accent rounded-lg flex items-center justify-center">
+                <span className="text-white font-semibold">Sample 1</span>
+              </div>
+              <div className="aspect-square bg-gradient-to-br from-accent to-background-accent rounded-lg flex items-center justify-center">
+                <span className="text-white font-semibold">Sample 2</span>
+              </div>
+              <div className="aspect-square bg-gradient-to-br from-background-accent to-primary-cta rounded-lg flex items-center justify-center">
+                <span className="text-white font-semibold">Sample 3</span>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
 
-      {/* Contact Section */}
-      <div id="contact" data-section="contact">
-        <ContactSplitForm
-          title="Ready to Transform Your Brand?"
-          description="Schedule a consultation with our team to explore how our premium services can elevate your luxury brand to new heights of excellence and market impact."
-          inputs={[
-            {
-              name: "name",              type: "text",              placeholder: "Your Name",              required: true,
-            },
-            {
-              name: "email",              type: "email",              placeholder: "Email Address",              required: true,
-            },
-            {
-              name: "company",              type: "text",              placeholder: "Company Name",              required: true,
-            },
-            {
-              name: "phone",              type: "tel",              placeholder: "Phone Number",              required: false,
-            },
-          ]}
-          textarea={{
-            name: "message",            placeholder: "Tell us about your service needs and brand vision...",            rows: 5,
-            required: true,
-          }}
+      <div id="testimonials" data-section="testimonials" className="py-20">
+        <TestimonialCardSixteen
+          testimonials={testimonials}
+          kpiItems={kpiItems as [{ value: string; label: string }, { value: string; label: string }, { value: string; label: string }]}
+          title="What Our Clients Say"
+          description="Hear from our satisfied customers about their experience with our tailoring services."
+          animationType="slide-up"
+          textboxLayout="default"
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/side-view-smiling-curly-woman-talking-by-phone_171337-16735.jpg"
-          imageAlt="VOLGA Service Consultation"
-          mediaAnimation="slide-up"
-          mediaPosition="right"
-          buttonText="Schedule Consultation"
-          ariaLabel="Services contact form"
-        />
-      </div>
-
-      {/* Footer */}
-      <div id="footer" data-section="footer">
-        <FooterLogoReveal
-          logoText="VOLGA"
-          leftLink={{
-            text: "Privacy Policy",            href: "#"}}
-          rightLink={{
-            text: "Terms of Service",            href: "#"}}
-          ariaLabel="Site footer"
+          tag="Testimonials"
         />
       </div>
     </ThemeProvider>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #e3deea;
-  --card: #ffffff;
-  --foreground: #1f2027;
-  --primary-cta: #1f2027;
+  --background: #fffefe;
+  --card: #f6f7f4;
+  --foreground: #080908;
+  --primary-cta: #0e3a29;
   --primary-cta-text: #e3deea;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #e7eecd;
   --secondary-cta-text: #1f2027;
-  --accent: #627dc6;
-  --background-accent: #627dc6;
+  --accent: #35c18b;
+  --background-accent: #ecebe4;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);