feat(landing): implement route groups for different header behaviors

- Created (landings) route group for home page with sticky header
- Created (apps) route group for docs/demo/admin with scrollable header
- Moved page components to respective route groups
- Updated root layout to be minimal (no header/footer)
- Each route group has its own layout with appropriate header style
- Updated Footer and layouts to use public folder logo path

This enables sticky header on landing pages while docs/demo pages
have a header that scrolls away with content.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

apps/landing/src/app/(apps)/layout.tsx

@@ -0,0 +1,38 @@
+import Image from 'next/image';
+import { Footer } from '@/components/shared/Footer';
+
+export default function AppsLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      {/* Scrollable Header (NOT sticky) */}
+      <header className="z-10 bg-slate-900/80 backdrop-blur-md border-b border-white/5">
+        <nav className="max-w-7xl mx-auto px-4 sm:px-6 py-2 sm:py-3 flex justify-between items-center h-12 sm:h-14 md:h-16">
+          <a href="/" className="h-full flex items-center">
+            <Image
+              src="/banatie-logo-horisontal.png"
+              alt="Banatie Logo"
+              width={150}
+              height={40}
+              priority
+              className="h-8 sm:h-10 md:h-full w-auto object-contain"
+            />
+          </a>
+          <a
+            href="/#get-access"
+            className="text-xs sm:text-sm text-gray-300 hover:text-white transition-colors"
+          >
+            Get Access
+          </a>
+        </nav>
+      </header>
+
+      {children}
+
+      <Footer />
+    </>
+  );
+}

apps/landing/src/app/(landings)/layout.tsx

@@ -0,0 +1,38 @@
+import Image from 'next/image';
+import { Footer } from '@/components/shared/Footer';
+
+export default function LandingsLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      {/* Sticky Header */}
+      <header className="sticky top-0 z-10 bg-slate-900/80 backdrop-blur-md border-b border-white/5">
+        <nav className="max-w-7xl mx-auto px-4 sm:px-6 py-2 sm:py-3 flex justify-between items-center h-12 sm:h-14 md:h-16">
+          <a href="/" className="h-full flex items-center">
+            <Image
+              src="/banatie-logo-horisontal.png"
+              alt="Banatie Logo"
+              width={150}
+              height={40}
+              priority
+              className="h-8 sm:h-10 md:h-full w-auto object-contain"
+            />
+          </a>
+          <a
+            href="#get-access"
+            className="text-xs sm:text-sm text-gray-300 hover:text-white transition-colors"
+          >
+            Get Access
+          </a>
+        </nav>
+      </header>
+
+      {children}
+
+      <Footer />
+    </>
+  );
+}

apps/landing/src/app/layout.tsx

@@ -1,9 +1,6 @@
 import type { Metadata } from 'next';
 import { Inter, Caveat } from 'next/font/google';
-import Image from 'next/image';
 import Script from 'next/script';
-import { Footer } from '@/components/shared/Footer';
-import banatieLogo from './_assets/banatie-logo-horisontal.png';
 import './globals.css';
 
 const inter = Inter({
@@ -47,32 +44,7 @@ export default function RootLayout({
             <div className="absolute bottom-1/4 -right-1/4 w-96 h-96 bg-cyan-600/10 rounded-full blur-3xl animate-pulse delay-700"></div>
           </div>
 
-          {/* Header */}
-          <header className="sticky top-0 z-10 bg-slate-900/80 backdrop-blur-md border-b border-white/5">
-            <nav className="max-w-7xl mx-auto px-4 sm:px-6 py-2 sm:py-3 flex justify-between items-center h-12 sm:h-14 md:h-16">
-              <div className="h-full flex items-center">
-                <Image
-                  src={banatieLogo}
-                  alt="Banatie Logo"
-                  width={150}
-                  height={40}
-                  priority
-                  className="h-8 sm:h-10 md:h-full w-auto object-contain"
-                />
-              </div>
-              <a
-                href="#get-access"
-                className="text-xs sm:text-sm text-gray-300 hover:text-white transition-colors"
-              >
-                Get Access
-              </a>
-            </nav>
-          </header>
-
-          {/* Page content */}
           {children}
-
-          <Footer />
         </div>
       </body>
     </html>

apps/landing/src/components/shared/Footer.tsx

@@ -2,7 +2,6 @@
 
 import Image from 'next/image';
 import { /* footerLinks, */ footerCopyright } from '@/config/footer';
-import banatieLogo from '@/app/_assets/banatie-logo-horisontal.png';
 
 export const Footer = () => {
   return (
@@ -12,7 +11,7 @@ export const Footer = () => {
           {/* Logo - responsive sizing */}
           <div className="h-10 sm:h-12 md:h-14 lg:h-16 flex items-center">
             <Image
-              src={banatieLogo}
+              src="/banatie-logo-horisontal.png"
               alt="Banatie Logo"
               width={200}
               height={60}