Update src/app/page.tsx

src/app/page.tsx

@@ -10,7 +10,8 @@ import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
-import { Award, Clock, Headphones, ShieldCheck, Zap } from "lucide-react";
+import { Award, Clock, Headphones, ShieldCheck, Zap, Briefcase, BarChart3, Target } from "lucide-react";
+import FeatureBento from '@/components/sections/feature/FeatureBento';
 
 export default function LandingPage() {
   return (
@@ -70,6 +71,21 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="features-bento" data-section="features-bento">
+      <FeatureBento
+        title="مزايا متكاملة"
+        description="نظام وساطة عصري يجمع بين الكفاءة والأمان التقني."
+        items={[
+            { title: "أمان رقمي", description: "تشفير عالي المستوى لكافة العمليات.", icon: ShieldCheck },
+            { title: "تقارير لحظية", description: "متابعة مباشرة لحالة المعاملة.", icon: BarChart3 },
+            { title: "دعم سريع", description: "استجابة فورية عبر فريقنا المتخصص.", icon: Headphones },
+            { title: "خبرة واسعة", description: "سنوات من العمل في مجال الوساطة.", icon: Briefcase },
+            { title: "إنجاز فوري", description: "تقنيات تسرع عملية إتمام صفقاتك.", icon: Target }
+        ]}
+        animationType="blur-reveal"
+      />
+  </div>
+
   <div id="steps" data-section="steps">
       <MetricCardFourteen
       useInvertedBackground={false}