homepage

src/components/Build.jsx

@@ -11,6 +11,7 @@ import {
     ShieldCheckIcon,
     FilmIcon,
     GlobeAltIcon,
+    RocketLaunchIcon,
   } from '@heroicons/react/20/solid'
   
   const features = [
@@ -50,10 +51,10 @@ import {
     return (
       <div className="bg-white lg:py-20 py-24">
         <div className="mx-auto max-w-7xl px-6 lg:px-8">
-          <div className="mx-auto max-w-2xl sm:text-center">
+          <div className="mx-auto max-w-4xl sm:text-center">
             <h2 className="text-base font-medium font-mono leading-7 text-blue-600">Get Started</h2>
-            <p className="mt-2 lg:text-5xl font-semibold tracking-tight text-blue-700 text-3xl">Build Your Own Verse</p>
-            <p className="mt-6 text-lg leading-8 text-blue-900">
+            <p className="mt-2 font-display text-4xl font-medium tracking-tighter text-blue-600 sm:text-5xl">Build Your Own Verse</p>
+            <p className="mt-6 font-display text-2xl tracking-tight text-blue-900">
             Create and customize your virtual world with powerful tools and resources that make building and managing your digital space easy and intuitive.
             </p>
           </div>
@@ -88,6 +89,14 @@ import {
               </div>
             ))}
           </dl>
+          <div className="mt-16 flex items-center justify-center gap-x-6">
+            <a
+              href="#"
+              className="rounded-xl bg-blue-700 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
+            >
+              Build Your Own Verse Now  <RocketLaunchIcon className="h-4 w-4 inline-block -mt-0.5" />
+            </a>
+          </div>
         </div>
       </div>
     )