Update src/i18n.ts

Merge version_3 into main

src/app/page.tsx

@@ -34,77 +34,54 @@ export default function LandingPage() {
       <NavbarLayoutFloatingInline
       navItems={[
         {
-          name: "الرئيسية",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "حولنا",
-          id: "about",
-        },
+          name: "About Us",          id: "about"},
         {
-          name: "الميزات",
-          id: "features",
-        },
+          name: "Features",          id: "features"},
         {
-          name: "الخدمات",
-          id: "products",
-        },
+          name: "Services",          id: "products"},
         {
-          name: "الأسعار",
-          id: "pricing",
-        },
+          name: "Pricing",          id: "pricing"},
         {
-          name: "آراء العملاء",
-          id: "testimonials",
-        },
+          name: "Testimonials",          id: "testimonials"},
         {
-          name: "الأسئلة الشائعة",
-          id: "faq",
-        },
+          name: "FAQ",          id: "faq"},
         {
-          name: "اتصل بنا",
-          id: "contact",
-        },
+          name: "Contact Us",          id: "contact"},
       ]}
       logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=u8l15k"
       logoAlt="Inwi Moneye Logo"
       brandName="Inwi Moneye"
       button={{
-        text: "حمّل التطبيق",
-        href: "#",
-      }}
+        text: "Download App",        href: "#"}}
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroBillboardScroll
       background={{
-        variant: "radial-gradient",
-      }}
-      title="Inwi Moneye: محفظتك الرقمية الشاملة"
-      description="أرسل الأموال، ادفع الفواتير، وتحكّم في أموالك بذكاء وأمان، داخل المغرب وخارجه. مع Inwi Moneye، أنت تتحكم في مستقبلك المالي."
+        variant: "radial-gradient"}}
+      title="Inwi Moneye: Your Comprehensive Digital Wallet"
+      description="Send money, pay bills, and manage your finances smartly and securely, both in Morocco and abroad. With Inwi Moneye, you control your financial future."
       buttons={[
         {
-          text: "حمّل التطبيق الآن",
-          href: "#download",
-        },
+          text: "Download App Now",          href: "#download"},
         {
-          text: "اكتشف المزيد",
-          href: "#about",
-        },
+          text: "Discover More",          href: "#about"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/close-up-guy-with-ring-smartphone_23-2148450773.jpg"
-      imageAlt="تطبيق Inwi Moneye على الهاتف الذكي"
+      imageAlt="Inwi Moneye app on smartphone"
     />
   </div>
 
   <div id="about" data-section="about">
       <MediaAbout
       useInvertedBackground={false}
-      title="عن Inwi Moneye: شريكك المالي الذكي"
-      description="Inwi Moneye هو تطبيق المحفظة الإلكترونية المتطور من Inwi، المصمم لتبسيط معاملاتك المالية اليومية. يوفر لك حرية إرسال واستقبال الأموال، دفع فواتيرك، وشحن رصيدك بكل سهولة ويسر، مدعوماً بتقنيات الذكاء الاصطناعي لتقديم تجربة مصرفية ذكية ومخصصة تناسب احتياجاتك في المغرب وخارجه."
+      title="About Inwi Moneye: Your Smart Financial Partner"
+      description="Inwi Moneye is Inwi's advanced e-wallet application, designed to simplify your daily financial transactions. It offers you the freedom to send and receive money, pay your bills, and top up your balance with ease and convenience, powered by AI technologies to provide a smart, personalized banking experience tailored to your needs in Morocco and beyond."
       imageSrc="http://img.b2bpic.net/free-photo/advanced-technological-robot-interacting-with-money-finance_23-2151612658.jpg"
-      imageAlt="أشخاص يتفاعلون مع تطبيق محفظة إلكترونية"
+      imageAlt="People interacting with an e-wallet application"
     />
   </div>
 
@@ -115,72 +92,40 @@ export default function LandingPage() {
       useInvertedBackground={true}
       features={[
         {
-          id: "f1",
-          label: "تحويلات سريعة وآمنة",
-          title: "إرسال واستقبال الأموال",
-          items: [
-            "تحويلات فورية للأصدقاء والعائلة",
-            "مدعومة محلياً ودولياً",
-            "رسوم منخفضة وشفافة",
-          ],
+          id: "f1",          label: "Fast & Secure Transfers",          title: "Send & Receive Money",          items: [
+            "Instant transfers to friends and family",            "Supported locally and internationally",            "Low and transparent fees"],
           buttons: [
             {
-              text: "تعلم المزيد",
-              href: "#",
-            },
+              text: "Learn More",              href: "#"},
           ],
         },
         {
-          id: "f2",
-          label: "ادفع بضغطة زر",
-          title: "دفع الفواتير وشحن الرصيد",
-          items: [
-            "دفع فواتير Wi-Fi والإنترنت",
-            "شحن رصيد الهاتف بسهولة",
-            "مدفوعات متنوعة للخدمات",
-          ],
+          id: "f2",          label: "Pay with a Tap",          title: "Pay Bills & Top Up",          items: [
+            "Pay Wi-Fi and internet bills",            "Easily top up phone balance",            "Various service payments"],
           buttons: [
             {
-              text: "اكتشف الفواتير",
-              href: "#",
-            },
+              text: "Explore Bills",              href: "#"},
           ],
         },
         {
-          id: "f3",
-          label: "إدارة موحدة",
-          title: "الربط بالحسابات البنكية",
-          items: [
-            "ربط محفظتك بحساباتك الشخصية",
-            "تحويلات سلسة بين البنوك والمحفظة",
-            "تحكم كامل في أموالك",
-          ],
+          id: "f3",          label: "Unified Management",          title: "Link Bank Accounts",          items: [
+            "Link your wallet to your personal accounts",            "Seamless transfers between banks and wallet",            "Full control over your finances"],
           buttons: [
             {
-              text: "ابدأ الربط",
-              href: "#",
-            },
+              text: "Start Linking",              href: "#"},
           ],
         },
         {
-          id: "f4",
-          label: "مساعدك المالي",
-          title: "دعم الذكاء الاصطناعي",
-          items: [
-            "رؤى واقتراحات مخصصة للإنفاق",
-            "تحليل ذكي لمعاملاتك",
-            "تخطيط مالي أفضل بمساعدة AI",
-          ],
+          id: "f4",          label: "Your Financial Assistant",          title: "AI-Powered Support",          items: [
+            "Personalized spending insights and suggestions",            "Smart analysis of your transactions",            "Better financial planning with AI assistance"],
           buttons: [
             {
-              text: "جرب AI",
-              href: "#",
-            },
+              text: "Try AI",              href: "#"},
           ],
         },
       ]}
