Glassmorph Community Card with Stats

<a href="#" class="group relative h-full  max-h-32 w-full max-w-xl overflow-hidden transition hover:bg-white/10 bg-center bg-white/5 bg-[url(https://hoirqrkdgbmvpwutwuwj.supabase.co/storage/v1/object/public/assets/assets/eab297ee-54cd-4050-b3a4-8849a59a4d35_800w.jpg)] bg-cover border-white/10 border rounded-2xl backdrop-blur-xl">
  <div class="absolute inset-0 flex">
    <div class="w-2/6"></div>
    <div class="w-4/6 flex pt-0 pr-0 pb-0 pl-0 items-center justify-center">
      <div class="w-full h-full bg-white/5 border-white/10 border rounded-xl pt-4 pr-5 pb-4 pl-7 backdrop-blur-xl">
        <div class="flex gap-4 items-start">
          <div class="inline-flex size-10 absolute top-12 -left-5 bg-[conic-gradient(from_90deg,var(--tw-gradient-stops))] from-purple-400/20 via-cyan-500/40 to-purple-400/80 border-slate-50/10 border rounded-full pr-3 pl-3 items-center justify-center">
            <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="shapes" class="lucide lucide-shapes size-6 text-sky-200"><path d="M8.3 10a.7.7 0 0 1-.626-1.079L11.4 3a.7.7 0 0 1 1.198-.043L16.3 8.9a.7.7 0 0 1-.572 1.1Z" class=""></path><rect x="3" y="14" width="7" height="7" rx="1" class=""></rect><circle cx="17.5" cy="17.5" r="3.5" class=""></circle></svg>
          </div>
          <div class="min-w-0">
            <h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">3D Art</h3>
            <p class="text-xs text-slate-300/90">A great place to discuss art.</p>
            <div class="mt-3 flex items-center gap-4 text-xs text-slate-300/80">
              <span class="inline-flex items-center gap-1.5">
                <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="users" class="lucide lucide-users size-4 w-[24px] h-[24px]" data-icon-replaced="true" style="width: 16px; height: 16px; color: rgb(203, 213, 225);"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" class=""></path><path d="M16 3.128a4 4 0 0 1 0 7.744" class=""></path><path d="M22 21v-2a4 4 0 0 0-3-3.87" class=""></path><circle cx="9" cy="7" r="4" class=""></circle></svg> 345,678 Members
              </span>
              <span class="inline-flex items-center gap-1.5">
                <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="star" class="lucide lucide-star size-4"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z" class=""></path></svg> Trending
              </span>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</a>