Entretenir : Footer

<div class="booking__footer bg-white pt-9.5 md:pt-14 pb-24">

    <div class="flex gap-2.5 justify-between overflow-y-auto hide-scrollbar px-7 md:px-10">

        <div class="tracking-tightened max-w-[143px] shrink-0">

            <?= icon('punctuality-banner', 'text-primary-accent w-auto h-[30px]'); ?>

            <div class="mt-4.5 font-semibold">Ponctualité</div>

            <div class="mt-1.25 font-medium text-smaller">Nous prenons en charge votre véhicule à l'heure prévue</div>

        </div>

        <div class="tracking-tightened max-w-[143px] shrink-0">

            <?= icon('shield-key', 'text-primary-accent w-auto h-[30px]'); ?>

            <div class="mt-4.5 font-semibold">Devis respecté</div>

            <div class="mt-1.25 font-medium text-smaller">Vous êtes informé du prix des réparations au préalable</div>

        </div>

        <div class="tracking-tightened max-w-[143px] shrink-0">

            <?= icon('transparent', 'text-primary-accent w-auto h-[30px]'); ?>

            <div class="mt-4.5 font-semibold">Transparence</div>

            <div class="mt-1.25 font-medium text-smaller">Nous vous expliquons chaque intervention réalisées</div>

        </div>

        <div class="tracking-tightened max-w-[143px] shrink-0">

            <?= icon('quickness', 'text-primary-accent w-auto h-[30px]'); ?>

            <div class="mt-4.5 font-semibold">Rapides</div>

            <div class="mt-1.25 font-medium text-smaller">Nous limitons au maximum l'immobilisation de votre véhicule</div>

        </div>

        <div class="tracking-tightened max-w-[143px] shrink-0">

            <?= icon('mobility', 'text-primary-accent w-auto h-[30px]'); ?>

            <div class="mt-4.5 font-semibold">Mobilité</div>

            <div class="mt-1.25 font-medium text-smaller">Un véhicule de remplacement peut être mis à votre disposition</div>

        </div>

    </div>

</div>