gradient

assets/css/hero.css

@@ -7,7 +7,7 @@
   justify-content: space-between;
   flex-direction: column;
   align-items: center;
-  background: linear-gradient(to bottom, #F9B208, #ed5c51);
+  background: linear-gradient(to bottom right, #F9B208, #ed5c51);
 }
 
 .hero-first {
@@ -165,15 +165,13 @@
 }
 
 /* Button at the end of the hero-second */
+
 .hero-button-end {
   display: flex;
   justify-content: center;
   padding: 40px 0;
   background-color: white;
   color: #E72E77;
-}
-
-.hero-button-end a {
   padding: 20px 40px;
   font-size: 1.6rem;
   font-weight: bold;
@@ -182,7 +180,7 @@
   transition: background-color 0.3s;
 }
 
-.hero-button-end a:hover {
+.hero-second button:hover {
   background-color: linear-gradient(to bottom right, #F9B208, #E72E77);
 }
 

partials/components/hero.hbs

@@ -90,8 +90,6 @@
         </div>
 
         <!-- Call to Action Button -->
-        <div class="hero-button-end">
-            <a href="https://anydev.info/early-access/" class="cta-button">Get Started Now</a>
-        </div>
+        <button href="https://anydev.info/early-access/" class="hero-button-end">Get Started Now</a>
     </div>
 </section>