fix: resolve layout overflow and overlapping footer

lib/pdf-business-card.tsx

@@ -141,17 +141,20 @@ const styles = StyleSheet.create({
   // -- WHITE PAGE (Vorderseite) --
   backContainer: {
     flex: 1,
-    padding: '8mm',
+    paddingTop: '6mm',
+    paddingBottom: '4mm',
+    paddingLeft: '6mm',
+    paddingRight: '6mm',
     flexDirection: 'column',
   },
   backHeader: {
-    marginBottom: '8mm',
+    marginBottom: '5mm',
     flexDirection: 'row',
     alignItems: 'center',
     width: '100%',
   },
   backLogo: {
-    width: 70,
+    width: 60,
   },
   accentLineHorizontal: {
     flex: 1,
@@ -177,6 +180,7 @@ const styles = StyleSheet.create({
     top: -5,
   },
   backBody: {
+    flex: 1,
     flexDirection: 'row',
     justifyContent: 'space-between',
     alignItems: 'flex-start',
@@ -188,25 +192,25 @@ const styles = StyleSheet.create({
     paddingRight: '4mm',
   },
   nameSection: {
-    marginBottom: '6mm',
+    marginBottom: '4mm',
   },
   nameText: {
     fontSize: 14,
     fontWeight: 'bold',
     color: COLORS.neutralDark,
-    marginBottom: 3,
+    marginBottom: 2,
     letterSpacing: -0.2,
   },
   roleText: {
     fontSize: 7.5,
     fontWeight: 'bold',
     color: COLORS.primary,
-    letterSpacing: 0.8,
+    letterSpacing: 0.5,
     textTransform: 'uppercase',
   },
   contactSection: {
     flexDirection: 'column',
-    gap: 6,
+    gap: 4,
   },
   contactRow: {
     flexDirection: 'row',
@@ -218,7 +222,7 @@ const styles = StyleSheet.create({
     alignItems: 'flex-start',
   },
   contactText: {
-    fontSize: 8.5,
+    fontSize: 8,
     color: COLORS.neutralDark,
     fontWeight: 'normal',
     paddingTop: 1,
@@ -227,7 +231,6 @@ const styles = StyleSheet.create({
     flexDirection: 'column',
     alignItems: 'flex-end',
     justifyContent: 'flex-start',
-    paddingTop: 2,
   },
   // Ultra Minimalist QR Area
   qrContainer: {
@@ -236,8 +239,8 @@ const styles = StyleSheet.create({
     gap: 3,
   },
   qrCodeWrapper: {
-    width: '12mm',
+    width: '13mm',
-    height: '12mm',
+    height: '13mm',
   },
   qrCode: {
     width: '100%',
@@ -250,19 +253,16 @@ const styles = StyleSheet.create({
     letterSpacing: 1.2,
   },
   addressFooter: {
-    position: 'absolute',
+    width: '100%',
-    bottom: '5mm',
-    left: '8mm',
-    right: '8mm',
     flexDirection: 'row',
     justifyContent: 'center',
     alignItems: 'center',
     borderTop: `0.5pt solid ${COLORS.grayText}`,
-    paddingTop: '2.5mm',
+    paddingTop: '2mm',
-    opacity: 0.8,
+    marginTop: 'auto',
   },
   addressFooterText: {
-    fontSize: 5.5,
+    fontSize: 5,
     color: COLORS.neutralDark,
     letterSpacing: 1.5,
     textTransform: 'uppercase',