Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -13,7 +13,11 @@ import FaqBase from "@/components/sections/faq/FaqBase";
 import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterBase from "@/components/sections/footer/FooterBase";
 import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
-import { Sparkles, Search, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Lock, Phone, MessageCircle, BookOpen, Tv, Camera, Music, Settings, Award, Users } from "lucide-react";
+import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
+import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
+import BlogCardOne from "@/components/sections/blog/BlogCardOne";
+import FeatureCardEight from "@/components/sections/feature/FeatureCardEight";
+import { Sparkles, Search, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Lock, Phone, MessageCircle, BookOpen, Tv, Camera, Music, Settings, Award, Users, DollarSign, Newspaper, Lightbulb, PenTool, Target, Bot, Globe } from "lucide-react";
 
 export default function WebAgency2Page() {
   return (
@@ -35,8 +39,14 @@ export default function WebAgency2Page() {
           navItems={[
             { name: "Work", id: "work" },
             { name: "Services", id: "services" },
+            { name: "What We Do", id: "what-we-do" },
+            { name: "Our Approach", id: "our-approach" },
+            { name: "AI System", id: "growthscale-system" },
+            { name: "Why Us", id: "why-growthscale" },
+            { name: "Pricing", id: "pricing" },
             { name: "About", id: "about" },
-            { name: "Contact", id: "contact" },
+            { name: "Blog", id: "blog" },
+            { name: "Contact", id: "contact" }
           ]}
           button={{ text: "Get a Quote", href: "#contact" }}
         />
@@ -68,6 +78,76 @@ export default function WebAgency2Page() {
           ]}
           carouselItemClassName="!aspect-[4/5]"
         />
+        <SocialProofOne
+          title="Trusted by Industry Leaders"
+          description="Our AI-powered strategies consistently deliver results for top brands across various sectors."
+          tag="Our Partners"
+          names={["TechInnovate", "FutureSolutions", "GlobalReach", "DataMinds", "PioneerSystems", "CloudForge"]}
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+        <div id="what-we-do" data-section="what-we-do">
+          <FeatureBento
+            title="What We Do: AI-Powered Digital Solutions"
+            description="Our comprehensive suite of services leverages cutting-edge AI to drive measurable results and transform your digital presence."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            features={[
+              {
+                title: "AI-Driven Strategy",                description: "Crafting personalized digital strategies with predictive AI analytics.",                bentoComponent: "reveal-icon",                icon: Lightbulb
+              },
+              {
+                title: "Performance Marketing",                description: "Optimizing campaigns for maximum ROI using AI-powered targeting and automation.",                bentoComponent: "reveal-icon",                icon: TrendingUp
+              },
+              {
+                title: "Creative & Content",                description: "Generating engaging, data-driven content and designs with AI assistance.",                bentoComponent: "reveal-icon",                icon: PenTool
+              }
+            ]}
+          />
+        </div>
+        <div id="our-approach" data-section="our-approach">
+          <FeatureCardEight
+            title="Our Approach: Precision, Innovation, Results"
+            description="We follow a systematic, AI-enhanced methodology to ensure every step of your digital journey is optimized for success."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+              {
+                title: "1. Discover & Analyze",                description: "Leverage AI to deeply understand your market, audience, and competitive landscape.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?_wi=1",                imageAlt: "Discovery and Analysis with AI"
+              },
+              {
+                title: "2. Strategize & Plan",                description: "Develop bespoke AI-powered strategies tailored to your unique business goals.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?_wi=2",                imageAlt: "Strategy and Planning with AI"
+              },
+              {
+                title: "3. Execute & Optimize",                description: "Implement campaigns with agile methods and continuous AI-driven optimization.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?_wi=3",                imageAlt: "Execution and Optimization with AI"
+              },
+              {
+                title: "4. Grow & Scale",                description: "Drive sustainable growth and scale your business with measurable, data-backed results.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?_wi=4",                imageAlt: "Growth and Scaling with AI"
+              }
+            ]}
+          />
+        </div>
+        <div id="growthscale-system" data-section="growthscale-system">
+          <FeatureBento
+            title="The GrowthScale AI System: A Blueprint for Digital Mastery"
+            description="Our proprietary AI-powered system integrates strategy, technology, and analytics for a holistic approach to accelerate your growth."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            features={[
+              {
+                title: "Integrated AI System",                description: "Our proprietary system provides a holistic approach to digital growth.",                bentoComponent: "3d-card-grid",                centerIcon: Globe,
+                items: [
+                  { name: "AI Core Analytics", icon: Target },
+                  { name: "Intelligent Automation", icon: Bot },
+                  { name: "Predictive Strategy", icon: Lightbulb },
+                  { name: "Scalable Execution", icon: Zap }
+                ]
+              }
+            ]}
+          />
+        </div>
         <div id="services" data-section="services">
         <FeatureBento
           title="Our AI-Powered Digital Marketing Solutions"
