{{ template "headersMenu.html" . }}

<section class="table relative pt-36 w-full bg-center bg-no-repeat bg-cover">
    <div class="container relative">
        <div class="flex">
            <div class="p-6 my-6 bg-gray-50 shadow-md lg:w-1/3 md:1/2 sm:w-2/3 dark:shadow-gray-800 dark:bg-slate-900">
                <h4 class="mb-4 md:text-[28px]] text-2xl leading-normal font-bold text-indigo-600">{{ "La carte de visite des" | t }} <span class="text-indigo-600 typewrite" data-period="2000" data-type='[ "consultants", "agents immobilier", "coachs", "artistes", "ingénieurs", "taxis", "ergonomes", "influenceurs" ]'> <span class="wrap"></span> </span>.</h4>
                <h4 class="mb-4 md:text-[28px]] text-2xl leading-normal font-bold">{{ "100% à vos couleurs." | t }}</h4>
                <p class="mb-0 text-md">{{ "Toute votre vie professionnelle numérique partagée en un seul lien." | t }}</p>
            </div>
            <div class="hidden text-right lg:w-2/3 md:1/2 sm:w-1/3 md:block w-100">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://player.vimeo.com/video/822459487?h=d8d2df5ef3&autoplay=1&title=0&byline=0&portrait=0&player_id=0&app_id=58479" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe></div>
                <script src="https://player.vimeo.com/api/player.js"></script>
            </div>
            
        </div>
        
