Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -2,17 +2,17 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
+import FooterCard from '@/components/sections/footer/FooterCard';
 import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
-import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
-import { CheckCircle, Shield, Star } from "lucide-react";
+import { CheckCircle, Shield, Star, Instagram, Twitter, Linkedin } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -32,16 +32,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        {
-          name: "Home",          id: "hero"},
-        {
-          name: "Packages",          id: "products"},
-        {
-          name: "Pricing",          id: "pricing"},
-        {
-          name: "Testimonials",          id: "testimonials"},
-        {
-          name: "Contact",          id: "contact"},
+        { name: "Home", id: "hero" },
+        { name: "Packages", id: "products" },
+        { name: "Pricing", id: "pricing" },
+        { name: "Testimonials", id: "testimonials" },
+        { name: "Contact", id: "contact" },
       ]}
       brandName="Al Ghuraba"
     />
@@ -49,37 +44,28 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardRotatedCarousel
-      background={{
-        variant: "rotated-rays-static"}}
+      background={{ variant: "rotated-rays-static" }}
       title="Your Sacred Journey, Perfectly Guided"
       description="Trusted Umrah packages from Australia with expert local guides, transparent pricing, and 24/7 pilgrim support. Experience spiritual peace without logistical stress."
-      buttons={[
-        {
-          text: "Explore Packages",          href: "#products"},
-      ]}
+      buttons={[{ text: "Explore Packages", href: "#products" }]}
       carouselItems={[
-        {
-          id: "c1",          imageSrc: "http://img.b2bpic.net/free-photo/arabic-food-composition-with-shadow-ramadan_23-2147789253.jpg?_wi=1",          imageAlt: "Sacred journey"},
-        {
-          id: "c2",          imageSrc: "http://img.b2bpic.net/free-photo/muslim-man-using-credit-card-phone_482257-89036.jpg?_wi=1",          imageAlt: "Spiritual guidance"},
-        {
-          id: "c3",          imageSrc: "http://img.b2bpic.net/free-photo/sunset-with-muslim-mosque-foreground_1385-2748.jpg?_wi=1",          imageAlt: "Expert support"},
-        {
-          id: "c4",          imageSrc: "http://img.b2bpic.net/free-photo/pretty-vintage-camera-travel-asian-terminal_1428-686.jpg?_wi=1",          imageAlt: "Peace of mind"},
-        {
-          id: "c5",          imageSrc: "http://img.b2bpic.net/free-photo/fantastic-mosque-architecture-islamic-new-year-celebration_23-2151457441.jpg?_wi=1",          imageAlt: "Transparent pricing"},
-        {
-          id: "c6",          imageSrc: "http://img.b2bpic.net/free-photo/ramadan-celebration-digital-art_23-2151358068.jpg",          imageAlt: "Expert local guides"},
+        { id: "c1", imageSrc: "https://img.b2bpic.net/free-photo/abstract-islamic-pattern-gold.jpg" },
+        { id: "c2", imageSrc: "https://img.b2bpic.net/free-photo/modern-mosque-silhouette-gradient.jpg" },
+        { id: "c3", imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-islamic-art.jpg" },
+        { id: "c4", imageSrc: "https://img.b2bpic.net/free-photo/gold-calligraphy-abstract-bg.jpg" },
+        { id: "c5", imageSrc: "https://img.b2bpic.net/free-photo/islamic-geometric-pattern-minimal.jpg" },
+        { id: "c6", imageSrc: "https://img.b2bpic.net/free-photo/minimal-mosque-dome-vector.jpg" },
       ]}
     />
   </div>
 
   <div id="about" data-section="about">
       <TextSplitAbout
-      useInvertedBackground={false}
       title="Experience Peace of Mind"
+      useInvertedBackground={false}
       description={[
-        "Al Ghuraba Travel specializes in crafting seamless pilgrimage journeys from Australia to the Holy Lands. We remove the complexities of visas, accommodation, and local transport so you can focus entirely on your devotion.",        "Our experienced team is committed to providing service that honors the sanctity of your trip, offering dedicated support every step of the way."]}
+        "Al Ghuraba Travel specializes in crafting seamless pilgrimage journeys from Australia to the Holy Lands. We remove the complexities of visas, accommodation, and local transport so you can focus entirely on your devotion.",        "Our experienced team is committed to providing service that honors the sanctity of your trip, offering dedicated support every step of the way."
+      ]}
     />
   </div>
 
