Section 3 - Features: it's not showing properly in Google. correct it

index.html

@@ -363,121 +363,71 @@ class="inline-flex items-center text-[#002060] hover:text-[#8DC63F] px-3 py-2 te
       </div>
     </div>
   </section>
-
   <!-- Section 3 - Features -->
   <section id="features" class="py-16 bg-white">
     <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <h2 class="text-3xl md:text-4xl font-bold text-[var(--vlc-navy)] mb-12 text-center" data-aos="fade-up">Features</h2>
-      <div class="space-y-12">
-        <!-- Feature 1 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Vendor & Freight Integration</h3>
-          <ul>
-            <li>Send purchase orders electronically to vendors and freight partners.</li>
-            <li>Receive and process advanced shipping notices (ASN) automatically.</li>
-            <li>Track all outbound shipments in real time via carrier systems.</li>
-            <li>Ensure notifications and alerts are sent to supply chain stakeholders for exceptions or delays.</li>
-          </ul>
-        </div>
-<!-- Feature 2 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>External Logistics & Yard Management</h3>
-          <ul>
-            <li>Route inbound goods efficiently to appropriate storage locations.</li>
-            <li>Track trucks, containers, and yard movements in real time.</li>
-            <li>Manage external storage areas and docking operations seamlessly.</li>
-          </ul>
-        </div>
-<!-- Feature 3 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Receiving Execution</h3>
-          <ul>
-            <li>Capture complete ASN, container, and purchase order details.</li>
-            <li>Automate barcode-based receiving workflows.</li>
-            <li>Generate unique license plates for all incoming packages.</li>
-            <li>Plan and execute put-away directly from receiving stations.</li>
-            <li>Enable internal and external cross-docking operations.</li>
-            <li>Accelerate intake using Express Receive functionality.</li>
-          </ul>
-        </div>
-<!-- Feature 4 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Delivery Execution</h3>
-          <ul>
-            <li>Keep order management updated automatically.</li>
-            <li>Provide graphical ATP (Available-to-Promise) views.</li>
-            <li>Execute store or transfer orders efficiently.</li>
-            <li>Automate reservations using conveyor-assisted systems.</li>
-            <li>Monitor packing accuracy and efficiency.</li>
-            <li>Simplify shipping procedures with barcode and RF technology.</li>
-          </ul>
-        </div>
-<!-- Feature 5 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Movement Execution</h3>
-          <ul>
-            <li>Separate buffer areas from picking zones.</li>
-            <li>Use wave-based planning for replenishment of picking locations.</li>
-            <li>Release fulfillment orders according to operational priorities.</li>
-            <li>Access real-time picking lists via PDA or forklift displays.</li>
-            <li>Implement seasonal or campaign-based location planning for picking optimization.</li>
-          </ul>
-        </div>
-<!-- Feature 6 -->
+      <h2 class="text-3xl md:text-4xl font-bold text-[var(--vlc-navy)] mb-12 text-center" data-aos="fade-up">Warehouse Management System Features</h2>
+      
+      <div class="grid md:grid-cols-2 gap-8">
+        <!-- Feature Group 1 -->
         <div class="feature-card" data-aos="fade-up">
-          <h3>License Plate Tracking</h3>
-          <ul>
-            <li>Focus on handling units such as pallets, cartons, and packages rather than individual items.</li>
-            <li>Assign unique identifiers for every handling unit for complete traceability.</li>
+          <h3 class="text-xl font-bold">Inventory & Receiving Features</h3>
+          <ul class="space-y-3">
+            <li><strong>Automated Receiving:</strong> Barcode-based workflows with ASN processing and license plate generation</li>
+            <li><strong>Cross-Docking:</strong> Enable internal and external cross-docking operations</li>
+            <li><strong>Express Receive:</strong> Accelerated intake for high-volume shipments</li>
+            <li><strong>License Plate Tracking:</strong> Traceability for pallets, cartons, and packages</li>
           </ul>
         </div>