</section>
<section class="overflow-hidden relative pt-36 pb-36 md:pt-24 md:pb-24">

    

    <div class="container pb-24">

        <div class="grid lg:grid-cols-12 md:grid-cols-12 grid-cols-1 mt-8 gap-[30px] items-center">
            <div class="order-2 lg:col-span-4 md:col-span-6 lg:order-1">
                <div class="grid grid-cols-1 gap-[30px]">
                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex order-1 justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out md:order-2 bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="monitor" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 order-2 md:order-1 ltr:md:text-right rtl:md:text-left ltr:md:mr-4 rtl:md:ml-4 ltr:md:ml-0 rtl:md:mr-0 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">{{ "Accessible partout" | t }}</h4>
                            <p class="mt-3 text-slate-400">{{ "Une webapp sans application à installer, partageable en un clic" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->

                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex order-1 justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out md:order-2 bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="feather" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 order-2 md:order-1 ltr:md:text-right rtl:md:text-left ltr:md:mr-4 rtl:md:ml-4 ltr:md:ml-0 rtl:md:mr-0 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">{{ "Personnalisation totale" | t }}</h4>
                            <p class="mt-3 text-slate-400">{{ "Totalement à vos couleurs, nous n'apparaissons pas sur vos cartes" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->

                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex order-1 justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out md:order-2 bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="eye" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 order-2 md:order-1 ltr:md:text-right rtl:md:text-left ltr:md:mr-4 rtl:md:ml-4 ltr:md:ml-0 rtl:md:mr-0 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">{{ "Sécurité avancée" | t }}</h4>
                            <p class="mt-3 text-slate-400">{{ "Gardez une visibilité sur qui a accès à quoi" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->
                </div>
            </div>

            <div class="order-1 lg:col-span-4 md:col-span-12 lg:mx-8 lg:order-2">
                <img src="https://cardlandingfr.rough.pm/assets/images/image13.png?v=0bca937c" class="mx-auto md:max-w-[300px]" alt="">
            </div>

            <div class="order-3 lg:col-span-4 md:col-span-6">
                <div class="grid grid-cols-1 gap-[30px]">

                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="smartphone" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">Mobile-first</h4>
                            <p class="mt-3 text-slate-400">{{ "Nos interfaces sont pensées mobilité et ressources préservées" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->

                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="heart" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">{{ "Suivi de déploiement" | t }}</h4>
                            <p class="mt-3 text-slate-400">{{ "Suivez vos publications et livraisons depuis votre interface" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->
                    <div class="flex transition-all duration-500 ease-in-out group xl:p-3">
                        <div class="flex justify-center items-center mt-1 w-14 h-14 text-2xl text-indigo-600 align-middle rounded-full shadow-sm transition-all duration-500 ease-in-out bg-indigo-600/5 group-hover:bg-indigo-600 group-hover:text-white dark:shadow-gray-800">
                            <i data-feather="user-check" class="w-5 h-5"></i>
                        </div>
                        <div class="flex-1 ltr:ml-4 rtl:mr-4">
                            <h4 class="mb-0 text-lg font-medium">{{ "Gestion des droits" | t }}</h4>
                            <p class="mt-3 text-slate-400">{{ "Nos outils sont accessibles dès le deuxième utilisateur activé" | t }}</p>
                        </div>
                    </div>
                    <!--end feature-->
                </div>
            </div>
        </div>
        
    </div>
    
    <div class="container">
        <div class="grid md:grid-cols-2 grid-cols-1 items-center gap-[30px]">
            <div class="relative order-1 md:order-2">
                <div class="grid grid-cols-12 gap-4 items-center lg:gap-0">
                    <div class="col-span-6">
                        <div class="grid grid-cols-1 gap-4 lg:gap-6">
                            <img src="/cdn/gui/assets/images/notification.jpg" class="shadow rounded-md lg:max-w-[240px] mx-auto" alt="">
                            <img src="/cdn/gui/assets/images/about/ab02.jpg" class="shadow rounded-md lg:max-w-[240px] mx-auto" alt="">
                        </div>
                    </div>

                    <div class="col-span-6">
                        <div class="grid grid-cols-1">
                            <img src="/cdn/gui/assets/images/about/ab01.jpg" class="shadow rounded-md lg:max-w-[240px] mx-auto" alt="">
                        </div>
                    </div>
                </div>
                <div class="overflow-hidden absolute md:h-[500px] h-[400px] md:w-[500px] w-[400px] bg-gradient-to-tl to-indigo-600/20 via-indigo-600/70 from-indigo-600 bottom-1/2 translate-y-1/2 ltr:md:left-0 ltr:left-1/2 ltr:md:translate-x-0 ltr:-translate-x-1/2 rtl:md:right-0 rtl:right-1/2 rtl:md:translate-x-0 rtl:translate-x-1/2 -z-1 shadow-md shadow-indigo-600/10 rounded-full"></div>

                <div class="flex absolute bottom-0 justify-between items-center m-3 w-48 rounded-lg shadow-md md:bottom-16 ltr:right-5 rtl:left-5 dark:shadow-gray-800 lg:w-72">
                    <img src="/cdn/gui/assets/images/sales-chart.jpg" class="rounded-lg shadow dark:shadow-gray-800" alt="">
                </div>
            </div>

            <div class="order-2 ltr:lg:mr-8 rtl:lg:ml-8 md:order-1">
                <div id="accordion-collapseone" data-accordion="collapse" class="mt-6">
                    <div class="overflow-hidden relative rounded-md border border-indigo-600 shadow dark:shadow-gray-900">
                        <h2 class="text-base font-semibold" id="accordion-collapse-heading-1">
                            <button type="button" class="flex justify-between items-center p-5 w-full text-xl font-bold ltr:text-left rtl:text-right" data-accordion-target="#accordion-collapse-body-1" aria-expanded="true" aria-controls="accordion-collapse-body-1">
                                <span>{{ "Carte de visite" | t }}</span>
                                <svg data-accordion-icon class="w-4 h-4 rotate-180 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
                                </svg>
                            </button>
                        </h2>
                        <div id="accordion-collapse-body-1" class="hidden" aria-labelledby="accordion-collapse-heading-1">
                            <div class="px-5">
                                <div class="pb-5 text-sm">
                                    <li>{{ "La carte de visite est un lien internet, aucune installation d'application n'est nécessaire." | t }}</li>
                                    <li>{{ "Elle est partageable de façon illimitée par SMS, email, WhatsApp, QR code, Apple AirDrop, Messenger, Signal, Telegram..." | t }}</li>
                                    <li>{{ "Elle fonctionne sur l'ensemble des navigateurs web, mobiles comme fixes. La carte et sa gestion ne nécessitent aucune installation d’application sur vos terminaux." | t }}</li>
                                    <li>{{ "Il est possible de créer un raccourci sur votre téléphone afin de retrouver votre carte à portée de clic lors de vos rendez-vous, after-works, salons... Ce raccourci ressemble aux applications de votre téléphone, et son icône est personnalisable." | t }}</li>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="overflow-hidden relative mt-4 rounded-md border border-indigo-600 shadow dark:shadow-gray-900">
                        <h2 class="text-base font-semibold" id="accordion-collapse-heading-2">
                            <button type="button" class="flex justify-between items-center p-5 w-full text-xl font-bold ltr:text-left rtl:text-right" data-accordion-target="#accordion-collapse-body-2" aria-expanded="false" aria-controls="accordion-collapse-body-2">
                                <span>{{ "Signature d'email" | t }}</span>
                                <svg data-accordion-icon class="w-4 h-4 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
                                </svg>
                            </button>
                        </h2>
                        <div id="accordion-collapse-body-2" class="hidden" aria-labelledby="accordion-collapse-heading-2">
                            <div class="px-5">
                                <div class="pb-5 text-sm">
                                    <li>{{ "La carte de visite est un lien internet, aucune installation d'application n'est nécessaire." | t }}</li>
                                    <li>{{ "Elle est partageable de façon illimitée par SMS, email, WhatsApp, QR code, Apple AirDrop, Messenger, Signal, Telegram..." | t }}</li>
                                    <li>{{ "Elle fonctionne sur l'ensemble des navigateurs web, mobiles comme fixes. La carte et sa gestion ne nécessitent aucune installation d’application sur vos terminaux." | t }}</li>
                                    <li>{{ "Il est possible de créer un raccourci sur votre téléphone afin de retrouver votre carte à portée de clic lors de vos rendez-vous, after-works, salons... Ce raccourci ressemble aux applications de votre téléphone, et son icône est personnalisable."| t }}</li>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="overflow-hidden relative mt-4 rounded-md border border-indigo-600 shadow dark:shadow-gray-900">
                        <h2 class="text-base font-semibold" id="accordion-collapse-heading-3">
                            <button type="button" class="flex justify-between items-center p-5 w-full text-xl font-bold ltr:text-left rtl:text-right" data-accordion-target="#accordion-collapse-body-3" aria-expanded="false" aria-controls="accordion-collapse-body-3">
                                <span>Visuels et fonds d'écran visio</span>
                                <svg data-accordion-icon class="w-4 h-4 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
                                </svg>
                            </button>
                        </h2>
                        <div id="accordion-collapse-body-3" class="hidden" aria-labelledby="accordion-collapse-heading-3">
                            <div class="px-5">
                                <div class="pb-5 text-sm">
                                    <li>La carte de visite est un lien internet, aucune installation d'application n'est nécessaire.</li>
                                    <li>Elle est partageable de façon illimitée par SMS, email, WhatsApp, QR code, Apple AirDrop, Messenger, Signal, Telegram...</li>
                                    <li>Elle fonctionne sur l'ensemble des navigateurs web, mobiles comme fixes.
                                        La carte et sa gestion ne nécessitent aucune installation d’application sur vos terminaux.</li>
                                    <li>Il est possible de créer un raccourci sur votre téléphone afin de retrouver votre carte à portée de clic lors de vos rendez-vous, after-works, salons... Ce raccourci ressemble aux applications de votre téléphone, et son icône est personnalisable.</li>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="overflow-hidden relative mt-4 rounded-md border border-indigo-600 shadow dark:shadow-gray-900">
                        <h2 class="text-base font-semibold" id="accordion-collapse-heading-4">
                            <button type="button" class="flex justify-between items-center p-5 w-full text-xl font-bold ltr:text-left rtl:text-right" data-accordion-target="#accordion-collapse-body-4" aria-expanded="false" aria-controls="accordion-collapse-body-4">
                                <span>QR-Code</span>
                                <svg data-accordion-icon class="w-4 h-4 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
                                </svg>
                            </button>
                        </h2>
                        <div id="accordion-collapse-body-4" class="hidden" aria-labelledby="accordion-collapse-heading-4">
                            <div class="px-5">
                                <div class="pb-5 text-sm">
                                    <li>La carte de visite est un lien internet, aucune installation d'application n'est nécessaire.</li>
                                    <li>Elle est partageable de façon illimitée par SMS, email, WhatsApp, QR code, Apple AirDrop, Messenger, Signal, Telegram...</li>
                                    <li>Elle fonctionne sur l'ensemble des navigateurs web, mobiles comme fixes.
                                        La carte et sa gestion ne nécessitent aucune installation d’application sur vos terminaux.</li>
                                    <li>Il est possible de créer un raccourci sur votre téléphone afin de retrouver votre carte à portée de clic lors de vos rendez-vous, after-works, salons... Ce raccourci ressemble aux applications de votre téléphone, et son icône est personnalisable.</li>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
    </div>
    



    <div class="container mt-16 md:mt-24">
        <div class="grid md:grid-cols-2 grid-cols-1 items-center mt-16 gap-[30px]">
            <div class="relative">
                <img src="https://next.card.pm/assets/card.pm/landings/home/images/image04.jpg" class="mx-auto" alt="">


                <div class="absolute top-4 text-center ltr:-right-2 ltr:md:right-14 rtl:-left-2 rtl:md:left-14">
                    <a href="#!" data-type="youtube" data-id="T9Kn3XpBymU" data-autoplay="true" class="inline-flex justify-center items-center w-20 h-20 text-white bg-indigo-600 rounded-full shadow-md lightbox dark:shadow-gyay-700">
                        <i class="inline-flex justify-center items-center text-2xl mdi mdi-play"></i>
                    </a>
                </div>
                <div class="absolute bottom-1/2 p-4 m-3 w-52 bg-white rounded-lg shadow-md translate-y-1/2 ltr:lg:-right-7 ltr:-right-5 rtl:lg:-left-7 rtl:-left-5 dark:shadow-gray-800 dark:bg-slate-900">
                    <div class="">
                        <div class="text-center min-w-[75px]">
                            <span class="text-2xl font-bold">4.90</span>
                            <ul class="mb-0 text-xs list-none text-amber-400">
                                <li class="inline"><i class="mdi mdi-star"></i></li>
                                <li class="inline"><i class="mdi mdi-star"></i></li>
                                <li class="inline"><i class="mdi mdi-star"></i></li>
                                <li class="inline"><i class="mdi mdi-star"></i></li>
                                <li class="inline"><i class="mdi mdi-star"></i></li>
                            </ul>
                        </div>

                        <span class="block mt-2 text-sm ltr:ml-3 rtl:mr-3">{{ "Les avis client peuvent être automatiquement insérés dans votre carte" | t }}</span>
                    </div>
                </div>

                <div class="flex absolute bottom-16 justify-between items-center p-4 m-3 w-56 bg-white rounded-lg shadow-md ltr:md:left-10 ltr:-left-2 rtl:md:right-10 rtl:-right-2 dark:shadow-gray-800 dark:bg-slate-900">
                    <div class="flex items-center">
                        <img src="/cdn/gui/assets/images/client/01.jpg" class="w-14 h-14 rounded-full shadow-md dark:shadow-gray-800 ltr:mr-3 rtl:ml-3" alt="">
                        <div class="flex-1">
                            <h6 class="text-lg font-semibold">{{ "Équipes" | t }}</h6>
                            <p class="text-sm">{{ "Le manager peut gérer les droits de l'utilisatrice." | t }}</p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="ltr:lg:ml-8 rtl:lg:mr-8">
                <h4 class="mb-4 text-2xl font-semibold leading-normal md:text-3xl lg:leading-normal">{{ "Une interface pour tout modifier à votre guise, à tout moment" | t }}</h4>
                <p class="text-slate-400">{{ "Due to its widespread use as filler text for layouts, non-readability is of great importance: human perception is tuned to recognize certain patterns and repetitions in texts. If the distribution of letters visual impact." | t }}</p>
                <ul class="mt-4 list-none text-slate-400">
                    <li class="flex mb-1"><i class="text-xl text-indigo-600 uil uil-check-circle ltr:mr-2 rtl:ml-2"></i> {{ "Digital Marketing Solutions for Tomorrow" | t }}</li>
                    <li class="flex mb-1"><i class="text-xl text-indigo-600 uil uil-check-circle ltr:mr-2 rtl:ml-2"></i> {{ "Our Talented & Experienced Marketing Agency" | t }}</li>
                    <li class="flex mb-1"><i class="text-xl text-indigo-600 uil uil-check-circle ltr:mr-2 rtl:ml-2"></i> {{ "Create your own skin to match your brand" | t }}</li>
                </ul>

                <div class="mt-4">
                    <a href="/cdn/gui/page-aboutus.html" class="text-indigo-600 duration-500 ease-in-out btn btn-link hover:text-indigo-600 after:bg-indigo-600">{{ "Find Out More" | t }} <i class="align-middle uil uil-angle-right-b"></i></a>
                </div>
            </div>
        </div>
        
    </div>
    

    <div class="container pb-16 mt-24">
        <div class="grid md:grid-cols-2 grid-cols-1 items-center mt-16 gap-[30px]">
            <div class="relative">
                <div class="relative">
                    <img src="https://next.card.pm/assets/card.pm/landings/home/images/image06.png" class="mx-auto rounded-lg shadow-md md:max-w-xs lg:max-w-sm dark:shadow-gray-800" alt="">

                    <div class="absolute top-4 text-center ltr:-right-2 ltr:md:right-14 rtl:-left-2 rtl:md:left-14">
                        <a href="#!" data-type="youtube" data-id="fLYiYc_jo_s" data-autoplay="true" class="inline-flex justify-center items-center w-20 h-20 text-white bg-indigo-600 rounded-full shadow-md lightbox dark:shadow-gyay-700">
                            <i class="inline-flex justify-center items-center text-2xl mdi mdi-play"></i>
                        </a>
                    </div>
                </div>
                <div class="overflow-hidden absolute md:h-[500px] h-[400px] md:w-[500px] w-[400px] bg-gradient-to-tr to-indigo-600/20 via-indigo-600/70 from-indigo-600 bottom-1/2 translate-y-1/2 md:right-0 right-1/2 md:translate-x-0 translate-x-1/2 -z-1 shadow-md shadow-indigo-600/10 rounded-full"></div>

                <div class="absolute bottom-16 bottom-1/2 p-4 m-3 w-48 bg-white rounded-lg shadow-md translate-y-1/2 ltr:md:-left-10 ltr:-left-5 rtl:md:-rtl-10 rtl:-rtl-5 dark:shadow-gray-800 dark:bg-slate-900">
                    <div class="flex justify-between mt-0 mb-2">
                        <span class="mb-0 text-lg font-semibold">{{ "Déploiement..." | t }}</span>
                        <span class="text-indigo-600">84%</span>
                    </div>
                    <div class="w-full bg-gray-100 dark:bg-gray-800 rounded-full h-[6px]">
                        <div class="bg-indigo-600 h-[6px] rounded-full" style="width: 84%"></div>
                    </div>
                </div>
            </div>

            <div class="ltr:lg:ml-8 rtl:lg:mr-8">
                <h4 class="mb-4 text-2xl font-semibold leading-normal md:text-3xl lg:leading-normal">{{ "Mais au fait, pourquoi abandonner sa carte papier ?" | t }}</h4>
                <p class="mb-6 text-md md:text-lg">{{ "La carte de visite numérique présente plusieurs avantages par rapport à la carte de visite traditionnelle en papier : moins d'impact environnemental (pas d'impression), informations toujours à jour, partage de coordonnées n'importe où dans le monde, et possibilité de partager des informations supplémentaires (site web, profil LinkedIn)." | t }}</p>

                <div class="flex items-center pt-6 border-t dark:border-gray-700">
                    <img src="https://card.pm/cdn/u/card/tof-58a6b94475b979c1071cc2f29151230d.png?v=1676273989" class="w-20 h-20 rounded-full shadow-md dark:shadow-gray-800 ltr:mr-3 rtl:ml-3" alt="">
                    <div class="flex-1">
                        <div class="relative p-6 m-2 bg-white rounded shadow content dark:shadow-gray-800 dark:bg-slate-900">
                            <i class="mdi mdi-format-quote-open mdi-48px"></i>
                            <p class="text-lg">{{ "toujours à la pointe depuis 4 ans a chaque changement je n'ai rien à faire les mises à jours juridique se font automatiquement un plaisir de ne plus s'en soucier." | t }}</p>
                            <p class="text-sm font-semibold">{{ "Pascal L., agent immobilier indépendant" | t }}</p>

                            <ul class="mt-3 mb-0 list-none text-amber-400">
                                <li class="inline"><i class="mdi mdi-star"></i></li>

                                <li class="inline"><i class="mdi mdi-star"></i></li>


                                <li class="inline"><i class="mdi mdi-star"></i></li>


                                <li class="inline"><i class="mdi mdi-star"></i></li>


                                <li class="inline"><i class="mdi mdi-star"></i></li>

                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
    </div>
    

    <div class="container mt-16 md:mt-24">
        <div class="grid grid-cols-1 text-center">
            <div class="mb-6 uppercase">
                <a href="/pricing" class="mt-4 text-white bg-indigo-600 rounded-md border-emerald-600 btn hover:bg-indigo-600 hover:border-emerald-600">{{ "Accéder à la tarification" | t }} </a>
                <a href="/start" class="mt-4 bg-white rounded-md btn hover:border-indigo-600">{{ "Commander" | t }} <i class="uil uil-arrow-right"></i></a>
            </div>
        </div>
    </div>
</section>

{{ template "footer.html" . }}