diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.scss b/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.scss
index 9faed4e..73a83cb 100644
--- a/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.scss
+++ b/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.scss
@@ -1,6 +1,13 @@
 @use '../../../css/utils';
 
 .mdx-hero-action {
+  &:hover,
+  button:hover {
+    &,
+    * {
+      text-decoration: none !important;
+    }
+  }
 }
 
 .mdx-hero-action--large {
diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.tsx b/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.tsx
index 5316a40..52d3f7f 100644
--- a/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.tsx
+++ b/packages/logos-docusaurus-theme/src/client/components/mdx/HeroAction/HeroAction.tsx
@@ -21,7 +21,11 @@ export const HeroAction: React.FC<HeroActionProps> = ({
       {...props}
     >
       <Button variant={variant} size={size}>
-        <Typography variant="label1" style={{ color: 'inherit' }}>
+        <Typography
+          component="span"
+          variant="label1"
+          style={{ color: 'inherit' }}
+        >
           {children}
         </Typography>
       </Button>