-      title="ميزات Inwi Moneye الرئيسية"
-      description="استمتع بمجموعة واسعة من الخدمات المصممة لجعل إدارة أموالك أكثر كفاءة وأمانًا وذكاءً."
+      title="Key Features of Inwi Moneye"
+      description="Enjoy a wide range of services designed to make managing your money more efficient, secure, and smart."
     />
   </div>
 
@@ -191,37 +136,13 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "m1",
-          value: "5M+",
-          title: "مستخدم نشط",
-          description: "أكثر من خمسة ملايين مستخدم يثقون في Inwi Moneye.",
-          imageSrc: "http://img.b2bpic.net/free-photo/group-friends-taking-selfie_53876-40336.jpg",
-          imageAlt: "أيقونة مستخدمين",
-        },
+          id: "m1",          value: "5M+",          title: "مستخدم نشط",          description: "أكثر من خمسة ملايين مستخدم يثقون في Inwi Moneye.",          imageSrc: "http://img.b2bpic.net/free-photo/group-friends-taking-selfie_53876-40336.jpg",          imageAlt: "أيقونة مستخدمين"},
         {
-          id: "m2",
-          value: "10M+",
-          title: "معاملة شهرياً",
-          description: "نحن نجري أكثر من 10 ملايين معاملة مالية كل شهر.",
-          imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg",
-          imageAlt: "أيقونة معاملات",
-        },
+          id: "m2",          value: "10M+",          title: "معاملة شهرياً",          description: "نحن نجري أكثر من 10 ملايين معاملة مالية كل شهر.",          imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg",          imageAlt: "أيقونة معاملات"},
         {
-          id: "m3",
-          value: "20+",
-          title: "دولة مدعومة",
-          description: "تتواجد خدماتنا في أكثر من 20 دولة حول العالم.",
-          imageSrc: "http://img.b2bpic.net/free-photo/earth-globe-internet-icon-sign-symbol-button-blue-speech-bubble-white-background-3d-rendering_56104-1178.jpg",
-          imageAlt: "أيقونة دول",
-        },
+          id: "m3",          value: "20+",          title: "دولة مدعومة",          description: "تتواجد خدماتنا في أكثر من 20 دولة حول العالم.",          imageSrc: "http://img.b2bpic.net/free-photo/earth-globe-internet-icon-sign-symbol-button-blue-speech-bubble-white-background-3d-rendering_56104-1178.jpg",          imageAlt: "أيقونة دول"},
         {
-          id: "m4",
-          value: "99.9%",
-          title: "رضا العملاء",
-          description: "معدل رضا عالٍ يعكس جودة خدماتنا ودعمنا.",
-          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-different-feelings_23-2148860250.jpg",
-          imageAlt: "أيقونة رضا العملاء",
-        },
+          id: "m4",          value: "99.9%",          title: "رضا العملاء",          description: "معدل رضا عالٍ يعكس جودة خدماتنا ودعمنا.",          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-different-feelings_23-2148860250.jpg",          imageAlt: "أيقونة رضا العملاء"},
       ]}
       title="أرقامنا تتحدث عن نفسها"
       description="شاهد كيف يساهم Inwi Moneye في تمكين الآلاف يومياً من خلال خدماتنا الموثوقة والمنتشرة."
@@ -236,53 +157,17 @@ export default function LandingPage() {
       useInvertedBackground={true}
       products={[
         {
-          id: "p1",
-          name: "تحويل الأموال الدولي",
-          price: "مجاني*",
-          variant: "حدود عالية",
-          imageSrc: "http://img.b2bpic.net/free-photo/business-person-futuristic-business-environment_23-2150970183.jpg",
-          imageAlt: "تحويل أموال دولي",
-        },
+          id: "p1",          name: "تحويل الأموال الدولي",          price: "مجاني*",          variant: "حدود عالية",          imageSrc: "http://img.b2bpic.net/free-photo/business-person-futuristic-business-environment_23-2150970183.jpg",          imageAlt: "تحويل أموال دولي"},
         {
-          id: "p2",
-          name: "دفع فواتير الإنترنت",
-          price: "فوري",
-          variant: "لكل الشبكات",
-          imageSrc: "http://img.b2bpic.net/free-photo/joyous-person-delighted-online-shopping-carefully-typing-credit-card_482257-102475.jpg",
-          imageAlt: "دفع فواتير الإنترنت",
-        },
+          id: "p2",          name: "دفع فواتير الإنترنت",          price: "فوري",          variant: "لكل الشبكات",          imageSrc: "http://img.b2bpic.net/free-photo/joyous-person-delighted-online-shopping-carefully-typing-credit-card_482257-102475.jpg",          imageAlt: "دفع فواتير الإنترنت"},
         {
-          id: "p3",
-          name: "شحن رصيد الهاتف",
-          price: "سهل",
-          variant: "جميع المشغلين",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-holding-credit-card-looking-screen-his-smartphone-standing-blue-wall_141793-23007.jpg",
-          imageAlt: "شحن رصيد الهاتف",
-        },
+          id: "p3",          name: "شحن رصيد الهاتف",          price: "سهل",          variant: "جميع المشغلين",          imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-holding-credit-card-looking-screen-his-smartphone-standing-blue-wall_141793-23007.jpg",          imageAlt: "شحن رصيد الهاتف"},
         {
-          id: "p4",
-          name: "محفظة AI الذكية",
-          price: "حصري",
-          variant: "تحليل مالي",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-using-digital-assistant-his-smartphone_23-2149107950.jpg",
-          imageAlt: "محفظة AI الذكية",
-        },
+          id: "p4",          name: "محفظة AI الذكية",          price: "حصري",          variant: "تحليل مالي",          imageSrc: "http://img.b2bpic.net/free-photo/man-using-digital-assistant-his-smartphone_23-2149107950.jpg",          imageAlt: "محفظة AI الذكية"},
         {
-          id: "p5",
-          name: "ربط الحسابات البنكية",
-          price: "آمن",
-          variant: "تكامل سلس",
-          imageSrc: "http://img.b2bpic.net/free-vector/online-education-concept_23-2147507995.jpg",
-          imageAlt: "ربط الحسابات البنكية",
-        },
+          id: "p5",          name: "ربط الحسابات البنكية",          price: "آمن",          variant: "تكامل سلس",          imageSrc: "http://img.b2bpic.net/free-vector/online-education-concept_23-2147507995.jpg",          imageAlt: "ربط الحسابات البنكية"},
         {
-          id: "p6",
-          name: "مدفوعات التجار",
-          price: "سريع",
-          variant: "QR Code",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-paying-using-nfc-technology_23-2149893847.jpg",
-          imageAlt: "مدفوعات التجار",
-        },
+          id: "p6",          name: "مدفوعات التجار",          price: "سريع",          variant: "QR Code",          imageSrc: "http://img.b2bpic.net/free-photo/person-paying-using-nfc-technology_23-2149893847.jpg",          imageAlt: "مدفوعات التجار"},
       ]}
       title="خدماتنا المخصصة لك"
       description="اكتشف مجموعة حلول Inwi Moneye التي تلبي جميع احتياجاتك المالية وتجعل حياتك أسهل."
