Team Collaboration Card with Avatar Stack

<article class="relative ring-1 ring-neutral-200 sm:p-8 flex flex-col hover:-translate-y-0.5 transition-transform duration-200 bg-white rounded-3xl pt-5 pr-5 pb-5 pl-5 max-w-xl">
      <div class="flex items-center gap-3 mb-4">
        
        <span class="inline-flex items-center gap-2 rounded-full bg-amber-400/10 text-amber-600 text-xs px-2.5 py-1">
          <span class="h-1.5 w-1.5 rounded-full bg-amber-400"></span>
          Collaboration Hub
        </span>
      </div>
      <h3 class="text-2xl sm:text-3xl font-semibold tracking-tight text-neutral-900 leading-tight mb-4">Team Collaboration</h3>
      <p class="text-neutral-600 text-base leading-relaxed mb-6 flex-1">Streamline teamwork with unified workspaces, real-time collaboration, and intelligent project management.</p>

      <!-- Team member stack -->
      <div class="mt-auto relative">
        
        <div class="absolute inset-x-6 -top-1.5 h-12 rounded-xl bg-zinc-100/60 ring-1 ring-neutral-200"></div>
        <div class="relative">
          <div class="flex items-center gap-3 rounded-2xl bg-zinc-100 ring-1 ring-neutral-200 p-4">
            <div class="flex -space-x-2">
              <img src="https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/096dab35-ecaf-418f-a932-5b514543b035_320w.jpg" alt="Team member" class="h-8 w-8 ring-2 ring-white object-cover rounded-full" style="">
              <img src="https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/fc935cb1-ef8c-4e13-8bce-c3fd8e402f63_320w.jpg" alt="Team member" class="h-8 w-8 ring-2 ring-white object-cover rounded-full" style="">
              <div class="h-8 w-8 rounded-full bg-neutral-200 ring-2 ring-white flex items-center justify-center">
                <span class="text-xs font-medium text-neutral-600">+3</span>
              </div>
            </div>
            <div class="min-w-0 flex-1">
              <p class="text-neutral-900 font-medium tracking-tight text-sm">Team Alpha</p>
              <p class="text-xs text-neutral-600">5 active projects • Online</p>
            </div>
            <div class="h-2 w-2 rounded-full bg-emerald-400"></div>
          </div>
        </div>
      </div>
    </article>