diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css
index 7efcec8..acb0700 100644
--- a/assets/css/tailwind.css
+++ b/assets/css/tailwind.css
@@ -209,12 +209,12 @@
     opacity: 0;
     transform: translateY(20px);
   }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
 }
 
 .animate-fadeInUp {
   animation: fadeInUp 0.5s ease-out forwards;
 }
+
+.post-grid-item.animated {
+  opacity: 1;
+}
diff --git a/assets/js/main.js b/assets/js/main.js
index 40676eb..c7ace8d 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -11,6 +11,12 @@ document.addEventListener('DOMContentLoaded', () => {
             item.style.animationDelay = `${index * 100}ms`;
             item.classList.add('animate-fadeInUp');
             item.classList.add('animated');
+
+            // Clean up animation class after it finishes to allow hover transforms
+            item.addEventListener('animationend', () => {
+                item.classList.remove('animate-fadeInUp');
+                item.style.opacity = '1';
+            }, { once: true });
         });
     };