Manual changes saved

index.html

@@ -23,28 +23,29 @@
   <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js" defer></script>
 
   <!-- VLC Brand Map + UI polish -->
-<style id="vlc-brand-theme">
+  <style id="vlc-brand-theme">
     :root{
-      --vlc-navy:#1e3a8a;
-      --vlc-navy-700:#1e40af;
-      --vlc-sky:#3b82f6;
-      --vlc-leaf:#10b981;
-      --vlc-leaf-700:#059669;
-      --vlc-ink:#1e293b;
-      --vlc-tint:#f8fafc;
-      --vlc-leaf-tint:#ecfdf5;
+      --vlc-navy:#002060;
+      --vlc-navy-700:#001a50;
+      --vlc-sky:#00A0E9;
+      --vlc-leaf:#8DC63F;
+      --vlc-leaf-700:#79b32e;
+      --vlc-ink:#1F2A44;
+      --vlc-tint:#F5F7FF;
+      --vlc-leaf-tint:#F3FAEA;
       --vlc-card:#ffffff;
     }
-    body{ color:#1e293b; }
-    .service-card:hover{ transform:translateY(-4px); box-shadow:0 16px 28px -8px rgba(30, 58, 138,.18), 0 10px 14px -6px rgba(30, 58, 138,.10) }
-    .chip{ background:linear-gradient(135deg,var(--vlc-navy),#2563eb); color:#fff }
+    body{ color:#1f2937; }
+    .service-card:hover{ transform:translateY(-4px); box-shadow:0 16px 28px -8px rgba(0,32,96,.18), 0 10px 14px -6px rgba(0,32,96,.10) }
+    .chip{ background:linear-gradient(135deg,var(--vlc-navy),#0b3b8f); color:#fff }
     .btn-primary{ background:var(--vlc-navy); color:#fff }
     .btn-primary:hover{ background:var(--vlc-navy-700) }
-    .btn-accent{ background:var(--vlc-leaf); color:#1e3a8a }
+    .btn-accent{ background:var(--vlc-leaf); color:#0b2a66 }
     .btn-accent:hover{ background:var(--vlc-leaf-700) }
     .link-brand{ color:var(--vlc-navy) }
-    .link-brand:hover{ color:var(--vlc-sky) }
-/* Accent top border like vlcsolutions.com cards */
+    .link-brand:hover{ color:var(--vlc-leaf) }
+
+    /* Accent top border like vlcsolutions.com cards */
     .card-accent{ position:relative; }
     .card-accent:before{
       content:""; position:absolute; inset:0 0 auto 0; height:4px;
@@ -54,19 +55,20 @@
     /* Soft patterned sections */
     .pattern-navy{
       background:
-        radial-gradient(24px 24px at 10% 10%, rgba(255,255,255,.08) 0 6px, transparent 7px),
-        radial-gradient(24px 24px at 60% 30%, rgba(255,255,255,.06) 0 6px, transparent 7px),
+        radial-gradient(24px 24px at 10% 10%, rgba(255,255,255,.06) 0 6px, transparent 7px),
+        radial-gradient(24px 24px at 60% 30%, rgba(255,255,255,.05) 0 6px, transparent 7px),
         radial-gradient(24px 24px at 30% 70%, rgba(255,255,255,.04) 0 6px, transparent 7px),
-        linear-gradient(180deg, rgba(0,0,0,.0), rgba(0,0,0,.15));
+        linear-gradient(180deg, rgba(0,0,0,.0), rgba(0,0,0,.12));
       background-color:var(--vlc-navy);
     }
     .pattern-tint{
       background:
-        radial-gradient(18px 18px at 20% 30%, rgba(59, 130, 246,.10) 0 6px, transparent 7px),
-        radial-gradient(18px 18px at 70% 60%, rgba(16, 185, 129,.10) 0 6px, transparent 7px);
-      background-color:var(--vlc-tint);
+        radial-gradient(18px 18px at 20% 30%, rgba(141,198,63,.10) 0 6px, transparent 7px),
+        radial-gradient(18px 18px at 70% 60%, rgba(0,160,233,.10) 0 6px, transparent 7px);
+      background-color:#F7FBF1;
     }
-/* Footer */
+
+    /* Footer */
     footer a:hover{ color:var(--vlc-leaf) }
 
     /* Make “Learn more” rows align across cards */
@@ -219,24 +221,20 @@
   <!-- Header / Nav -->
   
   <!-- Hero Banner -->
-<section class="relative py-20 md:py-32 overflow-hidden">
-  <div class="absolute inset-0 bg-gradient-to-r from-indigo-900 to-purple-800 opacity-90"></div>
-  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
-    <div class="text-center max-w-3xl mx-auto" data-aos="fade-up">
-      <h1 class="text-4xl md:text-5xl font-bold leading-tight mb-6 text-white">Bridging the Gap from Design to Delivery using AI</h1>
-      <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto text-indigo-100">Unify your data. Unify your teams.</p>
-      <a href="https://www.vlcsolutions.com/contactus.html" class="inline-flex items-center px-8 py-4 rounded-md text-lg font-semibold bg-white text-indigo-800 hover:bg-indigo-100 transition duration-300 shadow-lg hover:shadow-xl">
-        Get Total Control
-        <i data-feather="arrow-right" class="w-5 h-5 ml-2"></i>
-      </a>
+<section class="text-white py-16 md:py-24" style="background: url('https://huggingface.co/spaces/vlcsolutions/vlc-engineering-sync-pro/resolve/main/images/ECM Main Banner-2025.png') no-repeat center center; background-size: cover;">
+  <div class="overlay"></div>
+  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+    <div class="text-center max-w-2xl mx-auto" data-aos="fade-up">
+      <h1 class="text-4xl md:text-3xl font-bold leading-tight mb-4 text-white">Bridging the Gap from Design to Delivery using AI</h1>
+      <p class="text-xl md:text-2xl mb-6 max-w-3xl mx-auto text-lightblue">Unify your data. Unify your teams.</p>
+      <a href="https://www.vlcsolutions.com/contactus.html" class="btn-accent px-8 py-3 rounded-md text-lg font-medium">Get Total Control</a>
     </div>
   </div>
-  <div class="absolute inset-0 z-0">
-    <div class="absolute inset-0 bg-[url('https://huggingface.co/spaces/vlcsolutions/vlc-engineering-sync-pro/resolve/main/images/ECM%20Main%20Banner-2025.png')] bg-cover bg-center mix-blend-overlay opacity-20"></div>
-    <div class="absolute inset-0 bg-gradient-to-t from-indigo-900/80 via-purple-800/50 to-transparent"></div>
-  </div>
 </section>
-<!-- Section 1: The End of Disconnected Operations -->
+
+
+
+  <!-- Section 1: The End of Disconnected Operations -->
   <section class="py-16 px-4 sm:px-6 lg:px-8">
     <div class="max-w-7xl mx-auto grid md:grid-cols-2 gap-12 items-center">
       <div data-aos="fade-right">