@props([
    'service',
    'heroCards' => [],
])

@php
    $section = $service['ownerObjections'] ?? null;
    $items = is_array($section['items'] ?? null) ? array_values($section['items']) : [];
    $slug = (string) ($service['slug'] ?? '');
    $sectionImages = $slug === 'website-development' ? [
        [
            'image' => 'images/portfolio/promoto-service/ui-design.webp',
            'title' => 'Website UI design by Criazo',
        ],
        [
            'image' => 'images/portfolio/renting-algarve/mobile-first-design-developed-by-criazo-for-renting-algarve.webp',
            'title' => 'Mobile website design by Criazo',
        ],
        [
            'image' => 'images/portfolio/zaplead/marketing-website-design-developed-by-criazo-for-zaplead.webp',
            'title' => 'Marketing website design by Criazo',
        ],
        [
            'image' => 'images/portfolio/demace/customization-workflows-developed-by-criazo-for-demace.webp',
            'title' => 'Website product workflow by Criazo',
        ],
    ] : [];
    $cards = count($sectionImages) > 0 ? $sectionImages : array_values($heroCards ?? []);
@endphp

@if($section && count($items) > 0)
<section class="svc-section svc-section--white svc-owner-objections" aria-labelledby="svc-owner-objections-heading">
    <div class="site-container">
        <x-service-detail.section-intro
            class="svc-owner-objections__intro"
            :eyebrow="$section['eyebrow'] ?? null"
            :title="$section['heading'] ?? ''"
            :description="$section['description'] ?? null"
            heading-id="svc-owner-objections-heading"
        />

        <div class="svc-owner-objections__rows">
            @foreach($items as $i => $item)
            @php
                $image = $cards[$i % max(count($cards), 1)]['image'] ?? null;
                $imageAlt = $cards[$i % max(count($cards), 1)]['title'] ?? ($item['title'] ?? '');
            @endphp
            <article class="svc-owner-objections__row svc-reveal {{ $i % 2 === 1 ? 'svc-owner-objections__row--reverse' : '' }}">
                <div class="svc-owner-objections__copy">
                    <h3 class="svc-owner-objections__title">{{ $item['title'] ?? '' }}</h3>
                    <p class="svc-owner-objections__text">{{ $item['text'] ?? '' }}</p>
                </div>

                <div class="svc-owner-objections__visual" aria-hidden="{{ $image ? 'false' : 'true' }}">
                    @if($image)
                    <img src="{{ asset(ltrim($image, '/')) }}"
                         alt="{{ $imageAlt }}"
                         loading="lazy"
                         decoding="async">
                    @else
                    <div class="svc-owner-objections__visual-fallback"></div>
                    @endif
                </div>
            </article>
            @endforeach
        </div>
    </div>
</section>
@endif