@php
    $steps = array_values(array_filter($data['steps'] ?? [], fn ($s) => filled($s['title'] ?? null)));
    $image = $url($data['image'] ?? null);
    $order = ($data['image_side'] ?? 'right') === 'left' ? ['media', 'copy'] : ['copy', 'media'];
@endphp
<section class="{{ $cls }}" {{ $attrs }}>
    <div class="container-page">
        <div class="home-split home-split--equal home-split--center">
            @foreach($order as $column)
                @if($column === 'copy')
                    <div class="min-w-0">
                        @include('builder.partials.head', ['centered' => false, 'linkUrl' => null, 'linkText' => null])
                        <ol class="detail-vtrack mt-10">
                            @foreach($steps as $i => $step)
                                <li class="detail-vtrack__item">
                                    <span class="detail-vtrack__num">{{ $i + 1 }}</span>
                                    <div>
                                        <h3 class="detail-vtrack__title">{{ $step['title'] }}</h3>
                                        @if(filled($step['description'] ?? null))
                                            <p class="detail-vtrack__text">{{ $step['description'] }}</p>
                                        @endif
                                    </div>
                                </li>
                            @endforeach
                        </ol>
                    </div>
                @elseif($image !== '')
                    <figure class="detail-frame">
                        <img src="{{ $image }}" alt="{{ ($data['image_alt'] ?? '') ?: ($data['title'] ?? '') }}" width="720" height="480" class="home-editorial-photo" loading="lazy" decoding="async">
                        @if(filled($data['image_caption'] ?? null))
                            <figcaption class="home-figure-caption mt-3">{{ $data['image_caption'] }}</figcaption>
                        @endif
                    </figure>
                @endif
            @endforeach
        </div>
    </div>
</section>