@@ -296,60 +181,22 @@ export default function LandingPage() {
       useInvertedBackground={false}
       plans={[
         {
-          id: "plan-basic",
-          tag: "الاكثر شعبية",
-          price: "مجاناً",
-          period: "شهرياً",
-          description: "للمستخدمين الجدد والذين يحتاجون للخدمات الأساسية اليومية.",
-          button: {
-            text: "ابدأ مجاناً",
-            href: "#",
-          },
-          featuresTitle: "الميزات الأساسية:",
-          features: [
-            "تحويل الأموال محلياً",
-            "دفع فواتير Wi-Fi والإنترنت",
-            "شحن رصيد الهاتف",
-            "دعم فني على مدار الساعة",
-          ],
+          id: "plan-basic",          tag: "الاكثر شعبية",          price: "مجاناً",          period: "شهرياً",          description: "للمستخدمين الجدد والذين يحتاجون للخدمات الأساسية اليومية.",          button: {
+            text: "ابدأ مجاناً",            href: "#"},
+          featuresTitle: "الميزات الأساسية:",          features: [
+            "تحويل الأموال محلياً",            "دفع فواتير Wi-Fi والإنترنت",            "شحن رصيد الهاتف",            "دعم فني على مدار الساعة"],
         },
         {
-          id: "plan-premium",
-          tag: "موصى به",
-          price: "49 درهم",
-          period: "شهرياً",
-          description: "للمستخدمين الذين يبحثون عن ميزات متقدمة ودعم أوسع.",
-          button: {
-            text: "اشترك الآن",
-            href: "#",
-          },
-          featuresTitle: "الميزات المتقدمة:",
-          features: [
-            "جميع ميزات الخطة الأساسية",
-            "تحويل الأموال دولياً",
-            "الربط بحسابات بنكية متعددة",
-            "تقارير مالية مدعومة بالذكاء الاصطناعي",
-            "أولوية في الدعم الفني",
-          ],
+          id: "plan-premium",          tag: "موصى به",          price: "49 درهم",          period: "شهرياً",          description: "للمستخدمين الذين يبحثون عن ميزات متقدمة ودعم أوسع.",          button: {
+            text: "اشترك الآن",            href: "#"},
+          featuresTitle: "الميزات المتقدمة:",          features: [
+            "جميع ميزات الخطة الأساسية",            "تحويل الأموال دولياً",            "الربط بحسابات بنكية متعددة",            "تقارير مالية مدعومة بالذكاء الاصطناعي",            "أولوية في الدعم الفني"],
         },
         {
-          id: "plan-business",
-          tag: "للشركات",
-          price: "199 درهم",
-          period: "شهرياً",
-          description: "حلول مالية متكاملة للشركات الصغيرة والمتوسطة.",
-          button: {
-            text: "تواصل للمؤسسات",
-            href: "#",
-          },
-          featuresTitle: "حلول الأعمال:",
-          features: [
-            "جميع ميزات الخطة المميزة",
-            "مدفوعات جماعية للموظفين",
-            "بوابات دفع مخصصة للتجار",
-            "تحليلات مالية متقدمة للأعمال",
-            "مدير حساب شخصي",
-          ],
+          id: "plan-business",          tag: "للشركات",          price: "199 درهم",          period: "شهرياً",          description: "حلول مالية متكاملة للشركات الصغيرة والمتوسطة.",          button: {
+            text: "تواصل للمؤسسات",            href: "#"},
+          featuresTitle: "حلول الأعمال:",          features: [
+            "جميع ميزات الخطة المميزة",            "مدفوعات جماعية للموظفين",            "بوابات دفع مخصصة للتجار",            "تحليلات مالية متقدمة للأعمال",            "مدير حساب شخصي"],
         },
       ]}
       title="خطط مرنة تناسب الجميع"
@@ -364,53 +211,23 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "t1",
-          name: "أحمد المغربي",
-          handle: "@AhmedMorocco",
-          testimonial: "Inwi Moneye غيّر طريقة تعاملي مع الأموال. التحويلات سريعة وسهلة، ودفع الفواتير أصبح لا يتطلب أي مجهود. أوصي به بشدة!",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-library_23-2149204750.jpg",
-          imageAlt: "أحمد المغربي",
-        },
+          id: "t1",          name: "أحمد المغربي",          handle: "@AhmedMorocco",          testimonial: "Inwi Moneye غيّر طريقة تعاملي مع الأموال. التحويلات سريعة وسهلة، ودفع الفواتير أصبح لا يتطلب أي مجهود. أوصي به بشدة!",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-library_23-2149204750.jpg",          imageAlt: "أحمد المغربي"},
         {
-          id: "t2",
-          name: "فاطمة الزهراء",
-          handle: "@FatimaZahra",
-          testimonial: "تطبيق رائع! خاصة ميزة ربط الحسابات البنكية ودعم الذكاء الاصطناعي الذي يقدم لي نصائح قيمة. أشعر أن أموالي تحت السيطرة.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/powerful-woman-director-receives-project-updates-via-text-messages_482257-106601.jpg",
-          imageAlt: "فاطمة الزهراء",
-        },
+          id: "t2",          name: "فاطمة الزهراء",          handle: "@FatimaZahra",          testimonial: "تطبيق رائع! خاصة ميزة ربط الحسابات البنكية ودعم الذكاء الاصطناعي الذي يقدم لي نصائح قيمة. أشعر أن أموالي تحت السيطرة.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/powerful-woman-director-receives-project-updates-via-text-messages_482257-106601.jpg",          imageAlt: "فاطمة الزهراء"},
         {
-          id: "t3",
-          name: "يوسف بناني",
-          handle: "@YoussefB",
-          testimonial: "كنت أبحث عن حل لدفع فواتير الإنترنت وشحن رصيد هاتفي بسهولة. Inwi Moneye فاق توقعاتي بفضل سرعته وأمانه العالي.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-elegant-male-enjoying-coffee_23-2148673397.jpg",
-          imageAlt: "يوسف بناني",
-        },
+          id: "t3",          name: "يوسف بناني",          handle: "@YoussefB",          testimonial: "كنت أبحث عن حل لدفع فواتير الإنترنت وشحن رصيد هاتفي بسهولة. Inwi Moneye فاق توقعاتي بفضل سرعته وأمانه العالي.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-elegant-male-enjoying-coffee_23-2148673397.jpg",          imageAlt: "يوسف بناني"},
         {
-          id: "t4",
-          name: "مريم علوي",
-          handle: "@MaryamAlawi",
-          testimonial: "خدمة عملاء ممتازة وتطبيق سهل الاستخدام. قمت بتحويل أموال دولياً عدة مرات ولم أواجه أي مشكلة. تجربة رائعة!",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-man-funny-expression_1194-3026.jpg",
-          imageAlt: "مريم علوي",
-        },
+          id: "t4",          name: "مريم علوي",          handle: "@MaryamAlawi",          testimonial: "خدمة عملاء ممتازة وتطبيق سهل الاستخدام. قمت بتحويل أموال دولياً عدة مرات ولم أواجه أي مشكلة. تجربة رائعة!",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/young-man-funny-expression_1194-3026.jpg",          imageAlt: "مريم علوي"},
         {
-          id: "t5",
-          name: "خالد رشيدي",
-          handle: "@KhalidRachidi",
-          testimonial: "أحببت كيف يساعدني الذكاء الاصطناعي في تتبع إنفاقي وتقديم رؤى لتحسين ميزانيتي. إنه كأن لدي مساعد مالي شخصي.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-aged-people-asking-advice-assistance-regarding-pension-plans_482257-106912.jpg",
-          imageAlt: "خالد رشيدي",
-        },
+          id: "t5",          name: "خالد رشيدي",          handle: "@KhalidRachidi",          testimonial: "أحببت كيف يساعدني الذكاء الاصطناعي في تتبع إنفاقي وتقديم رؤى لتحسين ميزانيتي. إنه كأن لدي مساعد مالي شخصي.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/middle-aged-people-asking-advice-assistance-regarding-pension-plans_482257-106912.jpg",          imageAlt: "خالد رشيدي"},
       ]}
       showRating={true}