@@ -110,13 +190,13 @@ export default function WebAgency2Page() {
           cardClassName="!h-auto aspect-video"
           features={[
             {
-              title: "E-commerce Conversion Boost",              description: "Increased sales by 40% using AI-driven personalization.",              imageSrc: "http://img.b2bpic.net/free-photo/glowing-warning-triangle-with-digital-distortion-black-background_84443-91300.jpg",              imageAlt: "E-commerce dashboard showing significant sales growth.",              buttonIcon: ArrowUpRight,
+              title: "E-commerce Conversion Boost",              description: "Increased sales by 40% using AI-driven personalization.",              imageSrc: "http://img.b2bpic.net/free-photo/glowing-warning-triangle-with-digital-distortion-black-background_84443-91300.jpg?_wi=1",              imageAlt: "E-commerce dashboard showing significant sales growth.",              buttonIcon: ArrowUpRight,
               buttonHref: "#"},
             {
-              title: "SaaS Lead Generation",              description: "Generated 30% more qualified leads with AI-optimized campaigns.",              imageSrc: "http://img.b2bpic.net/free-photo/dollar-money-bubble-speech-sign-symbol-icon-3d-rendering_56104-1923.jpg",              imageAlt: "SaaS analytics showing a surge in lead generation.",              buttonIcon: ArrowUpRight,
+              title: "SaaS Lead Generation",              description: "Generated 30% more qualified leads with AI-optimized campaigns.",              imageSrc: "http://img.b2bpic.net/free-photo/dollar-money-bubble-speech-sign-symbol-icon-3d-rendering_56104-1923.jpg?_wi=1",              imageAlt: "SaaS analytics showing a surge in lead generation.",              buttonIcon: ArrowUpRight,
               buttonHref: "#"},
             {
-              title: "Content Marketing Automation",              description: "Automated content creation, boosting engagement by 25%.",              imageSrc: "http://img.b2bpic.net/free-photo/enthusiastic-woman-showing-money-cash-smiling-got-loan-micro-credit-standing-delighted-against-w_1258-88159.jpg",              imageAlt: "Content marketing platform displaying high engagement rates.",              buttonIcon: ArrowUpRight,
+              title: "Content Marketing Automation",              description: "Automated content creation, boosting engagement by 25%.",              imageSrc: "http://img.b2bpic.net/free-photo/enthusiastic-woman-showing-money-cash-smiling-got-loan-micro-credit-standing-delighted-against-w_1258-88159.jpg?_wi=1",              imageAlt: "Content marketing platform displaying high engagement rates.",              buttonIcon: ArrowUpRight,
               buttonHref: "#"},
             {
               title: "Brand Awareness Campaign",              description: "Achieved 2x brand reach through intelligent social media ads.",              imageSrc: "http://img.b2bpic.net/free-photo/letter-e-made-green-grass-isolated-white_169016-56958.jpg",              imageAlt: "Social media analytics showing increased brand reach and impressions.",              buttonIcon: ArrowUpRight,
@@ -127,6 +207,35 @@ export default function WebAgency2Page() {
           ]}
         />
         </div>
+        <div id="pricing" data-section="pricing">
+          <PricingCardTwo
+            title="Flexible AI Pricing Plans"
+            description="Choose a plan that scales with your business, from foundational AI marketing to comprehensive growth strategies."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            plans={[
+              {
+                id: "starter",                badge: "Starter",                badgeIcon: DollarSign,
+                price: "$499/mo",                subtitle: "Foundational AI Marketing",                buttons: [{ text: "Start Free Trial", href: "#contact" }],
+                features: [
+                  "Basic AI SEO Audit",                  "Automated Social Posting",                  "Email Marketing Templates",                  "Standard Analytics Dashboard"],
+              },
+              {
+                id: "pro",                badge: "Pro",                badgeIcon: Sparkles,
+                price: "$1299/mo",                subtitle: "Accelerated Growth Package",                buttons: [{ text: "Choose Pro", href: "#contact" }],
+                features: [
+                  "Advanced AI SEO & SEM",                  "Personalized Content Generation",                  "Conversion Rate Optimization (CRO)",                  "Predictive Analytics & Reporting",                  "Dedicated AI Strategist"],
+              },
+              {
+                id: "enterprise",                badge: "Enterprise",                badgeIcon: Award,
+                price: "Custom",                subtitle: "Tailored AI Solutions",                buttons: [{ text: "Contact for Quote", href: "#contact" }],
+                features: [
+                  "Custom AI Model Development",                  "Full-Scale Automation Integrations",                  "AI-Powered Market Research",                  "24/7 Priority Support",                  "Dedicated Data Science Team"],
+              },
+            ]}
+          />
+        </div>
         <div id="about" data-section="about">
         <FeatureBento
           title="The GrowthScale AI Advantage"
@@ -169,7 +278,7 @@ export default function WebAgency2Page() {
               ],
             },
             {
-              title: "Predictive AI Growth Analytics",              description: "Harness the power of AI to anticipate market trends, identify growth opportunities, and continually refine your strategy for future success.",              bentoComponent: "line-chart"},
+              title: "Predictive AI Growth Analytics",              description: "Harness the power of AI to anticipate market trends, identify growth opportunities and continually refine your strategy for future success.",              bentoComponent: "line-chart"},
           ]}
         />
         </div>
