app/components/navbar.js

'use client'

export default function Navbar() {
  return (
    <nav className="bg-gray-800/80 backdrop-blur-md p-6 fixed w-full top-0 z-50 border-b border-gray-700">
      <div className="flex justify-between items-center max-w-6xl mx-auto">
        <div className="text-white font-bold text-xl">
          <span className="text-teal-400">Sysmotix</span>
        </div>
        <ul className="flex space-x-8">
          <li><a href="#solutions" className="text-white hover:text-teal-400 transition-colors">Solutions</a></li>
          <li><a href="#process" className="text-white hover:text-teal-400 transition-colors">Process</a></li>
          <li><a href="#technology" className="text-white hover:text-teal-400 transition-colors">Technology</a></li>
          <li><a href="#results" className="text-white hover:text-teal-400 transition-colors">Results</a></li>
          <li><a href="#" className="bg-teal-400 hover:bg-teal-300 text-slate-900 px-4 py-2 rounded-full font-semibold transition-all">Contact Us</a></li>
        </ul>
      </div>
    </nav>
  )
}