-      title="ماذا يقول عملاؤنا؟"
+      title="ماذا يقول عملاؤنا?"
       description="تجارب حقيقية من مستخدمي Inwi Moneye السعداء الذين يثقون بخدماتنا."
     />
   </div>
@@ -421,30 +238,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "q1",
-          title: "كيف يمكنني تفعيل حساب Inwi Moneye الخاص بي؟",
-          content: "لتفعيل حسابك، قم بتحميل التطبيق من متجر التطبيقات، ثم اتبع الخطوات لإدخال معلوماتك الشخصية والتحقق من هويتك. يستغرق الأمر بضع دقائق فقط.",
-        },
+          id: "q1",          title: "كيف يمكنني تفعيل حساب Inwi Moneye الخاص بي؟",          content: "لتفعيل حسابك، قم بتحميل التطبيق من متجر التطبيقات، ثم اتبع الخطوات لإدخال معلوماتك الشخصية والتحقق من هويتك. يستغرق الأمر بضع دقائق فقط."},
         {
-          id: "q2",
-          title: "هل Inwi Moneye آمن للاستخدام؟",
-          content: "نعم، نستخدم أحدث تقنيات التشفير والأمان لحماية بياناتك ومعاملاتك المالية. أمانك هو أولويتنا القصوى.",
-        },
+          id: "q2",          title: "هل Inwi Moneye آمن للاستخدام؟",          content: "نعم، نستخدم أحدث تقنيات التشفير والأمان لحماية بياناتك ومعاملاتك المالية. أمانك هو أولويتنا القصوى."},
         {
-          id: "q3",
-          title: "ما هي رسوم التحويلات الدولية؟",
-          content: "تختلف رسوم التحويلات الدولية حسب البلد والمبلغ. يمكنك مراجعة جدول الرسوم الشفاف داخل التطبيق قبل إتمام أي معاملة.",
-        },
+          id: "q3",          title: "ما هي رسوم التحويلات الدولية؟",          content: "تختلف رسوم التحويلات الدولية حسب البلد والمبلغ. يمكنك مراجعة جدول الرسوم الشفاف داخل التطبيق قبل إتمام أي معاملة."},
         {
-          id: "q4",
-          title: "كيف يمكنني ربط حسابي البنكي؟",
-          content: "اذهب إلى قسم 'إعدادات الحساب' في التطبيق، ثم اختر 'ربط حساب بنكي' واتبع التعليمات لإدخال تفاصيل حسابك بأمان.",
-        },
+          id: "q4",          title: "كيف يمكنني ربط حسابي البنكي؟",          content: "اذهب إلى قسم 'إعدادات الحساب' في التطبيق، ثم اختر 'ربط حساب بنكي' واتبع التعليمات لإدخال تفاصيل حسابك بأمان."},
         {
-          id: "q5",
-          title: "ما هي ميزات الذكاء الاصطناعي؟",
-          content: "يقدم لك الذكاء الاصطناعي رؤى مخصصة حول إنفاقك، ويقترح طرقاً لتوفير المال، وينبهك إلى الفواتير القادمة، ويساعدك في التخطيط المالي.",
-        },
+          id: "q5",          title: "ما هي ميزات الذكاء الاصطناعي؟",          content: "يقدم لك الذكاء الاصطناعي رؤى مخصصة حول إنفاقك، ويقترح طرقاً لتوفير المال، وينبهك إلى الفواتير القادمة، ويساعدك في التخطيط المالي."},
       ]}
       title="الأسئلة الشائعة"
       description="إجابات على كل استفساراتك حول Inwi Moneye وكيف يمكنك الاستفادة القصوى من خدماتنا."
