created pages android ios

components/Footer.tsx

@@ -128,6 +128,32 @@ const footerNavigation = {
       url: "/dedicated-development-teams",
     },
   ],
+  NewColumn: [
+    {
+      label: "Android App Development India",
+      url: "/services/android-app-development-india",
+    },
+    {
+      label: "Android App Development UK",
+      url: "/services/android-app-development-uk",
+    },
+    {
+      label: "Android App Development USA",
+      url: "/services/android-app-development-usa",
+    },
+    {
+      label: "IOS App Development India",
+      url: "/services/ios-app-development-india",
+    },
+    {
+      label: "IOS App Development UK",
+      url: "/services/ios-app-development-uk",
+    },
+    {
+      label: "IOS App Development USA",
+      url: "/services/ios-app-development-usa",
+    },
+  ],
   Company: [
     {
       label: "About WDI",
@@ -187,7 +213,6 @@ const contactInfo = [
   },
 ];
 
-
 // FooterSection component with useNavigate inside
 const FooterSection = ({
   title,
@@ -208,14 +233,12 @@ const FooterSection = ({
       viewport={{ once: true }}
       className="space-y-4"
     >
-      <h4 className="font-semibold text-white text-lg">
+      <h4 className="font-semibold text-white text-lg">{title}</h4>
-        {title}
-      </h4>
       <ul className="space-y-3">
         {links.map((link) => (
           <li key={link.label}>
             <a
-              href={link.url || '#'}
+              href={link.url || "#"}
               onClick={(e) => {
                 e.preventDefault();
                 navigate(link.url);
@@ -268,9 +291,8 @@ const NewsletterSection = () => {
             Never Miss an Update
           </h3>
           <p className="text-[#CCCCCC] text-lg mb-8 max-w-2xl mx-auto">
-            Get the latest insights on digital product
+            Get the latest insights on digital product development, AI trends,
-            development, AI trends, and startup success stories
+            and startup success stories delivered to your inbox.
-            delivered to your inbox.
           </p>
 
           {isSubscribed ? (
@@ -281,19 +303,14 @@ const NewsletterSection = () => {
             >
               <div className="flex items-center justify-center gap-2 text-green-400">
                 <Mail className="w-5 h-5" />
-                <span className="font-medium">
+                <span className="font-medium">Successfully subscribed!</span>
-                  Successfully subscribed!
-                </span>
               </div>
               <p className="text-green-300 text-sm mt-2">
                 Welcome to our community of innovators.
               </p>
             </motion.div>
           ) : (
-            <form
+            <form onSubmit={handleSubscribe} className="max-w-md mx-auto">
-              onSubmit={handleSubscribe}
-              className="max-w-md mx-auto"
-            >
               <div className="flex gap-3">
                 <Input
                   type="email"
@@ -308,14 +325,11 @@ const NewsletterSection = () => {
                   disabled={isSubmitting}
                   className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-6 shrink-0 disabled:opacity-50"
                 >
-                  {isSubmitting
+                  {isSubmitting ? "Subscribing..." : "Subscribe"}
-                    ? "Subscribing..."
-                    : "Subscribe"}
                 </Button>
               </div>
               <p className="text-[#CCCCCC] text-xs mt-3">
-                No spam, unsubscribe at any time. We respect
+                No spam, unsubscribe at any time. We respect your privacy.
-                your privacy.
               </p>
             </form>
           )}
@@ -335,7 +349,7 @@ export const Footer = () => {
         <div className="relative z-10">
           {/* Main Footer Content */}
           <div className="container mx-auto px-6 lg:px-8 py-16">
-            <div className="grid lg:grid-cols-7 gap-12">
+            <div className="grid lg:grid-cols-8 gap-12">
               {/* Company Info */}
               <motion.div
                 initial={{ opacity: 0, y: 30 }}
@@ -351,7 +365,9 @@ export const Footer = () => {
                 </div>
 
                 <p className="text-[#CCCCCC] leading-relaxed max-w-md">
-                  Website Developers India Pvt. Ltd. - Transforming ideas into scalable digital products. 25+ years of industry expertise, serving founders and CTOs across 15+ countries.
+                  Website Developers India Pvt. Ltd. - Transforming ideas into
+                  scalable digital products. 25+ years of industry expertise,
+                  serving founders and CTOs across 15+ countries.
                 </p>
 
                 {/* India Office Contact Information */}
@@ -367,7 +383,9 @@ export const Footer = () => {
                           key={contact.label}
                           href={contact.url}
                           target={contact.blank ? "_blank" : "_self"}
-                          rel={contact.blank ? "noopener noreferrer" : undefined}
+                          rel={
+                            contact.blank ? "noopener noreferrer" : undefined
+                          }
                           className="flex items-start gap-3 text-[#CCCCCC] hover:text-white transition-colors duration-200"
                         >
                           <Icon className="w-4 h-4 text-[#E5195E] mt-0.5 flex-shrink-0" />
@@ -446,6 +464,11 @@ export const Footer = () => {
                 links={footerNavigation.HireTalent}
                 delay={0.7}
               />
+              <FooterSection
+                title="Countries we serve"
+                links={footerNavigation.NewColumn}
+                delay={0.8}
+              />
             </div>
           </div>
 

components/Navigation.tsx

@@ -101,22 +101,12 @@ const navigationData = {
       href: "/services/mobile-app-development",
       sub_services: [
         { name: "iOS App Development", href: "/services/ios-app-development" },
+
         {
           name: "Android App Development",
           href: "/services/android-app-development",
         },
-        {
+
-          name: "Android App Development India",
-          href: "/services/android-app-development-india",
-        },
-           {
-          name: "Android App Development UK",
-          href: "/services/android-app-development-uk",
-        },
-        {
-          name: "Android App Development USA",
-          href: "/services/android-app-development-usa",
-        },
         {
           name: "Cross-Platform App Development",
           href: "/services/cross-platform-app-development",
@@ -478,7 +468,7 @@ const navigationData = {
       icon: BookOpen,
       href: "https://www.wdipl.com/blog",
       target: "_blank",
-      rel: "noopener noreferrer"
+      rel: "noopener noreferrer",
     },
     { text: "Portfolio", icon: FileText, href: "/case-studies" },
     {
@@ -925,7 +915,7 @@ export const Navigation = () => {
       cancelClose();
       openMenu(item);
     },
-    [cancelClose, openMenu]
+    [cancelClose, openMenu],
   );
 
   const handleNavItemMouseLeave = useCallback(() => {
@@ -942,7 +932,7 @@ export const Navigation = () => {
         closeMenu();
       }
     },
-    [closeMenu]
+    [closeMenu],
   );
 
   const handleNavMouseEnter = useCallback(() => {
@@ -1042,8 +1032,9 @@ export const Navigation = () => {
                   {item}
                   {hasDropdown(item) && (
                     <ChevronDown
-                      className={`w-4 h-4 transition-transform duration-200 ${activeMenu === item ? "rotate-180" : ""
+                      className={`w-4 h-4 transition-transform duration-200 ${
-                        }`}
+                        activeMenu === item ? "rotate-180" : ""
+                      }`}
                     />
                   )}
                 </a>

src/Router.tsx

@@ -33,6 +33,9 @@ import { EcommercePlatforms } from "../pages/EcommercePlatforms";
 import { EnterpriseSoftwareSolutions } from "../pages/EnterpriseSoftwareSolutions";
 import { GenAIIntegrationDigitalProducts } from "../pages/GenAIIntegrationDigitalProducts";
 import { IOSAppDevelopment } from "../pages/iOSAppDevelopment";
+import { IOSAppDevelopmentIndia } from "../pages/IOSAppDevelopmentIndia";
+import { IOSAppDevelopmentUK } from "../pages/IOSAppDevelopmentUK";
+import { IOSAppDevelopmentUSA } from "../pages/IOSAppDevelopmentUSA";
 import { MobileAppDevelopment } from "../pages/MobileAppDevelopment";
 import { NativeAppDevelopment } from "../pages/NativeAppDevelopment";
 import { NLPTextAnalytics } from "../pages/NLPTextAnalytics";
@@ -210,6 +213,18 @@ export const AppRouter = () => (
     <Route
       path="/services/ios-app-development"
       element={<IOSAppDevelopment />}
+    />
+     <Route
+      path="/services/ios-app-development-india"
+      element={<IOSAppDevelopmentIndia />}
+    />
+     <Route
+      path="/services/ios-app-development-uk"
+      element={<IOSAppDevelopmentUK />}
+    />
+     <Route
+      path="/services/ios-app-development-usa"
+      element={<IOSAppDevelopmentUSA />}
     />
     <Route
       path="/services/android-app-development"