diff --git a/src/app/music/_components/Page.tsx b/src/app/music/_components/Page.tsx
index f2aca17..9685f90 100644
--- a/src/app/music/_components/Page.tsx
+++ b/src/app/music/_components/Page.tsx
@@ -42,7 +42,9 @@ export default function MusicPage(props: {
             </Card.CardHeader>
             <Card.CardContent className="flex flex-col gap-3">
               {track.description && (
-                <p className="text-sm text-muted-foreground gsapant">{track.description}</p>
+                <AnimatePopUp once position={i + 1.25} duration={2}>
+                  <p className="text-sm text-muted-foreground">{track.description}</p>
+                </AnimatePopUp>
               )}
               <AnimatePopUp duration={2} ease='elastic.inOut'  position={i + 1.3} once>
                 <AudioPlayer
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index 9f14e8c..c756bc8 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -37,7 +37,9 @@ function AnimatedCard({
     scrollOnly,
     once,
     debugId: `card-${position}`,
-    makeReveal: (el) => gsap.from(el, { x: -100, opacity: 0, duration: 0.5, paused: true }),
+    // Start hidden via CSS (see className) so the server-rendered card never
+    // flashes visible before GSAP runs; reveal animates *to* the shown state.
+    makeReveal: (el) => gsap.to(el, { x: 0, opacity: 1, duration: 0.5, paused: true }),
   })
   return (
     <div
@@ -45,7 +47,7 @@ function AnimatedCard({
       data-slot="card"
       data-size={size}
       className={cn(
-        "group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-opacity-60 backdrop-blur-sm",
+        "opacity-0 -translate-x-[100px] group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-opacity-60 backdrop-blur-sm",
         className
       )}
       {...props}