Responsive Header with Logo, Nav & Action Buttons

<header class="flex gap-4 md:py-4 border-gray-100/60 border-b pt-3 pb-3 items-center justify-between w-full max-w-5xl">
  <div class="flex items-center gap-3">
    <div
      class="w-10 h-10 flex ring-1 ring-indigo-100 bg-indigo-50 bg-[url(https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/309994dc-b445-4320-977f-88a9de7ec26a_320w.jpg)] bg-cover rounded-lg items-center justify-center">

    </div>
    <div class="">
      <div class="text-lg font-semibold tracking-tight text-slate-900">HelioAI</div>
      <div class="text-xs text-slate-500">Conversational automation</div>
    </div>
  </div>

  <nav class="hidden md:flex items-center gap-6 text-sm text-slate-600">
    <a href="#" class="hover:text-slate-900 transition-colors">Overview</a>
    <a href="#" class="hover:text-slate-900 transition-colors">Products</a>
    <a href="#" class="hover:text-slate-900 transition-colors">Integrations</a>
    <a href="#" class="hover:text-slate-900 transition-colors">Customers</a>
    <a href="#" class="hover:text-slate-900 transition-colors">Careers</a>
  </nav>

  <div class="flex items-center gap-3">
    <button id="downloadHtml" class="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-white border border-gray-200 text-sm text-slate-700 shadow-sm hover:bg-gray-50 transition">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="download" class="lucide lucide-download w-4 h-4 text-slate-600"><path d="M12 15V3" class=""></path><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" class=""></path><path d="m7 10 5 5 5-5" class=""></path></svg>
            Export
          </button>
    <button aria-label="Sign in" class="hidden md:inline-flex items-center gap-2 px-4 py-2 rounded-full bg-indigo-600 text-white text-sm hover:bg-indigo-700 transition">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="log-in" class="lucide lucide-log-in w-4 h-4"><path d="m10 17 5-5-5-5" class=""></path><path d="M15 12H3" class=""></path><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4" class=""></path></svg>
            Sign in
          </button>
  </div>
</header>