AI Web Navigation Bar

<div class="fixed flex z-50 pr-4 pl-4 top-6 right-0 left-0 justify-center">
  <style>@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap');</style>
  <div class="flex shadow-cyan-900/50 bg-black/60 border-white/20 border
    rounded-none pt-2 pr-2 pb-2 pl-2 shadow-2xl backdrop-blur-xl
    gap-x-1 gap-y-1 items-center
    font-['Inter','Helvetica_Neue',sans-serif]">
    <a href="#" class="inline-flex items-center justify-center bg-center w-[60px]
      h-[40px]
      bg-[url(https://cdn.midjourney.com/992e5ce2-c199-4ff5-b085-9c0f4635fa17/0_2.png?w=800&q=80)]
      bg-cover rounded"></a>
    <div class="hidden md:flex items-center gap-1 text-sm font-medium text-zinc-400">
      <a href="#features" class="px-4 py-2 hover:text-cyan-300 transition-colors font-medium">Features</a>
      <a href="#pricing" class="px-4 py-2 hover:text-cyan-300 transition-colors font-medium">Pricing</a>
      <a href="#" class="px-4 py-2 hover:text-cyan-300 transition-colors font-medium">Showcase</a>
      <a href="#" class="px-4 py-2 hover:text-cyan-300 transition-colors mr-2 font-medium">Contact us</a>
    </div>
    <a href="#" class="hover:bg-cyan-400 transition-colors shadow-cyan-500/30
      active:scale-95 text-sm font-medium text-zinc-950
      bg-cyan-500 rounded-none pt-2.5 pr-5 pb-2.5 pl-5 shadow-lg">Launch Kreona</a>
  </div>
</div>