Загрузка...

Секция с карточками статистики и SVG-графиками на Tailwind CSS. Идеально для дашбордов и лендингов SaaS для демонстрации аналитики.
<section id="analytics" class="pt-16 pb-16">
<div class="max-w-7xl sm:px-6 lg:px-8 mr-auto ml-auto pr-4 pl-4">
<div class="text-center mb-10">
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs bg-white/5 border border-white/10 text-gray-300">Analytics</span>
<h2 class="mt-4 text-3xl sm:text-4xl lg:text-5xl tracking-tight" style="font-weight: 600">
Intelligent insights for <span class="italic" style="font-weight: 500">smarter</span> workflows
</h2>
<p class="mt-3 text-gray-300 max-w-3xl mx-auto">
From brand verification to enterprise automation and data-driven growth strategies.
</p>
</div>
<div class="grid gap-6 lg:grid-cols-2">
<!-- Distinguish yourself -->
<div class="relative overflow-hidden bg-black/40 border-white/10 border rounded-2xl pt-6 pr-6 pb-6 pl-6">
<div class="absolute inset-0 pointer-events-none" style="background:
radial-gradient(220px 160px at 10% 0%, rgba(59,130,246,0.25), transparent 60%),
radial-gradient(280px 200px at 100% 100%, rgba(147,197,253,0.08), transparent 70%),
linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00))"></div>
<div class="flex items-start justify-between mb-4">
<div class="">
<h3 class="text-xl sm:text-2xl lg:text-3xl tracking-tight" style="font-weight: 600">Distinguish yourself</h3>
<p class="mt-2 text-sm sm:text-base text-gray-300">Elevate your brand with a golden tick and connect with top‑tier associates.</p>
</div>
<div class="inline-flex items-center gap-1 px-2 py-1 rounded-lg bg-yellow-300/10 border border-yellow-300/20">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="crown" class="lucide lucide-crown w-3 h-3 text-yellow-300"><path d="M11.562 3.266a.5.5 0 0 1 .876 0L15.39 8.87a1 1 0 0 0 1.516.294L21.183 5.5a.5.5 0 0 1 .798.519l-2.834 10.246a1 1 0 0 1-.956.734H5.81a1 1 0 0 1-.957-.734L2.02 6.02a.5.5 0 0 1 .798-.519l4.276 3.664a1 1 0 0 0 1.516-.294z" class=""></path><path d="M5 21h14" class=""></path></svg>
<span class="text-xs font-medium text-yellow-300">Premium</span>
</div>
</div>
<div class="mt-4 rounded-lg bg-white/5 border border-white/10 p-3">
<div class="flex items-center justify-between mb-3">
<p class="text-sm font-medium">Verified Partners</p>
<span class="text-xs px-2 py-1 rounded-md bg-blue-500/10 border border-blue-400/20 text-blue-300">8 Active</span>
</div>
<div class="space-y-3">
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-lg bg-white/5 border border-white/10">
<span class="inline-flex h-7 w-7 items-center justify-center rounded-md bg-blue-500/20 ring-1 ring-white/10 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="layers" class="lucide lucide-layers w-3.5 h-3.5"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z" class=""></path><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12" class=""></path><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17" class=""></path></svg>
</span>
<div class="flex-1 min-w-0">
<span class="text-sm font-medium">LanderX</span>
<p class="text-xs text-gray-400">Design Systems • 2.4k followers</p>
</div>
<div class="flex items-center gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3.5 h-3.5 text-yellow-300 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
<span class="text-xs text-yellow-300 font-medium">Gold</span>
</div>
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-lg bg-white/5 border border-white/10">
<img src="https://images.unsplash.com/photo-1502685104226-ee32379fefbe?q=80&w=80&auto=format&fit=crop" alt="Avatar" class="w-7 h-7 rounded-md object-cover ring-1 ring-white/10 flex-shrink-0">
<div class="flex-1 min-w-0">
<span class="text-sm font-medium">Robinson jr</span>
<p class="text-xs text-gray-400">Product Manager • 1.8k connections</p>
</div>
<div class="flex items-center gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3.5 h-3.5 text-blue-400 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
<span class="text-xs text-blue-400 font-medium">Pro</span>
</div>
</div>
</div>
</div>
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 gap-3">
<div class="rounded-lg bg-white/5 border border-white/10 p-3">
<div class="flex items-center gap-2 mb-2">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-emerald-400"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
<span class="text-xs font-medium">Network Growth</span>
</div>
<p class="text-lg font-semibold text-emerald-400">+127%</p>
<p class="text-xs text-gray-400">vs last month</p>
</div>
<div class="rounded-lg bg-white/5 border border-white/10 p-3">
<div class="flex items-center gap-2 mb-2">
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="users" class="lucide lucide-users w-3.5 h-3.5 text-blue-400"><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>
<span class="text-xs font-medium">Active Partners</span>
</div>
<p class="text-lg font-semibold text-blue-400">24</p>
<p class="text-xs text-gray-400">verified connections</p>
</div>
</div>
</div>
<!-- Enterprise Insights -->
<div class="relative overflow-hidden rounded-2xl border border-white/10 bg-black/40 p-6">
<div class="absolute inset-0 pointer-events-none" style="background:
radial-gradient(220px 160px at 100% 0%, rgba(251,146,60,0.25), transparent 60%),
radial-gradient(260px 180px at 0% 100%, rgba(34,197,94,0.10), transparent 70%),
linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00))"></div>
<h3 class="text-xl sm:text-2xl lg:text-3xl tracking-tight" style="font-weight: 600">Enterprise Insights</h3>
<p class="mt-2 text-sm sm:text-base text-gray-300">Automate everything from workflow optimization to real‑time sentiment analysis and market monitoring.</p>
<div class="mt-5 rounded-xl bg-white/5 border border-white/10 p-4">
<div class="flex flex-wrap items-center gap-2 mb-3">
<div class="inline-flex items-center gap-2 px-2.5 py-1.5 rounded-md bg-black/40 border border-white/10">
<span class="inline-flex h-6 w-6 items-center justify-center rounded bg-orange-500/20 ring-1 ring-white/10 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="flame" class="lucide lucide-flame w-3.5 h-3.5"><path d="M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z" class=""></path></svg>
</span>
<span class="text-xs font-medium">Your Brand</span>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3.5 h-3.5 text-yellow-300 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
</div>
<div class="inline-flex items-center gap-2 px-2.5 py-1.5 rounded-md bg-black/40 border border-white/10">
<img src="https://images.unsplash.com/photo-1531123897727-8f129e1688ce?q=80&w=80&auto=format&fit=crop" alt="Avatar" class="w-6 h-6 rounded ring-1 ring-white/10 flex-shrink-0">
<span class="text-xs font-medium">Robinson jr</span>
</div>
</div>
<div class="mt-3 rounded-lg bg-gradient-to-b from-gray-900/60 to-transparent h-24 border border-white/10 overflow-hidden">
<svg viewBox="0 0 400 96" class="w-full h-full">
<defs class="">
</defs>
<path d="M0 70 C60 30, 120 85, 180 48 S300 70, 400 40" stroke="#818cf8" stroke-width="2" fill="url(#aiGrad)" class=""></path>
</svg>
</div>
</div>
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 gap-2">
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span>Web Business</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span>E‑commerce Brands</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span>SAAS Startup's</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span>Tech Innovators</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span class="">Marketing Agencies</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
<div class="flex items-center justify-between px-3 py-2 rounded-lg bg-white/5 border border-white/10 text-xs">
<span class="">Creative Studios</span>
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-blue-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
</div>
</div>
</div>
<!-- Business Data Solutions -->
<div class="relative overflow-hidden rounded-2xl border border-white/10 bg-black/40 p-6">
<div class="absolute inset-0 pointer-events-none" style="background:
radial-gradient(220px 160px at 8% 100%, rgba(139,92,246,0.25), transparent 60%),
radial-gradient(260px 180px at 100% 0%, rgba(59,130,246,0.10), transparent 70%),
linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00))"></div>
<h3 class="text-xl sm:text-2xl lg:text-3xl tracking-tight" style="font-weight: 600">Business Data Solutions</h3>
<p class="mt-2 text-sm sm:text-base text-gray-300">Your data‑driven guide to making informed business decisions.</p>
<div class="mt-6 relative">
<div class="rounded-xl bg-white/5 border border-white/10 p-4">
<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2 mb-3">
<p class="text-sm font-medium">See Growth</p>
<div class="flex items-center gap-2">
<span class="text-[11px] px-2 py-1 rounded bg-black/40 border border-white/10">Monthly Visits</span>
<span class="text-[11px] px-2 py-1 rounded bg-black/40 border border-white/10">Last 24hrs</span>
</div>
</div>
<div class="mt-3 h-28 rounded-lg bg-gradient-to-b from-gray-900/60 to-transparent border border-white/10 overflow-hidden">
<svg viewBox="0 0 400 112" class="w-full h-full">
<defs class="">
</defs>
<path d="M0 90 C70 40, 140 100, 200 55 S330 90, 400 65" stroke="#34d399" stroke-width="2" fill="url(#growthGrad)" class=""></path>
</svg>
</div>
<div class="mt-3 inline-flex items-center gap-2 px-2.5 py-1.5 rounded-md bg-black/40 border border-white/10">
<span class="inline-flex h-6 w-6 items-center justify-center rounded bg-blue-500/20 ring-1 ring-white/10 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="layers" class="lucide lucide-layers w-3.5 h-3.5"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z" class=""></path><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12" class=""></path><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17" class=""></path></svg>
</span>
<span class="text-xs font-medium">LanderX</span>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3.5 h-3.5 text-yellow-300 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
</div>
</div>
<!-- Floating checklist -->
<div class="mt-6 lg:absolute lg:right-0 lg:bottom-0 lg:translate-x-0 lg:translate-y-6 lg:mt-0 rounded-xl bg-black/60 backdrop-blur border border-white/10 p-4 w-full lg:w-80">
<div class="flex items-center justify-between mb-3">
<p class="text-sm font-medium">See Growth</p>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="chevron-down" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 flex-shrink-0"><path d="m6 9 6 6 6-6" class=""></path></svg>
</div>
<ul class="space-y-2 text-sm text-gray-300">
<li class="flex items-center gap-2">
<span class="inline-flex h-4 w-4 items-center justify-center rounded-[4px] bg-blue-500/20 border border-blue-300/40 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="check" class="lucide lucide-check w-2.5 h-2.5 text-blue-300"><path d="M20 6 9 17l-5-5" class=""></path></svg>
</span>
100% score anytime
</li>
<li class="flex items-center gap-2">
<span class="inline-flex h-4 w-4 items-center justify-center rounded-[4px] bg-blue-500/20 border border-blue-300/40 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="check" class="lucide lucide-check w-2.5 h-2.5 text-blue-300"><path d="M20 6 9 17l-5-5" class=""></path></svg>
</span>
Watch Stats & Growth like master
</li>
<li class="flex items-center gap-2">
<span class="inline-flex h-4 w-4 items-center justify-center rounded-[4px] bg-blue-500/20 border border-blue-300/40 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="check" class="lucide lucide-check w-2.5 h-2.5 text-blue-300"><path d="M20 6 9 17l-5-5" class=""></path></svg>
</span>
Start Growing Now
</li>
</ul>
</div>
</div>
</div>
<!-- Boost Sales -->
<div class="relative overflow-hidden rounded-2xl border border-white/10 bg-black/40 p-6">
<div class="absolute inset-0 pointer-events-none" style="background:
radial-gradient(220px 160px at 100% 100%, rgba(45,212,191,0.25), transparent 60%),
radial-gradient(260px 180px at 0% 0%, rgba(56,189,248,0.08), transparent 70%),
linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00))"></div>
<h3 class="text-xl sm:text-2xl lg:text-3xl tracking-tight" style="font-weight: 600">Boost Sales</h3>
<p class="mt-2 text-sm sm:text-base text-gray-300">Convert more leads with targeted strategies and smarter tools.</p>
<div class="mt-5 rounded-xl bg-white/5 border border-white/10 p-4">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2 text-xs mb-4">
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="chart-bar" class="lucide lucide-chart-bar w-3.5 h-3.5 text-gray-300 flex-shrink-0"><path d="M3 3v16a2 2 0 0 0 2 2h16" class=""></path><path d="M7 16h8" class=""></path><path d="M7 11h12" class=""></path><path d="M7 6h3" class=""></path></svg>
Monthly Visits
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="clock" class="lucide lucide-clock w-3.5 h-3.5 text-gray-300 flex-shrink-0"><path d="M12 6v6l4 2" class=""></path><circle cx="12" cy="12" r="10" class=""></circle></svg>
Last 24hrs
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="repeat" class="lucide lucide-repeat w-3.5 h-3.5 text-gray-300 flex-shrink-0"><path d="m17 2 4 4-4 4" class=""></path><path d="M3 11v-1a4 4 0 0 1 4-4h14" class=""></path><path d="m7 22-4-4 4-4" class=""></path><path d="M21 13v1a4 4 0 0 1-4 4H3" class=""></path></svg>
Retention
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="users" class="lucide lucide-users w-3.5 h-3.5 text-gray-300 flex-shrink-0"><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>
Top Referrals
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="percent" class="lucide lucide-percent w-3.5 h-3.5 text-gray-300 flex-shrink-0"><line x1="19" x2="5" y1="5" y2="19" class=""></line><circle cx="6.5" cy="6.5" r="2.5" class=""></circle><circle cx="17.5" cy="17.5" r="2.5" class=""></circle></svg>
% Conversion
</div>
<div class="inline-flex items-center gap-2 px-3 py-2 rounded-md bg-black/40 border border-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="trending-up" class="lucide lucide-trending-up w-3.5 h-3.5 text-gray-300 flex-shrink-0"><path d="M16 7h6v6" class=""></path><path d="m22 7-8.5 8.5-5-5L2 17" class=""></path></svg>
Grow Income
</div>
</div>
<div class="flex flex-wrap items-center gap-2">
<div class="inline-flex items-center gap-2 px-2.5 py-1.5 rounded-md bg-black/40 border border-white/10">
<span class="inline-flex h-6 w-6 items-center justify-center rounded bg-blue-500/20 ring-1 ring-white/10 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="layers" class="lucide lucide-layers w-3 h-3"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z" class=""></path><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12" class=""></path><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17" class=""></path></svg>
</span>
<span class="text-[11px] font-medium">LanderX</span>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3 h-3 text-yellow-300 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
</div>
<div class="inline-flex items-center gap-2 px-2.5 py-1.5 rounded-md bg-black/40 border border-white/10">
<span class="inline-flex h-6 w-6 items-center justify-center rounded bg-pink-500/20 ring-1 ring-white/10 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="gem" class="lucide lucide-gem w-3 h-3"><path d="M10.5 3 8 9l4 13 4-13-2.5-6" class=""></path><path d="M17 3a2 2 0 0 1 1.6.8l3 4a2 2 0 0 1 .013 2.382l-7.99 10.986a2 2 0 0 1-3.247 0l-7.99-10.986A2 2 0 0 1 2.4 7.8l2.998-3.997A2 2 0 0 1 7 3z" class=""></path><path d="M2 9h20" class=""></path></svg>
</span>
<span class="text-[11px] font-medium">Crystal</span>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="badge-check" class="lucide lucide-badge-check w-3 h-3 text-yellow-300 flex-shrink-0"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" class=""></path><path d="m9 12 2 2 4-4" class=""></path></svg>
</div>
</div>
</div>
</div>
</div>
</div>
</section>