Update landing page with claude

apps/next/src/components/layout/header/index.tsx

@@ -1,48 +1,62 @@
 'use client';
 
+import type { ComponentProps } from 'react';
 import Image from 'next/image';
 import Link from 'next/link';
-import type { ComponentProps } from 'react';
+
 import { Controls } from './controls';
 
 export default function Header(headerProps: ComponentProps<'header'>) {
   return (
     <header
-      className='w-full px-4 md:px-6 lg:px-20 my-8'
+      className="border-border/40 bg-background/95 supports-[backdrop-filter]:bg-background/60 sticky top-0 z-50 w-full border-b backdrop-blur"
       {...headerProps}
     >
-      <div className='flex items-center justify-between'>
-        <div className='flex flex-1 justify-start'/>
-        <div className='shrink-0'>
+      <div className="container mx-auto flex h-16 items-center justify-between px-4 md:px-6">
+        {/* Logo */}
+        <Link
+          href="/"
+          className="flex items-center gap-2 transition-opacity hover:opacity-80"
+        >
+          <Image
+            src="/favicon.ico"
+            alt="Convex Monorepo"
+            width={32}
+            height={32}
+            className="h-8 w-8"
+          />
+          <span className="hidden text-lg font-bold sm:inline-block">
+            Convex Monorepo
+          </span>
+        </Link>
+
+        {/* Navigation */}
+        <nav className="hidden items-center gap-6 text-sm font-medium md:flex">
           <Link
-            href='/'
-            scroll={false}
-            className='flex flex-row items-center justify-center px-4'
+            href="/#features"
+            className="text-foreground/60 hover:text-foreground transition-colors"
           >
-            <Image
-              src='/favicon.ico'
-              alt='Convex Monorepo Logo'
-              width={100}
-              height={100}
-              className='w-10 md:w-[120px]'
-            />
-            <h1
-              className='title-text text-base md:text-4xl lg:text-8xl
-              bg-linear-to-r from-[#281A65] via-[#363354] to-accent-foreground
-              dark:from-[#bec8e6] dark:via-[#F0EEE4] dark:to-[#FFF8E7]
-              font-bold pl-2 md:pl-12 text-transparent bg-clip-text'
-            >
-              Convex Monorepo
-            </h1>
+            Features
           </Link>
+          <Link
+            href="/#tech-stack"
+            className="text-foreground/60 hover:text-foreground transition-colors"
+          >
+            Tech Stack
+          </Link>
+          <Link
+            href="https://git.gbrown.org/gib/convex-monorepo"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-foreground/60 hover:text-foreground transition-colors"
+          >
+            GitHub
+          </Link>
+        </nav>
 
-        </div>
-
-        <div className='flex-1 flex justfiy-end'>
-          <Controls />
-        </div>
+        {/* Controls (Theme + Auth) */}
+        <Controls />
       </div>
     </header>
   );
-};
-
+}