templates/training/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
    
    {% block title %}{{ training.metaTitle }}{% endblock %}
    {% block meta %}
        <meta name="description"
              content="{{ training.metaDescription }}"/>
    {% endblock %}
    
    {% block schemaOrg %}
        <script type="application/ld+json">
            {
              "@context": "https://schema.org",
              "@type": "BreadcrumbList",
              "itemListElement": [
                {
                  "@type": "ListItem",
                  "position": 1,
                  "name": "Accueil",
                  "item": "{{ url('home') }}"
                },
                {
                  "@type": "ListItem",
                  "position": 2,
                    {% if discriminator == "diplomaTraining" %}
                    "name": "Formations Diplômantes",
                    "item": "{{ url('nos_formations_diplomantes') }}"
                  {% else %}
                    "name": "Formations Courtes",
                    "item": "{{ url('nos_formations_courtes') }}"
                  {% endif %}
                    },
                    {
                      "@type": "ListItem",
                      "position": 3,
                      "name": "{{ training.title|e('html') }}",
                  "item": "{{ url('single_training', { slug: training.slug }) }}"
                }
              ]
            }
        </script>
    
        <script type="application/ld+json">
            {
              "@context": "https://schema.org",
              "@type": "Course",
              "name": "{{ training.title|e('html') }}",
              "description": "{{ training.metaDescription|e('html') }}",
              "provider": {
                "@type": "EducationalOrganization",
                "name": "Qwantic",
                "url": "{{ url('home') }}"
              },
             "offers": [{
                "@type": "Offer",
                "category": "Subscription"
              }],
              "coursePrerequisites": "{{ training.prerequisite|e('html') }}",
              "hasCourseInstance": [
                {% if training.sessions is not empty %}
                {% for session in training.sessions %}
                {
                  "@type": "CourseInstance",
                  "courseMode": "{{ session.remote == 1 ? 'online' : 'onsite' }}",
                  "location": {
                    "@type": "Place",
                    "name": "Qwantic",
                    "address": {
                      "@type": "PostalAddress",
                      "addressLocality": "{{ session.place|e('html') }}",
                      "addressCountry": "FR"
                    }
                  },
                   "courseSchedule": {
                          "@type": "Schedule",
                          "duration": "PT5H",
                          "repeatCount": "{{ session.durationInMonth }}",
                          "repeatFrequency": "Monthly",
                          "startDate": "{{ session.startDate|date('Y-m-d') }}",
                          "endDate": "{{ session.endDate|date('Y-m-d') }}"
                  }
                }{{ not loop.last ? ',' }}
                {% endfor %}
                {% else %}
                {
                  "@type": "CourseInstance",
                  "courseMode": "onsite",
                  "courseWorkload": "P1Y"
                }
                {% endif %}
            ]
          }
        </script>
    
        {% if discriminator == "diplomaTraining" %}
            <script type="application/ld+json">
                {
                  "@context": "https://schema.org",
                  "@type": "EducationalOccupationalCredential",
                  "credentialCategory": "Diplôme d'État",
                  "educationalLevel": "{{ training.certificate|e('html') }}",
                  "name": "{{ training.acronym|e('html') }}"
                }
            </script>
        {% endif %}
    {% endblock schemaOrg %}
    
    
    {% block custom_stylesheets %}
        <style>
            h3 {
                font-size: 1.25rem;
                line-height: 1.75rem;
                font-family: Aller-Bold, sans-serif;
                text-align: left;
            }
        </style>
    {% endblock %}
    
    
    {% block body %}
        <div class="relative">
            <div class="lg:hidden absolute bottom-0 bg-opacity-70 w-full z-30"
                 style="background-color:#FF4696">&nbsp;
            </div>
            {{ component('sections:header_section' ,{
                title: training.title,
                tablet: discriminator == 'diplomaTraining' ? training.acronym : training.category.name,
                shortSubtitle: training.catchPhrase,
                longSubtitle: training.catchPhrase,
                btn: discriminator == 'diplomaTraining' ? "Démarrer ma candidature" : "En savoir plus",
                url:"momo_test.png",
                ctaLink : discriminator == 'diplomaTraining' ? "#formation-form" : "#formation-details",
                ctaColor : training.category.color,
                headerDesktopUrl : training.headerDesktopName,
                headerMobileUrl : training.headerMobileName,
            }) }}
        </div>
    
        {% if discriminator == 'diplomaTraining' %}
            <section class="formation-top-content" id="formation-top-content">
                <div class="flex flex-col p-horizontal gap-16">
                    <div class="flex flex-col lg:flex-row-reverse gap12 lg:gap-16 lg:justify-center items-center w-full">
    
                        <div data-aos="fade-up" data-aos-delay="0"
                             class="flex flex-col gap-4 mb-8 lg:mb-0 justify-center mt-8">
                            <h1 data-aos="fade-up" data-aos-delay="0"
                                class="font-allerBold uppercase text-center text-2xl aos-init aos-animate"> {{ training.headSectionTitle }}
                                -
                                <span class="text-blue-500">Qwantic</span></h1>
                            {% if training.headSectionContent is defined and training.headSectionContent is not null %}
                                <div class="font-allerRegular text-sm text-center lg:text-left">
                                    {{ training.headSectionContent|raw }}
                                </div>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </section>
        {% endif %}
    
        <section class="formation-details" id="formation-details">
            <div class="flex flex-col p-vertical p-horizontal gap-16">
                <div class="flex flex-col lg:flex-row-reverse gap12 lg:gap-16 lg:justify-top items-top w-full">
    
                    <div data-aos="fade-up" data-aos-delay="0"
                         class="flex flex-col gap-4 mb-8 lg:mb-0 lg:w-2/3 justify-top">
                        {% if discriminator == 'diplomaTraining' %}
                            {% set tabContent1 %}
                                <div class="flex flex-col gap-2">
                                    <h3 class="font-allerBold text-left text-xl">Prérequis</h3>
                                    <div class="font-allerRegular text-left text-base pb-4 [&>ul]:list-disc [&>ul]:list-inside">{{ training.prerequisite|raw }}</div>
                                </div>
    
                                <div class="flex flex-col gap-2">
                                    <h3 class="font-allerBold text-left text-xl">Présentation de la formation</h3>
                                    <div class="font-allerRegular text-left text-base pb-4 [&>ul]:list-disc [&>ul]:list-inside">{{ training.presentation|raw }}</div>
                                </div>
                            {% endset %}
    
                            {% set tabContent2 %}
                                <div class="flex flex-col gap-2">
                                    <h3 class="font-allerBold text-left text-xl">Objectifs de la formation</h3>
                                    <div class="font-allerRegular text-left text-base pb-4 box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.goal|raw }} </div>
                                </div>
    
                                <div class="flex flex-col gap-2">
    
                                    {% if training.deadLine != null %}
                                        <h3 class="font-allerBold text-left text-xl">Jusqu'à quand je peux postuler ?</h3>
                                        <p class="font-allerRegular text-left text-base pb-4">Je peux postuler
                                            jusqu’au {{ training.deadLine|date('d/m/Y') }} </p>
                                    {% endif %}
                                </div>
    
                                {{ training.validationGoal|raw }}
    
                            {% endset %}
    
                            {% include 'components/tabs.html.twig' with {
                                idPrefix: 'tab-content-diploma',
                                tabs: [
                                    { label: 'Informations', content: tabContent1 },
                                    { label: 'Objectifs', content: tabContent2 },
                                ]
                            } %}
    
                        {% else %}
    
                            {% set tabContent1 %}
                                {% if training.summary is not empty %}
                                    <div class="flex flex-col gap-2">
                                        <h3 class="font-allerBold text-left text-xl">La formation en quelques mots</h3>
                                        <div class="font-allerRegular text-left text-base pb-4 [&>ul]:list-disc [&>ul]:list-inside">{{ training.summary|raw }}</div>
                                    </div>
                                {% endif %}
    
                                {% if training.goalShortTraining is not empty %}
                                    <div class="flex flex-col gap-2">
                                        <h3 class="font-allerBold text-left text-xl">Objectifs pédagogiques</h3>
                                        {% for goal in training.goalShortTraining %}
                                            <div class="flex gap-4 w-full">
                                                <div>
                                                    <svg width="30px" height="30px" stroke-width="1" viewBox="0 0 24 24"
                                                         fill="none"
                                                         xmlns="http://www.w3.org/2000/svg" color="#009ba4">
                                                        <path d="M5 13L9 17L19 7" stroke="#009ba4" stroke-width="1"
                                                              stroke-linecap="round" stroke-linejoin="round"></path>
                                                    </svg>
                                                </div>
    
                                                <div class="w-full">
                                                    {{ goal|raw }}
                                                </div>
                                            </div>
                                        {% endfor %}
                                    </div>
                                {% endif %}
                            {% endset %}
    
                            {% set tabContent2 %}
                                <div class="flex flex-col gap-2">
                                    <h3>Programme de la formation</h3>
                                    <div class="font-allerRegular text-left text-base pb-4 box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.programShortTraining|raw }} </div>
                                </div>
                            {% endset %}
    
                            {% set tabContent3 %}
                                {% if training.evaluationMethods is not empty %}
                                    <div class="flex flex-col gap-2 my-5">
                                        <h3>Méthodes d'évaluations</h3>
                                        <div class="font-allerRegular text-left text-base box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.evaluationMethods|raw }}</div>
                                    </div>
                                {% endif %}
    
                                {% if training.tools is not empty %}
                                    {% set methods = training.tools|split(';') %}
                                    <div class="flex flex-col gap-2 my-5">
                                        <h3>Méthodes pédagogiques</h3>
                                        <div class="flex flex-wrap gap-2">
                                            {% for raw in methods %}
                                                {% set m = raw|trim %}
                                                {% if m %}
                                                    {% set label = m|slice(0,1)|upper ~ m|slice(1) %}
                                                    <span class="inline-block bg-blue-500 text-white px-3 py-1 rounded-full text-sm font-allerRegular">
                                                        {{ label }}
                                                    </span>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    </div>
                                {% endif %}
    
                                {% if training.teachingMethod is not empty %}
                                    <div class="flex flex-col gap-2 my-5">
                                        <h3>Modalités d'évaluation</h3>
                                        <div class="font-allerRegular text-left text-base pb-4 box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.teachingMethod|raw }} </div>
                                    </div>
                                {% endif %}
    
                                {% if training.accessModalities is not empty %}
                                    <div class="flex flex-col gap-2 my-5">
                                        <h3>Modalités d'accès</h3>
                                        <div class="font-allerRegular text-left text-base pb-4 box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.accessModalities|raw }} </div>
                                    </div>
                                {% endif %}
                            {% endset %}
    
                            {% set tabContent4 %}
                                <div class="flex flex-col gap-2">
                                    <h3>Accessibilité</h3>
                                    <div class="font-allerRegular text-left text-base pb-4 box-border [&>ul]:list-disc [&>ul]:list-inside">{{ training.accessibilityInfo|raw }} </div>
                                </div>
                            {% endset %}
    
                            {% set tabs = [] %}
    
                            {% set tabs = tabs|merge([{ label: 'Objectifs', content: tabContent1 }]) %}
    
                            {% if training.programShortTraining is not empty %}
                                {% set tabs = tabs|merge([{ label: 'Programme', content: tabContent2 }]) %}
                            {% endif %}
    
                            {% if training.evaluationMethods is not empty or training.accessModalities is not empty or training.accessibilityInfo is not empty %}
                                {% set tabs = tabs|merge([{ label: 'Modalités', content: tabContent3 },]) %}
                            {% endif %}
    
                            {% if training.accessibilityInfo is not empty %}
                                {% set tabs = tabs|merge([{ label: 'Accessibilité', content: tabContent4 }]) %}
                            {% endif %}
    
    
                            {% include 'components/tabs.html.twig' with {
                                idPrefix: 'tab-content-short',
                                tabs: tabs
                            } %}
    
    
                            {#                        <div class="flex flex-col gap-2"> #}
    
                            {#                            <h3 class="font-allerBold text-left text-xl mb-4">Objectifs pédagogiques</h3> #}
                            {#                            {% for goal in training.goalShortTraining %} #}
                            {#                                <div class="flex gap-4 w-full"> #}
                            {#                                    <div> #}
                            {#                                        <svg width="30px" height="30px" stroke-width="1" viewBox="0 0 24 24" fill="none" #}
                            {#                                             xmlns="http://www.w3.org/2000/svg" color="#009ba4"> #}
                            {#                                            <path d="M5 13L9 17L19 7" stroke="#009ba4" stroke-width="1" #}
                            {#                                                  stroke-linecap="round" stroke-linejoin="round"></path> #}
                            {#                                        </svg> #}
                            {#                                    </div> #}
    
                            {#                                    <div class="w-full"> #}
                            {#                                        {{ goal|raw }} #}
                            {#                                    </div> #}
                            {#                                </div> #}
                            {#                            {% endfor %} #}
    
    
                            {#                        </div> #}
    
                        {% endif %}
    
                    </div>
                    <div data-aos="fade-right" data-aos-delay="0" class="w-full lg:w-1/3 lg:max-w-[40%]">
                        {{ component('cards:formation_details_card', {
                            formationType : discriminator,
                            id : training.id
                        }) }}
                    </div>
                </div>
    
                {% if discriminator == 'diplomaTraining' and training.sessions is not empty %}
                    <div class="flex flex-col gap-8 justify-center items-center lg:gap-12 w-full" id="bloc_sessions">
                        <h2 data-aos="fade-up" data-aos-delay="0"
                            class="font-allerBold uppercase text-center text-2xl"><span
                                    class="text-blue-500">Sessions</span><br class="md:hidden"> disponibles</h2>
    
                        <div data-aos="zoom-in" data-aos-delay="100"
                             class="grid grid-cols-1 gap-8 {% if sessionsCount == 2 %} lg:grid-cols-2 {% elseif sessionsCount >= 3 %} lg:grid-cols-3 {% else %} lg:w-1/2 {% endif %} justify-center 3xl:gap-12">
    
                            {# generate card #}
                            {% for session in session_array %}
                                {{ component('cards:sessions_card', {
                                    id : session.id,
                                }) }}
                            {% endfor %}
                        </div>
                        {# generate modal session attached to card#}
                        {% for session in session_array %}
                            {{ component('modal:sessions_modal', {
                                id : session.id,
                            }) }}
                        {% endfor %}
                    </div>
                {% endif %}
            </div>
        </section>
    
        {% if discriminator == "diplomaTraining" %}
            {{ component('catalog' , {form : formCatalog}) }}
        {% endif %}
    
        {% if training.jobOpenings is defined and training.jobOpenings is not null and training.professionalOutletPlaces is defined and training.professionalOutletPlaces is not null %}
            <section class="p-vertical p-horizontal">
                <div class="flex flex-col p-vertical gap-16">
                    {% if discriminator == 'diplomaTraining' %}
                        <div class="flex flex-col gap-8 justify-center items-center lg:gap-12 w-full">
                            <div class="lg:flex lg:flex-row lg:justify-center lg:items-start lg:gap-16">
                                <div data-aos="fade-down" data-aos-delay="0" id="bloc_ingenierie"
                                     class="relative w-full border-[#E4E0DF] border-2 border-solid rounded-lg h-fit lg:w-1/2">
                                    <svg class="absolute svg-dispositif" xmlns="http://www.w3.org/2000/svg" width="70.992"
                                         height="70.992" viewBox="0 0 70.992 70.992">
                                        <g data-name="Groupe 1230" transform="translate(0.5 0.5)">
                                            <path data-name="Tracé 1145" d="M35,0A35,35,0,1,1,0,35,35,35,0,0,1,35,0Z"
                                                  transform="translate(0)" fill="#049ea0" stroke="#049ea0"
                                                  stroke-width="1"/>
                                            <g data-name="Groupe 1238" transform="translate(-2.347 -2.347)">
                                                <g data-name="icons menu-4b" transform="translate(11.407 12.201)">
                                                    <g data-name="Groupe 1237" transform="translate(-9 -6)">
                                                        <g fill="none" stroke="#FFF" stroke-width="1.5">
                                                            <rect x="20" y="22" width="30" height="22" rx="3" ry="3"/>
                                                            <rect x="28" y="16" width="15" height="7" rx="1.5" ry="1.5"/>
                                                            <line x1="20" y1="34" x2="50" y2="34"/>
                                                        </g>
                                                    </g>
                                                    <circle data-name="Ellipse 82" cx="24.208" cy="24.208" r="24.208"
                                                            transform="translate(0 2.677) rotate(-3.17)"
                                                            fill="rgba(57,17,17,0)" stroke="#88d2d5" stroke-linecap="round"
                                                            stroke-linejoin="round" stroke-miterlimit="10"
                                                            stroke-width="1.3"/>
                                                    <path data-name="Tracé 1157"
                                                          d="M8.952,24.127A25.339,25.339,0,0,0,24.127,8.952"
                                                          transform="translate(27.809 27.808)" fill="rgba(57,17,17,0)"
                                                          stroke="#88d2d5" stroke-linecap="round" stroke-linejoin="round"
                                                          stroke-miterlimit="10" stroke-width="1.3"/>
                                                </g>
                                            </g>
                                        </g>
                                    </svg>
    
                                    <div class="bg-blue-500 rounded-t-lg">
                                        <h2 class="uppercase text-white font-allerBold text-center text-2xl px-10 py-8">
                                            Quels métiers après une formation {{ training.acronym }} ?
                                        </h2>
                                    </div>
                                    <div class="rounded-b-lg p-horizontal lg:px-10 pt-8 pb-16">
                                        {% if training.jobOpeningContentIntro is defined and training.jobOpeningContentIntro is not null %}
                                            <div>
                                                {{ training.jobOpeningContentIntro|raw }}
                                            </div>
                                        {% endif %}
                                        {% for job in training.jobOpenings %}
                                            <div>
                                                <button class="{% if loop.index == 1 %}active {% endif %}active-icon cursor-pointer w-full text-left border-none outline-none transition flex items-center justify-between accordion py-4 font-allerBold text-lg text-grey-300">
                                                    {{ job.name }}
                                                </button>
                                                <div class="panel border-b-2 border-[#E4E0DF] border-solid max-h-0 overflow-hidden"
                                                     style="transition: max-height 0.2s ease-out;">
                                                    <div class="font-allerLight">
                                                        {{ job.description|raw }}
                                                    </div>
                                                </div>
                                            </div>
                                        {% endfor %}
                                    </div>
                                </div>
                                <div data-aos="fade-up" data-aos-delay="200" id="bloc_program"
                                     class="w-full lg:w-1/2 border-[#E4E0DF] border-2 border-solid rounded-lg h-fit relative">
                                    <svg class="absolute svg-dispositif" xmlns="http://www.w3.org/2000/svg" width="70.992"
                                         height="70.992" viewBox="0 0 70.992 70.992">
                                        <g data-name="Groupe 1230" transform="translate(0.5 0.5)">
                                            <path data-name="Tracé 1145" d="M35,0A35,35,0,1,1,0,35,35,35,0,0,1,35,0Z"
                                                  transform="translate(0)" fill="#049ea0" stroke="#049ea0"
                                                  stroke-width="1"/>
                                            <g data-name="Groupe 1238" transform="translate(-2.347 -2.347)">
                                                <g data-name="icons menu-4b" transform="translate(11.407 12.201)">
                                                    <g data-name="Groupe 1237" transform="translate(10.4 10.609)">
                                                        <g data-name="Groupe 1236">
                                                            <path data-name="Tracé 1151"
                                                                  d="M7.542,3.867l13.6,7.875a.755.755,0,0,1,0,1.3L8.527,20.289a2.735,2.735,0,0,0-1.7,2.506h0c0,1.163.984,2.058,2.148,1.387l13.29-7.652-1.521-.984"
                                                                  transform="translate(7.924 -3.777)"
                                                                  fill="rgba(57,17,17,0)" stroke="#fff"
                                                                  stroke-linecap="round" stroke-linejoin="round"
                                                                  stroke-miterlimit="10" stroke-width="1.3"/>
                                                            <path data-name="Tracé 1152"
                                                                  d="M19.183,24.253,4.73,15.93a1.855,1.855,0,0,1-.85-1.074c-.089-.268-.089-.492-.045-.492a2.75,2.75,0,0,1,1.7-2.551L19.273,3.848"
                                                                  transform="translate(-3.806 -3.848)"
                                                                  fill="rgba(57,17,17,0)" stroke="#fff"
                                                                  stroke-linecap="round" stroke-linejoin="round"
                                                                  stroke-miterlimit="10" stroke-width="1.3"/>
                                                            <path data-name="Tracé 1153"
                                                                  d="M8.375,13.456,16.25,8.892l-1.521-.984"
                                                                  transform="translate(13.938 11.915)"
                                                                  fill="rgba(57,17,17,0)" stroke="#fff"
                                                                  stroke-linecap="round" stroke-linejoin="round"
                                                                  stroke-miterlimit="10" stroke-width="1.3"/>
                                                            <path data-name="Tracé 1154"
                                                                  d="M19.183,19.933,4.73,11.566a1.855,1.855,0,0,1-.85-1.074C3.79,10.223,3.79,10,3.835,10a2.75,2.75,0,0,1,1.7-2.551l.626-.4"
                                                                  transform="translate(-3.806 8.57)" fill="rgba(57,17,17,0)"
                                                                  stroke="#fff" stroke-linecap="round"
                                                                  stroke-linejoin="round" stroke-miterlimit="10"
                                                                  stroke-width="1.3"/>
                                                            <path data-name="Tracé 1155"
                                                                  d="M21.145,7.129a.755.755,0,0,1,0,1.3L8.527,15.675a2.735,2.735,0,0,0-1.7,2.506h0c0,1.163.984,2.058,2.148,1.387l2.908-1.656v2.864l2.551-1.521V16.436a1.756,1.756,0,0,0-.94-1.566h0"
                                                                  transform="translate(7.924 8.89)" fill="rgba(57,17,17,0)"
                                                                  stroke="#fff" stroke-linecap="round"
                                                                  stroke-linejoin="round" stroke-miterlimit="10"
                                                                  stroke-width="1.3"/>
                                                            <line data-name="Ligne 25" x2="11.41" y2="6.354"
                                                                  transform="translate(1.73 8.01)" fill="none" stroke="#fff"
                                                                  stroke-linecap="round" stroke-linejoin="round"
                                                                  stroke-miterlimit="10" stroke-width="1.3"/>
                                                        </g>
                                                    </g>
                                                    <circle data-name="Ellipse 82" cx="24.208" cy="24.208" r="24.208"
                                                            transform="translate(0 2.677) rotate(-3.17)"
                                                            fill="rgba(57,17,17,0)" stroke="#88d2d5" stroke-linecap="round"
                                                            stroke-linejoin="round" stroke-miterlimit="10"
                                                            stroke-width="1.3"/>
                                                    <path data-name="Tracé 1157"
                                                          d="M8.952,24.127A25.339,25.339,0,0,0,24.127,8.952"
                                                          transform="translate(27.809 27.808)" fill="rgba(57,17,17,0)"
                                                          stroke="#88d2d5" stroke-linecap="round" stroke-linejoin="round"
                                                          stroke-miterlimit="10" stroke-width="1.3"/>
                                                </g>
                                            </g>
                                        </g>
                                    </svg>
    
                                    <div class="bg-[#FAFAFA] rounded-t-lg">
                                        <h2 class="uppercase text-blue-500 font-allerBold text-center text-2xl px-10 py-8">
                                            Où exercer après une formation
                                            {{ training.acronym }} ? </h2>
                                    </div>
                                    <div class="rounded-b-lg px-10 pt-8 pb-16 bg-white">
                                        {% if training.professionalOutletIntro is defined and training.professionalOutletIntro is not null %}
                                            <div>
                                                {{ training.professionalOutletIntro|raw }}
                                            </div>
                                        {% endif %}
    
                                        <div>
                                            <ul class="p-3">
                                                {% for outlet in training.professionalOutletPlaces %}
                                                    <li class="flex gap-1 items-center">
                                                        <svg xmlns="http://www.w3.org/2000/svg" width="10.545"
                                                             height="11.795" viewBox="0 0 10.545 11.795">
                                                            <path data-name="Tracé 71"
                                                                  d="M260.545,1441.368,250,1435.47v3.464l4.143,2.318L250,1443.571v3.694l4.422-2.473Z"
                                                                  transform="translate(-250 -1435.47)" fill="#88d2d5"/>
                                                        </svg>
                                                        <p class="font-allerLight">{{ outlet }}</p>
                                                    </li>
                                                {% endfor %}
                                            </ul>
                                        </div>
    
                                        {% if training.professionalOutletOutro is defined and training.professionalOutletOutro is not null %}
                                            <h3 class="font-allerBold text-left text-lg">Poursuivre sa formation
                                                professionnelle</h3>
                                            <div>
                                                {{ training.professionalOutletOutro|raw }}
                                            </div>
                                        {% endif %}
                                    </div>
                                </div>
                            </div>
                        </div>
                    {% else %}
                        {# <div class="flex flex-col gap-8 justify-center items-center lg:gap-12">
                        <h2 data-aos="fade-up" data-aos-delay="0"
                            class="font-allerBold uppercase text-center text-2xl"><span
                                    class="text-blue-500">Objectifs et </span><br class="md:hidden"> modalités</h2>
                        <div class="lg:flex lg:flex-row lg:justify-center lg:items-start lg:gap-16">
                            <div data-aos="fade-right" data-aos-delay="0" class="flex flex-col items-center gap-8">
                                <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94" viewBox="0 0 94 94">
                                    <g data-name="Groupe 1228" transform="translate(-37.448 -1913.905)">
                                        <circle data-name="Ellipse 12" cx="47" cy="47" r="47"
                                                transform="translate(37.448 1913.905)" fill="#009ba4"/>
                                        <path data-name="Icon metro-target"
                                              d="M58.887,26.567h-5.55A22.934,22.934,0,0,0,34.249,7.479V1.928h-7.04v5.55A22.934,22.934,0,0,0,8.121,26.567H2.571v7.04h5.55A22.934,22.934,0,0,0,27.209,52.694v5.55h7.04v-5.55A22.934,22.934,0,0,0,53.337,33.606h5.55v-7.04Zm-12.714,0H40.687a10.588,10.588,0,0,0-6.438-6.438V14.642A15.891,15.891,0,0,1,46.173,26.567Zm-15.444,7.04a3.52,3.52,0,1,1,3.52-3.52A3.52,3.52,0,0,1,30.729,33.606Zm-3.52-18.964v5.487a10.587,10.587,0,0,0-6.438,6.438H15.285A15.891,15.891,0,0,1,27.209,14.642ZM15.285,33.606h5.487a10.587,10.587,0,0,0,6.438,6.438v5.487A15.891,15.891,0,0,1,15.285,33.606ZM34.249,45.531V40.044a10.588,10.588,0,0,0,6.438-6.438h5.487A15.891,15.891,0,0,1,34.249,45.531Z"
                                              transform="translate(53.72 1930.819)" fill="#fff"/>
                                    </g>
                                </svg>
    
                                <div class="flex flex-col gap-5">
    
                                    {% for goal in training.goalShortTraining %}
                                        <div class="flex gap-4 items-center w-full">
                                            <div class="hidden lg:block lg:w-1/6">
                                                <svg class="lg:block" xmlns="http://www.w3.org/2000/svg" width="27.517"
                                                     height="30.78" viewBox="0 0 27.517 30.78">
                                                    <path data-name="Tracé 71"
                                                          d="M277.517,1450.86,250,1435.47v9.04l10.812,6.05L250,1456.61v9.64Z"
                                                          transform="translate(-250 -1435.47)" fill="#009ba4"/>
                                                </svg>
                                            </div>
    
                                            <div class="w-full lg:w-5/6 text-center lg:text-left">
                                                {{ goal|raw }}
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                            <div data-aos="fade-left" data-aos-delay="0"
                                 class="hidden lg:flex flex-col items-center gap-8 ">
                                <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94" viewBox="0 0 94 94">
                                    <g data-name="Groupe 1229" transform="translate(-37.448 -1913.905)">
                                        <circle data-name="Ellipse 12" cx="47" cy="47" r="47"
                                                transform="translate(37.448 1913.905)" fill="#ff5649"/>
                                        <path data-name="Icon awesome-check-circle"
                                              d="M54.608,27.585A27.023,27.023,0,1,1,27.585.563,27.023,27.023,0,0,1,54.608,27.585ZM24.46,41.894,44.509,21.845a1.743,1.743,0,0,0,0-2.466l-2.466-2.466a1.743,1.743,0,0,0-2.466,0L23.227,33.264l-7.634-7.634a1.744,1.744,0,0,0-2.466,0L10.662,28.1a1.743,1.743,0,0,0,0,2.466L21.994,41.894a1.743,1.743,0,0,0,2.466,0Z"
                                              transform="translate(56.863 1933.32)" fill="#fff"/>
                                    </g>
                                </svg>
    
                                <div class="flex flex-col gap-5">
                                    {% for mode in training.mode %}
                                        <div class="flex gap-4 items-center w-full">
                                            <div class="hidden lg:block lg:w-1/6">
                                                <svg class="w-full" xmlns="http://www.w3.org/2000/svg" width="27.517"
                                                     height="30.78" viewBox="0 0 27.517 30.78">
                                                    <path data-name="Tracé 71"
                                                          d="M277.517,1450.86,250,1435.47v9.04l10.812,6.05L250,1456.61v9.64Z"
                                                          transform="translate(-250 -1435.47)" fill="#ff5649"/>
                                                </svg>
                                            </div>
                                            <div class="w-full lg:w-5/6">
                                                {{ mode|raw }}
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div> #}
                    {% endif %}
                </div>
            </section>
        {% endif %}
    
        {% if discriminator == 'shortTraining' %}
            {#        <section class="formation-desc"> #}
            {#            <div class="relative bg-[#F5F5F5]"> #}
            {#                <div class="p-horizontal p-vertical flex flex-col gap-8 relative z-10  lg:gap-16 items-center justify-center"> #}
            {#                    <h2 class="font-allerBold uppercase text-center text-2xl">Description<span class="text-blue-500"><br #}
            {#                                    class="md:hidden"> de la formation</span></h2> #}
            {#                    <div class="lg:flex w-full gap-12 items-center"> #}
    
            {#                        <svg class="hidden lg:block absolute z-20 top-[8rem] left-[7rem] 2xl:left-[12rem] 3xl:left-[16rem]" #}
            {#                             xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" #}
            {#                             width="322.098" height="129.947" viewBox="0 0 322.098 129.947"> #}
            {#                            <defs> #}
            {#                                <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" #}
            {#                                                gradientUnits="objectBoundingBox"> #}
            {#                                    <stop offset="0" stop-color="#bfa1c7"/> #}
            {#                                    <stop offset="1" stop-color="#ad91b4"/> #}
            {#                                </linearGradient> #}
            {#                            </defs> #}
            {#                            <g id="Groupe_1207" data-name="Groupe 1207" transform="translate(-363.19 -1539.026)"> #}
            {#                                <g id="bloc_formation" data-name="bloc formation" #}
            {#                                   transform="matrix(0.999, -0.052, 0.052, 0.999, 454.341, 1570.639)"> #}
            {#                                    <g id="Tracé_1142" data-name="Tracé 1142" fill="#FF4696"> #}
            {#                                        <path d="M 227.1200714111328 40.41581726074219 L 2.000006198883057 40.41581726074219 C 1.172918081283569 40.41581726074219 0.5000063180923462 39.7429084777832 0.5000063180923462 38.91581726074219 L 0.5000063180923462 1.999994993209839 C 0.5000063180923462 1.172906756401062 1.172918081283569 0.4999949634075165 2.000006198883057 0.4999949634075165 L 227.1200714111328 0.4999949634075165 C 227.9471588134766 0.4999949634075165 228.6200714111328 1.172906756401062 228.6200714111328 1.999994993209839 L 228.6200714111328 38.91581726074219 C 228.6200714111328 39.7429084777832 227.9471588134766 40.41581726074219 227.1200714111328 40.41581726074219 Z" #}
            {#                                              stroke="none"/> #}
            {#                                        <path d="M 2 0.9999961853027344 C 1.448593139648438 0.9999961853027344 1 1.448581695556641 1 1.999996185302734 L 1 38.91581726074219 C 1 39.46723175048828 1.448593139648438 39.91581726074219 2 39.91581726074219 L 227.1200714111328 39.91581726074219 C 227.6714782714844 39.91581726074219 228.1200714111328 39.46723175048828 228.1200714111328 38.91581726074219 L 228.1200714111328 1.999996185302734 C 228.1200714111328 1.448581695556641 227.6714782714844 0.9999961853027344 227.1200714111328 0.9999961853027344 L 2 0.9999961853027344 M 2 -3.814697265625e-06 L 227.1200714111328 -3.814697265625e-06 C 228.2246246337891 -3.814697265625e-06 229.1200714111328 0.8954353332519531 229.1200714111328 1.999996185302734 L 229.1200714111328 38.91581726074219 C 229.1200714111328 40.02037811279297 228.2246246337891 40.91581726074219 227.1200714111328 40.91581726074219 L 2 40.91581726074219 C 0.895416259765625 40.91581726074219 0 40.02037811279297 0 38.91581726074219 L 0 1.999996185302734 C 0 0.8954353332519531 0.895416259765625 -3.814697265625e-06 2 -3.814697265625e-06 Z" #}
            {#                                              stroke="none" fill="#FF4696"/> #}
            {#                                    </g> #}
            {#                                    <text id="_100_LOREM_IPSUM" data-name="100% LOREM IPSUM" #}
            {#                                          transform="translate(4.979 6.939)" fill="#161616" font-size="20" #}
            {#                                          font-family="Aller-Bold, Aller" font-weight="700"> #}
            {#                                        <tspan x="16.622" y="21">100% LOREM IPSUM</tspan> #}
            {#                                    </text> #}
            {#                                </g> #}
            {#                                <g id="Groupe_1195" data-name="Groupe 1195" transform="translate(0 -8)"> #}
            {#                                    <path id="Tracé_1141" data-name="Tracé 1141" #}
            {#                                          d="M12698.721-4872.11l26.569,35.5h29.178l18.025-53.517-10.9-23.93-36.308,4.239Z" #}
            {#                                          transform="translate(-12316 6487)" fill="#FF4696" stroke="#707070" #}
            {#                                          stroke-width="1"/> #}
            {#                                    <path id="Icon_material-verified-user" data-name="Icon material-verified-user" #}
            {#                                          d="M49.64,1.5,4.5,21.562V51.655c0,27.836,19.26,53.866,45.14,60.186,25.88-6.32,45.14-32.35,45.14-60.186V21.562ZM39.609,81.748,19.547,61.686l7.072-7.072,12.99,12.94L72.661,34.5l7.072,7.122Z" #}
            {#                                          transform="matrix(0.966, -0.259, 0.259, 0.966, 358.455, 1570.108)"/> #}
            {#                                </g> #}
            {#                            </g> #}
            {#                        </svg> #}
            {#                        <img class="hidden lg:block w-1/3 rounded-lg" #}
            {#                             src="{{ asset('build/images/program_test.png') | imagine_filter('formation_desc_img') }}" #}
            {#                             alt="program image"> #}
            {#                        <div class="flex flex-col gap-4 lg:gap-8"> #}
    
            {#                            <p class="font-allerRegular text-sm text-center lg:text-left"> #}
            {#                                Dessert sesame snaps tootsie roll icing gummi bears. Sugar plum liquorice topping #}
            {#                                marshmallow #}
            {#                                marshmallow topping liquorice ice cream.</p> #}
    
            {#                            <p class="font-allerRegular text-sm text-center lg:text-left">Tiramisu croissant powder #}
            {#                                marshmallow gingerbread bonbon soufflé candy canes soufflé. #}
            {#                                Jelly beans chocolate cake gummies macaroon danish marzipan jelly liquorice caramels. #}
            {#                                Dessert sesame snaps tootsie roll icing gummi bears. Sugar plum liquorice topping #}
            {#                                marshmallow #}
            {#                                marshmallow topping liquorice ice cream.</p> #}
    
            {#                            <p class="font-allerRegular text-sm text-center lg:text-left">Sugar plum liquorice topping #}
            {#                                marshmallow #}
            {#                                marshmallow topping liquorice ice cream. Sugar plum liquorice topping.</p> #}
    
            {#                        </div> #}
            {#                    </div> #}
    
            {#                    <div class="flex flex-row items-center rotate-[-4deg] w-96 justify-center left-0 lg:hidden mb-[-7rem]"> #}
            {#                        <svg class="relative z-10" xmlns="http://www.w3.org/2000/svg" width="75.029" height="91.702" #}
            {#                             viewBox="0 0 75.029 91.702"> #}
            {#                            <g id="secured" transform="translate(-375.931 -1556.829)"> #}
            {#                                <path id="Tracé_1141" data-name="Tracé 1141" #}
            {#                                      d="M12698.721-4879.2l22.081,29.5h24.249l14.98-44.477-9.055-19.888-30.175,3.523Z" #}
            {#                                      transform="translate(-12317.146 6484.278)" fill="#9dc3e4"/> #}
            {#                                <path id="Icon_material-verified-user" data-name="Icon material-verified-user" #}
            {#                                      d="M37.515,0,0,16.673v25.01C0,64.817,16.006,86.45,37.515,91.7,59.023,86.45,75.029,64.817,75.029,41.683V16.673ZM29.178,66.693,12.5,50.019l5.877-5.877L29.178,54.9,56.647,27.427l5.877,5.919Z" #}
            {#                                      transform="translate(375.931 1556.829)"/> #}
            {#                            </g> #}
            {#                        </svg> #}
            {#                        <div class="pl-10 pr-4 py-2 bg-blue-500 relative left-[-30px] z-0 rounded-sm"> #}
            {#                            <h2 class="font-allerBold uppercase text-center text-xl">100% LOREM IPSUM</h2> #}
            {#                        </div> #}
            {#                    </div> #}
    
            {#                </div> #}
            {#                <img class="w-full lg:hidden" #}
            {#                     src="{{ asset('build/images/program_test.png') | imagine_filter('wfull_img_mobile') }}" #}
            {#                     alt="program image"> #}
    
            {#            </div> #}
            {#        </section> #}
        {% endif %}
    
        {% if discriminator == 'shortTraining' %}
    
            <section class="qwantic-valeurs">
                <div class="p-horizontal py-6 flex flex-col lg:my-[50px] gap-6 lg:gap-8 items-center bg-blue-500">
                    <h2 class="font-allerBold uppercase text-center text-2xl"><span
                                class="text-white">Les marqueurs forts</span><br
                                class="md:hidden text-white"> de nos actions</h2>
                    <div class="flex flex-col lg:grid lg:grid-cols-3 gap-x-32 gap-y-8">
    
                        <div data-aos="fade-up" data-aos-delay="100"
                             class="flex flex-col items-center gap-4 aos-init aos-animate">
                            <div class="flex flex-row items-center gap-6">
                                <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
                                    <g id="icon_values-5" data-name="icon values-5" transform="translate(0)">
                                        <g id="icon_values-4" data-name="icon values-4">
                                            <path id="Tracé_821" data-name="Tracé 821"
                                                  d="M65.1,66.043c1.439,2.291.955,5.388-.478,7.683a13.671,13.671,0,0,1-2.135,2.58,2.332,2.332,0,0,0-.4-2.245,14.171,14.171,0,0,0-1.616-1.122A4.545,4.545,0,0,1,58.646,69.2a22.994,22.994,0,0,0-2.453,2.358,6.115,6.115,0,0,0-1.343,3.61l-.064.065q-1.883-1.845-3.841-3.617l.11-.12A15.778,15.778,0,0,1,54.88,60.906c.7-.809,1.491-1.548,2.145-2.4A5.522,5.522,0,0,0,58.279,55.6a3.6,3.6,0,0,1,1.649,2.829,11.226,11.226,0,0,1-.344,3.356,9.919,9.919,0,0,0-.277,3.358c.182.7,1.216.835,1.879.526s1.245-.869,1.977-.9A2.35,2.35,0,0,1,65.1,66.043Z"
                                                  transform="translate(-38.941 -40.568)" fill="#33d6d6"/>
                                            <path id="Tracé_822" data-name="Tracé 822"
                                                  d="M69.144,99.05a2.332,2.332,0,0,1,.4,2.245,37.409,37.409,0,0,1-3.689,3q-1.963-2.074-4.009-4.076l.064-.065a6.115,6.115,0,0,1,1.343-3.61A23,23,0,0,1,65.7,94.188a4.545,4.545,0,0,0,1.824,3.741A14.18,14.18,0,0,1,69.144,99.05Z"
                                                  transform="translate(-45.998 -65.557)" fill="#ffc200"/>
                                            <path id="Tracé_823" data-name="Tracé 823"
                                                  d="M68.73,100.877a.5.5,0,0,1-.438-.74,1.9,1.9,0,0,0-.31-1.648,5.078,5.078,0,0,0-.9-.643c-.219-.134-.445-.273-.662-.433a5.041,5.041,0,0,1-1.944-3.1,13.346,13.346,0,0,0-1.648,1.629A5.637,5.637,0,0,0,61.594,99.2a.5.5,0,0,1-1,.069,6.556,6.556,0,0,1,1.451-3.956,14.307,14.307,0,0,1,1.8-1.781c.239-.21.476-.418.7-.631a.5.5,0,0,1,.84.381,4.02,4.02,0,0,0,1.62,3.323c.184.135.383.257.594.387a5.9,5.9,0,0,1,1.076.78,2.816,2.816,0,0,1,.488,2.843A.5.5,0,0,1,68.73,100.877Z"
                                                  transform="translate(-45.186 -64.639)" fill="#FFF"/>
                                            <path id="Tracé_824" data-name="Tracé 824"
                                                  d="M55.464,38.766a10.455,10.455,0,0,0-8.385-8.109,13.252,13.252,0,0,0-11.068,3.49,11.863,11.863,0,0,0-8.848-3.566,10.962,10.962,0,0,0-8.722,4.971,10.162,10.162,0,0,0-.461,10c1.2,2.289,3.233,3.946,5.2,5.547l.332.271c1.7,1.388,3.393,2.853,5.045,4.353,1.282,1.16,2.569,2.372,3.827,3.6,1.335,1.305,2.68,2.672,4,4.062a.5.5,0,0,0,.661.057A38.106,38.106,0,0,0,40.773,60.4a14.077,14.077,0,0,0,2.212-2.675c1.706-2.734,1.894-5.958.477-8.213A2.772,2.772,0,0,0,41.081,48a3.332,3.332,0,0,0-1.579.619,5.915,5.915,0,0,1-.585.331,1.263,1.263,0,0,1-.973.024.351.351,0,0,1-.205-.2,9.446,9.446,0,0,1,.277-3.156l.02-.1a11.3,11.3,0,0,0,.331-3.409,4.088,4.088,0,0,0-1.9-3.213.5.5,0,0,0-.743.4,5,5,0,0,1-1.151,2.641c-.384.5-.812.952-1.264,1.432-.286.3-.582.618-.863.941A16.324,16.324,0,0,0,28.5,54.332c-1.436-1.285-2.9-2.54-4.364-3.738l-.333-.272c-1.885-1.538-3.834-3.13-4.943-5.239a9.147,9.147,0,0,1,.422-9A9.949,9.949,0,0,1,27.2,31.579a10.88,10.88,0,0,1,8.456,3.652.5.5,0,0,0,.705.04.486.486,0,0,0,.136-.225s.007,0,.011-.007A12.278,12.278,0,0,1,46.9,31.64a9.429,9.429,0,0,1,7.578,7.292A11.1,11.1,0,0,1,52.44,46.79a34.374,34.374,0,0,1-5.848,6.226.5.5,0,0,0,.669.742,35.129,35.129,0,0,0,6.011-6.416A12.086,12.086,0,0,0,55.464,38.766ZM33.2,44.969c.268-.308.557-.615.836-.912.449-.477.914-.97,1.329-1.507a6.717,6.717,0,0,0,1.2-2.3,3.471,3.471,0,0,1,.805,1.965,10.554,10.554,0,0,1-.317,3.109l-.02.1a10.439,10.439,0,0,0-.281,3.528.478.478,0,0,0,.011.054,1.341,1.341,0,0,0,.752.875,2.265,2.265,0,0,0,1.821-.022,6.689,6.689,0,0,0,.687-.385,2.515,2.515,0,0,1,1.1-.472c.752-.053,1.327.791,1.486,1.046,1.476,2.35.665,5.321-.478,7.152a13.108,13.108,0,0,1-2.058,2.485,34.191,34.191,0,0,1-3.285,2.7c-1.227-1.289-2.476-2.554-3.716-3.768C31.9,57.458,30.7,56.321,29.5,55.229c0,0,0-.007,0-.01A15.287,15.287,0,0,1,33.2,44.969Z"
                                                  transform="translate(-16.882 -24.303)" fill="#FFF"/>
                                            <path id="Tracé_825" data-name="Tracé 825"
                                                  d="M125.819,26.872h-.01a1.37,1.37,0,0,1,.009-2.74h.01a1.37,1.37,0,0,1-.009,2.74Zm0-1.741a.372.372,0,0,0-.371.368.371.371,0,0,0,.368.373.33.33,0,0,0,.263-.107.371.371,0,0,0-.258-.635Z"
                                                  transform="translate(-88.7 -20.191)" fill="#33d6d6"/>
                                            <path id="Tracé_826" data-name="Tracé 826"
                                                  d="M130.144,16.217a.691.691,0,1,1,.686.7A.691.691,0,0,1,130.144,16.217Z"
                                                  transform="translate(-92.388 -14.621)" fill="#33d6d6"/>
                                            <path id="Tracé_827" data-name="Tracé 827"
                                                  d="M115.962,16.9h-.014a1.975,1.975,0,0,1-1.962-1.99h0a1.961,1.961,0,0,1,.588-1.393,2.01,2.01,0,0,1,1.4-.569,1.976,1.976,0,0,1-.013,3.952Zm0-2.953a.977.977,0,0,0-.977.97h0a.977.977,0,0,0,.97.983h.007a.977.977,0,0,0,.007-1.954Z"
                                                  transform="translate(-81.925 -12.951)" fill="#ffc200"/>
                                            <path id="Tracé_828" data-name="Tracé 828"
                                                  d="M22.267,124.762a1.38,1.38,0,0,1-.34-.043,1.37,1.37,0,0,1-.991-1.665h0a1.369,1.369,0,1,1,1.33,1.708Zm0-1.742a.371.371,0,0,0-.358.28h0a.371.371,0,0,0,.268.45.363.363,0,0,0,.281-.041.368.368,0,0,0,.17-.227.372.372,0,0,0-.36-.463Z"
                                                  transform="translate(-18.094 -83.581)" fill="#33d6d6"/>
                                            <path id="Tracé_829" data-name="Tracé 829"
                                                  d="M29.022,115.151a.691.691,0,1,1,.5.84A.691.691,0,0,1,29.022,115.151Z"
                                                  transform="translate(-23.344 -78.795)" fill="#33d6d6"/>
                                            <path id="Tracé_830" data-name="Tracé 830"
                                                  d="M14.929,112.975a2,2,0,0,1-.49-.062,1.976,1.976,0,0,1-1.429-2.4h0a1.975,1.975,0,1,1,1.918,2.463Zm-.95-2.217a.977.977,0,1,0,1.187-.706.971.971,0,0,0-1.187.706Z"
                                                  transform="translate(-12.949 -75.164)" fill="#ffc200"/>
                                        </g>
                                    </g>
                                </svg>
                                <p class="font-allerBold text-sm lg:text-xl text-white text-center">
                                    Expériences
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Accompagner chacun à prendre confiance, à #}
                            {#                            révéler ses singularités, écouter activement et s’adapter.</p> #}
                        </div>
    
                        <svg class="lg:hidden" xmlns="http://www.w3.org/2000/svg" width="500" height="1.424"
                             viewBox="0 0 250 1.424">
                            <line data-name="Ligne 11" y1="0.424" x2="260.5" transform="translate(0.001 0.5)"
                                  fill="none" stroke="#dcdcdc" stroke-width="1"/>
                        </svg>
    
                        <div data-aos="fade-up" data-aos-delay="400"
                             class="flex flex-col items-center gap-4 aos-init aos-animate">
                            <div class="flex flex-row items-center gap-6">
                                <svg id="icon_values-7" data-name="icon values-7" xmlns="http://www.w3.org/2000/svg"
                                     width="40" height="40" viewBox="0 0 40 40">
                                    <path id="Tracé_893" data-name="Tracé 893"
                                          d="M114.322,62.6A2.523,2.523,0,0,1,116,65.854a2.482,2.482,0,1,1-1.678-3.249Z"
                                          transform="translate(-77.744 -45.321)" fill="#fed100"/>
                                    <path id="Tracé_895" data-name="Tracé 895"
                                          d="M67.531,110.223a2.3,2.3,0,0,1-1.735,4.224,2.226,2.226,0,0,1-1.44-2.633,3.029,3.029,0,0,1,1.9-1.822,1.572,1.572,0,0,1,.7-.14A.674.674,0,0,1,67.531,110.223Z"
                                          transform="translate(-47.062 -76.266)" fill="#fed100"/>
                                    <path id="Tracé_894" data-name="Tracé 894"
                                          d="M63.61,17.013a2.335,2.335,0,0,1,.076-1.071,2.578,2.578,0,0,1,3-1.644,2.493,2.493,0,0,1,1.64,3.39,2.467,2.467,0,0,1-4.719-.675Z"
                                          transform="translate(-46.603 -13.733)" fill="#fed100"/>
                                    <path id="Tracé_896" data-name="Tracé 896"
                                          d="M20.054,63.07a4.035,4.035,0,0,1,.61,2.279,2.542,2.542,0,0,1-.9,1.741,2.38,2.38,0,0,1-2.582.208,2.491,2.491,0,0,1-1.238-2.292,2.615,2.615,0,0,1,1.492-2.152A2.747,2.747,0,0,1,20.054,63.07Z"
                                          transform="translate(-15.444 -45.38)" fill="#fed100"/>
                                    <path id="Tracé_897" data-name="Tracé 897"
                                          d="M61.266,18.583a15.231,15.231,0,0,0-6.875-2.9,3.131,3.131,0,0,0-.3-1.249,2.88,2.88,0,0,0-1.89-1.537h0a3.049,3.049,0,0,0-3.6,1.969,2.766,2.766,0,0,0-.124.816,17.5,17.5,0,0,0-7.044,2.951.49.49,0,1,0,.569.8,16.516,16.516,0,0,1,6.628-2.781,3.033,3.033,0,0,0,1.756,1.9,2.813,2.813,0,0,0,.991.178,3.061,3.061,0,0,0,2.783-1.776,2.683,2.683,0,0,0,.109-.3,14.249,14.249,0,0,1,6.4,2.711.49.49,0,1,0,.593-.782Zm-8-2.021a1.974,1.974,0,0,1-3.774-.505.477.477,0,0,0-.017-.1,1.823,1.823,0,0,1,.064-.791A2.12,2.12,0,0,1,51.5,13.785a1.734,1.734,0,0,1,.444.057A1.884,1.884,0,0,1,53.2,14.858,2.1,2.1,0,0,1,53.261,16.562Z"
                                          transform="translate(-31.985 -12.801)" fill="#FFF"/>
                                    <path id="Tracé_898" data-name="Tracé 898"
                                          d="M18.221,52.791a2.693,2.693,0,0,0,.92-.472,3.022,3.022,0,0,0,1.084-2.079,4.478,4.478,0,0,0-.664-2.552.489.489,0,0,0-.162-.181,3.205,3.205,0,0,0-1.369-.5.466.466,0,0,0,.022-.062,15.926,15.926,0,0,1,2.793-6.724.491.491,0,0,0-.8-.574,16.916,16.916,0,0,0-2.966,7.14.485.485,0,0,0,.019.228,3.039,3.039,0,0,0-.8.239,3.088,3.088,0,0,0-1.776,2.566,2.977,2.977,0,0,0,1.489,2.752,2.8,2.8,0,0,0,1.235.339,12.859,12.859,0,0,0,2.761,6.727.491.491,0,0,0,.763-.617A11.867,11.867,0,0,1,18.221,52.791ZM15.5,49.884a2.092,2.092,0,0,1,2.107-1.931,2.269,2.269,0,0,1,1.143.307,3.454,3.454,0,0,1,.5,1.89,2.065,2.065,0,0,1-.722,1.4,1.9,1.9,0,0,1-2.037.161A2.006,2.006,0,0,1,15.5,49.884Z"
                                          transform="translate(-14.517 -30.225)" fill="#FFF"/>
                                    <path id="Tracé_899" data-name="Tracé 899"
                                          d="M61.593,106.6a.49.49,0,0,0-.692-.038,12.559,12.559,0,0,1-6.786,3.09,2.932,2.932,0,0,0-1.285-2.012,1.192,1.192,0,0,0-.9-.51,2.024,2.024,0,0,0-.918.172,3.479,3.479,0,0,0-2.2,2.142,2.324,2.324,0,0,0-.055.236,14.331,14.331,0,0,1-6.73-2.858.49.49,0,1,0-.6.775,15.315,15.315,0,0,0,7.358,3.08,2.733,2.733,0,0,0,1.794,2.006,2.566,2.566,0,0,0,.764.115,2.856,2.856,0,0,0,2.584-1.672,2.6,2.6,0,0,0,.155-.483,13.542,13.542,0,0,0,7.47-3.351A.49.49,0,0,0,61.593,106.6Zm-8.563,4.135a1.872,1.872,0,0,1-2.156,1.011,1.727,1.727,0,0,1-1.115-2.029,2.629,2.629,0,0,1,1.61-1.5,1.3,1.3,0,0,1,.439-.109l.041,0a.219.219,0,0,1,.161.074.491.491,0,0,0,.2.231A1.881,1.881,0,0,1,53.03,110.739Z"
                                          transform="translate(-31.994 -74.038)" fill="#FFF"/>
                                    <path id="Tracé_900" data-name="Tracé 900"
                                          d="M114.021,49.441a2.9,2.9,0,0,0-1.831-1.487h0a2.669,2.669,0,0,0-.317-.064,12.578,12.578,0,0,0-2.864-6.867.49.49,0,1,0-.751.631,11.593,11.593,0,0,1,2.632,6.269,2.953,2.953,0,0,0-.425,5.718,2.661,2.661,0,0,0,.4.1,12.3,12.3,0,0,1-2.994,6.556.49.49,0,0,0,.732.653,13.285,13.285,0,0,0,3.25-7.215,2.918,2.918,0,0,0,2.172-4.291Zm-.743,2.066a1.991,1.991,0,1,1-1.807-2.667,1.746,1.746,0,0,1,.461.06,1.928,1.928,0,0,1,1.216.99A2.048,2.048,0,0,1,113.278,51.507Z"
                                          transform="translate(-75.483 -31.143)" fill="#FFF"/>
                                    <g id="Groupe_957" data-name="Groupe 957" transform="translate(33.456 2.962)">
                                        <path id="Tracé_901" data-name="Tracé 901"
                                              d="M127.853,38.679h-.009a1.3,1.3,0,0,1-1.285-1.3l.49,0-.49,0a1.294,1.294,0,0,1,1.294-1.286h.009a1.295,1.295,0,0,1-.009,2.59Zm0-1.609a.314.314,0,0,0,0,.628h0a.314.314,0,0,0,.223-.534.311.311,0,0,0-.221-.093Z"
                                              transform="translate(-123.151 -32.449)" fill="#33d6d6"/>
                                        <path id="Tracé_902" data-name="Tracé 902"
                                              d="M132,28.712a.639.639,0,1,1,.634.643A.639.639,0,0,1,132,28.712Z"
                                              transform="translate(-126.71 -27.209)" fill="#33d6d6"/>
                                        <path id="Tracé_903" data-name="Tracé 903"
                                              d="M118.565,29.276h-.013a1.855,1.855,0,0,1-1.842-1.868h0a1.842,1.842,0,0,1,.552-1.308,1.887,1.887,0,0,1,1.315-.534,1.855,1.855,0,0,1-.013,3.709Zm0-2.729a.874.874,0,0,0-.874.868h0a.874.874,0,0,0,.868.88.874.874,0,1,0,.012-1.747Z"
                                              transform="translate(-116.71 -25.566)" fill="#fed100"/>
                                    </g>
                                    <g id="Groupe_958" data-name="Groupe 958" transform="translate(0.491 33.582)">
                                        <path id="Tracé_904" data-name="Tracé 904"
                                              d="M29.636,128.45a1.295,1.295,0,1,1,1.255-.976A1.29,1.29,0,0,1,29.636,128.45Zm0-1.609a.315.315,0,1,0,.077.01A.306.306,0,0,0,29.636,126.841Z"
                                              transform="translate(-25.754 -121.629)" fill="#FFF"/>
                                        <path id="Tracé_905" data-name="Tracé 905"
                                              d="M36.073,119.467a.639.639,0,1,1,.462.776A.639.639,0,0,1,36.073,119.467Z"
                                              transform="translate(-30.797 -117.132)" fill="#33d6d6"/>
                                        <path id="Tracé_906" data-name="Tracé 906"
                                              d="M22.719,117.337a1.855,1.855,0,0,1-1.8-2.311h0a1.855,1.855,0,1,1,1.8,2.311Zm-.846-2.07a.874.874,0,1,0,1.062-.632.875.875,0,0,0-1.062.632Z"
                                              transform="translate(-20.864 -113.628)" fill="#fed100"/>
                                    </g>
                                    <path id="Tracé_907" data-name="Tracé 907"
                                          d="M59.66,46.871a8.593,8.593,0,0,1,2.749,2.583A97.22,97.22,0,0,1,51.065,62.687a16.855,16.855,0,0,1-5.977-5.4c1.214-1.279,2.456-2.851,2.456-2.851s1.749,1.826,3.214,3.072C53.657,54.034,56.557,50.554,59.66,46.871Z"
                                          transform="translate(-34.509 -35.082)" fill="#33d6d6"/>
                                </svg>
                                <p class="font-allerBold text-sm lg:text-xl text-white text-center">
                                    Expertise
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Accompagner chacun, quel que soit son parcours, #}
                            {#                            son âge ou sa situation, à révéler ses talents et son potentiel.</p> #}
                        </div>
    
                        <svg class="lg:hidden" xmlns="http://www.w3.org/2000/svg" width="500" height="1.424"
                             viewBox="0 0 260.502 1.424">
                            <line data-name="Ligne 11" y1="0.424" x2="260.5" transform="translate(0.001 0.5)"
                                  fill="none" stroke="#dcdcdc" stroke-width="1"/>
                        </svg>
    
                        <div data-aos="fade-up" data-aos-delay="200"
                             class="flex flex-col items-center gap-4 aos-init aos-animate">
                            <div class="flex flex-row items-center gap-6">
                                <svg id="icon_values-6" data-name="icon values-6" xmlns="http://www.w3.org/2000/svg"
                                     width="40" height="40" viewBox="0 0 40 40">
                                    <g id="Groupe_931" data-name="Groupe 931" transform="translate(17.684 8.177)">
                                        <path id="Tracé_865" data-name="Tracé 865"
                                              d="M73.122,50.306l-.1.062L66.86,48.012l22.024-7.281-.275.166Z"
                                              transform="translate(-66.86 -40.731)" fill="#33d6d6"/>
                                    </g>
                                    <g id="Groupe_932" data-name="Groupe 932" transform="translate(23.945 8.343)">
                                        <path id="Tracé_866" data-name="Tracé 866"
                                              d="M101.931,41.26l.085.137L91.059,52.209l.1.04-2.97,5.088a40.1,40.1,0,0,1-1.742-6.669Z"
                                              transform="translate(-86.444 -41.26)" fill="#fed100"/>
                                    </g>
                                    <g id="Groupe_933" data-name="Groupe 933" transform="translate(28.56 8.48)">
                                        <path id="Tracé_867" data-name="Tracé 867"
                                              d="M100.974,52.549l-.1-.04L111.835,41.7l-4.032,13.8-3.62-1.561Z"
                                              transform="translate(-100.877 -41.696)" fill="#33d6d6"/>
                                    </g>
                                    <path id="Tracé_868" data-name="Tracé 868"
                                          d="M88.33,39.57a.457.457,0,0,0-.555-.233L65.751,46.619a.442.442,0,0,0-.02.836l6.044,2.311a40.643,40.643,0,0,0,1.651,6.253.436.436,0,0,0,.141.358.46.46,0,0,0,.566.035,50.026,50.026,0,0,1,6.05-3.581l3.332,1.435a.462.462,0,0,0,.375,0,.447.447,0,0,0,.243-.28l4.032-13.8a.421.421,0,0,0,.007-.061A.439.439,0,0,0,88.33,39.57ZM76.451,50.56a.438.438,0,0,0-.124.389l-2.313,3.962a39.875,39.875,0,0,1-1.353-5.359l12.524-7.609Zm7.881-9.146L72.05,48.876a.447.447,0,0,0-.059.017L67.224,47.07ZM75.237,54.6l1.822-3.121,2.062.888C77.8,53.058,76.5,53.8,75.237,54.6Zm8.168-1.359-5.844-2.519L86.809,41.6Z"
                                          transform="translate(-48.212 -31.582)" fill="#FFF"/>
                                    <path id="Tracé_869" data-name="Tracé 869"
                                          d="M33.008,29.552a5.979,5.979,0,0,0-4.023-.643,5.285,5.285,0,0,0-1.566-1.64,2.506,2.506,0,0,0-2.375-.143,4.2,4.2,0,0,0-3.919-1.169,4.121,4.121,0,0,0-2.953,2.869,4.9,4.9,0,0,0-3.741,4.207.44.44,0,0,0,.112.344.457.457,0,0,0,.336.149c2.268.012,6.11.033,9.8.056a6.3,6.3,0,0,0,.14,1.884.451.451,0,0,0,.442.347.46.46,0,0,0,.1-.011.445.445,0,0,0,.342-.532,5.434,5.434,0,0,1-.117-1.682c4.479.029,8.509.06,8.888.08a.452.452,0,0,0,.065,0l.05,0a.449.449,0,0,0,.4-.4A4.005,4.005,0,0,0,33.008,29.552Zm.684,3.21c-.539-.007-1.308-.015-2.231-.023-1.844-.016-4.3-.033-6.756-.048-3.941-.025-7.881-.046-9.284-.053a4.03,4.03,0,0,1,3.219-3.008,4.193,4.193,0,0,1,2.167.17.455.455,0,0,0,.581-.265.443.443,0,0,0-.27-.57,5.073,5.073,0,0,0-1.933-.287,3.2,3.2,0,0,1,2.155-1.856,3.241,3.241,0,0,1,3.215,1.11.434.434,0,0,0,.078.118.459.459,0,0,0,.641,0,1.453,1.453,0,0,1,1.674-.024,5.083,5.083,0,0,1,1.443,1.611.456.456,0,0,0,.462.193,5.338,5.338,0,0,1,3.68.477,3.19,3.19,0,0,1,1.561,2.458Z"
                                          transform="translate(-13.51 -22.345)" fill="#FFF"/>
                                    <g id="Groupe_934" data-name="Groupe 934" transform="translate(10.897 14.583)">
                                        <path id="Tracé_870" data-name="Tracé 870"
                                              d="M46.087,63.97a.459.459,0,0,1-.2-.048.441.441,0,0,1-.2-.6,2.5,2.5,0,0,0,.22-1.647.445.445,0,0,1,.35-.527.453.453,0,0,1,.537.344,3.343,3.343,0,0,1-.3,2.233A.454.454,0,0,1,46.087,63.97Z"
                                              transform="translate(-45.634 -61.139)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_935" data-name="Groupe 935" transform="translate(8.706 18.351)">
                                        <path id="Tracé_871" data-name="Tracé 871"
                                              d="M39.235,75.276a.453.453,0,0,1-.417-.269.442.442,0,0,1,.237-.585,2.812,2.812,0,0,0,1.27-1.069.459.459,0,0,1,.625-.142.44.44,0,0,1,.144.613,3.725,3.725,0,0,1-1.68,1.416A.461.461,0,0,1,39.235,75.276Z"
                                              transform="translate(-38.782 -73.144)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_936" data-name="Groupe 936" transform="translate(6.003 21.009)">
                                        <path id="Tracé_872" data-name="Tracé 872"
                                              d="M30.814,84.336a.459.459,0,0,1-.207-.033.442.442,0,0,1-.244-.582,7.034,7.034,0,0,1,1.247-1.959.46.46,0,0,1,.64-.04.44.44,0,0,1,.04.628,6.151,6.151,0,0,0-1.09,1.713A.453.453,0,0,1,30.814,84.336Z"
                                              transform="translate(-30.328 -81.611)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_937" data-name="Groupe 937" transform="translate(5.64 24.735)">
                                        <path id="Tracé_873" data-name="Tracé 873"
                                              d="M29.926,96.174a.454.454,0,0,1-.4-.241,2.935,2.935,0,0,1-.229-2.123.455.455,0,0,1,.556-.313.444.444,0,0,1,.319.546,2.049,2.049,0,0,0,.159,1.483.441.441,0,0,1-.2.6A.458.458,0,0,1,29.926,96.174Z"
                                              transform="translate(-29.192 -93.481)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_938" data-name="Groupe 938" transform="translate(6.694 28.446)">
                                        <path id="Tracé_874" data-name="Tracé 874"
                                              d="M34.324,107.392a.458.458,0,0,1-.159-.029,3.061,3.061,0,0,1-1.624-1.408.441.441,0,0,1,.19-.6.457.457,0,0,1,.612.187,2.148,2.148,0,0,0,1.14.988.442.442,0,0,1,.265.573A.453.453,0,0,1,34.324,107.392Z"
                                              transform="translate(-32.489 -105.304)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_939" data-name="Groupe 939" transform="translate(10.153 30.301)">
                                        <path id="Tracé_875" data-name="Tracé 875"
                                              d="M44.786,112.243a4.254,4.254,0,0,1-1.149-.158.444.444,0,0,1-.311-.55.454.454,0,0,1,.56-.305,3.336,3.336,0,0,0,1.621.044.453.453,0,0,1,.543.335.445.445,0,0,1-.341.532A4.216,4.216,0,0,1,44.786,112.243Z"
                                              transform="translate(-43.308 -111.212)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_940" data-name="Groupe 940" transform="translate(13.945 29.096)">
                                        <path id="Tracé_876" data-name="Tracé 876"
                                              d="M55.621,108.912a.454.454,0,0,1-.419-.274.442.442,0,0,1,.244-.582l1.592-.65a.457.457,0,0,1,.592.241.442.442,0,0,1-.245.581l-1.591.649A.458.458,0,0,1,55.621,108.912Z"
                                              transform="translate(-55.167 -107.372)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_941" data-name="Groupe 941" transform="translate(17.014 26.274)">
                                        <path id="Tracé_877" data-name="Tracé 877"
                                              d="M65.219,101.013a.456.456,0,0,1-.27-.088.44.44,0,0,1-.093-.623,6.659,6.659,0,0,0,.91-1.631.455.455,0,0,1,.584-.258.442.442,0,0,1,.263.574,7.544,7.544,0,0,1-1.031,1.847A.455.455,0,0,1,65.219,101.013Z"
                                              transform="translate(-64.766 -98.384)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_942" data-name="Groupe 942" transform="translate(17.302 23.273)">
                                        <path id="Tracé_878" data-name="Tracé 878"
                                              d="M66.623,91.138a.453.453,0,0,1-.428-.3l-.5-1.427a.443.443,0,0,1,.281-.566.456.456,0,0,1,.576.276l.5,1.426a.443.443,0,0,1-.28.566A.456.456,0,0,1,66.623,91.138Z"
                                              transform="translate(-65.665 -88.821)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_943" data-name="Groupe 943" transform="translate(13.93 22.069)">
                                        <path id="Tracé_879" data-name="Tracé 879"
                                              d="M57.54,86.214a.463.463,0,0,1-.15-.025,5.759,5.759,0,0,0-1.82-.312.445.445,0,1,1,0-.89h0a6.67,6.67,0,0,1,2.111.362.443.443,0,0,1,.278.567A.453.453,0,0,1,57.54,86.214Z"
                                              transform="translate(-55.121 -84.988)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_944" data-name="Groupe 944" transform="translate(10.436 22.596)">
                                        <path id="Tracé_880" data-name="Tracé 880"
                                              d="M44.647,88.338a.456.456,0,0,1-.346-.158.439.439,0,0,1,.054-.627,4.2,4.2,0,0,1,1.842-.876.452.452,0,0,1,.535.346.445.445,0,0,1-.352.525,3.287,3.287,0,0,0-1.44.685A.456.456,0,0,1,44.647,88.338Z"
                                              transform="translate(-44.194 -86.668)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_945" data-name="Groupe 945" transform="translate(9.157 24.982)">
                                        <path id="Tracé_881" data-name="Tracé 881"
                                              d="M40.656,96.819a.45.45,0,0,1-.452-.412,4.65,4.65,0,0,1,.235-1.834.454.454,0,0,1,.574-.28.443.443,0,0,1,.286.563,3.765,3.765,0,0,0-.19,1.486.448.448,0,0,1-.419.476Z"
                                              transform="translate(-40.192 -94.269)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_946" data-name="Groupe 946" transform="translate(10.238 28.146)">
                                        <path id="Tracé_882" data-name="Tracé 882"
                                              d="M45.181,106.084a.456.456,0,0,1-.272-.089l-1.153-.847a.439.439,0,0,1-.092-.623.458.458,0,0,1,.634-.09l1.155.848a.44.44,0,0,1,.091.623A.455.455,0,0,1,45.181,106.084Z"
                                              transform="translate(-43.574 -104.347)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_947" data-name="Groupe 947" transform="translate(14.415 31.26)">
                                        <path id="Tracé_883" data-name="Tracé 883"
                                              d="M59.554,115.977a.461.461,0,0,1-.136-.012,14.445,14.445,0,0,1-2.512-.846.442.442,0,0,1-.227-.588.457.457,0,0,1,.6-.223,13.545,13.545,0,0,0,2.353.793.444.444,0,0,1,.334.537A.451.451,0,0,1,59.554,115.977Z"
                                              transform="translate(-56.638 -114.269)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_948" data-name="Groupe 948" transform="translate(18.948 31.251)">
                                        <path id="Tracé_884" data-name="Tracé 884"
                                              d="M71.267,115.813a.444.444,0,0,1-.055-.886,2.9,2.9,0,0,0,1.43-.59.459.459,0,0,1,.637.068.44.44,0,0,1-.07.626,3.779,3.779,0,0,1-1.887.779A.444.444,0,0,1,71.267,115.813Z"
                                              transform="translate(-70.815 -114.239)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_949" data-name="Groupe 949" transform="translate(22.184 28.58)">
                                        <path id="Tracé_885" data-name="Tracé 885"
                                              d="M81.386,108.112a.454.454,0,0,1-.226-.06.44.44,0,0,1-.165-.608l.877-1.491a.457.457,0,0,1,.619-.162.44.44,0,0,1,.165.608l-.877,1.49A.454.454,0,0,1,81.386,108.112Z"
                                              transform="translate(-80.933 -105.731)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_950" data-name="Groupe 950" transform="translate(23.868 25.785)">
                                        <path id="Tracé_886" data-name="Tracé 886"
                                              d="M86.563,98.872a.436.436,0,0,1-.069-.02.442.442,0,0,1-.265-.573q.224-.587.45-1.169a.456.456,0,0,1,.585-.256.442.442,0,0,1,.261.575c-.151.386-.3.773-.448,1.162A.454.454,0,0,1,86.563,98.872Z"
                                              transform="translate(-86.2 -96.826)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_951" data-name="Groupe 951" transform="translate(33.152 3.285)">
                                        <path id="Tracé_887" data-name="Tracé 887"
                                              d="M116.429,27.486h-.009a1.2,1.2,0,0,1-.84-.349,1.152,1.152,0,0,1-.343-.83,1.183,1.183,0,0,1,1.192-1.162h.008a1.2,1.2,0,0,1,.841.349,1.155,1.155,0,0,1-.012,1.655A1.2,1.2,0,0,1,116.429,27.486Zm0-1.451a.284.284,0,0,0-.286.278.276.276,0,0,0,.082.2.286.286,0,0,0,.2.084.3.3,0,0,0,.2-.081.277.277,0,0,0,0-.4.286.286,0,0,0-.2-.084Z"
                                              transform="translate(-115.236 -25.146)" fill="#FFF"/>
                                    </g>
                                    <g id="Groupe_952" data-name="Groupe 952" transform="translate(34.885 0.786)">
                                        <path id="Tracé_888" data-name="Tracé 888"
                                              d="M120.657,17.759a.587.587,0,1,1,.583.58A.582.582,0,0,1,120.657,17.759Z"
                                              transform="translate(-120.657 -17.187)" fill="#33d6d6"/>
                                    </g>
                                    <g id="Groupe_953" data-name="Groupe 953" transform="translate(30.021)">
                                        <path id="Tracé_889" data-name="Tracé 889"
                                              d="M107.151,18.033h-.012a1.693,1.693,0,0,1-1.695-1.687h0a1.693,1.693,0,0,1,1.706-1.664h.012a1.711,1.711,0,0,1,1.2.5,1.655,1.655,0,0,1-.017,2.369A1.712,1.712,0,0,1,107.151,18.033Zm-.8-1.681a.794.794,0,0,0,.795.791h.006a.8.8,0,0,0,.562-.226.776.776,0,0,0,.008-1.111.8.8,0,0,0-.564-.234h-.006a.794.794,0,0,0-.8.78Z"
                                              transform="translate(-105.444 -14.682)" fill="#fed100"/>
                                    </g>
                                    <g id="Groupe_954" data-name="Groupe 954" transform="translate(2.377 34.235)">
                                        <path id="Tracé_890" data-name="Tracé 890"
                                              d="M16.98,126.086a1.232,1.232,0,0,1-.3-.036,1.182,1.182,0,0,1-.731-.536,1.145,1.145,0,0,1-.131-.887h0a1.165,1.165,0,0,1,.546-.718,1.208,1.208,0,0,1,.9-.128,1.163,1.163,0,0,1,.316,2.14A1.2,1.2,0,0,1,16.98,126.086Zm-.279-1.24a.275.275,0,0,0,.032.213.282.282,0,0,0,.175.128.292.292,0,0,0,.217-.031.279.279,0,0,0-.076-.513.283.283,0,0,0-.216.031A.279.279,0,0,0,16.7,124.846Z"
                                              transform="translate(-15.786 -123.744)" fill="#33d6d6"/>
                                    </g>
                                    <g id="Groupe_955" data-name="Groupe 955" transform="translate(4.832 32.092)">
                                        <path id="Tracé_891" data-name="Tracé 891"
                                              d="M23.482,117.352a.588.588,0,0,1,.713-.416.575.575,0,0,1,.424.7.588.588,0,0,1-.713.416A.575.575,0,0,1,23.482,117.352Z"
                                              transform="translate(-23.463 -116.917)" fill="#33d6d6"/>
                                    </g>
                                    <g id="Groupe_956" data-name="Groupe 956" transform="translate(0 30.416)">
                                        <path id="Tracé_892" data-name="Tracé 892"
                                              d="M10.059,114.93a1.734,1.734,0,0,1-.42-.051,1.676,1.676,0,0,1-1.234-2.036h0a1.712,1.712,0,0,1,2.074-1.212,1.675,1.675,0,0,1,1.234,2.036A1.7,1.7,0,0,1,10.059,114.93Zm-.775-1.869h0a.786.786,0,0,0,.579.955.8.8,0,0,0,.973-.568.786.786,0,0,0-.579-.955A.8.8,0,0,0,9.283,113.061Z"
                                              transform="translate(-8.352 -111.579)" fill="#fed100"/>
                                    </g>
                                </svg>
                                <p class="font-allerBold text-sm lg:text-xl text-white text-center">
                                    Adaptabilité
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Faire un pas de côté, rechercher, tester, #}
                            {#                            explorer de nouvelles expériences et améliorer sans cesse nos approches pédagogiques.</p> #}
                        </div>
    
                        <svg class="lg:hidden" xmlns="http://www.w3.org/2000/svg" width="500" height="1.424"
                             viewBox="0 0 250 1.424">
                            <line data-name="Ligne 11" y1="0.424" x2="260.5" transform="translate(0.001 0.5)"
                                  fill="none" stroke="#dcdcdc" stroke-width="1"/>
                        </svg>
    
                        <div data-aos="fade-up" data-aos-delay="300"
                             class="flex flex-col items-center gap-4 aos-init aos-animate">
                            <div class="flex flex-row items-center gap-6">
                                <svg id="icon_values-3" data-name="icon values-3" xmlns="http://www.w3.org/2000/svg"
                                     width="40" height="40" viewBox="0 0 40 40">
                                    <g id="Groupe_891" data-name="Groupe 891" transform="translate(1.209 23.546)">
                                        <path id="Tracé_812" data-name="Tracé 812"
                                              d="M51.431,91.045a.631.631,0,0,0-.684.28c-2.882,5.047-9.394,7.84-16.122,6.443S23.037,91.214,22.4,85.438a.631.631,0,0,0-.516-.529h0a.584.584,0,0,0-.75.589C21.83,91.762,27.1,97.352,34.4,98.868s14.358-1.513,17.488-6.984a.584.584,0,0,0-.454-.839h0Z"
                                              transform="translate(-21.135 -84.893)" fill="#FFF"/>
                                    </g>
                                    <path id="Tracé_813" data-name="Tracé 813"
                                          d="M23.507,25.582a3.148,3.148,0,1,1-.018,6.288,3.147,3.147,0,1,1,.018-6.288Z"
                                          transform="translate(-19.998 -25.582)" fill="#ffc200"/>
                                    <path id="Tracé_814" data-name="Tracé 814"
                                          d="M37.7,75.379a4,4,0,1,1-4.087,3.9A3.991,3.991,0,0,1,37.7,75.379Z"
                                          transform="translate(-28.503 -57.167)" fill="#ffc200"/>
                                    <path id="Tracé_817" data-name="Tracé 817"
                                          d="M114.375,50.8a1.418,1.418,0,0,1-1.234-2.11h0a1.416,1.416,0,1,1,1.233,2.111Zm-.33-1.6a.38.38,0,1,0,.517-.145A.38.38,0,0,0,114.046,49.195Z"
                                          transform="translate(-78.829 -39.779)" fill="#33d6d6"/>
                                    <path id="Tracé_818" data-name="Tracé 818"
                                          d="M22.538,59.775a2.908,2.908,0,0,1-2.53-4.328h0a2.9,2.9,0,1,1,2.53,4.33Zm-.675-3.289a.78.78,0,1,0,1.061-.3A.78.78,0,0,0,21.862,56.486Z"
                                          transform="translate(-19.637 -43.583)" fill="#33d6d6"/>
                                    <path id="Tracé_819" data-name="Tracé 819"
                                          d="M123.316,42.895a.713.713,0,1,1,.273.971A.713.713,0,0,1,123.316,42.895Z"
                                          transform="translate(-85.339 -36.333)" fill="#33d6d6"/>
                                    <path id="Tracé_820" data-name="Tracé 820"
                                          d="M110.222,37.893a2.041,2.041,0,0,1-1.778-3.041h0a2.042,2.042,0,1,1,1.778,3.041Zm-.873-2.534h0a1.006,1.006,0,1,0,1.369-.385,1.005,1.005,0,0,0-1.369.385Z"
                                          transform="translate(-75.8 -30.8)" fill="#fed100"/>
                                    <path id="Tracé_816" data-name="Tracé 816"
                                          d="M52.237,67.019a8.528,8.528,0,0,1-.959-.066L49.115,66.7a.518.518,0,0,1-.457-.56q.072-.836.149-1.667c.179-1.975.348-3.841.424-5.747.026-.661.065-1.32.1-1.978a39.183,39.183,0,0,0,.077-5.163,13.158,13.158,0,0,0-2.643-6.552A18.558,18.558,0,0,0,45.519,43.6c-1.624-1.76-3.849-4.17-4.138-7.119A3.376,3.376,0,0,1,42.689,33.3a1.589,1.589,0,0,1,1.864.361,9.881,9.881,0,0,1,1.25,1.875c.955,1.6,2.4,4.018,3.551,4.816,1.515,1.049,3.763,1.662,5.529.24,1.8-1.447,3.133-4.782,3.932-6.775a10.465,10.465,0,0,1,.741-1.653,1.676,1.676,0,0,1,1.873-.966c1.974.472,1.9,2.391,1.522,4.395a14.051,14.051,0,0,1-3.038,5.918c-1.065,1.419-1.986,2.645-2.017,3.982a2.284,2.284,0,0,0,.522,1.761,2.75,2.75,0,0,0,2.112.525c.741-.036,3.393-.569,5.33-.959,1.139-.229,2.122-.427,2.529-.488a3.141,3.141,0,0,1,2.417.423,2.621,2.621,0,0,1,.9,1.861,2.235,2.235,0,0,1-1.239,2.513,9.669,9.669,0,0,1-2.758.771c-.922.1-1.859.16-2.765.214-1.151.069-2.342.14-3.487.309-5.023.744-7.9,3.7-7.9,8.1,0,.885.1,1.957.195,2.994.081.874.157,1.7.167,2.352a.987.987,0,0,1-.327.769A1.992,1.992,0,0,1,52.237,67.019Zm-2.5-1.287,1.661.191c1.231.142,1.465-.019,1.5-.053-.024-.6-.1-1.4-.177-2.258-.1-1.06-.2-2.156-.2-3.089,0-4.9,3.285-8.315,8.788-9.131,1.19-.176,2.4-.249,3.577-.319.893-.053,1.816-.108,2.712-.209a8.776,8.776,0,0,0,2.46-.691,1.269,1.269,0,0,0,.623-1.439,1.615,1.615,0,0,0-.5-1.16,2.19,2.19,0,0,0-1.636-.221c-.381.056-1.353.252-2.478.479-2.187.44-4.665.939-5.484.978a3.7,3.7,0,0,1-2.885-.819,3.28,3.28,0,0,1-.834-2.528c.039-1.669,1.1-3.083,2.224-4.58A13.228,13.228,0,0,0,61.933,35.4c.5-2.667-.067-3.034-.744-3.2-.3-.072-.4-.006-.778.544a12.475,12.475,0,0,0-.634,1.452c-.836,2.087-2.237,5.579-4.244,7.2-1.849,1.49-4.443,1.415-6.769-.195-1.338-.926-2.791-3.36-3.851-5.137a14.562,14.562,0,0,0-1.042-1.626c-.419-.366-.636-.256-.708-.219a2.491,2.491,0,0,0-.75,2.165c.255,2.6,2.343,4.865,3.868,6.517A19.046,19.046,0,0,1,47.6,44.427h0a14.18,14.18,0,0,1,2.84,7.088,40.62,40.62,0,0,1-.076,5.3c-.038.651-.076,1.3-.1,1.959-.077,1.932-.255,3.9-.427,5.8Q49.787,65.15,49.735,65.731Z"
                                          transform="translate(-33.418 -29.109)" fill="#FFF"/>
                                    <circle id="Ellipse_50" data-name="Ellipse 50" cx="3.438" cy="3.438" r="3.438"
                                            transform="translate(15.236 2.306)" fill="#33d6d6"/>
                                    <path id="Tracé_815" data-name="Tracé 815"
                                          d="M63.823,37.428h-.049a4.125,4.125,0,0,1-4.1-4.11A4.056,4.056,0,0,1,63.8,29.188h0a4.1,4.1,0,0,1,4.1,4.079,4.15,4.15,0,0,1-1.239,2.978A4.025,4.025,0,0,1,63.823,37.428Zm-.019-7.2a3.04,3.04,0,0,0-3.09,3.1,3.086,3.086,0,0,0,3.073,3.067,3.016,3.016,0,0,0,2.154-.882,3.121,3.121,0,0,0,.932-2.24,3.064,3.064,0,0,0-3.067-3.044Zm0-.518h0Z"
                                          transform="translate(-45.033 -27.869)" fill="#FFF"/>
                                </svg>
                                <p class="font-allerBold text-sm lg:text-xl text-white text-center">
                                    Optimisme
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Se mettre en mouvement #}
                            {#                            pour relever des défis avec fierté, croire en ses rêves. #}
                            {#                        </p> #}
                        </div>
    
                        <div data-aos="fade-up" data-aos-delay="0"
                             class="flex flex-col items-center gap-4 aos-init aos-animate hidden lg:inline-block">
                            <div class="flex flex-row items-center gap-6">
                                <svg class="hidden" xmlns="http://www.w3.org/2000/svg" width="40" height="40"
                                     viewBox="0 0 40 40">
                                    <g data-name="icon values-5" transform="translate(0)">
                                        <g data-name="Groupe 929" transform="translate(0)">
                                            <path data-name="Tracé 832"
                                                  d="M71.686,14.539a.481.481,0,0,1-.486-.475V8.724a.486.486,0,0,1,.972,0v5.34A.481.481,0,0,1,71.686,14.539Z"
                                                  transform="translate(-48.756 -8.248)" fill="#FFF"/>
                                            <path data-name="Tracé 833"
                                                  d="M58.081,21.321a.485.485,0,0,1-.469-.352l-.707-2.579a.474.474,0,0,1,.344-.582.489.489,0,0,1,.6.336l.706,2.579a.474.474,0,0,1-.344.582A.5.5,0,0,1,58.081,21.321Z"
                                                  transform="translate(-39.547 -14.464)" fill="#ffc200"/>
                                            <path data-name="Tracé 834"
                                                  d="M34.518,34.94a.491.491,0,0,1-.344-.139l-1.931-1.888a.468.468,0,0,1,0-.672.494.494,0,0,1,.687,0l1.931,1.888a.468.468,0,0,1,0,.672A.491.491,0,0,1,34.518,34.94Z"
                                                  transform="translate(-23.597 -23.785)" fill="#FFF"/>
                                            <path data-name="Tracé 835"
                                                  d="M20.914,58.531a.493.493,0,0,1-.126-.016l-2.637-.691a.474.474,0,0,1-.344-.582.487.487,0,0,1,.6-.336l2.637.691a.474.474,0,0,1,.344.582A.485.485,0,0,1,20.914,58.531Z"
                                                  transform="translate(-14.388 -39.93)" fill="#ffc200"/>
                                            <path data-name="Tracé 836"
                                                  d="M18.276,85.171a.485.485,0,0,1-.469-.352.474.474,0,0,1,.344-.582l2.637-.691a.487.487,0,0,1,.6.336.474.474,0,0,1-.344.582l-2.637.691A.493.493,0,0,1,18.276,85.171Z"
                                                  transform="translate(-14.388 -57.281)" fill="#FFF"/>
                                            <path data-name="Tracé 837"
                                                  d="M32.588,107.722a.489.489,0,0,1-.344-.139.468.468,0,0,1,0-.672l1.931-1.888a.493.493,0,0,1,.687,0,.468.468,0,0,1,0,.672l-1.931,1.888A.489.489,0,0,1,32.588,107.722Z"
                                                  transform="translate(-23.597 -71.19)" fill="#ffc200"/>
                                            <path data-name="Tracé 838"
                                                  d="M57.376,120.743a.493.493,0,0,1-.126-.016.474.474,0,0,1-.344-.582l.707-2.579a.487.487,0,0,1,.6-.336.474.474,0,0,1,.344.582l-.706,2.579A.485.485,0,0,1,57.376,120.743Z"
                                                  transform="translate(-39.547 -79.221)" fill="#FFF"/>
                                            <path data-name="Tracé 839"
                                                  d="M84.722,120.743a.485.485,0,0,1-.469-.352l-.707-2.579a.475.475,0,0,1,.344-.582.487.487,0,0,1,.6.336l.707,2.579a.475.475,0,0,1-.344.582A.494.494,0,0,1,84.722,120.743Z"
                                                  transform="translate(-56.689 -79.22)" fill="#ffc200"/>
                                            <path data-name="Tracé 841"
                                                  d="M120.337,85.171a.5.5,0,0,1-.126-.016l-2.637-.691a.475.475,0,0,1-.344-.582.486.486,0,0,1,.6-.336l2.637.691a.475.475,0,0,1,.344.582A.485.485,0,0,1,120.337,85.171Z"
                                                  transform="translate(-78.363 -57.281)" fill="#ffc200"/>
                                            <path data-name="Tracé 840"
                                                  d="M107.3,107.722a.489.489,0,0,1-.344-.139l-1.931-1.888a.468.468,0,0,1,0-.672.493.493,0,0,1,.687,0l1.931,1.888a.468.468,0,0,1,0,.672A.488.488,0,0,1,107.3,107.722Z"
                                                  transform="translate(-70.43 -71.19)" fill="#FFF"/>
                                            <path data-name="Tracé 843"
                                                  d="M105.37,34.941a.491.491,0,0,1-.344-.139.468.468,0,0,1,0-.672l1.931-1.888a.494.494,0,0,1,.687,0,.468.468,0,0,1,0,.672L105.713,34.8A.49.49,0,0,1,105.37,34.941Z"
                                                  transform="translate(-70.429 -23.785)" fill="#ffc200"/>
                                            <path data-name="Tracé 842"
                                                  d="M117.7,58.531a.484.484,0,0,1-.469-.352.475.475,0,0,1,.344-.582l2.637-.691a.487.487,0,0,1,.6.336.475.475,0,0,1-.344.582l-2.637.691A.5.5,0,0,1,117.7,58.531Z"
                                                  transform="translate(-78.363 -39.93)" fill="#FFF"/>
                                            <path data-name="Tracé 844"
                                                  d="M84.016,21.32a.5.5,0,0,1-.126-.016.475.475,0,0,1-.344-.582l.707-2.579a.486.486,0,0,1,.6-.336.475.475,0,0,1,.344.582l-.707,2.579A.485.485,0,0,1,84.016,21.32Z"
                                                  transform="translate(-56.689 -14.463)" fill="#FFF"/>
                                            <path data-name="Tracé 845"
                                                  d="M42.941,22.258a.488.488,0,0,1-.422-.238L39.789,17.4a.47.47,0,0,1,.178-.649.492.492,0,0,1,.664.174l2.73,4.625a.47.47,0,0,1-.178.649A.492.492,0,0,1,42.941,22.258Z"
                                                  transform="translate(-28.502 -13.741)" fill="#FFF"/>
                                            <path data-name="Tracé 846"
                                                  d="M21.9,43.345a.492.492,0,0,1-.242-.064l-4.729-2.67a.47.47,0,0,1-.178-.649.492.492,0,0,1,.664-.174l4.729,2.67a.47.47,0,0,1,.178.649A.488.488,0,0,1,21.9,43.345Z"
                                                  transform="translate(-13.675 -28.749)" fill="#FFF"/>
                                            <path data-name="Tracé 848"
                                                  d="M17.169,98.639a.489.489,0,0,1-.422-.238.47.47,0,0,1,.178-.65l4.729-2.67a.492.492,0,0,1,.664.174.47.47,0,0,1-.178.65l-4.729,2.67A.491.491,0,0,1,17.169,98.639Z"
                                                  transform="translate(-13.675 -64.764)" fill="#FFF"/>
                                            <path data-name="Tracé 847"
                                                  d="M14.2,72.151H8.734a.475.475,0,1,1,0-.951H14.2a.475.475,0,1,1,0,.951Z"
                                                  transform="translate(-8.248 -49.252)" fill="#FFF"/>
                                            <path data-name="Tracé 849"
                                                  d="M40.21,118.03a.492.492,0,0,1-.242-.064.47.47,0,0,1-.178-.649l2.73-4.625a.492.492,0,0,1,.664-.174.47.47,0,0,1,.178.649l-2.73,4.625A.489.489,0,0,1,40.21,118.03Z"
                                                  transform="translate(-28.502 -76.122)" fill="#FFF"/>
                                            <path data-name="Tracé 850"
                                                  d="M71.686,125.128a.48.48,0,0,1-.486-.475v-5.34a.486.486,0,0,1,.972,0v5.34A.481.481,0,0,1,71.686,125.128Z"
                                                  transform="translate(-48.756 -80.279)" fill="#FFF"/>
                                            <path data-name="Tracé 852"
                                                  d="M117.669,98.64a.493.493,0,0,1-.243-.064l-4.729-2.67a.47.47,0,0,1-.178-.65.493.493,0,0,1,.664-.174l4.729,2.67a.47.47,0,0,1,.178.65A.488.488,0,0,1,117.669,98.64Z"
                                                  transform="translate(-75.301 -64.765)" fill="#FFF"/>
                                            <path data-name="Tracé 851"
                                                  d="M98.235,118.03a.489.489,0,0,1-.421-.238l-2.73-4.625a.47.47,0,0,1,.178-.65.493.493,0,0,1,.664.174l2.73,4.625a.47.47,0,0,1-.178.649A.492.492,0,0,1,98.235,118.03Z"
                                                  transform="translate(-64.081 -76.122)" fill="#FFF"/>
                                            <path data-name="Tracé 853"
                                                  d="M124.784,72.151h-5.461a.475.475,0,1,1,0-.951h5.461a.475.475,0,1,1,0,.951Z"
                                                  transform="translate(-79.408 -49.252)" fill="#FFF"/>
                                            <path data-name="Tracé 854"
                                                  d="M112.941,43.345a.488.488,0,0,1-.421-.238.47.47,0,0,1,.178-.649l4.729-2.67a.492.492,0,0,1,.664.174.47.47,0,0,1-.178.649l-4.729,2.67A.492.492,0,0,1,112.941,43.345Z"
                                                  transform="translate(-75.301 -28.75)" fill="#FFF"/>
                                            <path data-name="Tracé 855"
                                                  d="M95.5,22.258a.493.493,0,0,1-.243-.064.47.47,0,0,1-.178-.649l2.73-4.625a.492.492,0,0,1,.664-.174.47.47,0,0,1,.178.649l-2.73,4.625A.488.488,0,0,1,95.5,22.258Z"
                                                  transform="translate(-64.081 -13.741)" fill="#FFF"/>
                                        </g>
                                        <path data-name="Tracé 831"
                                              d="M48.56,62.389A14.152,14.152,0,1,1,63.028,48.241,14.327,14.327,0,0,1,48.56,62.389Zm0-27.294A13.149,13.149,0,1,0,62,48.24,13.312,13.312,0,0,0,48.56,35.095Z"
                                              transform="translate(-25.629 -25.817)" fill="#FFF"/>
                                        <g data-name="Groupe 930" transform="translate(13.756 13.066)">
                                            <g id="Groupe_920" data-name="Groupe 920" transform="translate(10.302 7.502)">
                                                <path data-name="Tracé 856"
                                                      d="M75.6,75.222a7.742,7.742,0,0,1,6.489-7.612,3.308,3.308,0,0,1,.336-.044.75.75,0,1,1,.134,1.493,6.145,6.145,0,0,0-3.1,1.311,6.219,6.219,0,0,0-1.889,7.2,1.149,1.149,0,0,1,.082.525.7.7,0,0,1-.623.611.735.735,0,0,1-.785-.431,6.927,6.927,0,0,1-.536-1.876C75.656,76.011,75.634,75.615,75.6,75.222Z"
                                                      transform="translate(-75.599 -67.565)" fill="#FFF"/>
                                                <path data-name="Tracé 857"
                                                      d="M88.482,88.205a1.068,1.068,0,1,1-1.062-1.063A1.053,1.053,0,0,1,88.482,88.205Z"
                                                      transform="translate(-82.354 -79.871)" fill="#FFF"/>
                                                <path data-name="Tracé 858"
                                                      d="M92.59,78.2a1.055,1.055,0,0,1,1.063,1.064,1.067,1.067,0,1,1-2.135-.011A1.052,1.052,0,0,1,92.59,78.2Z"
                                                      transform="translate(-85.605 -74.251)" fill="#FFF"/>
                                            </g>
                                            <g data-name="Groupe 924" transform="translate(0 7.496)">
                                                <path data-name="Tracé 859"
                                                      d="M52.844,68.556a7.742,7.742,0,0,1,3.238,9.464,3.309,3.309,0,0,1-.134.311.75.75,0,1,1-1.353-.646,6.145,6.145,0,0,0,.453-3.334,6.082,6.082,0,0,0-2.3-4.02,6.143,6.143,0,0,0-2.937-1.277,1.148,1.148,0,0,1-.494-.2.7.7,0,0,1-.208-.848.735.735,0,0,1,.771-.455,6.926,6.926,0,0,1,1.887.5C52.137,68.2,52.488,68.386,52.844,68.556Z"
                                                      transform="translate(-48.61 -67.548)" fill="#33d6d6"/>
                                                <path data-name="Tracé 860"
                                                      d="M48.389,80.162a1.068,1.068,0,1,1,1.456-.372A1.053,1.053,0,0,1,48.389,80.162Z"
                                                      transform="translate(-47.861 -74.228)" fill="#33d6d6"/>
                                                <path data-name="Tracé 861"
                                                      d="M54.9,88.8a1.055,1.055,0,0,1-1.457.371,1.067,1.067,0,1,1,1.1-1.831A1.052,1.052,0,0,1,54.9,88.8Z"
                                                      transform="translate(-51.043 -79.889)" fill="#33d6d6"/>
                                            </g>
                                            <g data-name="Groupe 928" transform="translate(2.421)">
                                                <path data-name="Tracé 862"
                                                      d="M64.565,57.415A7.742,7.742,0,0,1,54.728,55.6a3.308,3.308,0,0,1-.206-.269.75.75,0,1,1,1.226-.863A6.145,6.145,0,0,0,58.433,56.5a6.219,6.219,0,0,0,7.182-1.966,1.148,1.148,0,0,1,.414-.334.7.7,0,0,1,.841.234.735.735,0,0,1,.019.895,6.927,6.927,0,0,1-1.357,1.4C65.219,56.971,64.888,57.187,64.565,57.415Z"
                                                      transform="translate(-54.38 -51.624)" fill="#ffc200"/>
                                                <path data-name="Tracé 863"
                                                      d="M74.227,47.513a1.068,1.068,0,1,1-.389,1.452A1.053,1.053,0,0,1,74.227,47.513Z"
                                                      transform="translate(-66.519 -47.368)" fill="#ffc200"/>
                                                <path data-name="Tracé 864"
                                                      d="M63.513,48.962a1.055,1.055,0,0,1,.39-1.452,1.067,1.067,0,1,1,1.058,1.854A1.052,1.052,0,0,1,63.513,48.962Z"
                                                      transform="translate(-60.03 -47.367)" fill="#ffc200"/>
                                            </g>
                                        </g>
                                    </g>
                                </svg>
                                <p class="hidden font-allerBold text-sm lg:text-xl text-white text-center">
                                    Optimisme
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Croire dans le potentiel de chacun, transmettre #}
                            {#                            une énergie positive, trouver des opportunités et des solutions à chaque situation.</p> #}
                        </div>
    
                        <svg class="lg:hidden" xmlns="http://www.w3.org/2000/svg" width="500" height="1.424"
                             viewBox="0 0 250 1.424">
                            <line data-name="Ligne 11" y1="0.424" x2="260.5" transform="translate(0.001 0.5)"
                                  fill="none" stroke="#dcdcdc" stroke-width="1"/>
                        </svg>
    
                        <div data-aos="fade-up" data-aos-delay="0"
                             class="flex flex-col  items-center gap-4 aos-init aos-animate">
                            <div class="flex flex-row items-center gap-6">
                                <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
                                    <g data-name="icon values-5" transform="translate(0)">
                                        <g data-name="Groupe 929" transform="translate(0)">
                                            <path data-name="Tracé 832"
                                                  d="M71.686,14.539a.481.481,0,0,1-.486-.475V8.724a.486.486,0,0,1,.972,0v5.34A.481.481,0,0,1,71.686,14.539Z"
                                                  transform="translate(-48.756 -8.248)" fill="#FFF"/>
                                            <path data-name="Tracé 833"
                                                  d="M58.081,21.321a.485.485,0,0,1-.469-.352l-.707-2.579a.474.474,0,0,1,.344-.582.489.489,0,0,1,.6.336l.706,2.579a.474.474,0,0,1-.344.582A.5.5,0,0,1,58.081,21.321Z"
                                                  transform="translate(-39.547 -14.464)" fill="#ffc200"/>
                                            <path data-name="Tracé 834"
                                                  d="M34.518,34.94a.491.491,0,0,1-.344-.139l-1.931-1.888a.468.468,0,0,1,0-.672.494.494,0,0,1,.687,0l1.931,1.888a.468.468,0,0,1,0,.672A.491.491,0,0,1,34.518,34.94Z"
                                                  transform="translate(-23.597 -23.785)" fill="#FFF"/>
                                            <path data-name="Tracé 835"
                                                  d="M20.914,58.531a.493.493,0,0,1-.126-.016l-2.637-.691a.474.474,0,0,1-.344-.582.487.487,0,0,1,.6-.336l2.637.691a.474.474,0,0,1,.344.582A.485.485,0,0,1,20.914,58.531Z"
                                                  transform="translate(-14.388 -39.93)" fill="#ffc200"/>
                                            <path data-name="Tracé 836"
                                                  d="M18.276,85.171a.485.485,0,0,1-.469-.352.474.474,0,0,1,.344-.582l2.637-.691a.487.487,0,0,1,.6.336.474.474,0,0,1-.344.582l-2.637.691A.493.493,0,0,1,18.276,85.171Z"
                                                  transform="translate(-14.388 -57.281)" fill="#FFF"/>
                                            <path data-name="Tracé 837"
                                                  d="M32.588,107.722a.489.489,0,0,1-.344-.139.468.468,0,0,1,0-.672l1.931-1.888a.493.493,0,0,1,.687,0,.468.468,0,0,1,0,.672l-1.931,1.888A.489.489,0,0,1,32.588,107.722Z"
                                                  transform="translate(-23.597 -71.19)" fill="#ffc200"/>
                                            <path data-name="Tracé 838"
                                                  d="M57.376,120.743a.493.493,0,0,1-.126-.016.474.474,0,0,1-.344-.582l.707-2.579a.487.487,0,0,1,.6-.336.474.474,0,0,1,.344.582l-.706,2.579A.485.485,0,0,1,57.376,120.743Z"
                                                  transform="translate(-39.547 -79.221)" fill="#FFF"/>
                                            <path data-name="Tracé 839"
                                                  d="M84.722,120.743a.485.485,0,0,1-.469-.352l-.707-2.579a.475.475,0,0,1,.344-.582.487.487,0,0,1,.6.336l.707,2.579a.475.475,0,0,1-.344.582A.494.494,0,0,1,84.722,120.743Z"
                                                  transform="translate(-56.689 -79.22)" fill="#ffc200"/>
                                            <path data-name="Tracé 841"
                                                  d="M120.337,85.171a.5.5,0,0,1-.126-.016l-2.637-.691a.475.475,0,0,1-.344-.582.486.486,0,0,1,.6-.336l2.637.691a.475.475,0,0,1,.344.582A.485.485,0,0,1,120.337,85.171Z"
                                                  transform="translate(-78.363 -57.281)" fill="#ffc200"/>
                                            <path data-name="Tracé 840"
                                                  d="M107.3,107.722a.489.489,0,0,1-.344-.139l-1.931-1.888a.468.468,0,0,1,0-.672.493.493,0,0,1,.687,0l1.931,1.888a.468.468,0,0,1,0,.672A.488.488,0,0,1,107.3,107.722Z"
                                                  transform="translate(-70.43 -71.19)" fill="#FFF"/>
                                            <path data-name="Tracé 843"
                                                  d="M105.37,34.941a.491.491,0,0,1-.344-.139.468.468,0,0,1,0-.672l1.931-1.888a.494.494,0,0,1,.687,0,.468.468,0,0,1,0,.672L105.713,34.8A.49.49,0,0,1,105.37,34.941Z"
                                                  transform="translate(-70.429 -23.785)" fill="#ffc200"/>
                                            <path data-name="Tracé 842"
                                                  d="M117.7,58.531a.484.484,0,0,1-.469-.352.475.475,0,0,1,.344-.582l2.637-.691a.487.487,0,0,1,.6.336.475.475,0,0,1-.344.582l-2.637.691A.5.5,0,0,1,117.7,58.531Z"
                                                  transform="translate(-78.363 -39.93)" fill="#FFF"/>
                                            <path data-name="Tracé 844"
                                                  d="M84.016,21.32a.5.5,0,0,1-.126-.016.475.475,0,0,1-.344-.582l.707-2.579a.486.486,0,0,1,.6-.336.475.475,0,0,1,.344.582l-.707,2.579A.485.485,0,0,1,84.016,21.32Z"
                                                  transform="translate(-56.689 -14.463)" fill="#FFF"/>
                                            <path data-name="Tracé 845"
                                                  d="M42.941,22.258a.488.488,0,0,1-.422-.238L39.789,17.4a.47.47,0,0,1,.178-.649.492.492,0,0,1,.664.174l2.73,4.625a.47.47,0,0,1-.178.649A.492.492,0,0,1,42.941,22.258Z"
                                                  transform="translate(-28.502 -13.741)" fill="#FFF"/>
                                            <path data-name="Tracé 846"
                                                  d="M21.9,43.345a.492.492,0,0,1-.242-.064l-4.729-2.67a.47.47,0,0,1-.178-.649.492.492,0,0,1,.664-.174l4.729,2.67a.47.47,0,0,1,.178.649A.488.488,0,0,1,21.9,43.345Z"
                                                  transform="translate(-13.675 -28.749)" fill="#FFF"/>
                                            <path data-name="Tracé 848"
                                                  d="M17.169,98.639a.489.489,0,0,1-.422-.238.47.47,0,0,1,.178-.65l4.729-2.67a.492.492,0,0,1,.664.174.47.47,0,0,1-.178.65l-4.729,2.67A.491.491,0,0,1,17.169,98.639Z"
                                                  transform="translate(-13.675 -64.764)" fill="#FFF"/>
                                            <path data-name="Tracé 847"
                                                  d="M14.2,72.151H8.734a.475.475,0,1,1,0-.951H14.2a.475.475,0,1,1,0,.951Z"
                                                  transform="translate(-8.248 -49.252)" fill="#FFF"/>
                                            <path data-name="Tracé 849"
                                                  d="M40.21,118.03a.492.492,0,0,1-.242-.064.47.47,0,0,1-.178-.649l2.73-4.625a.492.492,0,0,1,.664-.174.47.47,0,0,1,.178.649l-2.73,4.625A.489.489,0,0,1,40.21,118.03Z"
                                                  transform="translate(-28.502 -76.122)" fill="#FFF"/>
                                            <path data-name="Tracé 850"
                                                  d="M71.686,125.128a.48.48,0,0,1-.486-.475v-5.34a.486.486,0,0,1,.972,0v5.34A.481.481,0,0,1,71.686,125.128Z"
                                                  transform="translate(-48.756 -80.279)" fill="#FFF"/>
                                            <path data-name="Tracé 852"
                                                  d="M117.669,98.64a.493.493,0,0,1-.243-.064l-4.729-2.67a.47.47,0,0,1-.178-.65.493.493,0,0,1,.664-.174l4.729,2.67a.47.47,0,0,1,.178.65A.488.488,0,0,1,117.669,98.64Z"
                                                  transform="translate(-75.301 -64.765)" fill="#FFF"/>
                                            <path data-name="Tracé 851"
                                                  d="M98.235,118.03a.489.489,0,0,1-.421-.238l-2.73-4.625a.47.47,0,0,1,.178-.65.493.493,0,0,1,.664.174l2.73,4.625a.47.47,0,0,1-.178.649A.492.492,0,0,1,98.235,118.03Z"
                                                  transform="translate(-64.081 -76.122)" fill="#FFF"/>
                                            <path data-name="Tracé 853"
                                                  d="M124.784,72.151h-5.461a.475.475,0,1,1,0-.951h5.461a.475.475,0,1,1,0,.951Z"
                                                  transform="translate(-79.408 -49.252)" fill="#FFF"/>
                                            <path data-name="Tracé 854"
                                                  d="M112.941,43.345a.488.488,0,0,1-.421-.238.47.47,0,0,1,.178-.649l4.729-2.67a.492.492,0,0,1,.664.174.47.47,0,0,1-.178.649l-4.729,2.67A.492.492,0,0,1,112.941,43.345Z"
                                                  transform="translate(-75.301 -28.75)" fill="#FFF"/>
                                            <path data-name="Tracé 855"
                                                  d="M95.5,22.258a.493.493,0,0,1-.243-.064.47.47,0,0,1-.178-.649l2.73-4.625a.492.492,0,0,1,.664-.174.47.47,0,0,1,.178.649l-2.73,4.625A.488.488,0,0,1,95.5,22.258Z"
                                                  transform="translate(-64.081 -13.741)" fill="#FFF"/>
                                        </g>
                                        <path data-name="Tracé 831"
                                              d="M48.56,62.389A14.152,14.152,0,1,1,63.028,48.241,14.327,14.327,0,0,1,48.56,62.389Zm0-27.294A13.149,13.149,0,1,0,62,48.24,13.312,13.312,0,0,0,48.56,35.095Z"
                                              transform="translate(-25.629 -25.817)" fill="#FFF"/>
                                        <g data-name="Groupe 930" transform="translate(13.756 13.066)">
                                            <g id="Groupe_920" data-name="Groupe 920" transform="translate(10.302 7.502)">
                                                <path data-name="Tracé 856"
                                                      d="M75.6,75.222a7.742,7.742,0,0,1,6.489-7.612,3.308,3.308,0,0,1,.336-.044.75.75,0,1,1,.134,1.493,6.145,6.145,0,0,0-3.1,1.311,6.219,6.219,0,0,0-1.889,7.2,1.149,1.149,0,0,1,.082.525.7.7,0,0,1-.623.611.735.735,0,0,1-.785-.431,6.927,6.927,0,0,1-.536-1.876C75.656,76.011,75.634,75.615,75.6,75.222Z"
                                                      transform="translate(-75.599 -67.565)" fill="#FFF"/>
                                                <path data-name="Tracé 857"
                                                      d="M88.482,88.205a1.068,1.068,0,1,1-1.062-1.063A1.053,1.053,0,0,1,88.482,88.205Z"
                                                      transform="translate(-82.354 -79.871)" fill="#FFF"/>
                                                <path data-name="Tracé 858"
                                                      d="M92.59,78.2a1.055,1.055,0,0,1,1.063,1.064,1.067,1.067,0,1,1-2.135-.011A1.052,1.052,0,0,1,92.59,78.2Z"
                                                      transform="translate(-85.605 -74.251)" fill="#FFF"/>
                                            </g>
                                            <g data-name="Groupe 924" transform="translate(0 7.496)">
                                                <path data-name="Tracé 859"
                                                      d="M52.844,68.556a7.742,7.742,0,0,1,3.238,9.464,3.309,3.309,0,0,1-.134.311.75.75,0,1,1-1.353-.646,6.145,6.145,0,0,0,.453-3.334,6.082,6.082,0,0,0-2.3-4.02,6.143,6.143,0,0,0-2.937-1.277,1.148,1.148,0,0,1-.494-.2.7.7,0,0,1-.208-.848.735.735,0,0,1,.771-.455,6.926,6.926,0,0,1,1.887.5C52.137,68.2,52.488,68.386,52.844,68.556Z"
                                                      transform="translate(-48.61 -67.548)" fill="#33d6d6"/>
                                                <path data-name="Tracé 860"
                                                      d="M48.389,80.162a1.068,1.068,0,1,1,1.456-.372A1.053,1.053,0,0,1,48.389,80.162Z"
                                                      transform="translate(-47.861 -74.228)" fill="#33d6d6"/>
                                                <path data-name="Tracé 861"
                                                      d="M54.9,88.8a1.055,1.055,0,0,1-1.457.371,1.067,1.067,0,1,1,1.1-1.831A1.052,1.052,0,0,1,54.9,88.8Z"
                                                      transform="translate(-51.043 -79.889)" fill="#33d6d6"/>
                                            </g>
                                            <g data-name="Groupe 928" transform="translate(2.421)">
                                                <path data-name="Tracé 862"
                                                      d="M64.565,57.415A7.742,7.742,0,0,1,54.728,55.6a3.308,3.308,0,0,1-.206-.269.75.75,0,1,1,1.226-.863A6.145,6.145,0,0,0,58.433,56.5a6.219,6.219,0,0,0,7.182-1.966,1.148,1.148,0,0,1,.414-.334.7.7,0,0,1,.841.234.735.735,0,0,1,.019.895,6.927,6.927,0,0,1-1.357,1.4C65.219,56.971,64.888,57.187,64.565,57.415Z"
                                                      transform="translate(-54.38 -51.624)" fill="#ffc200"/>
                                                <path data-name="Tracé 863"
                                                      d="M74.227,47.513a1.068,1.068,0,1,1-.389,1.452A1.053,1.053,0,0,1,74.227,47.513Z"
                                                      transform="translate(-66.519 -47.368)" fill="#ffc200"/>
                                                <path data-name="Tracé 864"
                                                      d="M63.513,48.962a1.055,1.055,0,0,1,.39-1.452,1.067,1.067,0,1,1,1.058,1.854A1.052,1.052,0,0,1,63.513,48.962Z"
                                                      transform="translate(-60.03 -47.367)" fill="#ffc200"/>
                                            </g>
                                        </g>
                                    </g>
                                </svg>
                                <p class="font-allerBold text-sm lg:text-xl text-white text-center">
                                    Audace
                                </p>
                            </div>
                            {#                        <p class="hidden lg:block font-allerRegular text-sm">Croire dans le potentiel de chacun, transmettre #}
                            {#                            une énergie positive, trouver des opportunités et des solutions à chaque situation.</p> #}
                        </div>
    
    
                        {#                    <svg class="lg:hidden" xmlns="http://www.w3.org/2000/svg" width="260.502" height="1.424" #}
                        {#                         viewBox="0 0 260.502 1.424"> #}
                        {#                        <line data-name="Ligne 11" y1="0.424" x2="260.5" transform="translate(0.001 0.5)" #}
                        {#                              fill="none" stroke="#dcdcdc" stroke-width="1"/> #}
                        {#                    </svg> #}
    
                        {#                    <div data-aos="fade-up" data-aos-delay="500" class="flex flex-col gap-4"> #}
                        {#                        <div class="flex flex-row items-center gap-6"> #}
                        {#                            <svg id="icon_values-1" data-name="icon values-1" xmlns="http://www.w3.org/2000/svg" #}
                        {#                                 width="40.037" height="37.269" viewBox="0 0 40.037 37.269"> #}
                        {#                                <path id="Tracé_798" data-name="Tracé 798" #}
                        {#                                      d="M112.351,76.244a3.917,3.917,0,0,1,2.256,5.193,3.759,3.759,0,0,1-4.723,2.005,4.02,4.02,0,0,1-2.1-4.835A3.781,3.781,0,0,1,112.351,76.244Z" #}
                        {#                                      transform="translate(-82.43 -62.916)" fill="#33d6d6"/> #}
                        {#                                <path id="Tracé_799" data-name="Tracé 799" #}
                        {#                                      d="M110.169,83.159a3.714,3.714,0,0,1-1.426-.278,4.471,4.471,0,0,1-2.351-5.389,4.226,4.226,0,0,1,5.127-2.641h0a4.052,4.052,0,0,1,2.444,2.208,4.53,4.53,0,0,1,.083,3.581A4.274,4.274,0,0,1,110.169,83.159Zm.217-7.6a3.428,3.428,0,0,0-3.154,2.219,3.594,3.594,0,0,0,1.851,4.281,3.337,3.337,0,0,0,4.145-1.769,3.675,3.675,0,0,0-.074-2.866,3.14,3.14,0,0,0-1.912-1.731h0A2.742,2.742,0,0,0,110.386,75.56Z" #}
                        {#                                      transform="translate(-81.459 -61.943)" fill="#FFF"/> #}
                        {#                                <path id="Tracé_800" data-name="Tracé 800" #}
                        {#                                      d="M88.949,38.953a3.7,3.7,0,0,1-2.109,3.611,3.493,3.493,0,0,1-3.964-.959,3.9,3.9,0,0,1-.43-4.218,3.643,3.643,0,0,1,3.664-1.878A3.74,3.74,0,0,1,88.949,38.953Z" #}
                        {#                                      transform="translate(-64.87 -35.028)" fill="#33d6d6"/> #}
                        {#                                <path id="Tracé_801" data-name="Tracé 801" #}
                        {#                                      d="M62.649,78.057A4.18,4.18,0,0,1,61.5,82.045a3.662,3.662,0,0,1-3.936.662,3.807,3.807,0,0,1-2.14-3.479A4.1,4.1,0,0,1,56.7,76.414a4.71,4.71,0,0,1,2.769-1.246A3.9,3.9,0,0,1,62.649,78.057Z" #}
                        {#                                      transform="translate(-46.608 -62.285)" fill="#ffc200"/> #}
                        {#                                <path id="Tracé_802" data-name="Tracé 802" #}
                        {#                                      d="M58.037,82.479a3.913,3.913,0,0,1-1.63-.351,4.251,4.251,0,0,1-2.4-3.894,4.525,4.525,0,0,1,1.409-3.124,5.152,5.152,0,0,1,3.03-1.367l.063-.007.062.011a4.365,4.365,0,0,1,3.534,3.218h0a4.636,4.636,0,0,1-1.278,4.423A4.121,4.121,0,0,1,58.037,82.479Zm.438-7.845a4.253,4.253,0,0,0-2.445,1.118,3.681,3.681,0,0,0-1.135,2.5,3.34,3.34,0,0,0,1.88,3.063,3.227,3.227,0,0,0,3.45-.583,3.725,3.725,0,0,0,1.02-3.555h0A3.436,3.436,0,0,0,58.475,74.634Z" #}
                        {#                                      transform="translate(-45.635 -61.303)" fill="#FFF"/> #}
                        {#                                <path id="Tracé_803" data-name="Tracé 803" #}
                        {#                                      d="M71.39,84.19c-.061-.479-.245-1.937-1.584-2.215a2,2,0,0,0-1.9.7,5.081,5.081,0,0,0-1.041,2.7c-.053.305-.1.594-.171.878a6.3,6.3,0,0,1-4.158,4.521A5.967,5.967,0,0,1,56.7,89.333a6.608,6.608,0,0,1-1.8-5.906.342.342,0,0,1,.023-.069,1.1,1.1,0,0,0-.243-1.3,1.9,1.9,0,0,0-1.93-.336A2.8,2.8,0,0,0,51.2,83.641a6.6,6.6,0,0,0-.174,1.883.442.442,0,0,0-.211.22,7.961,7.961,0,0,1-2.483,3.676,6.585,6.585,0,0,1-2.938.815,7.044,7.044,0,0,1-3.843-.37,4.766,4.766,0,0,1-2-2.041,8.691,8.691,0,0,1-.888-2.924l-.011-.08a3.082,3.082,0,0,0-.937-2.192,1.847,1.847,0,0,0-2.27.152,2.9,2.9,0,0,0-.922,2,6.829,6.829,0,0,0,.231,2.035c.692,3.012,1.721,5.068,3.238,6.469.169.155.345.3.522.452a5.28,5.28,0,0,1,1.086,1.1,5.533,5.533,0,0,1,.6,2.739A8.873,8.873,0,0,0,40.572,100a.444.444,0,0,0,.42.3.445.445,0,0,0,.42-.59,8.091,8.091,0,0,1-.316-2.182,6.261,6.261,0,0,0-.746-3.173,6.029,6.029,0,0,0-1.26-1.3c-.166-.14-.332-.279-.491-.425-1.379-1.274-2.324-3.185-2.975-6.015a6.072,6.072,0,0,1-.21-1.77,2.011,2.011,0,0,1,.612-1.39.982.982,0,0,1,1.166-.115,2.407,2.407,0,0,1,.586,1.6l.011.082a9.551,9.551,0,0,0,.985,3.221,5.656,5.656,0,0,0,2.388,2.416,7.829,7.829,0,0,0,4.329.458,7.435,7.435,0,0,0,3.329-.953,6.848,6.848,0,0,0,2.288-2.895,7.826,7.826,0,0,0,1.152,3.991l.012.015a.441.441,0,0,0-.128.146,4.161,4.161,0,0,1-1.456,1.346,7.58,7.58,0,0,0-1.238.969,5.318,5.318,0,0,0-1.332,2.922,15.185,15.185,0,0,0-.065,3.1.444.444,0,0,0,.443.423h.022a.444.444,0,0,0,.422-.465,14.557,14.557,0,0,1,.056-2.918,4.528,4.528,0,0,1,1.092-2.44,6.831,6.831,0,0,1,1.1-.851,5.168,5.168,0,0,0,1.661-1.53c.3.323.625.62.944.907s.6.538.867.823a7.909,7.909,0,0,1,1.92,6.871.444.444,0,0,0,.345.525.438.438,0,0,0,.091.009.444.444,0,0,0,.435-.354A8.823,8.823,0,0,0,55.3,93.094c-.294-.31-.611-.6-.917-.871a8.563,8.563,0,0,1-1.392-1.463c-.878-1.284-1-2.955-1.062-4.847a6.929,6.929,0,0,1,.131-2.038,1.921,1.921,0,0,1,1.024-1.329,1.027,1.027,0,0,1,1.011.172.216.216,0,0,1,.037.251,1.251,1.251,0,0,0-.093.273,7.52,7.52,0,0,0,2.045,6.727A6.869,6.869,0,0,0,62.8,91.621a7.2,7.2,0,0,0,4.761-5.163c.075-.311.13-.627.183-.933a4.347,4.347,0,0,1,.829-2.264,1.131,1.131,0,0,1,1.052-.417c.334.069.737.3.883,1.456a9,9,0,0,1-1.931,6.738c-.333.4-.713.787-1.081,1.158a12.449,12.449,0,0,0-1.622,1.873,6.875,6.875,0,0,0-.723,5.941.444.444,0,0,0,.838-.294,5.969,5.969,0,0,1,.626-5.158,11.588,11.588,0,0,1,1.511-1.737c.382-.385.778-.784,1.136-1.218A9.9,9.9,0,0,0,71.39,84.19Z" #}
                        {#                                      transform="translate(-32.252 -66.697)" fill="#FFF"/> #}
                        {#                                <g id="Groupe_890" data-name="Groupe 890"> #}
                        {#                                    <path id="Tracé_804" data-name="Tracé 804" #}
                        {#                                          d="M84.586,42.295a3.977,3.977,0,0,1-3.014-1.378A4.371,4.371,0,0,1,81.09,36.2a4.065,4.065,0,0,1,4.123-2.108h0a4.183,4.183,0,0,1,3.215,3.845A4.136,4.136,0,0,1,86.052,42,3.679,3.679,0,0,1,84.586,42.295Zm.076-7.353a3.24,3.24,0,0,0-2.789,1.679,3.452,3.452,0,0,0,.377,3.723,3.034,3.034,0,0,0,3.448.838,3.269,3.269,0,0,0,1.844-3.167,3.32,3.32,0,0,0-2.464-3.041h0A2.77,2.77,0,0,0,84.662,34.941Z" #}
                        {#                                          transform="translate(-63.906 -34.052)" fill="#FFF"/> #}
                        {#                                    <path id="Tracé_805" data-name="Tracé 805" #}
                        {#                                          d="M70.8,51.181a6.894,6.894,0,0,1-3.841-1.166,7.378,7.378,0,0,1-3.066-4.855c-.025-.151-.045-.3-.065-.457a4.985,4.985,0,0,0-.207-1.027,1.114,1.114,0,0,0-.717-.77.444.444,0,0,1-.106-.034.985.985,0,0,0-1.306.477,3.451,3.451,0,0,0-.246,1.822,13.075,13.075,0,0,0,1.282,4.8.444.444,0,0,1-.8.39,13.971,13.971,0,0,1-1.37-5.131,4.238,4.238,0,0,1,.351-2.306,1.869,1.869,0,0,1,2.41-.882,1.965,1.965,0,0,1,1.335,1.331,5.729,5.729,0,0,1,.252,1.212c.019.144.038.287.061.429a6.475,6.475,0,0,0,2.687,4.263,5.971,5.971,0,0,0,4.81.825,4.225,4.225,0,0,0,2.329-1.473A7.425,7.425,0,0,0,75.609,46l.073-.291a6.176,6.176,0,0,1,1.563-3.146,2.819,2.819,0,0,1,2.061-.724,2.049,2.049,0,0,1,1.46.731,3.278,3.278,0,0,1,.58,2.108,9.708,9.708,0,0,1-2.405,6.319.444.444,0,0,1-.663-.591,8.809,8.809,0,0,0,2.181-5.733,2.365,2.365,0,0,0-.379-1.54,1.169,1.169,0,0,0-.838-.408,1.931,1.931,0,0,0-1.4.494,5.41,5.41,0,0,0-1.3,2.708l-.072.288a8.07,8.07,0,0,1-1.163,2.948,5.1,5.1,0,0,1-2.814,1.8A6.62,6.62,0,0,1,70.8,51.181Z" #}
                        {#                                          transform="translate(-49.983 -39.393)" fill="#FFF"/> #}
                        {#                                    <path id="Tracé_806" data-name="Tracé 806" #}
                        {#                                          d="M146.242,49.978h-.009a1.291,1.291,0,0,1-1.282-1.3h0a1.283,1.283,0,0,1,.384-.91,1.226,1.226,0,0,1,.916-.372,1.291,1.291,0,0,1-.009,2.582Zm0-1.619a.329.329,0,0,0-.328.326h0a.328.328,0,0,0,.326.33h0a.328.328,0,0,0,0-.657Z" #}
                        {#                                          transform="translate(-108.084 -43.215)" fill="#33d6d6"/> #}
                        {#                                    <path id="Tracé_807" data-name="Tracé 807" #}
                        {#                                          d="M150.963,39.089a.643.643,0,1,1,.638.647A.643.643,0,0,1,150.963,39.089Z" #}
                        {#                                          transform="translate(-112.212 -37.073)" fill="#33d6d6"/> #}
                        {#                                    <path id="Tracé_808" data-name="Tracé 808" #}
                        {#                                          d="M135.754,39.352h-.014a1.9,1.9,0,0,1-1.322-3.256,1.913,1.913,0,0,1,1.349-.548,1.9,1.9,0,0,1-.013,3.8Zm0-2.747a.845.845,0,0,0-.006,1.69.917.917,0,0,0,.6-.243.845.845,0,0,0-.588-1.447Z" #}
                        {#                                          transform="translate(-100.462 -35.08)" fill="#ffc200"/> #}
                        {#                                    <path id="Tracé_809" data-name="Tracé 809" #}
                        {#                                          d="M37.046,147.337a1.29,1.29,0,0,1-1.251-1.609h0a1.291,1.291,0,1,1,1.251,1.609Zm0-1.62a.329.329,0,0,0-.319.248h0a.328.328,0,1,0,.636.162.328.328,0,0,0-.237-.4A.335.335,0,0,0,37.047,145.717Z" #}
                        {#                                          transform="translate(-33.103 -110.068)" fill="#33d6d6"/> #}
                        {#                                    <path id="Tracé_810" data-name="Tracé 810" #}
                        {#                                          d="M44.31,137.556a.643.643,0,1,1,.465.781A.643.643,0,0,1,44.31,137.556Z" #}
                        {#                                          transform="translate(-38.963 -104.792)" fill="#33d6d6"/> #}
                        {#                                    <path id="Tracé_811" data-name="Tracé 811" #}
                        {#                                          d="M29.2,134.807a1.922,1.922,0,0,1-.471-.059,1.9,1.9,0,0,1-1.375-2.311h0a1.9,1.9,0,1,1,1.847,2.371Zm-.822-2.111h0a.845.845,0,1,0,1.027-.611A.84.84,0,0,0,28.374,132.7Z" #}
                        {#                                          transform="translate(-27.29 -100.625)" fill="#ffc200"/> #}
                        {#                                </g> #}
                        {#                            </svg> #}
                        {#                            <p class="font-allerBold text-xl text-white">Convivialité</p> #}
                        {#                        </div> #}
                        {#                        <p class="hidden lg:block font-allerRegular text-sm">Vivre une expérience de formation humaine et #}
                        {#                            collective, partager des émotions et se laisser surprendre.</p> #}
                        {#                    </div> #}
    
                    </div>
                </div>
            </section>
    
            <section id="price-details">
                <div class="flex flex-col p-vertical p-horizontal gap-16">
                    <div class="flex flex-col gap-8 justify-center items-center lg:gap-12 w-full">
                        <div class="lg:flex lg:justify-center lg:items-stretch lg:gap-16">
                            <div data-aos="fade-down" data-aos-delay="0" id="bloc_ingenierie"
                                 class="relative w-full lg:w-1/2 border-2 border-[#E4E0DF] rounded-lg flex flex-col h-full">
                                <svg class="absolute svg-dispositif" xmlns="http://www.w3.org/2000/svg" width="70.992"
                                     height="70.992" viewBox="0 0 70.992 70.992">
                                    <g data-name="Groupe 1230" transform="translate(0.5 0.5)">
                                        <path data-name="Tracé 1145" d="M35,0A35,35,0,1,1,0,35,35,35,0,0,1,35,0Z"
                                              transform="translate(0)" fill="#FFF" stroke="#ff4696"
                                              stroke-width="1"/>
                                        <g data-name="Groupe 1238" transform="translate(-2.347 -2.347)">
                                            <g data-name="icons menu-4b" transform="translate(11.407 12.201)">
                                                <svg fill="#f4007e" version="1.1" id="Capa_1"
                                                     xmlns="http://www.w3.org/2000/svg"
                                                     xmlns:xlink="http://www.w3.org/1999/xlink"
                                                     viewBox="-60 -50 650.75 610.75" xml:space="preserve" stroke="#f4007e"><g
                                                            id="SVGRepo_bgCarrier" stroke-width="0"></g>
                                                    <g id="SVGRepo_tracerCarrier" stroke-linecap="round"
                                                       stroke-linejoin="round"></g>
                                                    <g id="SVGRepo_iconCarrier">
                                                        <path d="M183.815,265.726c-32.444,0-60.868-21.837-76.306-54.325h102.101v-45.023H95.643c-0.284-3.642-0.437-7.29-0.437-11.016 c0-3.691,0.152-7.384,0.437-10.977h113.969V99.353H107.51c15.438-32.485,43.861-54.315,76.306-54.315 c31.01,0,60.21,20.759,76.2,54.152l40.626-19.418C277.091,30.554,232.329,0,183.815,0c-36.47,0-70.51,16.665-95.851,46.966 C75.219,62.209,65.481,79.995,59.079,99.353H10.108v45.031h40.39c-0.217,3.617-0.329,7.311-0.329,10.977 c0,3.704,0.112,7.351,0.329,11.016h-40.39V211.4h48.971c6.402,19.356,16.14,37.122,28.886,52.351 c25.341,30.303,59.381,46.999,95.851,46.999c48.515,0,93.275-30.55,116.826-79.767l-40.626-19.454 C244.025,244.965,214.825,265.726,183.815,265.726z"></path>
                                                    </g></svg>
                                            </g>
                                        </g>
                                    </g>
                                </svg>
    
                                <div class="bg-pink-500 rounded-t-lg">
                                    <h2 class="uppercase text-white font-allerBold text-center text-2xl px-10 py-8">
                                        Nos offres de formation</h2>
                                </div>
                                <div class="rounded-b-lg p-horizontal lg:px-10 py-8">
                                    {% set priceContent1 %}
                                        <div class="lg:px-5 my-5">
                                            <div class="flex flex-row items-center gap-4 my-3">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="22.005" height="22"
                                                     viewBox="0 0 22.005 22">
                                                    <path data-name="Tracé 90"
                                                          d="M312.812,765.693a11,11,0,1,1,11-11A11,11,0,0,1,312.812,765.693Zm-2.145-12.1a2.751,2.751,0,0,1,4.471-1.551l1.872-1.246a4.952,4.952,0,0,0-8.568,2.8h-1.13v2.2h1.13a4.952,4.952,0,0,0,8.569,2.8l-1.872-1.248a2.75,2.75,0,0,1-4.471-1.549h5.446v-2.2h-5.446Z"
                                                          transform="translate(-301.81 -743.693)" fill="#FF4696"/>
                                                </svg>
                                                <p class="font-allerRegular">
                                                    {% if training.priceInter is defined and training.priceInter is not null %}
                                                        {% if training.hasRemoteSessions %}En présentiel : {% endif %}
                                                        {{ training.priceInter }} €
                                                        {% if training.hasRemoteSessions and training.priceInterRemote is not null %}
                                                            / En distanciel : {{ training.priceInterRemote }} €
                                                        {% endif %}
                                                    {% else %}
                                                        Sur devis
                                                    {% endif %}
                                                </p>
                                            </div>
    
                                            <div class="flex flex-row items-center gap-4 my-3">
                                                <svg data-name="Groupe 66" xmlns="http://www.w3.org/2000/svg" width="20.004"
                                                     height="20" viewBox="0 0 20.004 20">
                                                    <path data-name="Tracé 94"
                                                          d="M312.5,656.092a10,10,0,1,0,10,10A10.012,10.012,0,0,0,312.5,656.092Zm0,18a8,8,0,1,1,8-8A8.011,8.011,0,0,1,312.5,674.092Z"
                                                          transform="translate(-302.5 -656.092)" fill="#FF4696"/>
                                                    <path data-name="Tracé 95" d="M314.678,661.746h-2v6h6v-2h-4Z"
                                                          transform="translate(-304.181 -657.026)" fill="#FF4696"/>
                                                </svg>
                                                {% if training.durationInDayMax != null %}
                                                    <p class=" flex-[8] font-allerRegular">
                                                        De {{ training.durationInDayMin }}
                                                        à {{ training.durationInDayMax }} jours</p>
                                                {% else %}
                                                    {% if training.durationInDayMin == 1 %}
                                                        <p class="flex-[8] font-allerRegular">{{ training.durationInDayMin }}
                                                            jour</p>
                                                    {% else %}
                                                        <p class="flex-[8] font-allerRegular">{{ training.durationInDayMin }}
                                                            jours</p>
                                                    {% endif %}
                                                {% endif %}
                                            </div>
    
                                            {% if training.sessions is not empty %}
                                                <div class="flex flex-row items-center gap-4 my-3">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="22.217"
                                                         viewBox="0 0 20 22.217">
                                                        <path data-name="Tracé 92"
                                                              d="M309.243,787.5h8.889v-2.222h2.223V787.5h1.111a2.223,2.223,0,0,1,2.223,2.222v15.552a2.221,2.221,0,0,1-2.223,2.222H305.91a2.221,2.221,0,0,1-2.222-2.222V789.724a2.223,2.223,0,0,1,2.222-2.222h1.112v-2.222h2.222Zm-3.333,4.443v13.33h15.556v-13.33Zm2.223,3.333h2.222V797.5h-2.222Zm4.444,0H314.8V797.5h-2.223Zm4.444,0h2.223V797.5h-2.223Zm0,4.443h2.223v2.222h-2.223Zm-4.444,0H314.8v2.222h-2.223Zm-4.444,0h2.222v2.222h-2.222Z"
                                                              transform="translate(-303.688 -785.281)" fill="#FF4696"
                                                              fill-rule="evenodd"/>
                                                    </svg>
                                                    <p class="font-allerRegular">
                                                        Prochaine session le {{ training.dateNextSession|date('d/m/y') }}
                                                    </p>
                                                </div>
                                            {% endif %}
    
                                            <div class="flex justify-center items-center">
                                                <a class="price-btn mx-[30px] mt-8 cta big-cta cta-pink text-base"
                                                   data-price="1" href="#formation-form">Je m'inscris</a>
                                            </div>
                                        </div>
                                    {% endset %}
    
                                    {% set priceContent2 %}
                                        <div class="lg:px-5 my-5">
                                            <div class="flex flex-row items-center gap-4 my-3">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="22.005" height="22"
                                                     viewBox="0 0 22.005 22">
                                                    <path data-name="Tracé 90"
                                                          d="M312.812,765.693a11,11,0,1,1,11-11A11,11,0,0,1,312.812,765.693Zm-2.145-12.1a2.751,2.751,0,0,1,4.471-1.551l1.872-1.246a4.952,4.952,0,0,0-8.568,2.8h-1.13v2.2h1.13a4.952,4.952,0,0,0,8.569,2.8l-1.872-1.248a2.75,2.75,0,0,1-4.471-1.549h5.446v-2.2h-5.446Z"
                                                          transform="translate(-301.81 -743.693)" fill="#FF4696"/>
                                                </svg>
                                                <p class="font-allerRegular">
                                                    {% if training.priceIntra is defined and training.priceIntra is not null %}
                                                        {% if training.hasRemoteSessions %}En présentiel : {% endif %}
                                                        {{ training.priceIntra }} €
                                                        {% if training.hasRemoteSessions and training.priceIntraRemote is not null %}
                                                            / En distanciel : {{ training.priceIntraRemote }} €
                                                        {% endif %}
                                                    {% else %}
                                                        Sur devis
                                                    {% endif %}
                                                </p>
                                            </div>
    
                                            <div class="flex flex-row items-center gap-4 my-3">
                                                <svg data-name="Groupe 66" xmlns="http://www.w3.org/2000/svg" width="20.004"
                                                     height="20" viewBox="0 0 20.004 20">
                                                    <path data-name="Tracé 94"
                                                          d="M312.5,656.092a10,10,0,1,0,10,10A10.012,10.012,0,0,0,312.5,656.092Zm0,18a8,8,0,1,1,8-8A8.011,8.011,0,0,1,312.5,674.092Z"
                                                          transform="translate(-302.5 -656.092)" fill="#FF4696"/>
                                                    <path data-name="Tracé 95" d="M314.678,661.746h-2v6h6v-2h-4Z"
                                                          transform="translate(-304.181 -657.026)" fill="#FF4696"/>
                                                </svg>
                                                {% if training.durationInDayMax != null %}
                                                    <p class=" flex-[8] font-allerRegular">
                                                        De {{ training.durationInDayMin }}
                                                        à {{ training.durationInDayMax }} jours</p>
                                                {% else %}
                                                    {% if training.durationInDayMin == 1 %}
                                                        <p class="flex-[8] font-allerRegular">{{ training.durationInDayMin }}
                                                            jour</p>
                                                    {% else %}
                                                        <p class="flex-[8] font-allerRegular">{{ training.durationInDayMin }}
                                                            jours</p>
                                                    {% endif %}
                                                {% endif %}
                                            </div>
    
                                            {% if training.sessions is not empty %}
                                                <div class="flex flex-row items-center gap-4 my-3">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="22.217"
                                                         viewBox="0 0 20 22.217">
                                                        <path data-name="Tracé 92"
                                                              d="M309.243,787.5h8.889v-2.222h2.223V787.5h1.111a2.223,2.223,0,0,1,2.223,2.222v15.552a2.221,2.221,0,0,1-2.223,2.222H305.91a2.221,2.221,0,0,1-2.222-2.222V789.724a2.223,2.223,0,0,1,2.222-2.222h1.112v-2.222h2.222Zm-3.333,4.443v13.33h15.556v-13.33Zm2.223,3.333h2.222V797.5h-2.222Zm4.444,0H314.8V797.5h-2.223Zm4.444,0h2.223V797.5h-2.223Zm0,4.443h2.223v2.222h-2.223Zm-4.444,0H314.8v2.222h-2.223Zm-4.444,0h2.222v2.222h-2.222Z"
                                                              transform="translate(-303.688 -785.281)" fill="#FF4696"
                                                              fill-rule="evenodd"/>
                                                    </svg>
                                                    <p class="font-allerRegular">
                                                        Prochaine session le {{ training.dateNextSession|date('d/m/y') }}
                                                    </p>
                                                </div>
                                            {% endif %}
    
                                            <div class="flex justify-center items-center">
                                                <a class="price-btn mx-[30px] mt-8 cta big-cta cta-pink text-base"
                                                   data-price="2" href="#formation-form">Je m'inscris</a>
                                            </div>
                                        </div>
                                    {% endset %}
    
                                    {% set priceContent3 %}
                                        <div class="my-5">
                                            <p>Vous avez des attentes spécifiques ? Nous créons une solution 100%
                                                personnalisée en fonction de vos objectifs, contraintes et enjeux.</p>
                                            <div class="flex justify-center items-center">
                                                <a class="price-btn mx-[30px] mt-8 cta big-cta cta-pink text-base"
                                                   data-price="3" href="#formation-form">En savoir plus</a>
                                            </div>
                                        </div>
                                    {% endset %}
    
                                    {% include 'components/tabs.html.twig' with {
                                        idPrefix: 'tab-content-price',
                                        tabs: [
                                            { label: 'INTER', content: priceContent1 },
                                            { label: 'INTRA', content: priceContent2 },
                                            { label: 'SUR MESURE', content: priceContent3 },
                                        ]
                                    } %}
                                </div>
                            </div>
                            <div data-aos="fade-up" data-aos-delay="200" id="bloc_program"
                                 class="relative w-full lg:w-1/2 border-2 border-[#E4E0DF] rounded-lg flex flex-col h-full">
                                <svg class="absolute svg-dispositif" xmlns="http://www.w3.org/2000/svg" width="70.992"
                                     height="70.992" viewBox="0 0 70.992 70.992">
                                    <g data-name="Groupe 1230" transform="translate(0.5 0.5)">
                                        <path data-name="Tracé 1145" d="M35,0A35,35,0,1,1,0,35,35,35,0,0,1,35,0Z"
                                              transform="translate(0)" fill="#049ea0" stroke="#049ea0"
                                              stroke-width="1"/>
                                        <g data-name="Groupe 1238" transform="translate(-2.347 -2.347)">
                                            <g data-name="icons menu-4b" transform="translate(11.407 12.201)">
                                                <g data-name="Groupe 1237" transform="translate(10.4 10.609)">
                                                    <g data-name="Groupe 1236">
                                                        <path data-name="Tracé 1151"
                                                              d="M7.542,3.867l13.6,7.875a.755.755,0,0,1,0,1.3L8.527,20.289a2.735,2.735,0,0,0-1.7,2.506h0c0,1.163.984,2.058,2.148,1.387l13.29-7.652-1.521-.984"
                                                              transform="translate(7.924 -3.777)"
                                                              fill="rgba(57,17,17,0)" stroke="#fff"
                                                              stroke-linecap="round" stroke-linejoin="round"
                                                              stroke-miterlimit="10" stroke-width="1.3"/>
                                                        <path data-name="Tracé 1152"
                                                              d="M19.183,24.253,4.73,15.93a1.855,1.855,0,0,1-.85-1.074c-.089-.268-.089-.492-.045-.492a2.75,2.75,0,0,1,1.7-2.551L19.273,3.848"
                                                              transform="translate(-3.806 -3.848)"
                                                              fill="rgba(57,17,17,0)" stroke="#fff"
                                                              stroke-linecap="round" stroke-linejoin="round"
                                                              stroke-miterlimit="10" stroke-width="1.3"/>
                                                        <path data-name="Tracé 1153"
                                                              d="M8.375,13.456,16.25,8.892l-1.521-.984"
                                                              transform="translate(13.938 11.915)"
                                                              fill="rgba(57,17,17,0)" stroke="#fff"
                                                              stroke-linecap="round" stroke-linejoin="round"
                                                              stroke-miterlimit="10" stroke-width="1.3"/>
                                                        <path data-name="Tracé 1154"
                                                              d="M19.183,19.933,4.73,11.566a1.855,1.855,0,0,1-.85-1.074C3.79,10.223,3.79,10,3.835,10a2.75,2.75,0,0,1,1.7-2.551l.626-.4"
                                                              transform="translate(-3.806 8.57)" fill="rgba(57,17,17,0)"
                                                              stroke="#fff" stroke-linecap="round"
                                                              stroke-linejoin="round" stroke-miterlimit="10"
                                                              stroke-width="1.3"/>
                                                        <path data-name="Tracé 1155"
                                                              d="M21.145,7.129a.755.755,0,0,1,0,1.3L8.527,15.675a2.735,2.735,0,0,0-1.7,2.506h0c0,1.163.984,2.058,2.148,1.387l2.908-1.656v2.864l2.551-1.521V16.436a1.756,1.756,0,0,0-.94-1.566h0"
                                                              transform="translate(7.924 8.89)" fill="rgba(57,17,17,0)"
                                                              stroke="#fff" stroke-linecap="round"
                                                              stroke-linejoin="round" stroke-miterlimit="10"
                                                              stroke-width="1.3"/>
                                                        <line data-name="Ligne 25" x2="11.41" y2="6.354"
                                                              transform="translate(1.73 8.01)" fill="none" stroke="#fff"
                                                              stroke-linecap="round" stroke-linejoin="round"
                                                              stroke-miterlimit="10" stroke-width="1.3"/>
                                                    </g>
                                                </g>
                                                <circle data-name="Ellipse 82" cx="24.208" cy="24.208" r="24.208"
                                                        transform="translate(0 2.677) rotate(-3.17)"
                                                        fill="rgba(57,17,17,0)" stroke="#88d2d5" stroke-linecap="round"
                                                        stroke-linejoin="round" stroke-miterlimit="10"
                                                        stroke-width="1.3"/>
                                                <path data-name="Tracé 1157"
                                                      d="M8.952,24.127A25.339,25.339,0,0,0,24.127,8.952"
                                                      transform="translate(27.809 27.808)" fill="rgba(57,17,17,0)"
                                                      stroke="#88d2d5" stroke-linecap="round" stroke-linejoin="round"
                                                      stroke-miterlimit="10" stroke-width="1.3"/>
                                            </g>
                                        </g>
                                    </g>
                                </svg>
    
                                <div class="bg-[#FAFAFA] rounded-t-lg">
                                    <h2 class="uppercase text-blue-500 font-allerBold text-center text-2xl px-10 py-8">
                                        Les + de la formation</h2>
                                </div>
                                <div class="rounded-b-lg px-10 py-8 bg-white">
                                    <p class="font-allerRegular">Un accompagnement complet et puissant pour développer
                                        durablement vos compétences et relever vos défis avec succès.</p>
                                    {#                            {% if training.professionalOutletIntro is defined and training.professionalOutletIntro is not null %} #}
                                    {#                                <div> #}
                                    {#                                    {{ training.professionalOutletIntro|raw }} #}
                                    {#                                </div> #}
                                    {#                            {% endif %} #}
                                    {% if training.benefitsList is defined and training.benefitsList is not empty %}
                                        <div>
                                            <ul class="p-3">
                                                {% for benefits in training.benefitsList %}
                                                    <li class="flex gap-1 items-center">
                                                        <svg xmlns="http://www.w3.org/2000/svg" width="10.545"
                                                             height="11.795" viewBox="0 0 10.545 11.795">
                                                            <path data-name="Tracé 71"
                                                                  d="M260.545,1441.368,250,1435.47v3.464l4.143,2.318L250,1443.571v3.694l4.422-2.473Z"
                                                                  transform="translate(-250 -1435.47)" fill="#88d2d5"/>
                                                        </svg>
                                                        <p class="font-allerLight">{{ benefits|raw }}</p>
                                                    </li>
                                                {% endfor %}
                                            </ul>
                                        </div>
                                    {% endif %}
    
                                    {#                            {% if training.professionalOutletOutro is defined and training.professionalOutletOutro is not null %} #}
                                    {#                                <h3 class="font-allerBold text-left text-lg">Poursuivre sa formation #}
                                    {#                                    professionnelle</h3> #}
                                    {#                                <div> #}
                                    {#                                    {{ training.professionalOutletOutro|raw }} #}
                                    {#                                </div> #}
                                    {#                            {% endif %} #}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        {% endif %}
    
        {% if discriminator == 'diplomaTraining' %}
            <section class="formation-how-to">
                <div class="relative bg-[#F5F5F5]">
                    <svg class="absolute bottom-0 right-0 z-0 lg:hidden" xmlns="http://www.w3.org/2000/svg" width="259.978"
                         height="502.738" viewBox="0 0 259.978 502.738">
                        <path data-name="Tracé 97"
                              d="M1007.818,2251.288,1096,2095.168V1748.55L836.022,2250.907Z"
                              transform="translate(-836.022 -1748.55)" fill="#fff"/>
                    </svg>
    
                    <img class="absolute h-full right-0" src="{{ asset('build/images/svg/w_white.svg') }}" alt="w white">
    
    
                    <div class="p-horizontal p-vertical flex flex-col gap-8 relative z-10">
                        <h2 data-aos="fade-up" data-aos-delay="0" class="font-allerBold uppercase text-center text-2xl">
                            <span class="text-blue-500">Comment</span>
                            candidater</h2>
                        <div class="flex flex-col gap-4 lg:flex-row lg:w-full">
                            <div data-aos="fade-right" data-aos-delay="0"
                                 style="background-color: #FF4696;"
                                 class="lg:w-1/2 p-6 rounded-lg flex flex-col gap-6 shadow-lg">
                                <div class="flex flex-col gap-1 items-center">
                                    <p class="font-allerRegular text-lg text-white text-center">Les étapes pour
                                        candidater</p>
                                    <svg xmlns="http://www.w3.org/2000/svg" width="219.892" height="0.33"
                                         viewBox="0 0 219.892 0.33">
                                        <rect data-name="Rectangle 22" width="219.892" height="0.33"
                                              rx="0.165" fill="#f8eeeb"/>
                                    </svg>
                                </div>
    
                                <div class="how-to-steps">
                                    <!-- Slider main container -->
                                    <div class="how-to-swiper swiper">
                                        <!-- Additional required wrapper -->
                                        <div class="swiper-wrapper pb-8">
                                            <!-- Slides -->
                                            {#                                        {% for applicationStep in training.applicationSteps %} #}
                                            {#                                            <div class="swiper-slide"> #}
                                            {#                                                <div class="flex flex-col items-center"> #}
                                            {#                                                    <svg xmlns="http://www.w3.org/2000/svg" width="33.358" #}
                                            {#                                                         height="44.977" #}
                                            {#                                                         viewBox="0 0 33.358 44.977"> #}
                                            {#                                                        <g id="Groupe_74" data-name="Groupe 74" #}
                                            {#                                                           transform="translate(-97.321 -1953.235)"> #}
                                            {#                                                            <rect id="Rectangle_24" data-name="Rectangle 24" #}
                                            {#                                                                  width="11.248" #}
                                            {#                                                                  height="0.33" rx="0.165" #}
                                            {#                                                                  transform="translate(114.165 1986.713) rotate(90)" #}
                                            {#                                                                  fill="none" stroke="#fff" stroke-width="0.5"/> #}
                                            {#                                                            <circle id="Ellipse_7" data-name="Ellipse 7" cx="16.179" #}
                                            {#                                                                    cy="16.179" r="16.179" #}
                                            {#                                                                    transform="translate(97.821 1953.735)" fill="none" #}
                                            {#                                                                    stroke="#fff" stroke-width="1"/> #}
                                            {#                                                            <text id="_1" data-name="1" #}
                                            {#                                                                  transform="translate(100 1956.243)" #}
                                            {#                                                                  fill="#fff" font-size="20" #}
                                            {#                                                                  font-family="Aller-Bold, Aller" #}
                                            {#                                                                  font-weight="700"> #}
                                            {#                                                                <tspan x="8" y="21">{{ loop.index }}</tspan> #}
                                            {#                                                            </text> #}
                                            {#                                                        </g> #}
                                            {#                                                    </svg> #}
                                            {#                                                    <div class="bg-white rounded-lg p-6 flex flex-col gap-2 w-full"> #}
                                            {#                                                        <p class="font-allerRegular text-base text-center">Vous postulez #}
                                            {#                                                            en #}
                                            {#                                                            ligne</p> #}
                                            {#                                                        <div style="color : #FF4696" #}
                                            {#                                                             class="font-allerRegular text-sm text-center">{{ applicationStep|raw }}</div> #}
                                            {#                                                    </div> #}
                                            {#                                                </div> #}
                                            {#                                            </div> #}
                                            {#                                        {% endfor %} #}
                                            {{ component('application_step' , {
                                                number : 1,
                                                title : 'J’envoie ma candidature',
                                                description : 'Je fais ma pré-inscription en ligne et je reçois une confirmation d’envoi.',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 2,
                                                title : 'J’échange sur mon projet',
                                                description : 'Je parle de mon projet de formation par téléphone avec les équipes.',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 3,
                                                title : 'Je reçois ma convocation',
                                                description : 'Je participe à la réunion d’information collective (et un test physique pour les formations sportives).',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 4,
                                                title : 'J’envoie mon dossier',
                                                description : 'Je transmets aux équipes mon dossier de candidature complété.',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 5,
                                                title : 'Je passe les tests',
                                                description : 'Je suis convoqué pour les tests de sélection de ma formation.',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 6,
                                                title : 'Je finalise mon inscription',
                                                description : ' Ma candidature est retenue ! Je trouve mon contrat d’alternance et valide mon financement.',
                                                color : training.category.color
                                            }) }}
                                            {{ component('application_step' , {
                                                number : 7,
                                                title : 'Je démarre ma formation',
                                                description : 'J’intègre l’aventure Qwantic, prêt à me former à un métier d’avenir !',
                                                color : training.category.color
                                            }) }}
    
    
                                        </div>
                                        <!-- If we need pagination -->
                                        <div class="how-to-swiper-pagination swiper-pagination !bottom-0"></div>
                                    </div>
                                </div>
    
                            </div>
                            <div data-aos="fade-up" data-aos-delay="0" style="border-color: #FF4696"
                                 class="lg:w-1/2 px-6 py-12 bg-white border rounded-lg flex flex-col gap-6 shadow-lg justify-center items-center">
                                <h3 class="font-allerBold text-center text-2xl">Lancez-vous !</h3>
                                <h4 class="font-allerRegular text-center text-base">Chaque défi est une opportunité de
                                    grandir.</h4>
                                <!-- BIG WHITE BLUE CTA -->
                                <div class="flex justify-center items-center w-full relative z-30">
                                    <a style="background-color: #FF4696; color: white"
                                       href="#formation-form"
                                       class="cta big-cta !text-base w-full">Postuler dès maintenant</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        {% endif %}
    
    
        {% if discriminator == 'diplomaTraining' %}
            <section class="formation-program">
                <div>
                    <div class="relative">
                        <svg class="lg:hidden absolute right-0 h-full" xmlns="http://www.w3.org/2000/svg" width="208"
                             height="232" viewBox="0 0 208 232">
                            <path data-name="Tracé 52"
                                  d="M950.317,2435,830,2667H997.662l40.332-79.571L1038,2435Z"
                                  transform="translate(-830 -2435)" fill="#ffce1e" opacity="0.35"/>
                        </svg>
                        <svg class="hidden lg:block absolute right-0 h-full" xmlns="http://www.w3.org/2000/svg"
                             width="787.988"
                             height="686.279" viewBox="0 0 787.988 686.279">
                            <path data-name="Tracé 116"
                                  d="M1228.975,3174.473l327.475-579.937V2489.452L1156,2488.194,768.461,3174.473Z"
                                  transform="translate(-285 -2488.194)" fill="#ff5649" opacity="0.2"/>
                        </svg>
    
                        <img class="w-full lg:hidden"
                             src="{{ asset('upload/images/training/band/' ~ training.bandImageName) | imagine_filter('wfull_img_mobile') }}"
                             alt="program image">
                        <div class="lg:h-[50vh]">
                            <img class="lg:h-full lg:object-cover lg:object-center hidden lg:block w-full"
                                 src="{{ asset('upload/images/training/band/' ~ training.bandImageName) }}"
                                 alt="program image large">
                        </div>
    
                    </div>
    
                    <div class="bg-grey-300 p-horizontal p-vertical flex flex-col gap-8">
                        <h2 data-aos="fade-down" data-aos-delay="0"
                            class="font-allerBold uppercase text-center text-white text-2xl">Programme de la formation</h2>
                        {% if discriminator == 'diplomaTraining' %}
                            <p class="font-allerLight text-lg text-white text-center">
                                La formation {{ training.acronym }} au sein de <a href="">notre organisme</a> se déroule
                                selon un programme précis.
                                <br>Ce programme est libellé comme suit :
                            </p>
                        {% endif %}
                        <div data-aos="fade-right" data-aos-delay="0" class="flex flex-col gap-6 lg:px-40">
                            {% for program in training.program %}
                                <div class="flex flex-row gap-4 w-full items-center">
                                    <svg class="max-w-[50px] min-w-[50px]" xmlns="http://www.w3.org/2000/svg" width="49"
                                         height="49"
                                         viewBox="0 0 49 49">
                                        <g data-name="picto chiffre" opacity="0.7">
                                            <path data-name="Tracé 490"
                                                  d="M24.5,0A24.5,24.5,0,1,1,0,24.5,24.5,24.5,0,0,1,24.5,0Z"
                                                  fill="#FF4696"/>
                                            <text data-name="1" transform="translate(10.5 5)" fill="#161616"
                                                  font-size="30" font-family="Aller-Regular, Aller">
                                                <tspan x="5" y="29">{{ loop.index }}</tspan>
                                            </text>
                                        </g>
                                    </svg>
                                    <div class="font-allerRegular text-sm text-white [&>ul]:list-disc [&>ul]:list-inside">{{ program|raw }}</div>
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </section>
        {% endif %}
    
        {% if discriminator == 'diplomaTraining' %}
            {% if educational_team != null and educational_team != 0 %}
                <section class="formation-team">
                    <div class="p-vertical flex flex-col gap-8 relative shadow-lg relative z-10 lg:gap-12">
                        <h2 data-aos="fade-up" data-aos-delay="0"
                            class="font-allerBold uppercase text-center text-2xl p-horizontal">Notre équipe<span
                                    class="text-blue-500"><br class="md:hidden"> pédagogique</span></h2>
                        <div class="lg:px-40 2xl:px-60 3xl:px-80">
                            <!-- Slider main container -->
                            <div class="team-swiper swiper w-full relative">
                                <!-- Additional required wrapper -->
                                <div class="swiper-wrapper pb-12 lg:pb-10">
                                    <!-- Slides -->
                                    {% for team in training.educationalTeams %}
                                        <div class="swiper-slide px-10">
                                            <div class="flex flex-col p-horizontal lg:px-0 gap-6 lg:flex-row lg:items-center lg:gap-10 justify-between">
                                                <div class="lg:w-1/3">
                                                    <img class="w-full  border-2 border-blue-500 rounded-lg mb-4 lg:mb-0"
                                                         src="{{ asset('upload/images/training/educational_team/' ~ team.imageName) | imagine_filter('team_img') }}"
                                                         alt="team image">
    
                                                </div>
                                                <div class="lg:w-2/3 flex flex-col gap-6 lg:bg-white lg:p-10 lg:rounded-lg lg:shadow-lg">
                                                    <div class="flex flex-col gap-1">
                                                        <h4 class="font-allerBold text-xl">{{ team.firstName }} {{ team.lastName }}</h4>
                                                        <p class="font-allerRegular text-sm text-grey-200">{{ team.job }}</p>
                                                    </div>
                                                    <p class="font-allerRegular text-base">{{ team.testimonial }}</p>
                                                </div>
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                            <!-- If we need navigation buttons -->
                            <div data-aos="fade-left" data-aos-delay="0"
                                 class="hidden lg:block !absolute swiper-button-prev-team swiper-button-prev text-grey-200 left-20 xl:left-32 top-[55%]"></div>
                            <div data-aos="fade-right" data-aos-delay="0"
                                 class="hidden lg:block !absolute swiper-button-next-team swiper-button-next text-grey-200 right-20 xl:right-32 top-[55%]"></div>
                        </div>
    
                        <!-- If we need pagination -->
                        <div class="swiper-pagination-team swiper-pagination !bottom-[6vh] lg:!bottom-10"></div>
    
                    </div>
                </section>
            {% endif %}
        {% endif %}
    
        {% if discriminator == 'diplomaTraining' %}
            {% if alumni != null and alumni != 0 %}
                <section class="formation-alumnis">
                    <div class="p-horizontal p-vertical flex flex-col gap-14 bg-white">
                        <h2 data-aos="fade-up" data-aos-delay="0" class="font-allerBold uppercase text-center text-2xl">Des
                            alumnis fiers<br class="md:hidden"> de
                            leurs
                            parcours</h2>
                        <div class="flex flex-col gap-14 items-center lg:flex-row w-full">
                            {% for alumni in training.alumnis %}
                                {{ component('bubbles:content_bubble', {
                                    isImg: true,
                                    url: alumni.imageName,
                                    quote: true,
                                    color: training.category.color,
                                    title: alumni.firstName ~ ' ' ~ alumni.lastName,
                                    testimonial: alumni.quote,
                                    alumni : true,
                                }) }}
                            {% endfor %}
                        </div>
                    </div>
                </section>
            {% endif %}
        {% endif %}
    
        {% if form != null %}
            {% if discriminator == 'shortTraining' or (discriminator == 'diplomaTraining' and training.sessions is not empty) %}
                <section class="formation-form" id="formation-form">
                    <div style="background-color: #FF4696" class="relative w-full">
                        <img class="lg:hidden w-full h-2/5 md:h absolute bottom-0 opacity-60"
                             src="{{ asset('build/images/grey_rect_form.png') }}"
                             alt="white svg">
                        <img class="hidden lg:block w-full h-2/5 md:h absolute bottom-0"
                             src="{{ asset('build/images/white_rect_form.png') }}"
                             alt="white svg">
                        <div class="p-horizontal p-vertical flex flex-col gap-4 lg:gap-8 relative z-0">
                            <h2 data-aos="fade-up" data-aos-delay="0"
                                class="font-allerBold uppercase text-center text-white text-2xl">Je m'inscris<br
                                        class="lg:hidden"> à la
                                formation</h2>
                            <p class="font-allerRegular text-center text-white">
                                Ne manquez pas l’opportunité de rejoindre notre formation et de développer vos compétences
                                dès aujourd’hui !
                                <br>
                                Remplissez simplement le formulaire ci-dessous pour vous inscrire en quelques clics.
                            </p>
                            {{ form_start(form , {'attr' : {
                                'class' : 'lg:p-8 lg:px-28 lg:bg-[#D8D8D8] lg:bg-opacity-40 rounded-lg flex flex-col gap-6 relative',
                                'id' : 'form_registration'
                            }}) }}
    
                            {# global errors #}
                            <div class="text-red-600 mb-4">
                                {{ form_errors(form) }}
                            </div>
    
                            <div class="flex flex-col gap-2">
                                <div class="flex flex-col lg:flex-row gap-2">
                                    <div class="w-full">
                                        {{ form_label(form.lastname, null , {
                                            'label_attr' : {
                                                'class' : 'hidden'
                                            }
                                        }) }}
                                        {{ form_widget(form.lastname , {'attr' : {
                                            'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                        }}) }}
                                        {{ form_errors(form.lastname) }}
                                    </div>
                                    <div class="w-full">
                                        {{ form_label(form.firstname, null , {
                                            'label_attr' : {
                                                'class' : 'hidden'
                                            }
                                        }) }}
                                        {{ form_widget(form.firstname , {'attr' : {
                                            'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                        }}) }}
                                        {{ form_errors(form.firstname) }}
                                    </div>
                                </div>
                                <div class="flex flex-col lg:flex-row gap-2">
                                    <div class="w-full">
                                        {{ form_label(form.email, null , {
                                            'label_attr' : {
                                                'class' : 'hidden'
                                            }
                                        }) }}
                                        {{ form_widget(form.email , {'attr' : {
                                            'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                        }}) }}
                                        {{ form_errors(form.email) }}
                                    </div>
                                    <div class="w-full">
                                        {{ form_label(form.phone, null , {
                                            'label_attr' : {
                                                'class' : 'hidden'
                                            }
                                        }) }}
                                        {{ form_widget(form.phone , {'attr' : {
                                            'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                        }}) }}
                                        {{ form_errors(form.phone) }}
                                    </div>
                                </div>
                                {{ form_label(form.dateBirthDay, null , {
                                    'label_attr' : {
                                        'class' : 'hidden'
                                    }
                                }) }}
                                {{ form_widget(form.dateBirthDay , {'attr' : {
                                    'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                }}) }}
                                {{ form_errors(form.dateBirthDay) }}
    
                                {% if discriminator == 'shortTraining' %}
                                    <div class="flex flex-col lg:flex-row gap-2">
                                        <div class="w-full">
                                            {{ form_label(form.companyName, null , {
                                                'label_attr' : {
                                                    'class' : 'hidden'
                                                }
                                            }) }}
                                            {{ form_widget(form.companyName , {'attr' : {
                                                'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                            }}) }}
                                            {{ form_errors(form.companyName) }}
                                        </div>
                                        <div class="w-full">
                                            {{ form_label(form.professionalStatus, null , {
                                                'label_attr' : {
                                                    'class' : 'hidden'
                                                }
                                            }) }}
                                            {{ form_widget(form.professionalStatus , {'attr' : {
                                                'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                            }}) }}
                                            {{ form_errors(form.professionalStatus) }}
                                        </div>
                                    </div>
                                {% endif %}
    
                                {% if discriminator == 'shortTraining' and form.session is defined %}
                                <div class="flex flex-col lg:flex-row gap-2">
                                    <div class="w-full">
                                        {% endif %}
                                        {% if form.session is defined %}
                                            {{ form_label(form.session, null , {
                                                'label_attr' : {
                                                    'class' : 'hidden'
                                                }
                                            }) }}
                                            {{ form_widget(form.session , {'attr' : {
                                                'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                            }}) }}
                                            {{ form_errors(form.session) }}
                                        {% endif %}
                                        {% if discriminator == 'shortTraining' and form.session is defined %}
                                    </div>
                                    <div class="w-full">
                                        {% endif %}
                                        {% if discriminator == 'shortTraining' %}
                                            {{ form_label(form.priceSelect, null , {
                                                'label_attr' : {
                                                    'class' : 'hidden'
                                                }
                                            }) }}
                                            {{ form_widget(form.priceSelect , {'attr' : {
                                                'class' : 'outline-none font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic'
                                            }}) }}
                                            {{ form_errors(form.priceSelect) }}
    
                                        {% endif %}
                                        {% if discriminator == 'shortTraining' and form.session is defined %}
                                    </div>
                                </div>
                                {% endif %}
    
                                {{ form_label(form.tellMeMore , null , {
                                    'label_attr' : {
                                        'class' : 'hidden'
                                    }
                                }) }}
                                {{ form_widget(form.tellMeMore , {'attr' : {
                                    'class' : 'outline-none font-allerRegular w-full px-5 py-3 pb-20 rounded-lg text-sm text-grey-300 italic'
                                }}) }}
                                {{ form_errors(form.tellMeMore) }}
                            </div>
    
                            <div>
                                {{ form_widget(form.isOptin) }}
                                {{ form_label(form.isOptin , null , {
                                    'label_attr' : {
                                        'class' : 'font-allerRegular text-right pl-2'
                                    }
                                }) }}
                                {{ form_errors(form.isOptin) }}
                            </div>
    
                            <!-- SMALL BLUE CTA -->
                            <div class="flex justify-center items-center w-full relative z-30">
                                {{ form_widget(form.save , {
                                    'attr' : {
                                        'class' : 'outline-none cta big-cta cta-blue w-full lg:w-fit !whitespace-normal'
                                    }
                                }) }}
                            </div>
    
                            <p class="font-allerLight italic text-right text-sm">(*) Informations obligatoires</p>
    
                            {{ form_end(form) }}
                        </div>
                    </div>
                </section>
            {% endif %}
        {% endif %}
    
        {% if discriminator == 'shortTraining' %}
            <section id="formations-courtes">
                <div class="p-horizontal p-vertical bg-[#F9F9F9] relative ">
                    <div class="relative z-10 flex flex-col gap-12">
                        <h2 data-aos="fade-down" data-aos-delay="0" class="font-allerBold uppercase text-center text-2xl">
                            Nos formations <span class="text-pink-500">courtes</span>
                        </h2>
                        <div data-aos="zoom-in" data-aos-delay="100"
                             class="grid grid-cols-1 gap-8 lg:grid-cols-3 justify-center items-center 3xl:gap-12">
                            {{ component('cards:all_formations' , { limit : 3 , isSuccess: true , other: true, id : training.id }) }}
                        </div>
                        <!-- SMALL WHITE CTA -->
                        <div class="flex justify-center items-center w-full relative z-30">
                            {% if discriminator == 'diplomaTraining' %}
                                <a
                                        href="{{ path('nos_formations_diplomantes') }}"
                                        class="w-full cta small-cta lg:w-auto">Voir
                                    plus de formations</a>
                            {% else %}
                                <a href="{{ path('nos_formations_courtes') }}"
                                   class="w-full cta small-cta lg:w-auto cta-blue">Voir plus de formations</a>
                            {% endif %}
    
                        </div>
                    </div>
                </div>
    
            </section>
        {% endif %}
    
        {% if discriminator == "shortTraining" %}
            {{ component('catalog' , {form : formCatalog}) }}
        {% endif %}
    
        <a id="floating-button" href="#price-details"
           class="fixed bottom-4 right-4 bg-pink-500 text-white px-4 py-2 items-center rounded shadow-lg transition-all"
           style="z-index: 9999;">
    
            {#        <svg fill="#FFF" version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="-60 -50 650.75 410.75" stroke="#FFF" #}
            {#             class="w-6 h-6 hidden lg:inline-block"> #}
            {#            <path d="M183.815,265.726c-32.444,0-60.868-21.837-76.306-54.325h102.101v-45.023H95.643c-0.284-3.642-0.437-7.29-0.437-11.016 #}
            {#        c0-3.691,0.152-7.384,0.437-10.977h113.969V99.353H107.51c15.438-32.485,43.861-54.315,76.306-54.315 #}
            {#        c31.01,0,60.21,20.759,76.2,54.152l40.626-19.418C277.091,30.554,232.329,0,183.815,0c-36.47,0-70.51,16.665-95.851,46.966 #}
            {#        C75.219,62.209,65.481,79.995,59.079,99.353H10.108v45.031h40.39c-0.217,3.617-0.329,7.311-0.329,10.977 #}
            {#        c0,3.704,0.112,7.351,0.329,11.016h-40.39V211.4h48.971c6.402,19.356,16.14,37.122,28.886,52.351 #}
            {#        c25.341,30.303,59.381,46.999,95.851,46.999c48.515,0,93.275-30.55,116.826-79.767l-40.626-19.454 #}
            {#        C244.025,244.965,214.825,265.726,183.815,265.726z"></path> #}
            {#        </svg> #}
    
            <span class="text-sm lg:text-lg font-medium">Voir nos offres</span>
        </a>
    
    {% endblock %}
    
    
    {% block custom_javascripts %}
        {{ encore_entry_script_tags('training') }}
        {{ encore_entry_script_tags('catalogue') }}
    {% endblock custom_javascripts %}