Update theme colors

Merge version_25 into main

src/app/page.tsx

@@ -6,7 +6,7 @@ import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
-import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
@@ -33,66 +33,42 @@ export default function LandingPage() {
       <NavbarLayoutFloatingOverlay
       navItems={[
         {
-          name: "Home",
-          id: "#hero",
-        },
+          name: "Home",          id: "#hero"},
         {
-          name: "About",
-          id: "#about",
-        },
+          name: "About",          id: "#about"},
         {
-          name: "Services",
-          id: "#services",
-        },
+          name: "Services",          id: "#services"},
         {
-          name: "Portfolio",
-          id: "#portfolio",
-        },
+          name: "Portfolio",          id: "#portfolio"},
         {
-          name: "Results",
-          id: "#results",
-        },
+          name: "Results",          id: "#results"},
         {
-          name: "Testimonials",
-          id: "#testimonials",
-        },
+          name: "Testimonials",          id: "#testimonials"},
         {
-          name: "FAQ",
-          id: "#faq",
-        },
+          name: "FAQ",          id: "#faq"},
         {
-          name: "Contact",
-          id: "#contact",
-        },
+          name: "Contact",          id: "#contact"},
       ]}
       brandName="ReelEstate"
       button={{
-        text: "Send a listing, get a free sample",
-        href: "#contact",
-      }}
+        text: "Send a listing, get a free sample",        href: "#contact"}}
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroLogoBillboard
+      <HeroBillboardScroll
       background={{
-        variant: "animated-grid",
-      }}
-      logoText="ReelEstate"
+        variant: "animated-grid"}}
+      title="ReelEstate"
       description="Reel Estate turns any Dubai listing into a complete marketing kit. Cinematic room tours, scrollstopping reels, and a landing page built to convert. Leads from content, without burning budget on ads."
       buttons={[
         {
-          text: "Send a listing, get a free sample",
-          href: "#contact",
-        },
+          text: "Send a listing, get a free sample",          href: "#contact"},
         {
-          text: "See the work",
-          href: "#portfolio",
-        },
+          text: "See the work",          href: "#portfolio"},
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/family-showcasing-their-home_23-2151624872.jpg"
-      imageAlt="ReelEstate AI marketing dashboard"
-      mediaAnimation="blur-reveal"
+      videoSrc="https://videos.pexels.com/video-files/5586617/5586617-hd_1920_1080_25fps.mp4"
+      videoAriaLabel="Real estate 3D tour video"
     />
   </div>
 
@@ -101,19 +77,13 @@ export default function LandingPage() {
       useInvertedBackground={true}
       heading={[
         {
-          type: "text",
-          content: "Unlock Next-Gen ",
-        },
+          type: "text",          content: "Unlock Next-Gen "},
         {
-          type: "text",
-          content: "Lead Generation",
-        },
+          type: "text",          content: "Lead Generation"},
       ]}
       buttons={[
         {
-          text: "Learn More",
-          href: "#services",
-        },
+          text: "Learn More",          href: "#services"},
       ]}
     />
   </div>
