feat: add stagger entry animation to showcase on load and shuffle

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-20 08:44:13 -04:00
parent d4258d2ff1
commit 5e675f683f
2 changed files with 32 additions and 13 deletions
@@ -1394,6 +1394,24 @@ header {
  transition: opacity 0.3s ease;
 }

+/* Stagger entry animation for showcase items */
+@keyframes itemFadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(12px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.masonry-item.animating-in {
+  animation: itemFadeIn 0.25s ease forwards;
+  animation-delay: calc(var(--stagger-index, 0) * 60ms);
+  opacity: 0; /* Start hidden until animation fires */
+}
+
 /*------------------------------------------------------------------------------
  Forms
 ------------------------------------------------------------------------------*/