Update src/app/page.tsx

Merge version_6 into main

src/app/page.tsx

@@ -1,14 +1,14 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
 import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import { Bell, Book, Moon, TrendingUp } from 'lucide-react';
+import { Bell, Book, Moon, TrendingUp, Download } from 'lucide-react';
 
 export default function LandingPage() {
   return (
@@ -25,7 +25,7 @@ export default function LandingPage() {
       headingFontWeight="normal"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
+        <NavbarStyleApple
           navItems={[
             { name: "Features", id: "features" },
             { name: "About", id: "about" },
@@ -34,26 +34,30 @@ export default function LandingPage() {
             { name: "Download", id: "hero" }
           ]}
           brandName="Khamsa"
-          bottomLeftText="Faith Consistency"
-          bottomRightText="hello@khamsa.app"
         />
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroCarouselLogo
-          logoText="KHAMSA"
+        <HeroBillboardGallery
+          title="KHAMSA"
           description="Never Miss a Prayer Again. Stay connected to your faith with intelligent reminders, Quran access, Ramadan tracking, and detailed prayer analytics—all in one beautiful app designed for modern Muslim life."
+          tag="Available on iOS & Android"
+          tagIcon={Download}
           buttons={[
             { text: "Download on App Store", href: "https://apps.apple.com/app/khamsa" },
-            { text: "Learn More", href: "#features" }
+            { text: "Explore Features", href: "#features" }
           ]}
-          slides={[
+          mediaItems={[
             { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQNIf4E4zrfxOpIxfEPyWE1GfE/uploaded-1772521065783-ki2h2i1t.png", imageAlt: "Khamsa prayer tracking app interface" },
             { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQNIf4E4zrfxOpIxfEPyWE1GfE/uploaded-1772521065783-pbf6ggwm.png?_wi=1", imageAlt: "Khamsa app features showcase" },
-            { imageSrc: "http://img.b2bpic.net/free-vector/meditation-app-interface_23-2148655703.jpg?_wi=1", imageAlt: "Khamsa prayer analytics dashboard" }
+            { imageSrc: "http://img.b2bpic.net/free-vector/meditation-app-interface_23-2148655703.jpg?_wi=1", imageAlt: "Khamsa prayer analytics dashboard" },
+            { imageSrc: "http://img.b2bpic.net/free-photo/closeup-man-using-smart-phone-following-webinar-while-drinking-coffee-home_637285-5955.jpg?_wi=1", imageAlt: "Prayer app notification interface" },
+            { imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-meditating-with-singing-bowl-smartphone_23-2148847557.jpg?_wi=1", imageAlt: "Meditation and prayer tracking" }
           ]}
-          autoplayDelay={5000}
-          showDimOverlay={false}
+          background={{ variant: "plain" }}
+          mediaAnimation="slide-up"
+          buttonAnimation="opacity"
+          tagAnimation="slide-up"
         />
       </div>
 
@@ -67,7 +71,7 @@ export default function LandingPage() {
               title: "Intelligent Prayer Reminders",              description: "Precise notifications tailored to your location and daily schedule, ensuring you never miss a prayer time during your busy day.",              icon: Bell,
               mediaItems: [
                 { imageSrc: "http://img.b2bpic.net/free-photo/closeup-man-using-smart-phone-following-webinar-while-drinking-coffee-home_637285-5955.jpg?_wi=1", imageAlt: "Prayer reminder notifications" },
-                { imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-meditating-with-singing-bowl-smartphone_23-2148847557.jpg", imageAlt: "Notification interface" }
+                { imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-meditating-with-singing-bowl-smartphone_23-2148847557.jpg?_wi=2", imageAlt: "Notification interface" }
               ]
             },
             {
@@ -95,6 +99,10 @@ export default function LandingPage() {
           animationType="blur-reveal"
           textboxLayout="default"
           useInvertedBackground={false}
+          buttons={[
+            { text: "Get Started Free", href: "https://apps.apple.com/app/khamsa" }
+          ]}
+          buttonAnimation="opacity"
         />
       </div>