fix: header full-width, remove floating style, use border-bottom instead

web/default/src/components/layout/components/public-header.tsx

@@ -87,7 +87,7 @@ export function PublicHeader() {
   const homeUrl = isAuthenticated ? '/dashboard' : '/'
 
   useEffect(() => {
-    const handleScroll = () => setScrolled(window.scrollY > 16)
+    const handleScroll = () => setScrolled(window.scrollY > 0)
     window.addEventListener('scroll', handleScroll, { passive: true })
     handleScroll()
     return () => window.removeEventListener('scroll', handleScroll)
@@ -137,16 +137,16 @@ export function PublicHeader() {
 
   return (
     <>
-    <header ref={headerRef} className='fixed top-0 right-0 left-0 z-50 px-3 pt-3 sm:px-4 sm:pt-4'>
-      <div className='mx-auto max-w-5xl'>
+    <header ref={headerRef} className='fixed top-0 right-0 left-0 z-50'>
         <nav
           className={cn(
-              'flex items-center justify-between transition-all duration-700 ease-[cubic-bezier(0.16,1,0.3,1)]',
+              'flex items-center justify-between border-b transition-all duration-300',
               scrolled
-                ? 'bg-background/80 ring-border/80 h-12 rounded-2xl pr-1.5 pl-4 shadow-sm ring-[0.5px] backdrop-blur-2xl'
-                : 'h-16 px-2'
+                ? 'bg-background/80 border-border/80 backdrop-blur-xl'
+                : 'bg-background border-border h-16'
             )}
         >
+          <div className='mx-auto flex w-full max-w-6xl items-center justify-between px-6'>
           {/* Logo */}
           <Link
             to={homeUrl}
@@ -301,8 +301,8 @@ export function PublicHeader() {
               </div>
             </Button>
           </div>
+          </div>
         </nav>
-      </div>
     </header>
 
       {/* Mobile full-screen overlay */}