Update src/app/services/page.tsx

Merge version_1 into main

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() {
@@ -77,10 +77,10 @@ export default function ContactPage() {
       </div>
 
       <div id="contact-faq" data-section="contact-faq">
-        <FaqSplitText
+        <FaqDouble
-          sideTitle="Common Questions"
+          title="Common Questions"
-          sideDescription="Find answers to questions about our process and services"
+          description="Find answers to questions about our process and services"
-          textPosition="left"
+          textboxLayout="default"
           useInvertedBackground={false}
           faqsAnimation="slide-up"
           faqs={[

src/app/pricing/page.tsx

@@ -3,8 +3,8 @@
 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 PricingCardOne from "@/components/sections/pricing/PricingCardOne";
-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";
 
@@ -64,7 +64,7 @@ export default function PricingPage() {
       </div>
 
       <div id="pricing" data-section="pricing">
-        <PricingCardThree
+        <PricingCardOne
           title="Pricing Plans"
           description="Transparent pricing for every project size. Choose the perfect plan for your motion design needs."
           textboxLayout="default"
@@ -72,20 +72,12 @@ export default function PricingPage() {
           animationType="slide-up"
           plans={[
             {
-              id: "standard",              price: "Starting at $4,500",              name: "Standard Package",              buttons: [
+              id: "standard",              badge: "Standard",              price: "Starting at $4,500",              subtitle: "Perfect for small teams",              features: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
-              ],
-              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"],
             },
             {
               id: "premium",              badge: "Most Popular",              badgeIcon: Sparkles,
-              price: "Starting at $12,000",              name: "Premium Package",              buttons: [
+              price: "Starting at $12,000",              subtitle: "Perfect for growing companies",              features: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
-              ],
-              features: [
                 "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"],
             },
           ]}
@@ -93,10 +85,10 @@ export default function PricingPage() {
       </div>
 
       <div id="faq" data-section="faq">
-        <FaqSplitText
+        <FaqDouble
-          sideTitle="Your Questions, Answered"
+          title="Your Questions, Answered"
-          sideDescription="Everything you need to know about working with Afrozarchives"
+          description="Everything you need to know about working with Afrozarchives"
-          textPosition="left"
+          textboxLayout="default"
           useInvertedBackground={false}
           faqsAnimation="slide-up"
           faqs={[

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,24 +62,24 @@ 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"
+          features={[
-          products={[
             {
-              id: "1",              name: "Kickoff",              price: "Discuss your video goals and creative vision together",              imageSrc:
+              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:
+              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:
+              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"},
           ]}
         />

src/app/services/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 FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
-import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
+import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 import { Sparkles } from "lucide-react";
 
@@ -91,7 +91,7 @@ export default function ServicesPage() {
       </div>
 
       <div id="pricing" data-section="pricing">
-        <PricingCardThree
+        <PricingCardOne
           title="Service Pricing"
           description="Transparent pricing for every project size. Choose the perfect plan for your motion design needs."
           textboxLayout="default"
@@ -99,20 +99,12 @@ export default function ServicesPage() {
           animationType="slide-up"
           plans={[
             {
-              id: "standard",              price: "Starting at $4,500",              name: "Standard Package",              buttons: [
+              id: "standard",              badge: "Standard",              price: "Starting at $4,500",              subtitle: "Perfect for small teams",              features: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
-              ],
-              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"],
             },
             {
               id: "premium",              badge: "Most Popular",              badgeIcon: Sparkles,
-              price: "Starting at $12,000",              name: "Premium Package",              buttons: [
+              price: "Starting at $12,000",              subtitle: "Perfect for growing companies",              features: [
-                { text: "Get Started", href: "/contact" },
-                { text: "Learn More", href: "#" },
-              ],
-              features: [
                 "Everything in Standard, plus",                "Multiple videos or ongoing series",                "Brand and campaign strategy input",                "High-impact execution",                "Priority turnaround",                "Extended revision support"],
             },
           ]}