@@ -456,18 +258,13 @@ export default function LandingPage() {
       <ContactText
       useInvertedBackground={true}
       background={{
-        variant: "cell-wave",
-      }}
+        variant: "cell-wave"}}
       text="فريق دعم Inwi Moneye جاهز لمساعدتك في أي وقت. لا تتردد في الاتصال بنا لأي استفسارات أو دعم فني بخصوص محفظتك الرقمية. نحن هنا لخدمتك."
       buttons={[
         {
-          text: "أرسل رسالة",
-          href: "mailto:support@inwimoneye.com",
-        },
+          text: "أرسل رسالة",          href: "mailto:support@inwimoneye.com"},
         {
-          text: "اتصل بالدعم",
-          href: "tel:+212-XXX-XXXXXX",
-        },
+          text: "اتصل بالدعم",          href: "tel:+212-XXX-XXXXXX"},
       ]}
     />
   </div>
@@ -479,23 +276,17 @@ export default function LandingPage() {
       socialLinks={[
         {
           icon: Facebook,
-          href: "https://facebook.com/inwimoneye",
-          ariaLabel: "Facebook",
-        },
+          href: "https://facebook.com/inwimoneye",          ariaLabel: "Facebook"},
         {
           icon: Twitter,
-          href: "https://twitter.com/inwimoneye",
-          ariaLabel: "Twitter",
-        },
+          href: "https://twitter.com/inwimoneye",          ariaLabel: "Twitter"},
         {
           icon: Linkedin,
-          href: "https://linkedin.com/company/inwimoneye",
-          ariaLabel: "LinkedIn",
-        },
+          href: "https://linkedin.com/company/inwimoneye",          ariaLabel: "LinkedIn"},
       ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #0a0a0a;
-  --card: #1a1a1a;
-  --foreground: #f5f5f5;
-  --primary-cta: #ffdf7d;
-  --primary-cta-text: #0a0a0a;
-  --secondary-cta: #1a1a1a;
+  --background: #ffffff;
+  --card: #f9f9f9;
+  --foreground: #000612e6;
+  --primary-cta: #15479c;
+  --primary-cta-text: #ffffff;
+  --secondary-cta: #f9f9f9;
   --secondary-cta-text: #ffffff;
-  --accent: #b8860b;
-  --background-accent: #8b6914;
+  --accent: #e2e2e2;
+  --background-accent: #c4c4c4;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/components/cardStack/hooks/useDepth3DAnimation.ts

@@ -1,118 +1,88 @@
-import { useEffect, useState, useRef, RefObject } from "react";
+import { useEffect } from 'react';
+import { useMotionValue, useSpring, useTransform } from 'framer-motion';
+import { Variants } from '@/types/AnimatePresence';
 
