team

<section>
  <div class="px-8 py-24 mx-auto md:px-12 lg:px-24 max-w-7xl relative">
    <div class="max-w-xl mx-auto text-center lg:text-balance">
      <span
        class="font-mono text-xs font-medium tracking-tight text-blue-600 uppercase"
      >
        tagline</span
      >
      <h1 class="text-4xl mt-4 font-semibold tracking-tight text-gray-900">
        Introducing our team
      </h1>
      <p class="mt-6 text-base font-medium text-gray-500">
        Uniting talent with vision. Get to know the dedicated professionals who
        blend their skills and passion to lead us to new heights.
      </p>
    </div>
    <ul
      role="list"
      class="mt-12 grid sm:grid-cols-2 md:grid-cols-3 text-center lg:divide-x lg:grid-cols-4 lg:border-x lg:mt-24"
    >
      <li class="p-8">
        <div class="flex flex-col gap-4">
          <img
            class="object-cover rounded-full size-16 lg:size-20 mx-auto"
            src="/avatars/1.avif"
            alt="#_"
          />
          <div>
            <h3 class="tracking-tight text-lg font-medium text-gray-900">
              Mike Vega
            </h3>
            <p class="mt-2 text-sm text-gray-500 text-balance">
              Creator of Oxbow UI.com
            </p>
          </div>
        </div>
      </li>
      <li class="p-8">
        <div class="flex flex-col gap-4">
          <img
            class="object-cover rounded-full size-16 lg:size-20 mx-auto"
            src="/avatars/2.avif"
            alt="#_"
          />
          <div>
            <h3 class="tracking-tight text-lg font-medium text-gray-900">
              Juan Echanove
            </h3>
            <p class="mt-2 text-sm text-gray-500 text-balance">
              Founder of Pay Oneeer
            </p>
          </div>
        </div>
      </li>
      <li class="p-8">
        <div class="flex flex-col gap-4">
          <img
            class="object-cover rounded-full size-16 lg:size-20 mx-auto"
            src="/avatars/3.avif"
            alt="#_"
          />
          <div>
            <h3 class="tracking-tight text-lg font-medium text-gray-900">
              Elona Muska
            </h3>
            <p class="mt-2 text-sm text-gray-500 text-balance">
              Founder of Fesla
            </p>
          </div>
        </div>
      </li>
      <li class="p-8">
        <div class="flex flex-col gap-4">
          <img
            class="object-cover rounded-full size-16 lg:size-20 mx-auto"
            src="https://images.unsplash.com/photo-1548142813-c348350df52b?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=989&q=80"
            alt="#_"
          />
          <div>
            <h3 class="tracking-tight text-lg font-medium text-gray-900">
              Messina Lionel
            </h3>
            <p class="mt-2 text-sm text-gray-500 text-balance">
              COO at Pff Inc
            </p>
          </div>
        </div>
      </li>
    </ul>
    <div
      class="flex text-center items-center gap-2 text-gray-500 text-sm mt-8 justify-center"
    >
      We are hiring:
      <a
        href="#_"
        aria-label="Action"
        class="text-blue-500 hover:text-gray-900 text-sm font-medium duration-300 flex items-center gap-2"
      >
        See all our open roles
        <svg
          xmlns="http://www.w3.org/2000/svg"
          width="18"
          height="18"
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
          class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right"
        >
          <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
          <path d="M9 6l6 6l-6 6"></path>
        </svg>
      </a>
    </div>
  </div>
</section>