@props(['service'])

@if(!empty($service['process']))
@php
    $steps = array_values($service['process']);
    $phaseLabels = [
        __('messages.service_detail.process_phase_strategy'),
        __('messages.service_detail.process_phase_build'),
        __('messages.service_detail.process_phase_launch'),
        __('messages.service_detail.process_phase_grow'),
    ];
@endphp
<section id="process" class="svc-section svc-section--white scroll-mt-24" aria-labelledby="svc-process-heading">
    <div class="site-container svc-process">
        <x-service-detail.section-intro
            class="svc-process__intro"
            :eyebrow="__('messages.service_detail.our_process_section_label')"
            :title="__('messages.service_detail.our_process', ['service' => $service['name']])"
            :description="__('messages.service_detail.our_process_desc')"
            heading-id="svc-process-heading"
        />

        <div class="svc-process__panel svc-reveal"
             style="--process-count: {{ count($steps) }};">
            <ol class="svc-process__steps">
                @foreach($steps as $i => $step)
                @php
                    $phase = trim((string) ($step['phase'] ?? ''));
                    if ($phase === '') {
                        $phase = $phaseLabels[$i] ?? '';
                    }
                @endphp
                <li class="svc-process__step svc-reveal svc-reveal--delay-{{ min($i + 1, 3) }}">
                    <div class="svc-process__step-head">
                        <span class="svc-process__index" aria-hidden="true">{{ str_pad((string) ($i + 1), 2, '0', STR_PAD_LEFT) }}</span>
                        @if($phase !== '')
                        <span class="svc-process__phase">{{ $phase }}</span>
                        @endif
                    </div>
                    <div class="svc-process__step-card">
                        <h3 class="svc-process__step-title">{{ $step['title'] }}</h3>
                        <p class="svc-process__step-body">{{ $step['description'] }}</p>
                        @if(! empty($step['outcome']))
                        <p class="svc-process__step-outcome">{{ $step['outcome'] }}</p>
                        @endif
                    </div>
                </li>
                @endforeach
            </ol>
        </div>
    </div>
</section>
@endif