Stats Card Row UI

<div class="max-w-7xl mx-auto flex flex-wrap gap-8 w-full justify-center">
        <div
            class="flex-1 min-w-[300px] bg-white p-10 rounded-[3rem] border border-slate-100 shadow-xl shadow-slate-100 transition-transform hover:-translate-y-2">
            <div class="flex items-center gap-4 mb-8">
                <div class="w-12 h-12 bg-indigo-50 text-indigo-600 rounded-2xl flex items-center justify-center">
                    <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z">
                        </path>
                    </svg>
                </div>
                <span class="font-black text-[10px] uppercase tracking-widest text-slate-400">Net Sales</span>
            </div>
            <div class="flex items-end justify-between">
                <h4 class="text-4xl font-black text-slate-900 italic tracking-tighter leading-none">$12,482</h4>
                <div class="text-emerald-500 font-bold text-xs bg-emerald-50 px-3 py-1 rounded-full">+4%</div>
            </div>
        </div>
        <div
            class="flex-1 min-w-[300px] bg-slate-900 p-10 rounded-[3rem] shadow-2xl transition-transform hover:-translate-y-2">
            <div class="flex items-center gap-4 mb-8">
                <div class="w-12 h-12 bg-white/5 text-white rounded-2xl flex items-center justify-center">
                    <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"></path>
                    </svg>
                </div>
                <span class="font-black text-[10px] uppercase tracking-widest text-slate-500">Impressions</span>
            </div>
            <div class="flex items-end justify-between">
                <h4 class="text-4xl font-black text-white italic tracking-tighter leading-none">1.2M</h4>
                <div class="text-indigo-400 font-bold text-xs bg-white/5 px-3 py-1 rounded-full">+18%</div>
            </div>
        </div>
    </div>