Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,14 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import FaqBase from '@/components/sections/faq/FaqBase';
-import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
+import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
-import FooterBase from '@/components/sections/footer/FooterBase';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
-import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
+import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
+import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
 
 export default function LandingPage() {
   return (
@@ -30,21 +30,13 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Paths",
+          name: "Paths",          id: "#paths"},
-          id: "#paths",
-        },
         {
-          name: "Launch",
+          name: "Launch",          id: "#launch"},
-          id: "#launch",
-        },
         {
-          name: "Earnings",
+          name: "Earnings",          id: "#earnings"},
-          id: "#earnings",
-        },
         {
-          name: "FAQ",
+          name: "FAQ",          id: "#faq"},
-          id: "#faq",
-        },
       ]}
       brandName="GameStart Academy"
     />
@@ -53,260 +45,129 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroBillboardGallery
       background={{
-        variant: "sparkles-gradient",
+        variant: "sparkles-gradient"}}
-      }}
       title="Turn Your Gaming Passion Into a Business"
       description="Stop just playing—start earning. Whether you're a streamer, competitor, or developer, we provide the blueprints to launch your dream gaming career."
       tag="LEVEL UP NOW"
       buttons={[
         {
-          text: "Start Today",
+          text: "Start Today",          href: "#launch"},
-          href: "#launch",
-        },
         {
-          text: "View Pathways",
+          text: "View Pathways",          href: "#paths"},
-          href: "#paths",
-        },
       ]}
       mediaItems={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-half-closed-dark-with-colourful-glow-cup-coffee-glasses_169016-33896.jpg?_wi=1",
+          imageSrc: "http://img.b2bpic.net/free-photo/laptop-half-closed-dark-with-colourful-glow-cup-coffee-glasses_169016-33896.jpg?_wi=1",          imageAlt: "Professional gaming setup"},
-          imageAlt: "Professional gaming setup",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-winning-videogame_23-2149349981.jpg?_wi=1",
+          imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-winning-videogame_23-2149349981.jpg?_wi=1",          imageAlt: "Esports arena"},
-          imageAlt: "Esports arena",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/man-using-gaming-keyboard-fly-spaceship-sf-videogame-close-up_482257-121693.jpg?_wi=1",
+          imageSrc: "http://img.b2bpic.net/free-photo/man-using-gaming-keyboard-fly-spaceship-sf-videogame-close-up_482257-121693.jpg?_wi=1",          imageAlt: "Competitive gaming"},
-          imageAlt: "Competitive gaming",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-half-closed-dark-with-colourful-glow-cup-coffee-glasses_169016-33896.jpg?_wi=2",
-          imageAlt: "Neon desk setup",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-winning-videogame_23-2149349981.jpg?_wi=2",
-          imageAlt: "Tournament stage",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/man-using-gaming-keyboard-fly-spaceship-sf-videogame-close-up_482257-121693.jpg?_wi=2",
-          imageAlt: "Pro gamer focus",
-        },
       ]}
       mediaAnimation="blur-reveal"
     />
   </div>
 
   <div id="paths" data-section="paths">
-      <FeatureCardMedia
+      <FeatureCardTwentyNine
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="split"
       useInvertedBackground={false}
-      features={[
-        {
-          id: "f1",
-          title: "Game Streaming",
-          description: "Play, record, and build an audience on Twitch or YouTube. Best for beginners.",
-          tag: "Content Creation",
-          imageSrc: "http://img.b2bpic.net/free-photo/gen-z-influencer-advertising-product-presenting-impressive-virtual-reality-headset-subscribers_482257-81848.jpg",
-        },
-        {
-          id: "f2",
-          title: "Competitive Esports",
-          description: "Compete in professional tournaments. High skill, high reward.",
-          tag: "Pro Level",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-sporty-man-wearing-sportswear-headband-with-gold-medal-around-neck-showing-his-trophy-happy-excited-looking-it_141793-37495.jpg",
-        },
-        {
-          id: "f3",
-          title: "Game Development",
-          description: "Build your own world using Unreal or Unity. The creator's path.",
-          tag: "Development",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269896.jpg",
-        },
-        {
-          id: "f4",
-          title: "Gaming Services",
-          description: "Offer coaching, boosting, or tournament organization to others.",
-          tag: "Professional Services",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-streamer-winning-shooting-video-games-tournament-celebrating-success-online-live-stream-cheerful-person-feeling-happy-about-action-gameplay-championship-win-computer_482257-41448.jpg",
-        },
-      ]}
       title="Choose Your Gaming Path"
       description="Select the business model that fits your skill level and interests."
