diff --git a/src/tailwind/TextAnimations/DecryptedText/DecryptedText.jsx b/src/tailwind/TextAnimations/DecryptedText/DecryptedText.jsx
index 49377e0e6..21e28fe35 100644
--- a/src/tailwind/TextAnimations/DecryptedText/DecryptedText.jsx
+++ b/src/tailwind/TextAnimations/DecryptedText/DecryptedText.jsx
@@ -1,6 +1,21 @@
 import { useEffect, useState, useRef, useMemo, useCallback } from 'react';
 import { motion } from 'motion/react';
 
+const styles = {
+  srOnly: {
+    position: 'absolute',
+    width: '1px',
+    height: '1px',
+    padding: 0,
+    margin: '-1px',
+    overflow: 'hidden',
+    clip: 'rect(0,0,0,0)',
+    whiteSpace: 'nowrap',
+    border: 0,
+    visibility: 'hidden'
+  }
+};
+
 export default function DecryptedText({
   text,
   speed = 50,
@@ -351,7 +366,7 @@ export default function DecryptedText({
       {...animateProps}
       {...props}
     >
-      <span className="sr-only">{displayText}</span>
+      <span className="sr-only" style={styles.srOnly}>{displayText}</span>
 
       <span aria-hidden="true">
         {displayText.split('').map((char, index) => {
diff --git a/src/ts-tailwind/TextAnimations/DecryptedText/DecryptedText.tsx b/src/ts-tailwind/TextAnimations/DecryptedText/DecryptedText.tsx
index 9e8767dba..202973261 100644
--- a/src/ts-tailwind/TextAnimations/DecryptedText/DecryptedText.tsx
+++ b/src/ts-tailwind/TextAnimations/DecryptedText/DecryptedText.tsx
@@ -2,6 +2,21 @@ import { useEffect, useState, useRef, useMemo, useCallback } from 'react';
 import { motion } from 'motion/react';
 import type { HTMLMotionProps } from 'motion/react';
 
+const styles = {
+  srOnly: {
+    position: 'absolute' as const,
+    width: '1px',
+    height: '1px',
+    padding: 0,
+    margin: '-1px',
+    overflow: 'hidden',
+    clip: 'rect(0,0,0,0)',
+    whiteSpace: 'nowrap' as const,
+    border: 0,
+    visibility: 'hidden' as const
+  }
+};
+
 interface DecryptedTextProps extends HTMLMotionProps<'span'> {
   text: string;
   speed?: number;
@@ -368,7 +383,7 @@ export default function DecryptedText({
       {...animateProps}
       {...props}
     >
-      <span className="sr-only">{displayText}</span>
+      <span className="sr-only" style={styles.srOnly}>{displayText}</span>
 
       <span aria-hidden="true">
         {displayText.split('').map((char, index) => {