{{-- KPI labels + numbers via translations — order for RTL strip: Student → Certificates → Courses → Countries. --}}
@php
    $statItems = [
        ['icon' => 'fa-user-graduate', 'number' => trans('home.premium_kpi_display_students'), 'label' => trans('home.premium_stat_students')],
        ['icon' => 'fa-certificate', 'number' => trans('home.premium_kpi_display_certificates'), 'label' => trans('home.premium_stat_certificates')],
        ['icon' => 'fa-layer-group', 'number' => trans('home.premium_kpi_display_courses'), 'label' => trans('home.premium_stat_courses')],
        ['icon' => 'fa-globe', 'number' => trans('home.premium_kpi_display_countries'), 'label' => trans('home.premium_stat_countries')],
    ];
@endphp

<section class="premium-stats-strip">
    <div class="container premium-stats-strip__container py-5">
        <div class="premium-stats-strip__panel">
            <div class="premium-stats-strip__gold-rule" aria-hidden="true"></div>
            <div class="premium-stats-strip__vignette" aria-hidden="true"></div>
            <div class="premium-stats-strip__layout">
                <div class="premium-stats-strip__kpis">
                    @foreach ($statItems as $item)
                        <div class="premium-stats-item">
                            <div class="premium-stats-item__ico" aria-hidden="true">
                                <span class="premium-stats-item__ico-ring"></span>
                                <i class="fa {{ $item['icon'] }}"></i>
                            </div>
                            <div class="premium-stats-item__number">{{ $item['number'] }}</div>
                            <div class="premium-stats-item__label">{{ $item['label'] }}</div>
                        </div>
                    @endforeach
                </div>
                <div class="premium-stats-strip__divider" aria-hidden="true"></div>
                <div class="premium-stats-strip__brand">
                    <div class="premium-stats-strip__emblem" aria-hidden="true">
                        <svg class="premium-stats-strip__emblem-svg" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
                            <circle cx="60" cy="60" r="56" fill="none" stroke="rgba(253, 236, 168, 0.35)" stroke-width="1"/>
                            <circle cx="60" cy="60" r="50" fill="none" stroke="rgba(237, 201, 103, 0.5)" stroke-width="1"/>
                            <circle cx="60" cy="60" r="43" fill="none" stroke="rgba(232, 198, 104, 0.85)" stroke-width="1.25"/>
                            <circle cx="60" cy="60" r="36" fill="rgba(201, 160, 80, 0.12)" stroke="rgba(253, 236, 168, 0.45)" stroke-width="1"/>
                            {{-- Regular 5‑point star centered at (60,60); Ro≈19.5, Ri≈Ro×sin(18°)/(1+cos(18°))≈7.448 --}}
                            <path fill="url(#ps-gold-star)" stroke="rgba(138, 106, 44, 0.55)" stroke-width="0.5" stroke-linejoin="round"
                                  d="M60 40.5L64.38 53.97L78.55 53.97L67.09 62.43L71.46 75.76L60 67.45L48.54 75.76L52.92 62.43L41.46 53.97L55.62 53.97Z"/>
                            <defs>
                                <linearGradient id="ps-gold-star" x1="40" y1="38" x2="82" y2="78" gradientUnits="userSpaceOnUse">
                                    <stop stop-color="#fef6d9"/>
                                    <stop offset="0.42" stop-color="#edc967"/>
                                    <stop offset="1" stop-color="#a67c1a"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </div>
                    <div class="premium-stats-strip__brand-text">
                        <p class="premium-stats-strip__brand-headline">{{ trans('home.premium_stats_quality_headline') }}</p>
                        <p class="premium-stats-strip__brand-sub">{{ trans('home.premium_stats_quality_sub') }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