@@ -197,21 +306,23 @@ export default function WebAgency2Page() {
             { id: "years", value: "50%+", title: "Average ROI Increase", description: "Driving significant returns through AI strategies.", icon: TrendingUp },
           ]}
         />
-        <FeatureCardSixteen
-          title="Why Choose GrowthScale AI?"
-          description="Partner with us to experience the transformative power of AI in your digital marketing, avoiding common pitfalls and achieving true growth."
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          negativeCard={{
-            items: [
-              "Generic strategies without AI insights",              "Ineffective campaigns with wasted ad spend",              "Fragmented data and missed growth opportunities",              "Outdated tactics yielding minimal ROI",              "Lack of continuous optimization and predictive analysis"],
-          }}
-          positiveCard={{
-            items: [
-              "Custom AI strategies for precision targeting",              "Maximized ROI with intelligent campaign management",              "Unified data platforms and actionable AI insights",              "Cutting-edge AI tools for sustained competitive advantage",              "Proactive optimization and predictive growth modeling"],
-          }}
-        />
+        <div id="why-growthscale" data-section="why-growthscale">
+          <FeatureCardSixteen
+            title="Why GrowthScale AI: Your Partner for Unrivaled Digital Success"
+            description="We stand apart by blending human expertise with the precision and power of artificial intelligence, delivering what traditional agencies can't."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            negativeCard={{
+              items: [
+                "Generic strategies without AI insights",              "Ineffective campaigns with wasted ad spend",              "Fragmented data and missed growth opportunities",              "Outdated tactics yielding minimal ROI",              "Lack of continuous optimization and predictive analysis"],
+            }}
+            positiveCard={{
+              items: [
+                "Custom AI strategies for precision targeting",              "Maximized ROI with intelligent campaign management",              "Unified data platforms and actionable AI insights",              "Cutting-edge AI tools for sustained competitive advantage",              "Proactive optimization and predictive growth modeling"],
+            }}
+          />
+        </div>
         <TeamCardFive
           title="Meet the AI Minds Behind Your Growth"
           description="Our team of AI strategists, data scientists, and marketing experts are dedicated to propelling your business forward."