+      gridVariant="three-columns-all-equal-width"
+      features={[
+        {
+          title: "Game Streaming",          description: "Play, record, and build an audience on Twitch or YouTube. Best for beginners.",          imageSrc: "http://img.b2bpic.net/free-photo/gen-z-influencer-advertising-product-presenting-impressive-virtual-reality-headset-subscribers_482257-81848.jpg",          titleIconSrc: "",          buttonText: "Get Started"
+        },
+        {
+          title: "Competitive Esports",          description: "Compete in professional tournaments. High skill, high reward.",          imageSrc: "http://img.b2bpic.net/free-photo/young-sporty-man-wearing-sportswear-headband-with-gold-medal-around-neck-showing-his-trophy-happy-excited-looking-it_141793-37495.jpg",          titleIconSrc: "",          buttonText: "Get Started"
+        },
+        {
+          title: "Game Development",          description: "Build your own world using Unreal or Unity. The creator's path.",          imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269896.jpg",          titleIconSrc: "",          buttonText: "Get Started"
+        }
+      ]}
     />
   </div>
 
   <div id="launch" data-section="launch">
-      <MetricCardSeven
+      <MetricCardEleven
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="split"
       useInvertedBackground={true}
-      metrics={[
-        {
-          id: "m1",
-          value: "1",
-          title: "Hardware",
-          items: [
-            "PC or Smartphone",
-            "Stable Internet",
-            "Good Mic",
-          ],
-        },
-        {
-          id: "m2",
-          value: "2",
-          title: "Setup",
-          items: [
-            "Social Media Page",
-            "Stream Overlay",
-            "Editing Tools",
-          ],
-        },
-        {
-          id: "m3",
-          value: "3",
-          title: "Growth",
-          items: [
-            "Daily Uploads",
-            "Consistent Streams",
-            "Networking",
-          ],
-        },
-      ]}
       title="Launch Essentials"
       description="The basic toolkit every gamer needs to get started."
+      metrics={[
+        {
+          id: "m1",          value: "1",          title: "Hardware",          description: "PC or Smartphone, Stable Internet, Good Mic.",          imageSrc: "http://img.b2bpic.net/free-photo/laptop-half-closed-dark-with-colourful-glow-cup-coffee-glasses_169016-33896.jpg?_wi=1"
+        },
+        {
+          id: "m2",          value: "2",          title: "Setup",          description: "Social Media Page, Stream Overlay, Editing Tools.",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-winning-videogame_23-2149349981.jpg?_wi=1"
+        },
+        {
+          id: "m3",          value: "3",          title: "Growth",          description: "Daily Uploads, Consistent Streams, Networking.",          imageSrc: "http://img.b2bpic.net/free-photo/man-using-gaming-keyboard-fly-spaceship-sf-videogame-close-up_482257-121693.jpg?_wi=1"
+        }
+      ]}
     />
   </div>
 
   <div id="earnings" data-section="earnings">
-      <PricingCardOne
+      <PricingCardNine
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="split"
       useInvertedBackground={false}
-      plans={[
-        {
-          id: "p1",
-          badge: "Active",
-          price: "Ad Revenue",
-          subtitle: "Monetize views",
-          features: [
-            "YouTube AdSense",
-            "Twitch Subs",
-            "Donations",
-          ],
-        },
-        {
-          id: "p2",
-          badge: "Elite",
-          price: "Sponsorships",
-          subtitle: "Partner with brands",
-          features: [
-            "Brand deals",
-            "Affiliate links",
-            "Endorsements",
-          ],
-        },
-        {
-          id: "p3",
-          badge: "Professional",
-          price: "Direct Services",
-          subtitle: "Sell your expertise",
-          features: [
-            "Game Coaching",
-            "Boosting Services",
-            "Tournament Entry",
-          ],
-        },
-      ]}
       title="Monetization Models"
       description="How professional gamers turn their skills into recurring income."
