@php
    $stats = \App\Models\Statistic::where('is_published', true)
        ->orderBy('display_order')
        ->get()
        ->map(function ($stat) {
            // Admin enters the whole thing as one free-text string (e.g.
            // "100,000+", "24/7") — split off the leading number so it can
            // still drive the counter animation, keeping the trailing part
            // (+, /7, etc.) as static suffix text exactly as before.
            preg_match('/^([\d,]+)(.*)$/', trim($stat->number), $m);

            return [
                'count' => isset($m[1]) ? (int) str_replace(',', '', $m[1]) : 0,
                'suffix' => $m[2] ?? $stat->number,
                'label' => $stat->name,
                'icon' => $stat->icon,
            ];
        });
@endphp

@if ($stats->isNotEmpty())
    <section class="border-y border-slate-100 bg-white py-14 dark:border-white/10 dark:bg-ink">
        <div class="mx-auto grid max-w-7xl grid-cols-2 gap-8 px-6 lg:grid-cols-4">
            @foreach ($stats as $i => $stat)
                <div class="reveal-scale text-center" style="transition-delay: {{ $i * 100 }}ms">
                    <div class="mx-auto mb-3 grid h-12 w-12 place-items-center rounded-xl bg-primary/10 text-primary dark:bg-secondary/10 dark:text-secondary">
                        <i class="fa-solid {{ $stat['icon'] }}"></i>
                    </div>
                    <p class="font-heading text-3xl font-extrabold text-slate-900 dark:text-white sm:text-4xl">
                        <span class="counter" data-count="{{ $stat['count'] }}">0</span>{{ $stat['suffix'] }}
                    </p>
                    <p class="mt-1 text-sm text-slate-500 dark:text-slate-400">{{ $stat['label'] }}</p>
                </div>
            @endforeach
        </div>
    </section>
@endif