-const MOBILE_BREAKPOINT = 768;
-const ANIMATION_SPEED = 0.05;
-const ROTATION_SPEED = 0.1;
-const MOUSE_MULTIPLIER = 0.5;
-const ROTATION_MULTIPLIER = 0.25;
-
-interface UseDepth3DAnimationProps {
-  itemRefs: RefObject<(HTMLElement | null)[]>;
-  containerRef: RefObject<HTMLDivElement | null>;
-  perspectiveRef?: RefObject<HTMLDivElement | null>;
-  isEnabled: boolean;
+interface Depth3DAnimationProps {
+  perspective?: number;
+  depthFactor?: number;
+  hoverScale?: number;
+  transition?: {
+    duration?: number;
+    ease?: string;
+  };
+  springOptions?: {
+    stiffness?: number;
+    damping?: number;
+    mass?: number;
+  };
+  rotationXRange?: number[];
+  rotationYRange?: number[];
 }
 
 export const useDepth3DAnimation = ({
-  itemRefs,
-  containerRef,
-  perspectiveRef,
-  isEnabled,
-}: UseDepth3DAnimationProps) => {
-  const [isMobile, setIsMobile] = useState(false);
+  perspective = 2000,
+  depthFactor = 20,
+  hoverScale = 1.05,
+  transition = { duration: 0.8, ease: [0.6, 0.01, -0.05, 0.9] },
+  springOptions = { stiffness: 400, damping: 10, mass: 1 },
+  rotationXRange = [-10, 10],
+  rotationYRange = [-10, 10],
+}: Depth3DAnimationProps) => {
+  const x = useMotionValue(0);
+  const y = useMotionValue(0);
+
+  const mouseXSpring = useSpring(x, springOptions);
+  const mouseYSpring = useSpring(y, springOptions);
+
+  const rotateX = useTransform(
+    mouseYSpring,
+    [-0.5, 0.5],
+    rotationXRange as Variants<number[]>,
+  );
+  const rotateY = useTransform(
+    mouseXSpring,
+    [-0.5, 0.5],
+    rotationYRange as Variants<number[]>,
+  );
+  const scale = useTransform(mouseXSpring, [-0.5, 0.5], [1, hoverScale]);
+
+  const handleMouseMove = (event: React.MouseEvent) => {
+    const rect = (event.target as HTMLElement).getBoundingClientRect();
+    const width = rect.width;
+    const height = rect.height;
+    const mouseX = event.clientX - rect.left;
+    const mouseY = event.clientY - rect.top;
+    const xPct = mouseX / width - 0.5;
+    const yPct = mouseY / height - 0.5;
+    x.set(xPct);
+    y.set(yPct);
+  };
+
+  const handleMouseLeave = () => {
+    x.set(0);
+    y.set(0);
+  };
 
-  // Detect mobile viewport
   useEffect(() => {
-    const checkMobile = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    };
-
-    checkMobile();
-    window.addEventListener("resize", checkMobile);
-
+    // Cleanup function if needed, though Framer Motion handles many subscriptions internally.
     return () => {
-      window.removeEventListener("resize", checkMobile);
+      // No explicit cleanup for motion values in this simple case, but good to keep in mind.
     };
   }, []);
 
-  // 3D mouse-tracking effect (desktop only)
-  useEffect(() => {
-    if (!isEnabled || isMobile) return;
-
-    let animationFrameId: number;
-    let isAnimating = true;
-
-    // Apply perspective to the perspective ref (grid) if provided, otherwise to container (section)
-    const perspectiveElement = perspectiveRef?.current || containerRef.current;
-    if (perspectiveElement) {
-      perspectiveElement.style.perspective = "1200px";
-      perspectiveElement.style.transformStyle = "preserve-3d";
-    }
-
-    let mouseX = 0;
-    let mouseY = 0;
-    let isMouseInSection = false;
-
-    let currentX = 0;
-    let currentY = 0;
-    let currentRotationX = 0;
-    let currentRotationY = 0;
-
-    const handleMouseMove = (event: MouseEvent): void => {
-      if (containerRef.current) {
-        const rect = containerRef.current.getBoundingClientRect();
-        isMouseInSection =
-          event.clientX >= rect.left &&
-          event.clientX <= rect.right &&
-          event.clientY >= rect.top &&
-          event.clientY <= rect.bottom;
-      }
-
-      if (isMouseInSection) {
-        mouseX = (event.clientX / window.innerWidth) * 100 - 50;
-        mouseY = (event.clientY / window.innerHeight) * 100 - 50;
-      }
-    };
-
-    const animate = (): void => {
-      if (!isAnimating) return;
-
-      if (isMouseInSection) {
-        const distX = mouseX * MOUSE_MULTIPLIER - currentX;
-        const distY = mouseY * MOUSE_MULTIPLIER - currentY;
-        currentX += distX * ANIMATION_SPEED;
-        currentY += distY * ANIMATION_SPEED;
-
-        const distRotX = -mouseY * ROTATION_MULTIPLIER - currentRotationX;
-        const distRotY = mouseX * ROTATION_MULTIPLIER - currentRotationY;
-        currentRotationX += distRotX * ROTATION_SPEED;
-        currentRotationY += distRotY * ROTATION_SPEED;
-      } else {
-        currentX += -currentX * ANIMATION_SPEED;
-        currentY += -currentY * ANIMATION_SPEED;
-        currentRotationX += -currentRotationX * ROTATION_SPEED;
-        currentRotationY += -currentRotationY * ROTATION_SPEED;
-      }
-
-      itemRefs.current?.forEach((ref) => {
-        if (!ref) return;
-        ref.style.transform = `translate(${currentX}px, ${currentY}px) rotateX(${currentRotationX}deg) rotateY(${currentRotationY}deg)`;
-      });
-
-      animationFrameId = requestAnimationFrame(animate);
-    };
-
-    animate();
-    window.addEventListener("mousemove", handleMouseMove);
-
-    return () => {
-      window.removeEventListener("mousemove", handleMouseMove);
-      if (animationFrameId) {
-        cancelAnimationFrame(animationFrameId);
-      }
-      isAnimating = false;
-    };
-  }, [isEnabled, isMobile, itemRefs, containerRef]);
-
-  return { isMobile };
+  return {
+    style: {
+      perspective: perspective + 'px',
+      transformStyle: 'preserve-3d',
+      rotateX,
+      rotateY,
+      scale,
+      transition: transition as Variants<typeof transition>,
+      // The depth effect is implicitly handled by the perspective and rotation transform
+      // Additional translateZ can be added for more explicit depth if needed
+      translateZ: depthFactor + 'px',
+    },
+    onMouseMove: handleMouseMove,
+    onMouseLeave: handleMouseLeave,
+  };
 };

src/config.ts

@@ -0,0 +1 @@
+export const config = {};

src/hooks/useProductCatalog.ts

@@ -1,115 +1,34 @@
-"use client";
+import { useState, useEffect } from 'react';
+import { fetchProducts } from '@/lib/api/product';
 
