add dynamic no. in contat page and other changes

App.tsx

@@ -374,7 +374,7 @@ export default function App() {
     "/solutions": Solutions,
     "/industries": Industries,
     "/resources": Resources,
-    "/company": Company,
+    // "/company": Company,
     // "/contact": ContactMain,
     "/web-cloud": WebCloudServices,
     "/software-engineering": SoftwareEngineering,

components/Navigation.tsx

@@ -967,7 +967,7 @@ export const Navigation = () => {
       case "Services":
         return "/services";
       case "Company":
-        return "/company";
+        return "/company/about-wdi";
       case "Resources":
         return "/resources";
       case "Contact":

pages/AboutWDI.tsx

@@ -17,6 +17,7 @@ import {
   BookOpen, MessageSquare, Briefcase, Mail
 } from "lucide-react";
 import { Helmet } from "react-helmet-async";
+import { CarouselTestimonials } from "@/components/CarouselTestimonials";
 
 // Enhanced Hero Section
 const HeroWithCTA = () => {
@@ -414,15 +415,17 @@ const TestimonialSection = () => {
           whileInView={{ opacity: 1, y: 0 }}
           transition={{ duration: 0.8 }}
           viewport={{ once: true }}
-          className="text-left mb-16"
+        // className="text-left mb-16"
         >
-          <h2 className="text-3xl lg:text-4xl font-semibold leading-tight mb-6">
+          {/* <h2 className="text-3xl lg:text-4xl font-semibold leading-tight mb-6">
             <span className="text-white">What Our </span>
             <span className="text-[#E5195E]">Clients Say</span>
-          </h2>
+          </h2> */}
+          <CarouselTestimonials />
         </motion.div>
 
-        <motion.div
+
+        {/* <motion.div
           initial={{ opacity: 0, y: 40 }}
           whileInView={{ opacity: 1, y: 0 }}
           transition={{ duration: 0.8, delay: 0.2 }}
@@ -454,7 +457,7 @@ const TestimonialSection = () => {
               </div>
             </CardContent>
           </Card>
-        </motion.div>
+        </motion.div> */}
       </div>
     </section>
   );

pages/Contact.tsx

@@ -39,7 +39,7 @@ export const Contact = () => {
   ];
 
   const contactMethods = [
-    { icon: Mail, title: "Email", value: "info@wdi.com", description: "Send us an email and we'll respond within 24 hours" },
+    { icon: Mail, title: "Email", value: "ideas@wdipl.com", description: "Send us an email and we'll respond within 24 hours" },
     { icon: Phone, title: "Phone", value: "+1 (555) 123-4567", description: "Call us during business hours for immediate assistance" },
     { icon: MapPin, title: "Address", value: "123 Innovation Drive, Tech City, TC 12345", description: "Visit our headquarters for in-person meetings" },
     { icon: Clock, title: "Business Hours", value: "Mon-Fri: 9:00 AM - 6:00 PM EST", description: "We're available to help during business hours" }

pages/OfficeLocations.tsx

@@ -394,7 +394,7 @@ export const OfficeLocations = () => {
                 <CardContent className="p-6 text-center">
                   <Mail className="w-8 h-8 text-[#E5195E] mx-auto mb-4" />
                   <h3 className="text-lg font-semibold text-white mb-2">Global Email</h3>
-                  <p className="text-muted-foreground mb-4">info@wdi.com</p>
+                  <p className="text-muted-foreground mb-4">ideas@wdipl.com</p>
                   <Button variant="outline" className="border-white/20 text-white hover:bg-white/10">
                     Send Email
                   </Button>

pages/ScheduleDiscoveryCall.tsx

@@ -388,10 +388,12 @@ export const ScheduleDiscoveryCall = () => {
                   <p className="text-muted-foreground text-sm mb-4">
                     If scheduling isn't convenient, you can reach us directly via email.
                   </p>
-                  <Button variant="outline" className="w-full border-white/20 text-white hover:bg-white/10">
+                  <a href="mailto:ideas@wdipl.com" className="block w-full">
-                    <Mail className="w-4 h-4 mr-2" />
+                    <Button variant="outline" className="w-full border-white/20 text-white hover:bg-white/10">
-                    Send Email to info@wdi.com
+                      <Mail className="w-4 h-4 mr-2" />
-                  </Button>
+                      Send Email to ideas@wdipl.com
+                    </Button>
+                  </a>
                 </CardContent>
               </Card>
             </div>
@@ -400,7 +402,7 @@ export const ScheduleDiscoveryCall = () => {
       </section>
 
       {/* Our Experts Section */}
-      <section className="py-16 bg-background">
+      {/* <section className="py-16 bg-background">
         <div className="container mx-auto px-6 lg:px-8">
           <div className="text-center mb-12">
             <h2 className="text-3xl font-bold text-white mb-4">Meet Our Expert Consultants</h2>
@@ -433,7 +435,7 @@ export const ScheduleDiscoveryCall = () => {
             ))}
           </div>
         </div>
-      </section>
+      </section> */}
 
       {/* Process Section */}
       <section className="py-16 bg-card/50">
@@ -473,7 +475,9 @@ export const ScheduleDiscoveryCall = () => {
               Don't wait! Book your free discovery call today and take the first step toward bringing your vision to life.
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <Button size="lg" className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white">
+              <Button size="lg" className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
+                onClick={() => navigateTo("/start-a-project")}
+              >
                 Book Your Free Consultation Now
                 <ArrowRight className="ml-2 w-4 h-4" />
               </Button>

pages/StartAProject.tsx

@@ -278,9 +278,8 @@ const ProjectFormSection = () => {
       <Input
         type={type}
         placeholder={placeholder}
-        className={`bg-gray-800/30 border-gray-600/50 text-white h-12 text-base ${
+        className={`bg-gray-800/30 border-gray-600/50 text-white h-12 text-base ${errors[field] ? "border-red-500" : ""
-          errors[field] ? "border-red-500" : ""
+          }`}
-        }`}
         value={formData[field] as string}
         onChange={(e) => setFormData({ ...formData, [field]: e.target.value })}
         onBlur={() => handleBlur(field)}
@@ -295,7 +294,8 @@ const ProjectFormSection = () => {
     field: keyof typeof formData,
     label: string,
     placeholder: string,
-    options: { value: string; label: string }[]
+    options: { value: string; label: string }[],
+    onValueChange?: (value: string) => void
   ) => (
     <div className="space-y-3" id={field}>
       <label className="block text-sm font-medium text-white">{label} *</label>
@@ -306,12 +306,14 @@ const ProjectFormSection = () => {
           setFormData(updated);
           setTouched({ ...touched, [field]: true });
           validateField(field, updated);
+          if (onValueChange) {
+            onValueChange(value);
+          }
         }}
       >
         <SelectTrigger
-          className={`bg-gray-800/30 border-gray-600/50 text-white h-12 ${
+          className={`bg-gray-800/30 border-gray-600/50 text-white h-12 min-h-12 ${errors[field] ? "border-red-500" : ""
-            errors[field] ? "border-red-500" : ""
+            }`}
-          }`}
         >
           <SelectValue placeholder={placeholder} />
         </SelectTrigger>
@@ -329,6 +331,18 @@ const ProjectFormSection = () => {
     </div>
   );
 
+  // Add this near the top of your file with other constants
+  const COUNTRY_CODES: Record<string, string> = {
+    us: "+1",
+    uk: "+44",
+    ca: "+1",
+    au: "+61",
+    in: "+91",
+    de: "+49",
+    fr: "+33",
+    other: "+",
+  };
+
   const renderTextarea = (
     field: keyof typeof formData,
     label: string,
@@ -347,9 +361,8 @@ const ProjectFormSection = () => {
       <Textarea
         placeholder={placeholder}
         rows={rows}
-        className={`bg-gray-800/30 border-gray-600/50 text-white text-base resize-none ${
+        className={`bg-gray-800/30 border-gray-600/50 text-white text-base resize-none ${errors[field] ? "border-red-500" : ""
-          errors[field] ? "border-red-500" : ""
+          }`}
-        }`}
         value={formData[field] as string}
         onChange={(e) => setFormData({ ...formData, [field]: e.target.value })}
         onBlur={() => handleBlur(field)}
@@ -498,12 +511,22 @@ const ProjectFormSection = () => {
                         { value: "de", label: "Germany" },
                         { value: "fr", label: "France" },
                         { value: "other", label: "Other" },
-                      ]
+                      ],
+                      (value) => {
+                        // When country changes, update the phone field if it's empty or starts with a +
+                        const updated = { ...formData, country: value };
+                        if (!formData.phone || formData.phone.startsWith("+")) {
+                          updated.phone = COUNTRY_CODES[value] || "";
+                        }
+                        setFormData(updated);
+                        setTouched({ ...touched, country: true });
+                        validateField("country", updated);
+                      }
                     )}
                     {renderInputField(
                       "phone",
                       "Contact Number",
-                      "+1 (555) 123-4567"
+                      formData.country ? `${COUNTRY_CODES[formData.country] || "+"} (XXX) XXX-XXXX` : "+XX (XXX) XXX-XXXX"
                     )}
                   </div>
                 </div>
@@ -728,8 +751,8 @@ const ProjectFormSection = () => {
                       {!formData.agreeTerms && !isRecaptchaVerified
                         ? "Please agree to terms and complete verification to submit"
                         : !formData.agreeTerms
-                        ? "Please agree to terms and conditions to submit"
+                          ? "Please agree to terms and conditions to submit"
-                        : "Please complete the security verification to submit"}
+                          : "Please complete the security verification to submit"}
                     </p>
                   )}
                 </div>