---
---

<header class="sticky top-0 z-50 w-full bg-[#181611] border-b border-[#393328]">
  <div class="max-w-[1440px] mx-auto px-4 sm:px-10 py-3 flex items-center justify-between">
    <div class="flex items-center gap-4 text-white">
      <div class="size-8 flex items-center justify-center text-primary">
        <span class="material-symbols-outlined text-3xl">local_shipping</span>
      </div>
      <h2 class="text-white text-xl font-bold leading-tight tracking-[-0.015em] uppercase">HimTransService</h2>
    </div>
    <div class="hidden lg:flex flex-1 justify-end gap-8">
      <div class="flex items-center gap-9">
        <a class="text-white hover:text-primary transition-colors text-sm font-medium uppercase tracking-wider" href="#">Компания</a>
        <a class="text-white hover:text-primary transition-colors text-sm font-medium uppercase tracking-wider" href="#">Автопарк</a>
        <a class="text-primary text-sm font-bold uppercase tracking-wider underline decoration-2 underline-offset-4" href="#">Проекты</a>
        <a class="text-white hover:text-primary transition-colors text-sm font-medium uppercase tracking-wider" href="#">Контакты</a>
      </div>
      <button class="flex cursor-pointer items-center justify-center overflow-hidden rounded-sm h-10 px-6 bg-primary hover:bg-yellow-500 transition-colors text-[#181611] text-sm font-bold uppercase tracking-wide">
        <span class="truncate">Расчет стоимости</span>
      </button>
    </div>
    <!-- Mobile Menu Icon -->
    <button class="lg:hidden text-white">
      <span class="material-symbols-outlined">menu</span>
    </button>
  </div>
</header>