diff --git a/src/app/(frontend)/[slug]/page.tsx b/src/app/(frontend)/[slug]/page.tsx
index 8b3806e..030cf62 100644
--- a/src/app/(frontend)/[slug]/page.tsx
+++ b/src/app/(frontend)/[slug]/page.tsx
@@ -74,7 +74,7 @@ export default async function Page({ params: paramsPromise }: Args) {
 
 
   if (decodedSlug === 'home') {
-    return <HeroPage richText={hero.richText} links={hero.links} />
+    return <HeroPage richText={hero.richText} links={hero.links} layout={layout} />
   }
 
   return (
diff --git a/src/components/HeroPage.tsx b/src/components/HeroPage.tsx
index 81761fa..62d5202 100644
--- a/src/components/HeroPage.tsx
+++ b/src/components/HeroPage.tsx
@@ -10,6 +10,7 @@ import { useThemeMode } from '@/hooks/useThemeMode'
 import { CMSLink } from '@/components/Link'
 import RichText from '@/components/RichText'
 import type { Page } from '@/payload-types'
+import { RenderBlocks } from '@/blocks/RenderBlocks'
 import { Button } from '@/components/ui/button'
 
 // ─── Types ────────────────────────────────────────────────────────────────────
@@ -284,9 +285,10 @@ function LogosSection({ isDark }: { isDark: boolean }) {
 interface HeroPageProps {
   richText?: Page['hero']['richText']
   links?: Page['hero']['links']
+  layout?: Page['layout']
 }
 
-export default function HeroPage({ richText, links }: HeroPageProps) {
+export default function HeroPage({ richText, links, layout }: HeroPageProps) {
   const { isDark, toggle } = useThemeMode()
 
   return (
@@ -302,6 +304,11 @@ export default function HeroPage({ richText, links }: HeroPageProps) {
         <main>
           <HeroSection isDark={isDark} richText={richText} links={links} />
           <LogosSection isDark={isDark} />
+                    {layout && layout.length > 0 && (
+            <div id="skills">
+              <RenderBlocks blocks={layout} />
+            </div>
+          )}
         </main>
       </div>