@@ -88,43 +74,13 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="split"
       useInvertedBackground={false}
-      features={[
-        {
-          title: "Visa Assistance",          description: "Expert navigation of complex visa processes for hassle-free travel.",          icon: CheckCircle,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/joyful-girl-sunglasses-with-map-leaning-cabriolet-car-while-happily-taking-photos-cellphone-with-passport-hand_574295-699.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/muslim-women-traveling-paris-together_23-2149364127.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-          ]
-        },
-        {
-          title: "24/7 Support",          description: "Local guides available around the clock to assist you in Mecca and Medina.",          icon: Shield,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-islamic-businesswoman-making-phone-call-while-working-office_637285-6435.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/top-view-passport-mask-keyboard_23-2148786137.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-          ]
-        },
-        {
-          title: "Transparent Pricing",          description: "No hidden costs. Everything is clearly outlined before you book.",          icon: Star,
-          mediaItems: [
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/ramadan-kareem-poster-with-greeting_53876-128627.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/view-photorealistic-muslim-people-with-animals-prepared-eid-al-adha-offering_23-2151324759.jpg",              imageAlt: "passport travel documents flatlay"
-            },
-          ]
-        },
-      ]}
       title="Why Trust Us?"
       description="We ensure your focus remains on worship, while we handle the logistics."