+      plans={[
+        {
+          id: "p1",          title: "Ad Revenue",          price: "Monetize",          period: "Views",          features: ["YouTube AdSense", "Twitch Subs", "Donations"],
+          button: { text: "Learn More" }
+        },
+        {
+          id: "p2",          title: "Sponsorships",          price: "Brand",          period: "Deals",          features: ["Brand deals", "Affiliate links", "Endorsements"],
+          button: { text: "Learn More" }
+        },
+        {
+          id: "p3",          title: "Direct Services",          price: "Expert",          period: "Consult",          features: ["Game Coaching", "Boosting Services", "Tournament Entry"],
+          button: { text: "Learn More" }
+        }
+      ]}
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitText
+      <FaqBase
-      useInvertedBackground={true}
       faqs={[
-        {
+        { id: "q1", title: "How long until I earn money?", content: "Expect 3-6 months of consistent effort to see growth. It's a marathon, not a sprint." },
-          id: "q1",
+        { id: "q2", title: "Can I start with no money?", content: "Absolutely! Start with your smartphone and free tools until you earn your first stream revenue." },
-          title: "How long until I earn money?",
+        { id: "q3", title: "What games should I play?", content: "Pick ONE game you love and master it, rather than playing dozens randomly." }
-          content: "Expect 3-6 months of consistent effort to see growth. It's a marathon, not a sprint.",
-        },
-        {
-          id: "q2",
-          title: "Can I start with no money?",
-          content: "Absolutely! Start with your smartphone and free tools until you earn your first stream revenue.",
-        },
-        {
-          id: "q3",
-          title: "What games should I play?",
-          content: "Pick ONE game you love and master it, rather than playing dozens randomly.",
-        },
       ]}
-      sideTitle="Your Questions, Answered"
+      title="Your Questions, Answered"
-      faqsAnimation="slide-up"
+      description="Everything you need to know about starting your gaming career."
+      faqsAnimation="blur-reveal"
+      textboxLayout="split"
+      useInvertedBackground={true}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCTA
+      <ContactCenter
-      useInvertedBackground={false}
-      background={{
-        variant: "sparkles-gradient",
-      }}
       tag="GET PERSONALIZED HELP"
       title="Need a Personal Plan?"
       description="Tell us your preferred games and budget, and we'll craft your custom growth strategy."
-      buttons={[
+      useInvertedBackground={false}
-        {
+      background={{ variant: "sparkles-gradient" }}
-          text: "Contact Our Team",
+      buttonText="Submit Inquiry"
-          href: "#footer",
-        },
-      ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
+      <FooterMedia
-      columns={[
-        {
-          title: "Business",
-          items: [
-            {
-              label: "Streaming",
-              href: "#paths",
-            },
-            {
-              label: "Esports",
-              href: "#paths",
-            },
-            {
-              label: "Development",
-              href: "#paths",
-            },
-          ],
-        },
-        {
-          title: "Resources",
-          items: [
-            {
-              label: "Quick Start",
-              href: "#launch",
-            },
-            {
-              label: "FAQ",
-              href: "#faq",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-      ]}
       logoText="GameStart"
+      imageSrc="http://img.b2bpic.net/free-photo/side-view-happy-woman-winning-videogame_23-2149349981.jpg?_wi=1"
+      columns={[
+        { title: "Business", items: [{ label: "Streaming", href: "#paths" }, { label: "Esports", href: "#paths" }] },
+        { title: "Resources", items: [{ label: "Quick Start", href: "#launch" }, { label: "FAQ", href: "#faq" }] }
+      ]}
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -12,13 +12,13 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #fffaf5e6;
+  --foreground: #ffffff;
   --primary-cta: #ffaa70;
   --primary-cta-text: #0a0a0a;
   --secondary-cta: #1a1a1a;
   --secondary-cta-text: #fffaf5e6;
-  --accent: #737373;
+  --accent: #ffaa70;
-  --background-accent: #737373;
+  --background-accent: #1a1a1a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);