src/components/ui/NavbarCentered.tsx

@@ -46,22 +46,12 @@ const NavLink = ({
 };
 
 const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
-  const [isScrolled, setIsScrolled] = useState(false);
   const [menuOpen, setMenuOpen] = useState(false);
 
-  useEffect(() => {
-    const handleScroll = () => setIsScrolled(window.scrollY > 50);
-    window.addEventListener("scroll", handleScroll, { passive: true });
-    return () => window.removeEventListener("scroll", handleScroll);
-  }, []);
-
   return (
     <>
       <nav
-        className={cls(
-          "fixed z-1000 top-0 left-0 w-full transition-all duration-500 ease-in-out",
-          isScrolled ? "h-15 bg-background/80 backdrop-blur-sm" : "h-20 bg-background/0 backdrop-blur-0"
-        )}
+        className="fixed top-0 left-0 right-0 z-50 h-20 backdrop-blur-md bg-white/30 border-b border-gray-200"
       >
         <div className="relative flex items-center justify-between h-full w-content-width mx-auto">
           <Link to="/" className="text-xl font-medium text-foreground">{logo}</Link>

src/index.css

@@ -133,6 +133,7 @@ html {
 }
 
 body {
+  padding-top: 4rem;
   margin: 0;
   background-color: var(--background);
   color: var(--foreground);