diff --git a/src/components/home/CatalogSection.tsx b/src/components/home/CatalogSection.tsx
index 7639a9f..e3d6f34 100644
--- a/src/components/home/CatalogSection.tsx
+++ b/src/components/home/CatalogSection.tsx
@@ -77,7 +77,7 @@ const CatalogSection = ({ catalog }: CatalogSectionProps) => {
   const keyExtractor = useCallback((item: StreamingContent) => `${item.id}-${item.type}`, []);
 
   return (
-    <Animated.View style={styles.catalogContainer} entering={FadeIn.duration(350)}>
+    <Animated.View style={styles.catalogContainer} entering={FadeIn.duration(400)}>
       <View style={styles.catalogHeader}>
         <View style={styles.titleContainer}>
           <Text style={[styles.catalogTitle, { color: currentTheme.colors.text }]} numberOfLines={1}>{catalog.name}</Text>
diff --git a/src/components/home/ContentItem.tsx b/src/components/home/ContentItem.tsx
index 3a23b17..2e93eea 100644
--- a/src/components/home/ContentItem.tsx
+++ b/src/components/home/ContentItem.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect, useCallback, useRef } from 'react';
 import { Toast } from 'toastify-react-native';
 import { DeviceEventEmitter } from 'react-native';
-import { View, TouchableOpacity, ActivityIndicator, StyleSheet, Dimensions, Platform, Text, Animated, Share } from 'react-native';
+import { View, TouchableOpacity, ActivityIndicator, StyleSheet, Dimensions, Platform, Text, Share } from 'react-native';
 import FastImage from '@d11/react-native-fast-image';
 import { MaterialIcons, Feather } from '@expo/vector-icons';
 import { useTheme } from '../../contexts/ThemeContext';
@@ -11,6 +11,7 @@ import { DropUpMenu } from './DropUpMenu';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { storageService } from '../../services/storageService';
 import { TraktService } from '../../services/traktService';
+import Animated, { FadeIn } from 'react-native-reanimated';
 
 interface ContentItemProps {
   item: StreamingContent;
@@ -96,7 +97,6 @@ const ContentItem = ({ item, onPress, shouldLoadImage: shouldLoadImageProp, defe
   const { currentTheme } = useTheme();
   const { settings, isLoaded } = useSettings();
   const posterRadius = typeof settings.posterBorderRadius === 'number' ? settings.posterBorderRadius : 12;
-  const fadeInOpacity = React.useRef(new Animated.Value(1)).current;
   // Memoize poster width calculation to avoid recalculating on every render
   const posterWidth = React.useMemo(() => {
     switch (settings.posterSize) {
@@ -232,7 +232,7 @@ const ContentItem = ({ item, onPress, shouldLoadImage: shouldLoadImageProp, defe
 
   return (
     <>
-      <Animated.View style={[styles.itemContainer, { width: posterWidth, opacity: fadeInOpacity }]}> 
+      <Animated.View style={[styles.itemContainer, { width: posterWidth }]} entering={FadeIn.duration(300)}> 
         <TouchableOpacity
           style={[styles.contentItem, { width: posterWidth, borderRadius: posterRadius }]}
           activeOpacity={0.7}
diff --git a/src/components/home/HeroCarousel.tsx b/src/components/home/HeroCarousel.tsx
index 58b1398..b510875 100644
--- a/src/components/home/HeroCarousel.tsx
+++ b/src/components/home/HeroCarousel.tsx
@@ -532,21 +532,20 @@ const CarouselCard: React.FC<CarouselCardProps> = memo(({ item, colors, logoFail
         {/* Static genres positioned absolutely over the card */}
         {item.genres && (
           <View style={styles.genresOverlay as ViewStyle} pointerEvents="none">
-            <Animated.Text
-              entering={FadeIn.duration(400).delay(100)}
-              style={[styles.genres as TextStyle, { color: colors.mediumEmphasis, textAlign: 'center' }, genresAnimatedStyle]}
-              numberOfLines={1}
-            >
-              {item.genres.slice(0, 3).join(' • ')}
-            </Animated.Text>
+            <Animated.View entering={FadeIn.duration(400).delay(100)}>
+              <Animated.Text
+                style={[styles.genres as TextStyle, { color: colors.mediumEmphasis, textAlign: 'center' }, genresAnimatedStyle]}
+                numberOfLines={1}
+              >
+                {item.genres.slice(0, 3).join(' • ')}
+              </Animated.Text>
+            </Animated.View>
           </View>
         )}
         {/* Static action buttons positioned absolutely over the card */}
         <View style={styles.actionsOverlay as ViewStyle} pointerEvents="box-none">
-          <Animated.View
-            entering={FadeIn.duration(500).delay(200)}
-            style={[styles.actions as ViewStyle, actionsAnimatedStyle]}
-          >
+          <Animated.View entering={FadeIn.duration(500).delay(200)}>
+            <Animated.View style={[styles.actions as ViewStyle, actionsAnimatedStyle]}>
             <TouchableOpacity
               style={[styles.playButton as ViewStyle, { backgroundColor: colors.white }]}
               onPress={onPressPlay}
@@ -563,6 +562,7 @@ const CarouselCard: React.FC<CarouselCardProps> = memo(({ item, colors, logoFail
               <MaterialIcons name="info-outline" size={18} color={colors.white} />
               <Text style={[styles.secondaryText as TextStyle, { color: colors.white }]}>Info</Text>
             </TouchableOpacity>
+            </Animated.View>
           </Animated.View>
         </View>
         {/* Static logo positioned absolutely over the card */}