tailwind.config.js

@@ -16,5 +16,6 @@ module.exports = {
   },
   plugins: [
     require('@tailwindcss/forms'),
+    require('@tailwindcss/aspect-ratio'),
   ],
 }

templates/layouts/technology.html

@@ -12,5 +12,7 @@
 
 {% include "partials/technology1.html" %}
 {% include "partials/technology2.html" %}
+{% include "partials/technology3.html" %}
+{% include "partials/technology4.html" %}
 
 {% endblock content %}

templates/partials/about2.html

@@ -8,9 +8,6 @@
         <p class="mt-6 text-lg leading-8 text-gray-300">Our history is marked by multiple successful exits, world records, and a trail of groundbreaking inventions, from scalable content routing to Zeta-Byte storage systems. With a global impact that spans scaling websites during the internet's infancy to delivering cutting-edge data center solutions, we've consistently tackled complex challenges, leaving an indelible mark on the tech landscape for over decades.</p>
         <br>
         <br>
-      <img class="mb-[-12%] rounded-xl shadow-2xl ring-1 ring-gray-900/10" src="about/img/about2.png" alt="">
+      <img class="mt-6 rounded-xl shadow-2xl ring-1 ring-gray-900/10" src="about/img/about2.png" alt="">
-      <div class="relative" aria-hidden="true">
-        <div class="absolute -inset-x-20 bottom-0 bg-gradient-to-t from-white pt-[7%]"></div>
-      </div>
     </div>
   </div>

templates/partials/about3.html

@@ -1,5 +1,8 @@
 <div class="lg:py-24 py-24 lg:px-12">
   <div class="mx-auto max-w-7xl px-6 lg:px-8 py-4 lg:py-12">
+    <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
+      <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]" style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"></div>
+    </div>
     <div class="mx-auto max-w-3xl lg:text-center">
       <h2 class="lg:text-4xl text-3xl text-center">Our Track Records</h2>
       <p class="mt-4 text-center">Our team has consistently led the way in pioneering innovations, from setting world records in web hosting to creating quantum-resistant storage solutions. Each milestone showcases our commitment to pushing the boundaries of what's possible in the digital world.

templates/partials/about4.html

@@ -1,18 +1,15 @@
 <div class="relative">
     <div class="mx-auto max-w-7xl">
       <div class="relative z-10 pt-14 lg:w-full lg:max-w-2xl">
-        <svg class="absolute inset-y-0 right-8 hidden h-full w-80 translate-x-1/2 transform fill-white lg:block" viewBox="0 0 100 100" preserveAspectRatio="none" aria-hidden="true">
-          <polygon points="0,0 90,0 50,100 0,100" />
-        </svg>
 
         <div class="relative px-6 py-24 mb-12 lg:px-8 lg:pr-0">
           <div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-xl">
-            <h1 class="text-4xl font-bold tracking-tight text-white sm:text-6xl">Our Team
+            <h1 class="text-3xl font-bold tracking-tight text-white lg:text-4xl">Our Team
             </h1>
             <p class="mt-6 text-lg leading-8 text-gray-50">Decades ago, our team came together with a strategic vision: to think about the trajectory of the Internet. We came to the conclusion that the existing Internet infrastructure was unsustainable, requiring the development of a new technological framework.</p>
             <p class="mt-6 text-lg leading-8 text-gray-50">Our mission was to design a new decentralized, open-source, inclusive and sustainable Internet for everyone. The technology is now ready and alive thanks to the relentless hard work of our team members and has already proven its efficiency.</p>
             <div class="mt-10 flex items-center gap-x-6">
-              <a href="#" class="rounded-md bg-indigo-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Our People</a>
+              <a href="#" class="rounded-md bg-indigo-400 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400">Our People</a>
             </div>
           </div>
         </div>

templates/partials/applicationForm.html

@@ -41,7 +41,7 @@
                   <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
                 </svg>
                 <div class="flex text-sm text-gray-600">
