I want you to change a few things: 1. Change the company name to Lombard Tech 2. Update the website so that instead of the sections being About, Sectors, Clients, Candidates, and 'Contact Us', the sections will now be Home, About Us, Market Coverage, Our Services, Candidates, and Contact (and in that order). .... Once you've done those, I shall give you the next instructions - Follow Up Deployment

index.html

@@ -8,23 +8,28 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
         .hero-gradient {
-            background: linear-gradient(135deg, rgba(30, 58, 138, 0.9) 0%, rgba(30, 64, 175, 0.9) 50%, rgba(29, 78, 216, 0.9) 100%), url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2072&q=80') center/cover no-repeat;
+            background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(20, 20, 20, 0.8) 100%), url('https://images.unsplash.com/photo-1483728642387-6c3bdd6c93e5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=120') center/cover no-repeat;
         }
         
         .about-bg {
-            background: url('https://images.unsplash.com/photo-1523961131990-5ea7c61b2107?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1974&q=80') center/cover no-repeat;
+            background: url('https://images.unsplash.com/photo-1526778548025-fa2f459cd5c1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=110') center/cover no-repeat;
         }
         
         .sectors-bg {
-            background: url('https://images.unsplash.com/photo-1537105008862-56be79ebf3c3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80') center/cover no-repeat;
+            background: url('https://images.unsplash.com/photo-1505902987837-1afc6a7e98e1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=130') center/cover no-repeat;
         }
         
         .candidates-bg {
-            background: url('https://images.unsplash.com/photo-1526657782461-9fe13402a841?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2089&q=80') center/cover no-repeat;
+            background: url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=115') center/cover no-repeat;
         }
         
         .clients-bg {
-            background: url('https://images.unsplash.com/photo-1507679799987-c73779587ccf?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2071&q=80') center/cover no-repeat;
+            background: url('https://images.unsplash.com/photo-1480714378408-67cf0d13bc1b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=125') center/cover no-repeat;
+        }
+
+        /* Additional section backgrounds */
+        .who-we-recruit-bg {
+            background: url('https://images.unsplash.com/photo-1496442226666-8d4d0e62e6e9?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80&grayscale&contrast=120') center/cover no-repeat;
         }
         .sector-card {
             transition: all 0.3s ease;
@@ -61,14 +66,15 @@
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex justify-between h-16">
                 <div class="flex items-center">
-                    <a href="#" class="text-xl font-bold text-blue-900">INK SEARCH</a>
+                    <a href="#" class="text-xl font-bold text-blue-900">LOMBARD TECH</a>
                 </div>
                 <div class="hidden md:flex items-center space-x-8">
-                    <a href="#about" class="text-gray-700 hover:text-blue-600 transition animated-underline">About</a>
-                    <a href="#sectors" class="text-gray-700 hover:text-blue-600 transition animated-underline">Sectors</a>
-                    <a href="#clients" class="text-gray-700 hover:text-blue-600 transition animated-underline">Clients</a>
+                    <a href="#home" class="text-gray-700 hover:text-blue-600 transition animated-underline">Home</a>
+                    <a href="#about" class="text-gray-700 hover:text-blue-600 transition animated-underline">About Us</a>
+                    <a href="#market" class="text-gray-700 hover:text-blue-600 transition animated-underline">Market Coverage</a>
+                    <a href="#services" class="text-gray-700 hover:text-blue-600 transition animated-underline">Our Services</a>
                     <a href="#candidates" class="text-gray-700 hover:text-blue-600 transition animated-underline">Candidates</a>
-                    <a href="#contact" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition">Contact Us</a>
+                    <a href="#contact" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition">Contact</a>
                 </div>
                 <div class="md:hidden flex items-center">
                     <button class="text-gray-700 focus:outline-none">
@@ -164,7 +170,10 @@
     </section>
 
     <!-- Who We Recruit Section -->
-    <section class="py-16 md:py-24 bg-white">
+    <section class="py-16 md:py-24 bg-white relative">
+        <div class="absolute inset-0 overflow-hidden opacity-10">
+            <div class="who-we-recruit-bg absolute inset-0"></div>
+        </div>
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="text-center mb-16">
                 <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Who do we recruit?</h2>
@@ -421,13 +430,14 @@
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex flex-col md:flex-row justify-between items-center">
                 <div class="mb-4 md:mb-0">
-                    <a href="#" class="text-xl font-bold text-white">INK SEARCH</a>
+                    <a href="#" class="text-xl font-bold text-white">LOMBARD TECH</a>
                     <p class="text-sm mt-1">Global Technology Search Firm</p>
                 </div>
                 <div class="flex space-x-6">
-                    <a href="#about" class="hover:text-white transition">About</a>
-                    <a href="#sectors" class="hover:text-white transition">Sectors</a>
-                    <a href="#clients" class="hover:text-white transition">Clients</a>
+                    <a href="#home" class="hover:text-white transition">Home</a>
+                    <a href="#about" class="hover:text-white transition">About Us</a>
+                    <a href="#market" class="hover:text-white transition">Market Coverage</a>
+                    <a href="#services" class="hover:text-white transition">Our Services</a>
                     <a href="#candidates" class="hover:text-white transition">Candidates</a>
                     <a href="#contact" class="hover:text-white transition">Contact</a>
                 </div>
@@ -446,11 +456,12 @@
             mobileMenu.className = 'hidden bg-white shadow-lg absolute top-16 left-0 right-0 z-50 p-4';
             mobileMenu.innerHTML = `
                 <div class="flex flex-col space-y-4">
-                    <a href="#about" class="text-gray-700 hover:text-blue-600">About</a>
-                    <a href="#sectors" class="text-gray-700 hover:text-blue-600">Sectors</a>
-                    <a href="#clients" class="text-gray-700 hover:text-blue-600">Clients</a>
+                    <a href="#home" class="text-gray-700 hover:text-blue-600">Home</a>
+                    <a href="#about" class="text-gray-700 hover:text-blue-600">About Us</a>
+                    <a href="#market" class="text-gray-700 hover:text-blue-600">Market Coverage</a>
+                    <a href="#services" class="text-gray-700 hover:text-blue-600">Our Services</a>
                     <a href="#candidates" class="text-gray-700 hover:text-blue-600">Candidates</a>
-                    <a href="#contact" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-center">Contact Us</a>
+                    <a href="#contact" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-center">Contact</a>
                 </div>
             `;
             document.querySelector('nav').appendChild(mobileMenu);