worked on on the pages

Reviewed-on: PriyanshuVishwakarma/Wdipl-react#3

components/ClientLogos.tsx

@@ -1,5 +1,6 @@
 import { motion } from "framer-motion";
 import { GridPattern } from "./GridPattern";
+import Flag from 'react-world-flags';
 
 const companyLogos = [
   { name: "TechFlow Solutions", logo: null, width: "140" },
@@ -38,90 +39,97 @@ const companyLogos = [
   { name: "InnovateLab", logo: null, width: "120" }
 ];
 
-const countryFlags = [
+// const countryFlags = [
-  {
+//   {
-    name: "United States",
+//     name: "United States",
-    alt: "United States flag icon",
+//     alt: "United States flag icon",
-    flagSvg: (
+//     flagSvg: (
-      <svg viewBox="0 0 24 18" className="w-8 h-6">
+//       <svg viewBox="0 0 24 18" className="w-8 h-6">
-        <rect width="24" height="18" fill="#B22234"/>
+//         <rect width="24" height="18" fill="#B22234"/>
-        <rect width="24" height="1.38" y="1.38" fill="white"/>
+//         <rect width="24" height="1.38" y="1.38" fill="white"/>
-        <rect width="24" height="1.38" y="4.15" fill="white"/>
+//         <rect width="24" height="1.38" y="4.15" fill="white"/>
-        <rect width="24" height="1.38" y="6.92" fill="white"/>
+//         <rect width="24" height="1.38" y="6.92" fill="white"/>
-        <rect width="24" height="1.38" y="9.69" fill="white"/>
+//         <rect width="24" height="1.38" y="9.69" fill="white"/>
-        <rect width="24" height="1.38" y="12.46" fill="white"/>
+//         <rect width="24" height="1.38" y="12.46" fill="white"/>
-        <rect width="24" height="1.38" y="15.23" fill="white"/>
+//         <rect width="24" height="1.38" y="15.23" fill="white"/>
-        <rect width="9.6" height="9.69" fill="#3C3B6E"/>
+//         <rect width="9.6" height="9.69" fill="#3C3B6E"/>
-      </svg>
+//       </svg>
-    )
+//     )
-  },
+//   },
-  {
+//   {
-    name: "United Kingdom",
+//     name: "United Kingdom",
-    alt: "United Kingdom flag icon",
+//     alt: "United Kingdom flag icon",
-    flagSvg: (
+//     flagSvg: (
-      <svg viewBox="0 0 24 18" className="w-8 h-6">
+//       <svg viewBox="0 0 24 18" className="w-8 h-6">
-        <rect width="24" height="18" fill="#012169"/>
+//         <rect width="24" height="18" fill="#012169"/>
-        <path d="M0 0L24 18M24 0L0 18" stroke="white" strokeWidth="2"/>
+//         <path d="M0 0L24 18M24 0L0 18" stroke="white" strokeWidth="2"/>
-        <path d="M0 0L24 18M24 0L0 18" stroke="#C8102E" strokeWidth="1"/>
+//         <path d="M0 0L24 18M24 0L0 18" stroke="#C8102E" strokeWidth="1"/>
-        <path d="M12 0V18M0 9H24" stroke="white" strokeWidth="3"/>
+//         <path d="M12 0V18M0 9H24" stroke="white" strokeWidth="3"/>
-        <path d="M12 0V18M0 9H24" stroke="#C8102E" strokeWidth="2"/>
+//         <path d="M12 0V18M0 9H24" stroke="#C8102E" strokeWidth="2"/>
-      </svg>
+//       </svg>
-    )
+//     )
-  },
+//   },
-  {
+//   {
-    name: "India",
+//     name: "India",
-    alt: "India flag icon",
+//     alt: "India flag icon",
-    flagSvg: (
+//     flagSvg: (
-      <svg viewBox="0 0 24 18" className="w-8 h-6">
+//       <svg viewBox="0 0 24 18" className="w-8 h-6">
-        <rect width="24" height="6" fill="#FF9933"/>
+//         <rect width="24" height="6" fill="#FF9933"/>
-        <rect width="24" height="6" y="6" fill="white"/>
+//         <rect width="24" height="6" y="6" fill="white"/>
-        <rect width="24" height="6" y="12" fill="#138808"/>
+//         <rect width="24" height="6" y="12" fill="#138808"/>
-        <circle cx="12" cy="9" r="2" fill="none" stroke="#000080" strokeWidth="0.3"/>
+//         <circle cx="12" cy="9" r="2" fill="none" stroke="#000080" strokeWidth="0.3"/>
-        <g transform="translate(12,9)">
+//         <g transform="translate(12,9)">
-          {Array.from({length: 24}, (_, i) => (
+//           {Array.from({length: 24}, (_, i) => (
-            <line key={i} x1="0" y1="-1.5" x2="0" y2="-1.8" stroke="#000080" strokeWidth="0.1" transform={`rotate(${i * 15})`}/>
+//             <line key={i} x1="0" y1="-1.5" x2="0" y2="-1.8" stroke="#000080" strokeWidth="0.1" transform={`rotate(${i * 15})`}/>
-          ))}
+//           ))}
-        </g>
+//         </g>
-      </svg>
+//       </svg>
-    )
+//     )
-  },
+//   },
-  {
+//   {
-    name: "Canada",
+//     name: "Canada",
-    alt: "Canada flag icon",
+//     alt: "Canada flag icon",
-    flagSvg: (
+//     flagSvg: (
-      <svg viewBox="0 0 24 18" className="w-8 h-6">
+//       <svg viewBox="0 0 24 18" className="w-8 h-6">
-        <rect width="6" height="18" fill="#FF0000"/>
+//         <rect width="6" height="18" fill="#FF0000"/>
-        <rect width="12" height="18" x="6" fill="white"/>
+//         <rect width="12" height="18" x="6" fill="white"/>
-        <rect width="6" height="18" x="18" fill="#FF0000"/>
+//         <rect width="6" height="18" x="18" fill="#FF0000"/>
-        <path d="M12 4L13 7H16L13.5 9L14.5 12L12 10L9.5 12L10.5 9L8 7H11L12 4Z" fill="#FF0000"/>
+//         <path d="M12 4L13 7H16L13.5 9L14.5 12L12 10L9.5 12L10.5 9L8 7H11L12 4Z" fill="#FF0000"/>
-      </svg>
+//       </svg>
-    )
+//     )
-  },
+//   },
-  {
+//   {
-    name: "Australia",
+//     name: "Australia",
-    alt: "Australia flag icon",
+//     alt: "Australia flag icon",
-    flagSvg: (
+//     flagSvg: (
-      <svg viewBox="0 0 24 18" className="w-8 h-6">
+//       <svg viewBox="0 0 24 18" className="w-8 h-6">
-        <rect width="24" height="18" fill="#012169"/>
+//         <rect width="24" height="18" fill="#012169"/>
-        <g transform="scale(0.5)">
+//         <g transform="scale(0.5)">
-          <rect width="24" height="9" fill="#012169"/>
+//           <rect width="24" height="9" fill="#012169"/>
-          <path d="M0 0L24 18M24 0L0 18" stroke="white" strokeWidth="2"/>
+//           <path d="M0 0L24 18M24 0L0 18" stroke="white" strokeWidth="2"/>
-          <path d="M0 0L24 18M24 0L0 18" stroke="#C8102E" strokeWidth="1"/>
+//           <path d="M0 0L24 18M24 0L0 18" stroke="#C8102E" strokeWidth="1"/>
-          <path d="M12 0V18M0 9H24" stroke="white" strokeWidth="3"/>
+//           <path d="M12 0V18M0 9H24" stroke="white" strokeWidth="3"/>
-          <path d="M12 0V18M0 9H24" stroke="#C8102E" strokeWidth="2"/>
+//           <path d="M12 0V18M0 9H24" stroke="#C8102E" strokeWidth="2"/>
-        </g>
+//         </g>
-        <g fill="white">
+//         <g fill="white">
-          <circle cx="18" cy="6" r="0.5"/>
+//           <circle cx="18" cy="6" r="0.5"/>
-          <circle cx="20" cy="8" r="0.3"/>
+//           <circle cx="20" cy="8" r="0.3"/>
-          <circle cx="19" cy="10" r="0.4"/>
+//           <circle cx="19" cy="10" r="0.4"/>
-          <circle cx="21" cy="12" r="0.3"/>
+//           <circle cx="21" cy="12" r="0.3"/>
-          <circle cx="18" cy="14" r="0.5"/>
+//           <circle cx="18" cy="14" r="0.5"/>
-        </g>
+//         </g>
-      </svg>
+//       </svg>
-    )
+//     )
-  }
+//   }
-];
+// ];
 
+const countryFlags = [
+  { name: "United States", code: "US", alt: "United States flag" },
+  { name: "United Kingdom", code: "GB", alt: "United Kingdom flag" },
+  { name: "India", code: "IN", alt: "India flag" },
+  { name: "Canada", code: "CA", alt: "Canada flag" },
+  { name: "Australia", code: "AU", alt: "Australia flag" }
+];
 const ProjectImageCircles = () => (
   <motion.div
     initial={{ opacity: 0, y: 20 }}
@@ -136,15 +144,15 @@ const ProjectImageCircles = () => (
           key={index}
           initial={{ opacity: 0, scale: 0 }}
           whileInView={{ opacity: 1, scale: 1 }}
-          transition={{ 
+          transition={{
-            duration: 0.5, 
+            duration: 0.5,
             delay: 0.5 + (index * 0.1),
             type: "spring",
-            stiffness: 200 
+            stiffness: 200
           }}
           viewport={{ once: true }}
-          whileHover={{ 
+          whileHover={{
-            scale: 1.1, 
+            scale: 1.1,
             zIndex: 10,
             transition: { duration: 0.2 }
           }}
@@ -154,19 +162,20 @@ const ProjectImageCircles = () => (
             zIndex: countryFlags.length - index
           }}
         >
+          {/* Circular container */}
           <div className="absolute inset-0 flex items-center justify-center w-16 h-16 overflow-hidden transition-all duration-300 border-2 rounded-full shadow-lg bg-white/10 backdrop-blur-sm border-white/20 group-hover:border-accent/50 group-hover:bg-white/15 group-hover:shadow-xl">
-            <div 
+            <div
               className="flex items-center justify-center w-10 h-8 transition-transform duration-300 transform group-hover:scale-110"
-              role="img" 
+              role="img"
               aria-label={flag.alt}
             >
-              {flag.flagSvg}
+              <Flag code={flag.code} style={{ width: '40px', height: '30px' }} />
             </div>
           </div>
-          
+
           {/* Subtle glow effect */}
           <div className="absolute inset-0 w-16 h-16 transition-opacity duration-300 rounded-full opacity-0 bg-gradient-to-br from-accent/10 to-transparent group-hover:opacity-100"></div>
-          
+
           {/* Tooltip */}
           <div className="absolute -top-12 left-1/2 transform -translate-x-1/2 bg-[#0E0E0E] text-white text-xs px-3 py-1.5 rounded-lg opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg border border-white/10 z-50">
             <div className="text-center">
@@ -181,7 +190,7 @@ const ProjectImageCircles = () => (
 );
 
 const LogoCard = ({ name, width }: { name: string; width: string }) => (
-  <div 
+  <div
     className="flex items-center justify-center h-16 px-6 transition-all duration-300 border shadow-lg bg-white/8 rounded-xl border-white/10 hover:scale-105 hover:bg-white/12 hover:border-accent/20 backdrop-blur-sm group"
     style={{ minWidth: `${width}px` }}
   >
@@ -219,7 +228,7 @@ export const ClientLogos = () => {
   return (
     <section className="relative py-20 bg-[#121212] border-y border-white/5 overflow-hidden">
       <GridPattern strokeDasharray="4 2" />
-      
+
       <div className="container relative z-10 px-6 mx-auto lg:px-8">
         <motion.div
           initial={{ opacity: 0, y: 30 }}
@@ -232,10 +241,10 @@ export const ClientLogos = () => {
             Trusted by Founders and CTOs Across 15+ Countries
           </h2>
         </motion.div>
-        
+
         {/* Project Image Circles */}
         <ProjectImageCircles />
-        
+
         {/* Company Logos Ticker */}
         <div className="overflow-hidden">
           <MarqueeRow logos={companyLogos} />

components/FeaturedCaseStudies.tsx

@@ -185,7 +185,7 @@ const FeaturedCaseStudies = () => {
             Featured Success Stories
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-gray-300">
-            Discover how we've helped companies across industries achieve remarkable results with our innovative development solutions.
+            Discover how AI mobile app development transformed companies across industries, delivering remarkable engagement and business results through innovative solutions.
           </p>
         </motion.div>
 
@@ -250,11 +250,11 @@ const FeaturedCaseStudies = () => {
                           >
                             <div className="flex items-center gap-3">
                               <div className={`w-10 h-10 rounded-lg bg-gradient-to-r ${study.accentColor === 'blue' ? 'from-blue-500 to-cyan-500' :
-                                  study.accentColor === 'green' ? 'from-green-500 to-emerald-500' :
+                                study.accentColor === 'green' ? 'from-green-500 to-emerald-500' :
-                                    study.accentColor === 'purple' ? 'from-purple-500 to-pink-500' :
+                                  study.accentColor === 'purple' ? 'from-purple-500 to-pink-500' :
-                                      study.accentColor === 'cyan' ? 'from-cyan-500 to-blue-500' :
+                                    study.accentColor === 'cyan' ? 'from-cyan-500 to-blue-500' :
-                                        study.accentColor === 'orange' ? 'from-orange-500 to-red-500' :
+                                      study.accentColor === 'orange' ? 'from-orange-500 to-red-500' :
-                                          'from-emerald-500 to-teal-500'
+                                        'from-emerald-500 to-teal-500'
                                 } flex items-center justify-center flex-shrink-0`}>
                                 <AchievementIcon className="w-5 h-5 text-white" />
                               </div>
@@ -346,8 +346,13 @@ const FeaturedCaseStudies = () => {
           <h3 className="mb-12 text-3xl font-semibold text-center text-white lg:text-4xl">
             More Success Stories
           </h3>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
 
-          <div className="grid items-stretch gap-8 lg:grid-cols-3">
+            Explore additional triumphs where AI-powered features revolutionized user engagement and drove exponential growth for diverse enterprises.
+
+          </p>
+          <div className="grid items-stretch gap-8 lg:grid-cols-3" style={{ marginTop: "25px" }}
+          >
             {moreSuccessStories.map((story, index) => {
               const AchievementIcon = story.keyAchievement.icon;
 
@@ -361,6 +366,7 @@ const FeaturedCaseStudies = () => {
                   className="h-full group"
                 >
                   <Card
+
                     className="bg-gray-900/50 backdrop-blur-md border-gray-800 hover:border-accent/30 transition-all duration-500 shadow-lg hover:shadow-2xl rounded-2xl overflow-hidden h-full group-hover:scale-[1.02] transform flex flex-col cursor-pointer"
                     onClick={() => {
                       if (story.title === 'TradersCircuit') {
@@ -397,11 +403,11 @@ const FeaturedCaseStudies = () => {
                             >
                               <div className="flex items-center gap-3">
                                 <div className={`w-10 h-10 rounded-lg bg-gradient-to-r ${story.accentColor === 'blue' ? 'from-blue-500 to-cyan-500' :
-                                    story.accentColor === 'green' ? 'from-green-500 to-emerald-500' :
+                                  story.accentColor === 'green' ? 'from-green-500 to-emerald-500' :
-                                      story.accentColor === 'purple' ? 'from-purple-500 to-pink-500' :
+                                    story.accentColor === 'purple' ? 'from-purple-500 to-pink-500' :
-                                        story.accentColor === 'cyan' ? 'from-cyan-500 to-blue-500' :
+                                      story.accentColor === 'cyan' ? 'from-cyan-500 to-blue-500' :
-                                          story.accentColor === 'orange' ? 'from-orange-500 to-red-500' :
+                                        story.accentColor === 'orange' ? 'from-orange-500 to-red-500' :
-                                            'from-emerald-500 to-teal-500'
+                                          'from-emerald-500 to-teal-500'
                                   } flex items-center justify-center flex-shrink-0`}>
                                   <AchievementIcon className="w-5 h-5 text-white" />
                                 </div>

components/HeroSection.tsx

@@ -70,7 +70,8 @@ export function HeroSection() {
               animate={{ opacity: 1, y: 0 }}
               transition={{ duration: 0.8, delay: 0.3 }}
             >
-              Architecting Digital Success for Startups & Enterprises
+              {/* Architecting Digital Success for Startups & Enterprises */}
+              Mobile application developers for Startups & Enterprises
             </motion.h1>
 
             <motion.p

components/HorizontalTagScroller.tsx

@@ -1,10 +1,10 @@
 import { motion } from "framer-motion";
-import { 
+import {
-  CreditCard, 
+  CreditCard,
-  Heart, 
+  Heart,
-  ShoppingCart, 
+  ShoppingCart,
-  GraduationCap, 
+  GraduationCap,
-  Truck, 
+  Truck,
   Video,
   Building,
   Plane,
@@ -34,13 +34,13 @@ const industries = [
   { name: "SaaS", icon: Cloud, link: "/industries/financial-services/wealthtech-platforms" }
 ];
 
-const IndustryCard = ({ industry, index, onClick }: { 
+const IndustryCard = ({ industry, index, onClick }: {
-  industry: { name: string; icon: any; link: string }; 
+  industry: { name: string; icon: any; link: string };
   index: number;
   onClick: (link: string) => void;
 }) => {
   const Icon = industry.icon;
-  
+
   return (
     <motion.div
       initial={{ opacity: 0, y: 30 }}
@@ -71,7 +71,7 @@ export const HorizontalTagScroller = () => {
   return (
     <section className="relative py-20 bg-[#0E0E0E] overflow-hidden">
       <GridPattern strokeDasharray="4 2" />
-      
+
       <div className="relative z-10 container mx-auto px-6 lg:px-8">
         <motion.div
           initial={{ opacity: 0, y: 30 }}
@@ -84,15 +84,16 @@ export const HorizontalTagScroller = () => {
             Tailored Solutions for Your Industry
           </h2>
           <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
-            We serve diverse industries with specialized expertise and domain knowledge
+            {/* We serve diverse industries with specialized expertise and domain knowledge */}
+            We serve diverse industries with specialized expertise in AI mobile app development and domain knowledge.
           </p>
         </motion.div>
-        
+
         <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 max-w-7xl mx-auto">
           {industries.map((industry, index) => (
-            <IndustryCard 
+            <IndustryCard
-              key={industry.name} 
+              key={industry.name}
-              industry={industry} 
+              industry={industry}
               index={index}
               onClick={handleIndustryClick}
             />

components/Navigation.tsx

@@ -461,7 +461,13 @@ const navigationData = {
     { text: "Careers", icon: Briefcase, href: "/company/careers" },
   ],
   resources: [
-    { text: "Blogs", icon: BookOpen, href: "/resources/blog" },
+    {
+      text: "Blogs",
+      icon: BookOpen,
+      href: "https://www.wdipl.com/blog",
+      target: "_blank",
+      rel: "noopener noreferrer"
+    },
     { text: "Portfolio", icon: FileText, href: "/case-studies" },
     {
       text: "Client Testimonials",
@@ -615,11 +621,15 @@ const MegaMenu = ({
   timeoutRef,
 }: MegaMenuProps) => {
   const navigate = useNavigate();
-  
+
   if (!isOpen) return null;
 
-  const handleNavigate = (path: string) => {
+  const handleNavigate = (path: string, target?: string) => {
-    navigate(path);
+    if (target === "_blank") {
+      window.open(path, "_blank", "noopener,noreferrer");
+    } else {
+      navigate(path);
+    }
     onClose();
   };
 
@@ -639,7 +649,7 @@ const MegaMenu = ({
                   className="font-semibold text-white text-sm cursor-pointer hover:text-[#E5195E] transition-colors"
                   onClick={(e) => {
                     e.preventDefault();
-                    service.href && handleNavigate(service.href);
+                    handleNavigate(service.href);
                   }}
                 >
                   {service.category}
@@ -653,7 +663,7 @@ const MegaMenu = ({
                       className="text-[#CCCCCC] hover:text-white text-sm transition-colors duration-200 block py-1 hover:translate-x-1 transform text-left w-full"
                       onClick={(e) => {
                         e.preventDefault();
-                        subService.href && handleNavigate(subService.href);
+                        handleNavigate(subService.href);
                       }}
                     >
                       {subService.name}
@@ -685,7 +695,7 @@ const MegaMenu = ({
                   className="font-semibold text-white text-lg cursor-pointer hover:text-[#E5195E] transition-colors"
                   onClick={(e) => {
                     e.preventDefault();
-                    category.href && handleNavigate(category.href);
+                    handleNavigate(category.href);
                   }}
                 >
                   {category.category}
@@ -699,7 +709,7 @@ const MegaMenu = ({
                       className="text-[#CCCCCC] hover:text-white text-sm transition-colors duration-200 block py-1 hover:translate-x-1 transform text-left w-full"
                       onClick={(e) => {
                         e.preventDefault();
-                        service.href && handleNavigate(service.href);
+                        handleNavigate(service.href);
                       }}
                     >
                       {service.name}
@@ -727,7 +737,7 @@ const MegaMenu = ({
               className="flex items-center gap-4 text-[#CCCCCC] hover:text-white transition-all duration-200 p-4 rounded-lg hover:bg-white/5 group w-full text-left"
               onClick={(e) => {
                 e.preventDefault();
-                solution.href && handleNavigate(solution.href);
+                handleNavigate(solution.href);
               }}
             >
               <div className="w-8 h-8 rounded-lg bg-[#E5195E]/20 flex items-center justify-center group-hover:scale-110 transition-transform">
@@ -765,7 +775,7 @@ const MegaMenu = ({
                       className="text-[#CCCCCC] hover:text-white text-sm transition-colors duration-200 block py-1 hover:translate-x-1 transform text-left w-full"
                       onClick={(e) => {
                         e.preventDefault();
-                        item.href && handleNavigate(item.href);
+                        handleNavigate(item.href);
                       }}
                     >
                       {item.name}
@@ -790,10 +800,12 @@ const MegaMenu = ({
             <a
               key={item.text}
               href={item.href}
+              target={item.target || "_self"}
+              rel={item.rel || ""}
               className="flex items-center gap-4 text-[#CCCCCC] hover:text-white transition-all duration-200 p-4 rounded-lg hover:bg-white/5 group w-full text-left"
               onClick={(e) => {
                 e.preventDefault();
-                item.href && handleNavigate(item.href);
+                handleNavigate(item.href, item.target);
               }}
             >
               <div className="w-8 h-8 rounded-lg bg-[#E5195E]/20 flex items-center justify-center group-hover:scale-110 transition-transform">
@@ -969,8 +981,12 @@ export const Navigation = () => {
     }
   };
 
-  const handleNavigation = (path: string) => {
+  const handleNavigation = (path: string, target?: string) => {
-    navigate(path);
+    if (target === "_blank") {
+      window.open(path, "_blank", "noopener,noreferrer");
+    } else {
+      navigate(path);
+    }
     setIsMobileMenuOpen(false);
     setActiveMenu(null);
   };
@@ -1014,9 +1030,8 @@ export const Navigation = () => {
                   {item}
                   {hasDropdown(item) && (
                     <ChevronDown
-                      className={`w-4 h-4 transition-transform duration-200 ${
+                      className={`w-4 h-4 transition-transform duration-200 ${activeMenu === item ? "rotate-180" : ""
-                        activeMenu === item ? "rotate-180" : ""
+                        }`}
-                      }`}
                     />
                   )}
                 </a>
@@ -1029,7 +1044,8 @@ export const Navigation = () => {
               onClick={() => handleNavigation("/start-a-project")}
               className="hidden lg:flex"
             >
-              Get Started
+              {/* Get Started */}
+              Contact Us
             </Button>
 
             {/* Mobile Menu Button */}
@@ -1084,11 +1100,32 @@ export const Navigation = () => {
                     {item}
                   </a>
                 ))}
+
+                {/* Mobile Resources Submenu */}
+                <div className="pl-4 space-y-2 border-l-2 border-[#E5195E]/30">
+                  {navigationData.resources.map((resource) => (
+                    <a
+                      key={resource.text}
+                      href={resource.href}
+                      target={resource.target || "_self"}
+                      rel={resource.rel || ""}
+                      className="block text-[#CCCCCC] hover:text-white transition-colors py-1 text-sm text-left w-full"
+                      onClick={(e) => {
+                        e.preventDefault();
+                        handleNavigation(resource.href, resource.target);
+                      }}
+                    >
+                      {resource.text} {resource.target === "_blank" && "↗"}
+                    </a>
+                  ))}
+                </div>
+
                 <Button
                   onClick={() => handleNavigation("/start-a-project")}
                   className="w-full mt-4"
                 >
-                  Get Started
+                  {/* Get Started */}
+                  Contact Us
                 </Button>
               </div>
             </div>

components/PackagesSection.tsx

@@ -15,29 +15,46 @@ const packages: Package[] = [
     icon: <Tablet className="w-8 h-8" />,
     title: "The Blueprint",
     timeline: "Product Definition in 1 Week",
-    priceRange: "$1,500 - $2,500",
+    // priceRange: "$1,500 - $2,500",
+    priceRange: "",
     features: [
+      // "Strategy & roadmap",
+      // "User flows & wireframes",
+      // "Technical architecture"
       "Strategy & roadmap",
       "User flows & wireframes",
-      "Technical architecture"
+      "Technical architecture",
+      "The Prototype",
+      "Working Demo in 2 Weeks"
+
     ]
   },
   {
     icon: <Rocket className="w-8 h-8" />,
     title: "The Prototype",
     timeline: "Working Demo in 2 Weeks",
-    priceRange: "$6,000 - $8,000",
+    // priceRange: "$6,000 - $8,000",
+    priceRange: "",
+
     features: [
+      // "Functional web or mobile prototype",
+      // "Core features implemented",
+      // "User testing ready"
       "Functional web or mobile prototype",
       "Core features implemented",
-      "User testing ready"
+      "User testing ready",
+      "The Launchpad",
+      "Market-Ready MVP in 6 Weeks"
+
     ]
   },
   {
     icon: <Crown className="w-8 h-8" />,
     title: "The Launchpad",
     timeline: "Market-Ready MVP in 6 Weeks",
-    priceRange: "$20,000 - $30,000",
+    // priceRange: "$20,000 - $30,000",
+    priceRange: "",
+
     features: [
       "Full website or app",
       "SEO-optimized & scalable",
@@ -50,7 +67,7 @@ export const PackagesSection = () => {
   return (
     <section className="relative py-20 bg-background overflow-hidden">
       <GridPattern strokeDasharray="4 2" />
-      
+
       <div className="relative z-10 container mx-auto px-6 lg:px-8">
         <motion.div
           initial={{ opacity: 0, y: 30 }}
@@ -63,7 +80,7 @@ export const PackagesSection = () => {
             Choose Your Speed. We'll Deliver Your Launch.
           </h2>
         </motion.div>
-        
+
         <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-7xl mx-auto">
           {packages.map((pkg, index) => (
             <motion.div
@@ -78,22 +95,22 @@ export const PackagesSection = () => {
               <div className="mb-6 inline-flex items-center justify-center w-16 h-16 rounded-full bg-accent/10 text-accent group-hover:bg-accent/20 group-hover:scale-110 transition-all duration-300">
                 {pkg.icon}
               </div>
-              
+
               {/* Title */}
               <h3 className="text-2xl font-semibold text-foreground mb-2 group-hover:text-accent transition-colors duration-300">
                 {pkg.title}
               </h3>
-              
+
               {/* Timeline */}
               <p className="text-muted-foreground mb-4">
                 {pkg.timeline}
               </p>
-              
+
               {/* Price Range */}
               <div className="text-3xl font-semibold text-foreground mb-8">
                 {pkg.priceRange}
               </div>
-              
+
               {/* Features List */}
               <ul className="space-y-4">
                 {pkg.features.map((feature, idx) => (

components/ProcessSection.tsx

@@ -75,16 +75,14 @@ const ChatSimulation = ({
           whileInView={{ opacity: 1, x: 0 }}
           transition={{ duration: 0.5, delay: index * 0.3 }}
           viewport={{ once: true }}
-          className={`flex ${
+          className={`flex ${message.from === "You" ? "justify-start" : "justify-end"
-            message.from === "You" ? "justify-start" : "justify-end"
+            }`}
-          }`}
         >
           <div
-            className={`max-w-[80%] px-3 py-1.5 rounded-lg ${
+            className={`max-w-[80%] px-3 py-1.5 rounded-lg ${message.from === "You"
-              message.from === "You"
+              ? "bg-muted border border-border text-foreground"
-                ? "bg-muted border border-border text-foreground"
+              : "bg-accent text-accent-foreground"
-                : "bg-accent text-accent-foreground"
+              }`}
-            }`}
           >
             <div className="text-xs font-medium mb-1 opacity-70">
               {message.from}
@@ -276,9 +274,8 @@ export const ProcessSection = () => {
             viewport={{ once: true }}
             className="text-muted-foreground text-xl max-w-2xl mx-auto"
           >
-            Our proven process transforms your vision into reality through
+            Our proven process transforms your vision into reality through strategic planning, AI-powered design, and expert iOS mobile app development every step of the way.
-            strategic planning, thoughtful design, and expert engineering—every
+
-            step of the way.
           </motion.p>
         </div>
 

components/ResourceCards.tsx

@@ -157,8 +157,10 @@ export const ResourceCards = () => {
             Insights for Founders & Product Leaders
           </h2>
           <p className="text-muted-foreground text-lg max-w-2xl mx-auto">
-            Learn from our experience building 200+ digital products. Practical
+            {/* Learn from our experience building 200+ digital products. Practical
-            insights, real case studies, and actionable strategies.
+            insights, real case studies, and actionable strategies. */}
+            Learn from our experience building 200+ digital products, including AI mobile apps. Practical insights, real case studies, and actionable strategies.
+
           </p>
         </motion.div>
 

components/SplitCallToAction.tsx

@@ -9,7 +9,7 @@ export const SplitCallToAction = () => {
   return (
     <section className="relative py-20 overflow-hidden">
       <GridPattern strokeDasharray="4 2" />
-      
+
       <div className="relative z-10 container mx-auto px-6 lg:px-8">
         <div className="grid lg:grid-cols-2 gap-16 items-center max-w-6xl mx-auto">
           {/* Left Content */}
@@ -25,10 +25,10 @@ export const SplitCallToAction = () => {
                 Ready to Build with WDI?
               </h2>
               <p className="text-xl text-muted-foreground leading-relaxed mb-8">
-                Schedule a no-commitment discovery call with our consulting team. Let's discuss your vision and create a roadmap to success.
+                Schedule a no-commitment discovery call with our consulting team. Let's discuss your AI mobile app vision and create a roadmap to success.
               </p>
             </div>
-            
+
             <div className="space-y-6">
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 bg-white/10 backdrop-blur-sm rounded-lg border border-white/20 flex items-center justify-center">
@@ -39,7 +39,7 @@ export const SplitCallToAction = () => {
                   <div className="text-muted-foreground text-sm">No sales pitch, just honest advice</div>
                 </div>
               </div>
-              
+
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 bg-white/10 backdrop-blur-sm rounded-lg border border-white/20 flex items-center justify-center">
                   <Clock className="w-6 h-6 text-accent" />
@@ -49,7 +49,7 @@ export const SplitCallToAction = () => {
                   <div className="text-muted-foreground text-sm">Available across all time zones</div>
                 </div>
               </div>
-              
+
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 bg-white/10 backdrop-blur-sm rounded-lg border border-white/20 flex items-center justify-center">
                   <Zap className="w-6 h-6 text-accent" />
@@ -61,7 +61,7 @@ export const SplitCallToAction = () => {
               </div>
             </div>
           </motion.div>
-          
+
           {/* Right CTA */}
           <motion.div
             initial={{ opacity: 0, x: 50 }}
@@ -82,10 +82,10 @@ export const SplitCallToAction = () => {
                   Let's discuss your project and explore how we can help you succeed.
                 </p>
               </div>
-              
+
               <div className="space-y-8">
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
                   className="w-full bg-accent hover:bg-accent/90 text-accent-foreground py-4 text-lg border-0 rounded-lg"
                   onClick={() => navigate('/start-a-project')}
                 >
@@ -93,7 +93,7 @@ export const SplitCallToAction = () => {
                   Schedule Free Call
                 </Button>
               </div>
-              
+
               <div className="mt-8 pt-8 border-t border-border">
                 <div className="grid grid-cols-3 gap-4 text-center text-sm">
                   <div>

package-lock.json

@@ -56,6 +56,7 @@
         "react-responsive-masonry": "^2.7.1",
         "react-router-dom": "^7.6.3",
         "react-slick": "^0.30.3",
+        "react-world-flags": "^1.6.0",
         "recharts": "^2.15.4",
         "slick-carousel": "^1.8.1",
         "sonner": "^2.0.3",
@@ -142,7 +143,6 @@
       "integrity": "sha512-UlLAnTPrFdNGoFtbSXwcGFQBtQZJCNjaN6hQNP3UPvuNXT1i82N26KL3dZeIpNalWywr9IuQuncaAfUaS1g6sQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
         "@babel/code-frame": "^7.27.1",
@@ -3172,7 +3172,6 @@
       "integrity": "sha512-Qm9OYVOFHFYg3wJoTSrz80hoec5Lia/dPp84do3X7dZvLikQvM1YpmvTBEdIr/e+U8HTkFjLHLnl78K/qjf+jQ==",
       "devOptional": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "undici-types": "~7.8.0"
       }
@@ -3190,7 +3189,6 @@
       "integrity": "sha512-/LDXMQh55EzZQ0uVAZmKKhfENivEvWz6E+EYzh+/MCjMhNsotd+ZHhBGIjFDTi6+fz0OhQQQLbTgdQIxxCsC0w==",
       "devOptional": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/prop-types": "*",
         "csstype": "^3.0.2"
@@ -3202,7 +3200,6 @@
       "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
       "devOptional": true,
       "license": "MIT",
-      "peer": true,
       "peerDependencies": {
         "@types/react": "^18.0.0"
       }
@@ -3295,7 +3292,6 @@
       "integrity": "sha512-tbsV1jPne5CkFQCgPBcDOt30ItF7aJoZL997JSF7MhGQqOeT3svWRYxiqlfA5RUdlHN6Fi+EI9bxqbdyAUZjYQ==",
       "dev": true,
       "license": "BSD-2-Clause",
-      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "6.21.0",
         "@typescript-eslint/types": "6.21.0",
@@ -3486,7 +3482,6 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -3647,6 +3642,12 @@
       "integrity": "sha512-cRygWd7kGBQO3VEhPiTgq4Wc43ctsM+o46urrmPOiuAe+07fzlSB9OJVdpgDL0jPqXUVQ9ht7aq7kxOeJHRK+w==",
       "license": "MIT"
     },
+    "node_modules/boolbase": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
+      "license": "ISC"
+    },
     "node_modules/brace-expansion": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
@@ -3690,7 +3691,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "caniuse-lite": "^1.0.30001726",
         "electron-to-chromium": "^1.5.173",
@@ -4071,6 +4071,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/commander": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
+      "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10"
+      }
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -4116,6 +4125,80 @@
         "node": ">= 8"
       }
     },
+    "node_modules/css-select": {
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.2.2.tgz",
+      "integrity": "sha512-TizTzUddG/xYLA3NXodFM0fSbNizXjOKhqiQQwvhlspadZokn1KDy0NZFS0wuEubIYAV5/c1/lAr0TaaFXEXzw==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0",
+        "css-what": "^6.1.0",
+        "domhandler": "^5.0.2",
+        "domutils": "^3.0.1",
+        "nth-check": "^2.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/css-tree": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
+      "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.0.30",
+        "source-map-js": "^1.0.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
+    "node_modules/css-what": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.2.2.tgz",
+      "integrity": "sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">= 6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/csso": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/csso/-/csso-5.0.5.tgz",
+      "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==",
+      "license": "MIT",
+      "dependencies": {
+        "css-tree": "~2.2.0"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0",
+        "npm": ">=7.0.0"
+      }
+    },
+    "node_modules/csso/node_modules/css-tree": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz",
+      "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==",
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.0.28",
+        "source-map-js": "^1.0.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0",
+        "npm": ">=7.0.0"
+      }
+    },
+    "node_modules/csso/node_modules/mdn-data": {
+      "version": "2.0.28",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz",
+      "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==",
+      "license": "CC0-1.0"
+    },
     "node_modules/csstype": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
@@ -4366,6 +4449,61 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/dom-serializer": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
+      "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==",
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.2",
+        "entities": "^4.2.0"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+      }
+    },
+    "node_modules/domelementtype": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/domhandler": {
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
+      "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "domelementtype": "^2.3.0"
+      },
+      "engines": {
+        "node": ">= 4"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domhandler?sponsor=1"
+      }
+    },
+    "node_modules/domutils": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-3.2.2.tgz",
+      "integrity": "sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "dom-serializer": "^2.0.0",
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domutils?sponsor=1"
+      }
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.182",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.182.tgz",
@@ -4377,8 +4515,7 @@
       "version": "8.6.0",
       "resolved": "https://registry.npmjs.org/embla-carousel/-/embla-carousel-8.6.0.tgz",
       "integrity": "sha512-SjWyZBHJPbqxHOzckOfo8lHisEaJWmwd23XppYFYVh10bU66/Pn5tkVkbkCMZVdbUE5eTCI2nD8OyIP4Z+uwkA==",
-      "license": "MIT",
+      "license": "MIT"
-      "peer": true
     },
     "node_modules/embla-carousel-react": {
       "version": "8.6.0",
@@ -4421,6 +4558,18 @@
       "integrity": "sha512-/KujNpO+PT63F7Hlpu4h3pE3TokKRHN26JYmQpPyjkRD/N57R7bPDNojMXdi7uveAKjYB7yQnartCxZnFWr0Xw==",
       "license": "MIT"
     },
+    "node_modules/entities": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
@@ -4489,7 +4638,6 @@
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -5599,6 +5747,12 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/mdn-data": {
+      "version": "2.0.30",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
+      "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
+      "license": "CC0-1.0"
+    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -5749,6 +5903,18 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/nth-check": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
+      "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/nth-check?sponsor=1"
+      }
+    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -5763,6 +5929,7 @@
       "resolved": "https://registry.npmjs.org/on-change/-/on-change-4.0.2.tgz",
       "integrity": "sha512-cMtCyuJmTx/bg2HCpHo3ZLeF7FZnBOapLqZHr2AlLeJ5Ul0Zu2mUJJz051Fdwu/Et2YW04ZD+TtU+gVy0ACNCA==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
       },
@@ -5921,7 +6088,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
@@ -6001,7 +6167,6 @@
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
       "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0"
       },
@@ -6067,7 +6232,6 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
       "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "scheduler": "^0.23.2"
@@ -6133,7 +6297,6 @@
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
       "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/use-sync-external-store": "^0.0.6",
         "use-sync-external-store": "^1.4.0"
@@ -6333,6 +6496,20 @@
         "react-dom": ">=16.6.0"
       }
     },
+    "node_modules/react-world-flags": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/react-world-flags/-/react-world-flags-1.6.0.tgz",
+      "integrity": "sha512-eutSeAy5YKoVh14js/JUCSlA6EBk1n4k+bDaV+NkNB50VhnG+f4QDTpYycnTUTsZ5cqw/saPmk0Z4Fa0VVZ1Iw==",
+      "license": "MIT",
+      "dependencies": {
+        "svg-country-flags": "^1.2.10",
+        "svgo": "^3.0.2",
+        "world-countries": "^5.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=0.14"
+      }
+    },
     "node_modules/recharts": {
       "version": "2.15.4",
       "resolved": "https://registry.npmjs.org/recharts/-/recharts-2.15.4.tgz",
@@ -6375,8 +6552,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
       "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
-      "license": "MIT",
+      "license": "MIT"
-      "peer": true
     },
     "node_modules/redux-thunk": {
       "version": "3.1.0",
@@ -6500,6 +6676,15 @@
         "queue-microtask": "^1.2.2"
       }
     },
+    "node_modules/sax": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-1.6.0.tgz",
+      "integrity": "sha512-6R3J5M4AcbtLUdZmRv2SygeVaM7IhrLXu9BmnOGmmACak8fiUtOsYNWUS4uK7upbmHIBbLBeFeI//477BKLBzA==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=11.0.0"
+      }
+    },
     "node_modules/scheduler": {
       "version": "0.23.2",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
@@ -6526,7 +6711,8 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz",
       "integrity": "sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/set-cookie-parser": {
       "version": "2.7.1",
@@ -6646,6 +6832,37 @@
         "node": ">=8"
       }
     },
+    "node_modules/svg-country-flags": {
+      "version": "1.2.10",
+      "resolved": "https://registry.npmjs.org/svg-country-flags/-/svg-country-flags-1.2.10.tgz",
+      "integrity": "sha512-xrqwo0TYf/h2cfPvGpjdSuSguUbri4vNNizBnwzoZnX0xGo3O5nGJMlbYEp7NOYcnPGBm6LE2axqDWSB847bLw==",
+      "license": "PD"
+    },
+    "node_modules/svgo": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/svgo/-/svgo-3.3.3.tgz",
+      "integrity": "sha512-+wn7I4p7YgJhHs38k2TNjy1vCfPIfLIJWR5MnCStsN8WuuTcBnRKcMHQLMM2ijxGZmDoZwNv8ipl5aTTen62ng==",
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^7.2.0",
+        "css-select": "^5.1.0",
+        "css-tree": "^2.3.1",
+        "css-what": "^6.1.0",
+        "csso": "^5.0.5",
+        "picocolors": "^1.0.0",
+        "sax": "^1.5.0"
+      },
+      "bin": {
+        "svgo": "bin/svgo"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/svgo"
+      }
+    },
     "node_modules/tailwind-merge": {
       "version": "2.6.0",
       "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.6.0.tgz",
@@ -6660,8 +6877,7 @@
       "version": "4.1.11",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.11.tgz",
       "integrity": "sha512-2E9TBm6MDD/xKYe+dvJZAmg3yxIEDNRc0jwlNyDg/4Fil2QcSLjFKGVff0lAf1jjeaArlG/M75Ey/EYr/OJtBA==",
-      "license": "MIT",
+      "license": "MIT"
-      "peer": true
     },
     "node_modules/tailwindcss-animate": {
       "version": "1.0.7",
@@ -6846,7 +7062,6 @@
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
       "dev": true,
       "license": "Apache-2.0",
-      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -7002,7 +7217,6 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.19.tgz",
       "integrity": "sha512-qO3aKv3HoQC8QKiNSTuUM1l9o/XX3+c+VTgLHbJWHZGeTPVAg2XwazI9UWzoxjIJCGCV2zU60uqMzjeLZuULqA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "esbuild": "^0.21.3",
         "postcss": "^8.4.43",
@@ -7083,6 +7297,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/world-countries": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/world-countries/-/world-countries-5.1.0.tgz",
+      "integrity": "sha512-CXR6EBvTbArDlDDIWU3gfKb7Qk0ck2WNZ234b/A0vuecPzIfzzxH+O6Ejnvg1sT8XuiZjVlzOH0h08ZtaO7g0w=="
+    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

package.json

@@ -58,6 +58,7 @@
     "react-responsive-masonry": "^2.7.1",
     "react-router-dom": "^7.6.3",
     "react-slick": "^0.30.3",
+    "react-world-flags": "^1.6.0",
     "recharts": "^2.15.4",
     "slick-carousel": "^1.8.1",
     "sonner": "^2.0.3",

pages/APIBackendDevelopment.tsx

@@ -126,8 +126,7 @@ const APIHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Building powerful, scalable, and secure backend infrastructure
+                Building powerful, scalable, and secure backend infrastructure enhanced by AI mobile app technology to fuel your web, mobile, and IoT applications.
-                and APIs to fuel your web, mobile, and IoT applications.
               </p>
             </div>
 
@@ -485,6 +484,12 @@ const APIBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             The Foundation of Your Digital Success
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+            WDI's robust AI mobile app backend powers seamless scalability and security, forming the unbreakable core for your web, mobile, and IoT applications.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -620,6 +625,13 @@ const APIProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Methodical Approach to Backend Excellence
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI employs a proven methodology, from architecture design and API development to AI app development company security protocols, ensuring scalable, high-performance backends for your digital ecosystem.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -774,6 +786,14 @@ const APIServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Specialized Backend Development Services
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI delivers comprehensive AI-powered features including RESTful APIs, microservices architecture, cloud deployment, and database optimization for enterprise-grade performance.
+
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1017,8 +1037,7 @@ const APITechStack = () => {
             Building Secure and High-Performance Backends
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            With industry-leading technologies that ensure scalability,
+            With industry-leading technologies enhanced by AI iOS development that ensure scalability, security, and reliability for mission-critical applications.
-            security, and reliability.
           </p>
         </motion.div>
 
@@ -1306,6 +1325,13 @@ const APICaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Robust Backends Powering Digital Innovation
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI engineers scalable AI-powered features that deliver predictive scaling, automated monitoring, and intelligent optimization for unmatched digital performance.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1517,8 +1543,7 @@ const HireBackendDevelopers = () => {
             Hire Specialized Backend & API Developers
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access our pool of expert backend engineers proficient in various
+            Access WDI's pool of expert iOS mobile app development engineers proficient in Node.js, Python, MongoDB, AWS, and seamless cloud integrations.
-            languages, databases, and cloud platforms.
           </p>
         </motion.div>
 
@@ -1721,8 +1746,7 @@ const APIFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Ensure your applications are fast, secure, and scalable with our
+            Ensure your applications are fast, secure, and scalable with our expert AI-powered design API and backend development services.
-            expert API and backend development services.
           </motion.p>
 
           <motion.div

pages/AdminPanelsDashboards.tsx

@@ -129,9 +129,7 @@ const AdminHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Empower your team with custom, data-rich admin interfaces and
+                Empower your team with custom, data-rich admin interfaces enhanced by AI mobile app features for streamlined operations, reporting, and management.
-                dashboards for streamlined operations, reporting, and
-                management.
               </p>
             </div>
 
@@ -475,6 +473,13 @@ const AdminBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Choose a Bespoke Admin Panel from WDI?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI delivers fully customized AI mobile app admin panels offering superior scalability, real-time insights, and role-based security for seamless eCommerce management.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -604,6 +609,12 @@ const AdminProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Approach to Building Your Operational Command Center
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+            WDI follows a discovery-design-develop-deploy methodology enhanced by AI mobile app insights to create intuitive, scalable admin panels that optimize your eCommerce operations.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -745,6 +756,13 @@ const AdminServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Specialized Admin & Dashboard Solutions
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI delivers tailored AI mobile app-powered admin panels with real-time analytics, role-based access, and seamless integrations for optimized eCommerce control.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1128,6 +1146,13 @@ const AdminCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Streamlined Operations with WDI-Built Admin Panels
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI's custom admin panels with AI mobile app integration deliver real-time insights, automated workflows, and intuitive controls for peak eCommerce efficiency.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1316,7 +1341,7 @@ const HireDevelopers = () => {
             Need Expert Developers for Your Admin Panel?
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Our developers specialize in creating powerful and scalable admin interfaces with robust backend systems and seamless integrations.
+            Our AI mobile app developers specialize in creating powerful, scalable admin interfaces with robust backend systems and seamless integrations.
           </p>
         </motion.div>
 
@@ -1514,8 +1539,7 @@ const AdminFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Transform your internal operations with efficient, data-driven
+            Transform your internal operations with efficient, data-driven dashboards enhanced by AI mobile app technology and advanced management systems.
-            dashboards and management systems.
           </motion.p>
 
           <motion.div

pages/AmbleProject.tsx

@@ -4,6 +4,7 @@ import { Footer } from "../components/Footer";
 import { Button } from "../components/ui/button";
 import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
+import ambleImg from "../assets/amble.png"
 import { ArrowRight, Calendar, Users, Smartphone, Globe, Check, Star, TrendingUp, MapPin, Shield, Navigation as NavigationIcon, Zap, Heart, Target, AlertCircle, Clock, UserCheck } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { useNavigate } from "react-router-dom";
@@ -13,7 +14,7 @@ export const AmbleProject = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background relative overflow-hidden">
         <div className="absolute inset-0 bg-gradient-to-br from-[#E5195E]/5 via-transparent to-transparent" />
@@ -26,11 +27,11 @@ export const AmbleProject = () => {
                   Navigation App Case Study
                 </Badge>
               </div>
-              
+
               <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope">
                 Amble App
               </h1>
-              
+
               <p className="text-xl text-muted-foreground mb-8 font-manrope">
                 Accessible Navigation & Community Engagement App - Making urban exploration easier and more inclusive for everyone
               </p>
@@ -86,7 +87,7 @@ export const AmbleProject = () => {
 
               {/* CTA Buttons */}
               <div className="flex flex-col sm:flex-row gap-4">
-                <Button 
+                <Button
                   size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
                   onClick={() => navigate('/start-a-project')}
@@ -94,7 +95,7 @@ export const AmbleProject = () => {
                   Build Your Navigation App
                   <ArrowRight className="w-5 h-5 ml-2" />
                 </Button>
-                <Button 
+                <Button
                   size="lg"
                   variant="outline"
                   className="border-white/20 text-white hover:bg-white/10 font-manrope"
@@ -107,8 +108,8 @@ export const AmbleProject = () => {
 
             <div className="relative">
               <div className="aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10">
-                <ImageWithFallback 
+                <ImageWithFallback
-                  src="/images/amble-app-mockup.jpg"
+                  src={ambleImg}
                   alt="Amble Navigation App"
                   className="w-full h-full object-cover rounded-lg"
                 />
@@ -138,7 +139,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Overview</h2>
-            
+
             <div className="grid md:grid-cols-3 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -179,7 +180,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Scope</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Core Features</h3>
@@ -227,7 +228,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Challenges & Solution Architecture</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12 mb-16">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Technical Challenges</h3>
@@ -312,38 +313,38 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Development Process & Methodology</h2>
-            
+
             <div className="mb-12">
               <div className="text-center mb-8">
                 <p className="text-lg text-muted-foreground font-manrope">
                   <strong>Agile</strong> (weekly sprints) with weekly sprint planning, mid-sprint QA cycles for early bug detection, and client demos at the end of each sprint
                 </p>
               </div>
-              
+
               <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
                 {[
-                  { 
+                  {
-                    phase: "Discovery & Planning", 
+                    phase: "Discovery & Planning",
                     duration: "2 weeks",
                     description: "Feature prioritization, UI/UX wireframing, technical feasibility review"
                   },
-                  { 
+                  {
-                    phase: "Design & Prototyping", 
+                    phase: "Design & Prototyping",
                     duration: "3 weeks",
                     description: "Mobile UI design for both platforms, map interface prototypes"
                   },
-                  { 
+                  {
-                    phase: "Core Development", 
+                    phase: "Core Development",
                     duration: "6 weeks",
                     description: "Walking route module, event listing module, user authentication and profiles"
                   },
-                  { 
+                  {
-                    phase: "Integration & Testing", 
+                    phase: "Integration & Testing",
                     duration: "4 weeks",
                     description: "Google Maps API integration, push notifications setup, offline mode implementation"
                   },
-                  { 
+                  {
-                    phase: "Launch & Handover", 
+                    phase: "Launch & Handover",
                     duration: "1 week",
                     description: "App store submission, documentation and client training"
                   }
@@ -374,7 +375,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Key Features & Functionality</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
               {[
                 {
@@ -426,7 +427,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Results & Impact</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
               {[
                 { label: "GPS Accuracy", value: "±6m", icon: MapPin, desc: "average accuracy" },
@@ -486,7 +487,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Lessons Learned & Best Practices</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -551,7 +552,7 @@ export const AmbleProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-8 text-center font-manrope">Future Roadmap</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -602,7 +603,7 @@ export const AmbleProject = () => {
               Create accessible, inclusive mobile applications that empower users to explore and navigate their world with confidence.
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <Button 
+              <Button
                 size="lg"
                 className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
                 onClick={() => navigate('/start-a-project')}
@@ -610,7 +611,7 @@ export const AmbleProject = () => {
                 Start Your Project
                 <ArrowRight className="w-5 h-5 ml-2" />
               </Button>
-              <Button 
+              <Button
                 size="lg"
                 variant="outline"
                 className="border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"

pages/AmozProject.tsx

@@ -3,6 +3,7 @@ import { Navigation } from "../components/Navigation";
 import { Footer } from "../components/Footer";
 import { Button } from "../components/ui/button";
 import { Badge } from "../components/ui/badge";
+import amozImg from "../assets/amoz.jpg"
 import { Card, CardContent } from "../components/ui/card";
 import { ArrowRight, Calendar, Users, Smartphone, Globe, Check, Star, TrendingUp, ShoppingBag, Brain, Zap, MessageCircle, Target, AlertCircle, Clock, DollarSign, Play, Shield, CreditCard } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
@@ -13,7 +14,7 @@ export const AmozProject = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background relative overflow-hidden">
         <div className="absolute inset-0 bg-gradient-to-br from-[#E5195E]/5 via-transparent to-transparent" />
@@ -26,11 +27,11 @@ export const AmozProject = () => {
                   AI Social Commerce Case Study
                 </Badge>
               </div>
-              
+
               <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope">
                 Amoz Platform
               </h1>
-              
+
               <p className="text-xl text-muted-foreground mb-8 font-manrope">
                 AI-Powered Social Commerce Platform - Merging social networking and e-commerce with AI-driven recommendations and influencer monetization capabilities
               </p>
@@ -56,10 +57,21 @@ export const AmozProject = () => {
                   <div className="text-lg font-bold text-white font-manrope">8 experts</div>
                   <div className="text-xs text-muted-foreground font-manrope">Team Size</div>
                 </div>
-                <div className="text-center p-3 bg-card/30 rounded-lg border border-white/10">
+                {/* <div className="text-center p-3 bg-card/30 rounded-lg border border-white/10">
                   <Globe className="w-5 h-5 text-[#E5195E] mx-auto mb-2" />
                   <div className="text-lg font-bold text-white font-manrope">iOS/Android/Web</div>
                   <div className="text-xs text-muted-foreground font-manrope">Platforms</div>
+                </div> */}
+                <div className="text-center p-3 bg-card/30 rounded-lg border border-white/10">
+                  <Globe className="w-5 h-5 text-[#E5195E] mx-auto mb-2" />
+
+                  <div className="text-lg font-bold text-white font-manrope break-words">
+                    iOS/Android/Web
+                  </div>
+
+                  <div className="text-xs text-muted-foreground font-manrope">
+                    Platforms
+                  </div>
                 </div>
                 <div className="text-center p-3 bg-card/30 rounded-lg border border-white/10">
                   <DollarSign className="w-5 h-5 text-[#E5195E] mx-auto mb-2" />
@@ -86,7 +98,7 @@ export const AmozProject = () => {
 
               {/* CTA Buttons */}
               <div className="flex flex-col sm:flex-row gap-4">
-                <Button 
+                <Button
                   size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
                   onClick={() => navigate('/start-a-project')}
@@ -94,7 +106,7 @@ export const AmozProject = () => {
                   Build Your AI Commerce Platform
                   <ArrowRight className="w-5 h-5 ml-2" />
                 </Button>
-                <Button 
+                <Button
                   size="lg"
                   variant="outline"
                   className="border-white/20 text-white hover:bg-white/10 font-manrope"
@@ -107,8 +119,8 @@ export const AmozProject = () => {
 
             <div className="relative">
               <div className="aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10">
-                <ImageWithFallback 
+                <ImageWithFallback
-                  src="/images/amoz-platform-mockup.jpg"
+                  src={amozImg}
                   alt="Amoz AI-Powered Social Commerce Platform"
                   className="w-full h-full object-cover rounded-lg"
                 />
@@ -138,7 +150,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Overview</h2>
-            
+
             <div className="grid md:grid-cols-3 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -179,7 +191,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Scope</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Core Features</h3>
@@ -227,7 +239,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Challenges & Solution Architecture</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12 mb-16">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Technical Challenges</h3>
@@ -312,43 +324,43 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Development Process & Methodology</h2>
-            
+
             <div className="mb-12">
               <div className="text-center mb-8">
                 <p className="text-lg text-muted-foreground font-manrope">
                   <strong>Agile</strong> (2-week sprints) with feature prioritization with merchant and influencer input, weekly demos for stakeholders, continuous integration with automated deployments to staging
                 </p>
               </div>
-              
+
               <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
                 {[
-                  { 
+                  {
-                    phase: "Discovery & Planning", 
+                    phase: "Discovery & Planning",
                     duration: "3 weeks",
                     description: "Market analysis of social commerce trends, AI recommendation system design, payment integration planning"
                   },
-                  { 
+                  {
-                    phase: "Design & Prototyping", 
+                    phase: "Design & Prototyping",
                     duration: "5 weeks",
                     description: "Wireframes for influencer storefronts & live shopping pages, AI model training on sample product datasets"
                   },
-                  { 
+                  {
-                    phase: "Core Development", 
+                    phase: "Core Development",
                     duration: "10 weeks",
                     description: "Social feed & product catalog integration, influencer tools & storefronts, recommendation engine integration"
                   },
-                  { 
+                  {
-                    phase: "Live Shopping & Messaging", 
+                    phase: "Live Shopping & Messaging",
                     duration: "5 weeks",
                     description: "Real-time video streaming module, in-app chat and engagement features"
                   },
-                  { 
+                  {
-                    phase: "Testing & Optimization", 
+                    phase: "Testing & Optimization",
                     duration: "3 weeks",
                     description: "Load & stress testing for peak events, AI accuracy tuning"
                   },
-                  { 
+                  {
-                    phase: "Launch & Scaling", 
+                    phase: "Launch & Scaling",
                     duration: "2 weeks",
                     description: "Beta rollout to select merchants & influencers, marketing support and onboarding sessions"
                   }
@@ -379,7 +391,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Key Features & Functionality</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
               {[
                 {
@@ -431,7 +443,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Results & Impact</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
               {[
                 { label: "Merchant Onboarding", value: "5,000+", icon: Users, desc: "first 2 months" },
@@ -492,7 +504,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Lessons Learned & Best Practices</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -557,7 +569,7 @@ export const AmozProject = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-8 text-center font-manrope">Future Roadmap</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -608,7 +620,7 @@ export const AmozProject = () => {
               Create innovative social commerce solutions that merge AI-powered recommendations with seamless shopping experiences for the next generation of consumers.
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <Button 
+              <Button
                 size="lg"
                 className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
                 onClick={() => navigate('/start-a-project')}
@@ -616,7 +628,7 @@ export const AmozProject = () => {
                 Start Your Project
                 <ArrowRight className="w-5 h-5 ml-2" />
               </Button>
-              <Button 
+              <Button
                 size="lg"
                 variant="outline"
                 className="border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"

pages/AndroidAppDevelopment.tsx

@@ -402,8 +402,7 @@ const AndroidKeyBenefits = () => {
             Why Develop a Native Android App?
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            Android development offers unparalleled reach and flexibility for
+            AI mobile app development offers unparalleled reach and flexibility for businesses looking to tap into the world's largest mobile ecosystem.
-            businesses looking to tap into the world's largest mobile ecosystem.
           </p>
         </motion.div>
 
@@ -793,7 +792,7 @@ const AndroidCaseStudies = () => {
       image: ranoutofImage,
       results: "3M+ downloads",
       gradient: "from-[#007F33]/20 to-[#007F33]/10",
-      buttonLink: "/projects/ranoutof", 
+      buttonLink: "/projects/ranoutof",
     },
     {
       title: "Financial Trading Platform",
@@ -803,7 +802,7 @@ const AndroidCaseStudies = () => {
       image: tradersCircuitImage,
       results: "800K+ users",
       gradient: "from-blue-500/20 to-cyan-500/20",
-      buttonLink: "/projects/traderscircuit", 
+      buttonLink: "/projects/traderscircuit",
     },
     {
       title: "Real Estate Investment Platform",
@@ -813,7 +812,7 @@ const AndroidCaseStudies = () => {
       image: prospertyImage,
       results: "1.5M+ downloads",
       gradient: "from-[#a98453]/20 to-[#a98453]/10",
-      buttonLink: "/projects/prosperty", 
+      buttonLink: "/projects/prosperty",
     },
   ];
 
@@ -831,8 +830,7 @@ const AndroidCaseStudies = () => {
             Android Apps That Define Industries
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            Discover how we've helped businesses succeed with powerful Android
+            Discover how our AI mobile application developers have helped businesses succeed with powerful Android applications that leverage AI-powered features.
-            applications that leverage the platform's capabilities.
           </p>
         </motion.div>
 

pages/AutomationReshapingBusiness.tsx

@@ -9,6 +9,7 @@ import { Separator } from "../components/ui/separator";
 import { Calendar, Clock, User, ArrowRight, Share2, Linkedin, Twitter, ExternalLink, Tag } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { useNavigate } from "react-router-dom";
+import hospitalAi from "../assets/aihospital.jpg"
 
 const articleData = {
   id: "automation-reshaping-business",
@@ -276,7 +277,8 @@ const articleData = {
       title: "The Future of AI in Healthcare: Transforming Patient Care Through Technology",
       excerpt: "Discover how artificial intelligence is revolutionizing healthcare delivery and patient outcomes.",
       readTime: "12 min read",
-      image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      // image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      image: hospitalAi,
       category: "Healthcare AI"
     }
   ]
@@ -286,7 +288,7 @@ export const AutomationReshapingBusiness = () => {
   const handleShare = (platform: string) => {
     const url = encodeURIComponent(window.location.href);
     const title = encodeURIComponent(articleData.title);
-    
+
     let shareUrl = '';
     switch (platform) {
       case 'linkedin':
@@ -299,7 +301,7 @@ export const AutomationReshapingBusiness = () => {
         shareUrl = `https://wa.me/?text=${title} ${url}`;
         break;
     }
-    
+
     if (shareUrl) {
       window.open(shareUrl, '_blank', 'width=600,height=400');
     }
@@ -310,7 +312,7 @@ export const AutomationReshapingBusiness = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background">
         <div className="container mx-auto px-6 lg:px-8">
@@ -377,13 +379,13 @@ export const AutomationReshapingBusiness = () => {
       <section className="py-16 bg-card/50">
         <div className="container mx-auto px-6 lg:px-8">
           <div className="grid lg:grid-cols-10 gap-12 max-w-7xl mx-auto">
-            
+
             {/* Article Content - 70% */}
             <article className="lg:col-span-7">
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-8 lg:p-12">
                   {/* Article Body */}
-                  <div 
+                  <div
                     className="prose prose-invert prose-lg max-w-none
                       prose-headings:text-white prose-headings:font-semibold
                       prose-h2:text-3xl prose-h2:mt-12 prose-h2:mb-6
@@ -478,15 +480,15 @@ export const AutomationReshapingBusiness = () => {
 
             {/* Sidebar - 30% */}
             <aside className="lg:col-span-3 space-y-8">
-              
+
               {/* Related Articles */}
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-6">You Might Also Like</h3>
                   <div className="space-y-6">
                     {articleData.relatedArticles.map((article) => (
-                      <div 
+                      <div
-                        key={article.id} 
+                        key={article.id}
                         className="group cursor-pointer"
                         onClick={() => navigate(`/articles/${article.id}`)}
                       >
@@ -508,11 +510,11 @@ export const AutomationReshapingBusiness = () => {
                       </div>
                     ))}
                   </div>
-                  
+
                   <Separator className="my-6" />
-                  
+
-                  <Button 
+                  <Button
-                    variant="outline" 
+                    variant="outline"
                     className="w-full border-white/20 text-white hover:bg-white/10"
                     onClick={() => navigate('/resources/blog')}
                   >
@@ -527,10 +529,10 @@ export const AutomationReshapingBusiness = () => {
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-4">About WDI</h3>
                   <p className="text-muted-foreground text-sm leading-relaxed mb-4">
-                    Web Development Institute helps startups and enterprises build scalable, secure digital products. 
+                    Web Development Institute helps startups and enterprises build scalable, secure digital products.
                     With 25+ years of experience, we've delivered 200+ successful projects across 15+ countries.
                   </p>
-                  <Button 
+                  <Button
                     className="w-full bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                     onClick={() => navigate('/contact')}
                   >
@@ -552,21 +554,21 @@ export const AutomationReshapingBusiness = () => {
                 Enjoyed this article? Let's talk.
               </h2>
               <p className="text-muted-foreground mb-8 max-w-2xl mx-auto">
-                Ready to automate your business operations and drive efficiency? Our team of experts is here to help you 
+                Ready to automate your business operations and drive efficiency? Our team of experts is here to help you
                 implement intelligent automation solutions that transform your business processes.
               </p>
               <div className="flex flex-col sm:flex-row gap-4 justify-center">
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                   onClick={() => navigate('/contact')}
                 >
                   Start Your Automation Journey
                   <ArrowRight className="ml-2 w-4 h-4" />
                 </Button>
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
-                  variant="outline" 
+                  variant="outline"
                   className="border-white/20 text-white hover:bg-white/10"
                   onClick={() => navigate('/resources/blog')}
                 >

pages/Blog.tsx

@@ -5,6 +5,7 @@ import { Button } from "../components/ui/button";
 import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
 import { Input } from "../components/ui/input";
+import hospitalAi from "../assets/aihospital.jpg"
 import {
   Select,
   SelectContent,
@@ -57,8 +58,9 @@ export const Blog = () => {
         "The Future of AI in Healthcare: Transforming Patient Care Through Technology",
       excerpt:
         "Discover how artificial intelligence is revolutionizing healthcare delivery, from diagnostic accuracy to personalized treatment plans and administrative efficiency.",
-      image:
+      // image:
-        "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=800&h=600&fit=crop&auto=format",
+      //   "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=800&h=600&fit=crop&auto=format",
+      image: hospitalAi,
       author: "Dr. Sarah Chen",
       date: "January 8, 2025",
       category: "Healthcare AI",

pages/CaseStudies.tsx

@@ -106,7 +106,7 @@ const caseStudies = [
     category: "Loyalty & Rewards",
     industry: "Hospitality",
     featured: false,
-    link: "/comming-soon",
+    link: "",
     icon: Utensils
   },
   {
@@ -136,7 +136,7 @@ const caseStudies = [
     category: "Lifestyle",
     industry: "Chemicals",
     featured: false,
-    link: "/comming-soon",
+    link: "",
     icon: FlaskConical
   },
   {
@@ -156,7 +156,7 @@ const caseStudies = [
     category: "Lifestyle",
     industry: "Consumer",
     featured: false,
-    link: "/comming-soon",
+    link: "",
     icon: Trophy
   },
   {
@@ -186,7 +186,7 @@ const caseStudies = [
     category: "AgriTech",
     industry: "Agriculture",
     featured: false,
-    link: "/comming-soon",
+    link: "",
     icon: Tractor
   },
   {
@@ -196,13 +196,13 @@ const caseStudies = [
     category: "AgriTech",
     industry: "Agriculture",
     featured: false,
-    link: "/comming-soon",
+    link: "",
     icon: Globe
   },
 ];
 
-const industries = ["All Industries", "Consumer", "Retail", "Healthcare", "Technology", "Agriculture", "Finance", "Entertainment", "Real Estate","Heritage","Chemicals","Hospitality"];
+const industries = ["All Industries", "Consumer", "Retail", "Healthcare", "Technology", "Agriculture", "Finance", "Entertainment", "Real Estate", "Heritage", "Chemicals", "Hospitality"];
-const categories = ["All Categories", "Lifestyle", "E-commerce", "Health & Fitness", "Social", "AgriTech", "FinTech", "Events", "PropTech","Loyalty & Rewards"];
+const categories = ["All Categories", "Lifestyle", "E-commerce", "Health & Fitness", "Social", "AgriTech", "FinTech", "Events", "PropTech", "Loyalty & Rewards"];
 
 export const CaseStudies = () => {
   const [searchTerm, setSearchTerm] = useState("");

pages/ComplianceReadyFintech.tsx

@@ -6,6 +6,7 @@ import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
 import { Avatar, AvatarFallback, AvatarImage } from "../components/ui/avatar";
 import { Separator } from "../components/ui/separator";
+import hosptialAi from "../assets/aihospital.jpg"
 import { Calendar, Clock, User, ArrowRight, Share2, Linkedin, Twitter, ExternalLink, Tag } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { useNavigate } from "react-router-dom";
@@ -196,7 +197,8 @@ const articleData = {
       title: "The Future of AI in Healthcare: Transforming Patient Care Through Technology",
       excerpt: "Discover how artificial intelligence is revolutionizing healthcare delivery and patient outcomes.",
       readTime: "12 min read",
-      image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      // image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      image: hosptialAi,
       category: "Healthcare AI"
     },
     {

pages/ComplianceReadySystems.tsx

@@ -27,6 +27,7 @@ import {
   X,
 } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
+import hospitalize from "../assets/hospitalise.jpg"
 import { Footer } from "../components/Footer";
 import { Navigation } from "../components/Navigation";
 import {
@@ -227,8 +228,8 @@ const ComplianceReadySystemsHero = () => {
                           animate={{ opacity: 1, scale: 1 }}
                           transition={{ duration: 0.5, delay: item.delay }}
                           className={`p-3 rounded-lg border text-center ${item.status === "compliant"
-                              ? "bg-green-500/10 border-green-500/30"
+                            ? "bg-green-500/10 border-green-500/30"
-                              : "bg-orange-500/10 border-orange-500/30"
+                            : "bg-orange-500/10 border-orange-500/30"
                             }`}
                         >
                           <div className="flex items-center justify-center mb-2">
@@ -240,16 +241,16 @@ const ComplianceReadySystemsHero = () => {
                           </div>
                           <div
                             className={`text-sm font-medium ${item.status === "compliant"
-                                ? "text-green-300"
+                              ? "text-green-300"
-                                : "text-orange-300"
+                              : "text-orange-300"
                               }`}
                           >
                             {item.standard}
                           </div>
                           <div
                             className={`text-xs ${item.status === "compliant"
-                                ? "text-green-400"
+                              ? "text-green-400"
-                                : "text-orange-400"
+                              : "text-orange-400"
                               }`}
                           >
                             {item.status === "compliant"
@@ -1141,8 +1142,9 @@ const ComplianceReadySystemsCaseStudies = () => {
       client: "Healthcare Provider",
       description:
         "Developed a secure platform for patient data, achieving full HIPAA compliance within 8 months while ensuring seamless patient-provider communication and maintaining the highest security standards for protected health information.",
-      image:
+      // image:
-        "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
+      //   "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
+      image: hospitalize,
       results: "Full HIPAA compliance in 8 months",
       engagement: "Healthcare compliance success",
       gradient: "from-blue-500/20 to-cyan-500/20",

pages/CrossPlatformAppDevelopment.tsx

@@ -126,8 +126,7 @@ const CrossPlatformHeroWithCTA = () => {
               </h1>
 
               <p className="max-w-lg text-lg leading-relaxed text-gray-300">
-                Develop high-quality mobile apps that run seamlessly on iOS and
+                Develop high-quality AI mobile apps that run seamlessly on iOS and Android from a single codebase with AI-powered features, saving time and resources.
-                Android from a single codebase, saving time and resources.
               </p>
             </div>
 
@@ -303,11 +302,9 @@ const CrossPlatformBenefits = () => {
           className="mb-16 text-center"
         >
           <h2 className="mb-6 text-4xl font-semibold lg:text-5xl text-foreground">
-            Advantages of Choosing Cross-Platform
+            Advantages of Choosing Cross-Platform Development          </h2>
-          </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Cross-platform development offers unparalleled efficiency and reach
+            Cross-platform AI mobile app development offers unparalleled efficiency and reach for businesses looking to maximize their mobile app impact.
-            for businesses looking to maximize their mobile app impact.
           </p>
         </motion.div>
 
@@ -664,8 +661,7 @@ const CrossPlatformProcess = () => {
             Streamlined Process for Cross-Platform Success
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Our proven methodology ensures efficient development and deployment
+            Our proven methodology ensures efficient AI mobile app development and deployment across multiple platforms with AI-powered features.
-            across multiple platforms.
           </p>
         </motion.div>
 
@@ -872,11 +868,9 @@ const CrossPlatformCaseStudies = () => {
           className="mb-20 text-center"
         >
           <h2 className="mb-8 text-4xl font-semibold lg:text-5xl text-foreground">
-            Android Apps That Define Industries
+            Cross-Platform Apps That Define Industries          </h2>
-          </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Discover how we've helped businesses succeed with powerful Android
+            Discover how our AI mobile application developers have helped businesses succeed with powerful applications that leverage cross-platform capabilities with AI-powered features.
-            applications that leverage the platform's capabilities.
           </p>
         </motion.div>
 

pages/CustomWebAppDevelopment.tsx

@@ -127,8 +127,7 @@ const CustomWebAppHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Building bespoke, scalable, and secure web applications tailored
+                Building bespoke, scalable, and secure web applications tailored to your unique business processes and user needs.
-                to your unique business processes and user needs.
               </p>
             </div>
 
@@ -351,6 +350,10 @@ const CustomWebAppBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Invest in a Custom Web Application?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+            Tailored web development solutions with AI-powered design that scale, secure your data, and streamline your unique business workflows.
+          </p>
         </motion.div>
 
         <motion.div
@@ -480,6 +483,10 @@ const CustomWebAppProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Collaborative Journey to Your Custom Web App
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            From requirement gathering and AI-powered design to development, testing, and deployment. We partner every step for scalable web development success.
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -625,6 +632,10 @@ const CustomWebAppServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Expertise in Custom Web Solutions
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Mastering web development with AI-powered design, from React/Next.js frontends and Node.js backends to AWS/Azure cloud integration and scalable microservices architecture.
+          </p>
         </motion.div>
 
         <motion.div
@@ -686,68 +697,68 @@ const CustomWebAppServices = () => {
 
 // Web App Tech Stack
 const WebAppTechStack = () => {
- const technologies = [
+  const technologies = [
-  {
+    {
-    name: "React",
+      name: "React",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original.svg",
-    category: "Frontend",
+      category: "Frontend",
-    color: "blue",
+      color: "blue",
-  },
+    },
-  {
+    {
-    name: "Angular",
+      name: "Angular",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/angularjs/angularjs-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/angularjs/angularjs-original.svg",
-    category: "Frontend",
+      category: "Frontend",
-    color: "blue",
+      color: "blue",
-  },
+    },
-  {
+    {
-    name: "Vue.js",
+      name: "Vue.js",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/vuejs/vuejs-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/vuejs/vuejs-original.svg",
-    category: "Frontend",
+      category: "Frontend",
-    color: "blue",
+      color: "blue",
-  },
+    },
-  {
+    {
-    name: "Node.js",
+      name: "Node.js",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/nodejs/nodejs-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/nodejs/nodejs-original.svg",
-    category: "Backend",
+      category: "Backend",
-    color: "green",
+      color: "green",
-  },
+    },
-  {
+    {
-    name: "Python",
+      name: "Python",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/python/python-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/python/python-original.svg",
-    category: "Backend",
+      category: "Backend",
-    color: "green",
+      color: "green",
-  },
+    },
-  {
+    {
-    name: "Java",
+      name: "Java",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/java/java-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/java/java-original.svg",
-    category: "Backend",
+      category: "Backend",
-    color: "green",
+      color: "green",
-  },
+    },
-  {
+    {
-    name: "AWS",
+      name: "AWS",
-    logo: awsLogo,
+      logo: awsLogo,
-    category: "Cloud",
+      category: "Cloud",
-    color: "red",
+      color: "red",
-  },
+    },
-  {
+    {
-    name: "Azure",
+      name: "Azure",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/azure/azure-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/azure/azure-original.svg",
-    category: "Cloud",
+      category: "Cloud",
-    color: "orange",
+      color: "orange",
-  },
+    },
-  {
+    {
-    name: "PostgreSQL",
+      name: "PostgreSQL",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/postgresql/postgresql-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/postgresql/postgresql-original.svg",
-    category: "Database",
+      category: "Database",
-    color: "red",
+      color: "red",
-  },
+    },
-  {
+    {
-    name: "MongoDB",
+      name: "MongoDB",
-    logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/mongodb/mongodb-original.svg",
+      logo: "https://cdn.jsdelivr.net/gh/devicons/devicon/icons/mongodb/mongodb-original.svg",
-    category: "Database",
+      category: "Database",
-    color: "red",
+      color: "red",
-  },
+    },
-];
+  ];
 
 
   const frameworks = [
@@ -786,6 +797,10 @@ const WebAppTechStack = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Leveraging Robust and Modern Web Technologies
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Powering web development with AI-powered design, React/Next.js frontends, Node.js backends, and cloud-native stacks like Jamstack for superior performance and scalability.
+          </p>
         </motion.div>
 
         {/* Core Technologies */}
@@ -932,6 +947,10 @@ const WebAppCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Custom Web Applications That Drive Business Growth
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Scalable web development solutions with AI-powered design that boost efficiency, enhance security, and fuel your business expansion.
+          </p>
         </motion.div>
 
         <motion.div
@@ -1144,8 +1163,7 @@ const HireWebDevelopers = () => {
             Augment Your Team with Our Expert Web App Developers
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access highly skilled frontend, backend, and full-stack developers
+            Access highly skilled frontend, backend, and full-stack developers specializing in custom web development solutions with AI-powered design.
-            specializing in custom web solutions.
           </p>
         </motion.div>
 
@@ -1349,8 +1367,7 @@ const CustomWebAppFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            WDI crafts powerful, secure, and intuitive web solutions designed
+            WDI crafts powerful, secure, and intuitive web development solutions with AI-powered design specifically for your business success.
-            specifically for your business success.
           </motion.p>
 
           <motion.div

pages/DesignExperience.tsx

@@ -105,7 +105,7 @@ const HeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Create engaging, intuitive user experiences that drive conversion and delight users through research-driven design and modern design thinking.
+                Create engaging, intuitive experiences with AI-powered design that drive conversions and delight users through research-driven, modern design thinking.
               </p>
             </div>
 
@@ -195,7 +195,7 @@ const HorizontalTagScroller = () => {
             <span className="text-foreground"> & Expertise</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Comprehensive design services that create meaningful user experiences and drive business results.
+            Comprehensive iOS mobile app development design services that craft meaningful user experiences, boost engagement, and deliver measurable business results.
           </p>
         </motion.div>
 
@@ -315,8 +315,7 @@ const SideBySideContentWithIcons = () => {
           </h2>
 
           <p className="text-2xl text-gray-300 leading-relaxed">
-            User-centered design that drives measurable business results.
+            User-centered web development design that drives higher engagement, intuitive experiences, and measurable business results through proven UX methodologies.          </p>
-          </p>
         </motion.div>
 
         <motion.div
@@ -415,7 +414,7 @@ const TabbedServiceDisplay = () => {
             Design & Experience Services
           </h2>
           <p className="text-lg text-gray-300 max-w-4xl mx-auto leading-relaxed">
-            Comprehensive design services that create meaningful connections between users and digital products.
+            Comprehensive AI mobile app design services that create meaningful connections between users and digital products through intuitive, conversion-focused experiences.
           </p>
         </motion.div>
 
@@ -502,8 +501,7 @@ const InlineCTA = () => {
 
             {/* Subtitle */}
             <p className="text-xl text-muted-foreground leading-relaxed max-w-2xl mx-auto">
-              Design solutions that not only look great but also drive conversion and user engagement.
+              Design solutions that not only look great but also drive conversion and user engagement through AI-powered design.            </p>
-            </p>
 
             {/* CTA Button */}
             <div className="flex flex-col items-center gap-4">
@@ -583,8 +581,7 @@ const HireDevelopersSection = () => {
             <span className="text-[#E5195E]">Design Experts</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Get access to talented designers who create beautiful, functional user experiences.
+            Get access to talented AI mobile application developers who create beautiful, functional user experiences that drive engagement and conversions.          </p>
-          </p>
         </motion.div>
 
         <motion.div
@@ -664,23 +661,23 @@ const HireDevelopersSection = () => {
 const designExperienceFAQs = [
   {
     question: "What is your design process?",
-    answer: "Our design process includes discovery, user research, wireframing, prototyping, visual design, usability testing, and iterative refinement. We involve clients at every stage to ensure alignment with business goals."
+    answer: "Our design process includes discovery, user research, wireframing, prototyping, visual design, usability testing, and iterative refinement. We involve clients at every stage with AI mobile app insights to ensure alignment with business goals."
   },
   {
     question: "How do you ensure designs convert users?",
-    answer: "We use data-driven design principles, conduct user research, A/B test design elements, analyze user behavior, and optimize based on conversion metrics to ensure designs drive business results."
+    answer: "We use data-driven design principles, conduct user research, A/B test design elements, analyze user behavior, and optimize based on conversion metrics. AI-powered features help predict user actions to maximize business results."
   },
   {
     question: "Do you create design systems?",
-    answer: "Yes, we create comprehensive design systems including component libraries, style guides, pattern libraries, and documentation to ensure consistency across all touchpoints and enable scalable design."
+    answer: "Yes, we create comprehensive design systems including component libraries, style guides, pattern libraries, and documentation. These ensure consistency across all touchpoints with web development scalability"
   },
   {
     question: "Can you redesign our existing product?",
-    answer: "Absolutely! We conduct design audits, user research, and competitive analysis to identify improvement opportunities, then redesign your product to enhance user experience and business performance."
+    answer: "Absolutely! We conduct design audits, user research, and competitive analysis to identify improvement opportunities. Then we redesign using iOS mobile app development standards to enhance user experience and performance."
   },
   {
     question: "How do you handle accessibility in design?",
-    answer: "We follow WCAG guidelines and design for accessibility from the start, ensuring our designs are inclusive and usable by people with various abilities. This includes color contrast, typography, navigation, and interaction design."
+    answer: "We follow WCAG guidelines and design for accessibility from the start, ensuring inclusivity for all abilities. This covers color contrast, typography, navigation, and interaction design with AI iOS development support."
   }
 ];
 
@@ -697,7 +694,7 @@ export function DesignExperience() {
       <HireDevelopersSection />
       <FAQSection
         title="Design & Experience Questions"
-        subtitle="Get answers to common questions about our design and user experience services."
+        subtitle="Get answers to common questions about design and user experience services enhanced with AI-powered design."
         faqs={designExperienceFAQs}
       />
       {/* <Footer /> */}

pages/EcommercePlatforms.tsx

@@ -64,7 +64,7 @@ const EcommerceHeroWithCTA = () => {
         />
 
         {/* Canonical Link */}
-       <link rel="canonical" href="https://www.wdipl.com/services/ecommerce-platforms" />
+        <link rel="canonical" href="https://www.wdipl.com/services/ecommerce-platforms" />
 
         {/* Open Graph Tags (for Facebook, LinkedIn) */}
         <meta property="og:title" content="eCommerce Platform Development by WDI| Build Powerful Online Stores" />
@@ -128,8 +128,7 @@ const EcommerceHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Building high-converting, scalable, and secure online stores and
+                Building high-converting, scalable AI mobile app stores with AI-powered features for iOS mobile app development, secure marketplaces that drive sales through expertise and enhanced customer experiences.
-                marketplaces that drive sales and enhance customer experiences.
               </p>
             </div>
 
@@ -399,6 +398,13 @@ const EcommerceBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Choose WDI for Your eCommerce Platform?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI delivers bespoke AI mobile app solutions that ensure scalability, security, and superior customer experiences for high-converting online stores.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -528,6 +534,12 @@ const EcommerceProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Streamlined Process for Your eCommerce Success
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI's proven steps. from discovery and design to AI mobile app integration and launch, ensure your platform scales effortlessly and converts at peak performance.
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -546,14 +558,12 @@ const EcommerceProcess = () => {
                   whileInView={{ opacity: 1, x: 0 }}
                   transition={{ duration: 0.8, delay: index * 0.2 }}
                   viewport={{ once: true }}
-                  className={`flex items-center ${
+                  className={`flex items-center ${isEven ? "lg:flex-row" : "lg:flex-row-reverse"
-                    isEven ? "lg:flex-row" : "lg:flex-row-reverse"
+                    } flex-col lg:gap-16 gap-8`}
-                  } flex-col lg:gap-16 gap-8`}
                 >
                   <div
-                    className={`flex-1 ${
+                    className={`flex-1 ${isEven ? "lg:text-right" : "lg:text-left"
-                      isEven ? "lg:text-right" : "lg:text-left"
+                      } text-center lg:text-left`}
-                    } text-center lg:text-left`}
                   >
                     <div className="bg-card/20 backdrop-blur-md rounded-2xl border border-white/10 p-8 hover:border-accent/30 transition-all duration-300 shadow-lg hover:shadow-xl">
                       <div className="flex items-center gap-4 mb-4 justify-center lg:justify-start">
@@ -683,6 +693,13 @@ const EcommerceServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Comprehensive eCommerce Development Services
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI offers end-to-end solutions including custom platforms, AI mobile app integration, secure payments, and scalable marketplaces for seamless online success.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -887,8 +904,7 @@ const EcommerceTechStack = () => {
             Utilizing Industry-Leading Platforms and Modern Frameworks
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            For powerful eCommerce solutions that drive sales and scale with
+            For powerful eCommerce solutions enhanced by AI mobile app capabilities that drive sales and scale seamlessly with your business.
-            your business.
           </p>
         </motion.div>
 
@@ -1101,6 +1117,12 @@ const EcommerceCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             eCommerce Solutions That Drive Sales
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+            WDI crafts high-converting platforms powered by AI mobile app technology to boost revenue and deliver seamless customer experiences.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1310,8 +1332,7 @@ const HireEcommerceDevelopers = () => {
             Find Expert eCommerce Developers
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access our specialized developers proficient in Shopify, Magento,
+            Access WDI's specialized developers proficient in Shopify, Magento, WooCommerce, and custom solutions powered by AI mobile app expertise.
-            WooCommerce, and custom eCommerce solutions.
           </p>
         </motion.div>
 
@@ -1377,7 +1398,7 @@ const HireEcommerceDevelopers = () => {
         >
           <div className="flex flex-col sm:flex-row gap-4 justify-center">
             <ShimmerButton className="text-lg px-8 py-4"
-            onClick={() => navigate("/hire-talent/ecommerce-platform-developers")}
+              onClick={() => navigate("/hire-talent/ecommerce-platform-developers")}
             >
               <div className="inline-flex items-center gap-2">
                 <Users className="w-5 h-5 flex-shrink-0" />
@@ -1514,8 +1535,7 @@ const EcommerceFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Partner with us to create an online presence that attracts, engages,
+            Partner with WDI's AI mobile app experts to create an online presence that attracts, engages, and converts customers effectively.
-            and converts customers effectively.
           </motion.p>
 
           <motion.div

pages/EnterpriseSoftwareSolutions.tsx

@@ -127,9 +127,7 @@ const EnterpriseHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Crafting custom, high-impact software tailored to streamline
+                Crafting custom, high-impact AI-powered features software tailored to streamline large-scale operations, enhance productivity, and drive digital transformation for enterprises.
-                large-scale operations, enhance productivity, and drive digital
-                transformation for enterprises.
               </p>
             </div>
 
@@ -509,6 +507,13 @@ const EnterpriseBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Custom Enterprise Solutions from WDI?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            WDI delivers tailored AI app development company solutions that optimize processes, unlock real-time insights, and scale seamlessly with your enterprise growth.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -644,6 +649,11 @@ const EnterpriseProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Strategic Approach to Enterprise Software
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI aligns business objectives with AI iOS development through discovery, agile execution, and cloud-native architecture delivering scalable systems that evolve with enterprise growth.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -797,6 +807,11 @@ const EnterpriseServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Comprehensive Enterprise Software Capabilities
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI offers end-to-end AI mobile app solutions from custom ERP/CRM systems and cloud migration to intelligent analytics platforms that power enterprise-wide digital transformation
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1012,8 +1027,7 @@ const EnterpriseTechStack = () => {
             Leveraging Robust Enterprise-Grade Technologies
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            For reliability and performance at scale with proven enterprise
+            For reliability and performance at scale with proven AI-powered features enterprise solutions that ensure seamless operations across your entire organization.
-            solutions.
           </p>
         </motion.div>
 
@@ -1262,6 +1276,11 @@ const EnterpriseCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Enterprise Solutions Driving Real Business Impact
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI crafts AI-powered features that deliver measurable ROI through streamlined operations, enhanced decision-making, and accelerated digital transformation for enterprises.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1478,8 +1497,7 @@ const HireEnterpriseTalent = () => {
             Build Your Enterprise Team with WDI Talent
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access highly experienced architects, project managers, and senior
+            Access highly experienced AI app development company architects, project managers, and senior developers skilled in complex enterprise environments.
-            developers skilled in complex enterprise environments.
           </p>
         </motion.div>
 
@@ -1684,8 +1702,7 @@ const EnterpriseFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Partner with us for custom enterprise software solutions that
+            Partner with WDI's AI-powered design experts for custom enterprise software solutions that deliver efficiency, innovation, and competitive edge.
-            deliver efficiency, innovation, and a competitive edge.
           </motion.p>
 
           <motion.div

pages/FutureOfAIHealthcare.tsx

@@ -7,6 +7,7 @@ import { Card, CardContent } from "../components/ui/card";
 import { Avatar, AvatarFallback, AvatarImage } from "../components/ui/avatar";
 import { Separator } from "../components/ui/separator";
 import { Calendar, Clock, User, ArrowRight, Share2, Linkedin, Twitter, ExternalLink, Tag } from "lucide-react";
+import hosptialAi from "../assets/aihospital.jpg"
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { useNavigate } from "react-router-dom";
 
@@ -109,7 +110,8 @@ const articleData = {
   readTime: "12 min read",
   category: "Healthcare AI",
   tags: ["Artificial Intelligence", "Healthcare", "Medical Technology", "Digital Health", "Machine Learning"],
-  bannerImage: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=1200&h=600&fit=crop&auto=format",
+  // bannerImage: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=1200&h=600&fit=crop&auto=format",
+  bannerImage: hosptialAi,
   relatedArticles: [
     {
       id: "compliance-ready-systems-fintech",
@@ -123,7 +125,7 @@ const articleData = {
       id: "automation-reshaping-business",
       title: "5 Ways Automation is Reshaping Business Operations",
       excerpt: "Discover how intelligent automation is transforming modern business processes and operations.",
-      readTime: "10 min read", 
+      readTime: "10 min read",
       image: "https://images.unsplash.com/photo-1485827404703-89b55fcc595e?w=400&h=250&fit=crop&auto=format",
       category: "Automation"
     },
@@ -142,7 +144,7 @@ export const FutureOfAIHealthcare = () => {
   const handleShare = (platform: string) => {
     const url = encodeURIComponent(window.location.href);
     const title = encodeURIComponent(articleData.title);
-    
+
     let shareUrl = '';
     switch (platform) {
       case 'linkedin':
@@ -155,7 +157,7 @@ export const FutureOfAIHealthcare = () => {
         shareUrl = `https://wa.me/?text=${title} ${url}`;
         break;
     }
-    
+
     if (shareUrl) {
       window.open(shareUrl, '_blank', 'width=600,height=400');
     }
@@ -166,7 +168,7 @@ export const FutureOfAIHealthcare = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background">
         <div className="container mx-auto px-6 lg:px-8">
@@ -233,13 +235,13 @@ export const FutureOfAIHealthcare = () => {
       <section className="py-16 bg-card/50">
         <div className="container mx-auto px-6 lg:px-8">
           <div className="grid lg:grid-cols-10 gap-12 max-w-7xl mx-auto">
-            
+
             {/* Article Content - 70% */}
             <article className="lg:col-span-7">
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-8 lg:p-12">
                   {/* Article Body */}
-                  <div 
+                  <div
                     className="prose prose-invert prose-lg max-w-none
                       prose-headings:text-white prose-headings:font-semibold
                       prose-h2:text-3xl prose-h2:mt-12 prose-h2:mb-6
@@ -334,15 +336,15 @@ export const FutureOfAIHealthcare = () => {
 
             {/* Sidebar - 30% */}
             <aside className="lg:col-span-3 space-y-8">
-              
+
               {/* Related Articles */}
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-6">You Might Also Like</h3>
                   <div className="space-y-6">
                     {articleData.relatedArticles.map((article) => (
-                      <div 
+                      <div
-                        key={article.id} 
+                        key={article.id}
                         className="group cursor-pointer"
                         onClick={() => navigate(`/articles/${article.id}`)}
                       >
@@ -364,11 +366,11 @@ export const FutureOfAIHealthcare = () => {
                       </div>
                     ))}
                   </div>
-                  
+
                   <Separator className="my-6" />
-                  
+
-                  <Button 
+                  <Button
-                    variant="outline" 
+                    variant="outline"
                     className="w-full border-white/20 text-white hover:bg-white/10"
                     onClick={() => navigate('/resources/blog')}
                   >
@@ -383,10 +385,10 @@ export const FutureOfAIHealthcare = () => {
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-4">About WDI</h3>
                   <p className="text-muted-foreground text-sm leading-relaxed mb-4">
-                    Web Development Institute helps startups and enterprises build scalable, secure digital products. 
+                    Web Development Institute helps startups and enterprises build scalable, secure digital products.
                     With 25+ years of experience, we've delivered 200+ successful projects across 15+ countries.
                   </p>
-                  <Button 
+                  <Button
                     className="w-full bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                     onClick={() => navigate('/contact')}
                   >
@@ -408,21 +410,21 @@ export const FutureOfAIHealthcare = () => {
                 Enjoyed this article? Let's talk.
               </h2>
               <p className="text-muted-foreground mb-8 max-w-2xl mx-auto">
-                Ready to transform your healthcare technology with AI? Our team of experts is here to help you build 
+                Ready to transform your healthcare technology with AI? Our team of experts is here to help you build
                 innovative solutions that improve patient outcomes and operational efficiency.
               </p>
               <div className="flex flex-col sm:flex-row gap-4 justify-center">
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                   onClick={() => navigate('/contact')}
                 >
                   Start Your AI Project
                   <ArrowRight className="ml-2 w-4 h-4" />
                 </Button>
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
-                  variant="outline" 
+                  variant="outline"
                   className="border-white/20 text-white hover:bg-white/10"
                   onClick={() => navigate('/resources/blog')}
                 >

pages/HealthTechApplications.tsx

@@ -35,6 +35,7 @@ import {
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { Footer } from "../components/Footer";
 import { Navigation } from "../components/Navigation";
+import hospitalize from "../assets/hospitalise.jpg"
 import {
   Accordion,
   AccordionContent,
@@ -391,18 +392,18 @@ const HealthTechHero = () => {
                       >
                         <div
                           className={`w-8 h-8 rounded-full flex items-center justify-center ${activity.color === "blue"
-                              ? "bg-blue-500/20"
+                            ? "bg-blue-500/20"
-                              : activity.color === "green"
+                            : activity.color === "green"
-                                ? "bg-green-500/20"
+                              ? "bg-green-500/20"
-                                : "bg-purple-500/20"
+                              : "bg-purple-500/20"
                             }`}
                         >
                           <activity.icon
                             className={`w-4 h-4 ${activity.color === "blue"
-                                ? "text-blue-400"
+                              ? "text-blue-400"
-                                : activity.color === "green"
+                              : activity.color === "green"
-                                  ? "text-green-400"
+                                ? "text-green-400"
-                                  : "text-purple-400"
+                                : "text-purple-400"
                               }`}
                           />
                         </div>
@@ -983,9 +984,10 @@ const HealthTechCaseStudies = () => {
         "WDI developed an end-to-end telemedicine solution with secure video conferencing, appointment scheduling, e-prescribing, and patient record access, ensuring full HIPAA compliance.",
       results:
         "Enabled 30% more patient consultations and extended reach to underserved areas, significantly improving patient access.",
-      image:
+      // image:
-        "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
+      //   "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
-      engagement: "Telehealth transformation",
+      // engagement: "Telehealth transformation",
+      image: hospitalize,
       gradient: "from-blue-500/20 to-cyan-500/20",
     },
     {

pages/Homepage.tsx

@@ -30,7 +30,7 @@ const services = [
                 d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"
             />
         ),
-        description: "Native & cross-platform apps with pixel-perfect UIs and seamless user experiences.",
+        description: "Native & cross-platform apps with AI-powered features, pixel-perfect UIs, and seamless user experiences.",
         link: "/services/mobile-app-development"
     },
     {
@@ -185,7 +185,8 @@ export const Homepage = () => {
                         <div className="text-center">
                             <h2 className="text-3xl sm:text-4xl font-semibold tracking-tight text-white">What We Do</h2>
                             <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
-                                End-to-end solutions for every stage of your product lifecycle.
+                                {/* End-to-end solutions for every stage of your product lifecycle. */}
+                                We are the AI app development company, End-to-end solutions for every stage of your product lifecycle.
                             </p>
                         </div>
                     </motion.div>

pages/LegacySystemScaling.tsx

@@ -6,6 +6,7 @@ import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
 import { Avatar, AvatarFallback, AvatarImage } from "../components/ui/avatar";
 import { Separator } from "../components/ui/separator";
+import hosptialAi from "../assets/aihospital.jpg"
 import { Calendar, Clock, User, ArrowRight, Share2, Linkedin, Twitter, ExternalLink, Tag } from "lucide-react";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { useNavigate } from "react-router-dom";
@@ -218,7 +219,8 @@ const articleData = {
       title: "The Future of AI in Healthcare: Transforming Patient Care Through Technology",
       excerpt: "Discover how artificial intelligence is revolutionizing healthcare delivery and patient outcomes.",
       readTime: "12 min read",
-      image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      // image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=250&fit=crop&auto=format",
+      image: hosptialAi,
       category: "Healthcare AI"
     },
     {
@@ -236,7 +238,7 @@ export const LegacySystemScaling = () => {
   const handleShare = (platform: string) => {
     const url = encodeURIComponent(window.location.href);
     const title = encodeURIComponent(articleData.title);
-    
+
     let shareUrl = '';
     switch (platform) {
       case 'linkedin':
@@ -249,7 +251,7 @@ export const LegacySystemScaling = () => {
         shareUrl = `https://wa.me/?text=${title} ${url}`;
         break;
     }
-    
+
     if (shareUrl) {
       window.open(shareUrl, '_blank', 'width=600,height=400');
     }
@@ -260,7 +262,7 @@ export const LegacySystemScaling = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background">
         <div className="container mx-auto px-6 lg:px-8">
@@ -327,13 +329,13 @@ export const LegacySystemScaling = () => {
       <section className="py-16 bg-card/50">
         <div className="container mx-auto px-6 lg:px-8">
           <div className="grid lg:grid-cols-10 gap-12 max-w-7xl mx-auto">
-            
+
             {/* Article Content - 70% */}
             <article className="lg:col-span-7">
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-8 lg:p-12">
                   {/* Article Body */}
-                  <div 
+                  <div
                     className="prose prose-invert prose-lg max-w-none
                       prose-headings:text-white prose-headings:font-semibold
                       prose-h2:text-3xl prose-h2:mt-12 prose-h2:mb-6
@@ -429,15 +431,15 @@ export const LegacySystemScaling = () => {
 
             {/* Sidebar - 30% */}
             <aside className="lg:col-span-3 space-y-8">
-              
+
               {/* Related Articles */}
               <Card className="bg-background/50 border-white/10">
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-6">You Might Also Like</h3>
                   <div className="space-y-6">
                     {articleData.relatedArticles.map((article) => (
-                      <div 
+                      <div
-                        key={article.id} 
+                        key={article.id}
                         className="group cursor-pointer"
                         onClick={() => navigate(`/articles/${article.id}`)}
                       >
@@ -459,11 +461,11 @@ export const LegacySystemScaling = () => {
                       </div>
                     ))}
                   </div>
-                  
+
                   <Separator className="my-6" />
-                  
+
-                  <Button 
+                  <Button
-                    variant="outline" 
+                    variant="outline"
                     className="w-full border-white/20 text-white hover:bg-white/10"
                     onClick={() => navigate('/resources/blog')}
                   >
@@ -478,10 +480,10 @@ export const LegacySystemScaling = () => {
                 <CardContent className="p-6">
                   <h3 className="text-xl font-semibold text-white mb-4">About WDI</h3>
                   <p className="text-muted-foreground text-sm leading-relaxed mb-4">
-                    Web Development Institute helps startups and enterprises build scalable, secure digital products. 
+                    Web Development Institute helps startups and enterprises build scalable, secure digital products.
                     With 25+ years of experience, we've delivered 200+ successful projects across 15+ countries.
                   </p>
-                  <Button 
+                  <Button
                     className="w-full bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                     onClick={() => navigate('/contact')}
                   >
@@ -503,21 +505,21 @@ export const LegacySystemScaling = () => {
                 Enjoyed this article? Let's talk.
               </h2>
               <p className="text-muted-foreground mb-8 max-w-2xl mx-auto">
-                Ready to scale your legacy system or modernize your infrastructure? Our team of experts is here to help you 
+                Ready to scale your legacy system or modernize your infrastructure? Our team of experts is here to help you
                 build scalable, high-performance systems that grow with your business.
               </p>
               <div className="flex flex-col sm:flex-row gap-4 justify-center">
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
                   onClick={() => navigate('/contact')}
                 >
                   Start Your Modernization Project
                   <ArrowRight className="ml-2 w-4 h-4" />
                 </Button>
-                <Button 
+                <Button
-                  size="lg" 
+                  size="lg"
-                  variant="outline" 
+                  variant="outline"
                   className="border-white/20 text-white hover:bg-white/10"
                   onClick={() => navigate('/resources/blog')}
                 >

pages/MobileAppDevelopment.tsx

@@ -122,7 +122,7 @@ const HeroWithCTA = () => {
               </h1>
 
               <p className="max-w-lg text-lg leading-relaxed text-gray-300">
-                Build secure, scalable, high-performance apps for iOS, Android, or cross-platform — fast.
+                Build secure, scalable, AI-powered high-performance apps for iOS, Android, or cross-platform fast.
               </p>
             </motion.div>
 
@@ -234,7 +234,7 @@ const HorizontalTagScroller = () => {
             Apps Built for High-Impact Industries
           </h2>
           <p className="max-w-4xl mx-auto text-2xl leading-relaxed text-muted-foreground">
-            Our mobile apps power industries where user trust, speed, and uptime are critical.
+            Our AI mobile apps power industries where user trust, speed, and uptime are critical.
           </p>
         </motion.div>
 
@@ -382,7 +382,7 @@ const SideBySideContentWithIcons = () => {
 
           {/* Subtext */}
           <p className="text-2xl leading-relaxed text-gray-300">
-            Not just a dev agency. A product partner.
+            Not just a dev agency. An AI mobile app product partner.
           </p>
         </motion.div>
 
@@ -485,7 +485,7 @@ const TabbedServiceDisplay = () => {
             Mobile App Development Services
           </h2>
           <p className="max-w-4xl mx-auto text-lg leading-relaxed text-gray-300">
-            Comprehensive mobile development services that transform your ideas into powerful, user-friendly applications across all platforms.
+            Comprehensive AI mobile development services that transform your ideas into powerful, user-friendly applications across all platforms.
           </p>
         </motion.div>
 
@@ -650,10 +650,10 @@ const HireDevelopersSection = () => {
         >
           <h2 className="mb-8 text-4xl font-semibold lg:text-5xl">
             <span className="text-foreground">Hire Our </span>
-            <span className="text-[#E5195E]">Mobile App Experts</span>
+            <span className="text-[#E5195E]">AI Mobile Application Developers</span>
           </h2>
           <p className="max-w-4xl mx-auto text-2xl leading-relaxed text-muted-foreground">
-            Get access to top-tier mobile developers who can bring your vision to life with cutting-edge technology and proven expertise.
+            Get access to top-tier AI app development company experts who can bring your vision to life with AI-powered features and proven expertise.
           </p>
         </motion.div>
 
@@ -734,35 +734,35 @@ const HireDevelopersSection = () => {
 const mobileAppFAQs = [
   {
     question: "Do you develop both iOS and Android apps?",
-    answer: "Yes, we develop native iOS apps using Swift and Android apps using Kotlin. We also offer cross-platform solutions using React Native and Flutter for cost-effective multi-platform deployment."
+    answer: "Yes, our AI mobile application developers create native iOS apps using Swift (including AI iOS development) and Android apps using Kotlin. We also offer cross-platform AI mobile app development using React Native and Flutter for cost-effective multi-platform deployment."
   },
   {
     question: "What is the typical timeline for mobile app development?",
-    answer: "Timeline varies based on complexity. Simple apps take 8-12 weeks, while complex enterprise apps can take 16-24 weeks. We provide detailed project timelines after requirements analysis."
+    answer: "Timeline varies based on complexity. Simple AI mobile apps take 8-12 weeks, while complex enterprise apps with AI-powered features can take 16-24 weeks. We provide detailed project timelines after requirements analysis."
   },
   {
     question: "How much does mobile app development cost?",
-    answer: "Costs depend on features, platforms, and complexity. We offer competitive pricing with transparent estimates. Contact us for a detailed quote based on your specific requirements."
+    answer: "Costs depend on features, platforms, and complexity for AI app development company services. We offer competitive pricing with transparent estimates. Contact us for a detailed quote based on your specific requirements."
   },
   {
     question: "Do you help with App Store submissions?",
-    answer: "Yes, we handle the complete App Store submission process for both Apple App Store and Google Play Store, including app optimization, compliance, and approval assistance."
+    answer: "Yes, we handle the complete App Store submission process for both Apple App Store and Google Play Store, including AI mobile app optimization, compliance, and approval assistance."
   },
   {
     question: "Can you integrate third-party services and APIs?",
-    answer: "Absolutely! We integrate various third-party services including payment gateways, social media, analytics, push notifications, maps, and custom APIs to enhance app functionality."
+    answer: "Absolutely! Our AI mobile application developers integrate various third-party services including payment gateways, social media, analytics, push notifications, maps, and custom APIs to enhance AI-powered features."
   },
   {
     question: "Do you provide app maintenance and updates?",
-    answer: "Yes, we offer comprehensive maintenance services including bug fixes, OS updates, security patches, feature enhancements, and performance optimization to keep your app current."
+    answer: "Yes, our AI app development company offers comprehensive maintenance services including bug fixes, OS updates, security patches, AI-powered feature enhancements, and performance optimization to keep your app current."
   },
   {
     question: "What about app security and data protection?",
-    answer: "We implement robust security measures including data encryption, secure API communication, user authentication, and compliance with privacy regulations like GDPR and CCPA."
+    answer: "We implement robust security measures including data encryption, secure API communication, user authentication, and compliance with privacy regulations like GDPR and CCPA for all AI mobile apps."
   },
   {
     question: "Can you develop offline-capable mobile apps?",
-    answer: "Yes, we can develop apps with offline functionality using local storage, caching strategies, and data synchronization to ensure your app works even without internet connectivity."
+    answer: "Yes, we can develop offline-capable AI mobile apps using local storage, caching strategies, and data synchronization to ensure your app works seamlessly even without internet connectivity."
   }
 ];
 

pages/NativeAppDevelopment.tsx

@@ -121,9 +121,7 @@ const NativeHeroWithCTA = () => {
               </h1>
 
               <p className="max-w-lg text-lg leading-relaxed text-gray-300">
-                Building bespoke applications tailored for a single operating
+                AI mobile application developers build bespoke iOS mobile app development and Android applications tailored for a single operating system to deliver the highest level of performance, security, and device integration with AI-powered features.
-                system to deliver the highest level of performance, security,
-                and device integration.
               </p>
             </div>
 
@@ -322,8 +320,7 @@ const NativeVsCrossPlatform = () => {
             Native vs. Cross-Platform: When to Choose Native
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Native development delivers uncompromising performance and platform
+            AI mobile app development with native mobile app development delivers uncompromising performance and platform integration for applications that demand the highest standards with AI-powered features.
-            integration for applications that demand the highest standards.
           </p>
         </motion.div>
 
@@ -768,8 +765,7 @@ const NativeProcess = () => {
             Precision & Excellence in Every Native Project
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-gray-300">
-            Our proven native development methodology ensures optimal
+            Our proven native development methodology ensures optimal performance and platform integration at every stage with AI-powered features.
-            performance and platform integration at every stage.
           </p>
         </motion.div>
 
@@ -878,8 +874,7 @@ const NativeCaseStudies = () => {
             Android Apps That Define Industries
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Discover how we've helped businesses succeed with powerful Android
+            Discover how our AI mobile application developers have helped businesses succeed with powerful Android applications that leverage AI-powered features.
-            applications that leverage the platform's capabilities.
           </p>
         </motion.div>
 

pages/PWADevelopment.tsx

@@ -135,13 +135,11 @@ const PWAHeroWithCTA = () => {
             {/* Main Heading */}
             <div className="space-y-6">
               <h1 className="text-4xl md:text-5xl lg:text-6xl font-semibold text-white leading-tight">
-                Progressive Web App (PWA) Development
+                Progressive Web App Development
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Deliver app-like experiences directly through the web browser,
+                Deliver app-like experiences directly through the web browser with AI-powered features, combining the best of web development and AI mobile app for unparalleled reach.
-                combining the best of web and mobile apps for unparalleled
-                reach.
               </p>
             </div>
 
@@ -347,8 +345,7 @@ const PWABenefits = () => {
             Why Choose a Progressive Web App?
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            PWAs combine the best of web and mobile apps, delivering native-like
+            PWAs combine the best of web development and AI mobile app experiences, delivering native-like performance with AI-powered design, web-based flexibility, and unparalleled reach.
-            experiences with web-based flexibility and reach.
           </p>
         </motion.div>
 
@@ -543,8 +540,7 @@ const PWAProcess = () => {
             Our Agile Approach to PWA Development
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            Our proven methodology ensures your PWA delivers exceptional user
+            Our proven methodology ensures your PWA delivers exceptional user experiences through AI-powered design while meeting your business objectives.
-            experiences while meeting your business objectives.
           </p>
         </motion.div>
 
@@ -689,8 +685,7 @@ const PWAUseCases = () => {
             When a PWA is the Right Choice for Your Business
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Progressive Web Apps excel in scenarios where broad reach,
+            Progressive Web Apps excel in scenarios where our AI app development company delivers broad reach, cost-effectiveness, and offline capabilities through AI-powered features.
-            cost-effectiveness, and offline capabilities are crucial.
           </p>
         </motion.div>
 
@@ -843,8 +838,7 @@ const PWATechStack = () => {
             Modern Web Technologies for Powerful PWA Experiences
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            We leverage cutting-edge web technologies and PWA-specific APIs to
+            We leverage cutting-edge web development technologies and PWA-specific APIs through AI-powered design to deliver exceptional AI mobile app experiences.
-            deliver exceptional user experiences.
           </p>
         </motion.div>
 
@@ -1057,9 +1051,7 @@ const PWASuccessStories = () => {
             Successful Progressive Web Apps by WDI
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            See how we've transformed businesses with PWA solutions that deliver
+            See how our AI mobile application developers have transformed businesses with PWA solutions that deliver exceptional user experiences through AI app development company expertise, offline capabilities, and measurable results across industries.
-            exceptional user experiences, offline capabilities, and measurable
-            results across industries.
           </p>
         </motion.div>
 
@@ -1352,8 +1344,7 @@ const PWAFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-gray-300 mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            WDI helps you harness the speed, reliability, and engagement of PWAs
+            WDI helps you harness the speed, reliability, and engagement of PWAs through AI-powered design for your audience.
-            for your audience.
           </motion.p>
 
           <motion.div
@@ -1406,7 +1397,7 @@ export const PWADevelopment = () => {
         <PWABenefits />
       </section>
 
-       {/* Case Studies */}
+      {/* Case Studies */}
       <section className="bg-card">
         <PWASuccessStories />
       </section>
@@ -1433,7 +1424,7 @@ export const PWADevelopment = () => {
 
       <HireDeveloperSection
         title="Augment Your Team with Top PWA Developers"
-        description="Build fast, installable, and offline-first Progressive Web Apps that feel like native mobile apps."
+        description="Build fast, installable, and offline-first Progressive Web Apps through our AI app development company that feel like AI mobile apps."
         buttonText="Hire PWA Developers"
         buttonLink="/hire-talent/pwa-developers"
         developerTypes={[

pages/ProductModernization.tsx

@@ -125,9 +125,7 @@ const ModernizationHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Revitalize your outdated software and digital products,
+                Revitalize outdated software through AI mobile app development, transforming legacy systems into modern, scalable solutions that boost performance and agility.
-                transforming them into modern, scalable, and high-performing
-                solutions.
               </p>
             </div>
 
@@ -440,6 +438,11 @@ const ModernizationBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Modernize Your Existing Product?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Modernizing with WDI unlocks AI-powered features, enhances scalability, cuts maintenance costs, and future-proofs your software for sustained enterprise growth.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -537,6 +540,12 @@ const ModernizationProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Strategic Phased Approach to Modernization
           </h2>
+
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            A structured roadmap using AI iOS development transforms legacy systems step-by-step from assessment to deployment minimizing risks while maximizing performance gains.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -702,6 +711,11 @@ const ModernizationServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Comprehensive Product Modernization Capabilities
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Mastering AI mobile app integrations and web development, we rebuild legacy systems into scalable, high-performance platforms that drive enterprise innovation.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1117,6 +1131,11 @@ const ModernizationCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Successful Product Modernization Stories
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Legacy systems reborn through AI-powered features deliver 3-5x faster performance, seamless scalability, and millions in annual savings as proven in enterprise transformations.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1348,8 +1367,7 @@ const HireModernizationTalent = () => {
             Access Expert Talent for Your Modernization Project
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Hire skilled architects and developers experienced in safely
+            Hire AI mobile application developers skilled in safely migrating and upgrading complex legacy systems for seamless, high-performance transformations.
-            migrating and upgrading complex legacy systems.
           </p>
         </motion.div>
 
@@ -1556,8 +1574,7 @@ const ModernizationFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Don't let outdated technology hinder your growth. Transform your
+            Don't let outdated technology hinder growth. Transform software into modern, competitive assets through AI-powered design
-            software into a modern, competitive asset.
           </motion.p>
 
           <motion.div

pages/SaaSProductEngineering.tsx

@@ -120,9 +120,7 @@ const SaaSHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                From ideation to scalable deployment, WDI specializes in
+                From ideation to scalable deployment, WDI specializes in engineering robust, multi-tenant SaaS products with AI-powered design that drive recurring revenue.
-                engineering robust, multi-tenant SaaS products that drive
-                recurring revenue.
               </p>
             </div>
 
@@ -380,6 +378,13 @@ const SaaSBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Partner with WDI for Your SaaS Product?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            Discover expert SaaS product development that scales your vision into a revenue-driving platform with WDI's proven 25+ years of excellence.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -515,6 +520,11 @@ const SaaSProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Your SaaS Journey: From Concept to Market Leader
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Embark on a seamless SaaS development journey with WDI, where we transform your concept into an MVP, optimize for growth, and propel you to market dominance with data-driven scaling.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -667,6 +677,12 @@ const SaaSServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Comprehensive SaaS Engineering Capabilities
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+            Unlock WDI's full-spectrum SaaS engineering prowess, from ideation and MVP builds to cloud-native architecture, AI integrations, DevOps automation, and ongoing optimization for peak performance.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -914,8 +930,7 @@ const SaaSTechStack = () => {
             Building Resilient and High-Performing SaaS Products
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            With cutting-edge technologies designed for scale, security, and
+            With cutting-edge technologies designed for scale, security, and performance, WDI leverages AI mobile app development and AI-powered features to engineer unbreakable SaaS products with 99.99% uptime and global speed.
-            performance.
           </p>
         </motion.div>
 
@@ -1147,6 +1162,13 @@ const SaaSCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Successful SaaS Products Engineered by WDI
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            {/* End-to-end solutions for every stage of your product lifecycle. */}
+
+            Explore powerhouse SaaS platforms like AI-powered trading portals, yoga/meditation subscription apps, and fintech ecosystems, delivered with scalable architecture for startups and enterprises.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1358,8 +1380,7 @@ const HireSaaSDevelopers = () => {
             Need Specialized SaaS Talent?
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Hire experienced SaaS architects, engineers, and DevOps specialists
+            Hire experienced SaaS architects, AI mobile application developers, and DevOps specialists from WDI to accelerate your AI mobile app development and iOS mobile app development product timelines.
-            to accelerate your product development.
           </p>
         </motion.div>
 
@@ -1563,8 +1584,7 @@ const SaaSFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Partner with our experts to build a scalable, secure, and
+            Partner with our AI mobile application developers and AI app development company experts to build a scalable, secure AI mobile app with AI-powered features that captivates your market.
-            user-centric SaaS solution that captivates your market.
           </motion.p>
 
           <motion.div

pages/SoftwareEngineering.tsx

@@ -106,8 +106,7 @@ const HeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Build robust, scalable enterprise software systems with modern
+                Build robust, scalable enterprise systems with AI app development company expertise and modern practices like microservices, CI/CD pipelines, and cloud-native architecture.
-                engineering practices and proven methodologies.
               </p>
             </div>
 
@@ -227,8 +226,7 @@ const HorizontalTagScroller = () => {
             <span className="text-foreground"> We Follow</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Industry-leading methodologies that ensure code quality,
+            Industry-leading methodologies like DevOps, microservices, and CI/CD pipelines enhanced by AI-powered features ensure code quality, scalability, and maintainability.
-            scalability, and maintainability.
           </p>
         </motion.div>
 
@@ -355,7 +353,8 @@ const SideBySideContentWithIcons = () => {
           </h2>
 
           <p className="text-2xl text-gray-300 leading-relaxed">
-            Engineering excellence that stands the test of time.
+
+            WDI delivers AI mobile app development excellence with battle-tested enterprise architectures that ensure long-term scalability, zero-downtime deployments, and future-proof innovation.
           </p>
         </motion.div>
 
@@ -461,8 +460,7 @@ const TabbedServiceDisplay = () => {
             Software Engineering Services
           </h2>
           <p className="text-lg text-gray-300 max-w-4xl mx-auto leading-relaxed">
-            Comprehensive software engineering solutions designed for
+            Comprehensive AI-powered design solutions designed for enterprise-grade performance, reliability, and seamless scalability across complex business ecosystems.
-            enterprise-grade performance and reliability.
           </p>
         </motion.div>
 
@@ -553,8 +551,7 @@ const InlineCTA = () => {
 
             {/* Subtitle */}
             <p className="text-xl text-muted-foreground leading-relaxed max-w-2xl mx-auto">
-              Robust, scalable systems engineered with modern practices and
+              Robust, scalable systems engineered with AI mobile application developers and modern practices for unmatched performance.
-              proven methodologies.
             </p>
 
             {/* CTA Button */}
@@ -637,8 +634,7 @@ const HireDevelopersSection = () => {
             <span className="text-[#E5195E]">Engineering Experts</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Get access to senior software engineers who build robust, scalable
+            Get access to WDI's senior AI-powered features engineers who build robust, scalable enterprise systems with cutting-edge expertise.
-            enterprise systems.
           </p>
         </motion.div>
 
@@ -728,7 +724,7 @@ const softwareEngineeringFAQs = [
   {
     question: "What software engineering methodologies do you follow?",
     answer:
-      "We follow modern engineering practices including Agile/Scrum, DevOps, Test-Driven Development, continuous integration/deployment, and microservices architecture to ensure high-quality, maintainable software.",
+      "We follow modern engineering practices including Agile/Scrum, DevOps, Test-Driven Development, continuous integration/deployment, and microservices architecture enhanced by AI-powered features to ensure high-quality, maintainable software.",
   },
   {
     question: "How do you ensure code quality and maintainability?",
@@ -743,7 +739,7 @@ const softwareEngineeringFAQs = [
   {
     question: "What is your approach to system architecture?",
     answer:
-      "We design scalable, modular architectures using microservices, API-first approaches, cloud-native patterns, and modern frameworks that can evolve with your business requirements.",
+      "We design scalable, modular architectures using microservices, API-first approaches, cloud-native patterns, and modern frameworks that evolve with your business requirements.",
   },
   {
     question: "Do you provide ongoing software maintenance?",
@@ -765,7 +761,7 @@ export function SoftwareEngineering() {
       <HireDevelopersSection />
       <FAQSection
         title="Software Engineering Questions"
-        subtitle="Get answers to common questions about our software engineering services."
+        subtitle="Get answers to common questions about our AI app development company software engineering services."
         faqs={softwareEngineeringFAQs}
       />
       {/* <Footer /> */}

pages/SystemArchitectureDevOps.tsx

@@ -126,9 +126,7 @@ const DevOpsHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Designing robust, scalable system architectures and implementing
+                Designing AI-powered, robust, scalable system architectures and implementing efficient DevOps practices for continuous delivery and operational excellence.
-                efficient DevOps practices for continuous delivery and
-                operational excellence.
               </p>
             </div>
 
@@ -510,6 +508,11 @@ const DevOpsBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             The Foundation for High-Performance Software
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Harnessing enterprise-grade technologies and scalable architectures, WDI delivers the resilient core infrastructure essential for high-performance applications driving enterprise innovation.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -645,6 +648,11 @@ const DevOpsProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Approach to Building and Optimizing Your Digital Infrastructure
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI's AI iOS development methodology crafts resilient, scalable digital foundations through agile DevOps and web development expertise, ensuring optimal performance and future-ready operations.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -810,6 +818,11 @@ const DevOpsServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Specialized Expertise
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI excels in AI mobile app development and iOS mobile app development, delivering scalable enterprise solutions with cutting-edge expertise.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1016,8 +1029,7 @@ const DevOpsTechStack = () => {
             Leveraging Industry-Leading Tools
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            For robust and automated infrastructure management.
+            WDI uses top AI-powered design platforms for automated infrastructure management, ensuring robust efficiency and seamless scalability.          </p>
-          </p>
         </motion.div>
 
         {/* Cloud Platforms */}
@@ -1306,6 +1318,11 @@ const DevOpsCaseStudies = () => {
             Empowering Businesses with Resilient Infrastructure & Agile
             Operations
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI delivers AI mobile app development infrastructure and agile operations that ensure resilient performance, rapid scalability, and seamless enterprise agility.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1538,8 +1555,7 @@ const HireDevOpsTalent = () => {
             Need Specialized DevOps or Cloud Architecture Talent?
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access our highly skilled engineers proficient in cloud platforms,
+            Access WDI's AI mobile application developers. highly skilled engineers proficient in AI iOS development, cloud platforms, CI/CD pipelines, and system automation for enterprise excellence.
-            CI/CD, and system automation.
           </p>
         </motion.div>
 
@@ -1743,8 +1759,7 @@ const DevOpsFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Partner with WDI to build a secure, scalable, and efficient digital
+            Partner with WDI for AI mobile app development to build secure, scalable foundations that ensure seamless enterprise operations.
-            foundation for your business.
           </motion.p>
 
           <motion.div

pages/ThirdPartyIntegrations.tsx

@@ -125,9 +125,7 @@ const IntegrationsHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Connecting your disparate software systems and applications for
+                Enable AI-powered features to connect disparate systems, ensuring unified data flow, automated workflows, and enhanced app functionality.
-                unified data flow, automated workflows, and enhanced
-                functionality.
               </p>
             </div>
 
@@ -482,6 +480,11 @@ const IntegrationBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Integrate Your Systems with WDI?
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI streamlines your operations with AI-powered features, breaking down silos for real-time data flow, smarter decisions, and scalable growth.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -617,6 +620,11 @@ const IntegrationProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Strategic Approach to Seamless Integration
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI employs AI iOS development techniques to unify systems effortlessly, enabling smooth data exchange and automated processes for peak operational efficiency.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -635,14 +643,12 @@ const IntegrationProcess = () => {
                   whileInView={{ opacity: 1, x: 0 }}
                   transition={{ duration: 0.8, delay: index * 0.2 }}
                   viewport={{ once: true }}
-                  className={`flex items-center ${
+                  className={`flex items-center ${isEven ? "lg:flex-row" : "lg:flex-row-reverse"
-                    isEven ? "lg:flex-row" : "lg:flex-row-reverse"
+                    } flex-col lg:gap-16 gap-8`}
-                  } flex-col lg:gap-16 gap-8`}
                 >
                   <div
-                    className={`flex-1 ${
+                    className={`flex-1 ${isEven ? "lg:text-right" : "lg:text-left"
-                      isEven ? "lg:text-right" : "lg:text-left"
+                      } text-center lg:text-left`}
-                    } text-center lg:text-left`}
                   >
                     <div className="bg-card/20 backdrop-blur-md rounded-2xl border border-white/10 p-8 hover:border-accent/30 transition-all duration-300 shadow-lg hover:shadow-xl">
                       <div className="flex items-center gap-4 mb-4 justify-center lg:justify-start">
@@ -782,6 +788,11 @@ const IntegrationServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Comprehensive Integration Capabilities
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI's web development expertise powers seamless API connections and AI mobile app integrations, creating unified ecosystems that boost efficiency and scalability.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -956,7 +967,7 @@ const IntegrationTechStack = () => {
             Utilizing Robust Protocols and Platforms
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            For reliable system connectivity and seamless data exchange.
+            WDI leverages AI-powered design protocols and platforms for reliable system connectivity, ensuring seamless data exchange and uninterrupted enterprise workflows.
           </p>
         </motion.div>
 
@@ -1177,6 +1188,11 @@ const IntegrationCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Systems That Speak: Our Integration Success Stories
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            WDI's AI-powered features bring systems together seamlessly, powering real-time data sync and automated workflows that transform enterprise operations.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -1408,8 +1424,7 @@ const HireIntegrationTalent = () => {
             Need Expertise in System Integration?
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Hire our developers experienced in API development, middleware, and
+            Hire WDI's AI mobile application developers experienced in API development, middleware, and connecting diverse software platforms for seamless enterprise integration.
-            connecting diverse software platforms.
           </p>
         </motion.div>
 
@@ -1613,8 +1628,7 @@ const IntegrationFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Achieve unparalleled efficiency and data consistency by seamlessly
+            Achieve unparalleled efficiency and data consistency through AI app development company solutions that seamlessly integrate your essential software systems.
-            integrating your essential software systems.
           </motion.p>
 
           <motion.div
@@ -1667,7 +1681,7 @@ export const ThirdPartyIntegrations = () => {
         <IntegrationBenefits />
       </section>
 
-       {/* Case Studies */}
+      {/* Case Studies */}
       <section className="bg-background">
         <IntegrationCaseStudies />
       </section>

pages/UIUXDesign.tsx

@@ -120,8 +120,7 @@ const UIUXHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Crafting visually stunning and highly intuitive user interfaces
+                Crafting visually stunning and highly intuitive interfaces with AI-powered design that engage users and drive business objectives.
-                and experiences that engage users and drive business objectives.
               </p>
             </div>
 
@@ -488,6 +487,11 @@ const UIUXBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why User-Centric Design Matters
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            User-centric AI-powered design boosts satisfaction, cuts development costs, and drives higher engagement by prioritizing intuitive experiences over aesthetics.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -579,6 +583,11 @@ const UIUXDesignProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Our Collaborative & Iterative Design Process
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Team-driven cycles of prototyping, testing, and refinement with AI-powered design ensure user-focused outcomes and continuous improvement at every stage.
+
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -738,6 +747,11 @@ const UIUXDesignServices = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Our Comprehensive UI/UX Design Capabilities
           </h2>
+          <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
+
+            Full-spectrum AI-powered design expertise from user research and wireframing to prototyping, testing, and scalable design systems that drive engagement and conversions.
+
+          </p>
         </motion.div>
 
         <motion.div
@@ -892,8 +906,7 @@ const DesignToolsMethodologies = () => {
             Design Tools & Methodologies
           </h2>
           <p className="text-xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
-            Leveraging industry-standard tools and methodologies for impactful
+            Leveraging industry-standard tools like Figma, Sketch, and Adobe XD alongside AI-powered design methodologies for impactful, scalable user experiences.
-            design.
           </p>
         </motion.div>
 
@@ -1123,8 +1136,7 @@ const HireUIUXDesigners = () => {
             Hire World-Class UI/UX Designers
           </h2>
           <p className="text-xl text-gray-300 max-w-3xl mx-auto leading-relaxed">
-            Access our pool of talented designers specializing in intuitive
+            Access our pool of talented AI-powered design specialists who excel in intuitive interfaces, user research, and strategic UX that drives results.
-            interfaces, user research, and strategic UX.
           </p>
         </motion.div>
 
@@ -1327,8 +1339,7 @@ const UIUXFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            Partner with WDI for compelling UI/UX design that captures attention
+            Partner with WDI for compelling AI-powered design that captures attention and drives meaningful interactions.
-            and drives meaningful interactions.
           </motion.p>
 
           <motion.div

pages/VIB360Project.tsx

@@ -4,6 +4,7 @@ import { Footer } from "../components/Footer";
 import { Button } from "../components/ui/button";
 import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
+import vib360 from "../assets/vib360.jpg"
 import { ArrowRight, Calendar, Users, Smartphone, Globe, Monitor, Check, Star, TrendingUp, Factory, Shield, Zap, Settings, Target, AlertCircle, Clock, Database, Wifi, BarChart3, Bell, Activity, Wrench, Brain } from "lucide-react";
 import { useNavigate } from "react-router-dom";
 // import vib360Image from "figma:asset/6e4d0e4c1e2f3a4b5c6d7e8f9g0h1i2j3k4l5m6n7o8p9q0r1s2t.png";
@@ -15,7 +16,7 @@ export const VIB360Project = () => {
   return (
     <div className="dark min-h-screen bg-background">
       {/* <Navigation /> */}
-      
+
       {/* Hero Section */}
       <section className="pt-24 pb-16 bg-background relative overflow-hidden">
         <div className="absolute inset-0 bg-gradient-to-br from-[#E5195E]/5 via-transparent to-transparent" />
@@ -28,11 +29,11 @@ export const VIB360Project = () => {
                   Industrial IoT Case Study
                 </Badge>
               </div>
-              
+
               <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope">
                 VIB360 Platform
               </h1>
-              
+
               <p className="text-xl text-muted-foreground mb-8 font-manrope">
                 Industrial IoT Vibration Monitoring & Predictive Maintenance Platform - AI-enabled solution for real-time monitoring and operational efficiency
               </p>
@@ -88,7 +89,7 @@ export const VIB360Project = () => {
 
               {/* CTA Buttons */}
               <div className="flex flex-col sm:flex-row gap-4">
-                <Button 
+                <Button
                   size="lg"
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
                   onClick={() => navigate('/start-a-project')}
@@ -96,7 +97,7 @@ export const VIB360Project = () => {
                   Build Your IoT Platform
                   <ArrowRight className="w-5 h-5 ml-2" />
                 </Button>
-                <Button 
+                <Button
                   size="lg"
                   variant="outline"
                   className="border-white/20 text-white hover:bg-white/10 font-manrope"
@@ -109,8 +110,8 @@ export const VIB360Project = () => {
 
             <div className="relative">
               <div className="aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10">
-                <img 
+                <img
-                  src={vib360Image} 
+                  src={vib360Image}
                   alt="VIB360 Industrial IoT Vibration Monitoring Platform"
                   className="w-full h-full object-cover rounded-lg"
                 />
@@ -140,7 +141,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Overview</h2>
-            
+
             <div className="grid md:grid-cols-3 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -181,7 +182,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Project Scope</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Core Features</h3>
@@ -229,7 +230,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Challenges & Solution Architecture</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-12 mb-16">
               <div>
                 <h3 className="text-xl font-semibold text-white mb-6 font-manrope">Technical Challenges</h3>
@@ -315,43 +316,43 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Development Process & Methodology</h2>
-            
+
             <div className="mb-12">
               <div className="text-center mb-8">
                 <p className="text-lg text-muted-foreground font-manrope">
                   <strong>Agile</strong> (2-week sprints) with sprint reviews with hardware + software teams, field testing after each major release, iterative model retraining with new sensor data
                 </p>
               </div>
-              
+
               <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
                 {[
-                  { 
+                  {
-                    phase: "Discovery & Planning", 
+                    phase: "Discovery & Planning",
                     duration: "3 weeks",
                     description: "Hardware-software integration feasibility, AI model baseline setup"
                   },
-                  { 
+                  {
-                    phase: "Design & Prototyping", 
+                    phase: "Design & Prototyping",
                     duration: "5 weeks",
                     description: "Sensor data visualization mockups, mobile UI/UX for technician workflows"
                   },
-                  { 
+                  {
-                    phase: "Core Platform Development", 
+                    phase: "Core Platform Development",
                     duration: "12 weeks",
                     description: "Sensor connectivity modules, time-series data ingestion pipeline, web dashboard core features"
                   },
-                  { 
+                  {
-                    phase: "AI & Analytics Module", 
+                    phase: "AI & Analytics Module",
                     duration: "6 weeks",
                     description: "Model training & tuning, predictive maintenance alerts"
                   },
-                  { 
+                  {
-                    phase: "Integration & Testing", 
+                    phase: "Integration & Testing",
                     duration: "5 weeks",
                     description: "SCADA/ERP integration APIs, field testing in pilot plants"
                   },
-                  { 
+                  {
-                    phase: "Deployment & Training", 
+                    phase: "Deployment & Training",
                     duration: "3 weeks",
                     description: "Rollout to initial sites, staff training & documentation"
                   }
@@ -382,7 +383,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Key Features & Functionality</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
               {[
                 {
@@ -434,7 +435,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Results & Impact</h2>
-            
+
             <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
               {[
                 { label: "Site Deployments", value: "15", icon: Factory, desc: "industrial sites" },
@@ -495,7 +496,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-12 text-center font-manrope">Lessons Learned & Best Practices</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -560,7 +561,7 @@ export const VIB360Project = () => {
         <div className="container mx-auto px-6 lg:px-8">
           <div className="max-w-4xl mx-auto">
             <h2 className="text-3xl font-bold text-white mb-8 text-center font-manrope">Future Roadmap</h2>
-            
+
             <div className="grid md:grid-cols-2 gap-8">
               <Card className="bg-card/50 border-white/10">
                 <CardContent className="p-6">
@@ -611,7 +612,7 @@ export const VIB360Project = () => {
               Create advanced predictive maintenance platforms with AI-enabled vibration monitoring and real-time analytics for industrial excellence.
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <Button 
+              <Button
                 size="lg"
                 className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
                 onClick={() => navigate('/start-a-project')}
@@ -619,7 +620,7 @@ export const VIB360Project = () => {
                 Start Your Project
                 <ArrowRight className="w-5 h-5 ml-2" />
               </Button>
-              <Button 
+              <Button
                 size="lg"
                 variant="outline"
                 className="border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"

pages/WearableDeviceDevelopment.tsx

@@ -122,9 +122,7 @@ const WearableHeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Extending your digital presence to smartwatches, fitness
+                Extending your digital presence to smartwatches, fitness trackers, IoT devices, and emerging platforms through AI-powered features for unique user experiences.
-                trackers, IoT devices, and emerging platforms for unique user
-                experiences.
               </p>
             </div>
 
@@ -416,6 +414,9 @@ const WearableBenefits = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Why Invest in Device-Specific App Development?
           </h2>
+          <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
+            AI mobile app development unlocks smartwatch, fitness tracker, and IoT device capabilities for unique, context-aware user experiences.
+          </p>
         </motion.div>
 
         <motion.div
@@ -696,6 +697,9 @@ const WearableProcess = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Tailored Process for Emerging Device Applications
           </h2>
+          <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
+            Our proven methodology ensures optimal performance across smartwatches, fitness trackers, and IoT devices through AI-powered design.
+          </p>
         </motion.div>
 
         <div className="relative">
@@ -826,6 +830,9 @@ const WearableUseCases = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-6">
             Industries & Scenarios Benefiting from Device Apps
           </h2>
+          <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
+            Healthcare, fitness, manufacturing, logistics, and retail leverage smartwatch and IoT apps through AI mobile app development for real-time monitoring and insights.
+          </p>
         </motion.div>
 
         <motion.div
@@ -1016,6 +1023,9 @@ const WearableTechStack = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-foreground mb-6">
             Leveraging Specialized Technologies for Seamless Device Integration
           </h2>
+          <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
+            We harness AI-powered design and platform-specific APIs for smartwatches, fitness trackers, and IoT devices to deliver native-like performance.
+          </p>
         </motion.div>
 
         {/* Core Technologies */}
@@ -1026,7 +1036,7 @@ const WearableTechStack = () => {
           viewport={{ once: true }}
           className="mb-16"
         >
-           <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+          <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
             {technologies.map((tech, index) => {
               // const IconComponent = tech.icon;
               const colorClasses = {
@@ -1162,6 +1172,9 @@ const WearableCaseStudies = () => {
           <h2 className="text-4xl lg:text-5xl font-semibold text-white mb-8">
             Innovative Device Applications by WDI
           </h2>
+          <p className="text-[#CCCCCC] text-lg max-w-2xl mx-auto">
+            See how our AI mobile application developers deliver smartwatch, fitness tracker, and IoT solutions with AI-powered features across industries.
+          </p>
         </motion.div>
 
         <motion.div
@@ -1420,8 +1433,7 @@ const WearableFinalCTA = () => {
             viewport={{ once: true }}
             className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
           >
-            From smartwatches to complex IoT systems, we build connected
+            From smartwatches to complex IoT systems, we build connected AI mobile apps that push the boundaries of digital interaction.
-            applications that push the boundaries of digital interaction.
           </motion.p>
 
           <motion.div
@@ -1502,7 +1514,7 @@ export const WearableDeviceDevelopment = () => {
 
       <HireDeveloperSection
         title="Augment Your Team with Top Wearable App Developers"
-        description="Develop seamless, real-time apps for smartwatches and wearable devices tailored for fitness, healthcare, and lifestyle industries."
+        description="Develop seamless, real-time AI mobile apps for smartwatches and wearable devices tailored for fitness, healthcare, and lifestyle industries."
         buttonText="Hire Wearable Developers"
         buttonLink="/hire-talent/wearable-app-developers"
         developerTypes={[

pages/WebCloudServices.tsx

@@ -150,8 +150,7 @@ const HeroWithCTA = () => {
               </h1>
 
               <p className="text-lg text-gray-300 leading-relaxed max-w-lg">
-                Build high-performance web applications and robust cloud
+                Build high-performance web development applications and robust cloud infrastructure with AI-powered design that scales with your business growth.
-                infrastructure that scales with your business growth.
               </p>
             </div>
 
@@ -258,8 +257,7 @@ const HorizontalTagScroller = () => {
             <span className="text-foreground"> We Master</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Modern web and cloud technologies that power enterprise-grade
+            Modern web development and cloud technologies with AI-powered features that power enterprise-grade AI mobile app solutions.
-            solutions.
           </p>
         </motion.div>
 
@@ -386,7 +384,7 @@ const SideBySideContentWithIcons = () => {
           </h2>
 
           <p className="text-2xl text-gray-300 leading-relaxed">
-            Enterprise-grade solutions with proven reliability.
+            Enterprise-grade web development solutions with proven reliability and AI-powered design.
           </p>
         </motion.div>
 
@@ -490,8 +488,8 @@ const TabbedServiceDisplay = () => {
             Web & Cloud Service Areas
           </h2>
           <p className="text-lg text-gray-300 max-w-4xl mx-auto leading-relaxed">
-            Comprehensive web development and cloud solutions designed for
+            Comprehensive web development and cloud solutions with AI-powered design designed for scalability and performance.
-            scalability and performance.
+
           </p>
         </motion.div>
 
@@ -582,8 +580,7 @@ const InlineCTA = () => {
 
             {/* Subtitle */}
             <p className="text-xl text-muted-foreground leading-relaxed max-w-2xl mx-auto">
-              Deploy robust, secure, and high-performance applications that
+              Deploy robust, secure, and high-performance web development applications with AI-powered design that scale with your business growth.
-              scale with your business growth.
             </p>
 
             {/* CTA Button */}
@@ -650,7 +647,7 @@ const HireDevelopersSection = () => {
   ];
 
   const navigate = useNavigate();
-  
+
   return (
     <section className="py-32 bg-background">
       <div className="container mx-auto px-6 lg:px-8">
@@ -666,8 +663,7 @@ const HireDevelopersSection = () => {
             <span className="text-[#E5195E]">Cloud Specialists</span>
           </h2>
           <p className="text-2xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
-            Get access to expert developers who specialize in modern web and
+            Get access to expert developers who specialize in modern web development and cloud technologies with AI-powered design.
-            cloud technologies.
           </p>
         </motion.div>
 
@@ -757,7 +753,7 @@ const webCloudFAQs = [
   {
     question: "What web technologies do you specialize in?",
     answer:
-      "We specialize in modern web technologies including React, Next.js, Node.js, Python, TypeScript, and various cloud platforms like AWS, Azure, and Google Cloud. Our team stays current with the latest frameworks and best practices.",
+      "We specialize in modern web development technologies including React, Next.js, Node.js, Python, TypeScript, and various cloud platforms like AWS, Azure, and Google Cloud with AI-powered design. Our team stays current with the latest frameworks and best practices.",
   },
   {
     question: "How do you ensure web application security?",
@@ -772,7 +768,7 @@ const webCloudFAQs = [
   {
     question: "What is your approach to scalable architecture?",
     answer:
-      "We design applications with scalability in mind from the start, using microservices architecture, containerization, load balancing, and auto-scaling features. This ensures your application can handle growth efficiently.",
+      "We design applications with scalability in mind from the start, using microservices architecture, containerization, load balancing, and auto-scaling features with AI-powered design. This ensures your application can handle growth efficiently.",
   },
   {
     question: "Do you provide ongoing maintenance and support?",

pages/iOSAppDevelopment.tsx

@@ -131,8 +131,7 @@ const IOSHeroWithCTA = () => {
               </h1>
 
               <p className="max-w-lg text-lg leading-relaxed text-gray-300">
-                Crafting intuitive, high-performance iPhone and iPad
+                Crafting intuitive, high-performance iPhone and iPad applications with AI iOS development that define user experience and drive engagement.
-                applications that define user experience and drive engagement.
               </p>
             </div>
 
@@ -186,7 +185,7 @@ const IOSHeroWithCTA = () => {
               {/* {" "} */}
               <Spline
                 scene="https://prod.spline.design/3GGwAe3v1Q7oobGU/scene.splinecode"
-                // className="w-[40%] h-full"
+              // className="w-[40%] h-full"
               />
             </div>
           </motion.div>
@@ -285,9 +284,7 @@ const IOSCaseStudies = () => {
             iOS Apps That Drive Results
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            Discover how we've helped businesses succeed with exceptional iOS
+            Discover how our AI mobile application developers have helped businesses succeed with exceptional iOS applications that leverage AI iOS development capabilities and deliver outstanding AI mobile app experiences.
-            applications that leverage native capabilities and deliver
-            outstanding user experiences.
           </p>
         </motion.div>
 
@@ -513,8 +510,7 @@ const IOSProcessTimeline = () => {
             Our Proven Approach to Building Your iOS App
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-gray-300">
-            From concept to App Store success, we guide you through every step
+            From concept to App Store success, our AI mobile application developers guide you through every step of the AI iOS development journey.
-            of the iOS development journey.
           </p>
         </motion.div>
 
@@ -809,8 +805,7 @@ const IOSKeyBenefits = () => {
             Why Choose Native iOS for Your App?
           </h2>
           <p className="max-w-3xl mx-auto text-xl leading-relaxed text-muted-foreground">
-            iOS development offers unparalleled advantages for businesses
+            AI iOS development offers unparalleled advantages for businesses looking to create premium AI mobile app experiences.
-            looking to create premium mobile experiences.
           </p>
         </motion.div>