-                  <label for="file-upload" class="relative cursor-pointer bg-white rounded-md font-medium text-indigo-600 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
+                  <label for="file-upload" class="relative cursor-pointer bg-white rounded-md font-medium text-indigo-400 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
                     <span>Upload a file</span>
                     <input id="file-upload" name="file-upload" type="file" class="sr-only">
                   </label>
@@ -53,7 +53,7 @@
           </div>
         </div>
         <div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
-          <button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">Save</button>
+          <button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-400 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">Save</button>
         </div>
       </div>
     </form>

templates/partials/header_custom.html

@@ -7,7 +7,7 @@
 {% set header_items = section.content | safe | split(pat="<li>") %}
 
 <header id="header-container">
-    <div class="z-10 bg-black fixed w-screen">
+    <div class="z-10 bg-gray-900 fixed w-screen">
         <div class="relative z-50 shadow">
         <div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pl-0 md:pr-0 lg:py-1 sm:px-8 md:px-12 py-2 lg:px-28 lg:justify-start lg:space-x-20">
             <div>

templates/partials/social.html

@@ -12,7 +12,7 @@
               <dl class="mt-3 space-y-1 text-sm leading-6 text-gray-600">
                 <div>
                   <dt class="sr-only text-gray-900">Email</dt>
-                  <dd><a class="font-semibold text-indigo-600" href="mailto:collaborate@example.com">collaborate@example.com</a></dd>
+                  <dd><a class="font-semibold text-indigo-400" href="mailto:collaborate@example.com">collaborate@example.com</a></dd>
                 </div>
                 <div class="mt-1">
                   <dt class="sr-only">Phone number</dt>
@@ -25,7 +25,7 @@
               <dl class="mt-3 space-y-1 text-sm leading-6 text-gray-600">
                 <div>
                   <dt class="sr-only">Email</dt>
-                  <dd><a class="font-semibold text-indigo-600" href="mailto:press@example.com">press@example.com</a></dd>
+                  <dd><a class="font-semibold text-indigo-400" href="mailto:press@example.com">press@example.com</a></dd>
                 </div>
                 <div class="mt-1">
                   <dt class="sr-only">Phone number</dt>
@@ -38,7 +38,7 @@
               <dl class="mt-3 space-y-1 text-sm leading-6 text-gray-600">
                 <div>
                   <dt class="sr-only">Email</dt>
-                  <dd><a class="font-semibold text-indigo-600" href="mailto:careers@example.com">careers@example.com</a></dd>
+                  <dd><a class="font-semibold text-indigo-400" href="mailto:careers@example.com">careers@example.com</a></dd>
                 </div>
                 <div class="mt-1">
                   <dt class="sr-only">Phone number</dt>
@@ -51,7 +51,7 @@
               <dl class="mt-3 space-y-1 text-sm leading-6 text-gray-600">
                 <div>
                   <dt class="sr-only">Email</dt>
-                  <dd><a class="font-semibold text-indigo-600" href="mailto:hello@example.com">hello@example.com</a></dd>
+                  <dd><a class="font-semibold text-indigo-400" href="mailto:hello@example.com">hello@example.com</a></dd>
                 </div>
                 <div class="mt-1">
                   <dt class="sr-only">Phone number</dt>

templates/partials/technologies.html

@@ -1,7 +1,7 @@
 <div class=" py-12 lg:py-16">
     <div class="mx-auto max-w-7xl px-6 lg:px-8">
         <div class="mx-auto max-w-2xl lg:mx-0">
-        <h2 class="text-base font-semibold leading-7 text-indigo-600 mb-4">TECHNOLOGIES</h2>
+        <h2 class="text-base font-semibold leading-7 text-indigo-400 mb-4">TECHNOLOGIES</h2>
         <h2 class="mt-2">Component Architecture</h2>
         <p class="mt-4 text-lg leading-8 text-gray-300">Explore the Core Elements of Mycelium Network.</p>
       </div>