@@ -126,34 +96,22 @@ export default function LandingPage() {
       features={[
         {
           icon: Camera,
-          title: "Enhanced Photography",
-          description: "AI-powered photo enhancements that highlight every detail of your luxury Dubai listings, ensuring unmatched visual quality.",
-        },
+          title: "Enhanced Photography",          description: "AI-powered photo enhancements that highlight every detail of your luxury Dubai listings, ensuring unmatched visual quality."},
         {
           icon: Film,
-          title: "Cinematic Video Tours",
-          description: "Produce breathtaking cinematic walkthroughs that immerse potential buyers in your properties, creating an unforgettable experience.",
-        },
+          title: "Cinematic Video Tours",          description: "Produce breathtaking cinematic walkthroughs that immerse potential buyers in your properties, creating an unforgettable experience."},
         {
           icon: Sparkles,
-          title: "AI-Powered UGC Reels",
-          description: "Generate scroll-stopping, user-generated style reels tailored for social media, driving organic reach and buyer interest.",
-        },
+          title: "AI-Powered UGC Reels",          description: "Generate scroll-stopping, user-generated style reels tailored for social media, driving organic reach and buyer interest."},
         {
           icon: LayoutDashboard,
-          title: "High-Converting Landing Pages",
-          description: "Dedicated landing pages built for each listing, optimized to capture leads and guide prospects directly to you, without ad spend.",
-        },
+          title: "High-Converting Landing Pages",          description: "Dedicated landing pages built for each listing, optimized to capture leads and guide prospects directly to you, without ad spend."},
         {
           icon: Users,
-          title: "Target Audience Insights",
-          description: "Leverage AI to understand your ideal buyer profiles, ensuring your marketing efforts resonate with the right audience segments.",
-        },
+          title: "Target Audience Insights",          description: "Leverage AI to understand your ideal buyer profiles, ensuring your marketing efforts resonate with the right audience segments."},
         {
           icon: Zap,
-          title: "Seamless Integration",
-          description: "Integrate ReelEstate effortlessly into your existing workflow, from listing uploads to lead delivery, designed for agent efficiency.",
-        },
+          title: "Seamless Integration",          description: "Integrate ReelEstate effortlessly into your existing workflow, from listing uploads to lead delivery, designed for agent efficiency."},
       ]}
       title="Your All-in-One Marketing Arsenal"
       description="From stunning visuals to automated lead pages, ReelEstate provides everything you need to captivate buyers and close deals faster. Empower your listings with cutting-edge AI."
@@ -168,47 +126,17 @@ export default function LandingPage() {
       useInvertedBackground={true}
       products={[
         {
-          id: "product-1",
-          name: "Luxury Photo Enhancement",
-          price: "Included",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-rich-woman-home_23-2149722577.jpg",
-          imageAlt: "AI enhanced luxury property photo",
-        },
+          id: "product-1",          name: "Luxury Photo Enhancement",          price: "Included",          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-rich-woman-home_23-2149722577.jpg",          imageAlt: "AI enhanced luxury property photo"},
         {
-          id: "product-2",
-          name: "Cinematic Video Package",
-          price: "Included",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-streaming-their-home-using-smartphone_23-2151624931.jpg",
-          imageAlt: "Screenshot from cinematic video tour",
-        },
+          id: "product-2",          name: "Cinematic Video Package",          price: "Included",          imageSrc: "http://img.b2bpic.net/free-photo/person-streaming-their-home-using-smartphone_23-2151624931.jpg",          imageAlt: "Screenshot from cinematic video tour"},
         {
-          id: "product-3",
-          name: "UGC Reel Creation",
-          price: "Included",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-showcasing-their-home-through-smartphone_23-2151624895.jpg",
-          imageAlt: "AI generated social media reel",
-        },
+          id: "product-3",          name: "UGC Reel Creation",          price: "Included",          imageSrc: "http://img.b2bpic.net/free-photo/person-showcasing-their-home-through-smartphone_23-2151624895.jpg",          imageAlt: "AI generated social media reel"},
         {
-          id: "product-4",
-          name: "Dedicated Landing Page",
-          price: "Included",
-          imageSrc: "http://img.b2bpic.net/free-photo/illustration-smart-house-invention-automation-technology-laptop_53876-147702.jpg",
-          imageAlt: "High converting property landing page",
-        },
+          id: "product-4",          name: "Dedicated Landing Page",          price: "Included",          imageSrc: "http://img.b2bpic.net/free-photo/illustration-smart-house-invention-automation-technology-laptop_53876-147702.jpg",          imageAlt: "High converting property landing page"},
         {
-          id: "product-5",
-          name: "Virtual Staging",
-          price: "Optional Add-on",
-          imageSrc: "http://img.b2bpic.net/free-photo/decorative-design-gardening-natural-plant-tree_53876-14209.jpg",
-          imageAlt: "Virtually staged luxury room",
-        },
+          id: "product-5",          name: "Virtual Staging",          price: "Optional Add-on",          imageSrc: "http://img.b2bpic.net/free-photo/decorative-design-gardening-natural-plant-tree_53876-14209.jpg",          imageAlt: "Virtually staged luxury room"},
         {
-          id: "product-6",
-          name: "Interactive 3D Floorplan",
-          price: "Optional Add-on",
-          imageSrc: "http://img.b2bpic.net/free-photo/palace-china_1127-4075.jpg",
-          imageAlt: "Detailed 3D floor plan rendering",
-        },
+          id: "product-6",          name: "Interactive 3D Floorplan",          price: "Optional Add-on",          imageSrc: "http://img.b2bpic.net/free-photo/palace-china_1127-4075.jpg",          imageAlt: "Detailed 3D floor plan rendering"},
       ]}
       title="Our Marketing Kit Components"
       description="Explore the high-impact elements that drive engagement and convert scrollers into serious buyers for your Dubai properties. Each component is crafted for maximum lead generation."
