diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index 5f7d1c770..f54a54b36 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -22,10 +22,10 @@ export default class Index extends React.Component {
     getFeatures() {
         let featureComponents = [];
         let features = [
-            { href: '/learn/react-native/wavepulse/', title: 'WavePulse', description: "WavePulse is a lightweight debugging tool tailored for Wavemaker Mobile apps. With minimal setup, you can seamlessly connect and inspect your app's components, view logs, monitor network traffic, analyze app storage, and more." },
-            { href: '/learn/app-development/core-implementation/core-and-implementation-projects/', title: 'Core Implementation', description: "Core projects act as a foundation with reusable code and components. Implementation projects extend this core functionality to meet specific application requirements." },
+            { href: '/learn/react-native/wavepulse/', title: 'WavePulse', description: "WavePulse is a lightweight debugging tool tailored for Wavemaker Mobile apps..." },
+            { href: '/learn/app-development/core-implementation/core-and-implementation-projects/', title: 'Core Implementation', description: "Core projects act as a foundation with reusable code and components..." },
             { href: '/learn/react-native/react-native-overview/', title: 'New React Native Studio', description: "React Native is a cross-platform framework for developing native mobile applications..." },
-            { href: '/learn/app-development/custom-widgets/enterprise-marketplace/', title: 'Prefab MarketPlace', description: "Enterprise marketplace allows artifacts to be published by teams to be used across multiple teams..." }]
+            { href: '/learn/app-development/custom-widgets/enterprise-marketplace/', title: 'Prefab MarketPlace', description: "Enterprise marketplace allows artifacts to be published by teams to be..." }]
         features.forEach((feature) => {
             featureComponents.push(
                 <div className='col' key={features.indexOf(feature)}>
diff --git a/website/static/css/custom.css b/website/static/css/custom.css
index 22a637c08..abf937703 100644
--- a/website/static/css/custom.css
+++ b/website/static/css/custom.css
@@ -778,9 +778,10 @@ html[data-theme="dark"] .extension .link img{
 .feature-card:focus {
     color: var(--wm-card-text-hover);
     text-decoration: none;
-    .link {
-        color: var(--ifm-link-color);
-    }
+}
+.feature-card:hover .link,
+.feature-card:focus .link {
+    color: var(--ifm-link-color);
 }
 .features-section .row {
     flex-direction: row;
@@ -813,6 +814,21 @@ html[data-theme="dark"] .extension .link img{
     padding: var(--wm-spacing-md) 4em;
 }
 
+#feature-section .col:nth-child(1):hover {
+    box-shadow: 24px 24px 30px 0px rgba(0, 0, 0, 0.05);
+  }
+  
+  #feature-section .col:nth-child(2):hover {
+    box-shadow: -24px 24px 30px 0px rgba(0, 0, 0, 0.05);
+  }
+  
+  #feature-section .col:nth-child(3):hover {
+    box-shadow: 24px -24px 30px 0px rgba(0, 0, 0, 0.05);
+  }
+  
+  #feature-section .col:nth-child(4):hover {
+    box-shadow: -24px -24px 30px 0px rgba(0, 0, 0, 0.05);
+  }
 
 .imagebox-img {
     display: block;
@@ -1866,6 +1882,10 @@ h2.widget-header{
 @media only screen and (max-width: 736px) {
     #feature-section {
         scroll-margin-top: 60px;
+        margin: 2rem;
+    }
+    #feature-section .col:hover {
+        box-shadow: 6px 8px 40px 0px rgba(119, 119, 119, 0.05) !important;
     }
 }