-<!-- Feature 7 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Telnet & WinPDA Handheld Operations</h3>
-          <ul>
-            <li>Support more than 50 warehouse processes on handheld devices.</li>
-            <li>Build additional PDA workflows with a simple design tool.</li>
-            <li>Automate employee task allocation and workflow distribution.</li>
-          </ul>
-        </div>
-<!-- Feature 8 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Delivery Rules Management</h3>
-          <ul>
-            <li>Configure partial deliveries, minimum order values, and automatic cancellations.</li>
-            <li>Automatically print and release picking lists.</li>
-            <li>Assign warehouse tasks automatically based on delivery rules.</li>
-          </ul>
-        </div>
-<!-- Feature 9 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Conveyor & Material Handling Integration</h3>
-          <ul>
-            <li>Move goods to correct destinations using conveyor systems.</li>
-            <li>Support multiple conveyor systems through signal-based integration.</li>
+
+        <!-- Feature Group 2 -->
+        <div class="feature-card" data-aos="fade-up" data-aos-delay="100">
+          <h3 class="text-xl font-bold">Order Fulfillment Features</h3>
+          <ul class="space-y-3">
+            <li><strong>Wave-Based Picking:</strong> Optimized picking strategies by priority</li>
+            <li><strong>Real-Time ATP:</strong> Graphical Available-to-Promise inventory views</li>
+            <li><strong>Automated Packing:</strong> Accuracy monitoring and efficiency tracking</li>
+            <li><strong>Shipping Automation:</strong> Barcode and RF technology for error-free shipping</li>
           </ul>
         </div>
-<!-- Feature 10 -->
+
+        <!-- Feature Group 3 -->
         <div class="feature-card" data-aos="fade-up">
-          <h3>Wireless Warehouse Execution</h3>
-          <ul>
-            <li>Receive, transfer, count, pick, and ship inventory using wireless devices.</li>
-            <li>Cover all mobile workflows to ensure continuous operational coverage.</li>
+          <h3 class="text-xl font-bold">Warehouse Operations</h3>
+          <ul class="space-y-3">
+            <li><strong>Mobile Workflows:</strong> 50+ processes supported on handheld devices</li>
+            <li><strong>Task Automation:</strong> Intelligent employee task allocation</li>
+            <li><strong>Zone Management:</strong> Separation of buffer and picking areas</li>
+            <li><strong>Seasonal Planning:</strong> Campaign-based location optimization</li>
           </ul>
         </div>
-<!-- Feature 11 -->
-        <div class="feature-card" data-aos="fade-up">
-          <h3>Microsoft Dynamics Role Center Integration</h3>
-          <ul>
-            <li>Monitor KPIs, performance statistics, and operational metrics directly within Microsoft Dynamics 2019 Role Center.</li>
+
+        <!-- Feature Group 4 -->
+        <div class="feature-card" data-aos="fade-up" data-aos-delay="100">
+          <h3 class="text-xl font-bold">Integration Capabilities</h3>
+          <ul class="space-y-3">
+            <li><strong>Vendor Connectivity:</strong> Electronic PO transmission and ASN processing</li>
+            <li><strong>Carrier Integration:</strong> Real-time shipment tracking</li>
+            <li><strong>Conveyor Systems:</strong> Signal-based material handling</li>
+            <li><strong>Dynamics Integration:</strong> Native KPI dashboards in Role Center</li>
           </ul>
         </div>
-<!-- CTA -->
-        <div class="text-center mt-16" data-aos="fade-up">
-          <h3 class="text-2xl font-bold text-[var(--vlc-navy)] mb-6">Take full control of inventory, fulfillment, and logistics with VLC's intelligent warehouse platform. Deliver faster, smarter, and with zero compromise.</h3>
-          <a href="./contact-us.html" class="btn-primary px-8 py-3 rounded-full text-lg font-bold inline-block">Get Started Today</a>
-        </div>
       </div>
