Center subscription screen content when no active subscription

app/(tabs)/beneficiaries/[id]/subscription.tsx

@@ -464,7 +464,14 @@ export default function SubscriptionScreen() {
         />
       </View>
 
-      <ScrollView style={styles.scrollContent} contentContainerStyle={styles.content}>
+      <ScrollView
+        style={styles.scrollContent}
+        contentContainerStyle={[
+          styles.content,
+          // Center content when no subscription and no transactions
+          subscriptionState === 'none' && transactions.length === 0 && styles.contentCentered
+        ]}
+      >
         {/* Status Card */}
         {renderStatusCard()}
 
@@ -573,6 +580,10 @@ const styles = StyleSheet.create({
     padding: Spacing.lg,
     paddingBottom: Spacing.xxl,
   },
+  contentCentered: {
+    flexGrow: 1,
+    justifyContent: 'center',
+  },
 
   // Status Card Styles
   statusCard: {