diff --git a/src/components/Abouthero.jsx b/src/components/Abouthero.jsx
index 821373c..73b05f6 100644
--- a/src/components/Abouthero.jsx
+++ b/src/components/Abouthero.jsx
@@ -17,8 +17,13 @@ export default function Abouthero() {
       </div>
       <div className="mx-auto max-w-7xl px-6 lg:px-8">
         <div className="mx-auto max-w-2xl lg:mx-0">
+<<<<<<< HEAD
           <h2 className="lg:text-6xl font-semibold tracking-tight lg:max-w-xl max-w-md leading-tight text-gradient text-3xl">At OurVerse, <br/>
           we go beyond traditional video calls. </h2>
+=======
+          <h2 className="lg:text-6xl font-semibold tracking-tight lg:max-w-2xl max-w-xl leading-tight text-white text-3xl">
+          Beyond Traditional Video Calls. </h2>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           <p className="mt-6 section-text-light  font-display">
           Our immersive decentralized metaverse platform brings people together in a dynamic, interactive environment where meetings and events feel REAL. 
           </p>
@@ -27,7 +32,11 @@ export default function Abouthero() {
           <div className="mt-10 pb-8 flex items-center gap-x-6">
             <a
               href="#"
+<<<<<<< HEAD
               className="rounded-2xl btn-gradient-dark2 font-semibold px-3.5 py-2.5"
+=======
+              className="rounded-2xl btn-dark text-base font-semibold px-3.5 py-2.5"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Join OurVerse
             </a>
diff --git a/src/components/Aboutnodes.jsx b/src/components/Aboutnodes.jsx
index 346220f..6bfb823 100644
--- a/src/components/Aboutnodes.jsx
+++ b/src/components/Aboutnodes.jsx
@@ -21,8 +21,15 @@ export default function Aboutnodes() {
           </p>
           <div className="mt-8">
             <a
+<<<<<<< HEAD
               href="/community.html"
               className="inline-flex rounded-2xl bg-white/10 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm btn-gradient-dark2"
+=======
+              href="https://www.threefold.io/getnode/"
+              className="inline-flex rounded-2xl bg-white/10 px-3.5 py-2.5 text-base font-semibold text-white shadow-sm btn-dark"
+              target="_blank"
+              rel="noopener noreferrer"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Host a Node
             </a>
diff --git a/src/components/Bentosection.jsx b/src/components/Bentosection.jsx
index 026af99..5de6429 100644
--- a/src/components/Bentosection.jsx
+++ b/src/components/Bentosection.jsx
@@ -67,12 +67,21 @@ export default function BentoSection() {
           </p>
           <div className="mt-10 flex gap-x-8">
           <a
+<<<<<<< HEAD
               href="#"
               className="rounded-2xl btn-gradient-dark px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
             >
               See Features
             </a>
           <a href="#" className="text-sm py-2.5 font-semibold leading-6 text-cyan-600 hover:text-purple-500">
+=======
+              href="/features.html"
+              className="rounded-2xl btn-dark px-3.5 py-2.5 text-base font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
+            >
+              See Features
+            </a>
+          <a href="/usecases.html" className="text-base py-2.5 font-semibold leading-6 text-link">
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           Read Use Cases <span aria-hidden="true">→</span>
             </a>
             </div>
diff --git a/src/components/Bottom.jsx b/src/components/Bottom.jsx
index 7335c40..96c719b 100644
--- a/src/components/Bottom.jsx
+++ b/src/components/Bottom.jsx
@@ -3,7 +3,11 @@ export default function Bottom() {
       <div className="relative isolate overflow-hidden bg-gray-900">
         <div className="px-6 py-24 sm:px-6 sm:py-32 lg:px-8">
           <div className="mx-auto max-w-2xl text-center">
+<<<<<<< HEAD
             <h2 className="text-3xl font-bold tracking-tight text-gradient-light lg:text-5xl">
+=======
+            <h2 className="text-3xl font-bold tracking-tight text-white  lg:text-5xl">
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               The Future of Collaboration
               <br />
               is now.
@@ -13,8 +17,15 @@ export default function Bottom() {
             </p>
             <div className="mt-10 flex items-center justify-center gap-x-6">
               <a
+<<<<<<< HEAD
                 href="#"
                 className="rounded-2xl btn-gradient-dark2 px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm hover:bg-gray-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white"
+=======
+                href="https://portal.ourverse.tf"
+                className="rounded-2xl btn-dark text-base font-semibold text-gray-900"
+                target="_blank"
+                rel="noopener noreferrer"c
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               >
                 Sign Up Now
               </a>
diff --git a/src/components/Button.jsx b/src/components/Button.jsx
index e13b5f3..1320a3c 100644
--- a/src/components/Button.jsx
+++ b/src/components/Button.jsx
@@ -3,7 +3,11 @@ import clsx from 'clsx'
 
 export function Button({ className, ...props }) {
   className = clsx(
+<<<<<<< HEAD
     'inline-flex justify-center rounded-2xl btn-gradient-dark py-2 px-4 text-xs font-semibold text-white hover:btn-gradient-dark-hover focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500 active:text-white/70',
+=======
+    'inline-flex justify-center rounded-2xl btn-dark py-4 px-3 text-sm font-semibold text-white hover:btn-dark-hover focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500 active:text-white/70',
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
     className,
   )
 
diff --git a/src/components/Communhero.jsx b/src/components/Communhero.jsx
index 87b76f4..05ed5aa 100644
--- a/src/components/Communhero.jsx
+++ b/src/components/Communhero.jsx
@@ -15,9 +15,15 @@ export default function Communhero() {
       
       {/* Content container with a higher z-index */}
       <div className="relative z-10 mx-auto max-w-7xl px-6 lg:px-8">
+<<<<<<< HEAD
         <div className="mx-auto max-w-2xl lg:mx-0">
           <h2 className="mt-2 text-3xl font-semibold tracking-tight text-gradient sm:text-4xl">
           A United Community <br/>Creating the Future of <br/>Virtual Worlds
+=======
+        <div className="mx-auto max-w-xl lg:mx-0">
+          <h2 className="mt-2 lg:text-5xl font-semibold tracking-tight text-white text-3xl">
+          Create the Future of Virtual World Together 
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           </h2>
           <p className="mt-6 section-text-light font-display max-w-xl text-purple-50">
           Join a global movement where visionaries, creators, and innovators come together to shape immersive digital experiences. 
@@ -29,7 +35,11 @@ export default function Communhero() {
           <div className="mt-10 pb-8 flex items-center gap-x-6">
             <a
               href="#"
+<<<<<<< HEAD
               className="rounded-2xl btn-gradient-dark2 font-semibold px-3.5 py-2.5"
+=======
+              className="rounded-2xl btn-dark font-semibold px-3.5 py-2.5"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Join OurVerse
             </a>
diff --git a/src/components/Cta.jsx b/src/components/Cta.jsx
index 43d8da1..f002a92 100644
--- a/src/components/Cta.jsx
+++ b/src/components/Cta.jsx
@@ -20,10 +20,20 @@ export default function CTA() {
             <div className="mt-8">
               <a
                 href="/community.html"
+<<<<<<< HEAD
                 className="inline-flex rounded-2xl bg-white/10 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm btn-gradient-dark2"
+=======
+                className="inline-flex rounded-2xl bg-white/10 px-3.5 py-2.5 text-base font-semibold text-white shadow-sm btn-dark"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               >
                 Be a Part of OurVerse
               </a>
+<<<<<<< HEAD
+=======
+              <a href="https://threefold.io" className=" inline-flex  text-base py-2.5 font-semibold leading-6 text-link" target="_blank" rel="noopener noreferrer">
+                Visit ThreeFold  <span aria-hidden="true"> →</span>
+            </a>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             </div>
           </div>
         </div>
diff --git a/src/components/Eventbanner.jsx b/src/components/Eventbanner.jsx
index c675b34..7a85606 100644
--- a/src/components/Eventbanner.jsx
+++ b/src/components/Eventbanner.jsx
@@ -18,16 +18,26 @@ export default function Eventbanner() {
             <div aria-hidden="true" className="relative h-32 w-full lg:hidden" />
             <div className="absolute py-4 inset-x-0 bottom-0 rounded-bl-lg rounded-br-lg bg-purple-950 bg-opacity-90 p-6 backdrop-blur backdrop-filter sm:flex sm:items-center sm:justify-between lg:inset-x-auto lg:inset-y-0 lg:w-96  lg:flex-col lg:items-start lg:rounded-br-none lg:rounded-tl-lg">
               <div>
+<<<<<<< HEAD
                 <h2 className="mt-4 lg:text-3xl text-xl font-bold text-gradient-light">OurVerse </h2>
                     <h2 className="lg:text-3xl text-xl font-bold text-gradient-light">FutureFest 2024</h2>
                     <h3 className="text-xl font-bold text-gradient-light">Nov 22 - 24</h3>
+=======
+                <h2 className="mt-4 lg:text-3xl text-xl font-bold text-white">OurVerse </h2>
+                    <h2 className="lg:text-3xl text-xl font-bold text-white">FutureFest 2024</h2>
+                    <h3 className="text-xl font-bold text-white">Nov 22 - 24</h3>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
                 <p className="mt-4 text-md text-gray-300">
                 OurVerse's OurFutureFest connects freelancers, innovators, and businesses in the Metaverse, empowering them to explore new technologies and collaborate seamlessly across boundaries.
                 </p>
               </div>
               <a
                 href="/events/versefest.html"
+<<<<<<< HEAD
                 className="mt-6 flex flex-shrink-0 items-center justify-center rounded-md btn-gradient-dark bg-opacity-0 px-4 py-3 text-base font-medium text-white hover:bg-opacity-10 sm:ml-8 sm:mt-0 lg:ml-0 lg:w-full"
+=======
+                className="mt-6 flex flex-shrink-0 items-center justify-center rounded-md btn-dark bg-opacity-0 px-4 py-3 text-base font-medium text-white hover:bg-opacity-10 sm:ml-8 sm:mt-0 lg:ml-0 lg:w-full"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               >
                 Register Now
               </a>
diff --git a/src/components/Events.jsx b/src/components/Events.jsx
index f91d269..86b6648 100644
--- a/src/components/Events.jsx
+++ b/src/components/Events.jsx
@@ -54,11 +54,19 @@ const featuredPost = {
             <div className="mt-4 flex items-center gap-x-6">
                     <a
                       href="#"
+<<<<<<< HEAD
                       className="rounded-2xl font-semibold btn-gradient-dark2 text-sm leading-6"
                     >
                       Learn More
                     </a>
                     <a href="/events" className="text-sm font-semibold leading-6 text-cyan-600 hover:text-purple-700">
+=======
+                      className="rounded-2xl font-semibold btn-dark text-base leading-6"
+                    >
+                      Learn More
+                    </a>
+                    <a href="/events" className="text-base font-semibold leading-6 text-linkgo">
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
                       See more events <span aria-hidden="true">→</span>
                     </a>
                   </div>
diff --git a/src/components/Featurehero.jsx b/src/components/Featurehero.jsx
index e30ca68..9d50563 100644
--- a/src/components/Featurehero.jsx
+++ b/src/components/Featurehero.jsx
@@ -17,7 +17,11 @@ export default function Featurehero() {
       </div>
       <div className="mx-auto max-w-7xl px-6 lg:px-8">
         <div className="mx-auto max-w-2xl lg:mx-0">
+<<<<<<< HEAD
           <h2 className="lg:text-6xl font-semibold tracking-tight text-gradient text-xl">The Future of Collaboration</h2>
+=======
+          <h2 className="lg:text-6xl font-semibold tracking-tight text-white text-4xl">The Future of Collaboration</h2>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           <p className="mt-6 section-text-light max-w-xl font-display">
           Step into the future of communication and collaboration with immersive virtual environments. 
           OurVerse provides innovative tools that transform your events, meetings, and creative projects, 
@@ -25,8 +29,15 @@ export default function Featurehero() {
           </p>
           <div className="mt-10 pb-8 flex items-center gap-x-6">
             <a
+<<<<<<< HEAD
               href="#"
               className="rounded-2xl btn-gradient-dark2 font-semibold px-3.5 py-2.5"
+=======
+              href="https://portal.ourverse.tf"
+              className="rounded-2xl btn-dark font-semibold px-3.5 py-2.5"
+              target="_blank"
+              rel="noopener noreferrer"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Join OurVerse
             </a>
diff --git a/src/components/Featureshome.jsx b/src/components/Featureshome.jsx
index 1271238..c953ba1 100644
--- a/src/components/Featureshome.jsx
+++ b/src/components/Featureshome.jsx
@@ -185,9 +185,13 @@ export default function Featureshome() {
                   </div>
                 ))}
                 <div className="mt-6">
+<<<<<<< HEAD
                   <a
                     href="/features"
                     className="inline-flex rounded-2xl px-4 py-1.5 text-base font-semibold leading-7 text-white shadow-sm btn-gradient-dark"
+=======
+                  <a href="/features" className="inline-flex rounded-2xl px-4 py-1.5 text-base font-semibold leading-7 text-white shadow-sm btn-dark"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
                   >
                     Explore Features
                   </a>
diff --git a/src/components/HeroFeature.jsx b/src/components/HeroFeature.jsx
index a0fd435..d211636 100644
--- a/src/components/HeroFeature.jsx
+++ b/src/components/HeroFeature.jsx
@@ -64,11 +64,19 @@ import {
         <div className="mt-10 pb-8 flex items-center justify-center gap-x-6">
             <a
               href="#"
+<<<<<<< HEAD
               className="rounded-2xl btn-gradient-dark px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
             >
               Try Now
             </a>
             <a href="#" className="text-sm font-semibold leading-6 text-purple-900 hover:text-purple-500">
+=======
+              className="rounded-2xl btn-dark px-3.5 py-2.5 text-base font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
+            >
+              Try Now
+            </a>
+            <a href="/heroverse.html" className="text-base font-semibold leading-6 text-link">
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               Learn more <span aria-hidden="true">→</span>
             </a>
           </div>
diff --git a/src/components/Heropage.jsx b/src/components/Heropage.jsx
index 46e965b..2483ef2 100644
--- a/src/components/Heropage.jsx
+++ b/src/components/Heropage.jsx
@@ -20,16 +20,27 @@ export function Heropage() {
         </video>
 
         <div className="mx-auto max-w-xl lg:max-w-6xl text-center">
+<<<<<<< HEAD
           <h1 className="font-display lg:max-w-3xl font-bold text-gradient tracking-tighter lg:text-6xl text-4xl">
           OurHero Verse 3D
           </h1>
           <h2 className="font-display mt-8 lg:max-w-4xl section-text-light">OurVerse has developed <span className='text-gradient font-semibold'>OurHero Verse 3D</span>, a cutting-edge system that allows users to generate full 3D virtual environments using text input alone. With this tool, users can create immersive and interactive environments, tailored to their needs, simply by describing them.  <br/> <br/>In addition to full environments, the system can generate HDRI environments, ensuring a surrounding atmosphere that matches the generated space. </h2>
+=======
+          <h1 className="font-display lg:max-w-3xl font-bold text-white tracking-tighter lg:text-6xl text-4xl">
+          OurHero Verse 3D
+          </h1>
+          <h2 className="font-display mt-8 lg:max-w-4xl section-text-light">OurVerse has developed <span className='font-semibold text-white'>OurHero Verse 3D</span>, a cutting-edge system that allows users to generate full 3D virtual environments using text input alone. With this tool, users can create immersive and interactive environments, tailored to their needs, simply by describing them.  <br/> <br/>In addition to full environments, the system can generate HDRI environments, ensuring a surrounding atmosphere that matches the generated space. </h2>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           <div className="lg:max-w-3xl max-w-2xl my-6 space-y-6 font-display font-medium lg:text-2xl text-xl tracking-tight leading-normal text-purple-800">
           </div>
           <div className="mt-10 pb-8 flex items-center justify-center gap-x-6">
             <a
               href="#"
+<<<<<<< HEAD
               className="rounded-2xl btn-gradient-dark px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
+=======
+              className="rounded-2xl btn-dark px-3.5 py-2.5 text-base font-semibold shadow-sm"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Try HeroVerse 3D
             </a>
diff --git a/src/components/Homepage.jsx b/src/components/Homepage.jsx
index c0f6ac0..02ce175 100644
--- a/src/components/Homepage.jsx
+++ b/src/components/Homepage.jsx
@@ -21,12 +21,17 @@ export function Homepage() {
 
         <div className="mx-auto max-w-xl lg:max-w-6xl text-center">
           <h1 className="font-display lg:max-w-3xl font-bold text-white tracking-tighter lg:text-7xl text-5xl">
+<<<<<<< HEAD
             The Future of <span className='text-gradient-light'>Collaboration is Now.</span>
+=======
+            The Future of <span className='text-white'>Collaboration is Now.</span>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           </h1>
           <div className="lg:max-w-3xl max-w-2xl my-6 space-y-6 font-display font-medium lg:text-2xl text-xl tracking-tight leading-normal text-purple-800">
           </div>
           <div className="mt-10 pb-8 flex items-center justify-center gap-x-6">
             <a
+<<<<<<< HEAD
               href="#"
               className="rounded-2xl btn-gradient-dark px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
             >
@@ -34,6 +39,17 @@ export function Homepage() {
             </a>
             <a href="#" className="text-sm font-semibold leading-6 text-white hover:text-purple-200">
               Learn more <span aria-hidden="true">→</span>
+=======
+              href="https://portal.ourverse.tf"
+              target="_blank" 
+              rel="noopener noreferrer" 
+              className="rounded-2xl btn-dark px-3.5 py-2.5 text-base font-semibold"
+            >
+              Join OurVerse
+            </a>
+            <a href="/features.html" className="text-base font-semibold leading-6 text-white hover:text-purple-200">
+              Discover Features <span aria-hidden="true">→</span>
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             </a>
           </div>
         </div>
diff --git a/src/components/Phases.jsx b/src/components/Phases.jsx
index b516b5b..8a318f8 100644
--- a/src/components/Phases.jsx
+++ b/src/components/Phases.jsx
@@ -44,7 +44,11 @@ export function Phasesdark() {
     return (
         <div className="bg-gradient-dark min-h-screen">
           <div className="mx-auto max-w-7xl py-24 px-6 lg:px-8">
+<<<<<<< HEAD
             <h2 className="lg:text-4xl pt-20 font-semibold tracking-tight leading-normal text-gradient-light text-3xl">
+=======
+            <h2 className="lg:text-4xl pt-20 font-semibold tracking-tight leading-normal text-white text-3xl">
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
               Experience True Collaboration
             </h2>
             <p className="mt-4 mb-4 text-purple-100 lg:text-xl space-y-6 font-display">
@@ -62,7 +66,11 @@ export function Phasesdark() {
                   <time
                     dateTime={item.dateTime}
                     className={`flex items-center text-md font-semibold leading-6 ${
+<<<<<<< HEAD
                       item.date === 'Phase IV' || item.date === 'Phase V' ? 'text-purple-lt lg:text-xl' : 'text-purple-200'
+=======
+                      item.date === 'Phase IV' || item.date === 'Phase V' ? 'text-white lg:text-xl' : 'text-purple-200'
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
                     }`}
                   >
                     <svg viewBox="0 0 4 4" aria-hidden="true" className="mr-4 h-1 w-1 flex-none">
@@ -72,7 +80,11 @@ export function Phasesdark() {
                   </time>
                   <p
                     className={`mt-6 text-lg font-semibold leading-6 tracking-tight ${
+<<<<<<< HEAD
                       item.date === 'Phase IV' || item.date === 'Phase V' ? 'text-purple-lt' : 'text-purple-200'
+=======
+                      item.date === 'Phase IV' || item.date === 'Phase V' ? 'text-white' : 'text-purple-200'
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
                     }`}
                   >
                     {item.name}
diff --git a/src/components/Usecases.jsx b/src/components/Usecases.jsx
index 54b31bb..a44d0ba 100644
--- a/src/components/Usecases.jsx
+++ b/src/components/Usecases.jsx
@@ -15,8 +15,13 @@ export default function Usecases() {
       {/* Content container with a higher z-index */}
       <div className="relative z-10 mx-auto max-w-7xl px-6 lg:px-8">
         <div className="mx-auto max-w-2xl lg:mx-0">
+<<<<<<< HEAD
           <h2 className="mt-2 text-3xl font-semibold tracking-tight text-gradient sm:text-4xl">
             Exploring Impactful<br/>Use Cases from <br/>Real-life Applications
+=======
+          <h2 className="mt-2 lg:text-5xl font-semibold tracking-tight text-white text-3xl">
+            Exploring Impactful Use Cases from Real-life Applications
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
           </h2>
           <p className="mt-6 text-lg max-w-xl leading-8 text-purple-50">
             Discover how OurVerse uniquely addresses challenges and fosters innovation in education, healthcare, environmental conservation, 
@@ -26,8 +31,15 @@ export default function Usecases() {
         
         <div className="mt-10 pb-8 flex items-center gap-x-6">
             <a
+<<<<<<< HEAD
               href="#"
               className="rounded-2xl btn-gradient-dark2 font-semibold px-3.5 py-2.5"
+=======
+              href="https://portal.ourverse.tf"
+              className="rounded-2xl btn-dark font-semibold px-3.5 py-2.5"
+              target="_blank"
+              rel="noopener noreferrer"
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd
             >
               Join OurVerse
             </a>
diff --git a/src/styles/tailwind.css b/src/styles/tailwind.css
index 608ee3d..64f9e28 100644
--- a/src/styles/tailwind.css
+++ b/src/styles/tailwind.css
@@ -309,3 +309,128 @@
     color: rgb(116, 0, 204); /* equivalent to 'text-cyan-700' */
 }
 
+<<<<<<< HEAD
+=======
+/* NEW STYLES */
+
+/* For text on a dark background */
+.text-light {
+  background-color: #f0e3f9; /* Light purple */
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+/* For text on a light background */
+.text-dark {
+  background-color: #4e2c7e; /* Dark purple */
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+
+
+.text-gradient-new {
+  background-image: linear-gradient(45deg, #5e4589 0%, #341a55 100%); /* Gradient dark purple */
+  background-color: #341a55;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+.text-gradient-new2 {
+  background-image: linear-gradient(45deg, #ceb1ff 0%, #fcfcfc 50%, #ceb1ff  100%); /* Gradient dark purple */
+  background-color: #341a55;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+   /* H3 Section title */
+
+   .h3-title-new {
+    font-weight: 600; /* Equivalent to font-semibold */
+    letter-spacing: -0.01em; /* Equivalent to tracking-tight */
+    line-height: 1.2; /* Equivalent to leading-normal */
+    font-size: 1.25rem; /* Equivalent to text-xl */
+    background-color: #5e4589;
+    background-image: linear-gradient(45deg, #684c97 0%, #341a55 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    text-fill-color: transparent;
+  }
+
+  @media (min-width: 1024px) {
+    .h3-title-new {
+      font-size: 2.25rem; /* Equivalent to lg:text-4xl */
+    }
+  }
+
+/* Button styles */
+
+/* Button gradient for dark backgrounds */
+.btn-light {
+  background: radial-gradient(circle, #eee1ff 0%, #9971e0 100%); /* Radial gradient with #eee1ff in the center */
+  color: #341a55;
+  padding: 8px 15px;
+  border: none;
+  cursor: pointer;
+  transition: background 0.3s ease;
+}
+
+.btn-light:hover {
+  background: radial-gradient(circle, #9971e0 0%, #341a55 100%); /* Reverse radial gradient on hover */
+  color: #eee1ff;
+}
+
+
+
+/* Button gradient for light backgrounds */
+.btn-dark {
+  background: radial-gradient(circle, #5e4589 0%, #341a55 100%); /* Radial gradient dark purple */
+  color: white;
+  padding: 10px 18px;
+  border: none;
+  cursor: pointer;
+  transition: background 0.3s ease;
+}
+
+.btn-dark:hover {
+  background: radial-gradient(circle, #341a55 0%, #5e4589 100%); /* Reverse radial gradient on hover */
+}
+
+.text-link {
+  background-color: #703db7; /* Dark purple */
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+.text-link:hover {
+  background-color: #4e2c7e; /* Dark purple */
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+
+.btn-new {
+  background:  radial-gradient(circle, #7152a6 0%, #755bb2 0%, #5e4589 50%, #341a55 100%); /* Light purple gradient similar to the bird */
+  color: #ffffff; /* Dark purple color similar to the text */
+  padding: 8px 15px;
+  border: none;
+  cursor: pointer;
+  border-radius: 1rem /* 16px */;
+}
+
+.btn-new:hover {
+  background: radial-gradient(circle, #341a55 0%, #5e4589 100%); /* Reverse gradient on hover */
+}
+>>>>>>> 4f67c29af8c9f32c55f43ef5bf9813c49a5735cd