templates/partials/technology2.html

@@ -10,7 +10,6 @@
         <br>
       <img class="mb-[-12%] rounded-xl shadow-2xl ring-1 ring-gray-900/10" src="technology/img/technology22.png" alt="">
       <div class="relative" aria-hidden="true">
-        <div class="absolute -inset-x-20 bottom-0 bg-gradient-to-t from-white pt-[7%]"></div>
       </div>
     </div>
   </div>

templates/partials/technology3.html

@@ -0,0 +1,165 @@
+<div class="">
+    <section aria-labelledby="features-heading" class="mx-auto max-w-7xl py-24 sm:px-2 lg:px-8">
+      <div class="mx-auto max-w-2xl px-4 lg:max-w-none lg:px-0">
+        <div class="max-w-3xl">
+          <h2 id="features-heading" class="text-3xl font-bold tracking-tight text-white sm:text-4xl">Technical Specifications</h2>
+          <p class="mt-4 text-gray-50">Dive into the technical details that empower our revolutionary cloud platform, Offering Compute (GPU, CPU), Storage and Network.</p>
+        </div>
+  
+        <div class="mt-4">
+          <div class="-mx-4 flex overflow-x-auto sm:mx-0">
+            <div class="flex-auto border-b border-gray-200 px-4 sm:px-0">
+              <div class="-mb-px flex space-x-10" aria-orientation="horizontal" role="tablist">
+                <!-- Current: "border-indigo-500 text-indigo-400", Default: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700" -->
+                <button id="features-tab-1" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:border-gray-300 hover:text-gray-50" aria-controls="features-panel-1" role="tab" type="button">3Nodes</button>
+                <button id="features-tab-2" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:border-gray-300 hover:text-gray-50" aria-controls="features-panel-2" role="tab" type="button">Zero-OS</button>
+                <button id="features-tab-3" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:border-gray-300 hover:text-gray-50" aria-controls="features-panel-3" role="tab" type="button">Mycelium</button>
+                <button id="features-tab-4" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:border-gray-300 hover:text-gray-50" aria-controls="features-panel-4" role="tab" type="button">Fungistor</button>
+              </div>
+            </div>
+          </div>
+  
+          <div id="features-panel-1" class="space-y-16 pt-10 lg:pt-16" aria-labelledby="features-tab-1" role="tabpanel" tabindex="0">
+            <div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
+              <div class="mt-6 lg:col-span-5 lg:mt-0">
+                <h3 class="text-lg font-medium text-white">3Nodes</h3>
+                <p class="mt-2 text-sm text-gray-50">3Nodes is a revolutionary decentralized infrastructure comprising a network of three interconnected nodes that collectively provide a highly resilient, secure, and scalable platform for computing, storage, and data management, ensuring robust performance and redundancy across a distributed architecture.
+                </p>
+                <dl class="mt-10 space-y-8">
+                    <div>
+                      <dt class="text-sm font-medium text-gray-100">&#8226; Plug & Play</dt>
+                      <dd class="mt-2 text-sm text-gray-100">The machined kettle has a smooth black finish and contemporary shape that stands apart from most plastic appliances.</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Peer-to-peer</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Shaped for steady pours and insulated to prevent burns.</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Scalable</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Nodes can be deployed on any level providing unlimited scalability.</dd>
+                    </div>
+                  </dl>
+              </div>
+              <div class="lg:col-span-7">
+                <div class="aspect-h-1 aspect-w-2 overflow-hidden rounded-lg bg-gray-100 sm:aspect-h-2 sm:aspect-w-5">
+                  <img src="https://tailwindui.com/img/ecommerce-images/product-feature-06-detail-01.jpg" alt="Maple organizer base with slots, supporting white polycarbonate trays of various sizes." class="object-cover object-center">
+                </div>
+              </div>
+            </div>
+          </div>
+          <div id="features-panel-2" class="space-y-16 pt-10 lg:pt-10" aria-labelledby="features-tab-2" role="tabpanel" tabindex="0">
+            <div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
+              <div class="mt-6 lg:col-span-5 lg:mt-0">
+                <h3 class="text-lg font-medium text-white">Zero-OS</h3>
+                <p class="mt-2 text-sm text-gray-50">Zero-OS is a bare-metal, stateless, and efficient operating system designed to host AI, Web2, and Web3 workloads in a more sovereign manner, without compromising on security, control, and monitoring.</p>
+                <dl class="mt-10 space-y-8">
+                    <div>
+                      <dt class="text-sm font-medium text-gray-100">&#8226; CORE-0</dt>
+                      <dd class="mt-2 text-sm text-gray-100">First process launched on the Zero-OS. This process kicks off all activities on the node and allows the full OS to be booted over the network maintening full integrity and hacking surfaces </dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Hardware Support</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Support for INTEL, AMD or ARM Based CPUs. Support any amount of GPU/CPU/Memory</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Kernel</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Zero-OS uses the well known Linux Kernel because it has device drivers for almost any hardware that exists.</dd>
+                    </div>
+                  </dl>
+              </div>
+              <div class="lg:col-span-7">
+                <div class="aspect-h-1 aspect-w-2 overflow-hidden rounded-lg bg-gray-900 sm:aspect-h-2 sm:aspect-w-5">
+                  <img src="https://tailwindui.com/img/ecommerce-images/product-feature-06-detail-02.jpg" alt="Walnut organizer base with pen, sticky note, phone, and bin trays, next to modular drink coaster attachment." class="object-cover object-center">
+                </div>
+              </div>
+            </div>
+          </div>
+          <div id="features-panel-3" class="space-y-16 pt-10 lg:pt-16" aria-labelledby="features-tab-3" role="tabpanel" tabindex="0">
+            <div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
+              <div class="mt-6 lg:col-span-5 lg:mt-0">
+                <h3 class="text-lg font-medium text-white">Mycelium</h3>
+                <p class="mt-2 text-sm text-gray-50">
+                    Mycelium is the culmination of a decade-long quest for a more efficient network system, enabling faster and more reliable communication between machines and people.
+                </p>
+                <dl class="mt-10 space-y-8">
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Shortest Path Route</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Mycelium optimizes data transmission by identifying and utilizing the fastest and most direct routes.</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; End-to-End Encrypted</dt>
+                      <dd class="mt-2 text-sm text-gray-100">All data is secured with end-to-end encryption, ensuring protection against interception.</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Ultra Compatible</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Mycelium seamlessly integrates with any existing internet connection, including peer-to-peer networks.</dd>
+                    </div>
+                  </dl>
+              </div>
+              <div class="lg:col-span-7">
+                <div class="aspect-h-1 aspect-w-2 overflow-hidden rounded-lg bg-gray-900 sm:aspect-h-2 sm:aspect-w-5">
+                  <img src="https://tailwindui.com/img/ecommerce-images/product-feature-06-detail-03.jpg" alt="Walnut organizer base with white polycarbonate trays in the kitchen with various kitchen utensils." class="object-cover object-center">
+                </div>
+              </div>
+            </div>
+          </div>
+          <div id="features-panel-4" class="space-y-16 pt-10 lg:pt-16" aria-labelledby="features-tab-4" role="tabpanel" tabindex="0">
+            <div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
+              <div class="mt-6 lg:col-span-5 lg:mt-0">
+                <h3 class="text-lg font-medium text-gray-50">Fungistor</h3>
+                <p class="mt-2 text-sm text-gray-100">Fungistor is a decentralized, globally distributed data storage system that is up to 10 times more efficient in terms of power and hardware usage. It is highly reliable, ensuring that data cannot be lost or corrupted. Additionally, it is safe, private, and scalable.
+                </p>
+                <dl class="mt-10 space-y-8">
+                    <div>
+                      <dt class="text-sm font-medium text-gray-100">&#8226; Always Consistent</dt>
+                      <dd class="mt-2 text-sm text-gray-100">Fungistor employs advanced storage algorithms that fragment files into multiple pieces distributed across numerous nodes and sites.</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Self-healing</dt>
+                      <dd class="mt-2 text-sm text-gray-100">The storage layer is equipped with automatic data integrity checks that promptly detect and correct any corruption, ensuring continuous data health..</dd>
+                    </div>
+                    <div>
+                      <dt class="text-sm font-medium text-gray-50">&#8226; Ultra Secure</dt>
+                      <dd class="mt-2 text-sm text-gray-100">With its sophisticated encryption and redundancy protocols, data remains secure, protected from loss, and impervious to corruption.</dd>
+                    </div>
+                  </dl>
+              </div>
+              <div class="lg:col-span-7">
+                <div class="aspect-h-1 aspect-w-2 overflow-hidden rounded-lg bg-gray-900 sm:aspect-h-2 sm:aspect-w-5">
+                  <img src="https://tailwindui.com/img/ecommerce-images/product-feature-06-detail-04.jpg" alt="Walnut organizer system on black leather desk mat on top of white desk." class="object-cover object-center">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</div>
+
+<script>
+    document.addEventListener('DOMContentLoaded', function () {
+      const tabs = document.querySelectorAll('[role="tab"]');
+      const panels = document.querySelectorAll('[role="tabpanel"]');
+  
+      tabs.forEach((tab, index) => {
+        tab.addEventListener('click', function () {
+          tabs.forEach(t => t.classList.remove('border-indigo-500', 'text-indigo-500'));
+          panels.forEach(panel => panel.style.display = 'none');
+  
+          tab.classList.add('border-indigo-500', 'text-indigo-500');
+          const panelId = tab.getAttribute('aria-controls');
+          document.getElementById(panelId).style.display = 'block';
+        });
+  
+        // Hide all panels except the first one on load
+        if (index === 0) {
+          tab.classList.add('border-indigo-500', 'text-indigo-500');
+          panels[index].style.display = 'block';
+        } else {
+          panels[index].style.display = 'none';
+        }
+      });
+    });
+  </script>
+    