@@ -239,6 +350,23 @@ export default function WebAgency2Page() {
             { id: "5", title: "What industries does GrowthScale AI serve?", content: "We work with a diverse range of industries, adapting our AI-powered strategies to meet unique business challenges and opportunities, from e-commerce to B2B SaaS and more." },
           ]}
         />
+        <div id="blog" data-section="blog">
+          <BlogCardOne
+            title="Latest AI Marketing Insights"
+            description="Stay ahead of the curve with our expert articles on artificial intelligence, digital marketing trends, and business growth strategies."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            blogs={[
+              {
+                id: "blog-1",                category: "AI Strategy",                title: "The Future of SEO: How AI is Reshaping Search Rankings",                excerpt: "Explore the transformative impact of artificial intelligence on search engine optimization and what it means for your business.",                imageSrc: "http://img.b2bpic.net/free-photo/glowing-warning-triangle-with-digital-distortion-black-background_84443-91300.jpg?_wi=2",                imageAlt: "AI brain with search icon",                authorName: "Anya Sharma",                authorAvatar: "http://img.b2bpic.net/free-photo/lgbtq-pride-flag-with-woman-rsquo-s-hand-raising_53876-129559.jpg",                date: "May 2, 2024"},
+              {
+                id: "blog-2",                category: "Content Marketing",                title: "Mastering Personalized Content with AI: A Step-by-Step Guide",                excerpt: "Learn how to leverage AI to create highly personalized content that resonates with your audience and drives engagement.",                imageSrc: "http://img.b2bpic.net/free-photo/dollar-money-bubble-speech-sign-symbol-icon-3d-rendering_56104-1923.jpg?_wi=2",                imageAlt: "AI writing content on laptop",                authorName: "Chloe Dubois",                authorAvatar: "http://img.b2bpic.net/free-photo/letter-m-made-real-natural-flowers-leaves-white-background-isolated_169016-54172.jpg",                date: "April 28, 2024"},
+              {
+                id: "blog-3",                category: "Data Analytics",                title: "Predictive Analytics for Digital Marketers: Unlocking Future Growth",                excerpt: "Discover how predictive AI analytics can help you anticipate market trends and make data-driven decisions for sustainable growth.",                imageSrc: "http://img.b2bpic.net/free-photo/enthusiastic-woman-showing-money-cash-smiling-got-loan-micro-credit-standing-delighted-against-w_1258-88159.jpg?_wi=2",                imageAlt: "Data scientist analyzing AI models",                authorName: "Liam Gallagher",                authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3khvwf",                date: "April 20, 2024"},
+            ]}
+          />
+        </div>
         <div id="contact" data-section="contact">
         <ContactCTA
           tag="Partner with AI for Growth"
@@ -260,16 +388,19 @@ export default function WebAgency2Page() {
             {
               title: "Company",              items: [
                 { label: "About Us", href: "#about" },
-                { label: "Our Solutions", href: "#services" },                { label: "Case Studies", href: "#work" },
+                { label: "Our Solutions", href: "#services" },
+                { label: "Pricing", href: "#pricing" },
+                { label: "Case Studies", href: "#work" },
+                { label: "Blog", href: "#blog" },
                 { label: "Contact", href: "#contact" },
               ],
             },
             {
               title: "Services",              items: [
-                { label: "AI SEO", href: "#" },
-                { label: "AI Web Development", href: "#" },
-                { label: "AI Branding", href: "#" },
-                { label: "Predictive Analytics", href: "#" },
+                { label: "AI SEO", href: "#services" },
+                { label: "AI Web Development", href: "#services" },
+                { label: "AI Branding", href: "#services" },
+                { label: "Predictive Analytics", href: "#services" },
               ],
             },
             {

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #0a0a0a;
-  --card: #161616;
-  --foreground: #f0f0f0;
-  --primary-cta: #ffffff;
+  --background: #000000;
+  --card: #0c0c0c;
+  --foreground: #ffffff;
+  --primary-cta: #cee7ff;
   --primary-cta-text: #0a0a0a;
-  --secondary-cta: #1e1e1e;
+  --secondary-cta: #000000;
   --secondary-cta-text: #e0e0e0;
-  --accent: #d0d0d0;
-  --background-accent: #9a9a9a;
+  --accent: #535353;
+  --background-accent: #CEE7FF;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);