@php($d = $d ?? [])
<section class="vs-section vs-products" id="shop">
    <div class="vs-container">
        <div class="vs-head" data-aos="fade-up">
            <h2 class="vs-h2">{{ $d['heading'] ?? 'Shop' }}</h2>
            @if(!empty($d['subheading']))<p class="vs-lead">{{ $d['subheading'] }}</p>@endif
        </div>
        <div class="vs-product-grid">
            @foreach(($d['items'] ?? []) as $i => $p)
                <div class="vs-product" data-aos="fade-up" data-aos-delay="{{ ($i % 4) * 70 }}">
                    <div class="vs-product-media">
                        @if(!empty($p['badge']))<span class="vs-product-badge">{{ $p['badge'] }}</span>@endif
                        @if(!empty($p['image']))<img src="{{ $p['image'] }}" alt="{{ $p['name'] ?? '' }}" loading="lazy">@else<div class="vs-product-ph"><i class="fas fa-bag-shopping"></i></div>@endif
                        <button type="button" class="vs-product-cart" aria-label="Add to cart"><i class="fas fa-cart-plus"></i></button>
                    </div>
                    <div class="vs-product-body">
                        <div class="vs-product-stars"><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i></div>
                        <h3 class="vs-product-name">{{ $p['name'] ?? '' }}</h3>
                        <div class="vs-product-price">
                            <strong>{{ $p['price'] ?? '' }}</strong>
                            @if(!empty($p['old_price']))<span class="vs-product-old">{{ $p['old_price'] }}</span>@endif
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</section>