@@ -222,34 +150,16 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "metric-1",
-          value: "400%",
-          title: "Engagement Increase",
-          items: [
-            "Boosted views",
-            "More interactions",
-            "Higher dwell time",
-          ],
+          id: "metric-1",          value: "400%",          title: "Engagement Increase",          items: [
+            "Boosted views",            "More interactions",            "Higher dwell time"],
         },
         {
-          id: "metric-2",
-          value: "3X",
-          title: "Lead Quality",
-          items: [
-            "Pre-qualified buyers",
-            "Serious inquiries",
-            "Reduced time wasted",
-          ],
+          id: "metric-2",          value: "3X",          title: "Lead Quality",          items: [
+            "Pre-qualified buyers",            "Serious inquiries",            "Reduced time wasted"],
         },
         {
-          id: "metric-3",
-          value: "50%",
-          title: "Time-to-Close Reduction",
-          items: [
-            "Faster conversions",
-            "Optimized sales cycle",
-            "Efficient deal closure",
-          ],
+          id: "metric-3",          value: "50%",          title: "Time-to-Close Reduction",          items: [
+            "Faster conversions",            "Optimized sales cycle",            "Efficient deal closure"],
         },
       ]}
       title="Results That Speak Volumes"
@@ -264,50 +174,20 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "1",
-          name: "Omar Al-Farsi",
-          handle: "@OmarDXBRealty",
-          testimonial: "ReelEstate transformed my listings! The cinematic tours and AI reels are absolute game-changers. I'm getting more qualified leads than ever before, without touching my ad budget.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-buisness-man_23-2148479585.jpg",
-          imageAlt: "Omar Al-Farsi",
-        },
+          id: "1",          name: "Omar Al-Farsi",          handle: "@OmarDXBRealty",          testimonial: "ReelEstate transformed my listings! The cinematic tours and AI reels are absolute game-changers. I'm getting more qualified leads than ever before, without touching my ad budget.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-buisness-man_23-2148479585.jpg",          imageAlt: "Omar Al-Farsi"},
         {
-          id: "2",
-          name: "Layla Khan",
-          handle: "@LaylaLuxuryHomes",
-          testimonial: "The quality of the marketing kits is unparalleled. My clients are impressed, and the leads I'm receiving are genuinely interested. ReelEstate is essential for any luxury agent in Dubai.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_1098-21013.jpg",
-          imageAlt: "Layla Khan",
-        },
+          id: "2",          name: "Layla Khan",          handle: "@LaylaLuxuryHomes",          testimonial: "The quality of the marketing kits is unparalleled. My clients are impressed, and the leads I'm receiving are genuinely interested. ReelEstate is essential for any luxury agent in Dubai.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_1098-21013.jpg",          imageAlt: "Layla Khan"},
         {
-          id: "3",
-          name: "Ahmed Rashid",
-          handle: "@AhmedPropMaster",
-          testimonial: "Finally, a solution that understands the Dubai market. ReelEstate's landing pages convert like crazy, and their turnaround time is incredibly fast. Highly recommended!",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-dark-jacket-pink-background_179666-14205.jpg",
-          imageAlt: "Ahmed Rashid",
-        },
+          id: "3",          name: "Ahmed Rashid",          handle: "@AhmedPropMaster",          testimonial: "Finally, a solution that understands the Dubai market. ReelEstate's landing pages convert like crazy, and their turnaround time is incredibly fast. Highly recommended!",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-dark-jacket-pink-background_179666-14205.jpg",          imageAlt: "Ahmed Rashid"},
         {
-          id: "4",
-          name: "Sara Hussain",
-          handle: "@SaraDXBEstates",
-          testimonial: "I was skeptical about AI, but ReelEstate proved me wrong. The UGC reels get so much organic traction. It's like having an in-house marketing team without the overhead.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/bald-man-with-beard-wearing-business-clothes-glasses-puffing-cheeks-with-funny-face-mouth-inflated-with-air-crazy-expression_839833-2502.jpg",
-          imageAlt: "Sara Hussain",
-        },
+          id: "4",          name: "Sara Hussain",          handle: "@SaraDXBEstates",          testimonial: "I was skeptical about AI, but ReelEstate proved me wrong. The UGC reels get so much organic traction. It's like having an in-house marketing team without the overhead.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/bald-man-with-beard-wearing-business-clothes-glasses-puffing-cheeks-with-funny-face-mouth-inflated-with-air-crazy-expression_839833-2502.jpg",          imageAlt: "Sara Hussain"},
         {
-          id: "5",
-          name: "Khalid Mansour",
-          handle: "@KhalidGlobalProp",
-          testimonial: "The enhanced photos literally make my properties shine. I've noticed a significant increase in showing requests directly attributed to ReelEstate's high-quality visuals. Fantastic service.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-businesswoman-holding-digital-tablet-takeaway-coffee-cup-outdoors_23-2147941528.jpg",
-          imageAlt: "Khalid Mansour",
-        },
+          id: "5",          name: "Khalid Mansour",          handle: "@KhalidGlobalProp",          testimonial: "The enhanced photos literally make my properties shine. I've noticed a significant increase in showing requests directly attributed to ReelEstate's high-quality visuals. Fantastic service.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-businesswoman-holding-digital-tablet-takeaway-coffee-cup-outdoors_23-2147941528.jpg",          imageAlt: "Khalid Mansour"},
       ]}
       showRating={true}
       title="What Dubai Agents Are Saying"
