Update src/app/page.tsx

Merge version_4 into main

src/app/about/page.tsx

@@ -91,15 +91,18 @@ export default function AboutPage() {
             {
               id: "1",              title: "Founded on Creativity",              description:
                 "Afrozarchives was born from a passion for motion design and visual storytelling. We started with a vision to transform how brands communicate through animation.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=4",              imageAlt: "Creative team collaboration"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=4",              imageAlt: "Creative team collaboration"
+            },
             {
               id: "2",              title: "Strategic Approach",              description:
                 "We don't just create beautiful animations; we craft strategic narratives that align with your business goals and drive measurable results for your brand.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=5",              imageAlt: "Strategic planning session"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=5",              imageAlt: "Strategic planning session"
+            },
             {
               id: "3",              title: "Collaborative Process",              description:
                 "Your vision is at the heart of everything we do. We work closely with you throughout the entire process to ensure your story is told exactly as intended.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=6",              imageAlt: "Team collaboration and feedback"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=6",              imageAlt: "Team collaboration and feedback"
+            },
           ]}
         />
       </div>
@@ -118,15 +121,18 @@ export default function AboutPage() {
             {
               id: "1",              title: "Excellence",              description:
                 "We are committed to delivering the highest quality motion design with attention to every detail and pixel-perfect execution.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=7",              imageAlt: "Excellence in design"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=7",              imageAlt: "Excellence in design"
+            },
             {
               id: "2",              title: "Innovation",              description:
                 "We continuously explore new techniques, tools, and storytelling methods to stay ahead of trends and deliver fresh, innovative solutions.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=8",              imageAlt: "Innovative technology"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=8",              imageAlt: "Innovative technology"
+            },
             {
               id: "3",              title: "Partnership",              description:
                 "We view every client as a partner. Your success is our success, and we're invested in delivering results that exceed your expectations.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=9",              imageAlt: "Client partnership"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=9",              imageAlt: "Client partnership"
+            },
           ]}
         />
       </div>
@@ -136,4 +142,4 @@ export default function AboutPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/contact/page.tsx

@@ -4,7 +4,7 @@ import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import ContactText from "@/components/sections/contact/ContactText";
-import FaqSplitText from "@/components/sections/faq/FaqSplitText";
+import FaqDouble from "@/components/sections/faq/FaqDouble";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
 export default function ContactPage() {
@@ -70,38 +70,45 @@ export default function ContactPage() {
           useInvertedBackground={false}
           buttons={[
             {
-              text: "Book a Discovery Call",              href: "https://calendly.com/afrozarchives/discovery"},
+              text: "Book a Discovery Call",              href: "https://calendly.com/afrozarchives/discovery"
+            },
             { text: "Email Us", href: "mailto:hello@afrozarchives.com" },
           ]}
         />
       </div>
 
       <div id="contact-faq" data-section="contact-faq">
-        <FaqSplitText
-          sideTitle="Common Questions"
-          sideDescription="Find answers to questions about our process and services"
-          textPosition="left"
+        <FaqDouble
+          title="Common Questions"
+          description="Find answers to questions about our process and services"
+          textboxLayout="default"
           useInvertedBackground={false}
           faqsAnimation="slide-up"
           faqs={[
             {
               id: "1",              title: "How do I get started?",              content:
-                "Simply reach out through our contact form or book a discovery call. We'll discuss your project goals, vision, and answer any questions you might have about our process."},
+                "Simply reach out through our contact form or book a discovery call. We'll discuss your project goals, vision, and answer any questions you might have about our process."
+            },
             {
               id: "2",              title: "What information should I have ready?",              content:
-                "It helps to have a clear understanding of your project goals, target audience, and any reference materials or inspiration. But don't worry—we guide you through the discovery process."},
+                "It helps to have a clear understanding of your project goals, target audience, and any reference materials or inspiration. But don't worry—we guide you through the discovery process."
+            },
             {
               id: "3",              title: "Do you offer consultations?",              content:
-                "Yes! We offer free discovery calls where we can discuss your project in depth, understand your needs, and provide recommendations and pricing tailored to your specific requirements."},
+                "Yes! We offer free discovery calls where we can discuss your project in depth, understand your needs, and provide recommendations and pricing tailored to your specific requirements."
+            },
             {
               id: "4",              title: "What's your typical response time?",              content:
-                "We typically respond to inquiries within 24 hours during business days. For urgent projects, let us know and we'll prioritize your request accordingly."},
+                "We typically respond to inquiries within 24 hours during business days. For urgent projects, let us know and we'll prioritize your request accordingly."
+            },
             {
               id: "5",              title: "Can you work with my existing team?",              content:
-                "Absolutely! We collaborate seamlessly with marketing teams, designers, and other creative professionals to ensure your project aligns with your broader initiatives."},
+                "Absolutely! We collaborate seamlessly with marketing teams, designers, and other creative professionals to ensure your project aligns with your broader initiatives."
+            },
             {
               id: "6",              title: "What's your cancellation policy?",              content:
-                "We're committed to your satisfaction. During the discovery phase, there's no commitment. Once we begin work, we have specific milestones and agreements in place. We're happy to discuss details during your consultation."},
+                "We're committed to your satisfaction. During the discovery phase, there's no commitment. Once we begin work, we have specific milestones and agreements in place. We're happy to discuss details during your consultation."
+            },
           ]}
         />
       </div>
