Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -4,11 +4,11 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
-import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
+import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import FooterBase from '@/components/sections/footer/FooterBase';
-import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
 import { GraduationCap } from "lucide-react";
@@ -31,79 +31,39 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "Features", id: "#features" },
-          name: "Features",
+        { name: "About", id: "#about" },
-          id: "#features",
+        { name: "Pricing", id: "#pricing" },
-        },
+        { name: "Contact", id: "#contact" },
-        {
-          name: "About",
-          id: "#about",
-        },
-        {
-          name: "Pricing",
-          id: "#pricing",
-        },
-        {
-          name: "Contact",
-          id: "#contact",
-        },
       ]}
       brandName="StudyDeck"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroLogoBillboard
+      <HeroLogoBillboardSplit
-      background={{
-        variant: "plain",
-      }}
       logoText="StudyDeck"
-      description="Master your academic journey with the smartest digital study deck hub. Build, share, and scale your learning with AI-driven insights."
+      description="Professional grid-based digital study hub. Master your academic journey with advanced organization and intelligent deck management."
-      buttons={[
+      buttons={[{ text: "Explore Deck Hub", href: "#features" }]}
-        {
+      layoutOrder="default"
-          text: "Start Learning",
-          href: "#features",
-        },
-        {
-          text: "View Plans",
-          href: "#pricing",
-        },
-      ]}
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/a-futuristic-digital-study-dashboard-wit-1774857721319-e04dabbf.png?_wi=1"
-      imageAlt="Digital Study Platform Dashboard"
       mediaAnimation="slide-up"
+      background={{ variant: "plain" }}
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureCardEight
+      <FeatureCardTwentyFour
       textboxLayout="split"
       useInvertedBackground={false}
+      animationType="slide-up"
+      title="Digital Study Deck Hub"
+      description="A professional-grade grid workspace designed for structured knowledge acquisition and efficient learning management."
       features={[
-        {
+        { id: "1", title: "Active Recall Decks", author: "System", description: "High-retention flashcard system.", tags: ["Flashcards", "Efficiency"], videoSrc: "https://example.com/video1.mp4" },
-          id: 1,
+        { id: "2", title: "Smart Knowledge Grid", author: "System", description: "Organize your materials in a clean, professional grid.", tags: ["Grid", "Layout"], videoSrc: "https://example.com/video2.mp4" },
-          title: "AI-Powered Decks",
+        { id: "3", title: "Collaborative Study", author: "System", description: "Share and manage study spaces collectively.", tags: ["Social", "Team"], videoSrc: "https://example.com/video3.mp4" },
-          description: "Automated generation of study sets from your raw notes using advanced natural language processing.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/close-up-of-an-ai-powered-flashcard-set--1774857720074-7e47de5e.png?_wi=1",
-          imageAlt: "AI flashcard interface",
-        },
-        {
-          id: 2,
-          title: "Learning Paths",
-          description: "Adaptive curriculum mapping to visualize your academic progress and identify knowledge gaps.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/interactive-learning-path-visualizer-net-1774857719676-f05eba95.png?_wi=1",
-          imageAlt: "Learning path visualization",
-        },
-        {
-          id: 3,
-          title: "Global Collaboration",
-          description: "Sync your decks with study groups across the world for collective intelligence.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/real-time-collaboration-group-study-inte-1774857724097-1bc61b45.png",
-          imageAlt: "Collaborative study interface",
-        },
       ]}
-      title="Smart Features for Success"
-      description="Powerful tools designed to accelerate your retention and focus."
     />
   </div>
 