templates/partials/technology4.html

@@ -1,10 +1,10 @@
-<div class="bg-gray-900 py-24 sm:py-32">
+<div class="py-24 sm:py-32">
     <div class="mx-auto max-w-7xl px-6 lg:px-8">
       <div class="mx-auto max-w-2xl lg:mx-0">
-        <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">Stay on top of customer support</h2>
+        <h2 class="text-3xl font-bold tracking-tight text-white lg:text-4xl">Technological Benefits</h2>
-        <p class="mt-6 text-lg leading-8 text-gray-300">Lorem ipsum dolor sit amet consect adipisicing elit. Possimus magnam voluptatum cupiditate veritatis in accusamus quisquam.</p>
+        <p class="mt-6 text-lg leading-8 text-gray-300">Discover Our Cutting-Edge Technological Benefits: Unleashing Unmatched Efficiency, Security, and Scalability.</p>
       </div>
-      <div class="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none">
+      <div class="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-16 lg:max-w-none">
         <dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
           <div class="flex flex-col">
             <dt class="text-base font-semibold leading-7 text-white">
@@ -13,13 +13,10 @@
                   <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 13.5h3.86a2.25 2.25 0 012.012 1.244l.256.512a2.25 2.25 0 002.013 1.244h3.218a2.25 2.25 0 002.013-1.244l.256-.512a2.25 2.25 0 012.013-1.244h3.859m-19.5.338V18a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 00-2.15-1.588H6.911a2.25 2.25 0 00-2.15 1.588L2.35 13.177a2.25 2.25 0 00-.1.661z" />
                 </svg>
               </div>
