Hero Tuned

Author: krishnaandhe

components/Contact.jsx

@@ -116,18 +116,19 @@ export default function Contact() {
             </AnimatePresence>
           </div>
 
-          {profile.resumeUrl && (
-            <a
-              href={profile.resumeUrl}
-              target="_blank"
-              rel="noopener noreferrer"
-              download="Krishna_Andhe_CV.pdf"
-              data-hover
-              className="flex items-center gap-2 px-5 py-3 rounded-full bg-accent text-bg font-semibold hover:opacity-90 transition"
-            >
-              <FiDownload size={16} className="animate-bob" /> Download Resume
-            </a>
-          )}
+              {/* WHOLE BUTTON bounces on hover */}
+              {profile.resumeUrl && (
+                <a
+                  href={profile.resumeUrl}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  download="Krishna_Andhe_CV.pdf"
+                  data-hover
+                  className="px-6 py-3 rounded-full border border-accent text-accent font-semibold flex items-center gap-2 hover:bg-accent hover:text-bg transition hover:animate-bounceTwice"
+                >
+                  <FiDownload size={18} /> Résumé
+                </a>
+              )}
         </div>
 
         <footer className="mt-20 pt-8 border-t border-line text-sm text-muted text-center">

components/Hero.jsx

@@ -107,10 +107,17 @@ export default function Hero() {
                 className="px-6 py-3 rounded-full border border-line hover:border-accent transition">
                 Book training
               </a>
+              {/* WHOLE BUTTON bounces on hover */}
               {profile.resumeUrl && (
-                <a href={profile.resumeUrl} target="_blank" rel="noopener noreferrer" download="Krishna_Andhe_CV.pdf" data-hover
-                  className="px-6 py-3 rounded-full border border-accent text-accent font-semibold flex items-center gap-2 hover:bg-accent hover:text-bg transition">
-                  <FiDownload size={18} className="animate-bob" /> Résumé
+                <a
+                  href={profile.resumeUrl}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  download="Krishna_Andhe_CV.pdf"
+                  data-hover
+                  className="px-6 py-3 rounded-full border border-accent text-accent font-semibold flex items-center gap-2 hover:bg-accent hover:text-bg transition hover:animate-bounceTwice"
+                >
+                  <FiDownload size={18} /> Résumé
                 </a>
               )}
             </motion.div>

tailwind.config.js

@@ -20,7 +20,7 @@ module.exports = {
       fontFamily: {
         sans: ["Inter", "system-ui", "sans-serif"],
         mono: ["JetBrains Mono", "monospace"],
-        hand: ['Caveat', 'cursive'],
+        hand: ["Caveat", "cursive"],
       },
       container: {
         center: true,
@@ -44,20 +44,17 @@ module.exports = {
           "0%": { transform: "rotate(0deg)" },
           "100%": { transform: "rotate(360deg)" },
         },
+        bounceTwice: {
+          "0%, 100%": { transform: "translateY(0)" },
+          "25%, 75%": { transform: "translateY(4px)" },
+          "50%": { transform: "translateY(0)" },
+        },
       },
       animation: {
         wave: "wave 2.2s ease-in-out infinite",
         blob: "blob 16s ease-in-out infinite",
         spinSlow: "spinSlow 18s linear infinite",
-      },
-      keyframes: {
-        bob: {
-          "0%, 100%": { transform: "translateY(0)" },
-          "50%": { transform: "translateY(3px)" },
-        },
-      },
-      animation: {
-        bob: "bob 2s ease-in-out infinite",
+        bounceTwice: "bounceTwice 0.5s ease-in-out",
       },
     },
   },