Manual changes saved

index.html

@@ -566,414 +566,358 @@
 
 
 <!-- ====== CTA RIBBON (KEEP YOUR EXISTING ONE HERE) ====== -->
-<!-- (Your CTA ribbon section remains unchanged) -->
-
-<!-- ====== INTRO / VALUE ====== -->
-<section class="py-14"
-         style="background:
-            radial-gradient(circle at 20% 30%, rgba(0,160,233,0.08) 0%, transparent 40%),
-            radial-gradient(circle at 70% 60%, rgba(141,198,63,0.08) 0%, transparent 40%),
-            linear-gradient(to bottom, #F7FBFF, #FFFFFF);">
-  <div class="max-w-6xl mx-auto px-6 md:px-8">
-    <div class="grid md:grid-cols-12 gap-10 items-start">
-      <div class="md:col-span-7" data-aos="fade-right">
-        <h2 class="text-2xl md:text-3xl font-bold text-[#002060]">
-          Command Your Logistics from Dynamics 365
-        </h2>
-        <div class="space-y-4 text-gray-700">
-          <p class="text-[17px] leading-relaxed">
-            Revolutionize your inventory management with our Barcode Blitz solution, designed to work natively within Microsoft Dynamics 365 Business Central.
-          </p>
-          <p class="text-[17px] leading-relaxed">
-            Eliminate manual data entry errors and gain real-time visibility into stock levels, shipments, and warehouse operations through instant barcode scanning.
-          </p>
-          <p class="text-[17px] leading-relaxed">
-            Our system provides complete audit trails, automated reporting, and seamless integration with your existing ERP workflows.
-          </p>
-        </div>
-</div>
-      <div class="md:col-span-5" data-aos="fade-left">
-        <div class="rounded-2xl border border-[rgba(0,32,96,.08)] bg-white p-5 shadow-[0_10px_30px_-10px_rgba(0,32,96,.15)]">
-          <div class="flex items-center gap-3">
-            <span class="inline-flex items-center justify-center w-10 h-10 rounded-xl"
-                  style="background:linear-gradient(135deg,#8DC63F,#00A0E9); color:white;">
-              <i data-feather="truck" class="w-5 h-5" aria-hidden="true"></i>
-            </span>
-            <div>
-              <h3 class="font-semibold text-[#002060]">Real-time, Right inside Business Central</h3>
-              <p class="text-sm text-gray-600">No swivel-chair. No delays. One source of truth.</p>
-            </div>
-          </div>
-          <a href="https://www.vlcsolutions.com/contactus.html"
-             class="mt-5 inline-flex items-center px-4 py-2 rounded-lg font-semibold transition"
-             style="background:#002060; color:#fff;">
-            Contact us
-            <i data-feather="send" class="w-4 h-4 ml-2" aria-hidden="true"></i>
-          </a>
-        </div>
-      </div>
+<!-- =========================================================
+     SMART SHIPPING – Description, Benefits & Features (Single Column)
+     Palette: Navy #002060, Sky #00A0E9, Leaf #8DC63F
+     Patterns: soft gradients, dot grid, and brand beams
+========================================================= -->
+
+<!-- Description -->
+<section class="relative py-14 text-[#1F2A44]"
+  style="
+    background:
+      radial-gradient(24rem 18rem at 12% 20%, rgba(0,160,233,.08) 0%, transparent 60%),
+      radial-gradient(22rem 16rem at 85% 70%, rgba(141,198,63,.10) 0%, transparent 60%),
+      linear-gradient(180deg,#FFFFFF,#F7FBFF);
+">
+  <div class="max-w-4xl mx-auto px-6 md:px-8">
+    <div class="mb-6 inline-flex items-center gap-2 text-xs tracking-wider uppercase px-3 py-1 rounded-full"
+         style="background:rgba(0,32,96,.06); border:1px solid rgba(0,32,96,.15); color:#002060">
+      <i data-feather="truck" class="w-4 h-4" aria-hidden="true"></i> Smart Shipping
     </div>
+
+    <h2 class="text-2xl md:text-3xl font-bold text-[#002060]">
+      Command Your Logistics from Dynamics 365
+    </h2>
+
+    <p class="mt-4 text-[17px] leading-relaxed">
+      Shipping management is quite complex, but with VLC Smart Shipping integrated directly with Microsoft Dynamics 365 Business Central, simplify every aspect of your shipping operations like managing orders, tracking deliveries etc. from a single source of application.
+    </p>
   </div>
 </section>
 
-<!-- ====== BENEFITS ====== -->
-<section class="py-16"
-         style="background:
-            linear-gradient(180deg,#FFFFFF, #F5FAFF),
-            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);">
-  <div class="max-w-7xl mx-auto px-6 md:px-8">
-    <h2 class="text-2xl md:text-3xl font-bold text-[#002060] mb-6">Benefits</h2>
-
-    <ul class="grid sm:grid-cols-2 lg:grid-cols-3 gap-5">
-      <!-- Card component -->
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Time-Saving Shipping Task Automation</h3>
-        <p class="text-gray-700 mt-2">Automate repetitive tasks, from order processing to label creation, improving efficiency, reducing manual errors, and saving valuable time across your shipping workflow.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Optimized Shipping Efficiency</h3>
-        <p class="text-gray-700 mt-2">Streamline your shipping operations for faster and more accurate order fulfillment, ensuring timely deliveries and improving overall efficiency within your shipping process.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Improved Customer Satisfaction</h3>
-        <p class="text-gray-700 mt-2">Enhance customer experience with accurate, timely deliveries and real-time order tracking, keeping customers informed and satisfied with their purchase journey.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Cost Management &amp; Pricing Strategy</h3>
-        <p class="text-gray-700 mt-2">Minimize shipping costs by comparing rates from multiple carriers and selecting the best service, increasing cost efficiency while maintaining high service standards.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Transparent Cost Breakdown</h3>
-        <p class="text-gray-700 mt-2">Provide a clear, detailed cost breakdown for all shipments, eliminating hidden fees and ensuring you always know exactly what you're paying for.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Increased Delivery Accuracy</h3>
-        <p class="text-gray-700 mt-2">Achieve better delivery accuracy through real-time updates and precise tracking, reducing shipping errors and ensuring timely arrivals with minimal disruption.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Simplified Returns and Refunds</h3>
-        <p class="text-gray-700 mt-2">Offer an easy and efficient return process for customers, handling exchanges and refunds with minimal hassle, enhancing customer loyalty.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Easy Inventory Management</h3>
-        <p class="text-gray-700 mt-2">Sync inventory with your shipping system to avoid stockouts, prevent overselling, and ensure accurate stock levels for timely order fulfillment.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Seamless Business Growth Support</h3>
-        <p class="text-gray-700 mt-2">Scale your shipping operations efficiently, whether you're a small business or a large enterprise, adapting to increased demand without compromising service quality.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Real-Time Order Status Tracking</h3>
-        <p class="text-gray-700 mt-2">Monitor orders in real-time, ensuring you and your customers stay updated on the status of each shipment, providing full visibility and reducing uncertainty.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Automated Document Handling</h3>
-        <p class="text-gray-700 mt-2">Save time with the automatic generation of shipping labels, packing slips, and customs documents, reducing manual processing and preventing errors.</p>
-      </li>
-
-      <li class="p-5 rounded-2xl bg-white border border-[rgba(0,32,96,.08)] shadow-sm hover:shadow-lg transition">
-        <h3 class="font-semibold text-[#002060]">Global Shipping Compliance</h3>
-        <p class="text-gray-700 mt-2">Manage international shipments with ease, automatically generating the required customs forms and ensuring compliance with global shipping regulations.</p>
-      </li>
-    </ul>
-
-    <a href="https://www.vlcsolutions.com/contactus.html"
-       class="inline-flex items-center mt-8 px-5 py-3 rounded-lg font-semibold"
-       style="background:#8DC63F; color:#002060;">
-      Contact us
-      <i data-feather="message-circle" class="w-5 h-5 ml-2" aria-hidden="true"></i>
-    </a>
+<!-- Benefits -->
+<section class="relative py-16"
+  style="
+    background:
+      linear-gradient(180deg,#FFFFFF,#F5FAFF),
+      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);
+">
+  <div class="max-w-4xl mx-auto px-6 md:px-8">
+    <div class="flex items-center gap-3 mb-3">
+      <span class="inline-block w-2.5 h-8 rounded-full" style="background:#00A0E9"></span>
+      <h3 class="text-2xl md:text-3xl font-bold text-[#002060]">Benefits</h3>
+    </div>
+
+    <!-- Dot grid card -->
+    <div class="rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-6 md:p-8 shadow-sm"
+         style="
+           background:
+             radial-gradient(ellipse at top left, rgba(0,32,96,.04) 0 10%, transparent 11%) 0 0/36px 36px,
+             radial-gradient(ellipse at bottom right, rgba(0,32,96,.04) 0 10%, transparent 11%) 18px 18px/36px 36px,
+             #fff;
+         ">
+      <ul class="space-y-5 text-gray-800">
+        <li>
+          <p class="font-semibold text-[#002060]">● Time-Saving Shipping Task Automation</p>
+          <p class="mt-1">Automate repetitive tasks, from order processing to label creation, improving efficiency, reducing manual errors, and saving valuable time across your shipping workflow.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Optimized Shipping Efficiency</p>
+          <p class="mt-1">Streamline your shipping operations for faster and more accurate order fulfillment, ensuring timely deliveries and improving overall efficiency within your shipping process.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Improved Customer Satisfaction</p>
+          <p class="mt-1">Enhance customer experience with accurate, timely deliveries and real-time order tracking, keeping customers informed and satisfied with their purchase journey.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Cost Management &amp; Pricing Strategy</p>
+          <p class="mt-1">Minimize shipping costs by comparing rates from multiple carriers and selecting the best service, increasing cost efficiency while maintaining high service standards.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Transparent Cost Breakdown</p>
+          <p class="mt-1">Provide a clear, detailed cost breakdown for all shipments, eliminating hidden fees and ensuring you always know exactly what you're paying for.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Increased Delivery Accuracy</p>
+          <p class="mt-1">Achieve better delivery accuracy through real-time updates and precise tracking, reducing shipping errors and ensuring timely arrivals with minimal disruption.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Simplified Returns and Refunds</p>
+          <p class="mt-1">Offer an easy and efficient return process for customers, handling exchanges and refunds with minimal hassle, enhancing customer loyalty.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Easy Inventory Management</p>
+          <p class="mt-1">Sync inventory with your shipping system to avoid stockouts, prevent overselling, and ensure accurate stock levels for timely order fulfillment.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Seamless Business Growth Support</p>
+          <p class="mt-1">Scale your shipping operations efficiently, whether you're a small business or a large enterprise, adapting to increased demand without compromising service quality.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Real-Time Order Status Tracking</p>
+          <p class="mt-1">Monitor orders in real-time, ensuring you and your customers stay updated on the status of each shipment, providing full visibility and reducing uncertainty.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Automated Document Handling</p>
+          <p class="mt-1">Save time with the automatic generation of shipping labels, packing slips, and customs documents, reducing manual processing and preventing errors.</p>
+        </li>
+        <li>
+          <p class="font-semibold text-[#002060]">● Global Shipping Compliance</p>
+          <p class="mt-1">Manage international shipments with ease, automatically generating the required customs forms and ensuring compliance with global shipping regulations.</p>
+        </li>
+      </ul>
+
+      <a href="https://www.vlcsolutions.com/contactus.html"
+         class="mt-8 inline-flex items-center px-5 py-3 rounded-lg font-semibold"
+         style="background:#8DC63F; color:#002060;">
+        Contact us
+        <i data-feather="message-circle" class="w-5 h-5 ml-2" aria-hidden="true"></i>
+      </a>
+    </div>
   </div>
 </section>
 
-<!-- ====== KEY FEATURES (Short list) ====== -->
+<!-- Features (short) -->
 <section class="py-16 text-white"
-         style="
-          background:
-            linear-gradient(135deg, #003366 0%, #002060 100%),
-            radial-gradient(circle at 20% 30%, rgba(0,160,233,0.18) 0%, transparent 35%),
-            radial-gradient(circle at 80% 70%, rgba(141,198,63,0.18) 0%, transparent 35%);">
-  <div class="max-w-6xl mx-auto px-6 md:px-8">
-    <h2 class="text-2xl md:text-3xl font-bold mb-6">Features</h2>
-
-    <div class="grid md:grid-cols-2 gap-6">
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Integration with Microsoft Dynamics 365 Business Central</h3>
-        <p class="mt-2 text-white/90">
-          Sales orders in Business Central can be processed quickly with VLC Smart Shipping. A few clicks or barcode scans are all it takes to ship your orders directly from the ERP system.
-        </p>
+  style="
+    background:
+      linear-gradient(135deg,#003366 0%, #002060 100%),
+      radial-gradient(circle at 20% 30%, rgba(0,160,233,.18) 0%, transparent 35%),
+      radial-gradient(circle at 80% 70%, rgba(141,198,63,.18) 0%, transparent 35%);
+">
+  <div class="max-w-4xl mx-auto px-6 md:px-8">
+    <div class="flex items-center gap-3 mb-6">
+      <span class="inline-block w-2.5 h-8 rounded-full bg-white/60"></span>
+      <h3 class="text-2xl md:text-3xl font-bold">Features</h3>
+    </div>
+
+    <div class="space-y-5">
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Integration with Microsoft Dynamics 365 Business Central</p>
+        <p class="mt-1 text-white/90">Sales orders in Business Central can be processed quickly with VLC Smart Shipping. A few clicks or barcode scans are all it takes to ship your orders directly from the ERP system.</p>
       </div>
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Shipping Price Comparison</h3>
-        <p class="mt-2 text-white/90">
-          Compare rates from different carriers to find the best pricing and service options. Whether you're shipping small packages or LTL, VLC Smart Shipping ensures that you always pick the most cost-effective solution.
-        </p>
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Shipping Price Comparison</p>
+        <p class="mt-1 text-white/90">Compare rates from different carriers to find the best pricing and service options. Whether you're shipping small packages or LTL, VLC Smart Shipping ensures that you always pick the most cost-effective solution.</p>
       </div>
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Decreases Shipping Errors</h3>
-        <p class="mt-2 text-white/90">
-          VLC Smart Shipping minimizes common errors like incorrect shipping addresses, missed products, and improper shipments. Data integration directly with your ERP application ensures accuracy at all stages of shipping.
-        </p>
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Decreases Shipping Errors</p>
+        <p class="mt-1 text-white/90">VLC Smart Shipping minimizes common errors like incorrect shipping addresses, missed products, and improper shipments. Data integration directly with your ERP application ensures accuracy at all stages of shipping.</p>
       </div>
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Direct Status Tracking from Sales Documents</h3>
-        <p class="mt-2 text-white/90">
-          Easily track orders directly from your sales documents, giving you and your customers full visibility of order statuses and delivery timelines.
-        </p>
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Direct Status Tracking from Sales Documents</p>
+        <p class="mt-1 text-white/90">Easily track orders directly from your sales documents, giving you and your customers full visibility of order statuses and delivery timelines.</p>
       </div>
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Automated Label and Document Printing</h3>
-        <p class="mt-2 text-white/90">
-          Shipping labels and required documents are automatically generated and sent to the assigned printers, reducing manual input and speeding up the shipping process.
-        </p>
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Automated Label and Document Printing</p>
+        <p class="mt-1 text-white/90">Shipping labels and required documents are automatically generated and sent to the assigned printers, reducing manual input and speeding up the shipping process.</p>
       </div>
-      <div class="rounded-xl border border-white/10 bg-white/5 p-5 backdrop-blur-sm">
-        <h3 class="font-semibold">Simplified International Shipping</h3>
-        <p class="mt-2 text-white/90">
-          International shipments are simplified by automatically extracting required information (like Schedule B, producer details) from your ERP system, helping you manage complex shipping processes with ease.
-        </p>
+      <div class="rounded-xl border border-white/12 bg-white/5 p-5 backdrop-blur-sm">
+        <p class="font-semibold">● Simplified International Shipping</p>
+        <p class="mt-1 text-white/90">International shipments are simplified by automatically extracting required information (like Schedule B, producer details) from your ERP system, helping you manage complex shipping processes with ease.</p>
       </div>
     </div>
 
-    <a href="#all-features"
-       class="inline-flex items-center mt-8 px-5 py-3 rounded-lg font-semibold"
-       style="background:#8DC63F; color:#002060;">
-      ALL FEATURES
-      <i data-feather="list" class="w-5 h-5 ml-2" aria-hidden="true"></i>
-    </a>
+    <div class="mt-8 flex items-center gap-4">
+      <a href="https://www.vlcsolutions.com/contactus.html"
+         class="inline-flex items-center px-5 py-3 rounded-lg font-semibold"
+         style="background:#8DC63F; color:#002060;">
+        Contact&nbsp;us
+        <i data-feather="mail" class="w-5 h-5 ml-2" aria-hidden="true"></i>
+      </a>
+      <a href="#all-features"
+         class="inline-flex items-center px-5 py-3 rounded-lg font-semibold border border-white/20 hover:bg-white/10 transition">
+        ALL FEATURES
+        <i data-feather="list" class="w-5 h-5 ml-2" aria-hidden="true"></i>
+      </a>
+    </div>
   </div>
 </section>
 
-<!-- ====== ALL FEATURES (Collapsible catalog) ====== -->
+<!-- All Features (single column, grouped) -->
 <section id="all-features" class="py-16"
-         style="background:
-          linear-gradient(180deg,#FFFFFF,#F5F7FF),
-          linear-gradient(90deg, rgba(0,32,96,.05) 1px, transparent 1px) 0 0/24px 24px,
-          linear-gradient(0deg, rgba(0,32,96,.05) 1px, transparent 1px) 0 0/24px 24px;">
-  <div class="max-w-7xl mx-auto px-6 md:px-8">
-    <h2 class="text-2xl md:text-3xl font-bold text-[#002060] mb-6">All Features</h2>
-
-    <!-- Helper: accordion component -->
-    <style>
-      details.feature[open] > summary .chev { transform: rotate(180deg); }
-      summary::-webkit-details-marker{ display:none }
-    </style>
-
-    <div class="space-y-4">
-      <!-- Block -->
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Manage Orders</h3>
-          <i class="chev transition-transform" data-feather="chevron-down" aria-hidden="true"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Filter Orders</span>
-          <span>View, Search, and Sort Orders</span>
-          <span>Set a Ship By Date</span>
-          <span>Split Orders Into Multiple Shipments</span>
-          <span>Order Tags</span>
-          <span>Edit Order Details</span>
-          <span>Configure Checkout Rates</span>
-          <span>Address Validation</span>
-          <span>Order Alerts</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Ship Orders</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Connect a Postage Provider</span>
-          <span>Add Funds and Auto-fund Postal Accounts</span>
-          <span>Edit Services &amp; Package Types</span>
-          <span>Set Ship From &amp; Return Address</span>
-          <span>Configure Shipping</span>
-          <span>Use Shipping Presets</span>
-          <span>Calculate Rates</span>
-          <span>Create Single Labels</span>
-          <span>Create Multi-Package Labels</span>
-          <span>Reship an Order</span>
-          <span>Print Labels</span>
-          <span>Introduction to Batch Shipping</span>
-          <span>Working with Batches</span>
-          <span>Create a Batch</span>
-          <span>Print Labels with a Batch</span>
-          <span>Using Quickship</span>
-          <span>The Label Queue</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Shipment Records &amp; Details</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Drop-shipping with VLC</span>
-          <span>Add Insurance to Shipments</span>
-          <span>Manage Shipments</span>
-          <span>Order &amp; Shipment Records</span>
-          <span>Track Shipments</span>
-          <span>End of Day Forms</span>
-          <span>Void Labels</span>
-          <span>Return Labels</span>
-          <span>Search and Sort Shipments or Fulfillments</span>
-          <span>Filter Shipment or Fulfillment Records</span>
-          <span>Reprint a Label</span>
-          <span>Schedule a Pickup</span>
-          <span>Create Multi-Package Labels</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Printer and Scale Integration</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Printing Overview</span>
-          <span>Set Up Printers in Windows</span>
-          <span>Print a Document</span>
-          <span>Print a Test Label</span>
-          <span>Use a USB Scale</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Notification and Documents</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Print Packing Slips</span>
-        </div>
-      </details>
-
-      <!-- Analytics -->
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Advanced Analytics</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid md:grid-cols-2 gap-6">
-          <div>
-            <h4 class="font-medium text-[#1F2A44] mb-2">a) Warehouse</h4>
-            <ul class="grid sm:grid-cols-2 gap-2 text-gray-700">
-              <li>Orders to Pick</li><li>Orders Picked</li><li>Daily/Monthly Picked Orders</li>
-              <li>Order Analysis</li><li>Orders Shipped</li><li>Daily/Monthly Shipped Orders</li>
-              <li>Orders to Ship</li><li>Employee Analysis</li><li>Monthly Expenses Breakdown</li>
-              <li>Pick Performance</li><li>Pack Performance</li>
-            </ul>
-          </div>
-          <div>
-            <h4 class="font-medium text-[#1F2A44] mb-2">b) Non-Warehouse</h4>
-            <ul class="grid sm:grid-cols-2 gap-2 text-gray-700">
-              <li>Orders To Ship</li><li>Orders To Ship v/s Shipped Orders</li><li>Orders to Ship By Carrier</li>
-            </ul>
-          </div>
-        </div>
-      </details>
-
-      <!-- Accounts & International -->
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Account Management</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Add &amp; Edit Users</span>
-          <span>Set User Permissions and Restrictions</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">International Shipments</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>International Shipping with VLC</span>
-          <span>VLC’s International Settings</span>
-          <span>Customs Declarations</span>
-          <span>Print Customs Forms</span>
-          <span>Other International Options &amp; Forms</span>
-          <span>Global Advantage Program</span>
-        </div>
-      </details>
-
-      <!-- Packaging & Barcode -->
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Custom Packaging</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Custom Package Types</span>
-        </div>
-      </details>
-
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">Barcode Actions</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Barcode Scanning Overview</span>
-          <span>View Orders with a Barcode Scan</span>
-          <span>Search Orders with a Barcode Scan</span>
-          <span>Verify &amp; Print Shipments with Barcode Scan</span>
-          <span>UPC and SKU Settings for Barcode Scanning</span>
-          <span>Batch Orders with a Barcode Scan</span>
-          <span>Add Barcodes to Packing Slips</span>
-          <span>Other Barcode Uses</span>
-          <span>Scan Barcodes with VLC Mobile</span>
-        </div>
-      </details>
-
-      <!-- General Settings -->
-      <details class="feature group rounded-2xl border border-[rgba(0,32,96,.12)] bg-white p-5">
-        <summary class="flex items-center justify-between cursor-pointer">
-          <h3 class="font-semibold text-[#002060]">General Settings</h3>
-          <i class="chev transition-transform" data-feather="chevron-down"></i>
-        </summary>
-        <div class="pt-4 text-gray-700 grid sm:grid-cols-2 lg:grid-cols-3 gap-2">
-          <span>Third-Party Billing</span>
-          <span>Setup Carrier Accounts</span>
-          <span>Dimensions based on setup</span>
-          <span>Weights and dimensions on items</span>
-          <span>Posting shipment and Invoice of a BC order from Shipping App</span>
-          <span>Weight Discrepancy</span>
-          <span>Setup based rate shop for a specific carrier</span>
-          <span>Package Contents Label/PDF</span>
-          <span>Print Posted Documents</span>
-          <span>Partial Shipments</span>
+  style="
+    background:
+      linear-gradient(180deg,#FFFFFF,#F5F7FF),
+      linear-gradient(90deg, rgba(0,32,96,.05) 1px, transparent 1px) 0 0/24px 24px,
+      linear-gradient(0deg, rgba(0,32,96,.05) 1px, transparent 1px) 0 0/24px 24px;
+">
+  <div class="max-w-4xl mx-auto px-6 md:px-8">
+    <h3 class="text-2xl md:text-3xl font-bold text-[#002060] mb-6">All Features</h3>
+
+    <!-- Simple groups (no side-by-side) -->
+    <div class="space-y-8 text-gray-800">
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Manage Orders</h4>
+        <ul class="space-y-1">
+          <li>Filter Orders</li>
+          <li>View, Search, and Sort Orders</li>
+          <li>Set a Ship By Date</li>
+          <li>Split Orders Into Multiple Shipments</li>
+          <li>Order Tags</li>
+          <li>Edit Order Details</li>
+          <li>Configure Checkout Rates</li>
+          <li>Address Validation</li>
+          <li>Order Alerts</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Ship Orders</h4>
+        <ul class="space-y-1">
+          <li>Connect a Postage Provider</li>
+          <li>Add Funds and Auto-fund Postal Accounts</li>
+          <li>Edit Services &amp; Package Types</li>
+          <li>Set Ship From &amp; Return Address</li>
+          <li>Configure Shipping</li>
+          <li>Use Shipping Presets</li>
+          <li>Calculate Rates</li>
+          <li>Create Single Labels</li>
+          <li>Create Multi-Package Labels</li>
+          <li>Reship an Order</li>
+          <li>Print Labels</li>
+          <li>Introduction to Batch Shipping</li>
+          <li>Working with Batches</li>
+          <li>Create a Batch</li>
+          <li>Print Labels with a Batch</li>
+          <li>Using Quickship</li>
+          <li>The Label Queue</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Shipment Records &amp; Details</h4>
+        <ul class="space-y-1">
+          <li>Drop-shipping with VLC</li>
+          <li>Add Insurance to Shipments</li>
+          <li>Manage Shipments</li>
+          <li>Order &amp; Shipment Records</li>
+          <li>Track Shipments</li>
+          <li>End of Day Forms</li>
+          <li>Void Labels</li>
+          <li>Return Labels</li>
+          <li>Search and Sort Shipments or Fulfillments</li>
+          <li>Filter Shipment or Fulfillment Records</li>
+          <li>Reprint a Label</li>
+          <li>Schedule a Pickup</li>
+          <li>Create Multi-Package Labels</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Printer and Scale Integration</h4>
+        <ul class="space-y-1">
+          <li>Printing Overview</li>
+          <li>Set Up Printers in Windows</li>
+          <li>Print a Document</li>
+          <li>Print a Test Label</li>
+          <li>Use a USB Scale</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Notification and Documents</h4>
+        <ul class="space-y-1">
+          <li>Print Packing Slips</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Advanced Analytics</h4>
+        <div class="mt-2">
+          <p class="font-medium">a) Warehouse</p>
+          <ul class="mt-1 space-y-1">
+            <li>Orders to Pick</li>
+            <li>Orders Picked</li>
+            <li>Daily/Monthly Picked Orders</li>
+            <li>Order Analysis</li>
+            <li>Orders Shipped</li>
+            <li>Daily/Monthly Shipped Orders</li>
+            <li>Orders to Ship</li>
+            <li>Employee Analysis</li>
+            <li>Monthly Expenses Breakdown</li>
+            <li>Pick Performance</li>
+            <li>Pack Performance</li>
+          </ul>
+          <p class="font-medium mt-4">b) Non-Warehouse</p>
+          <ul class="mt-1 space-y-1">
+            <li>Orders To Ship</li>
+            <li>Orders To Ship v/s Shipped Orders</li>
+            <li>Orders to Ship By Carrier</li>
+          </ul>
         </div>
-      </details>
-    </div>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Account Management</h4>
+        <ul class="space-y-1">
+          <li>Add &amp; Edit Users</li>
+          <li>Set User Permissions and Restrictions</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">International Shipments</h4>
+        <ul class="space-y-1">
+          <li>International Shipping with VLC</li>
+          <li>VLC’s International Settings</li>
+          <li>Customs Declarations</li>
+          <li>Print Customs Forms</li>
+          <li>Other International Options &amp; Forms</li>
+          <li>Global Advantage Program</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Custom Packaging</h4>
+        <ul class="space-y-1">
+          <li>Custom Package Types</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Barcode Actions</h4>
+        <ul class="space-y-1">
+          <li>Barcode Scanning Overview</li>
+          <li>View Orders with a Barcode Scan</li>
+          <li>Search Orders with a Barcode Scan</li>
+          <li>Verify &amp; Print Shipments with Barcode Scan</li>
+          <li>UPC and SKU Settings for Barcode Scanning</li>
+          <li>Batch Orders with a Barcode Scan</li>
+          <li>Add Barcodes to Packing Slips</li>
+          <li>Other Barcode Uses</li>
+          <li>Scan Barcodes with VLC Mobile</li>
+        </ul>
+      </div>
+
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">General Settings</h4>
+        <ul class="space-y-1">
+          <li>Third-Party Billing</li>
+        </ul>
+      </div>
 
-    <a href="https://www.vlcsolutions.com/contactus.html"
-       class="inline-flex items-center mt-10 px-6 py-3 rounded-lg font-semibold"
-       style="background:#002060; color:#fff;">
-      Contact us
-      <i data-feather="mail" class="w-5 h-5 ml-2" aria-hidden="true"></i>
-    </a>
+      <div>
+        <h4 class="font-semibold text-[#1F2A44] mb-2">Setup Carrier Accounts</h4>
+        <ul class="space-y-1">
+          <li>Dimensions based on setup</li>
+          <li>Weights and dimensions on items</li>
+          <li>Posting shipment and Invoice of a BC order from Shipping App</li>
+          <li>Weight Discrepancy</li>
+          <li>Setup based rate shop for a specific carrier</li>
+          <li>Package Contents Label/PDF</li>
+          <li>Print Posted Documents</li>
+          <li>Partial Shipments</li>
+        </ul>
+      </div>
+    </div>
   </div>
 </section>
 
 
+
 </main>
   <!-- FOOTER -->
   <footer class="bg-[var(--vlc-navy)] text-white pt-14 pb-8">