-              Unlimited inboxes
+              Improved Performance
             </dt>
             <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
-              <p class="flex-auto">Non quo aperiam repellendus quas est est. Eos aut dolore aut ut sit nesciunt. Ex tempora quia. Sit nobis consequatur dolores incidunt.</p>
+              <p class="flex-auto">Enhance operational efficiency by achieving faster response times and minimizing latency.</p>
-              <p class="mt-6">
-                <a href="#" class="text-sm font-semibold leading-6 text-indigo-400">Learn more <span aria-hidden="true">→</span></a>
-              </p>
             </dd>
           </div>
           <div class="flex flex-col">
@@ -29,13 +26,10 @@
                   <path stroke-linecap="round" stroke-linejoin="round" d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z" />
                 </svg>
               </div>
-              Manage team members
+              Enhanced Security
             </dt>
             <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
-              <p class="flex-auto">Vero eum voluptatem aliquid nostrum voluptatem. Vitae esse natus. Earum nihil deserunt eos quasi cupiditate. A inventore et molestiae natus.</p>
+              <p class="flex-auto">Encrypted, compressed, fragmented, and distributed data enhances security, efficiency, and resilience across interconnected nodes.</p>
-              <p class="mt-6">
-                <a href="#" class="text-sm font-semibold leading-6 text-indigo-400">Learn more <span aria-hidden="true">→</span></a>
-              </p>
             </dd>
           </div>
           <div class="flex flex-col">
