diff --git a/apps/website/app/[locale]/page.tsx b/apps/website/app/[locale]/page.tsx
index 572790d..2e3a3e9 100644
--- a/apps/website/app/[locale]/page.tsx
+++ b/apps/website/app/[locale]/page.tsx
@@ -12,6 +12,7 @@ import { unstable_setRequestLocale } from "next-intl/server"
 import Image from "next/image"
 
 import WikipediaLogo from "#public/images/Wikipedia-Logo.webp"
+import { Section } from "@repo/ui/Layout/Section"
 
 interface HomePageProps extends LocaleProps {}
 
@@ -26,8 +27,8 @@ const HomePage: React.FC<HomePageProps> = (props) => {
   const localeWikipedia = fromLocaleToWikipediaLocale(params.locale)
 
   return (
-    <MainLayout>
-      <section className="text-center">
+    <MainLayout center>
+      <Section horizontalSpacing>
         <Typography as="h1" variant="h1">
           {t("home.title")}
         </Typography>
@@ -43,7 +44,7 @@ const HomePage: React.FC<HomePageProps> = (props) => {
             },
           })}
         </Typography>
-      </section>
+      </Section>
 
       <section className="my-6 flex items-center justify-center">
         <Image src={WikipediaLogo} alt="Wikipedia" className="w-72" />
diff --git a/packages/ui/src/Layout/MainLayout/MainLayout.tsx b/packages/ui/src/Layout/MainLayout/MainLayout.tsx
index 974cfa5..919e7b2 100644
--- a/packages/ui/src/Layout/MainLayout/MainLayout.tsx
+++ b/packages/ui/src/Layout/MainLayout/MainLayout.tsx
@@ -12,7 +12,7 @@ export const MainLayout: React.FC<MainLayoutProps> = (props) => {
   return (
     <main
       className={classNames(
-        "min-h-[calc(100vh-188px)] md:mx-auto md:max-w-4xl lg:max-w-7xl",
+        "min-h-[calc(100vh-133px)] md:mx-auto md:max-w-4xl lg:max-w-7xl",
         {
           "flex flex-col items-center justify-center text-center": center,
         },