@@ -111,4 +118,4 @@ export default function ContactPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/layout.tsx

@@ -1,44 +1,23 @@
 import type { Metadata } from "next";
-import { Archivo } from "next/font/google";
+import { Inter } from "next/font/google";
 import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
 
-const archivo = Archivo({
-  variable: "--font-archivo",  subsets: ["latin"],
+const inter = Inter({
+  variable: "--font-inter",  subsets: ["latin"],
 });
 
 export const metadata: Metadata = {
-  title: "Motion Design for Startups & Enterprise | Afrozarchives",  description: "Animated explainer videos and motion design that drive engagement and conversion. We help startups and enterprises establish emotional connections through creative storytelling.",  keywords: "motion design, animated explainers, video animation, product animation, explainer videos, brand storytelling, SaaS animation",  metadataBase: new URL("https://afrozarchives.com"),
-  alternates: {
-    canonical: "https://afrozarchives.com"},
-  openGraph: {
-    title: "Motion Design That Moves Markets | Afrozarchives",    description: "Creative animated explainers and motion design for startups and enterprise brands.",    siteName: "Afrozarchives",    type: "website",    images: [
-      {
-        url: "http://img.b2bpic.net/free-photo/technician-employs-ai-chatbot-pc-monitor-executing-programming-code_482257-120774.jpg",        alt: "Afrozarchives Motion Design Studio"},
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",    title: "Motion Design That Moves Markets | Afrozarchives",    description: "Creative animated explainers and motion design for startups and enterprise brands.",    images: ["http://img.b2bpic.net/free-photo/technician-employs-ai-chatbot-pc-monitor-executing-programming-code_482257-120774.jpg"],
-  },
-  robots: {
-    index: true,
-    follow: true,
-  },
+  title: "Afrozarchives - Motion Design Studio",  description: "Creative animated explainers and motion design that drive engagement and conversion"
 };
 
 export default function RootLayout({
   children,
-}: Readonly<{
+}: {
   children: React.ReactNode;
-}>) {
+}) {
   return (
-    <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body className={`${archivo.variable} antialiased`}>
-          <Tag />
-          {children}
-        
+    <html lang="en">
+      <body className={inter.variable}>{children}
         <script
           dangerouslySetInnerHTML={{
             __html: `
@@ -1406,7 +1385,6 @@ export default function RootLayout({
           }}
         />
       </body>
-      </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -3,7 +3,6 @@
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
 import AboutMetric from "@/components/sections/about/AboutMetric";
 import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
 import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
@@ -66,39 +65,6 @@ export default function HomePage() {
         />
       </div>
 
-      <div id="hero" data-section="hero">
-        <HeroSplitTestimonial
-          title="Motion Design That Moves Markets"
-          description="We help startups and enterprises establish emotional connections between products and customers through creative animated explainers that drive engagement and conversion"
-          tag=" "
-          tagAnimation="slide-up"
-          background={{ variant: "glowing-orb" }}
-          testimonials={[
-            {
-              name: "Sarah Chen",              handle: "Founder, TechFlow",              testimonial:
-                "Afrozarchives transformed our product launch with compelling motion design that resonated perfectly with our audience.",              rating: 5,
-              imageSrc:
-                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1",              imageAlt: "Sarah Chen founder portrait"},
-            {
-              name: "Marcus Johnson",              handle: "Marketing Director, Innovate Inc",              testimonial:
-                "The animated explainers we created with Afrozarchives increased our conversion rate by 40% in just one quarter.",              rating: 5,
-              imageSrc:
-                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2",              imageAlt: "Marcus Johnson director portrait"},
-          ]}
-          testimonialRotationInterval={5000}
-          imagePosition="right"
-          imageSrc="http://img.b2bpic.net/free-photo/technician-employs-ai-chatbot-pc-monitor-executing-programming-code_482257-120774.jpg"
-          imageAlt="Motion design animation studio workspace"
-          mediaAnimation="slide-up"
-          useInvertedBackground={false}
-          buttons={[
-            { text: "Start Your Project", href: "/contact" },
-            { text: "View Our Work", href: "/work" },
-          ]}
-          buttonAnimation="slide-up"
-        />
-      </div>
-
       <div id="about" data-section="about">
         <AboutMetric
           title="We believe motion design is the future of brand storytelling. At Afrozarchives, we combine artistic vision with strategic thinking to create animated explainers that elevate your brand above the noise."
@@ -127,15 +93,18 @@ export default function HomePage() {
             {
               id: "1",              title: "Explainer Videos",              description:
                 "Engaging animated explainers that communicate complex concepts with clarity and emotion, perfect for product launches and feature demonstrations.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=1",              imageAlt: "Animated explainer video example"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=1",              imageAlt: "Animated explainer video example"
+            },
             {
               id: "2",              title: "Brand Storytelling",              description:
                 "Compelling motion narratives that bring your brand story to life, creating emotional resonance with your target audience through visual motion design.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=2",              imageAlt: "Brand storytelling animation"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=2",              imageAlt: "Brand storytelling animation"
+            },
             {
               id: "3",              title: "Product Animation",              description:
                 "Custom animated demonstrations of your product features, showcasing functionality and benefits through fluid, engaging motion that drives conversion.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=3",              imageAlt: "Product animation showcase"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=3",              imageAlt: "Product animation showcase"
+            },
           ]}
         />
       </div>
@@ -151,11 +120,13 @@ export default function HomePage() {
             {
               id: "1",              name: "Sarah Chen",              role: "Founder & CEO",              company: "TechFlow",              rating: 5,
               imageSrc:
-                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3",              imageAlt: "Sarah Chen founder portrait"},
+                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3",              imageAlt: "Sarah Chen founder portrait"
+            },
             {
               id: "2",              name: "Marcus Johnson",              role: "Marketing Director",              company: "Innovate Inc",              rating: 5,
               imageSrc:
-                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4",              imageAlt: "Marcus Johnson director portrait"},
+                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4",              imageAlt: "Marcus Johnson director portrait"
+            },
           ]}
           kpiItems={[
             { value: "150+", label: "Projects Completed" },
@@ -183,4 +154,4 @@ export default function HomePage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/pricing/page.tsx

@@ -4,7 +4,7 @@ import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
-import FaqSplitText from "@/components/sections/faq/FaqSplitText";
+import FaqDouble from "@/components/sections/faq/FaqDouble";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 import { Sparkles } from "lucide-react";
 
@@ -72,52 +72,58 @@ export default function PricingPage() {
           animationType="slide-up"
           plans={[
             {
-              id: "standard",              price: "Starting at $4,500",              name: "Standard Package",              buttons: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
+              id: "standard",              badge: "Standard",              price: "Starting at $4,500",              name: "Perfect for small teams",              buttons: [
+                { text: "Get Started", href: "https://calendly.com/afrozarchives/discovery" }
               ],
               features: [
-                "Duration: up to 30 seconds",                "Script & storyboard assistance",                "Motion design & editing for one video",                "2 rounds of revisions",                "Delivery in standard formats",                "Creative consultation"],
+                "Duration: up to 30 seconds",                "Script & storyboard assistance",                "Motion design & editing for one video",                "2 rounds of revisions",                "Delivery in standard formats",                "Creative consultation"
+              ],
             },
             {
               id: "premium",              badge: "Most Popular",              badgeIcon: Sparkles,
-              price: "Starting at $12,000",              name: "Premium Package",              buttons: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
+              price: "Starting at $12,000",              name: "Perfect for growing companies",              buttons: [
+                { text: "Get Started", href: "https://calendly.com/afrozarchives/discovery" }
               ],
               features: [
-                "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"],
+                "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"
+              ],
             },
           ]}
         />
       </div>
 
       <div id="faq" data-section="faq">
-        <FaqSplitText
-          sideTitle="Your Questions, Answered"
-          sideDescription="Everything you need to know about working with Afrozarchives"
-          textPosition="left"
+        <FaqDouble
+          title="Your Questions, Answered"
+          description="Everything you need to know about working with Afrozarchives"
+          textboxLayout="default"
           useInvertedBackground={false}
           faqsAnimation="slide-up"
           faqs={[
             {
               id: "1",              title: "What's the difference between a standard and custom project?",              content:
-                "Standard projects follow a streamlined process with defined deliverables, perfect for one-off videos or smaller campaigns. Custom projects offer greater flexibility, multiple videos, extended revision support, and strategic input tailored to larger campaigns and long-term partnerships."},
+                "Standard projects follow a streamlined process with defined deliverables, perfect for one-off videos or smaller campaigns. Custom projects offer greater flexibility, multiple videos, extended revision support, and strategic input tailored to larger campaigns and long-term partnerships."
+            },
             {
               id: "2",              title: "How fast is the turnaround?",              content:
-                "Standard packages typically take 3-4 weeks from kickoff to delivery. Premium packages receive priority scheduling. Rush turnarounds are available for an additional fee. We'll discuss timeline specifics during your discovery call."},
+                "Standard packages typically take 3-4 weeks from kickoff to delivery. Premium packages receive priority scheduling. Rush turnarounds are available for an additional fee. We'll discuss timeline specifics during your discovery call."
+            },
             {
               id: "3",              title: "What types of video do you handle?",              content:
-                "We specialize in animated explainer videos, product demonstrations, brand storytelling, and feature animations. We work across industries and use various animation styles—from 2D motion graphics to character animation—depending on your vision and goals."},
+                "We specialize in animated explainer videos, product demonstrations, brand storytelling, and feature animations. We work across industries and use various animation styles—from 2D motion graphics to character animation—depending on your vision and goals."
+            },
             {
               id: "4",              title: "How many rounds of revisions are included?",              content:
-                "Standard packages include 2 rounds of revisions. Premium packages offer extended revision support for ongoing projects. We build in reasonable revision cycles to ensure your satisfaction while maintaining project momentum."},
+                "Standard packages include 2 rounds of revisions. Premium packages offer extended revision support for ongoing projects. We build in reasonable revision cycles to ensure your satisfaction while maintaining project momentum."
+            },
             {
               id: "5",              title: "Can I request a discovery call before committing?",              content:
-                "Absolutely! We encourage a free discovery call to discuss your project, goals, and creative vision. This helps us understand your needs and provide accurate pricing and timelines tailored to your specific requirements."},
+                "Absolutely! We encourage a free discovery call to discuss your project, goals, and creative vision. This helps us understand your needs and provide accurate pricing and timelines tailored to your specific requirements."
+            },
             {
               id: "6",              title: "What happens after delivery?",              content:
-                "You receive all video files in standard formats optimized for web, social media, and presentations. We also provide guidance on how to best utilize your animated content across your marketing channels for maximum impact."},
+                "You receive all video files in standard formats optimized for web, social media, and presentations. We also provide guidance on how to best utilize your animated content across your marketing channels for maximum impact."
+            },
           ]}
         />
       </div>
@@ -127,4 +133,4 @@ export default function PricingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/process/page.tsx

@@ -3,7 +3,6 @@
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import ProductCardOne from "@/components/sections/product/ProductCardOne";
 import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
@@ -63,25 +62,28 @@ export default function ProcessPage() {
       </div>
 
       <div id="process" data-section="process">
-        <ProductCardOne
+        <FeatureCardTwentySeven
           title="Our Process Explained"
           description="A transparent, collaborative approach that ensures your vision becomes reality"
           tag="How We Work"
           tagAnimation="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          gridVariant="uniform-all-items-equal"
           animationType="slide-up"
-          gridVariant="three-columns-all-equal-width"
-          products={[
+          features={[
             {
-              id: "1",              name: "Kickoff",              price: "Discuss your video goals and creative vision together",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=13",              imageAlt: "Project kickoff meeting"},
+              id: "1",              title: "Kickoff",              description: "Discuss your video goals and creative vision together",              imageSrc:
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=13",              imageAlt: "Project kickoff meeting"
+            },
             {
-              id: "2",              name: "Concept",              price: "Plan a script and storyboard with your ideas",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=14",              imageAlt: "Concept development phase"},
+              id: "2",              title: "Concept",              description: "Plan a script and storyboard with your ideas",              imageSrc:
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=14",              imageAlt: "Concept development phase"
+            },
             {
-              id: "3",              name: "Creation",              price: "Animate, revise, and deliver your finished video",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=15",              imageAlt: "Animation creation phase"},
+              id: "3",              title: "Creation",              description: "Animate, revise, and deliver your finished video",              imageSrc:
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=15",              imageAlt: "Animation creation phase"
+            },
           ]}
         />
       </div>
@@ -100,15 +102,18 @@ export default function ProcessPage() {
             {
               id: "1",              title: "Discovery & Strategy",              description:
                 "We start with understanding your brand, goals, and target audience. This foundation guides all creative decisions.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=16",              imageAlt: "Discovery phase"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=16",              imageAlt: "Discovery phase"
+            },
             {
               id: "2",              title: "Scripting & Storyboarding",              description:
                 "We craft compelling narratives and visual sequences that communicate your message with clarity and emotion.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=17",              imageAlt: "Storyboarding process"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=17",              imageAlt: "Storyboarding process"
+            },
             {
               id: "3",              title: "Animation Production",              description:
                 "Our team brings your story to life with fluid motion, sound design, and polish that showcases your brand.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=18",              imageAlt: "Animation production"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=18",              imageAlt: "Animation production"
+            },
           ]}
         />
       </div>
@@ -118,4 +123,4 @@ export default function ProcessPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/services/page.tsx

@@ -77,15 +77,18 @@ export default function ServicesPage() {
             {
               id: "1",              title: "Explainer Videos",              description:
                 "Engaging animated explainers that communicate complex concepts with clarity and emotion, perfect for product launches and feature demonstrations.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=10",              imageAlt: "Animated explainer video example"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=10",              imageAlt: "Animated explainer video example"
+            },
             {
               id: "2",              title: "Brand Storytelling",              description:
                 "Compelling motion narratives that bring your brand story to life, creating emotional resonance with your target audience through visual motion design.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=11",              imageAlt: "Brand storytelling animation"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=11",              imageAlt: "Brand storytelling animation"
+            },
             {
               id: "3",              title: "Product Animation",              description:
                 "Custom animated demonstrations of your product features, showcasing functionality and benefits through fluid, engaging motion that drives conversion.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=12",              imageAlt: "Product animation showcase"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=12",              imageAlt: "Product animation showcase"
+            },
           ]}
         />
       </div>
@@ -99,21 +102,21 @@ export default function ServicesPage() {
           animationType="slide-up"
           plans={[
             {
-              id: "standard",              price: "Starting at $4,500",              name: "Standard Package",              buttons: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
+              id: "standard",              badge: "Standard",              price: "Starting at $4,500",              name: "Perfect for small teams",              buttons: [
+                { text: "Get Started", href: "https://calendly.com/afrozarchives/discovery" }
               ],
               features: [
-                "Duration: up to 30 seconds",                "Script & storyboard assistance",                "Motion design & editing for one video",                "2 rounds of revisions",                "Delivery in standard formats",                "Creative consultation"],
+                "Duration: up to 30 seconds",                "Script & storyboard assistance",                "Motion design & editing for one video",                "2 rounds of revisions",                "Delivery in standard formats",                "Creative consultation"
+              ],
             },
             {
               id: "premium",              badge: "Most Popular",              badgeIcon: Sparkles,
-              price: "Starting at $12,000",              name: "Premium Package",              buttons: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
+              price: "Starting at $12,000",              name: "Perfect for growing companies",              buttons: [
+                { text: "Get Started", href: "https://calendly.com/afrozarchives/discovery" }
               ],
               features: [
-                "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"],
+                "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"
+              ],
             },
           ]}
         />
@@ -124,4 +127,4 @@ export default function ServicesPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/work/page.tsx

@@ -3,7 +3,7 @@
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
+import MetricCardTen from "@/components/sections/metrics/MetricCardTen";
 import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
@@ -63,7 +63,7 @@ export default function WorkPage() {
       </div>
 
       <div id="work" data-section="work">
-        <MetricCardEleven
+        <MetricCardTen
           title="Recent Client Work"
           description="Showcasing motion design excellence across diverse industries and brand narratives"
           textboxLayout="default"
@@ -71,14 +71,14 @@ export default function WorkPage() {
           animationType="slide-up"
           metrics={[
             {
-              id: "1",              value: "TechFlow",              title: "Product Launch Campaign",              description: "70-second animated explainer for SaaS platform",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=19",              imageAlt: "TechFlow product animation"},
+              id: "1",              title: "TechFlow",              subtitle: "Product Launch Campaign",              category: "SaaS",              value: "70-second explainer",              buttons: [{ text: "View Case Study", href: "#" }]
+            },
             {
-              id: "2",              value: "Innovate Inc",              title: "Feature Demonstration",              description: "Custom motion graphics for enterprise software",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=20",              imageAlt: "Innovate Inc feature demo"},
+              id: "2",              title: "Innovate Inc",              subtitle: "Feature Demonstration",              category: "Enterprise",              value: "Motion graphics",              buttons: [{ text: "View Case Study", href: "#" }]
+            },
             {
-              id: "3",              value: "StartupXYZ",              title: "Brand Story",              description: "90-second animated origin story and mission",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=21",              imageAlt: "StartupXYZ brand animation"},
+              id: "3",              title: "StartupXYZ",              subtitle: "Brand Story",              category: "Startup",              value: "90-second video",              buttons: [{ text: "View Case Study", href: "#" }]
+            },
           ]}
         />
       </div>
@@ -97,15 +97,18 @@ export default function WorkPage() {
             {
               id: "1",              title: "SaaS Product Launch",              description:
                 "A 60-second animated explainer that increased product launch engagement by 45% and drove qualified leads.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=22",              imageAlt: "SaaS product launch video"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=22",              imageAlt: "SaaS product launch video"
+            },
             {
               id: "2",              title: "Brand Documentary",              description:
                 "A 3-minute animated brand story that connected founders with their audience on an emotional level.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=23",              imageAlt: "Brand documentary animation"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=23",              imageAlt: "Brand documentary animation"
+            },
             {
               id: "3",              title: "Feature Animation Series",              description:
                 "A series of 30-second feature demonstrations that improved product adoption by 38% across the platform.",              imageSrc:
-                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=24",              imageAlt: "Feature animation series"},
+                "http://img.b2bpic.net/free-vector/bloggers-screen-collection_23-2148539660.jpg?_wi=24",              imageAlt: "Feature animation series"
+            },
           ]}
         />
       </div>
@@ -115,4 +118,4 @@ export default function WorkPage() {
       </div>
     </ThemeProvider>
   );
-}
+}