diff --git a/templates/index.html b/templates/index.html
index 75d93c2..2c716ba 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -7,4 +7,5 @@
 {% include "partials/hero/aihero5.html" %}
 {% include "partials/hero/aihero6.html" %}
 {% include "partials/hero/aihero7.html" %}
+{% include "partials/hero/aihero10.html" %}
 {% endblock content %}
\ No newline at end of file
diff --git a/templates/partials/footer.html b/templates/partials/footer.html
index b895861..939a5d7 100644
--- a/templates/partials/footer.html
+++ b/templates/partials/footer.html
@@ -4,7 +4,7 @@
 <html>
     <head />
     <body>
-        <div class="mt-20 border-t border-gray-700"></div>
+        <div class="mt-18 border-t border-gray-700"></div>
         <footer class="bg-transparent">
             <div class="max-w-screen-2xl mx-auto py-12 px-4 sm:px-6">
                 <div class="xl:flex xl:gap-4">
diff --git a/templates/partials/hero/aihero10.html b/templates/partials/hero/aihero10.html
new file mode 100644
index 0000000..33ed961
--- /dev/null
+++ b/templates/partials/hero/aihero10.html
@@ -0,0 +1,15 @@
+<div class="bg-transparent  mt-12">
+    <div class="mx-auto ring-1 shadow-2xl ring-black py-12 rounded-2xl bg-white/5 max-w-7xl px-6 lg:flex lg:items-center lg:justify-between lg:px-20 border-solid border-y-stone-950">
+      <h2 class="lg:text-balance text-left items-start lg:text-[6rem] text-[2.5rem] font-normal tracking-tight text-black fade-in">
+        Own Your AI.  <br>Pre-Order<br>Now.
+      </h2>
+      <div class="mt-10 flex items-center 0 gap-x-6 lg:mt-0 lg:shrink-0 flex-wrap justify-center lg:justify-start">
+        <a href="https://docs.threefold.io/" target="_blank" class="fade-in rounded-2xl bg-black px-4 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 mb-4 lg:mb-0">
+          Dive Deeper
+        </a>
+        <a href="/action" class="text-sm/6 font-semibold text-gray-900">Learn more <span aria-hidden="true">→</span></a>
+      </div>
+      </div>
+    </div>
+</div>
+
diff --git a/templates/partials/hero/aihero4.html b/templates/partials/hero/aihero4.html
index 81babdb..4c34cd7 100644
--- a/templates/partials/hero/aihero4.html
+++ b/templates/partials/hero/aihero4.html
@@ -3,7 +3,7 @@
         <div class="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
             <div class="max-w-3xl">
                 <h2 class="fade-in text-left lg:text-[6rem] text-[2.5rem] leading-[1.1] font-normal tracking-tight text-black typing">
-                    Why Decentralized AI Matters
+                    Why Decentralized AI Matters...
                 </h2>
             </div> 
         </div>
diff --git a/templates/partials/hero/aihero9.html b/templates/partials/hero/aihero9.html
new file mode 100644
index 0000000..f98e3d7
--- /dev/null
+++ b/templates/partials/hero/aihero9.html
@@ -0,0 +1,10 @@
+<div class="fade-in">
+    <div class="mx-auto max-w-7xl px-6 py-24 sm:py-32 lg:flex lg:items-center lg:justify-between lg:px-8">
+      <h2 class="max-w-2xl text-4xl font-normal tracking-tight text-black sm:text-5xl">this part is cta4.html<br>this part is cta4.html</h2>
+      <div class="mt-10 flex items-center gap-x-6 lg:mt-0 lg:shrink-0">
+        <a href="#" class="rounded-md bg-white px-3.5 py-2.5 text-sm font-semibold text-black ring-1  ring-black shadow-xs hover:bg-gray-300 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Get started</a>
+        <a href="#" class="text-sm/6 font-semibold text-white hover:text-gray-300">Learn more <span aria-hidden="true">→</span></a>
+      </div>
+    </div>
+  </div>
+  
\ No newline at end of file
