@php($rows = $block->rows())

@if ($rows)
    <section class="section-tight">
        <div class="container-page">
            @if ($block->heading)
                <h2 class="mb-10 font-display text-headline font-bold text-text" data-reveal>{{ $block->heading }}</h2>
            @endif

            <div class="grid gap-px overflow-hidden rounded-2xl border border-border bg-border sm:grid-cols-2 lg:grid-cols-4"
                 data-reveal-group>
                @foreach ($rows as $row)
                    <div class="bg-surface p-7" data-reveal-child>
                        <p class="font-display text-4xl font-bold tracking-[-0.03em] text-primary">
                            {{ $row['title'] ?? '' }}
                        </p>
                        @if (! empty($row['body']))
                            <p class="mt-2 text-sm text-text-secondary">{{ $row['body'] }}</p>
                        @endif
                    </div>
                @endforeach
            </div>
        </div>
    </section>
@endif