@props(['section' => [], 'reverse' => false])
@php
  $reverseFlag = $reverse || !empty($section['reverse']);
@endphp
<div class="cms-split {{ $reverseFlag ? 'cms-split-reverse' : '' }}" @if(!empty($section['anchor'])) id="{{ $section['anchor'] }}" @endif>
  <div class="cms-reveal">
    @if(!empty($section['eyebrow']))
      <p class="home-eyebrow">{{ $section['eyebrow'] }}</p>
    @endif
    <h3 class="home-section-title home-section-title-wide" style="margin-top:.55rem;">{{ $section['title'] }}</h3>
    @if(!empty($section['body']))
      <p class="home-body">{{ $section['body'] }}</p>
    @endif
    @if(!empty($section['checklist']))
      <ul class="cms-split-checklist">
        @foreach($section['checklist'] as $item)
          <li>{{ $item }}</li>
        @endforeach
      </ul>
    @endif
  </div>
  @if(!empty($section['image']))
    <div class="cms-split-media cms-reveal cms-reveal-delay-2">
      <img src="{{ $section['image'] }}" alt="{{ $section['title'] ?? '' }}" loading="lazy" width="1200" height="900">
    </div>
  @endif
</div>