+
+      <div class="mt-12 text-center" data-aos="fade-up">
+        <h3 class="text-2xl font-bold text-[var(--vlc-navy)] mb-6">Complete Warehouse Control System</h3>
+        <p class="text-lg text-gray-600 max-w-3xl mx-auto mb-8">
+          Our warehouse management solution provides end-to-end visibility and control across receiving, storage, picking, packing, and shipping operations. 
+          Designed for distribution centers, 3PLs, and manufacturing warehouses needing real-time inventory accuracy and operational efficiency.
+        </p>
+      <div class="text-center mt-16" data-aos="fade-up">
+        <h3 class="text-2xl font-bold text-[var(--vlc-navy)] mb-6">Transform Your Warehouse Operations Today</h3>
+        <p class="text-lg text-gray-600 max-w-3xl mx-auto mb-8">
+          Experience the power of automated warehouse management with real-time visibility, reduced errors, and increased throughput.
+        </p>
+        <a href="./contact-us.html" class="btn-primary px-8 py-3 rounded-full text-lg font-bold inline-block">Request a Demo</a>
+      </div>
+</div>
 </div>
   </section>
 

style.css

@@ -3,37 +3,36 @@
 .feature-card {
     background: white;
     border-radius: 12px;
-    padding: 24px;
-    margin-bottom: 24px;
-    box-shadow: 0 4px 6px rgba(0, 32, 96, 0.05);
-    border-left: 4px solid var(--vlc-leaf);
+    padding: 28px;
+    box-shadow: 0 4px 12px rgba(0, 32, 96, 0.08);
+    border-top: 4px solid var(--vlc-leaf);
     transition: all 0.3s ease;
+    height: 100%;
 }
 
 .feature-card:hover {
-    transform: translateY(-4px);
-    box-shadow: 0 10px 20px rgba(0, 32, 96, 0.1);
-    border-left-color: var(--vlc-sky);
+    transform: translateY(-6px);
+    box-shadow: 0 12px 24px rgba(0, 32, 96, 0.12);
+    border-top-color: var(--vlc-sky);
 }
 
 .feature-card h3 {
     color: var(--vlc-navy);
-    font-size: 1.5rem;
-    margin-bottom: 1rem;
+    font-size: 1.25rem;
+    margin-bottom: 1.25rem;
     position: relative;
-    padding-left: 16px;
+    padding-bottom: 12px;
 }
 
-.feature-card h3:before {
+.feature-card h3:after {
     content: "";
     position: absolute;
     left: 0;
-    top: 50%;
-    transform: translateY(-50%);
-    height: 24px;
-    width: 4px;
-    background: linear-gradient(to bottom, var(--vlc-leaf), var(--vlc-sky));
-    border-radius: 2px;
+    bottom: 0;
+    height: 2px;
+    width: 48px;
+    background: linear-gradient(to right, var(--vlc-leaf), var(--vlc-sky));
+    border-radius: 1px;
 }
 
 .feature-card ul {
@@ -42,28 +41,24 @@
 }
 
 .feature-card li {
-    padding: 8px 0;
-    position: relative;
-    padding-left: 28px;
+    padding: 10px 0;
     color: var(--vlc-ink);
+    line-height: 1.5;
 }
 
-.feature-card li:before {
-    content: "✓";
-    position: absolute;
-    left: 0;
-    color: var(--vlc-leaf);
-    font-weight: bold;
+.feature-card li strong {
+    color: var(--vlc-navy);
+    font-weight: 600;
 }
 
 .feature-card:nth-child(even) {
-    border-left-color: var(--vlc-sky);
+    border-top-color: var(--vlc-sky);
 }
 
 .feature-card:nth-child(even):hover {
-    border-left-color: var(--vlc-leaf);
+    border-top-color: var(--vlc-leaf);
 }
 
-.feature-card:nth-child(even) h3:before {
-    background: linear-gradient(to bottom, var(--vlc-sky), var(--vlc-leaf));
+.feature-card:nth-child(even) h3:after {
+    background: linear-gradient(to right, var(--vlc-sky), var(--vlc-leaf));
 }