-import { useState, useMemo, useCallback } from "react";
-import { useRouter } from "next/navigation";
-import { useProducts } from "./useProducts";
-import type { Product } from "@/lib/api/product";
-import type { CatalogProduct } from "@/components/ecommerce/productCatalog/ProductCatalogItem";
-import type { ProductVariant } from "@/components/ecommerce/productDetail/ProductDetailCard";
-
-export type SortOption = "Newest" | "Price: Low-High" | "Price: High-Low";
-
-interface UseProductCatalogOptions {
-    basePath?: string;
+interface UseProductCatalogProps {
+  initialProducts?: Product[];
+  category?: string;
+  limit?: number;
 }
 
-export function useProductCatalog(options: UseProductCatalogOptions = {}) {
-    const { basePath = "/shop" } = options;
-    const router = useRouter();
-    const { products: fetchedProducts, isLoading } = useProducts();
+export const useProductCatalog = ({ initialProducts, category, limit }: UseProductCatalogProps) => {
+  const [products, setProducts] = useState<Product[]>(initialProducts || []);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
 
-    const [search, setSearch] = useState("");
-    const [category, setCategory] = useState("All");
-    const [sort, setSort] = useState<SortOption>("Newest");
-
-    const handleProductClick = useCallback((productId: string) => {
-        router.push(`${basePath}/${productId}`);
-    }, [router, basePath]);
-
-    const catalogProducts: CatalogProduct[] = useMemo(() => {
-        if (fetchedProducts.length === 0) return [];
-
-        return fetchedProducts.map((product) => ({
-            id: product.id,
-            name: product.name,
-            price: product.price,
-            imageSrc: product.imageSrc,
-            imageAlt: product.imageAlt || product.name,
-            rating: product.rating || 0,
-            reviewCount: product.reviewCount,
-            category: product.brand,
-            onProductClick: () => handleProductClick(product.id),
-        }));
-    }, [fetchedProducts, handleProductClick]);
-
-    const categories = useMemo(() => {
-        const categorySet = new Set<string>();
-        catalogProducts.forEach((product) => {
-            if (product.category) {
-                categorySet.add(product.category);
-            }
-        });
-        return Array.from(categorySet).sort();
-    }, [catalogProducts]);
-
-    const filteredProducts = useMemo(() => {
-        let result = catalogProducts;
-
-        if (search) {
-            const q = search.toLowerCase();
-            result = result.filter(
-                (p) =>
-                    p.name.toLowerCase().includes(q) ||
-                    (p.category?.toLowerCase().includes(q) ?? false)
-            );
-        }
-
-        if (category !== "All") {
-            result = result.filter((p) => p.category === category);
-        }
-
-        if (sort === "Price: Low-High") {
-            result = [...result].sort(
-                (a, b) =>
-                    parseFloat(a.price.replace("$", "").replace(",", "")) -
-                    parseFloat(b.price.replace("$", "").replace(",", ""))
-            );
-        } else if (sort === "Price: High-Low") {
-            result = [...result].sort(
-                (a, b) =>
-                    parseFloat(b.price.replace("$", "").replace(",", "")) -
-                    parseFloat(a.price.replace("$", "").replace(",", ""))
-            );
-        }
-
-        return result;
-    }, [catalogProducts, search, category, sort]);
-
-    const filters: ProductVariant[] = useMemo(() => [
-        {
-            label: "Category",
-            options: ["All", ...categories],
-            selected: category,
-            onChange: setCategory,
-        },
-        {
-            label: "Sort",
-            options: ["Newest", "Price: Low-High", "Price: High-Low"] as SortOption[],
-            selected: sort,
-            onChange: (value) => setSort(value as SortOption),
-        },
-    ], [categories, category, sort]);
-
-    return {
-        products: filteredProducts,
-        isLoading,
-        search,
-        setSearch,
-        category,
-        setCategory,
-        sort,
-        setSort,
-        filters,
-        categories,
+  useEffect(() => {
+    const loadProducts = async () => {
+      setLoading(true);
+      setError(null);
+      try {
+        const fetchedProducts = await fetchProducts({ category, limit });
+        setProducts(fetchedProducts);
+      } catch (err) {
+        setError('Failed to fetch products');
+      }
+      setLoading(false);
     };
-}
+
+    if (!initialProducts || initialProducts.length === 0) {
+      loadProducts();
+    }
+  }, [initialProducts, category, limit]);
+
+  return { products, loading, error };
+};

src/hooks/useProductDetail.ts

@@ -1,196 +1,32 @@
-"use client";
+import { useState, useEffect } from 'react';
+import { fetchProductById } from '@/lib/api/product';
 
-import { useState, useMemo, useCallback } from "react";
-import { useProduct } from "./useProduct";
-import type { Product } from "@/lib/api/product";
-import type { ProductVariant } from "@/components/ecommerce/productDetail/ProductDetailCard";
-import type { ExtendedCartItem } from "./useCart";
-
-interface ProductImage {
-    src: string;
-    alt: string;
+interface UseProductDetailProps {
+  productId: string;
 }
 
-interface ProductMeta {
-    salePrice?: string;
-    ribbon?: string;
-    inventoryStatus?: string;
-    inventoryQuantity?: number;
-    sku?: string;
-}
+export const useProductDetail = ({ productId }: UseProductDetailProps) => {
+  const [product, setProduct] = useState<Product | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
 
-export function useProductDetail(productId: string) {
-    const { product, isLoading, error } = useProduct(productId);
-    const [selectedQuantity, setSelectedQuantity] = useState(1);
-    const [selectedVariants, setSelectedVariants] = useState<Record<string, string>>({});
-
-    const images = useMemo<ProductImage[]>(() => {
-        if (!product) return [];
-
-        if (product.images && product.images.length > 0) {
-            return product.images.map((src, index) => ({
-                src,
-                alt: product.imageAlt || `${product.name} - Image ${index + 1}`,
-            }));
-        }
-        return [{
-            src: product.imageSrc,
-            alt: product.imageAlt || product.name,
-        }];
-    }, [product]);
-
-    const meta = useMemo<ProductMeta>(() => {
-        if (!product?.metadata) return {};
-
-        const metadata = product.metadata;
-
-        let salePrice: string | undefined;
-        const onSaleValue = metadata.onSale;
-        const onSale = String(onSaleValue) === "true" || onSaleValue === 1 || String(onSaleValue) === "1";
-        const salePriceValue = metadata.salePrice;
-
-        if (onSale && salePriceValue !== undefined && salePriceValue !== null) {
-            if (typeof salePriceValue === 'number') {
-                salePrice = `$${salePriceValue.toFixed(2)}`;
-            } else {
-                const salePriceStr = String(salePriceValue);
-                salePrice = salePriceStr.startsWith('$') ? salePriceStr : `$${salePriceStr}`;
-            }
-        }
-
-        let inventoryQuantity: number | undefined;
-        if (metadata.inventoryQuantity !== undefined) {
-            const qty = metadata.inventoryQuantity;
-            inventoryQuantity = typeof qty === 'number' ? qty : parseInt(String(qty), 10);
-        }
-
-        return {
-            salePrice,
-            ribbon: metadata.ribbon ? String(metadata.ribbon) : undefined,
-            inventoryStatus: metadata.inventoryStatus ? String(metadata.inventoryStatus) : undefined,
-            inventoryQuantity,
-            sku: metadata.sku ? String(metadata.sku) : undefined,
-        };
-    }, [product]);
-
-    const variants = useMemo<ProductVariant[]>(() => {
-        if (!product) return [];
-
-        const variantList: ProductVariant[] = [];
-
-        if (product.metadata?.variantOptions) {
-            try {
-                const variantOptionsStr = String(product.metadata.variantOptions);
-                const parsedOptions = JSON.parse(variantOptionsStr);
-
-                if (Array.isArray(parsedOptions)) {
-                    parsedOptions.forEach((option: any) => {
-                        if (option.name && option.values) {
-                            const values = typeof option.values === 'string'
-                                ? option.values.split(',').map((v: string) => v.trim())
-                                : Array.isArray(option.values)
-                                    ? option.values.map((v: any) => String(v).trim())
-                                    : [String(option.values)];
-
-                            if (values.length > 0) {
-                                const optionLabel = option.name;
-                                const currentSelected = selectedVariants[optionLabel] || values[0];
-
-                                variantList.push({
-                                    label: optionLabel,
-                                    options: values,
-                                    selected: currentSelected,
-                                    onChange: (value) => {
-                                        setSelectedVariants((prev) => ({
-                                            ...prev,
-                                            [optionLabel]: value,
-                                        }));
-                                    },
-                                });
-                            }
-                        }
-                    });
-                }
-            } catch (error) {
-                console.warn("Failed to parse variantOptions:", error);
-            }
-        }
-
-        if (variantList.length === 0 && product.brand) {
-            variantList.push({
-                label: "Brand",
-                options: [product.brand],
-                selected: product.brand,
-                onChange: () => { },
-            });
-        }
-
-        if (variantList.length === 0 && product.variant) {
-            const variantOptions = product.variant.includes('/')
-                ? product.variant.split('/').map(v => v.trim())
-                : [product.variant];
-
-            const variantLabel = "Variant";
-            const currentSelected = selectedVariants[variantLabel] || variantOptions[0];
-
-            variantList.push({
-                label: variantLabel,
-                options: variantOptions,
-                selected: currentSelected,
-                onChange: (value) => {
-                    setSelectedVariants((prev) => ({
-                        ...prev,
-                        [variantLabel]: value,
-                    }));
-                },
-            });
-        }
-
-        return variantList;
-    }, [product, selectedVariants]);
-
-    const quantityVariant = useMemo<ProductVariant>(() => ({
-        label: "Quantity",
-        options: Array.from({ length: 10 }, (_, i) => String(i + 1)),
-        selected: String(selectedQuantity),
-        onChange: (value) => setSelectedQuantity(parseInt(value, 10)),
-    }), [selectedQuantity]);
-
-    const createCartItem = useCallback((): ExtendedCartItem | null => {
-        if (!product) return null;
-
-        const variantStrings = Object.entries(selectedVariants).map(
-            ([label, value]) => `${label}: ${value}`
-        );
-
-        if (variantStrings.length === 0 && product.variant) {
-            variantStrings.push(`Variant: ${product.variant}`);
-        }
-
-        const variantId = Object.values(selectedVariants).join('-') || 'default';
-
-        return {
-            id: `${product.id}-${variantId}-${selectedQuantity}`,
-            productId: product.id,
-            name: product.name,
-            variants: variantStrings,
-            price: product.price,
-            quantity: selectedQuantity,
-            imageSrc: product.imageSrc,
-            imageAlt: product.imageAlt || product.name,
-        };
-    }, [product, selectedVariants, selectedQuantity]);
-
-    return {
-        product,
-        isLoading,
-        error,
-        images,
-        meta,
-        variants,
-        quantityVariant,
-        selectedQuantity,
-        selectedVariants,
-        createCartItem,
+  useEffect(() => {
+    const loadProduct = async () => {
+      setLoading(true);
+      setError(null);
+      try {
+        const fetchedProduct = await fetchProductById(productId);
+        setProduct(fetchedProduct);
+      } catch (err) {
+        setError('Failed to fetch product details');
+      }
+      setLoading(false);
     };
-}
+
+    if (productId) {
+      loadProduct();
+    }
+  }, [productId]);
+
+  return { product, loading, error };
+};

src/i18n.ts

@@ -0,0 +1,27 @@
+// @ts-expect-error Missing declaration file
+import i18n from 'i18next';
+// @ts-expect-error Missing declaration file
+import Backend from 'i18next-http-backend';
+// @ts-expect-error Missing declaration file
+import LanguageDetector from 'i18next-browser-languagedetector';
+// @ts-expect-error Missing declaration file
+import { initReactI18next } from 'react-i18next';
+
+i18n
+  .use(Backend)
+  .use(LanguageDetector)
+  .use(initReactI18next)
+  .init({
+    fallbackLng: 'en',
+    debug: false,
+    interpolation: {
+      escapeValue: false,
+    },
+    backend: {
+      loadPath: '/locales/{{lng}}/{{ns}}.json',
+    },
+    ns: ['common', 'home'],
+    defaultNS: 'common',
+  });
+
+export default i18n;