@@ -321,30 +201,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "faq-1",
-          title: "What is ReelEstate?",
-          content: "ReelEstate is an AI marketing studio that transforms your Dubai real estate listings into complete marketing kits. This includes enhanced photos, cinematic video tours, AI-powered UGC reels, and high-converting landing pages, all designed to generate leads without expensive ad spend.",
-        },
+          id: "faq-1",          title: "What is ReelEstate?",          content: "ReelEstate is an AI marketing studio that transforms your Dubai real estate listings into complete marketing kits. This includes enhanced photos, cinematic video tours, AI-powered UGC reels, and high-converting landing pages, all designed to generate leads without expensive ad spend."},
         {
-          id: "faq-2",
-          title: "How fast is the turnaround time for a marketing kit?",
-          content: "We pride ourselves on efficiency. Once you submit your listing details and raw media, our AI and expert team can typically deliver a complete marketing kit within 24-48 hours, ensuring you can market your properties rapidly.",
-        },
+          id: "faq-2",          title: "How fast is the turnaround time for a marketing kit?",          content: "We pride ourselves on efficiency. Once you submit your listing details and raw media, our AI and expert team can typically deliver a complete marketing kit within 24-48 hours, ensuring you can market your properties rapidly."},
         {
-          id: "faq-3",
-          title: "What types of properties do you work with?",
-          content: "ReelEstate specializes in Dubai real estate, catering to off-plan new builds, luxury secondary properties, and high-value commercial listings. Our services are tailored to elevate premium property showcases.",
-        },
+          id: "faq-3",          title: "What types of properties do you work with?",          content: "ReelEstate specializes in Dubai real estate, catering to off-plan new builds, luxury secondary properties, and high-value commercial listings. Our services are tailored to elevate premium property showcases."},
         {
-          id: "faq-4",
-          title: "How does ReelEstate help with lead generation?",
-          content: "Our service creates compelling content designed to capture attention and direct potential buyers to dedicated, optimized landing pages for each listing. These pages are built to convert visitors into qualified leads, eliminating the need for paid advertising.",
-        },
+          id: "faq-4",          title: "How does ReelEstate help with lead generation?",          content: "Our service creates compelling content designed to capture attention and direct potential buyers to dedicated, optimized landing pages for each listing. These pages are built to convert visitors into qualified leads, eliminating the need for paid advertising."},
         {
-          id: "faq-5",
-          title: "Is there a free sample or trial available?",
-          content: "Yes! We're confident in our service. You can send us a listing, and we'll provide a free sample of our enhanced marketing content so you can experience the ReelEstate difference firsthand.",
-        },
+          id: "faq-5",          title: "Is there a free sample or trial available?",          content: "Yes! We're confident in our service. You can send us a listing, and we'll provide a free sample of our enhanced marketing content so you can experience the ReelEstate difference firsthand."},
       ]}
       title="Common Questions for ReelEstate"
       description="Find quick answers to the most frequent inquiries about our AI marketing service, pricing, and turnaround times for your Dubai real estate listings."