@@ -111,9 +71,9 @@ export default function LandingPage() {
       <TestimonialAboutCard
       useInvertedBackground={false}
       tag="Our Mission"
-      title="Redefining Digital Learning"
+      title="Grid-Based Precision"
-      description="We believe that everyone deserves a structured, intelligent path to mastery. StudyDeck leverages modern tech to bridge the gap between note-taking and deep knowledge retention."
+      description="We believe in structured learning. Our platform provides the digital architecture necessary for professional students to excel."
-      subdescription="Built by students, for students, globally."
+      subdescription="Built for those who value clarity and efficiency in every study session."
       icon={GraduationCap}
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/diverse-students-interacting-with-hologr-1774857719845-55fb96bd.png"
       mediaAnimation="blur-reveal"
@@ -121,98 +81,26 @@ export default function LandingPage() {
   </div>
 
   <div id="pricing" data-section="pricing">
-      <PricingCardNine
+      <PricingCardEight
       animationType="slide-up"
       textboxLayout="split"
       useInvertedBackground={false}
+      title="Hub Membership Plans"
+      description="Select the professional access tier that fits your academic research and storage requirements."
       plans={[
-        {
+        { id: "basic", badge: "Essential", price: "$15", subtitle: "For individual researchers", features: ["Grid access", "5 Active Decks"], buttons: [{ text: "Select", href: "#" }] },
-          id: "free",
+        { id: "pro", badge: "Pro", price: "$35", subtitle: "For advanced scholars", features: ["Unlimited grids", "Advanced analytics"], buttons: [{ text: "Upgrade", href: "#" }] }
-          title: "Basic Scholar",
-          price: "$0",
-          period: "/month",
-          features: [
-            "3 Active Decks",
-            "Basic AI generation",
-            "Community Access",
-          ],
-          button: {
-            text: "Get Started",
-            href: "#",
-          },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/a-futuristic-digital-study-dashboard-wit-1774857721319-e04dabbf.png?_wi=2",
-          imageAlt: "A futuristic digital study dashboard with glowing charts and study deck card interfaces, neon blue a",
-        },
-        {
-          id: "pro",
-          title: "Advanced Learner",
-          price: "$12",
-          period: "/month",
-          features: [
-            "Unlimited Decks",
-            "Advanced AI Analytics",
-            "Offline Access",
-            "Group Collaboration",
-          ],
-          button: {
-            text: "Choose Pro",
-            href: "#",
-          },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/close-up-of-an-ai-powered-flashcard-set--1774857720074-7e47de5e.png?_wi=2",
-          imageAlt: "Close up of an AI-powered flashcard set with code snippets, sleek UI, modern design, professional ae",
-        },
-        {
-          id: "team",
-          title: "Institutional",
-          price: "$49",
-          period: "/month",
-          features: [
-            "Unlimited Users",
-            "API Access",
-            "Custom Integrations",
-            "Priority Support",
-          ],
-          button: {
-            text: "Contact Sales",
-            href: "#contact",
-          },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/interactive-learning-path-visualizer-net-1774857719676-f05eba95.png?_wi=2",
-          imageAlt: "Interactive learning path visualizer, network nodes and connection lines, futuristic, clean, dark bl",
-        },
       ]}
-      title="Affordable Academic Growth"
-      description="Choose the right plan to fuel your academic excellence."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardFifteen
       useInvertedBackground={false}
-      testimonial="StudyDeck completely changed how I approach my final exams. The AI-generated flashcards saved me dozens of hours per semester."
+      testimonial="The grid interface makes navigating my massive library of study notes effortless. Truly a professional tool."
       rating={5}
-      author="Sarah Miller, Medical Student"
+      author="Jordan Chen, Lead Researcher"
-      avatars={[
+      avatars={[]}
-        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/portrait-of-a-confident-student-professi-1774857719328-ad3a6c36.png",
-          alt: "User 1",
-        },
-        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/portrait-of-a-focused-researcher-profess-1774857719581-b5242e42.png",
-          alt: "User 2",
-        },
-        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/portrait-of-an-innovative-software-devel-1774857721442-e1f03bf9.png",
-          alt: "User 3",
-        },
-        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/portrait-of-a-creative-designer-soft-lig-1774857719636-820a35f8.png",
-          alt: "User 4",
-        },
-        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BekglFHX0UTJt9ndoaRZloQDZR/portrait-of-a-confident-student-professi-1774857719328-ad3a6c36.png",
-          alt: "User 5",
-        },
-      ]}
       ratingAnimation="blur-reveal"
       avatarsAnimation="blur-reveal"
     />
@@ -223,29 +111,11 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "1", title: "Is the grid interface customizable?", content: "Yes, you can configure your deck layouts to match your research style." },
-          id: "1",
+        { id: "2", title: "Can I integrate with cloud storage?", content: "Integration with leading cloud platforms is available on all pro tiers." },
-          title: "How does AI deck generation work?",
-          content: "Our AI analyzes your uploaded notes and distills the most critical concepts into flashcard formats.",
-        },
-        {
-          id: "2",
-          title: "Can I share my decks?",
-          content: "Yes, you can easily share your decks with friends or publish them for the global community.",
-        },
-        {
-          id: "3",
-          title: "Is there a free trial?",
-          content: "Yes, the Basic Scholar plan is free forever with core features for your study needs.",
-        },
-        {
-          id: "4",
-          title: "Can I integrate with other apps?",
-          content: "Our Pro and Institutional plans offer deep integration with popular note-taking and LMS platforms.",
-        },
       ]}
-      title="Frequently Asked Questions"
+      title="Common Hub Questions"
-      description="Have questions about StudyDeck? We've got answers."
+      description="Information regarding our digital workspace tools."
       faqsAnimation="blur-reveal"
     />
   </div>
@@ -253,63 +123,19 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={false}
-      background={{
+      tag="Contact"
-        variant: "plain",
+      title="Get Started with the Hub"
-      }}
+      description="Connect with us to discuss team and institutional access options."
-      tag="Contact Us"
+      buttons={[{ text: "Inquire Now", href: "#" }]}
-      title="Ready to Master Your Field?"
+      background={{ variant: "plain" }}
-      description="Get in touch with our team for demos, support, or bulk institutional pricing inquiries."
-      buttons={[
-        {
-          text: "Contact Support",
-          href: "#",
-        },
-      ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterBase
       columns={[
-        {
+        { title: "Workspace", items: [{ label: "Decks", href: "#" }, { label: "Dashboard", href: "#" }] },
-          title: "Product",
+        { title: "Company", items: [{ label: "About", href: "#" }, { label: "Contact", href: "#contact" }] }
-          items: [
-            {
-              label: "Features",
-              href: "#features",
-            },
-            {
-              label: "Pricing",
-              href: "#pricing",
-            },
-          ],
-        },
-        {
-          title: "Company",
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Careers",
-              href: "#",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-          ],
-        },
       ]}
       logoText="StudyDeck"
     />