diff --git a/themes/lucentui/views/home.blade.php b/themes/lucentui/views/home.blade.php
index 9332c87b3..3d71769ed 100644
--- a/themes/lucentui/views/home.blade.php
+++ b/themes/lucentui/views/home.blade.php
@@ -1,14 +1,54 @@
 <div class="min-h-screen">
-    <!-- Homepage-specific custom HTML -->
-    @if(theme('custom_homepage_html'))
-    <div class="custom-homepage-content">
-        {!! theme('custom_homepage_html') !!}
-    </div>
-    @endif
-    <!-- Hero Section -->
-    <div class="relative overflow-hidden">
-        <div class="container mx-auto px-4 py-20 md:py-24 relative z-10">
-            <div class="text-center max-w-5xl mx-auto">
+    @if(theme('homepage_layout', 'landing') === 'landing')
+        <!-- Landing Page Layout -->
+        
+        <!-- Custom HTML Section -->
+        @if(theme('custom_homepage_html'))
+            <div class="custom-homepage-content">
+                {!! theme('custom_homepage_html') !!}
+            </div>
+        @endif
+        
+        <!-- Hero Section -->
+        <section class="relative isolate overflow-hidden bg-gradient-to-b from-background-primary via-background to-background-secondary/50 pt-18 pb-32 px-8">
+            @if(theme('background_image_url'))
+            <div class="background-image-layer"
+                 style="position: absolute;
+                        top: 0;
+                        left: 0;
+                        width: 100%;
+                        min-height: 100%;
+                        background-image: url('{{ theme('background_image_url') }}');
+                        background-size: cover;
+                        background-position: center;
+                        background-repeat: no-repeat;
+                        background-attachment: scroll;
+                        opacity: {{ theme('background_image_opacity', 30) / 100 }};
+                        filter: blur({{ theme('background_image_blur', 5) }}px);
+                        z-index: -2;
+                        pointer-events: none;
+                        -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%);
+                        mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%);
+                        -webkit-mask-repeat: no-repeat;
+                        mask-repeat: no-repeat;
+                        -webkit-mask-position: center;
+                        mask-position: center;">
+            </div>
+            @endif
+
+            <svg class="absolute inset-0 -z-10 h-full w-full stroke-primary/15 [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)]" aria-hidden="true">
+                <defs>
+                    <pattern id="grid-pattern" width="80" height="80" x="50%" y="-1" patternUnits="userSpaceOnUse">
+                        <path d="M.5 80V.5H80" fill="none" />
+                    </pattern>
+                </defs>
+                <rect width="100%" height="100%" strokeWidth="0" fill="url(#grid-pattern)" />
+            </svg>
+
+            <div class="mt-20 container mx-auto px-4 lg:px-8 relative z-10">
+                <div class="max-w-7xl lg:grid lg:grid-cols-12 lg:gap-x-8 lg:px-0">
+                    <div class="lg:col-span-7 lg:px-0 lg:pt-4">
+                        <div class="text-center max-w-5xl mx-auto">
                 <!-- Hero Badge -->
                 <div class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full border border-primary/30 bg-primary/10 text-primary text-xs font-semibold mb-6 animate-fade-in-up">
                     <x-ri-sparkling-2-fill class="size-4" />
@@ -91,11 +131,12 @@
                         <span class="text-xs font-semibold">DDoS Protected</span>
                     </div>
                 </div>
+                    </div>
+                </div>
             </div>
-        </div>
-    </div>
+        </section>
 
-    <!-- Stats Section -->
+        <!-- Stats Section -->
     <div class="py-16 md:py-24">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-2 lg:grid-cols-4 gap-4 md:gap-8">
@@ -543,7 +584,18 @@
         </div>
     </div>
 
-    <div class="mt-16 mb-8">
-        {!! hook('pages.home') !!}
-    </div>
+        <div class="mt-16 mb-8">
+            {!! hook('pages.home') !!}
+        </div>
+    @else
+        <!-- Portal Page Layout - To be added in next step -->
+        <!-- Custom HTML Section -->
+        @if(theme('custom_homepage_html'))
+            <div class="custom-homepage-content">
+                {!! theme('custom_homepage_html') !!}
+            </div>
+        @endif
+        
+        <!-- Portal layout content will be added here -->
+    @endif
 </div>