@@ -356,8 +221,7 @@ export default function LandingPage() {
       <ContactSplit
       useInvertedBackground={true}
       background={{
-        variant: "radial-gradient",
-      }}
+        variant: "radial-gradient"}}
       tag="GET STARTED"
       title="Transform Your Listings Today"
       description="Ready to generate high-quality leads without spending a fortune on ads? Send us your listing details, and we'll show you the ReelEstate difference with a free sample. Let's close more deals."
@@ -375,58 +239,35 @@ export default function LandingPage() {
       <FooterSimple
       columns={[
         {
-          title: "Services",
-          items: [
+          title: "Services",          items: [
             {
-              label: "Enhanced Photography",
-              href: "#services",
-            },
+              label: "Enhanced Photography",              href: "#services"},
             {
-              label: "Cinematic Video Tours",
-              href: "#services",
-            },
+              label: "Cinematic Video Tours",              href: "#services"},
             {
-              label: "AI Reels",
-              href: "#services",
-            },
+              label: "AI Reels",              href: "#services"},
             {
-              label: "Landing Pages",
-              href: "#services",
-            },
+              label: "Landing Pages",              href: "#services"},
           ],
         },
         {
-          title: "Company",
-          items: [
+          title: "Company",          items: [
             {
-              label: "About Us",
-              href: "#about",
-            },
+              label: "About Us",              href: "#about"},
             {
-              label: "Our Work",
-              href: "#portfolio",
-            },
+              label: "Our Work",              href: "#portfolio"},
             {
-              label: "Testimonials",
-              href: "#testimonials",
-            },
+              label: "Testimonials",              href: "#testimonials"},
             {
-              label: "Contact",
-              href: "#contact",
-            },
+              label: "Contact",              href: "#contact"},
           ],
         },
         {
-          title: "Legal",
-          items: [
+          title: "Legal",          items: [
             {
-              label: "Privacy Policy",
-              href: "#",
-            },
+              label: "Privacy Policy",              href: "#"},
             {
-              label: "Terms of Service",
-              href: "#",
-            },
+              label: "Terms of Service",              href: "#"},
           ],
         },
       ]}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f7f6f7;
-  --card: #ffffff;
-  --foreground: #25190c;
-  --primary-cta: #ff6207;
-  --primary-cta-text: #f7f6f7;
-  --secondary-cta: #ffffff;
-  --secondary-cta-text: #25190c;
-  --accent: #ffce93;
-  --background-accent: #e8cfa8;
+  --background: #0a0a0a;
+  --card: #1a1a1a;
+  --foreground: #f5f5f5;
+  --primary-cta: #dfff1c;
+  --primary-cta-text: #0a0a0a;
+  --secondary-cta: #1a1a1a;
+  --secondary-cta-text: #ffffff;
+  --accent: #8b9a1b;
+  --background-accent: #5d6b00;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);