diff --git a/app/layout.tsx b/app/layout.tsx
index 1e87a09..9c11945 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -19,7 +19,7 @@ export default async function RootLayout({ children }: { readonly children: Reac
       <body
         className={cn(
           inter.className,
-          'mx-auto min-h-screen max-w-2xl bg-background px-6 py-12 antialiased sm:py-24',
+          'mx-auto min-h-screen max-w-2xl bg-background md:px-6 md:py-12 antialiased',
         )}
       >
         <NextIntlClientProvider messages={messages}>
diff --git a/app/page.tsx b/app/page.tsx
index 10f9fdc..3be09a6 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -24,7 +24,10 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
 export default function HomePage() {
   return (
     <main>
-      <NeonGradientCard neonColors={{ firstColor: '#ae00ff2b', secondColor: '#0011ff55' }}>
+      <NeonGradientCard
+        className="max-sm:min-h-screen"
+        neonColors={{ firstColor: '#ae00ff2b', secondColor: '#0011ff55' }}
+      >
         <div className="flex flex-col justify-between gap-y-5">
           <Person />
           <About />
diff --git a/eslint.config.mjs b/eslint.config.mjs
index fe4bbb3..e4785b1 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -41,6 +41,7 @@ export default [
         },
         { usePrettierrc: false },
       ],
+      'react/forbid-component-props': 0,
     },
   },
 ];
