Merge version_3 into main

Merge version_3 into main

src/app/page.tsx

@@ -4,12 +4,13 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
+import FeatureBento from '@/components/sections/feature/FeatureBento';
 import FooterBase from '@/components/sections/footer/FooterBase';
 import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
-import { Activity, Award, DollarSign, Mic, Scale, Trophy, Wallet } from "lucide-react";
+import { Activity, Award, DollarSign, Mic, Scale, Trophy, Wallet, Landmark, Bitcoin, Cpu, Users, TrendingUp, Circle } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -44,29 +45,40 @@ export default function LandingPage() {
       title="Debate it. Stake it. Win it."
       description="Two people argue. The crowd bets on who's right. Winner takes the pot."
       testimonials={[
-        { name: "drip_king", handle: "@drip_king", testimonial: "won $240 · AI replaces engineers", rating: 5, imageSrc: "http://img.b2bpic.net/free-vector/gradient-dark-mode-app-template_23-2150513313.jpg?_wi=1", imageAlt: "Gradient dark mode app template" },
-        { name: "dotwave", handle: "@dotwave", testimonial: "won $120 · Remote work trends", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/white-bokeh-effect-black-background_1017-2740.jpg?_wi=1", imageAlt: "Gradient dark mode app template" },
-        { name: "xomocha", handle: "@xomocha", testimonial: "won $450 · Sports rivalry", rating: 5, imageSrc: "http://img.b2bpic.net/free-vector/hand-drawing-illustration-power-strength-concept_53876-15566.jpg?_wi=1", imageAlt: "Gradient dark mode app template" },
-        { name: "sarahvibe", handle: "@sarahvibe", testimonial: "won $80 · Music debate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/heart-bubble-speech-icon-table_23-2148023848.jpg?_wi=1", imageAlt: "Gradient dark mode app template" },
-        { name: "techbabe", handle: "@techbabe", testimonial: "won $300 · Crypto market", rating: 5, imageSrc: "http://img.b2bpic.net/free-vector/20-digital-law-sound-studio-flat-color-icon-pack-like-open-free-business-content-records_1142-16626.jpg", imageAlt: "Gradient dark mode app template" },
+        { name: "drip_king", handle: "@drip_king", testimonial: "won $240 · AI replaces engineers", rating: 5 },
+        { name: "dotwave", handle: "@dotwave", testimonial: "won $120 · Remote work trends", rating: 5 },
+        { name: "xomocha", handle: "@xomocha", testimonial: "won $450 · Sports rivalry", rating: 5 },
+        { name: "sarahvibe", handle: "@sarahvibe", testimonial: "won $80 · Music debate", rating: 5 },
+        { name: "techbabe", handle: "@techbabe", testimonial: "won $300 · Crypto market", rating: 5 },
       ]}
       buttons={[
         { text: "Start Beefing →", href: "#" },
         { text: "Browse Beefs", href: "#beefs" },
       ]}
-      imageSrc="http://img.b2bpic.net/free-vector/gradient-dark-mode-app-template_23-2150513313.jpg?_wi=2"
-      imageAlt="Futuristic dark interface background"
-      avatars={[
-        { src: "http://img.b2bpic.net/free-vector/cute-flat-devices_1212-41.jpg", alt: "User avatar 1" },
-        { src: "http://img.b2bpic.net/free-vector/hand-drawn-money-infographics_23-2147599759.jpg", alt: "User avatar 2" },
-        { src: "http://img.b2bpic.net/free-vector/investment-long-shadows-icon-set_98292-1172.jpg", alt: "User avatar 3" },
-        { src: "http://img.b2bpic.net/free-photo/business-expertise_53876-119979.jpg", alt: "User avatar 4" },
-        { src: "http://img.b2bpic.net/free-vector/media-icon-flat_1284-5096.jpg", alt: "User avatar 5" },
-      ]}
       avatarText="Join 5,000+ active beefers"
     />
   </div>
 
+  <div id="choose-topics" data-section="choose-topics">
+    <FeatureBento
+      title="Choose Your Debate Topics"
+      description="Pick a category and jump into the arena."
+      animationType="slide-up"
+      textboxLayout="split-actions"
+      useInvertedBackground={false}
+      features={[
+        { title: "Politics", description: "Debate policy, governance, and current affairs.", bentoComponent: "reveal-icon", icon: Landmark, button: { text: "Start Debate" } },
+        { title: "Sports", description: "Settle rivalries, GOAT debates, and match predictions.", bentoComponent: "reveal-icon", icon: Circle, button: { text: "Start Debate" } },
+        { title: "Crypto", description: "Market movements, blockchain tech, and assets.", bentoComponent: "reveal-icon", icon: Bitcoin, button: { text: "Start Debate" } },
+        { title: "Geopolitics", description: "Global strategy, international relations, and borders.", bentoComponent: "reveal-icon", icon: Activity, button: { text: "Start Debate" } },
+        { title: "Technology", description: "Future of AI, hardware, and software innovation.", bentoComponent: "reveal-icon", icon: Cpu, button: { text: "Start Debate" } },
+        { title: "Society", description: "Cultural shifts, ethics, and lifestyle trends.", bentoComponent: "reveal-icon", icon: Users, button: { text: "Start Debate" } },
+        { title: "Economy", description: "Markets, inflation, and global wealth.", bentoComponent: "reveal-icon", icon: TrendingUp, button: { text: "Start Debate" } },
+      ]}
+      buttons={[{ text: "Explore All Categories →" }]}
+    />
+  </div>
+
   <div id="beefs" data-section="beefs">
       <FeatureCardTwentyFive
       animationType="slide-up"
@@ -75,24 +87,15 @@ export default function LandingPage() {
       features={[
         {
           title: "AI in Engineering",          description: "AI will make 50% of software engineers unemployed by 2027.",          icon: Activity,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/white-bokeh-effect-black-background_1017-2740.jpg?_wi=2" },
-            { imageSrc: "http://img.b2bpic.net/free-vector/earth-display-futuristic-infographic-collection_23-2148203353.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
         {
           title: "LeBron vs Jordan",          description: "The ultimate GOAT debate of the basketball world.",          icon: Trophy,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-cyber-particles-background-with-flowing-dots_1048-12410.jpg?_wi=1" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-93052.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
         {
           title: "Bitcoin $200K",          description: "Will Bitcoin hit the $200k milestone by year end?",          icon: DollarSign,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/rendering-abstract-futuristic-background-with-glowing-neon-blue-lights_181624-26042.jpg" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
       ]}
       title="Top Live Beefs"
@@ -108,31 +111,19 @@ export default function LandingPage() {
       features={[
         {
           title: "Issue a Beef",          description: "Challenge someone and set your stake from $1 to $500.",          icon: Award,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-vector/hand-drawing-illustration-power-strength-concept_53876-15566.jpg?_wi=2" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/microphone-white-background-news-interviews_187299-46899.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
         {
           title: "Argue Your Case",          description: "3 minutes each, text or video, live crowd betting.",          icon: Mic,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/heart-bubble-speech-icon-table_23-2148023848.jpg?_wi=2" },
-            { imageSrc: "http://img.b2bpic.net/free-vector/icons-flat-set-musical-instruments_23-2147492904.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
         {
           title: "Resolution",          description: "60% community vote + 40% expert judge panel.",          icon: Scale,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/birth-rate-fertility-concept_23-2148760992.jpg" },
-            { imageSrc: "http://img.b2bpic.net/free-vector/set-de-elementos-de-derecho-y-justicia_23-2147802093.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
         {
           title: "Get Paid",          description: "Winner takes 95%, bettors share the pool, 5% fee.",          icon: Wallet,
-          mediaItems: [
-            { imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-cyber-particles-background-with-flowing-dots_1048-12410.jpg?_wi=2" },
-            { imageSrc: "http://img.b2bpic.net/free-vector/25-investment-solid-glyph-icon-pack-vector-icons-illustration_1142-18528.jpg" },
-          ]
+          mediaItems: [{}, {}]
         },
       ]}
       title="How It Works"
@@ -179,11 +170,11 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        { id: "1", name: "drip_king", handle: "82% WR", testimonial: "Earned +$4,820", imageSrc: "http://img.b2bpic.net/free-vector/futuristic-technology-infographic_23-2148474382.jpg" },
-        { id: "2", name: "techbabe", handle: "75% WR", testimonial: "Earned +$3,200", imageSrc: "http://img.b2bpic.net/free-vector/futuristic-blue-touch-user-interface-system-display-screen-technology-digital-electronic-dashboard-with-infographic_1284-41669.jpg" },
-        { id: "3", name: "dotwave", handle: "79% WR", testimonial: "Earned +$2,780", imageSrc: "http://img.b2bpic.net/free-vector/velocity-technology-interface-template-design-elements_53876-118759.jpg" },
-        { id: "4", name: "xomocha", handle: "61% WR", testimonial: "Earned +$1,990", imageSrc: "http://img.b2bpic.net/free-photo/black-white-bokeh-particles_1017-3297.jpg" },
-        { id: "5", name: "sarahvibe", handle: "68% WR", testimonial: "Earned +$1,450", imageSrc: "http://img.b2bpic.net/free-photo/abstract-teal-blue-background-with-sparkling-dust-particles_84443-83940.jpg" },
+        { id: "1", name: "drip_king", handle: "82% WR", testimonial: "Earned +$4,820" },
+        { id: "2", name: "techbabe", handle: "75% WR", testimonial: "Earned +$3,200" },
+        { id: "3", name: "dotwave", handle: "79% WR", testimonial: "Earned +$2,780" },
+        { id: "4", name: "xomocha", handle: "61% WR", testimonial: "Earned +$1,990" },
+        { id: "5", name: "sarahvibe", handle: "68% WR", testimonial: "Earned +$1,450" },
       ]}
       title="Leaderboard"
       description="Top performers on the platform."
@@ -212,4 +203,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}