diff --git a/src/app/components/Hero.tsx b/src/app/components/Hero.tsx
index 5b38724..27db236 100644
--- a/src/app/components/Hero.tsx
+++ b/src/app/components/Hero.tsx
@@ -63,10 +63,12 @@ export function Hero() {
               <span className="text-sm text-gray-700 dark:text-gray-200">Available for new projects</span>
             </motion.div>
 
-            <h1 className="text-4xl sm:text-5xl lg:text-6xl font-bold text-gray-900 dark:text-white mb-6">
-              Your Business Deserves a Website That{' '}
-              <span className="bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent">
-                <TypingText text="Converts" delay={1200} triggerOnView={false} cursorColor="bg-indigo-600" />
+            <h1 className="text-4xl sm:text-5xl lg:text-6xl font-bold mb-6">
+              <span className="hero-shimmer">
+                Your Business Deserves a Website That{' '}
+              </span>
+              <span className="converts-glow bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent">
+                Converts
               </span>
             </h1>
 
diff --git a/src/styles/theme.css b/src/styles/theme.css
index 548d614..311378d 100644
--- a/src/styles/theme.css
+++ b/src/styles/theme.css
@@ -1,5 +1,57 @@
 @custom-variant dark (&:is(.dark *));
 
+/* ── Hero headline shimmer sweep ─────────────────────────────────────────── */
+@keyframes shimmer-sweep {
+  0%   { background-position: -200% center; }
+  100% { background-position: 200% center; }
+}
+.hero-shimmer {
+  background: linear-gradient(
+    90deg,
+    #1e1b4b 0%,
+    #4338ca 35%,
+    #e0e7ff 49%,
+    #c4b5fd 51%,
+    #4338ca 65%,
+    #1e1b4b 100%
+  );
+  background-size: 200% auto;
+  color: #4338ca; /* fallback color */
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  animation: shimmer-sweep 6s linear infinite;
+}
+.dark .hero-shimmer {
+  background: linear-gradient(
+    90deg,
+    #818cf8 0%,
+    #a5b4fc 35%,
+    #ddd6fe 49%,
+    #c4b5fd 51%,
+    #a5b4fc 65%,
+    #818cf8 100%
+  );
+  background-size: 200% auto;
+  color: #818cf8; /* fallback color */
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  animation: shimmer-sweep 6s linear infinite;
+}
+
+/* ── Hero "Converts" glow pulse ──────────────────────────────────────────── */
+@keyframes glow-pulse {
+  0%, 100% { filter: drop-shadow(0 0 2px rgba(99,102,241,0.2)) drop-shadow(0 0 1px rgba(167,139,250,0.15)); }
+  50%       { filter: drop-shadow(0 0 8px rgba(99,102,241,0.5)) drop-shadow(0 0 4px rgba(167,139,250,0.35)); }
+}
+.converts-glow {
+  animation: glow-pulse 2.5s ease-in-out infinite;
+  display: inline-block;
+}
+
+
+
 :root {
   --font-size: 16px;
   --background: #ffffff;