src/app/page.tsx

@@ -4,15 +4,13 @@ import ReactLenis from "lenis/react";
 import HeroCentered from "@/components/sections/hero/HeroCentered";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
 import FeatureBento, { type FeatureCard } from "@/components/sections/feature/FeatureBento";
-import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
 import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
 import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
-import ContactCenter from "@/components/sections/contact/ContactCenter";
 import ContactForm from "@/components/form/ContactForm";
 import FaqSplitText from "@/components/sections/faq/FaqSplitText";
-import { Zap, Shield, Rocket, Target, Sparkles, Crown, Mail, Users, Layers, Code, Star, Camera, MessageSquare } from "lucide-react";
+import { Zap, Shield, Sparkles, Mail } from "lucide-react";
 
 export default function SaasTemplatePage() {
     const navItems = [
@@ -31,7 +29,7 @@ export default function SaasTemplatePage() {
     ];
 
     const features: FeatureCard[] = [
-        { bentoComponent: "globe", title: "Global Reach", description: "Connect with users worldwide" },
+        { bentoComponent: "globe", title: "Global Reach", description: "Connect with users worldwide", detail: "24/7 Support" },
         { bentoComponent: "marquee", variant: "text", centerIcon: Zap, texts: ["Fast", "Reliable"], title: "Built for Speed", description: "Lightning fast delivery" },
         { bentoComponent: "3d-stack-cards", items: [{ icon: Shield, title: "Security", subtitle: "Bank-level" }], title: "Scaleable", description: "Reliable infrastructure" }
     ];
@@ -41,24 +39,26 @@ export default function SaasTemplatePage() {
             <ReactLenis root>
                 <NavbarLayoutFloatingInline navItems={navItems} brandName="SaasApp" button={{ text: "Get Started", href: "#contact" }} />
                 <HeroCentered background={{ variant: "rotated-rays-animated-grid" }} avatars={avatars} avatarText="Trusted by 1000+ users" title="Build Modern Web Experiences" description="Create stunning, responsive websites with our comprehensive component library" buttons={[{ text: "Get Started", href: "#contact" }]} />
-                <FeatureBento features={features} animationType="none" tag="Features" title="Powerful Features" description="Everything you need to build and scale" textboxLayout="default" />
+                <FeatureBento features={features} animationType="none" tag="Features" title="Powerful Features" description="Everything you need to build and scale" textboxLayout="default" useInvertedBackground={false} />
                 <div id="testimonials" data-section="testimonials">
                     <TestimonialCardFive 
                         title="Customer Stories"
                         description="What our users say about us"
                         textboxLayout="default"
+                        useInvertedBackground={false}
                         testimonials={[
                             { id: "1", name: "Sarah Chen", date: "2024-05-20", title: "CTO", quote: "Transformed our workflow completely!", tag: "Pro", avatarSrc: avatars[0].src }
                         ]}
                     />
                 </div>
-                <PricingCardEight tag="Pricing" tagIcon={Sparkles} title="Transparent pricing" description="Choose the plan that works best for you" animationType="opacity" textboxLayout="default" plans={[]} />
+                <PricingCardEight tag="Pricing" tagIcon={Sparkles} title="Transparent pricing" description="Choose the plan that works best for you" animationType="opacity" textboxLayout="default" useInvertedBackground={false} plans={[]} />
                 <div id="faq" data-section="faq">
                     <FaqSplitText 
                         sideTitle="Frequently Asked Questions"
                         sideDescription="Quick answers to your questions"
                         faqs={[{ id: "1", title: "Is there a trial?", content: "Yes, 14 days free." }]}
                         faqsAnimation="slide-up"
+                        useInvertedBackground={false}
                     />
                 </div>
                 <div id="contact" data-section="contact">
@@ -69,6 +69,7 @@ export default function SaasTemplatePage() {
                         tagIcon={Mail}
                         buttonText="Send Enquiry"
                         onSubmit={(email) => console.log("Form submitted", email)}
+                        useInvertedBackground={false}
                     />
                 </div>
                 <FooterBaseReveal logoText="SaaSify" columns={[]} copyrightText="2024 SaasApp. All rights reserved." />