Enhance global styles and components: add new breakpoint in globals.css, update SearchInput for improved styling and responsiveness, and modify Navbar for sticky positioning and better layout.

src/components/atoms/SearchInput/index.tsx

@@ -33,8 +33,8 @@ export const SearchInput: FC<Props> = ({
     <div className={`relative text-gray-600 inline-block ${className}`}>
       <input
         type="search"
-        name="serch"
-        className="bg-white h-10 px-5 pr-10 rounded-full text-sm focus:outline-none w-48 focus:w-[400px] transition-all"
+        name="search"
+        className="bg-white h-10 px-5 pr-10 rounded-full text-md md:text-sm focus:outline-none w-52 focus:w-[400px] transition-all max-w-[90vw]"
         value={value}
         placeholder={placeholder}
         onChange={(e) => setValue(e.target.value)}