+      features={[
+        { title: "Visa Assistance", description: "Expert navigation of complex visa processes.", icon: CheckCircle, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-photo/abstract-document-flow-gold.jpg" }, { imageSrc: "https://img.b2bpic.net/free-photo/minimal-abstract-stamp-vector.jpg" }] },
+        { title: "24/7 Support", description: "Local guides available around the clock.", icon: Shield, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-photo/abstract-network-nodes-glow.jpg" }, { imageSrc: "https://img.b2bpic.net/free-photo/minimal-shield-geometric.jpg" }] },
+        { title: "Transparent Pricing", description: "No hidden costs. Everything outlined clearly.", icon: Star, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-calculator.jpg" }, { imageSrc: "https://img.b2bpic.net/free-photo/minimal-gold-currency-symbol.jpg" }] },
+      ]}
     />
   </div>
 
@@ -134,22 +90,13 @@ export default function LandingPage() {
       textboxLayout="default"
       gridVariant="two-columns-alternating-heights"
       useInvertedBackground={false}
-      products={[
-        {
-          id: "p1",          name: "Executive Umrah",          price: "From $5,999",          imageSrc: "http://img.b2bpic.net/free-vector/paper-style-vertical-islamic-new-year-poster-template_23-2149008822.jpg"},
-        {
-          id: "p2",          name: "Premium Comfort",          price: "From $4,499",          imageSrc: "http://img.b2bpic.net/free-photo/3d-ramadan-celebration-with-castle_23-2151259807.jpg"},
-        {
-          id: "p3",          name: "Essential Pilgrimage",          price: "From $3,299",          imageSrc: "http://img.b2bpic.net/free-photo/young-man-checked-shirt-hat-pointing-paper-sheet-looking-focused_176474-24198.jpg"},
-        {
-          id: "p4",          name: "Family Group Special",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/people-celebrating-ramadan-together_23-2151404312.jpg"},
-        {
-          id: "p5",          name: "Community Bulk Pack",          price: "Contact for Quote",          imageSrc: "http://img.b2bpic.net/free-photo/muslim-women-traveling-together_23-2149305620.jpg"},
-        {
-          id: "p6",          name: "Individual Guidance",          price: "From $3,899",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-presents-with-flower-petals-arrangement_23-2149343240.jpg"},
-      ]}
       title="Premium Umrah Packages"
       description="Tailored packages designed for families, community groups, and individuals."
+      products={[
+        { id: "p1", name: "Executive Umrah", price: "From $5,999", imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-pattern.jpg" },
+        { id: "p2", name: "Premium Comfort", price: "From $4,499", imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-gold.jpg" },
+        { id: "p3", name: "Essential Pilgrimage", price: "From $3,299", imageSrc: "https://img.b2bpic.net/free-photo/minimalist-mosque-vector.jpg" },
+      ]}
     />
   </div>
 
@@ -158,127 +105,67 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
-      plans={[
-        {
-          id: "basic",          tag: "Essentials",          price: "$3,299",          period: "/per person",          description: "Everything essential for a comfortable journey.",          button: {
-            text: "Inquire Now"},
-          featuresTitle: "Includes:",          features: [
-            "Hotel accommodation",            "Visa processing",            "Guided tours"],
-        },
-        {
-          id: "pro",          tag: "Recommended",          price: "$4,499",          period: "/per person",          description: "Greater comfort and premium accommodation.",          button: {
-            text: "Inquire Now"},
-          featuresTitle: "Includes:",          features: [
-            "4-star hotels",            "Dedicated support",            "Full catering"],
-        },
-        {
-          id: "premium",          tag: "Executive",          price: "$5,999",          period: "/per person",          description: "The ultimate peaceful journey with luxury inclusions.",          button: {
-            text: "Inquire Now"},
-          featuresTitle: "Includes:",          features: [
-            "5-star proximity",            "VIP support",            "Priority transport"],
-        },
-      ]}
       title="Flexible Options"
       description="Choose the journey that suits your spiritual and budgetary needs."
+      plans={[
+        { id: "basic", tag: "Essentials", price: "$3,299", period: "/per person", description: "Everything essential for a comfortable journey.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["Hotel", "Visa", "Guided"] },
+        { id: "pro", tag: "Recommended", price: "$4,499", period: "/per person", description: "Greater comfort and premium accommodation.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["4-star", "Support", "Full Catering"] },
+        { id: "premium", tag: "Executive", price: "$5,999", period: "/per person", description: "The ultimate journey.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["5-star", "VIP", "Priority"] },
+      ]}
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFive
+      <TestimonialCardTen
+      title="What Pilgrims Say"
+      description="Authentic experiences from our community."
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        {
-          id: "t1",          name: "Sarah Johnson",          date: "Oct 2024",          title: "First-time Pilgrim",          quote: "Seamless experience. The Al Ghuraba team took care of every detail.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-male-bartender-posing-yellow-wall-drink-job-club-alcohol-male-bar-night_140725-121983.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/arabic-food-composition-with-shadow-ramadan_23-2147789253.jpg?_wi=2",          imageAlt: "happy pilgrim portrait smiling"},
-        {
-          id: "t2",          name: "Ahmed Ibrahim",          date: "Sep 2024",          title: "Group Organizer",          quote: "Perfect for our mosque group. Logistics were handled beautifully.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/young-family-together-with-little-son_1303-24918.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/muslim-man-using-credit-card-phone_482257-89036.jpg?_wi=2",          imageAlt: "happy pilgrim portrait smiling"},
-        {
-          id: "t3",          name: "Fatima Zaid",          date: "Aug 2024",          title: "Return Pilgrim",          quote: "Everything was so easy. A spiritual journey truly stress-free.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/shot-human-entering-inside-karnak-temple-complex_181624-28006.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/sunset-with-muslim-mosque-foreground_1385-2748.jpg?_wi=2",          imageAlt: "happy pilgrim portrait smiling"},
-        {
-          id: "t4",          name: "David Smith",          date: "Jul 2024",          title: "Family traveler",          quote: "The support provided gave us such peace of mind during travel.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-book_23-2148970117.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/pretty-vintage-camera-travel-asian-terminal_1428-686.jpg?_wi=2",          imageAlt: "happy pilgrim portrait smiling"},
-        {
-          id: "t5",          name: "Layla Khan",          date: "Jun 2024",          title: "Solo Traveler",          quote: "I felt safe and supported from the start until the very end.",          tag: "Verified",          avatarSrc: "http://img.b2bpic.net/free-photo/girl-park_1157-7615.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/fantastic-mosque-architecture-islamic-new-year-celebration_23-2151457441.jpg?_wi=2",          imageAlt: "happy pilgrim portrait smiling"},
+        { id: "t1", title: "Excellent", quote: "Seamless experience.", name: "Sarah J.", role: "Pilgrim", imageSrc: "https://img.b2bpic.net/free-photo/abstract-nature-pattern-blue.jpg" },
+        { id: "t2", title: "Great", quote: "Beautifully organized.", name: "Ahmed I.", role: "Organizer", imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-waves-gold.jpg" },
+        { id: "t3", title: "Wonderful", quote: "Truly stress-free.", name: "Fatima Z.", role: "Pilgrim", imageSrc: "https://img.b2bpic.net/free-photo/abstract-minimal-light-bokeh.jpg" },
       ]}
-      title="What Pilgrims Say"
-      description="Authentic experiences from our community."
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqBase
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "f1",          title: "Do you provide visa help?",          content: "Yes, we handle all visa requirements for your Umrah journey."},
-        {
-          id: "f2",          title: "Is accommodation included?",          content: "Yes, all our packages feature high-quality hotel stays close to holy sites."},
-        {
-          id: "f3",          title: "Can you handle group bookings?",          content: "Absolutely. We specialize in coordinating bulk packages for families and committees."},
-      ]}
+      <FaqSplitMedia
       title="Common Questions"
       description="Answers to assist you in planning your Umrah."
+      faqs={[
+        { id: "f1", title: "Visa help?", content: "Yes, we handle all visas." },
+        { id: "f2", title: "Accommodation?", content: "Yes, high-quality stays." },
+      ]}
       faqsAnimation="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      imageSrc="https://img.b2bpic.net/free-photo/geometric-mosque-art.jpg"
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplitForm
-      useInvertedBackground={false}
+      <ContactSplit
+      tag="Contact"
       title="Start Your Journey"
-      description="Reach out to our expert team for your free consultation."
-      inputs={[
-        {
-          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
-        },
-        {
-          name: "email",          type: "email",          placeholder: "Email Address",          required: true,
-        },
-        {
-          name: "phone",          type: "tel",          placeholder: "Phone Number",          required: true,
-        },
-      ]}
-      textarea={{
-        name: "message",        placeholder: "Tell us about your trip plans",        rows: 4,
-        required: true,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/flat-lay-with-laptop-headphones_23-2148256050.jpg"
+      description="Reach out to our expert team for a free consultation."
+      imageSrc="https://img.b2bpic.net/free-photo/abstract-travel-concept-minimal.jpg"
+      useInvertedBackground={true}
+      background={{ variant: "animated-grid" }}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterMedia
-      imageSrc="http://img.b2bpic.net/free-photo/sunset-mosque-with-palm-trees_23-2151983933.jpg"
+      <FooterCard
       logoText="Al Ghuraba Travel"
-      columns={[
-        {
-          title: "Services",          items: [
-            {
-              label: "Umrah Packages",              href: "#products"},
-            {
-              label: "Group Travel",              href: "#products"},
-          ],
-        },
-        {
-          title: "Help",          items: [
-            {
-              label: "FAQ",              href: "#faq"},
-            {
-              label: "Contact Us",              href: "#contact"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms of Service",              href: "#"},
-          ],
-        },
+      socialLinks={[
+        { icon: Instagram, href: "#", ariaLabel: "Instagram" },
+        { icon: Twitter, href: "#", ariaLabel: "Twitter" },
+        { icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
       ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-nunito-sans), sans-serif;
+  font-family: var(--font-inter), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-nunito-sans), sans-serif;
+  font-family: var(--font-inter), sans-serif;
 }