@@ -45,13 +39,53 @@
                   <path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
                 </svg>
               </div>
-              Spam report
+              Data Sovereignty
             </dt>
             <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
-              <p class="flex-auto">Et quod quaerat dolorem quaerat architecto aliquam accusantium. Ex adipisci et doloremque autem quia quam. Quis eos molestiae at iure impedit.</p>
+              <p class="flex-auto">Empowering nations, businesses, and individuals with deliberate design, granting control and ownership over their data.</p>
-              <p class="mt-6">
+            </dd>
-                <a href="#" class="text-sm font-semibold leading-6 text-indigo-400">Learn more <span aria-hidden="true">→</span></a>
+          </div>
-              </p>
+        </dl>
+      </div>
+      <div class="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-16 lg:max-w-none">
+        <dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
+          <div class="flex flex-col">
+            <dt class="text-base font-semibold leading-7 text-white">
+              <div class="mb-6 flex h-10 w-10 items-center justify-center rounded-lg bg-indigo-500">
+                <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 13.5h3.86a2.25 2.25 0 012.012 1.244l.256.512a2.25 2.25 0 002.013 1.244h3.218a2.25 2.25 0 002.013-1.244l.256-.512a2.25 2.25 0 012.013-1.244h3.859m-19.5.338V18a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 00-2.15-1.588H6.911a2.25 2.25 0 00-2.15 1.588L2.35 13.177a2.25 2.25 0 00-.1.661z" />
+                </svg>
+              </div>
+              Edge Computing
+            </dt>
+            <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
+              <p class="flex-auto">Allow to distribute computing power closer to end-users or any devices.</p>
+            </dd>
+          </div>
+          <div class="flex flex-col">
+            <dt class="text-base font-semibold leading-7 text-white">
+              <div class="mb-6 flex h-10 w-10 items-center justify-center rounded-lg bg-indigo-500">
+                <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z" />
+                </svg>
+              </div>
+              Decentralized
+            </dt>
+            <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
+              <p class="flex-auto">Our solutions offer a range of governance options, from decentralized, federated to centralized models.</p>
+            </dd>
+          </div>
+          <div class="flex flex-col">
+            <dt class="text-base font-semibold leading-7 text-white">
+              <div class="mb-6 flex h-10 w-10 items-center justify-center rounded-lg bg-indigo-500">
+                <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
+                </svg>
+              </div>
+              Horizontal Scalability
+            </dt>
+            <dd class="mt-1 flex flex-auto flex-col text-base leading-7 text-gray-300">
+              <p class="flex-auto">The network has the capability to amplify resources without the need to individually augment the capacity of each resource.</p>
             </dd>
           </div>
         </dl>