{{-- Professionnels --}}
<section id="professionnels" class="scroll-mt-20 bg-ivoire-2 py-24 lg:py-40">
    <div class="mx-auto grid max-w-[1440px] items-center gap-16 px-5 sm:px-10 lg:grid-cols-12 lg:px-14">
        <div class="lg:col-span-5">
            <p class="kicker mb-5 text-rouge">{{ $home->plain($data['kicker'] ?? '') }}</p>
            <h2 class="font-serif text-[clamp(2.2rem,4.6vw,4.2rem)] leading-[1.02]">{{ $home->rich($data['title'] ?? '') }}</h2>
            <p class="mt-8 max-w-md leading-relaxed text-gris">{{ $home->rich($data['text'] ?? '') }}</p>
            <div class="mt-12 flex flex-wrap items-center gap-x-10 gap-y-6">
                @if (filled($data['primary_label'] ?? null))
                    <a href="{{ $home->url($data['primary_url'] ?? null) }}" class="bouton bouton-plein">{{ $data['primary_label'] }}</a>
                @endif
                @if (filled($data['secondary_label'] ?? null))
                    <a href="{{ $home->url($data['secondary_url'] ?? null) }}" class="lien-filet">{{ $data['secondary_label'] }}</a>
                @endif
            </div>
        </div>

        @if (filled($data['sheet'] ?? null))
            <div class="bg-ivoire p-8 sm:p-14 lg:col-span-6 lg:col-start-7">
                <div class="mb-10 flex items-baseline justify-between gap-4 border-b border-encre pb-6">
                    <p class="font-serif text-3xl italic">{{ $data['sheet_title'] ?? '' }}</p>
                    <p class="kicker text-gris">{{ $data['sheet_subtitle'] ?? '' }}</p>
                </div>
                <dl class="flex flex-col gap-5">
                    @foreach ($data['sheet'] as $row)
                        <div class="ligne-carte">
                            <dt class="font-serif text-lg">{{ $row['label'] ?? '' }}</dt>
                            <dd class="text-sm text-gris tabular-nums">{{ $row['value'] ?? '' }}</dd>
                        </div>
                    @endforeach
                </dl>
                @if (filled($data['sheet_note'] ?? null))
                    <p class="kicker mt-10 text-[0.6rem] text-gris">{{ $data['sheet_note'] }}</p>
                @endif
            </div>
        @endif
    </div>
</section>