From f7ccd021e9ba4b60f53aaf2965f4c6642f0e1f66 Mon Sep 17 00:00:00 2001
From: Maxime Golfier <25312957+maxgfr@users.noreply.github.com>
Date: Tue, 10 Sep 2024 12:00:08 +0200
Subject: [PATCH] feat(tests): ajout du module de testing (#6096)

* fix: tests

* fix: tests

* fix: command

* fix: merge date

* fix: tests

* fix: tests

* fix: tests

* fix: tests
---
 .../__snapshots__/a-propos.test.tsx.snap      | 188 ++--
 .../droit-du-travail.test.js.snap             | 614 ++++++------
 .../fiche-ministere-travail.test.tsx.snap     | 300 +++---
 .../glossaire-[slug].test.tsx.snap            | 166 ++--
 .../__snapshots__/glossaire.test.tsx.snap     | 226 ++---
 .../modeles-de-courriers-[slug].test.tsx.snap | 308 +++---
 .../modeles-de-courriers.test.tsx.snap        | 208 ++--
 .../__snapshots__/recherche.test.js.snap      | 174 ++--
 .../__snapshots__/themes.test.tsx.snap        | 192 ++--
 .../code-du-travail-frontend/jest.config.js   |   6 +-
 .../code-du-travail-frontend/next.config.mjs  |   1 +
 .../code-du-travail-frontend/package.json     |   2 +-
 .../code-du-travail-frontend/panda.config.ts  |   1 +
 .../__snapshots__/Feedback.test.js.snap       |  88 +-
 .../__snapshots__/ReferenceList.test.js.snap  |  32 +-
 .../ReferencesJuridiques.test.js.snap         |  42 +-
 .../AccessibilityModal.test.js.snap           |  22 +-
 .../__snapshots__/Answer.test.js.snap         | 888 +++++++++---------
 .../__snapshots__/Article.test.js.snap        |  56 +-
 .../__snapshots__/Breadcrumbs.test.js.snap    |  22 +-
 .../__snapshots__/ContactModal.test.js.snap   |  20 +-
 .../__tests__/__snapshots__/Html.test.js.snap |   2 +-
 .../__snapshots__/RelatedItems.test.js.snap   |  42 +-
 .../ServiceRenseignement.test.js.snap         |  28 +-
 .../ServiceRenseignementModal.test.js.snap    |  38 +-
 .../__snapshots__/Share.test.js.snap          |  28 +-
 .../__snapshots__/Custom.test.js.snap         |  18 +-
 .../DisplayContentContribution.test.tsx       |  30 +-
 .../__tests__/ReferencesJuridique.test.tsx    |  24 +-
 .../DisplayContentContribution.test.tsx.snap  | 192 ++--
 .../__snapshots__/index.test.js.snap          | 822 ++++++++--------
 .../__snapshots__/Search.test.js.snap         | 118 +--
 .../__snapshots__/SearchModal.test.js.snap    |  20 +-
 .../FicheServicePublic.test.js.snap           | 324 +++----
 .../__tests__/ElementBuilder.test.js          |   8 +-
 .../__snapshots__/Accordion.test.js.snap      | 100 +-
 .../FragmentConditionne.test.tsx.snap         |  38 +-
 .../__snapshots__/Image.test.tsx.snap         |  18 +-
 .../__tests__/__snapshots__/List.test.js.snap |   6 +-
 .../__snapshots__/OuSAdresser.test.js.snap    |  10 +-
 .../__snapshots__/ServiceEnLigne.test.js.snap |  12 +-
 .../__snapshots__/Table.test.js.snap          |   2 +-
 .../__snapshots__/Tabulator.test.js.snap      |  66 +-
 .../__snapshots__/Title.test.js.snap          |   4 +-
 .../layout/__tests__/BrandTop.test.tsx        |  10 +
 .../modules/layout/__tests__/Footer.test.tsx  |  10 +
 .../layout/__tests__/NeedMoreInfo.test.tsx    |  10 +
 .../__snapshots__/BrandTop.test.tsx.snap      |   9 +
 .../__snapshots__/Footer.test.tsx.snap        | 448 +++++++++
 .../__snapshots__/NeedMoreInfo.test.tsx.snap  |  42 +
 .../header/__tests__/HeaderDsfr.test.tsx      |  11 +
 .../header/__tests__/SearchInput.test.tsx     |  18 +
 .../__snapshots__/HeaderDsfr.test.tsx.snap    | 445 +++++++++
 .../__snapshots__/SearchInput.test.tsx.snap   |  26 +
 .../src/modules/layout/index.tsx              |  14 +-
 .../__tests__/MentionsLegales.test.tsx        |  10 +
 .../MentionsLegales.test.tsx.snap             | 123 +++
 .../modules/stats/__tests__/Stats.test.tsx    |  17 +
 .../stats/__tests__/StatsDisplay.test.tsx     |  12 +
 .../__snapshots__/Stats.test.tsx.snap         | 128 +++
 .../__snapshots__/StatsDisplay.test.tsx.snap  |  31 +
 .../__snapshots__/index.test.tsx.snap         |  48 +-
 .../__snapshots__/Result.test.tsx.snap        |  38 +-
 .../__snapshots__/index.test.tsx.snap         |  52 +-
 .../__snapshots__/Result.test.js.snap         | 176 ++--
 .../__snapshots__/Status.test.js.snap         | 118 +--
 .../__snapshots__/index.test.tsx.snap         |  52 +-
 .../__snapshots__/Result.test.tsx.snap        |  56 +-
 .../__snapshots__/index.test.tsx.snap         |  52 +-
 .../__snapshots__/Salaires.test.js.snap       |  62 +-
 .../__snapshots__/TypeContrat.test.js.snap    |  18 +-
 .../TypeRemuneration.test.js.snap             |  18 +-
 .../__tests__/__snapshots__/CDD.test.js.snap  |  80 +-
 .../__tests__/__snapshots__/CTT.test.js.snap  |  80 +-
 .../__snapshots__/Indemnite.test.js.snap      | 140 +--
 .../__snapshots__/InfosGenerales.test.js.snap | 180 ++--
 .../__snapshots__/Remuneration.test.js.snap   |  96 +-
 .../__snapshots__/SelectQuestion.test.js.snap |  28 +-
 .../StepInformations.test.tsx.snap            |   2 +-
 .../__snapshots__/StepList.test.js.snap       |  22 +-
 .../__snapshots__/Wizard.test.tsx.snap        | 174 ++--
 .../__snapshots__/YesNoQuestion.test.js.snap  |  20 +-
 .../__snapshots__/SearchResults.test.js.snap  | 174 ++--
 .../test/jest.setup.js                        |  14 +
 yarn.lock                                     | 361 ++++++-
 85 files changed, 5317 insertions(+), 3614 deletions(-)
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/BrandTop.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/Footer.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/NeedMoreInfo.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/BrandTop.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/Footer.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/NeedMoreInfo.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/header/__tests__/HeaderDsfr.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/header/__tests__/SearchInput.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/HeaderDsfr.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/SearchInput.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/MentionsLegales.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/__snapshots__/MentionsLegales.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/stats/__tests__/Stats.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/stats/__tests__/StatsDisplay.test.tsx
 create mode 100644 packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/Stats.test.tsx.snap
 create mode 100644 packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/StatsDisplay.test.tsx.snap

diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.tsx.snap
index 70e766c682..360117cf3d 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<About /> should render 1`] = `
 <div>
   <div
-    class="sc-eHsDsR jvYoqI"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-jdkBTo hwFMeW"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fUBkdm cdIumq"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-hBtRBD hhFrKi"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL hTNWeq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gEkIjz eZnYXg"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-hoLEA cAIauw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-bOhtcR fxvZkA"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<About /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-camqpD jBVvSj"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-deXhhX dCERfw"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<About /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-epALIP byJirg"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<About /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-iLsKjm jreAvU"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-dJiZtA hVSvKc"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dQEtJz gghWjv"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<About /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-hYmls jvwQAF"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-kbdlSk dVYOry"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<About /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-fFlnrN dIbHpx"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bOQTJJ bZXUzd diAojX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-eifrsQ hKKQkM"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<About /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-gweoQa kBXmsJ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-bddgXz koXLlw"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-jdUcAg jEULqB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-eIcdZJ ffrCUe"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<About /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-fyVfxW ighGDQ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,44 +237,44 @@ exports[`<About /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-fmzyuX cpFQIA"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg elbebC"
+          class="sc-d8f596bd-0 hCPxfF"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               À propos
             </h1>
             <p
-              class="sc-bDpDS HtTuQ"
+              class="sc-ea8c0a81-0 hsqxhF"
             >
               Apprenez-en plus sur notre histoire, notre équipe et nos méthodes
             </p>
           </header>
           <div
-            class="sc-iGgWBj biWgIW"
+            class="sc-2a0a4b0a-0 hpYuum"
           >
             <div
-              class="sc-kzqdkY dZUDIh"
+              class="sc-e32628d4-0 cwDqXq"
             >
               <h2
-                class="sc-dSIIpw otPXl"
+                class="sc-d6e72754-0 gUBAuw"
               >
                 <span
-                  class="sc-gsFSXq ljkohw"
+                  class="sc-a4d7a179-0 gGBEJx"
                 />
                 Qu’est-ce que le Code du travail numérique ?
               </h2>
@@ -290,7 +290,7 @@ exports[`<About /> should render 1`] = `
                janvier 2020.
             </p>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Pourquoi le Code du travail numérique ?
             </h3>
@@ -308,7 +308,7 @@ exports[`<About /> should render 1`] = `
               </a>
             </p>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               À qui ce service s’adresse-t-il ?
             </h3>
@@ -323,7 +323,7 @@ exports[`<About /> should render 1`] = `
               </a>
             </p>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Que peut-on trouver sur le site ?
             </h3>
@@ -348,19 +348,19 @@ exports[`<About /> should render 1`] = `
               </li>
             </ul>
             <div
-              class="sc-kzqdkY dZUDIh"
+              class="sc-e32628d4-0 cwDqXq"
             >
               <h2
-                class="sc-dSIIpw otPXl"
+                class="sc-d6e72754-0 gUBAuw"
               >
                 <span
-                  class="sc-gsFSXq ljkohw"
+                  class="sc-a4d7a179-0 gGBEJx"
                 />
                 Qui sommes-nous ?
               </h2>
             </div>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Notre équipe
             </h3>
@@ -396,7 +396,7 @@ exports[`<About /> should render 1`] = `
               .
             </p>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Nos méthodes
             </h3>
@@ -420,45 +420,45 @@ exports[`<About /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-jOnpCo hiGzNx"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kFWlue jIqemF"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bkEOxz jYDFgL"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dhFUGM dPpwpV iEDLPP"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fbKhjd fEcfGH"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -472,28 +472,28 @@ exports[`<About /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-leSDtu ddTDCo"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-bJBgwP gZgZQL kMFXol"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -501,7 +501,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -509,7 +509,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -517,7 +517,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -525,7 +525,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -535,22 +535,22 @@ exports[`<About /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -558,7 +558,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -566,7 +566,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -577,17 +577,17 @@ exports[`<About /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -595,7 +595,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -603,7 +603,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -613,22 +613,22 @@ exports[`<About /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -636,7 +636,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -644,7 +644,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -655,17 +655,17 @@ exports[`<About /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -673,7 +673,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -681,7 +681,7 @@ exports[`<About /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -693,10 +693,10 @@ exports[`<About /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-hTUWRQ gZgZQL iOQcAv"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-lizKOf jlNHQY"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -709,7 +709,7 @@ exports[`<About /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-eoVZPG dZZYot"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -749,13 +749,13 @@ exports[`<About /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-satoz iTaWXu"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dWZqqJ bGxlNu"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-eoVZPG sc-isRoRg dZZYot hYUXaZ"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -797,7 +797,7 @@ exports[`<About /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-eNSrOW fRbHNW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap
index 0ba2c9c0be..821c747302 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap
@@ -3,38 +3,38 @@
 exports[`<DroitDuTravail /> should render 1`] = `
 <div>
   <div
-    class="sc-cyRcrZ gjBWZE"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-kUdmhA bpiyAA"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fFlnrN leQqcf"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-kbdlSk iOxdlp"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eIcdZJ gZgZQL hekiaX"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-jdUcAg MdSue"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-bddgXz hJmGNI"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-fyVfxW knhftg"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-fmzyuX fvBfzc"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-eifrsQ fpULWb"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-fUBkdm gknpQq"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<DroitDuTravail /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-hBtRBD kWGwes"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-cMa-dbN dBNHbC"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-fKWMtX gvLvNQ"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-camqpD inLzlc"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-jdkBTo bFjyHv"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-eHsDsR kXYXUU"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-gweoQa bZXUzd fbOsrt"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-bOQTJJ ilhIfy"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<DroitDuTravail /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-cspYLC MBSft"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-epqpcT khryBk"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-BQMaI OPPgB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-dwalKd bKNSlA"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-bvgPty gYMztu"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,51 +237,51 @@ exports[`<DroitDuTravail /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-hgRRfv jRurkG"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               Le droit du travail
             </h1>
             <p
-              class="sc-bDpDS HtTuQ"
+              class="sc-ea8c0a81-0 hsqxhF"
             >
               Retrouvez la définition du droit du travail, les textes qui en sont à l’origine 
               <br
-                class="sc-emIrwa gYGcSV"
+                class="sc-5cc94b1e-0 dYYZkr"
               />
               ainsi que leur articulation.
             </p>
           </header>
           <div
-            class="sc-aXZVg dPpwpV"
+            class="sc-d8f596bd-0 jMrYSO"
           >
             <div
-              class="sc-iGgWBj biWgIW"
+              class="sc-2a0a4b0a-0 hpYuum"
             >
               <div
-                class="sc-kzqdkY dZUDIh"
+                class="sc-e32628d4-0 cwDqXq"
               >
                 <h2
-                  class="sc-dSIIpw otPXl"
+                  class="sc-d6e72754-0 gUBAuw"
                 >
                   <span
-                    class="sc-gsFSXq ljkohw"
+                    class="sc-a4d7a179-0 gGBEJx"
                   />
                   Qu’est-ce que le droit du travail ?
                 </h2>
@@ -298,13 +298,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 Le droit du travail est un droit en constante évolution car il comprend des enjeux sociaux, économiques et politiques forts.
               </p>
               <div
-                class="sc-iGgWBj cWzIZL"
+                class="sc-2a0a4b0a-0 dLOZmV"
               >
                 <div
-                  class="sc-hRJfrW gLeKXc"
+                  class="sc-66a696c4-0 A-dcpl"
                 >
                   <div
-                    class="sc-iHbSHJ dqcYtl"
+                    class="sc-66a696c4-1 dvlKxa"
                   >
                     <svg
                       aria-hidden="true"
@@ -324,17 +324,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     </svg>
                   </div>
                   <div
-                    class="sc-klVQfs giEiHo"
+                    class="sc-66a696c4-2 eRMOZl"
                   >
                     <p
                       aria-level="3"
-                      class="sc-gdyeKB jXhxaU"
+                      class="sc-bdaf45c8-0 nMxaE"
                       role="heading"
                     >
                       Le droit du travail, ce n’est pas…
                     </p>
                     <p
-                      class="sc-krNlru bpribs"
+                      class="sc-3633cc97-1 bjxtLv"
                     >
                       Le droit du travail ne concerne pas les travailleurs qui sont soumis au droit public (par exemple, les fonctionnaires), les travailleurs indépendants (artisan, commerçant, professions libérales…), les bénévoles et les dirigeants d’entreprise.
                     </p>
@@ -345,48 +345,48 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer cHLyxF"
+          class="sc-a384ed57-0 fCzpjp"
         >
           <div
-            class="sc-eqUAAy jedSti"
+            class="sc-a384ed57-1 GFedb"
           />
           <div
-            class="sc-aXZVg sc-fqkvVR gZgZQL hPueQb"
+            class="sc-d8f596bd-0 sc-a384ed57-2 jtWYDW fFVOAo"
           >
             <div
-              class="sc-kzqdkY fJPfZZ"
+              class="sc-e32628d4-0 kzTfLq"
             >
               <h2
-                class="sc-dSIIpw crsCQS"
+                class="sc-d6e72754-0 egzXkL"
               >
                 <span
-                  class="sc-gsFSXq ljkohw"
+                  class="sc-a4d7a179-0 gGBEJx"
                 />
                 Quels sont les textes à l’origine du droit du travail ?
               </h2>
             </div>
             <p
-              class="sc-bVVIoq hypZfQ"
+              class="sc-d18d6cf6-0 gvhNcc"
             >
               Le droit du travail est construit par de nombreux textes juridiques dont les sources sont diverses : sources internationales, sources européennes et sources nationales. Vous trouverez les textes participant à la construction du droit du travail en France ci-dessous.
             </p>
           </div>
           <div
-            class="sc-dcJsrY gQPQLH"
+            class="sc-a384ed57-3 dylJnL"
           >
             <div
-              class="sc-aXZVg gZgZQL"
+              class="sc-d8f596bd-0 jtWYDW"
             >
               <div
-                class="sc-dPZUQH fAqYwc"
+                class="sc-d18d6cf6-1 iazvhS"
               >
                 <div
-                  class="sc-ikkxIA hJtQtp"
+                  class="sc-4d2b2ff7-0 dCxcKq"
                   data-accordion-component="Accordion"
                 >
                   <div>
                     <div
-                      class="sc-dAbbOL kYtGDo"
+                      class="sc-4d2b2ff7-1 wYknJ"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -397,17 +397,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-0"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-0"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -476,10 +476,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Les textes internationaux
@@ -488,7 +488,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -507,13 +507,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-0"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             Le droit du travail en France est influencé par les textes de
@@ -578,7 +578,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL gmgpBf"
+                      class="sc-4d2b2ff7-1 gOAcli"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -589,17 +589,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-1"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-1"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -622,10 +622,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Les textes européens
@@ -634,7 +634,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -653,13 +653,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-1"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             Le droit du travail français est influencé par
@@ -762,7 +762,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -773,17 +773,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-2"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-2"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -810,10 +810,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 La Constitution française
@@ -822,7 +822,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -841,13 +841,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-2"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             Texte le plus important du système juridique français,
@@ -905,7 +905,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -916,17 +916,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-3"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-3"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -963,10 +963,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Lois, ordonnances, décrets et arrêtés
@@ -975,7 +975,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -994,13 +994,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-3"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             La loi est votée par le Parlement et fixe les principes fondamentaux du droit du travail et de la sécurité sociale.
@@ -1028,7 +1028,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -1039,17 +1039,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-4"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-4"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -1084,10 +1084,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Les conventions et accords collectifs
@@ -1096,7 +1096,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -1115,13 +1115,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-4"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             Les conventions et accords collectifs de travail sont des textes négociés entre un ou plusieurs employeurs et un ou plusieurs syndicats de salariés.
@@ -1138,7 +1138,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -1149,17 +1149,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-5"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-5"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -1202,10 +1202,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Les usages et les engagements unilatéraux
@@ -1214,7 +1214,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -1233,13 +1233,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-5"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             L’usage d’entreprise est une pratique répétée de l’employeur attribuant un avantage aux salariés ou à un groupe de salariés de l’entreprise sans que la loi, la convention collective ou le contrat de travail ne le lui impose.
@@ -1261,7 +1261,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -1272,17 +1272,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-6"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-6"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -1301,10 +1301,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Le règlement intérieur de l’entreprise
@@ -1313,7 +1313,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -1332,13 +1332,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-6"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           Le règlement intérieur de l’entreprise est un acte écrit par l’employeur qui fixe les règles concernant la discipline, la santé et la sécurité dans l’entreprise.
                         </div>
@@ -1347,7 +1347,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </div>
                   <div>
                     <div
-                      class="sc-dAbbOL kvMhu"
+                      class="sc-4d2b2ff7-1 WEXqf"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -1358,17 +1358,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           aria-controls="accordion__panel-raa-7"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-fUnMCh gaUAFt"
+                          class="sc-4d2b2ff7-3 caQDFJ"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-raa-7"
                           role="button"
                           tabindex="0"
                         >
                           <div
-                            class="sc-hzhJZQ gabYcx"
+                            class="sc-4d2b2ff7-4 gnLSHE"
                           >
                             <div
-                              class="sc-fHjqPf kPurHt"
+                              class="sc-4d2b2ff7-5 keKnCd"
                             >
                               <svg
                                 aria-hidden="true"
@@ -1397,10 +1397,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               </svg>
                             </div>
                             <div
-                              class="sc-hmdomO eRIWLP"
+                              class="sc-4d2b2ff7-6 foAwyF"
                             >
                               <h3
-                                class="sc-kAyceB dvmaTz"
+                                class="sc-b879fc2d-0 hyiHle"
                                 style="margin: 0px;"
                               >
                                 Le contrat de travail
@@ -1409,7 +1409,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -1428,13 +1428,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-feUZmu XPueE"
+                        class="sc-4d2b2ff7-2 fhHTEh"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-raa-7"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <p>
                             Le contrat de travail existe dès l’instant où une personne (le salarié) s’engage à travailler, moyennant rémunération, pour le compte et sous la direction d’une autre personne (l’employeur).
@@ -1455,10 +1455,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
               </div>
               <div
-                class="sc-aXZVg dPpwpV"
+                class="sc-d8f596bd-0 jMrYSO"
               >
                 <div
-                  class="sc-iGgWBj sc-eBHhsj cRLRjd NGVDa"
+                  class="sc-2a0a4b0a-0 sc-d18d6cf6-2 hPfzrL cZsCUb"
                 >
                   La jurisprudence de la Cour Européenne des droits de l’Homme, de la Cour de justice de l’Union européenne, du Conseil Constitutionnel, du Conseil d’Etat et de la Cour de cassation influence également le droit du travail en France.
                 </div>
@@ -1467,16 +1467,16 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg elbebC"
+          class="sc-d8f596bd-0 hCPxfF"
         >
           <div
-            class="sc-kzqdkY kUMpKA"
+            class="sc-e32628d4-0 eFvDQP"
           >
             <h2
-              class="sc-dSIIpw crsCQS"
+              class="sc-d6e72754-0 egzXkL"
             >
               <span
-                class="sc-gsFSXq ljkohw"
+                class="sc-a4d7a179-0 gGBEJx"
               />
               Existe-t-il une hiérarchie entre les textes ?
             </h2>
@@ -1497,7 +1497,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
           >
             <div>
               <div
-                class="sc-jlZhew dQjPAA"
+                class="sc-7c7e88ca-0 fnFiKD"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -1508,29 +1508,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-8"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-8"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX kJbFa"
+                      class="sc-7c7e88ca-3 hXUKGj"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         1
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv jhiIDH"
+                      class="sc-7c7e88ca-6 hILpAR"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -1599,10 +1599,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Les textes internationaux et européens
@@ -1610,7 +1610,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -1630,13 +1630,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-8"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Les textes nationaux doivent être conformes aux textes internationaux et européens.
@@ -1647,7 +1647,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </div>
             <div>
               <div
-                class="sc-jlZhew kHTjyb"
+                class="sc-7c7e88ca-0 deheNc"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -1658,29 +1658,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-9"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-9"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX cBA-dJb"
+                      class="sc-7c7e88ca-3 hbTIDu"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         2
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -1707,10 +1707,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           La Constitution
@@ -1718,7 +1718,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -1738,13 +1738,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-9"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Tous les textes nationaux doivent être conformes à la Constitution française ainsi qu’au bloc de constitutionnalité.
@@ -1755,7 +1755,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </div>
             <div>
               <div
-                class="sc-jlZhew kHTjyb"
+                class="sc-7c7e88ca-0 deheNc"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -1766,29 +1766,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-10"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-10"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX cBA-dJb"
+                      class="sc-7c7e88ca-3 hbTIDu"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         3
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -1825,10 +1825,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Lois, ordonnances et décrets (Code du travail)
@@ -1836,7 +1836,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -1856,16 +1856,16 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-10"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Hiérarchie entre le Code du travail et les conventions et accords collectifs
                     </h4>
@@ -1873,12 +1873,12 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       Il n’y a pas de règle de hiérarchie unique pour tous les articles du Code du travail. Il existe 3 hiérarchies possibles :
                     </p>
                     <div
-                      class="sc-ktPPKK jtACTz"
+                      class="sc-22ca441a-1 hfWiuC"
                       data-accordion-component="Accordion"
                     >
                       <div>
                         <div
-                          class="sc-jXbUNg heDTFL"
+                          class="sc-1571bed7-0"
                           data-accordion-component="AccordionItem"
                         >
                           <div
@@ -1889,7 +1889,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               aria-controls="accordion__panel-raa-11"
                               aria-disabled="false"
                               aria-expanded="false"
-                              class="sc-kpDqfm heoudo"
+                              class="sc-1571bed7-2 gNtlHI"
                               data-accordion-component="AccordionItemButton"
                               id="accordion__heading-raa-11"
                               role="button"
@@ -1897,7 +1897,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                             >
                               <svg
                                 aria-hidden="true"
-                                class="sc-imWYAI gTeNha"
+                                class="sc-93c68677-0 fWneNg"
                                 fill="none"
                                 height="24"
                                 stroke="currentColor"
@@ -1913,10 +1913,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                                 />
                               </svg>
                               <div
-                                class="sc-dAlyuH eyjExg"
+                                class="sc-1571bed7-3 figaQV"
                               >
                                 <h5
-                                  class="sc-kAyceB dvmaTz"
+                                  class="sc-b879fc2d-0 hyiHle"
                                   style="margin: 0px;"
                                 >
                                   Les conventions et accords collectifs doivent respecter le Code du travail
@@ -1926,13 +1926,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <div
                             aria-hidden="true"
-                            class="sc-dhKdcB hlTUsz"
+                            class="sc-1571bed7-1 hamHiw"
                             data-accordion-component="AccordionItemPanel"
                             hidden=""
                             id="accordion__panel-raa-11"
                           >
                             <div
-                              class="sc-bXCLTC fcbJdD"
+                              class="sc-32c7807-0 iMDCLs"
                             >
                               <p>
                                 Il existe des règles dans le Code du travail que les conventions et accords collectifs doivent respecter. Les conventions et accords collectifs peuvent toutefois prévoir des mesures plus avantageuses pour le salarié. Dans ce cas, c’est le texte le plus avantageux pour le salarié qui s’applique.
@@ -1943,7 +1943,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div>
                         <div
-                          class="sc-jXbUNg crDDWD"
+                          class="sc-1571bed7-0 dpEeGj"
                           data-accordion-component="AccordionItem"
                         >
                           <div
@@ -1954,7 +1954,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               aria-controls="accordion__panel-raa-12"
                               aria-disabled="false"
                               aria-expanded="false"
-                              class="sc-kpDqfm heoudo"
+                              class="sc-1571bed7-2 gNtlHI"
                               data-accordion-component="AccordionItemButton"
                               id="accordion__heading-raa-12"
                               role="button"
@@ -1962,7 +1962,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                             >
                               <svg
                                 aria-hidden="true"
-                                class="sc-imWYAI gTeNha"
+                                class="sc-93c68677-0 fWneNg"
                                 fill="none"
                                 height="24"
                                 stroke="currentColor"
@@ -1978,10 +1978,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                                 />
                               </svg>
                               <div
-                                class="sc-dAlyuH eyjExg"
+                                class="sc-1571bed7-3 figaQV"
                               >
                                 <h5
-                                  class="sc-kAyceB dvmaTz"
+                                  class="sc-b879fc2d-0 hyiHle"
                                   style="margin: 0px;"
                                 >
                                   Les conventions et accords collectifs peuvent prévoir des mesures différentes que celles posées par le Code du travail
@@ -1991,13 +1991,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <div
                             aria-hidden="true"
-                            class="sc-dhKdcB hlTUsz"
+                            class="sc-1571bed7-1 hamHiw"
                             data-accordion-component="AccordionItemPanel"
                             hidden=""
                             id="accordion__panel-raa-12"
                           >
                             <div
-                              class="sc-bXCLTC fcbJdD"
+                              class="sc-32c7807-0 iMDCLs"
                             >
                               <p>
                                 Il existe d’autres règles dans le Code du travail qui permettent aux conventions et accords collectifs, sous certaines conditions, de prévoir des règles différentes de celles de la loi. Dans ce cas, c’est l’accord collectif ou la convention collective qui s’applique même s’il est plus défavorable pour le salarié que la loi.
@@ -2011,7 +2011,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <div>
                         <div
-                          class="sc-jXbUNg crDDWD"
+                          class="sc-1571bed7-0 dpEeGj"
                           data-accordion-component="AccordionItem"
                         >
                           <div
@@ -2022,7 +2022,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                               aria-controls="accordion__panel-raa-13"
                               aria-disabled="false"
                               aria-expanded="false"
-                              class="sc-kpDqfm heoudo"
+                              class="sc-1571bed7-2 gNtlHI"
                               data-accordion-component="AccordionItemButton"
                               id="accordion__heading-raa-13"
                               role="button"
@@ -2030,7 +2030,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                             >
                               <svg
                                 aria-hidden="true"
-                                class="sc-imWYAI gTeNha"
+                                class="sc-93c68677-0 fWneNg"
                                 fill="none"
                                 height="24"
                                 stroke="currentColor"
@@ -2046,10 +2046,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                                 />
                               </svg>
                               <div
-                                class="sc-dAlyuH eyjExg"
+                                class="sc-1571bed7-3 figaQV"
                               >
                                 <h5
-                                  class="sc-kAyceB dvmaTz"
+                                  class="sc-b879fc2d-0 hyiHle"
                                   style="margin: 0px;"
                                 >
                                   En l’absence de convention ou d’accord collectif sur le sujet, le Code du travail s’applique
@@ -2059,13 +2059,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </div>
                           <div
                             aria-hidden="true"
-                            class="sc-dhKdcB hlTUsz"
+                            class="sc-1571bed7-1 hamHiw"
                             data-accordion-component="AccordionItemPanel"
                             hidden=""
                             id="accordion__panel-raa-13"
                           >
                             <div
-                              class="sc-bXCLTC fcbJdD"
+                              class="sc-32c7807-0 iMDCLs"
                             >
                               <p>
                                 Il existe également des règles dans le Code du travail qui s’appliquent par défaut, c’est-à-dire uniquement lorsqu’il n’y a pas de convention ou d’accord collectif sur le sujet. S’il existe une convention ou un accord collectif sur le sujet alors la loi ne s’applique pas.
@@ -2079,13 +2079,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                     </div>
                     <div
-                      class="sc-iGgWBj cRLRjd"
+                      class="sc-2a0a4b0a-0 hPfzrL"
                     >
                       <div
-                        class="sc-hRJfrW gLeKXc"
+                        class="sc-66a696c4-0 A-dcpl"
                       >
                         <div
-                          class="sc-iHbSHJ dqcYtl"
+                          class="sc-66a696c4-1 dvlKxa"
                         >
                           <svg
                             aria-hidden="true"
@@ -2105,20 +2105,20 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </svg>
                         </div>
                         <div
-                          class="sc-klVQfs giEiHo"
+                          class="sc-66a696c4-2 eRMOZl"
                         >
                           <h4
-                            class="sc-gdyeKB jXhxaU"
+                            class="sc-bdaf45c8-0 nMxaE"
                           >
                             Attention à certaines règles du Code du travail
                           </h4>
                           <p
-                            class="sc-fMMURN vrxVQ"
+                            class="sc-22ca441a-0 JloUo"
                           >
                             Il existe des règles du Code du travail auxquelles tous les textes situés en bas ne peuvent pas déroger même si les textes sont plus avantageux pour le salarié. La loi interdit toute dérogation possible. Les textes situés en bas doivent purement et simplement respecter ces règles.
                           </p>
                           <p
-                            class="sc-fMMURN vrxVQ"
+                            class="sc-22ca441a-0 JloUo"
                           >
                             <i>
                               Exemple : la règle selon laquelle le Conseil des prud’hommes est le seul compétent pour les contentieux liés au travail.
@@ -2135,7 +2135,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
               id="hierarchie"
             >
               <div
-                class="sc-jlZhew kHTjyb"
+                class="sc-7c7e88ca-0 deheNc"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -2146,29 +2146,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-hierarchie"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-hierarchie"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX cBA-dJb"
+                      class="sc-7c7e88ca-3 hbTIDu"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         4
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -2203,10 +2203,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Les conventions et accords collectifs
@@ -2214,7 +2214,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -2234,19 +2234,19 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-hierarchie"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       La règle qui détermine quel est le texte applicable est différente en fonction du niveau des textes comparés.
                     </p>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Hiérarchie entre convention collective de branche et accord d’entreprise
                     </h4>
@@ -2254,13 +2254,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       Le principe est que l’accord d’entreprise s’applique en priorité par rapport à l’accord ou la convention collective de branche. Cela signifie que même si l’accord d’entreprise prévoit des règles différentes, voire plus désavantageuses, que la convention collective de branche, ce sera lui qui s’appliqura au salarié et non la convention collective de branche.
                     </p>
                     <div
-                      class="sc-iGgWBj cRLRjd"
+                      class="sc-2a0a4b0a-0 hPfzrL"
                     >
                       <div
-                        class="sc-hRJfrW gLeKXc"
+                        class="sc-66a696c4-0 A-dcpl"
                       >
                         <div
-                          class="sc-iHbSHJ dqcYtl"
+                          class="sc-66a696c4-1 dvlKxa"
                         >
                           <svg
                             aria-hidden="true"
@@ -2280,15 +2280,15 @@ exports[`<DroitDuTravail /> should render 1`] = `
                           </svg>
                         </div>
                         <div
-                          class="sc-klVQfs giEiHo"
+                          class="sc-66a696c4-2 eRMOZl"
                         >
                           <p
-                            class="sc-ePDLzJ epLRJG"
+                            class="sc-22ca441a-4 ierDks"
                           >
                             Ce principe ne s’applique pas dans
                              
                             <button
-                              class="sc-kOPcWz gACNan"
+                              class="sc-95bd4344-0 hgVQqQ"
                             >
                               13 matières
                               <svg
@@ -2307,7 +2307,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                             où la loi reconnaît la primauté à la convention collective de branche et
                              
                             <button
-                              class="sc-kOPcWz gACNan"
+                              class="sc-95bd4344-0 hgVQqQ"
                             >
                               4 matières
                               <svg
@@ -2332,7 +2332,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       Ces règles sont les mêmes pour la hiérarchie entre convention collective de branche et accord de groupe ou accord d’établissement.
                     </p>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Hiérarchie entre accord de groupe et accord d’entreprise
                     </h4>
@@ -2340,7 +2340,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       L’accord de groupe s’applique en priorité par rapport à l’accord d’entreprise ou l’accord d’établissement si l’accord de groupe l’indique dans son accord. Si rien n’est indiqué dans l’accord de groupe alors l’accord le plus avantageux pour le salarié s’applique.
                     </p>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Hiérarchie entre accord d’entreprise et accord d’établissement
                     </h4>
@@ -2353,7 +2353,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </div>
             <div>
               <div
-                class="sc-jlZhew kHTjyb"
+                class="sc-7c7e88ca-0 deheNc"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -2364,29 +2364,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-15"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-15"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX cBA-dJb"
+                      class="sc-7c7e88ca-3 hbTIDu"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         5
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -2429,10 +2429,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Les usages et les engagements unilatéraux
@@ -2440,7 +2440,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -2460,13 +2460,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-15"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Les usages et les engagements unilatéraux doivent respecter les textes situés en haut. Ils peuvent être plus avantageux pour le salarié. Dans ce cas, ce sont les textes les plus avantageux qui s’appliquent.
@@ -2477,7 +2477,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </div>
             <div>
               <div
-                class="sc-jlZhew kHTjyb"
+                class="sc-7c7e88ca-0 deheNc"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -2488,29 +2488,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-16"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-16"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX cBA-dJb"
+                      class="sc-7c7e88ca-3 hbTIDu"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         6
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -2529,10 +2529,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Le règlement intérieur de l’entreprise
@@ -2540,7 +2540,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -2560,13 +2560,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-16"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Le règlement intérieur doit respecter les textes situés en haut. Il peut être plus avantageux pour le salarié. Dans ce cas, c’est le texte le plus avantageux pour le salarié qui s’applique.
@@ -2577,7 +2577,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </div>
             <div>
               <div
-                class="sc-jlZhew vEYde"
+                class="sc-7c7e88ca-0 bjGinB"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -2588,29 +2588,29 @@ exports[`<DroitDuTravail /> should render 1`] = `
                     aria-controls="accordion__panel-raa-17"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-jEACwC gbOMDj"
+                    class="sc-7c7e88ca-2 aTnVj"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-raa-17"
                     role="button"
                     tabindex="0"
                   >
                     <div
-                      class="sc-cPiKLX bgsIxq"
+                      class="sc-7c7e88ca-3 caFvzL"
                     >
                       <div
-                        class="sc-dLMFU kbbEMd"
+                        class="sc-7c7e88ca-4 eWhXsI"
                       >
                         7
                       </div>
                       <div
-                        class="sc-eDPEul caZkRi"
+                        class="sc-7c7e88ca-5 ifqdGp"
                       />
                     </div>
                     <div
-                      class="sc-eldPxv gglxHW"
+                      class="sc-7c7e88ca-6 hbsRUQ"
                     >
                       <div
-                        class="sc-fPXMVe bpfUse"
+                        class="sc-7c7e88ca-7 ebYWUW"
                       >
                         <svg
                           aria-hidden="true"
@@ -2639,10 +2639,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="sc-gFqAkR gQJhUs"
+                        class="sc-7c7e88ca-8 jnGuGj"
                       >
                         <h3
-                          class="sc-kAyceB dvmaTz"
+                          class="sc-b879fc2d-0 hyiHle"
                           style="margin: 0px;"
                         >
                           Le contrat de travail
@@ -2650,7 +2650,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                       </div>
                       <svg
                         aria-hidden="true"
-                        class="sc-imWYAI gTeNha"
+                        class="sc-93c68677-0 fWneNg"
                         fill="none"
                         height="24"
                         stroke="currentColor"
@@ -2670,13 +2670,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-cwHptR fxHYbF"
+                  class="sc-7c7e88ca-1 jVFBbD"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-raa-17"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Le contrat de travail doit respecter les textes situés en haut. Il peut prévoir des mesures plus avantageuses pour le salarié. Dans ce cas, c’est le contrat de travail qui s’applique.
@@ -2690,45 +2690,45 @@ exports[`<DroitDuTravail /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-fAGzit kTBFVN"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-bkSUFG cXqWSx"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-deXhhX hHbWTj"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dQEtJz dPpwpV jTyZXO"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-imwsjW jDOHmf"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2742,28 +2742,28 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-kCMKrZ jBhcwF"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-dJiZtA gZgZQL UAXPn"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-dGCmGc hgWVvM"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-iLsKjm bHyFYd sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-epALIP kMmTaI PLedh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -2771,7 +2771,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -2779,7 +2779,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -2787,7 +2787,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -2795,7 +2795,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -2805,22 +2805,22 @@ exports[`<DroitDuTravail /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-dGCmGc hgWVvM"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-iLsKjm bHyFYd sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-epALIP kMmTaI PLedh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -2828,7 +2828,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -2836,7 +2836,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -2847,17 +2847,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-iLsKjm bHyFYd sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-epALIP kMmTaI PLedh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -2865,7 +2865,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -2873,7 +2873,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -2883,22 +2883,22 @@ exports[`<DroitDuTravail /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-dGCmGc hgWVvM"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-iLsKjm bHyFYd sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-epALIP kMmTaI PLedh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -2906,7 +2906,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -2914,7 +2914,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -2925,17 +2925,17 @@ exports[`<DroitDuTravail /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-iLsKjm bHyFYd sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-epALIP kMmTaI PLedh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -2943,7 +2943,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -2951,7 +2951,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-lbJcrp fVfqop"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -2963,10 +2963,10 @@ exports[`<DroitDuTravail /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-jOnpCo gZgZQL dNBAUF"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-kFWlue gGpaBv"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -2979,7 +2979,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-bkEOxz brUpVF"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -3019,13 +3019,13 @@ exports[`<DroitDuTravail /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-leSDtu vcyTG"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dhFUGM dxwgZk"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-bkEOxz sc-fbKhjd brUpVF jMnJWO"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -3067,7 +3067,7 @@ exports[`<DroitDuTravail /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-bJBgwP cKCQfW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/fiche-ministere-travail.test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/fiche-ministere-travail.test.tsx.snap
index ec2a3868ac..b6fe914142 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/fiche-ministere-travail.test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/fiche-ministere-travail.test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<FicheMT /> should render 1`] = `
 <div>
   <div
-    class="sc-gFnajm UJvTC"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-dISpDn gDocmi"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-lfYzqA ehigDg"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-ijDOKB hgWBQl"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-cKXybt gZgZQL SAuf"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-lgjHQU cjLTLt"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-fatcLD hgfKJv"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-cgjDci gIRoxg"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<FicheMT /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-gvPdwL imDmyD"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-dChVcU fGdpDW"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<FicheMT /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-jlGgGc dIeNLL"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<FicheMT /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-gplwa-d hvAaYK"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-gtJxfw gzkgek"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-rPWID dtqUFz"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<FicheMT /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-eBwKMn kuyUMK"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-pKqro hIwZxM"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<FicheMT /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-djTQaJ bGcuuD"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bHnlcS bZXUzd hJoLzX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-lmUcrn fAxPzB"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<FicheMT /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-dBFDNq iBJtNE"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-epRvzc kODNCn"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-djVXDX bXMYkb"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-ggqIjW NzCUk"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<FicheMT /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-btwKTd bKpfAC"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,28 +237,28 @@ exports[`<FicheMT /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-eONNys blZesF"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <nav
         aria-label="Fil d'ariane"
-        class="sc-fbKhjd eIXviQ"
+        class="sc-4acc650d-0 iZmHLs"
       >
         <ol
-          class="sc-aXZVg sc-leSDtu gZgZQL hobLHx"
+          class="sc-d8f596bd-0 sc-4acc650d-1 jtWYDW fiOSiq"
         >
           <li
-            class="sc-bJBgwP gzNKqE"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <a
-              class="sc-dGCmGc bZDAcV"
+              class="sc-4acc650d-3 iwBcqI"
               href="/"
               title="Retour à l'accueil"
             >
               <svg
                 aria-hidden="true"
-                class="sc-fAGzit eersKB"
+                class="sc-4acc650d-4 jhEUEf"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -272,11 +272,11 @@ exports[`<FicheMT /> should render 1`] = `
             </a>
           </li>
           <li
-            class="sc-bJBgwP gzNKqE"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <svg
               aria-hidden="true"
-              class="sc-bkSUFG gJZEej"
+              class="sc-4acc650d-5 doDLRb"
               fill="none"
               viewBox="0 0 16 16"
               xmlns="http://www.w3.org/2000/svg"
@@ -288,7 +288,7 @@ exports[`<FicheMT /> should render 1`] = `
             </svg>
              
             <a
-              class="sc-dGCmGc bZDAcV"
+              class="sc-4acc650d-3 iwBcqI"
               href="/themes/6-sante-securite-et-conditions-de-travail"
             >
               Santé, sécurité et conditions de travail
@@ -297,49 +297,49 @@ exports[`<FicheMT /> should render 1`] = `
         </ol>
       </nav>
       <div
-        class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+        class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
       >
         <div
-          class="sc-kMribo kbmJZQ sc-iaJaUu dDvKpT"
+          class="sc-b551711e-1 fIhGar sc-6ceab43d-1 eRcelG"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
-              class="sc-iGgWBj biWgIW"
+              class="sc-2a0a4b0a-0 hpYuum"
             >
               <div
-                class="sc-isRoRg nyeZd"
+                class="sc-f2a41fcc-1 fNkZjj"
               >
                 <div>
                   <div
-                    class="sc-dWZqqJ cXWJpN"
+                    class="sc-f2a41fcc-0 hQZrlv"
                   >
                     <p
-                      class="sc-jaXxmE sc-eNSrOW kgvDSh cFkSzn"
+                      class="sc-9261d202-0 sc-f2a41fcc-3 iTbcuX jigJXx"
                     >
                       Santé, sécurité et conditions de travail
                     </p>
                     <header
-                      class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                      class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                     >
                       <h1
-                        class="sc-bVHCgj jaeZrq"
+                        class="sc-5f05e99b-0 cWsbaq"
                       >
                         <span
-                          class="sc-gsFSXq ljkohw"
+                          class="sc-a4d7a179-0 gGBEJx"
                         />
                         Fiche MT test
                       </h1>
                     </header>
                     <div
-                      class="sc-jOnpCo iSestF"
+                      class="sc-f2a41fcc-5 tnWPU"
                     >
                       <p
-                        class="sc-krNlru bWTKgF"
+                        class="sc-3633cc97-1 ksBhgq"
                       >
                         <span
-                          class="sc-dhFUGM knjPBM"
+                          class="sc-f2a41fcc-8 ObhLq"
                         >
                           Source:
                            
@@ -354,12 +354,12 @@ exports[`<FicheMT /> should render 1`] = `
                         </span>
                         <span
                           aria-hidden="true"
-                          class="sc-bkEOxz tWCif"
+                          class="sc-f2a41fcc-7 cSmEgq"
                         >
                            - 
                         </span>
                         <span
-                          class="sc-dhFUGM knjPBM"
+                          class="sc-f2a41fcc-8 ObhLq"
                         >
                           Mis à jour le
                            : 
@@ -369,13 +369,13 @@ exports[`<FicheMT /> should render 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-kFWlue RBerz"
+                    class="sc-f2a41fcc-6 vLCby"
                   >
                     <div
-                      class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                      class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                     >
                       <p
-                        class="sc-krNlru bpribs"
+                        class="sc-3633cc97-1 bjxtLv"
                       >
                         lorem ipsum intro
                       </p>
@@ -388,7 +388,7 @@ exports[`<FicheMT /> should render 1`] = `
                         id="t1-Visite-d-information-et-de-prevention-pour-qui"
                       >
                         <div
-                          class="sc-jXbUNg heDTFL"
+                          class="sc-1571bed7-0"
                           data-accordion-component="AccordionItem"
                         >
                           <div
@@ -399,7 +399,7 @@ exports[`<FicheMT /> should render 1`] = `
                               aria-controls="accordion__panel-t1-Visite-d-information-et-de-prevention-pour-qui"
                               aria-disabled="false"
                               aria-expanded="false"
-                              class="sc-kpDqfm heoudo"
+                              class="sc-1571bed7-2 gNtlHI"
                               data-accordion-component="AccordionItemButton"
                               id="accordion__heading-t1-Visite-d-information-et-de-prevention-pour-qui"
                               role="button"
@@ -407,7 +407,7 @@ exports[`<FicheMT /> should render 1`] = `
                             >
                               <svg
                                 aria-hidden="true"
-                                class="sc-imWYAI gTeNha"
+                                class="sc-93c68677-0 fWneNg"
                                 fill="none"
                                 height="24"
                                 stroke="currentColor"
@@ -423,10 +423,10 @@ exports[`<FicheMT /> should render 1`] = `
                                 />
                               </svg>
                               <div
-                                class="sc-dAlyuH eyjExg"
+                                class="sc-1571bed7-3 figaQV"
                               >
                                 <h2
-                                  class="sc-kAyceB dvmaTz"
+                                  class="sc-b879fc2d-0 hyiHle"
                                   style="margin: 0px;"
                                 >
                                   1) Visite d’information et de prévention : pour qui ?
@@ -436,16 +436,16 @@ exports[`<FicheMT /> should render 1`] = `
                           </div>
                           <div
                             aria-hidden="true"
-                            class="sc-dhKdcB hlTUsz"
+                            class="sc-1571bed7-1 hamHiw"
                             data-accordion-component="AccordionItemPanel"
                             hidden=""
                             id="accordion__panel-t1-Visite-d-information-et-de-prevention-pour-qui"
                           >
                             <div
-                              class="sc-bXCLTC fcbJdD"
+                              class="sc-32c7807-0 iMDCLs"
                             >
                               <div
-                                class="sc-fUBkdm sc-bStcSt iFPBA-d"
+                                class="sc-85c198dc-0 sc-6ceab43d-0 fpZaix"
                               >
                                 <p>
                                   Depuis le 1er janvier 2017, la 
@@ -503,22 +503,22 @@ exports[`<FicheMT /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-satoz kemhwG"
+                  class="sc-f2a41fcc-2 bdFsMG"
                 >
                   <div
-                    class="sc-empnci ePIFiG"
+                    class="sc-ef7c173-0 dYghnF"
                   >
                     <button
-                      class="sc-fThUAz cMaZgB no-after spacing-left"
+                      class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                       title="Partager sur Facebook"
                       type="button"
                     >
                       <span
-                        class="sc-czkgLR hhhBCF"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-dycYrt dgTXSK"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -536,16 +536,16 @@ exports[`<FicheMT /> should render 1`] = `
                       </span>
                     </button>
                     <a
-                      class="sc-SrznA iUMYoy spacing-left"
+                      class="sc-ef7c173-2 fyqTbA spacing-left"
                       href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Fiche%20MT%20test&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                       title="Envoyer par email"
                     >
                       <span
-                        class="sc-czkgLR hhhBCF"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-dycYrt dgTXSK"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -567,16 +567,16 @@ exports[`<FicheMT /> should render 1`] = `
                       </span>
                     </a>
                     <button
-                      class="sc-fThUAz cMaZgB spacing-left"
+                      class="sc-ef7c173-1 eNIxDW spacing-left"
                       title="Partager sur LinkedIn"
                       type="button"
                     >
                       <span
-                        class="sc-czkgLR hhhBCF"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-dycYrt dgTXSK"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -594,19 +594,19 @@ exports[`<FicheMT /> should render 1`] = `
                       </span>
                     </button>
                     <div
-                      class="sc-hCPjZK dlWASs"
+                      class="sc-95cc8fb1-0 iHYHyU"
                     >
                       <button
-                        class="sc-fThUAz cMaZgB spacing-left"
+                        class="sc-ef7c173-1 eNIxDW spacing-left"
                         title="Plus d’options"
                         type="button"
                       >
                         <span
-                          class="sc-czkgLR hhhBCF"
+                          class="sc-ef7c173-3 dTKkFC"
                         >
                           <svg
                             aria-hidden="true"
-                            class="sc-dycYrt dgTXSK"
+                            class="sc-ef7c173-4 iQRswg"
                             fill="none"
                             viewBox="0 0 16 16"
                             xmlns="http://www.w3.org/2000/svg"
@@ -640,28 +640,28 @@ exports[`<FicheMT /> should render 1`] = `
             </div>
           </div>
           <div
-            class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+            class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
           >
             <p
-              class="sc-krNlru bpribs"
+              class="sc-3633cc97-1 bjxtLv"
             >
               Partager ce contenu : 
             </p>
             <div
-              class="sc-empnci ePIFiG"
+              class="sc-ef7c173-0 dYghnF"
             >
               <button
-                class="sc-fThUAz cMaZgB no-after spacing-left"
+                class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                 tabindex="-1"
                 title="Partager sur Facebook"
                 type="button"
               >
                 <span
-                  class="sc-czkgLR hhhBCF"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-dycYrt dgTXSK"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -679,17 +679,17 @@ exports[`<FicheMT /> should render 1`] = `
                 </span>
               </button>
               <a
-                class="sc-SrznA iUMYoy spacing-left"
+                class="sc-ef7c173-2 fyqTbA spacing-left"
                 href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Fiche%20MT%20test&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                 tabindex="-1"
                 title="Envoyer par email"
               >
                 <span
-                  class="sc-czkgLR hhhBCF"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-dycYrt dgTXSK"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -711,17 +711,17 @@ exports[`<FicheMT /> should render 1`] = `
                 </span>
               </a>
               <button
-                class="sc-fThUAz cMaZgB spacing-left"
+                class="sc-ef7c173-1 eNIxDW spacing-left"
                 tabindex="-1"
                 title="Partager sur LinkedIn"
                 type="button"
               >
                 <span
-                  class="sc-czkgLR hhhBCF"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-dycYrt dgTXSK"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -739,20 +739,20 @@ exports[`<FicheMT /> should render 1`] = `
                 </span>
               </button>
               <div
-                class="sc-hCPjZK dlWASs"
+                class="sc-95cc8fb1-0 iHYHyU"
               >
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   tabindex="-1"
                   title="Plus d’options"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -783,35 +783,35 @@ exports[`<FicheMT /> should render 1`] = `
             </div>
           </div>
           <div
-            class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+            class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
           >
             <div
-              class="sc-aXZVg gZgZQL"
+              class="sc-d8f596bd-0 jtWYDW"
             >
               <div
-                class="sc-iGgWBj cRLRjd"
+                class="sc-2a0a4b0a-0 hPfzrL"
               >
                 <div
-                  class="sc-dJiZtA deVhRH"
+                  class="sc-66a51d8b-3 iitVHg"
                 >
                   <h2
-                    class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                    class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
                   >
                     <span
-                      class="sc-gsFSXq cdZUuw"
+                      class="sc-a4d7a179-0 jSVvrt"
                     />
                     Avez-vous trouvé la réponse à votre question ?
                   </h2>
                   <p
-                    class="sc-iLsKjm gCpcot"
+                    class="sc-66a51d8b-5 eRJUhM"
                   >
                     <button
-                      class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                      class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                     >
                       Non
                     </button>
                     <button
-                      class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                      class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                     >
                       Oui
                     </button>
@@ -824,45 +824,45 @@ exports[`<FicheMT /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-cXPBUD endyqC"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-edKZPI HQPsO"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bhqpjJ dOfPbJ"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-iLLODe dPpwpV kqfKep"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fPrdXf iKiIuw"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -876,28 +876,28 @@ exports[`<FicheMT /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-hGMjit jZFnQm"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-ezreuY gZgZQL ktPOLz"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fUkmAC igZTkS"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-jwZKMi kVBpIX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-boZgaH kMmTaI OXnot"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -905,7 +905,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -913,7 +913,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -921,7 +921,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -929,7 +929,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -939,22 +939,22 @@ exports[`<FicheMT /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fUkmAC igZTkS"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-jwZKMi kVBpIX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-boZgaH kMmTaI OXnot"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -962,7 +962,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -970,7 +970,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -981,17 +981,17 @@ exports[`<FicheMT /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-jwZKMi kVBpIX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-boZgaH kMmTaI OXnot"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -999,7 +999,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -1007,7 +1007,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -1017,22 +1017,22 @@ exports[`<FicheMT /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fUkmAC igZTkS"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-jwZKMi kVBpIX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-boZgaH kMmTaI OXnot"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -1040,7 +1040,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -1048,7 +1048,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -1059,17 +1059,17 @@ exports[`<FicheMT /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-jwZKMi kVBpIX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-boZgaH kMmTaI OXnot"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -1077,7 +1077,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -1085,7 +1085,7 @@ exports[`<FicheMT /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-gJCZQp ixRNIF"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -1097,10 +1097,10 @@ exports[`<FicheMT /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-kUdmhA gZgZQL kgevFI"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-hgRRfv bqlnXK"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -1113,7 +1113,7 @@ exports[`<FicheMT /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-emIrwa ePEOrl"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -1153,13 +1153,13 @@ exports[`<FicheMT /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-faUjhM eHjuyM"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-gRtvSG ivtFky"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-emIrwa sc-dUYLmH ePEOrl kMwdEi"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -1201,7 +1201,7 @@ exports[`<FicheMT /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-cezyBN oXIHd"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire-[slug].test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire-[slug].test.tsx.snap
index 1ddcde7938..0a5abb8717 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire-[slug].test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire-[slug].test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<Term /> should render 1`] = `
 <div>
   <div
-    class="sc-eHsDsR jvYoqI"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-jdkBTo hwFMeW"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fUBkdm cdIumq"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-hBtRBD hhFrKi"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL hTNWeq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gEkIjz eZnYXg"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-hoLEA cAIauw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-bOhtcR fxvZkA"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<Term /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-camqpD jBVvSj"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-deXhhX dCERfw"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<Term /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-epALIP byJirg"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<Term /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-iLsKjm jreAvU"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-dJiZtA hVSvKc"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dQEtJz gghWjv"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<Term /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-hYmls jvwQAF"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-kbdlSk dVYOry"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<Term /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-fFlnrN dIbHpx"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bOQTJJ bZXUzd diAojX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-eifrsQ hKKQkM"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<Term /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-gweoQa kBXmsJ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-bddgXz koXLlw"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-jdUcAg jEULqB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-eIcdZJ ffrCUe"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<Term /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-fyVfxW ighGDQ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,33 +237,33 @@ exports[`<Term /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-fmzyuX cpFQIA"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg elbebC"
+          class="sc-d8f596bd-0 hCPxfF"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               Accord d'entreprise
             </h1>
           </header>
           <div
-            class="sc-iGgWBj biWgIW"
+            class="sc-2a0a4b0a-0 hpYuum"
           >
             <table
-              class="sc-cmaqmh juENof"
+              class="sc-4e3ba411-0 kKVapO"
             >
               <tbody>
                 <tr>
@@ -290,45 +290,45 @@ exports[`<Term /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-jOnpCo hiGzNx"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kFWlue jIqemF"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bkEOxz jYDFgL"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dhFUGM dPpwpV iEDLPP"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fbKhjd fEcfGH"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -342,28 +342,28 @@ exports[`<Term /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-leSDtu ddTDCo"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-bJBgwP gZgZQL kMFXol"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -371,7 +371,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -379,7 +379,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -387,7 +387,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -395,7 +395,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -405,22 +405,22 @@ exports[`<Term /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -428,7 +428,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -436,7 +436,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -447,17 +447,17 @@ exports[`<Term /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -465,7 +465,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -473,7 +473,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -483,22 +483,22 @@ exports[`<Term /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -506,7 +506,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -514,7 +514,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -525,17 +525,17 @@ exports[`<Term /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -543,7 +543,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -551,7 +551,7 @@ exports[`<Term /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -563,10 +563,10 @@ exports[`<Term /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-hTUWRQ gZgZQL iOQcAv"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-lizKOf jlNHQY"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -579,7 +579,7 @@ exports[`<Term /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-eoVZPG dZZYot"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -619,13 +619,13 @@ exports[`<Term /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-satoz iTaWXu"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dWZqqJ bGxlNu"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-eoVZPG sc-isRoRg dZZYot hYUXaZ"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -667,7 +667,7 @@ exports[`<Term /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-eNSrOW fRbHNW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire.test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire.test.tsx.snap
index 56e84bddaa..22cbc64df9 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire.test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/glossaire.test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<Glossaire /> should render 1`] = `
 <div>
   <div
-    class="sc-eHsDsR jvYoqI"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-jdkBTo hwFMeW"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fUBkdm cdIumq"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-hBtRBD hhFrKi"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL hTNWeq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gEkIjz eZnYXg"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-hoLEA cAIauw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-bOhtcR fxvZkA"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<Glossaire /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-camqpD jBVvSj"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-deXhhX dCERfw"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<Glossaire /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-epALIP byJirg"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<Glossaire /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-iLsKjm jreAvU"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-dJiZtA hVSvKc"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dQEtJz gghWjv"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<Glossaire /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-hYmls jvwQAF"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-kbdlSk dVYOry"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<Glossaire /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-fFlnrN dIbHpx"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bOQTJJ bZXUzd diAojX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-eifrsQ hKKQkM"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<Glossaire /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-gweoQa kBXmsJ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-bddgXz koXLlw"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-jdUcAg jEULqB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-eIcdZJ ffrCUe"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<Glossaire /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-fyVfxW ighGDQ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,39 +237,39 @@ exports[`<Glossaire /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-fmzyuX cpFQIA"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg elbebC"
+          class="sc-d8f596bd-0 hCPxfF"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               Glossaire
             </h1>
             <p
-              class="sc-bDpDS HtTuQ"
+              class="sc-ea8c0a81-0 hsqxhF"
             >
               Les définitions de ce glossaire, disponibles en surbrillance dans les textes des réponses, ont pour objectif d’améliorer la compréhension des termes juridiques. Elles ne se substituent pas à la définition juridique exacte de ces termes.
             </p>
           </header>
           <div
-            class="sc-iGgWBj biWgIW"
+            class="sc-2a0a4b0a-0 hpYuum"
           >
             <ul>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <a
                   href="#ancre-A"
@@ -278,175 +278,175 @@ exports[`<Glossaire /> should render 1`] = `
                 </a>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   B
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   C
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   D
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   E
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   F
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   G
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   H
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   I
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   J
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   K
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   L
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   M
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   N
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   O
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   P
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   Q
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   R
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   S
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   T
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   U
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   V
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   W
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   X
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   Y
                 </span>
               </li>
               <li
-                class="sc-cspYLC fpbYKk"
+                class="sc-a28229ce-0 jLkhCp"
               >
                 <span>
                   Z
@@ -455,20 +455,20 @@ exports[`<Glossaire /> should render 1`] = `
             </ul>
             <div>
               <div
-                class="sc-kzqdkY dZUDIh"
+                class="sc-e32628d4-0 cwDqXq"
                 id="ancre-A"
               >
                 <h2
-                  class="sc-dSIIpw otPXl"
+                  class="sc-d6e72754-0 gUBAuw"
                 >
                   <span
-                    class="sc-gsFSXq ljkohw"
+                    class="sc-a4d7a179-0 gGBEJx"
                   />
                   A
                 </h2>
               </div>
               <ul
-                class="sc-cfxfcM kMmTaI"
+                class="sc-ab356c14-0 bpNHPl"
               >
                 <li>
                   <p>
@@ -486,45 +486,45 @@ exports[`<Glossaire /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-jOnpCo hiGzNx"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kFWlue jIqemF"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bkEOxz jYDFgL"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dhFUGM dPpwpV iEDLPP"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fbKhjd fEcfGH"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -538,28 +538,28 @@ exports[`<Glossaire /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-leSDtu ddTDCo"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-bJBgwP gZgZQL kMFXol"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -567,7 +567,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -575,7 +575,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -583,7 +583,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -591,7 +591,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -601,22 +601,22 @@ exports[`<Glossaire /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -624,7 +624,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -632,7 +632,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -643,17 +643,17 @@ exports[`<Glossaire /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -661,7 +661,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -669,7 +669,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -679,22 +679,22 @@ exports[`<Glossaire /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -702,7 +702,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -710,7 +710,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -721,17 +721,17 @@ exports[`<Glossaire /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -739,7 +739,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -747,7 +747,7 @@ exports[`<Glossaire /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -759,10 +759,10 @@ exports[`<Glossaire /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-hTUWRQ gZgZQL iOQcAv"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-lizKOf jlNHQY"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -775,7 +775,7 @@ exports[`<Glossaire /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-eoVZPG dZZYot"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -815,13 +815,13 @@ exports[`<Glossaire /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-satoz iTaWXu"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dWZqqJ bGxlNu"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-eoVZPG sc-isRoRg dZZYot hYUXaZ"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -863,7 +863,7 @@ exports[`<Glossaire /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-eNSrOW fRbHNW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers-[slug].test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers-[slug].test.tsx.snap
index 4314db9db2..f3285c9c95 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers-[slug].test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers-[slug].test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<ModelesDeCourrier /> should render 1`] = `
 <div>
   <div
-    class="sc-eHsDsR jvYoqI"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-jdkBTo hwFMeW"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fUBkdm cdIumq"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-hBtRBD hhFrKi"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL hTNWeq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gEkIjz eZnYXg"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-hoLEA cAIauw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-bOhtcR fxvZkA"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-camqpD jBVvSj"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-deXhhX dCERfw"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-epALIP byJirg"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-iLsKjm jreAvU"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-dJiZtA hVSvKc"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dQEtJz gghWjv"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-hYmls jvwQAF"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-kbdlSk dVYOry"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-fFlnrN dIbHpx"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bOQTJJ bZXUzd diAojX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-eifrsQ hKKQkM"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-gweoQa kBXmsJ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-bddgXz koXLlw"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-jdUcAg jEULqB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-eIcdZJ ffrCUe"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-fyVfxW ighGDQ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,28 +237,28 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-fmzyuX cpFQIA"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <nav
         aria-label="Fil d'ariane"
-        class="sc-eBwKMn fGhyjx"
+        class="sc-4acc650d-0 iZmHLs"
       >
         <ol
-          class="sc-aXZVg sc-bHnlcS gZgZQL gsjYMe"
+          class="sc-d8f596bd-0 sc-4acc650d-1 jtWYDW fiOSiq"
         >
           <li
-            class="sc-cKXybt ggpccJ"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <a
-              class="sc-lgjHQU jdxOHF"
+              class="sc-4acc650d-3 iwBcqI"
               href="/"
               title="Retour à l'accueil"
             >
               <svg
                 aria-hidden="true"
-                class="sc-fatcLD bMoQWu"
+                class="sc-4acc650d-4 jhEUEf"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -272,11 +272,11 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             </a>
           </li>
           <li
-            class="sc-cKXybt ggpccJ"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <svg
               aria-hidden="true"
-              class="sc-cgjDci iRJOTt"
+              class="sc-4acc650d-5 doDLRb"
               fill="none"
               viewBox="0 0 16 16"
               xmlns="http://www.w3.org/2000/svg"
@@ -288,7 +288,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             </svg>
              
             <a
-              class="sc-lgjHQU jdxOHF"
+              class="sc-4acc650d-3 iwBcqI"
               href="/themes/theme"
             >
               theme
@@ -297,49 +297,49 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
         </ol>
       </nav>
       <div
-        class="sc-aXZVg sc-hGMjit gZgZQL fGTiur"
+        class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
       >
         <div
-          class="sc-ezreuY bUMdVg"
+          class="sc-b551711e-1 fIhGar"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
-              class="sc-iGgWBj biWgIW"
+              class="sc-2a0a4b0a-0 hpYuum"
             >
               <div
-                class="sc-cTTdyq bCxrTo"
+                class="sc-f2a41fcc-1 fNkZjj"
               >
                 <div>
                   <div
-                    class="sc-gplwa-d fDTSWe"
+                    class="sc-f2a41fcc-0 hQZrlv"
                   >
                     <p
-                      class="sc-jaXxmE sc-iowXnY kgvDSh llhtgL"
+                      class="sc-9261d202-0 sc-f2a41fcc-3 iTbcuX jigJXx"
                     >
                       theme
                     </p>
                     <header
-                      class="sc-kzqdkY bFdwok sc-fscmHZ gYVVSf"
+                      class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                     >
                       <h1
-                        class="sc-bVHCgj jaeZrq"
+                        class="sc-5f05e99b-0 cWsbaq"
                       >
                         <span
-                          class="sc-gsFSXq ljkohw"
+                          class="sc-a4d7a179-0 gGBEJx"
                         />
                         Modèle de lettre - Courrier Epistolaire
                       </h1>
                     </header>
                     <div
-                      class="sc-bWJUgm bexFzO"
+                      class="sc-f2a41fcc-5 tnWPU"
                     >
                       <p
-                        class="sc-krNlru bWTKgF"
+                        class="sc-3633cc97-1 ksBhgq"
                       >
                         <span
-                          class="sc-ijDOKB jbGmrs"
+                          class="sc-f2a41fcc-8 ObhLq"
                         >
                           Mis à jour le
                            : 
@@ -349,22 +349,22 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-kpKSZj igizwq"
+                    class="sc-f2a41fcc-6 vLCby"
                   >
                     <div
-                      class="sc-iGgWBj sc-dOoqMo cWzIZL cVRlOD"
+                      class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                     >
                       <p
-                        class="sc-krNlru bpribs"
+                        class="sc-3633cc97-1 bjxtLv"
                       >
                         un description
                       </p>
                     </div>
                     <div
-                      class="sc-kOHTFB enIaVF"
+                      class="sc-9d3cf83b-0 gYcXmc"
                     >
                       <div
-                        class="sc-dtInlm krTdyM"
+                        class="sc-9d3cf83b-1 laYFae"
                       >
                         <svg
                           aria-hidden="true"
@@ -388,21 +388,21 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                       </div>
                     </div>
                     <div
-                      class="sc-gEvEer hpVpdb"
+                      class="sc-a384ed57-0 iEQrzr"
                     >
                       <div
-                        class="sc-iGgWBj sc-BQMaI cRLRjd fMXpcg"
+                        class="sc-2a0a4b0a-0 sc-b0f78d19-1 hPfzrL iOSTPf"
                       >
                         <div
-                          class="sc-dwalKd cBdDvH"
+                          class="sc-b0f78d19-0 irRqpc"
                         >
                           <a
-                            class="sc-kOPcWz eRFCst no-after"
+                            class="sc-95bd4344-0 jFwEAm no-after"
                             href="bucket.url/default/filename.pdf"
                           >
                             <svg
                               aria-hidden="true"
-                              class="sc-bvgPty hccCDk"
+                              class="sc-b0f78d19-3 kWMtYX"
                               fill="none"
                               viewBox="0 0 32 32"
                               xmlns="http://www.w3.org/2000/svg"
@@ -413,7 +413,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                               />
                             </svg>
                             <div
-                              class="sc-cWSHoV bKtA-De"
+                              class="sc-8dcb2faa-0 gxfPDw"
                             >
                               Télécharger le document (
                               pdf
@@ -424,7 +424,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                           </a>
                         </div>
                         <div
-                          class="sc-cspYLC"
+                          class="sc-85c198dc-0"
                         >
                           <p>
                             youhou
@@ -433,7 +433,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                       </div>
                     </div>
                     <p
-                      class="sc-cyRcrZ hfXZRh"
+                      class="sc-b0f78d19-4 fgvPWe"
                     >
                       Type: Modèle de document - Format: 
                       pdf
@@ -444,15 +444,15 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                        
                     </p>
                     <p
-                      class="sc-iGgWBj sc-epqpcT cWzIZL gVjnsI"
+                      class="sc-2a0a4b0a-0 sc-b0f78d19-2 dLOZmV Xqdkd"
                     >
                       Attention, chaque modèle de lettre proposé est à personnaliser selon votre situation et est susceptible d’évoluer suite à des changements de réglementation. Assurez-vous d’avoir la dernière version mise à jour avant toute utilisation.
                     </p>
                     <p
-                      class="sc-kUdmhA rYGko"
+                      class="sc-b0f78d19-5 fRuiFb"
                     >
                       <a
-                        class="sc-kOPcWz cefBoA no-after"
+                        class="sc-95bd4344-0 jqYNvz no-after"
                         href="bucket.url/default/filename.pdf"
                       >
                         Télécharger le modèle (
@@ -462,7 +462,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                         Ko)  
                         <svg
                           aria-hidden="true"
-                          class="sc-bvgPty hccCDk"
+                          class="sc-b0f78d19-3 kWMtYX"
                           fill="none"
                           viewBox="0 0 32 32"
                           xmlns="http://www.w3.org/2000/svg"
@@ -477,22 +477,22 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-lmUcrn eGiwTS"
+                  class="sc-f2a41fcc-2 bdFsMG"
                 >
                   <div
-                    class="sc-jwZKMi gQTppO"
+                    class="sc-ef7c173-0 dYghnF"
                   >
                     <button
-                      class="sc-gJCZQp jubAPo no-after spacing-left"
+                      class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                       title="Partager sur Facebook"
                       type="button"
                     >
                       <span
-                        class="sc-rPWID jhoYlq"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-izQBue kXBxhz"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -510,16 +510,16 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                       </span>
                     </button>
                     <a
-                      class="sc-dChVcU dlFQlV spacing-left"
+                      class="sc-ef7c173-2 fyqTbA spacing-left"
                       href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Mod%C3%A8le%20de%20lettre%20-%20Courrier%20Epistolaire&body=un%20description%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                       title="Envoyer par email"
                     >
                       <span
-                        class="sc-rPWID jhoYlq"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-izQBue kXBxhz"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -541,16 +541,16 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                       </span>
                     </a>
                     <button
-                      class="sc-gJCZQp jubAPo spacing-left"
+                      class="sc-ef7c173-1 eNIxDW spacing-left"
                       title="Partager sur LinkedIn"
                       type="button"
                     >
                       <span
-                        class="sc-rPWID jhoYlq"
+                        class="sc-ef7c173-3 dTKkFC"
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-izQBue kXBxhz"
+                          class="sc-ef7c173-4 iQRswg"
                           fill="none"
                           viewBox="0 0 16 16"
                           xmlns="http://www.w3.org/2000/svg"
@@ -568,19 +568,19 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                       </span>
                     </button>
                     <div
-                      class="sc-hCPjZK dlWASs"
+                      class="sc-95cc8fb1-0 iHYHyU"
                     >
                       <button
-                        class="sc-gJCZQp jubAPo spacing-left"
+                        class="sc-ef7c173-1 eNIxDW spacing-left"
                         title="Plus d’options"
                         type="button"
                       >
                         <span
-                          class="sc-rPWID jhoYlq"
+                          class="sc-ef7c173-3 dTKkFC"
                         >
                           <svg
                             aria-hidden="true"
-                            class="sc-izQBue kXBxhz"
+                            class="sc-ef7c173-4 iQRswg"
                             fill="none"
                             viewBox="0 0 16 16"
                             xmlns="http://www.w3.org/2000/svg"
@@ -614,28 +614,28 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             </div>
           </div>
           <div
-            class="sc-aXZVg sc-DWsrX gZgZQL RKWvw"
+            class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
           >
             <p
-              class="sc-krNlru bpribs"
+              class="sc-3633cc97-1 bjxtLv"
             >
               Partager ce contenu : 
             </p>
             <div
-              class="sc-jwZKMi gQTppO"
+              class="sc-ef7c173-0 dYghnF"
             >
               <button
-                class="sc-gJCZQp jubAPo no-after spacing-left"
+                class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                 tabindex="-1"
                 title="Partager sur Facebook"
                 type="button"
               >
                 <span
-                  class="sc-rPWID jhoYlq"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-izQBue kXBxhz"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -653,17 +653,17 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                 </span>
               </button>
               <a
-                class="sc-dChVcU dlFQlV spacing-left"
+                class="sc-ef7c173-2 fyqTbA spacing-left"
                 href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Mod%C3%A8le%20de%20lettre%20-%20Courrier%20Epistolaire&body=un%20description%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                 tabindex="-1"
                 title="Envoyer par email"
               >
                 <span
-                  class="sc-rPWID jhoYlq"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-izQBue kXBxhz"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -685,17 +685,17 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                 </span>
               </a>
               <button
-                class="sc-gJCZQp jubAPo spacing-left"
+                class="sc-ef7c173-1 eNIxDW spacing-left"
                 tabindex="-1"
                 title="Partager sur LinkedIn"
                 type="button"
               >
                 <span
-                  class="sc-rPWID jhoYlq"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-izQBue kXBxhz"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
@@ -713,20 +713,20 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                 </span>
               </button>
               <div
-                class="sc-hCPjZK dlWASs"
+                class="sc-95cc8fb1-0 iHYHyU"
               >
                 <button
-                  class="sc-gJCZQp jubAPo spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   tabindex="-1"
                   title="Plus d’options"
                   type="button"
                 >
                   <span
-                    class="sc-rPWID jhoYlq"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-izQBue kXBxhz"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -757,35 +757,35 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             </div>
           </div>
           <div
-            class="sc-gEvEer hpVpdb sc-djTQaJ jpjDRG"
+            class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
           >
             <div
-              class="sc-aXZVg gZgZQL"
+              class="sc-d8f596bd-0 jtWYDW"
             >
               <div
-                class="sc-iGgWBj cRLRjd"
+                class="sc-2a0a4b0a-0 hPfzrL"
               >
                 <div
-                  class="sc-ggqIjW cekCEi"
+                  class="sc-66a51d8b-3 iitVHg"
                 >
                   <h2
-                    class="sc-djVXDX ilVRnq sc-kAyceB kDiAsV"
+                    class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
                   >
                     <span
-                      class="sc-gsFSXq cdZUuw"
+                      class="sc-a4d7a179-0 jSVvrt"
                     />
                     Avez-vous trouvé la réponse à votre question ?
                   </h2>
                   <p
-                    class="sc-epRvzc iPrZkH"
+                    class="sc-66a51d8b-5 eRJUhM"
                   >
                     <button
-                      class="sc-kOPcWz cpQXMn sc-btwKTd lWOAN"
+                      class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                     >
                       Non
                     </button>
                     <button
-                      class="sc-kOPcWz cpQXMn sc-btwKTd lWOAN"
+                      class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                     >
                       Oui
                     </button>
@@ -798,45 +798,45 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-jOnpCo hiGzNx"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kFWlue jIqemF"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bkEOxz jYDFgL"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dhFUGM dPpwpV iEDLPP"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fbKhjd fEcfGH"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -850,28 +850,28 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-leSDtu ddTDCo"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-bJBgwP gZgZQL kMFXol"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -879,7 +879,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -887,7 +887,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -895,7 +895,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -903,7 +903,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -913,22 +913,22 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -936,7 +936,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -944,7 +944,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -955,17 +955,17 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -973,7 +973,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -981,7 +981,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -991,22 +991,22 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -1014,7 +1014,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -1022,7 +1022,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -1033,17 +1033,17 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -1051,7 +1051,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -1059,7 +1059,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -1071,10 +1071,10 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-hTUWRQ gZgZQL iOQcAv"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-lizKOf jlNHQY"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -1087,7 +1087,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-eoVZPG dZZYot"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -1127,13 +1127,13 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-satoz iTaWXu"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dWZqqJ bGxlNu"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-eoVZPG sc-isRoRg dZZYot hYUXaZ"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -1175,7 +1175,7 @@ exports[`<ModelesDeCourrier /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-eNSrOW fRbHNW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers.test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers.test.tsx.snap
index 8e60581923..291612446b 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers.test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/modeles-de-courriers.test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<ModelesDeCourriers /> should render 1`] = `
 <div>
   <div
-    class="sc-eHsDsR jvYoqI"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-jdkBTo hwFMeW"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-fUBkdm cdIumq"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-hBtRBD hhFrKi"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL hTNWeq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gEkIjz eZnYXg"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-hoLEA cAIauw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-bOhtcR fxvZkA"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-camqpD jBVvSj"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-deXhhX dCERfw"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-epALIP byJirg"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-iLsKjm jreAvU"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-dJiZtA hVSvKc"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dQEtJz gghWjv"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-hYmls jvwQAF"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-kbdlSk dVYOry"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-fFlnrN dIbHpx"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-bOQTJJ bZXUzd diAojX"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-eifrsQ hKKQkM"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-gweoQa kBXmsJ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-bddgXz koXLlw"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-jdUcAg jEULqB"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-eIcdZJ ffrCUe"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-fyVfxW ighGDQ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,38 +237,38 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-fmzyuX cpFQIA"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg elbebC"
+          class="sc-d8f596bd-0 hCPxfF"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               Modèles de documents
             </h1>
             <p
-              class="sc-bDpDS HtTuQ"
+              class="sc-ea8c0a81-0 hsqxhF"
             >
               Téléchargez et personnalisez les modèles de documents et de lettres pour vos démarches en lien avec le droit du travail
             </p>
           </header>
           <div
-            class="sc-dlWCHZ ejmZlt sc-BQMaI gOLLxV"
+            class="sc-5a2c6b8f-0 yOEut sc-f36c6fc-2 cQpmLT"
           >
             <select
-              class="sc-kWtpeL ejsegf"
+              class="sc-5a2c6b8f-2 leEqvE"
             >
               <option
                 value="all"
@@ -288,7 +288,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
             </select>
             <div
               aria-hidden="true"
-              class="sc-hHOBiw cYUewx"
+              class="sc-5a2c6b8f-1 dTDGVJ"
             >
               <svg
                 aria-hidden="true"
@@ -318,24 +318,24 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
             </div>
           </div>
           <ul
-            class="sc-cfxfcM sc-cspYLC kMmTaI bVWBlt"
+            class="sc-ab356c14-0 sc-f36c6fc-0 bpNHPl dRUUmx"
           >
             <h2
-              class="sc-epqpcT fOFlqs sc-kAyceB dvmaTz"
+              class="sc-f36c6fc-3 gWQLPi sc-b879fc2d-0 hyiHle"
             >
               Embauche et contrat de travail
             </h2>
             <li
-              class="sc-dwalKd eapXbf"
+              class="sc-f36c6fc-1 kJkExl"
             >
               <div
-                class="sc-ibQAlb fuLYQY"
+                class="sc-d47d8018-0 cDsGtD"
               >
                 <div
-                  class="sc-kOHTFB enIaVF"
+                  class="sc-9d3cf83b-0 gYcXmc"
                 >
                   <div
-                    class="sc-dtInlm krTdyM"
+                    class="sc-9d3cf83b-1 laYFae"
                   >
                     <svg
                       aria-hidden="true"
@@ -359,13 +359,13 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-guJBdh jBpgpS"
+                  class="sc-d47d8018-2 eBZhiP"
                 >
                   <div
-                    class="sc-hZDyAQ tqlOz"
+                    class="sc-d47d8018-3 cAXyng"
                   >
                     <h3
-                      class="sc-ktJbId fhphst"
+                      class="sc-d47d8018-5 jNRMjT"
                     >
                       <a
                         href="modeles-de-courriers/rupture-de-periode-dessai-a-linitiative-de-lemployeur"
@@ -376,28 +376,28 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-gmgFlS ikhbYa"
+                  class="sc-d47d8018-6 ipSAXR"
                 >
                   Pendant la période d’essai, le contrat de travail peut être rompu librement par l'employeur. L'employeur doit dans ce cas informer le salarié et respecter un délai…
                 </div>
               </div>
             </li>
             <h2
-              class="sc-epqpcT fOFlqs sc-kAyceB dvmaTz"
+              class="sc-f36c6fc-3 gWQLPi sc-b879fc2d-0 hyiHle"
             >
               Départ de l'entreprise
             </h2>
             <li
-              class="sc-dwalKd eapXbf"
+              class="sc-f36c6fc-1 kJkExl"
             >
               <div
-                class="sc-ibQAlb fuLYQY"
+                class="sc-d47d8018-0 cDsGtD"
               >
                 <div
-                  class="sc-kOHTFB enIaVF"
+                  class="sc-9d3cf83b-0 gYcXmc"
                 >
                   <div
-                    class="sc-dtInlm krTdyM"
+                    class="sc-9d3cf83b-1 laYFae"
                   >
                     <svg
                       aria-hidden="true"
@@ -421,13 +421,13 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-guJBdh jBpgpS"
+                  class="sc-d47d8018-2 eBZhiP"
                 >
                   <div
-                    class="sc-hZDyAQ tqlOz"
+                    class="sc-d47d8018-3 cAXyng"
                   >
                     <h3
-                      class="sc-ktJbId fhphst"
+                      class="sc-d47d8018-5 jNRMjT"
                     >
                       <a
                         href="modeles-de-courriers/demande-de-rendez-vous-en-vue-dune-rupture-conventionnelle"
@@ -438,7 +438,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </div>
                 </div>
                 <div
-                  class="sc-gmgFlS ikhbYa"
+                  class="sc-d47d8018-6 ipSAXR"
                 >
                   La rupture conventionnelle individuelle est une modalité de rupture spécifique du CDI. Elle nécessite le consentement de l’employeur et du salarié, et son homologation…
                 </div>
@@ -449,45 +449,45 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-jOnpCo hiGzNx"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kFWlue jIqemF"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-bkEOxz jYDFgL"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-dhFUGM dPpwpV iEDLPP"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-fbKhjd fEcfGH"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -501,28 +501,28 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-leSDtu ddTDCo"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-bJBgwP gZgZQL kMFXol"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -530,7 +530,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -538,7 +538,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -546,7 +546,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -554,7 +554,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -564,22 +564,22 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -587,7 +587,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -595,7 +595,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -606,17 +606,17 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -624,7 +624,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -632,7 +632,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -642,22 +642,22 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-fsvrbR bDgNXU"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -665,7 +665,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -673,7 +673,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -684,17 +684,17 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-fAGzit enIDcU sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-dGCmGc kMmTaI cMvdbh"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -702,7 +702,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -710,7 +710,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bkSUFG ccAGAe"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -722,10 +722,10 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-hTUWRQ gZgZQL iOQcAv"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-lizKOf jlNHQY"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -738,7 +738,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-eoVZPG dZZYot"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -778,13 +778,13 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-satoz iTaWXu"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dWZqqJ bGxlNu"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-eoVZPG sc-isRoRg dZZYot hYUXaZ"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -826,7 +826,7 @@ exports[`<ModelesDeCourriers /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-eNSrOW fRbHNW"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/recherche.test.js.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/recherche.test.js.snap
index 5735a36770..b06ddc08ff 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/recherche.test.js.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/recherche.test.js.snap
@@ -3,38 +3,38 @@
 exports[`<Recherche /> should render 1`] = `
 <div>
   <div
-    class="sc-gRtvSG cRWsAs"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-dUYLmH NNzyT"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-eIcdZJ jBuosG"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-jdUcAg gPiBgu"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-eHsDsR gZgZQL bflkSb"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-jdkBTo cXJWrc"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-fmzyuX BKjem"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-cspYLC dUmsPW"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,21 +58,21 @@ exports[`<Recherche /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-dwalKd hBkSSm"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-fyVfxW bZXUzd fRQnWD"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-bOhtcR grtzTG"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -88,16 +88,16 @@ exports[`<Recherche /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-bvgPty cfWPVZ"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-hgRRfv jfmgFU"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-kUdmhA cFscqR"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-cyRcrZ hxZFFi"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -136,7 +136,7 @@ exports[`<Recherche /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-emIrwa diniUZ"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -157,35 +157,35 @@ exports[`<Recherche /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-faUjhM kUUsYs"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <div
-        class="sc-aXZVg elbebC"
+        class="sc-d8f596bd-0 hCPxfF"
       >
         <header
-          class="sc-kzqdkY hWUlpB"
+          class="sc-e32628d4-0 cXUuvO"
         >
           <h1
-            class="sc-bVHCgj igcPZY"
+            class="sc-5f05e99b-0 dQbgIy"
           >
             <span
-              class="sc-gsFSXq djREvw"
+              class="sc-a4d7a179-0 jRxkkJ"
             />
             Recherche
           </h1>
         </header>
         <div
-          class="sc-cezyBN bISekJ"
+          class="sc-25b8f0fc-0 dYOrvD"
         >
           <form
             action="/recherche"
-            class="sc-cMa-dbN bygzub"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="search-input"
@@ -201,7 +201,7 @@ exports[`<Recherche /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-eXsaLi cRNLOq"
+              class="sc-90ac636b-5 fsmcqO"
               id="search-input"
               placeholder="congés payés, durée de préavis"
               role="combobox"
@@ -210,19 +210,19 @@ exports[`<Recherche /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-gEkIjz eHkyJK"
+              class="sc-90ac636b-6 cmHOfx"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz cefBoA sc-hYmls bDWAkA"
+              class="sc-95bd4344-0 jqYNvz sc-90ac636b-3 jUYkJP"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-fUBkdm hLHJqE"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -237,37 +237,37 @@ exports[`<Recherche /> should render 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       />
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj sc-fUkmAC cRLRjd cdnzuZ"
+            class="sc-2a0a4b0a-0 sc-25b8f0fc-1 hPfzrL eIPfXy"
           >
             <strong
               aria-level="2"
-              class="sc-kAyceB kDiAsV"
+              class="sc-b879fc2d-0 ddMxZe"
               role="heading"
             >
               <span
-                class="sc-gsFSXq cdZUuw"
+                class="sc-a4d7a179-0 jSVvrt"
               />
               Vous n’avez pas trouvé ce que vous cherchiez ? Essayez …
             </strong>
             <div
-              class="sc-cXPBUD hMvpVL"
+              class="sc-25b8f0fc-2 bfzTYW"
             >
               <button
-                class="sc-kOPcWz cpQXMn"
+                class="sc-95bd4344-0 iLunBo"
               >
                 Consulter les thèmes
               </button>
               <button
-                class="sc-kOPcWz cpQXMn"
+                class="sc-95bd4344-0 iLunBo"
               >
                 Chercher une convention collective
               </button>
@@ -277,45 +277,45 @@ exports[`<Recherche /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-imwsjW jlIajf"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-kCMKrZ rSSfR"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-dJiZtA iaLpnq"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-epALIP dPpwpV gnDFKz"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-iLsKjm kkgbaY"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -329,28 +329,28 @@ exports[`<Recherche /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-lbJcrp kRXJBO"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-eifrsQ gZgZQL ivwRXF"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-dQEtJz gCALoF"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-kgOKUu lpmVkr sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-fKWMtX kMmTaI sajjv"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -358,7 +358,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -366,7 +366,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -374,7 +374,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -382,7 +382,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -392,22 +392,22 @@ exports[`<Recherche /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-dQEtJz gCALoF"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-kgOKUu lpmVkr sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-fKWMtX kMmTaI sajjv"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -415,7 +415,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -423,7 +423,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -434,17 +434,17 @@ exports[`<Recherche /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-kgOKUu lpmVkr sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-fKWMtX kMmTaI sajjv"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -452,7 +452,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -460,7 +460,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -470,22 +470,22 @@ exports[`<Recherche /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-dQEtJz gCALoF"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-kgOKUu lpmVkr sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-fKWMtX kMmTaI sajjv"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -493,7 +493,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -501,7 +501,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -512,17 +512,17 @@ exports[`<Recherche /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-kgOKUu lpmVkr sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-fKWMtX kMmTaI sajjv"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -530,7 +530,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -538,7 +538,7 @@ exports[`<Recherche /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-bfhvDw iBKSzx"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -550,10 +550,10 @@ exports[`<Recherche /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-fbKhjd gZgZQL jjkLFn"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-leSDtu fYUEGO"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -566,7 +566,7 @@ exports[`<Recherche /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-bJBgwP fCKSjC"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -606,13 +606,13 @@ exports[`<Recherche /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-bkSUFG cozebb"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-dGCmGc jYRkZE"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-bJBgwP sc-fAGzit fCKSjC uMigE"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -654,7 +654,7 @@ exports[`<Recherche /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-deXhhX jlzYzl"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/themes.test.tsx.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/themes.test.tsx.snap
index d286199c59..6b662ebd42 100644
--- a/packages/code-du-travail-frontend/__tests__/__snapshots__/themes.test.tsx.snap
+++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/themes.test.tsx.snap
@@ -3,38 +3,38 @@
 exports[`<Theme /> should render 1`] = `
 <div>
   <div
-    class="sc-epqpcT jyjsIs"
+    class="sc-bf4d7851-0 cScnsz"
   >
     <div
-      class="sc-bvgPty jETfRg"
+      class="sc-bf4d7851-1 lbLhz"
     />
     <header
-      class="sc-hoLEA bUSWqC"
+      class="sc-1bce5a92-0 daRkfQ"
     >
       <div
-        class="sc-bOhtcR fALbUA"
+        class="sc-1bce5a92-1 JFtdO"
         id="printDate"
       >
         le 04/01/2020, 00:00:00
       </div>
       <div
-        class="sc-aXZVg sc-camqpD gZgZQL gvhtaq"
+        class="sc-d8f596bd-0 sc-1bce5a92-4 jtWYDW jMVRmt"
       >
         <a
-          class="sc-gweoQa dBnSUO"
+          class="sc-1bce5a92-5 dGVXOB"
           href="/"
           title="Code du travail numérique - retour à l'accueil"
         >
           <img
             alt="République française, site officiel du gouvernement. Liberté, égalité, fraternité"
-            class="sc-eIcdZJ cRxKRw"
+            class="sc-1bce5a92-6 kQixfe"
             height="115"
             src="/static/assets/img/logo-rf.svg"
             width="135"
           />
           <svg
             aria-label="Code du travail numérique"
-            class="sc-jdUcAg fjNykK"
+            class="sc-1bce5a92-7 bAgQJS"
             fill="none"
             viewBox="0 0 657 265"
             xmlns="http://www.w3.org/2000/svg"
@@ -58,15 +58,15 @@ exports[`<Theme /> should render 1`] = `
           </svg>
         </a>
         <div
-          class="sc-eHsDsR fNntQa"
+          class="sc-1bce5a92-10 gxLGWf"
         >
           <form
             action="/recherche"
-            class="sc-iLsKjm vqKyr"
+            class="sc-90ac636b-0 etzoiS"
             role="search"
           >
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
             >
               <label
                 for="floating-search"
@@ -82,7 +82,7 @@ exports[`<Theme /> should render 1`] = `
               aria-expanded="false"
               aria-labelledby="downshift-:r0:-label"
               autocomplete="off"
-              class="sc-bfhvDw bngMSI"
+              class="sc-90ac636b-5 jHCKbL"
               id="floating-search"
               placeholder="Rechercher"
               role="combobox"
@@ -91,19 +91,19 @@ exports[`<Theme /> should render 1`] = `
             />
             <ul
               aria-labelledby="downshift-:r0:-label"
-              class="sc-cMa-dbN bGHHno"
+              class="sc-90ac636b-6 cSRDPF"
               id="downshift-:r0:-menu"
               role="listbox"
             />
             <button
               aria-label="Lancer ma recherche"
-              class="sc-kOPcWz kyVwqT sc-kgOKUu gAzQbo"
+              class="sc-95bd4344-0 dxXsic sc-90ac636b-4 WWTkl"
               title="Lancer ma recherche"
               type="submit"
             >
               <svg
                 aria-hidden="true"
-                class="sc-lbJcrp fTRJCy"
+                class="sc-90ac636b-1 eMUwwz"
                 fill="none"
                 viewBox="0 0 32 32"
                 xmlns="http://www.w3.org/2000/svg"
@@ -117,11 +117,11 @@ exports[`<Theme /> should render 1`] = `
           </form>
         </div>
         <div
-          class="sc-fFlnrN bSQpXw"
+          class="sc-1bce5a92-2 hsrbqR"
         >
           <a
             aria-label="Lancer ma recherche"
-            class="sc-fyVfxW hQzGIn"
+            class="sc-1bce5a92-9 jlEcyl"
             href="/recherche"
           >
             <svg
@@ -138,21 +138,21 @@ exports[`<Theme /> should render 1`] = `
           </a>
         </div>
         <div
-          class="sc-bddgXz hVIKfM"
+          class="sc-1bce5a92-8 jegxDE"
         >
           <button
-            class="sc-kOPcWz cOwJar sc-tagGq sc-kbdlSk bZXUzd eFdtnG"
+            class="sc-95bd4344-0 ksRRNY sc-7ce33c9e-0 sc-1bce5a92-3 dfFPma hcjICj"
           >
             Accessibilité
           </button>
         </div>
         <button
           aria-label="menu principal"
-          class="sc-kOPcWz ewnaBc sc-dCFHLb bBPSFM sc-hBtRBD gomQLA"
+          class="sc-95bd4344-0 jfFcPD sc-826d929a-1 gOztMa sc-c4241839-0 kVABEP"
         >
           <svg
             aria-hidden="true"
-            class="sc-fhzFiK dToUrA"
+            class="sc-826d929a-2 iVKgwY"
             fill="none"
             viewBox="0 0 32 32"
             xmlns="http://www.w3.org/2000/svg"
@@ -168,16 +168,16 @@ exports[`<Theme /> should render 1`] = `
       </div>
     </header>
     <div
-      class="sc-jdkBTo ktOmDz"
+      class="sc-944e5bc7-0 cMXoRn"
     >
       <div
-        class="sc-dwalKd kYvLXW"
+        class="sc-944e5bc7-3 eEPoOo"
       >
         <span
-          class="sc-cspYLC knIMa-d"
+          class="sc-944e5bc7-2 bhOxdP"
         >
           <svg
-            class="sc-fmzyuX hnsrpg"
+            class="sc-944e5bc7-1 jrARsm"
             fill="none"
             height="24"
             stroke="currentColor"
@@ -216,7 +216,7 @@ exports[`<Theme /> should render 1`] = `
         </span>
         <button
           aria-label="fermer le bandeau"
-          class="sc-kOPcWz kyVwqT sc-BQMaI jwxnBm"
+          class="sc-95bd4344-0 dxXsic sc-944e5bc7-4 bWaIMq"
           title="fermer la bandeau"
         >
           <svg
@@ -237,28 +237,28 @@ exports[`<Theme /> should render 1`] = `
       </div>
     </div>
     <main
-      class="sc-cyRcrZ cBklja"
+      class="sc-bf4d7851-2 YjLpR"
       id="content"
       tabindex="-1"
     >
       <nav
         aria-label="Fil d'ariane"
-        class="sc-fMMURN fjHxVG"
+        class="sc-4acc650d-0 iZmHLs"
       >
         <ol
-          class="sc-aXZVg sc-ktPPKK gZgZQL gqDoNV"
+          class="sc-d8f596bd-0 sc-4acc650d-1 jtWYDW fiOSiq"
         >
           <li
-            class="sc-YysOf elVbVY"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <a
-              class="sc-cVzyXs lnrukB"
+              class="sc-4acc650d-3 iwBcqI"
               href="/"
               title="Retour à l'accueil"
             >
               <svg
                 aria-hidden="true"
-                class="sc-ePDLzJ jnAQnD"
+                class="sc-4acc650d-4 jhEUEf"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -272,11 +272,11 @@ exports[`<Theme /> should render 1`] = `
             </a>
           </li>
           <li
-            class="sc-YysOf elVbVY"
+            class="sc-4acc650d-2 fEtKOP"
           >
             <svg
               aria-hidden="true"
-              class="sc-bVVIoq jZaWnE"
+              class="sc-4acc650d-5 doDLRb"
               fill="none"
               viewBox="0 0 16 16"
               xmlns="http://www.w3.org/2000/svg"
@@ -288,7 +288,7 @@ exports[`<Theme /> should render 1`] = `
             </svg>
              
             <a
-              class="sc-cVzyXs lnrukB"
+              class="sc-4acc650d-3 iwBcqI"
               href="/themes/1-embauche-et-contrat-de-travail"
             >
               Embauche et contrat de travail
@@ -297,57 +297,57 @@ exports[`<Theme /> should render 1`] = `
         </ol>
       </nav>
       <div
-        class="sc-gEvEer hpVpdb"
+        class="sc-a384ed57-0 iEQrzr"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <header
-            class="sc-kzqdkY hWUlpB"
+            class="sc-e32628d4-0 cXUuvO"
           >
             <h1
-              class="sc-bVHCgj igcPZY"
+              class="sc-5f05e99b-0 dQbgIy"
             >
               <span
-                class="sc-gsFSXq djREvw"
+                class="sc-a4d7a179-0 jRxkkJ"
               />
               Contrat de travail
             </h1>
             <p
-              class="sc-bDpDS HtTuQ"
+              class="sc-ea8c0a81-0 hsqxhF"
             >
               I am a description !
             </p>
           </header>
           <div
-            class="sc-aXZVg sc-kUdmhA gZgZQL TigGh"
+            class="sc-d8f596bd-0 sc-f262cf08-0 jtWYDW jNaGhn"
           >
             <a
-              class="sc-hgRRfv kGOfYs sc-kOPcWz gWtlVM"
+              class="sc-f262cf08-1 bShleE sc-95bd4344-0 dqVtzj"
               href="/themes//themes/121-cdi"
             >
               CDI
             </a>
             <a
-              class="sc-hgRRfv kGOfYs sc-kOPcWz gWtlVM"
+              class="sc-f262cf08-1 bShleE sc-95bd4344-0 dqVtzj"
               href="/themes//themes/122-cdd"
             >
               CDD
             </a>
             <a
-              class="sc-hgRRfv kGOfYs sc-kOPcWz gWtlVM"
+              class="sc-f262cf08-1 bShleE sc-95bd4344-0 dqVtzj"
               href="/themes//themes/123-interim"
             >
               Intérim
             </a>
             <a
-              class="sc-hgRRfv kGOfYs sc-kOPcWz gWtlVM"
+              class="sc-f262cf08-1 bShleE sc-95bd4344-0 dqVtzj"
               href="/themes//themes/124-contrat-dapprentissage"
             >
               Contrat d'apprentissage
             </a>
             <a
-              class="sc-hgRRfv kGOfYs sc-kOPcWz gWtlVM"
+              class="sc-f262cf08-1 bShleE sc-95bd4344-0 dqVtzj"
               href="/themes//themes/125-contrat-de-professionnalisation"
             >
               Contrat de professionnalisation
@@ -357,45 +357,45 @@ exports[`<Theme /> should render 1`] = `
       </div>
     </main>
     <div
-      class="sc-bJBgwP iEdFEM"
+      class="sc-4d9a65c1-1 hWbmEj"
     >
       <footer
-        class="sc-dGCmGc iNytsO"
+        class="sc-4d9a65c1-2 unPdz"
       >
         <div
-          class="sc-gEvEer hpVpdb sc-fAGzit fJswal"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-3 fraWRV"
         >
           <div
-            class="sc-aXZVg gZgZQL"
+            class="sc-d8f596bd-0 jtWYDW"
           >
             <div
               aria-level="2"
-              class="sc-kzqdkY iBScIh"
+              class="sc-e32628d4-0 fQeCjG"
               role="heading"
             >
               <p
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Besoin de plus d’informations ?
               </p>
             </div>
             <div
-              class="sc-aXZVg sc-bkSUFG dPpwpV gvplZQ"
+              class="sc-d8f596bd-0 sc-4d9a65c1-4 jMrYSO eDGGKO"
             >
               <p>
                 Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
               </p>
             </div>
             <button
-              class="sc-kOPcWz gWtlVM"
+              class="sc-95bd4344-0 dqVtzj"
             >
               Contacter nos services en région
               <svg
                 aria-hidden="true"
-                class="sc-deXhhX jaPesr"
+                class="sc-4d9a65c1-5 kPTlut"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -409,28 +409,28 @@ exports[`<Theme /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-gEvEer hpVpdb sc-dQEtJz fKfEHr"
+          class="sc-a384ed57-0 iEQrzr sc-4d9a65c1-6 eNwCQl"
         >
           <div
-            class="sc-aXZVg sc-imwsjW gZgZQL bKukRi"
+            class="sc-d8f596bd-0 sc-4d9a65c1-7 jtWYDW ceMaPg"
           >
             <div
-              class="sc-leSDtu fRuVoe"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-dJiZtA bXHwMX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Code du travail numérique
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-kCMKrZ kMmTaI sbcQC"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/droit-du-travail"
                     >
                       Le droit du travail
@@ -438,7 +438,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/glossaire"
                     >
                       Glossaire
@@ -446,7 +446,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/a-propos"
                     >
                       À propos
@@ -454,7 +454,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/stats"
                     >
                       Statistiques d’utilisation
@@ -462,7 +462,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/integration"
                     >
                       Intégrer les outils du Code du travail numérique
@@ -472,22 +472,22 @@ exports[`<Theme /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-leSDtu fRuVoe"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-dJiZtA bXHwMX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Outils populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-kCMKrZ kMmTaI sbcQC"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/simulateur-embauche"
                     >
                       Calcul du salaire brut/net
@@ -495,7 +495,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/indemnite-rupture-conventionnelle"
                     >
                       Calcul de l'indemnité de rupture conventionnelle
@@ -503,7 +503,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/outils/convention-collective"
                     >
                       Trouver sa convention collective
@@ -514,17 +514,17 @@ exports[`<Theme /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-dJiZtA bXHwMX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Modèles populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-kCMKrZ kMmTaI sbcQC"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/lettre-de-demission"
                     >
                       Lettre de démission
@@ -532,7 +532,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
                     >
                       Rupture du contrat en période d'essai par le salarié
@@ -540,7 +540,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
                     >
                       Convocation à un entretien préalable au licenciement pour motif personnel
@@ -550,22 +550,22 @@ exports[`<Theme /> should render 1`] = `
               </div>
             </div>
             <div
-              class="sc-leSDtu fRuVoe"
+              class="sc-4d9a65c1-0 wpgHP"
             >
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-dJiZtA bXHwMX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Fiches pratiques populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-kCMKrZ kMmTaI sbcQC"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
                     >
                       Durée du préavis de démission
@@ -573,7 +573,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/les-conges-pour-evenements-familiaux"
                     >
                       Congés pour événements familiaux
@@ -581,7 +581,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                     >
                       Maintien du salaire en cas d'arrêt maladie
@@ -592,17 +592,17 @@ exports[`<Theme /> should render 1`] = `
               <div>
                 <strong
                   aria-level="2"
-                  class="sc-dJiZtA bXHwMX sc-kAyceB jIzQpS"
+                  class="sc-4d9a65c1-9 gkFfZG sc-b879fc2d-0 dSFUuf"
                   role="heading"
                 >
                   Conventions collectives populaires
                 </strong>
                 <ul
-                  class="sc-cfxfcM sc-kCMKrZ kMmTaI sbcQC"
+                  class="sc-ab356c14-0 sc-4d9a65c1-8 bpNHPl iNIrtI"
                 >
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
                     >
                       Services de l'automobile
@@ -610,7 +610,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/3248-metallurgie"
                     >
                       Métallurgie
@@ -618,7 +618,7 @@ exports[`<Theme /> should render 1`] = `
                   </li>
                   <li>
                     <a
-                      class="sc-epALIP lfqDsR"
+                      class="sc-4d9a65c1-10 fOjoXJ"
                       href="/convention-collective/573-commerces-de-gros"
                     >
                       Commerce de gros
@@ -630,10 +630,10 @@ exports[`<Theme /> should render 1`] = `
           </div>
         </div>
         <div
-          class="sc-aXZVg sc-eNSrOW gZgZQL fulJKY"
+          class="sc-d8f596bd-0 sc-d2f8e86a-0 jtWYDW gLHwsT"
         >
           <div
-            class="sc-fsvrbR dSPxlQ"
+            class="sc-d2f8e86a-1 ipUnWt"
           >
             <img
               alt="le site du ministere du travail, de l'emploi et de l'insertion"
@@ -646,7 +646,7 @@ exports[`<Theme /> should render 1`] = `
               width="170"
             />
             <ul
-              class="sc-jOnpCo gHqKQf"
+              class="sc-d2f8e86a-2 gHNrXP"
             >
               <li>
                 <a
@@ -686,13 +686,13 @@ exports[`<Theme /> should render 1`] = `
             </ul>
           </div>
           <div
-            class="sc-dhFUGM gNsSXA"
+            class="sc-d2f8e86a-5 btMldF"
           />
           <div
-            class="sc-kFWlue csCIbH"
+            class="sc-d2f8e86a-3 bKRwPr"
           >
             <ul
-              class="sc-jOnpCo sc-bkEOxz gHqKQf hBRwVe"
+              class="sc-d2f8e86a-2 sc-d2f8e86a-4 gHNrXP eyROlo"
             >
               <li>
                 <a
@@ -734,7 +734,7 @@ exports[`<Theme /> should render 1`] = `
               <li>
                 <a
                   aria-label="Nous contacter"
-                  class="sc-fbKhjd edLezJ"
+                  class="sc-d2f8e86a-6 ffdiGN"
                   role="link"
                 >
                   Nous contacter
diff --git a/packages/code-du-travail-frontend/jest.config.js b/packages/code-du-travail-frontend/jest.config.js
index 08d31d8519..6d0b6a5f8a 100644
--- a/packages/code-du-travail-frontend/jest.config.js
+++ b/packages/code-du-travail-frontend/jest.config.js
@@ -1,12 +1,14 @@
 const nextJest = require("next/jest");
 
-const createJestConfig = nextJest();
+const createJestConfig = nextJest({
+  dir: "./",
+});
 
+/** @type {import('jest').Config} */
 const customJestConfig = {
   testEnvironment: "jest-environment-jsdom",
   setupFilesAfterEnv: ["<rootDir>/test/jest.setup.js"],
   testMatch: ["**/__tests__/**/*?(*.)+(test|spec).[jt]s?(x)"],
-  collectCoverageFrom: ["!src/**/*mock.js", "src/**/*.js"],
   testPathIgnorePatterns: [
     "<rootDir>/.next/",
     "<rootDir>/node_modules/",
diff --git a/packages/code-du-travail-frontend/next.config.mjs b/packages/code-du-travail-frontend/next.config.mjs
index ef6c6b681a..c8721a2012 100644
--- a/packages/code-du-travail-frontend/next.config.mjs
+++ b/packages/code-du-travail-frontend/next.config.mjs
@@ -52,6 +52,7 @@ const nextConfig = {
     });
     return config;
   },
+  transpilePackages: ["@codegouvfr/react-dsfr"],
 };
 
 const moduleExports = {
diff --git a/packages/code-du-travail-frontend/package.json b/packages/code-du-travail-frontend/package.json
index 178737bd35..24e4d10685 100644
--- a/packages/code-du-travail-frontend/package.json
+++ b/packages/code-du-travail-frontend/package.json
@@ -7,7 +7,6 @@
   "keywords": [],
   "main": "src/index.js",
   "scripts": {
-    "prepare": "panda codegen",
     "dev": "yarn predev && next dev",
     "predev": "react-dsfr update-icons && panda codegen",
     "lint:js": "next lint --quiet",
@@ -103,6 +102,7 @@
     "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^13.0.0",
     "mockdate": "^3.0.5",
+    "next-router-mock": "^0.9.13",
     "nextjs-http-supertest": "^1.0.6",
     "postcss": "^8.4.44",
     "sass": "^1.77.8",
diff --git a/packages/code-du-travail-frontend/panda.config.ts b/packages/code-du-travail-frontend/panda.config.ts
index 0b21a9c2db..d08211a1f1 100644
--- a/packages/code-du-travail-frontend/panda.config.ts
+++ b/packages/code-du-travail-frontend/panda.config.ts
@@ -8,4 +8,5 @@ export default defineConfig({
     extend: {},
   },
   outdir: "styled-system",
+  outExtension: "js",
 });
diff --git a/packages/code-du-travail-frontend/src/common/Feedback/__tests__/__snapshots__/Feedback.test.js.snap b/packages/code-du-travail-frontend/src/common/Feedback/__tests__/__snapshots__/Feedback.test.js.snap
index 6624a4bf73..5df19a2494 100644
--- a/packages/code-du-travail-frontend/src/common/Feedback/__tests__/__snapshots__/Feedback.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/Feedback/__tests__/__snapshots__/Feedback.test.js.snap
@@ -3,35 +3,35 @@
 exports[`<Feedback/> should render 1`] = `
 <div>
   <div
-    class="sc-gEvEer hpVpdb sc-iXzfSG iKsDZP"
+    class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
   >
     <div
-      class="sc-aXZVg gZgZQL"
+      class="sc-d8f596bd-0 jtWYDW"
     >
       <div
-        class="sc-iGgWBj cRLRjd"
+        class="sc-2a0a4b0a-0 hPfzrL"
       >
         <div
-          class="sc-iapWAC htQmqi"
+          class="sc-66a51d8b-3 iitVHg"
         >
           <h2
-            class="sc-kqGoIF hBlUrr sc-kAyceB kDiAsV"
+            class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
           >
             <span
-              class="sc-gsFSXq cdZUuw"
+              class="sc-a4d7a179-0 jSVvrt"
             />
             Avez-vous trouvé la réponse à votre question ?
           </h2>
           <p
-            class="sc-dxcDKg dKsgnI"
+            class="sc-66a51d8b-5 eRJUhM"
           >
             <button
-              class="sc-kOPcWz cpQXMn sc-gvZAcH bxRqxi"
+              class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
             >
               Non
             </button>
             <button
-              class="sc-kOPcWz cpQXMn sc-gvZAcH bxRqxi"
+              class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
             >
               Oui
             </button>
@@ -46,41 +46,41 @@ exports[`<Feedback/> should render 1`] = `
 exports[`<Feedback/> should render form once user answer no 1`] = `
 <div>
   <div
-    class="sc-gEvEer hpVpdb sc-iXzfSG iKsDZP"
+    class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
   >
     <div
-      class="sc-aXZVg gZgZQL"
+      class="sc-d8f596bd-0 jtWYDW"
     >
       <div
-        class="sc-iGgWBj cRLRjd"
+        class="sc-2a0a4b0a-0 hPfzrL"
       >
         <div
-          class="sc-iapWAC htQmqi"
+          class="sc-66a51d8b-3 iitVHg"
         >
           <h2
-            class="sc-kqGoIF hBlUrr sc-kAyceB kDiAsV"
+            class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
           >
             <span
-              class="sc-gsFSXq cdZUuw"
+              class="sc-a4d7a179-0 jSVvrt"
             />
             Merci pour votre réponse.
           </h2>
         </div>
         <form>
           <fieldset
-            class="sc-eulNck dcbEAr"
+            class="sc-66a51d8b-1 dklOQM"
           >
             <legend
-              class="sc-dExYaf gYIifE"
+              class="sc-66a51d8b-2 jpcSlV"
             >
               Pouvez-vous nous en dire plus ?
             </legend>
             <label
-              class="sc-eyvILC erxqfW"
+              class="sc-839d90a8-0 gMVMHp"
               for="unclear"
             >
               <input
-                class="sc-gfoqjT UMmfj"
+                class="sc-839d90a8-1 eqiyso"
                 id="unclear"
                 name="category"
                 type="checkbox"
@@ -89,11 +89,11 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
               Les informations ne sont pas claires.
             </label>
             <label
-              class="sc-eyvILC erxqfW"
+              class="sc-839d90a8-0 gMVMHp"
               for="unrelated"
             >
               <input
-                class="sc-gfoqjT UMmfj"
+                class="sc-839d90a8-1 eqiyso"
                 id="unrelated"
                 name="category"
                 type="checkbox"
@@ -102,11 +102,11 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
               Cette page ne correspond pas à ma recherche ou à ma situation.
             </label>
             <label
-              class="sc-eyvILC erxqfW"
+              class="sc-839d90a8-0 gMVMHp"
               for="unsatisfied"
             >
               <input
-                class="sc-gfoqjT UMmfj"
+                class="sc-839d90a8-1 eqiyso"
                 id="unsatisfied"
                 name="category"
                 type="checkbox"
@@ -115,11 +115,11 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
               Je ne suis pas satisfait de cette réglementation.
             </label>
             <label
-              class="sc-eyvILC erxqfW"
+              class="sc-839d90a8-0 gMVMHp"
               for="wrong"
             >
               <input
-                class="sc-gfoqjT UMmfj"
+                class="sc-839d90a8-1 eqiyso"
                 id="wrong"
                 name="category"
                 type="checkbox"
@@ -129,13 +129,13 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
             </label>
           </fieldset>
           <label
-            class="sc-ERObt blrUmt"
+            class="sc-66a51d8b-9 jiFyYA"
             for="suggestion"
           >
             Faire une suggestion pour améliorer cette page
           </label>
           <textarea
-            class="sc-ecPEgm foALIG sc-knuQbY iEIWKo"
+            class="sc-3dad25ce-0 gVEtdz sc-66a51d8b-8 hgLwfg"
             cols="50"
             id="suggestion"
             maxlength="150"
@@ -145,13 +145,13 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
           />
           <div>
             <span
-              class="sc-iMTnTL bCcoWP"
+              class="sc-3633cc97-0 cictDJ"
             >
               150
                caractères restants
             </span>
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
               role="status"
             >
               150
@@ -159,10 +159,10 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
             </div>
           </div>
           <div
-            class="sc-dNsVcS lnwERS"
+            class="sc-66a51d8b-10 iVMFlu"
           >
             <button
-              class="sc-kOPcWz dSQWfG sc-gvZAcH bxRqxi"
+              class="sc-95bd4344-0 ddXsil sc-66a51d8b-6 xfnpJ"
             >
               Envoyer
             </button>
@@ -172,7 +172,7 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
           Pour obtenir une réponse à votre question de droit du travail, nous vous invitons à joindre
            
           <button
-            class="sc-kOPcWz gACNan"
+            class="sc-95bd4344-0 hgVQqQ"
             type="button"
           >
             les services du ministère du Travail en région
@@ -198,35 +198,35 @@ exports[`<Feedback/> should render form once user answer no 1`] = `
 exports[`<Feedback/> should render form once user answer yes 1`] = `
 <div>
   <div
-    class="sc-gEvEer hpVpdb sc-iXzfSG iKsDZP"
+    class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
   >
     <div
-      class="sc-aXZVg gZgZQL"
+      class="sc-d8f596bd-0 jtWYDW"
     >
       <div
-        class="sc-iGgWBj cRLRjd"
+        class="sc-2a0a4b0a-0 hPfzrL"
       >
         <div
-          class="sc-iapWAC htQmqi"
+          class="sc-66a51d8b-3 iitVHg"
         >
           <h2
-            class="sc-kqGoIF hBlUrr sc-kAyceB kDiAsV"
+            class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
           >
             <span
-              class="sc-gsFSXq cdZUuw"
+              class="sc-a4d7a179-0 jSVvrt"
             />
             Merci pour votre réponse.
           </h2>
         </div>
         <form>
           <label
-            class="sc-ERObt blrUmt"
+            class="sc-66a51d8b-9 jiFyYA"
             for="suggestion"
           >
             Faire une suggestion pour améliorer cette page
           </label>
           <textarea
-            class="sc-ecPEgm foALIG sc-knuQbY iEIWKo"
+            class="sc-3dad25ce-0 gVEtdz sc-66a51d8b-8 hgLwfg"
             cols="50"
             id="suggestion"
             maxlength="150"
@@ -236,13 +236,13 @@ exports[`<Feedback/> should render form once user answer yes 1`] = `
           />
           <div>
             <span
-              class="sc-iMTnTL bCcoWP"
+              class="sc-3633cc97-0 cictDJ"
             >
               150
                caractères restants
             </span>
             <div
-              class="sc-cWSHoV bKtA-De"
+              class="sc-8dcb2faa-0 gxfPDw"
               role="status"
             >
               150
@@ -250,10 +250,10 @@ exports[`<Feedback/> should render form once user answer yes 1`] = `
             </div>
           </div>
           <div
-            class="sc-dNsVcS lnwERS"
+            class="sc-66a51d8b-10 iVMFlu"
           >
             <button
-              class="sc-kOPcWz dSQWfG sc-gvZAcH bxRqxi"
+              class="sc-95bd4344-0 ddXsil sc-66a51d8b-6 xfnpJ"
             >
               Envoyer
             </button>
diff --git a/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferenceList.test.js.snap b/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferenceList.test.js.snap
index 374f1a69a4..af379dceee 100644
--- a/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferenceList.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferenceList.test.js.snap
@@ -3,16 +3,16 @@
 exports[`<ReferenceList /> should render 1`] = `
 <div>
   <ul
-    class="sc-cfxfcM sc-ktPPKK kMmTaI oLIMV"
+    class="sc-ab356c14-0 sc-ab4aba5d-1 bpNHPl dDdmoO"
   >
     <li>
       <a
-        class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe"
+        class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu"
         href="/code-du-travail/l2323-4"
       >
         <svg
           aria-hidden="true"
-          class="sc-dtBdUo hpIOmX"
+          class="sc-60a7e89-2 bJDpVh"
           fill="none"
           viewBox="0 0 28 15"
           xmlns="http://www.w3.org/2000/svg"
@@ -23,7 +23,7 @@ exports[`<ReferenceList /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-iHGNWf hQSWKy"
+          class="sc-60a7e89-1 eSlLWj"
         >
           Article L2323-4 du Code du travail
         </span>
@@ -32,13 +32,13 @@ exports[`<ReferenceList /> should render 1`] = `
     <li>
       <a
         aria-label="Article yyy du JO (Nouvelle fenêtre)"
-        class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+        class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
         href="https://article.jo/yyy"
         target="_blank"
       >
         <svg
           aria-hidden="true"
-          class="sc-dtBdUo hpIOmX"
+          class="sc-60a7e89-2 bJDpVh"
           fill="none"
           viewBox="0 0 28 15"
           xmlns="http://www.w3.org/2000/svg"
@@ -49,7 +49,7 @@ exports[`<ReferenceList /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-iHGNWf hQSWKy"
+          class="sc-60a7e89-1 eSlLWj"
         >
           Article yyy du JO
         </span>
@@ -58,13 +58,13 @@ exports[`<ReferenceList /> should render 1`] = `
     <li>
       <a
         aria-label="CCN metallurgie (Nouvelle fenêtre)"
-        class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+        class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
         href="https://legifrance/ccn-metallurgie"
         target="_blank"
       >
         <svg
           aria-hidden="true"
-          class="sc-dtBdUo hpIOmX"
+          class="sc-60a7e89-2 bJDpVh"
           fill="none"
           viewBox="0 0 28 15"
           xmlns="http://www.w3.org/2000/svg"
@@ -75,7 +75,7 @@ exports[`<ReferenceList /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-iHGNWf hQSWKy"
+          class="sc-60a7e89-1 eSlLWj"
         >
           CCN metallurgie
         </span>
@@ -83,12 +83,12 @@ exports[`<ReferenceList /> should render 1`] = `
     </li>
     <li>
       <a
-        class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe"
+        class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu"
         href="/convention-collective/123-automobile"
       >
         <svg
           aria-hidden="true"
-          class="sc-dtBdUo hpIOmX"
+          class="sc-60a7e89-2 bJDpVh"
           fill="none"
           viewBox="0 0 28 15"
           xmlns="http://www.w3.org/2000/svg"
@@ -99,7 +99,7 @@ exports[`<ReferenceList /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-iHGNWf hQSWKy"
+          class="sc-60a7e89-1 eSlLWj"
         >
           Convention collective: automobile
         </span>
@@ -107,12 +107,12 @@ exports[`<ReferenceList /> should render 1`] = `
     </li>
     <li>
       <a
-        class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe"
+        class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu"
         href="/code-du-travail/l1234-3"
       >
         <svg
           aria-hidden="true"
-          class="sc-dtBdUo hpIOmX"
+          class="sc-60a7e89-2 bJDpVh"
           fill="none"
           viewBox="0 0 28 15"
           xmlns="http://www.w3.org/2000/svg"
@@ -123,7 +123,7 @@ exports[`<ReferenceList /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-iHGNWf hQSWKy"
+          class="sc-60a7e89-1 eSlLWj"
         >
           Article L1234-3 du Code du travail
         </span>
diff --git a/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferencesJuridiques.test.js.snap b/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferencesJuridiques.test.js.snap
index 6f131e1a00..5763e0a577 100644
--- a/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferencesJuridiques.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/References/__tests__/__snapshots__/ReferencesJuridiques.test.js.snap
@@ -3,17 +3,17 @@
 exports[`<ReferencesJuridiques /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj cRLRjd"
+    class="sc-2a0a4b0a-0 hPfzrL"
   >
     <div>
       <button
         aria-expanded="false"
-        class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+        class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
         type="button"
       >
         <svg
           aria-hidden="true"
-          class="sc-imWYAI gTeNha"
+          class="sc-93c68677-0 fWneNg"
           fill="none"
           height="24"
           stroke="currentColor"
@@ -29,25 +29,25 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
           />
         </svg>
         <span
-          class="sc-fBWQRz lqUBb"
+          class="sc-da0440cf-2 cdlSfE"
         >
           Références juridiques concernées :
         </span>
       </button>
       <div
-        class="sc-fjvvzt gtrYRc"
+        class="sc-da0440cf-0 kQbZar"
       >
         <ul
-          class="sc-cfxfcM sc-ktPPKK kMmTaI oLIMV"
+          class="sc-ab356c14-0 sc-ab4aba5d-1 bpNHPl dDdmoO"
         >
           <li>
             <a
-              class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe"
+              class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu"
               href="/code-du-travail/l1244-3"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -58,7 +58,7 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 Article L1244-3 du Code du travail
               </span>
@@ -66,12 +66,12 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
           </li>
           <li>
             <a
-              class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe"
+              class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu"
               href="/code-du-travail/r1244-4"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -82,7 +82,7 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 Article R1244-4 du Code du travail
               </span>
@@ -91,13 +91,13 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
           <li>
             <a
               aria-label="Article L3121-44 du JO (Nouvelle fenêtre)"
-              class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+              class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
               href="https://article.jo/L3121-44"
               target="_blank"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -108,7 +108,7 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 Article L3121-44 du JO
               </span>
@@ -117,13 +117,13 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
           <li>
             <a
               aria-label="Article foo du JPO (Nouvelle fenêtre)"
-              class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+              class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
               href="https://article.jo/foo"
               target="_blank"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -134,7 +134,7 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 Article foo du JPO
               </span>
@@ -143,13 +143,13 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
           <li>
             <a
               aria-label="Convention foo (Nouvelle fenêtre)"
-              class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+              class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
               href="https://ma-convention-collective/ccc-foo"
               target="_blank"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -160,7 +160,7 @@ exports[`<ReferencesJuridiques /> should render 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 Convention foo
               </span>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/AccessibilityModal.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/AccessibilityModal.test.js.snap
index 2c2b041706..f43ff283cb 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/AccessibilityModal.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/AccessibilityModal.test.js.snap
@@ -6,7 +6,7 @@ exports[`<AccessibilityModal /> renders a popup when click on button 1`] = `
     aria-hidden="true"
   >
     <button
-      class="sc-kOPcWz gWtlVM"
+      class="sc-95bd4344-0 dqVtzj"
     >
       texte dans le bouton
     </button>
@@ -22,40 +22,40 @@ exports[`<AccessibilityModal /> renders a popup when click on button 1`] = `
     >
       <div>
         <div
-          class="sc-bypJrT nMTGe"
+          class="sc-19478701-0 jZYVgz"
           data-reach-dialog-overlay=""
         >
           <div
             aria-label="Accessibilité"
             aria-modal="true"
-            class="sc-ddjGPC byKttK"
+            class="sc-19478701-1 hQHZiT"
             data-reach-dialog-content=""
             role="dialog"
             tabindex="-1"
           >
             <div
-              class="sc-kzqdkY hhyYQI"
+              class="sc-e32628d4-0 byJqQj"
             >
               <h1
-                class="sc-dSIIpw cxAOED"
+                class="sc-d6e72754-0 gvSeXc"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Accessibilité
               </h1>
             </div>
             <h2
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Couleurs
             </h2>
             <label
-              class="sc-eyvILC erxqfW"
+              class="sc-839d90a8-0 gMVMHp"
               for="blackAndWhiteTheme"
             >
               <input
-                class="sc-gfoqjT UMmfj"
+                class="sc-839d90a8-1 eqiyso"
                 id="blackAndWhiteTheme"
                 name="blackAndWhiteTheme"
                 type="checkbox"
@@ -63,11 +63,11 @@ exports[`<AccessibilityModal /> renders a popup when click on button 1`] = `
               Passer le site en noir et blanc
             </label>
             <button
-              class="sc-kOPcWz kyVwqT sc-dSCufp iCRrvW"
+              class="sc-95bd4344-0 dxXsic sc-19478701-2 fGtwND"
               title="fermer la modale"
             >
               <div
-                class="sc-cWSHoV bKtA-De"
+                class="sc-8dcb2faa-0 gxfPDw"
               >
                 fermer la modale
               </div>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Answer.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Answer.test.js.snap
index 6153a815a3..f8d4b81336 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Answer.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Answer.test.js.snap
@@ -3,56 +3,56 @@
 exports[`<Answer /> should renders 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -62,19 +62,19 @@ exports[`<Answer /> should renders 1`] = `
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -91,22 +91,22 @@ exports[`<Answer /> should renders 1`] = `
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -124,16 +124,16 @@ exports[`<Answer /> should renders 1`] = `
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -155,16 +155,16 @@ exports[`<Answer /> should renders 1`] = `
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -182,19 +182,19 @@ exports[`<Answer /> should renders 1`] = `
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -228,28 +228,28 @@ exports[`<Answer /> should renders 1`] = `
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -267,17 +267,17 @@ exports[`<Answer /> should renders 1`] = `
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -299,17 +299,17 @@ exports[`<Answer /> should renders 1`] = `
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -327,20 +327,20 @@ exports[`<Answer /> should renders 1`] = `
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -371,35 +371,35 @@ exports[`<Answer /> should renders 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -417,22 +417,22 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
 <div>
   <nav
     aria-label="Fil d'ariane"
-    class="sc-fbKhjd eIXviQ"
+    class="sc-4acc650d-0 iZmHLs"
   >
     <ol
-      class="sc-aXZVg sc-leSDtu gZgZQL hobLHx"
+      class="sc-d8f596bd-0 sc-4acc650d-1 jtWYDW fiOSiq"
     >
       <li
-        class="sc-bJBgwP gzNKqE"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <a
-          class="sc-dGCmGc bZDAcV"
+          class="sc-4acc650d-3 iwBcqI"
           href="/"
           title="Retour à l'accueil"
         >
           <svg
             aria-hidden="true"
-            class="sc-fAGzit eersKB"
+            class="sc-4acc650d-4 jhEUEf"
             fill="none"
             viewBox="0 0 16 16"
             xmlns="http://www.w3.org/2000/svg"
@@ -446,11 +446,11 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
         </a>
       </li>
       <li
-        class="sc-bJBgwP gzNKqE"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <svg
           aria-hidden="true"
-          class="sc-bkSUFG gJZEej"
+          class="sc-4acc650d-5 doDLRb"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -462,18 +462,18 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
         </svg>
          
         <a
-          class="sc-dGCmGc bZDAcV"
+          class="sc-4acc650d-3 iwBcqI"
           href="/themes/tag-1"
         >
           tag1
         </a>
       </li>
       <li
-        class="sc-bJBgwP gzNKqE"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <svg
           aria-hidden="true"
-          class="sc-bkSUFG gJZEej"
+          class="sc-4acc650d-5 doDLRb"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -485,7 +485,7 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
         </svg>
          
         <a
-          class="sc-dGCmGc bZDAcV"
+          class="sc-4acc650d-3 iwBcqI"
           href="/themes/tag-2"
         >
           tag2
@@ -494,61 +494,61 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
     </ol>
   </nav>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <p
-                  class="sc-jaXxmE sc-eNSrOW kgvDSh cFkSzn"
+                  class="sc-9261d202-0 sc-f2a41fcc-3 iTbcuX jigJXx"
                 >
                   tag2
                 </p>
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -558,19 +558,19 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -587,22 +587,22 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -620,16 +620,16 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -651,16 +651,16 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -678,19 +678,19 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -724,28 +724,28 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -763,17 +763,17 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -795,17 +795,17 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -823,20 +823,20 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -867,35 +867,35 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -912,56 +912,56 @@ exports[`<Answer /> should renders a breadcrumbs 1`] = `
 exports[`<Answer /> should renders related content 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo ibpsAr"
+      class="sc-b551711e-1 giiHfQ"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -971,19 +971,19 @@ exports[`<Answer /> should renders related content 1`] = `
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -997,22 +997,22 @@ exports[`<Answer /> should renders related content 1`] = `
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1030,16 +1030,16 @@ exports[`<Answer /> should renders related content 1`] = `
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1061,16 +1061,16 @@ exports[`<Answer /> should renders related content 1`] = `
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1088,19 +1088,19 @@ exports[`<Answer /> should renders related content 1`] = `
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -1134,28 +1134,28 @@ exports[`<Answer /> should renders related content 1`] = `
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1173,17 +1173,17 @@ exports[`<Answer /> should renders related content 1`] = `
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1205,17 +1205,17 @@ exports[`<Answer /> should renders related content 1`] = `
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1233,20 +1233,20 @@ exports[`<Answer /> should renders related content 1`] = `
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -1277,35 +1277,35 @@ exports[`<Answer /> should renders related content 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -1316,32 +1316,32 @@ exports[`<Answer /> should renders related content 1`] = `
       </div>
     </div>
     <div
-      class="sc-gEvEer hpVpdb sc-bdOgaJ hbTid"
+      class="sc-a384ed57-0 iEQrzr sc-b551711e-2 rtxPE"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
           aria-level="2"
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
           role="heading"
         >
           Modèles et outils liés
            :
         </div>
         <ul
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
-            class="sc-hBtRBD HUOvT"
+            class="sc-98ab2f81-0 eJqLXV"
           >
             <a
-              class="sc-bmzYkS eyKmWS"
+              class="sc-60a7e89-0 haggkt"
               href="url.extrenal/tool"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1352,22 +1352,22 @@ exports[`<Answer /> should renders related content 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 related external title 1
               </span>
             </a>
           </li>
           <li
-            class="sc-hBtRBD HUOvT"
+            class="sc-98ab2f81-0 eJqLXV"
           >
             <a
-              class="sc-bmzYkS eyKmWS"
+              class="sc-60a7e89-0 haggkt"
               href="/outils/TOOL_1"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1378,7 +1378,7 @@ exports[`<Answer /> should renders related content 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 related tool title 1
               </span>
@@ -1387,25 +1387,25 @@ exports[`<Answer /> should renders related content 1`] = `
         </ul>
         <div
           aria-level="2"
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
           role="heading"
         >
           Articles liés
            :
         </div>
         <ul
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
-            class="sc-hBtRBD HUOvT"
+            class="sc-98ab2f81-0 eJqLXV"
           >
             <a
-              class="sc-bmzYkS eyKmWS"
+              class="sc-60a7e89-0 haggkt"
               href="/fiche-service-public/LINK_1"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1416,22 +1416,22 @@ exports[`<Answer /> should renders related content 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 related sheet sp title 1
               </span>
             </a>
           </li>
           <li
-            class="sc-hBtRBD HUOvT"
+            class="sc-98ab2f81-0 eJqLXV"
           >
             <a
-              class="sc-bmzYkS eyKmWS"
+              class="sc-60a7e89-0 haggkt"
               href="/fiche-ministere-travail/LINK_2"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1442,22 +1442,22 @@ exports[`<Answer /> should renders related content 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 related sheet mt title 1
               </span>
             </a>
           </li>
           <li
-            class="sc-hBtRBD HUOvT"
+            class="sc-98ab2f81-0 eJqLXV"
           >
             <a
-              class="sc-bmzYkS eyKmWS"
+              class="sc-60a7e89-0 haggkt"
               href="/fiche-service-public/LINK_4"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dtBdUo hpIOmX"
+                class="sc-60a7e89-2 bJDpVh"
                 fill="none"
                 viewBox="0 0 28 15"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1468,7 +1468,7 @@ exports[`<Answer /> should renders related content 1`] = `
                 />
               </svg>
               <span
-                class="sc-iHGNWf hQSWKy"
+                class="sc-60a7e89-1 eSlLWj"
               >
                 related sheet sp title 2
               </span>
@@ -1484,56 +1484,56 @@ exports[`<Answer /> should renders related content 1`] = `
 exports[`<Answer /> should renders tooltip 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -1543,19 +1543,19 @@ exports[`<Answer /> should renders tooltip 1`] = `
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -1573,22 +1573,22 @@ exports[`<Answer /> should renders tooltip 1`] = `
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1606,16 +1606,16 @@ exports[`<Answer /> should renders tooltip 1`] = `
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1637,16 +1637,16 @@ exports[`<Answer /> should renders tooltip 1`] = `
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -1664,19 +1664,19 @@ exports[`<Answer /> should renders tooltip 1`] = `
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -1710,28 +1710,28 @@ exports[`<Answer /> should renders tooltip 1`] = `
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1749,17 +1749,17 @@ exports[`<Answer /> should renders tooltip 1`] = `
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1781,17 +1781,17 @@ exports[`<Answer /> should renders tooltip 1`] = `
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -1809,20 +1809,20 @@ exports[`<Answer /> should renders tooltip 1`] = `
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -1853,35 +1853,35 @@ exports[`<Answer /> should renders tooltip 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -1898,56 +1898,56 @@ exports[`<Answer /> should renders tooltip 1`] = `
 exports[`<Answer /> should renders tooltip for words with diacritics without breaking html 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -1957,19 +1957,19 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -1987,22 +1987,22 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2020,16 +2020,16 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2051,16 +2051,16 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2078,19 +2078,19 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -2124,28 +2124,28 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2163,17 +2163,17 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2195,17 +2195,17 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2223,20 +2223,20 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -2267,35 +2267,35 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -2312,56 +2312,56 @@ exports[`<Answer /> should renders tooltip for words with diacritics without bre
 exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -2371,19 +2371,19 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -2402,22 +2402,22 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2435,16 +2435,16 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2466,16 +2466,16 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2493,19 +2493,19 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -2539,28 +2539,28 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2578,17 +2578,17 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2610,17 +2610,17 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2638,20 +2638,20 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -2682,35 +2682,35 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
@@ -2727,56 +2727,56 @@ exports[`<Answer /> should renders tooltip without breaking a tag 1`] = `
 exports[`<Answer /> should renders tooltip without breaking previous word 1`] = `
 <div>
   <div
-    class="sc-aXZVg sc-fulCBj gZgZQL dnfESq"
+    class="sc-d8f596bd-0 sc-b551711e-0 jtWYDW dPgTeI"
   >
     <div
-      class="sc-kMribo kbmJZQ"
+      class="sc-b551711e-1 fIhGar"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-iGgWBj biWgIW"
+          class="sc-2a0a4b0a-0 hpYuum"
         >
           <div
-            class="sc-isRoRg nyeZd"
+            class="sc-f2a41fcc-1 fNkZjj"
           >
             <div>
               <div
-                class="sc-dWZqqJ cXWJpN"
+                class="sc-f2a41fcc-0 hQZrlv"
               >
                 <header
-                  class="sc-kzqdkY bFdwok sc-fsvrbR flmWLP"
+                  class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
                 >
                   <h1
-                    class="sc-bVHCgj jaeZrq"
+                    class="sc-5f05e99b-0 cWsbaq"
                   >
                     <span
-                      class="sc-gsFSXq ljkohw"
+                      class="sc-a4d7a179-0 gGBEJx"
                     />
                     Article du code
                   </h1>
                 </header>
                 <div
-                  class="sc-jOnpCo iSestF"
+                  class="sc-f2a41fcc-5 tnWPU"
                 >
                   <p
-                    class="sc-krNlru bWTKgF"
+                    class="sc-3633cc97-1 ksBhgq"
                   >
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Source: 
                       social groove
                     </span>
                     <span
                       aria-hidden="true"
-                      class="sc-bkEOxz tWCif"
+                      class="sc-f2a41fcc-7 cSmEgq"
                     >
                        - 
                     </span>
                     <span
-                      class="sc-dhFUGM knjPBM"
+                      class="sc-f2a41fcc-8 ObhLq"
                     >
                       Mis à jour le
                        : 
@@ -2786,19 +2786,19 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
                 </div>
               </div>
               <div
-                class="sc-kFWlue RBerz"
+                class="sc-f2a41fcc-6 vLCby"
               >
                 <div
-                  class="sc-iGgWBj sc-bOQTJJ cWzIZL delAmc"
+                  class="sc-2a0a4b0a-0 sc-c6a0a198-1 dLOZmV bMPGyZ"
                 >
                   <p
-                    class="sc-krNlru bpribs"
+                    class="sc-3633cc97-1 bjxtLv"
                   >
                     intro de l'article
                   </p>
                 </div>
                 <div
-                  class="sc-fUBkdm"
+                  class="sc-85c198dc-0"
                 >
                   <p
                     class="test-content"
@@ -2812,22 +2812,22 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
               </div>
             </div>
             <div
-              class="sc-satoz kemhwG"
+              class="sc-f2a41fcc-2 bdFsMG"
             >
               <div
-                class="sc-empnci ePIFiG"
+                class="sc-ef7c173-0 dYghnF"
               >
                 <button
-                  class="sc-fThUAz cMaZgB no-after spacing-left"
+                  class="sc-ef7c173-1 eNIxDW no-after spacing-left"
                   title="Partager sur Facebook"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2845,16 +2845,16 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
                   </span>
                 </button>
                 <a
-                  class="sc-SrznA iUMYoy spacing-left"
+                  class="sc-ef7c173-2 fyqTbA spacing-left"
                   href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
                   title="Envoyer par email"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2876,16 +2876,16 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
                   </span>
                 </a>
                 <button
-                  class="sc-fThUAz cMaZgB spacing-left"
+                  class="sc-ef7c173-1 eNIxDW spacing-left"
                   title="Partager sur LinkedIn"
                   type="button"
                 >
                   <span
-                    class="sc-czkgLR hhhBCF"
+                    class="sc-ef7c173-3 dTKkFC"
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-dycYrt dgTXSK"
+                      class="sc-ef7c173-4 iQRswg"
                       fill="none"
                       viewBox="0 0 16 16"
                       xmlns="http://www.w3.org/2000/svg"
@@ -2903,19 +2903,19 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
                   </span>
                 </button>
                 <div
-                  class="sc-hCPjZK dlWASs"
+                  class="sc-95cc8fb1-0 iHYHyU"
                 >
                   <button
-                    class="sc-fThUAz cMaZgB spacing-left"
+                    class="sc-ef7c173-1 eNIxDW spacing-left"
                     title="Plus d’options"
                     type="button"
                   >
                     <span
-                      class="sc-czkgLR hhhBCF"
+                      class="sc-ef7c173-3 dTKkFC"
                     >
                       <svg
                         aria-hidden="true"
-                        class="sc-dycYrt dgTXSK"
+                        class="sc-ef7c173-4 iQRswg"
                         fill="none"
                         viewBox="0 0 16 16"
                         xmlns="http://www.w3.org/2000/svg"
@@ -2949,28 +2949,28 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
         </div>
       </div>
       <div
-        class="sc-aXZVg sc-eXsaLi gZgZQL dbgspU"
+        class="sc-d8f596bd-0 sc-c6a0a198-2 jtWYDW ceCYyW"
       >
         <p
-          class="sc-krNlru bpribs"
+          class="sc-3633cc97-1 bjxtLv"
         >
           Partager ce contenu : 
         </p>
         <div
-          class="sc-empnci ePIFiG"
+          class="sc-ef7c173-0 dYghnF"
         >
           <button
-            class="sc-fThUAz cMaZgB no-after spacing-left"
+            class="sc-ef7c173-1 eNIxDW no-after spacing-left"
             tabindex="-1"
             title="Partager sur Facebook"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -2988,17 +2988,17 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
             </span>
           </button>
           <a
-            class="sc-SrznA iUMYoy spacing-left"
+            class="sc-ef7c173-2 fyqTbA spacing-left"
             href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Article%20du%20code&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
             tabindex="-1"
             title="Envoyer par email"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -3020,17 +3020,17 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
             </span>
           </a>
           <button
-            class="sc-fThUAz cMaZgB spacing-left"
+            class="sc-ef7c173-1 eNIxDW spacing-left"
             tabindex="-1"
             title="Partager sur LinkedIn"
             type="button"
           >
             <span
-              class="sc-czkgLR hhhBCF"
+              class="sc-ef7c173-3 dTKkFC"
             >
               <svg
                 aria-hidden="true"
-                class="sc-dycYrt dgTXSK"
+                class="sc-ef7c173-4 iQRswg"
                 fill="none"
                 viewBox="0 0 16 16"
                 xmlns="http://www.w3.org/2000/svg"
@@ -3048,20 +3048,20 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
             </span>
           </button>
           <div
-            class="sc-hCPjZK dlWASs"
+            class="sc-95cc8fb1-0 iHYHyU"
           >
             <button
-              class="sc-fThUAz cMaZgB spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               tabindex="-1"
               title="Plus d’options"
               type="button"
             >
               <span
-                class="sc-czkgLR hhhBCF"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dycYrt dgTXSK"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -3092,35 +3092,35 @@ exports[`<Answer /> should renders tooltip without breaking previous word 1`] =
         </div>
       </div>
       <div
-        class="sc-gEvEer hpVpdb sc-deXhhX hShCQL"
+        class="sc-a384ed57-0 iEQrzr sc-3f9d0357-0 fZXZfe"
       >
         <div
-          class="sc-aXZVg gZgZQL"
+          class="sc-d8f596bd-0 jtWYDW"
         >
           <div
-            class="sc-iGgWBj cRLRjd"
+            class="sc-2a0a4b0a-0 hPfzrL"
           >
             <div
-              class="sc-dJiZtA deVhRH"
+              class="sc-66a51d8b-3 iitVHg"
             >
               <h2
-                class="sc-epALIP iewHnL sc-kAyceB kDiAsV"
+                class="sc-66a51d8b-4 ihsodu sc-b879fc2d-0 ddMxZe"
               >
                 <span
-                  class="sc-gsFSXq cdZUuw"
+                  class="sc-a4d7a179-0 jSVvrt"
                 />
                 Avez-vous trouvé la réponse à votre question ?
               </h2>
               <p
-                class="sc-iLsKjm gCpcot"
+                class="sc-66a51d8b-5 eRJUhM"
               >
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Non
                 </button>
                 <button
-                  class="sc-kOPcWz cpQXMn sc-lbJcrp eIQTvC"
+                  class="sc-95bd4344-0 iLunBo sc-66a51d8b-6 xfnpJ"
                 >
                   Oui
                 </button>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Article.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Article.test.js.snap
index 4ce53ef603..790a588c6d 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Article.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Article.test.js.snap
@@ -3,50 +3,50 @@
 exports[`<Article /> should render 1`] = `
 <div>
   <div
-    class="sc-aXZVg gZgZQL"
+    class="sc-d8f596bd-0 jtWYDW"
   >
     <div
-      class="sc-iGgWBj biWgIW"
+      class="sc-2a0a4b0a-0 hpYuum"
     >
       <div
-        class="sc-lnPyaJ iAANUf"
+        class="sc-f2a41fcc-1 fNkZjj"
       >
         <div>
           <div
-            class="sc-iXzfSG imBlIb"
+            class="sc-f2a41fcc-0 hQZrlv"
           >
             <header
-              class="sc-kzqdkY bFdwok sc-iapWAC bhyrIP"
+              class="sc-e32628d4-0 ktMpnf sc-f2a41fcc-4 cqLxSJ"
             >
               <h1
-                class="sc-bVHCgj jaeZrq"
+                class="sc-5f05e99b-0 cWsbaq"
               >
                 <span
-                  class="sc-gsFSXq ljkohw"
+                  class="sc-a4d7a179-0 gGBEJx"
                 />
                 Contrat de travail et formalités d'embauche de l'assistante maternelle
               </h1>
             </header>
             <div
-              class="sc-kqGoIF cwRzwP"
+              class="sc-f2a41fcc-5 tnWPU"
             >
               <p
-                class="sc-krNlru bWTKgF"
+                class="sc-3633cc97-1 ksBhgq"
               >
                 <span
-                  class="sc-kRRyDe bHlAJy"
+                  class="sc-f2a41fcc-8 ObhLq"
                 >
                   Source: 
                   Fiche service public
                 </span>
                 <span
                   aria-hidden="true"
-                  class="sc-gvZAcH xOnzb"
+                  class="sc-f2a41fcc-7 cSmEgq"
                 >
                    - 
                 </span>
                 <span
-                  class="sc-kRRyDe bHlAJy"
+                  class="sc-f2a41fcc-8 ObhLq"
                 >
                   Mis à jour le
                    : 
@@ -56,28 +56,28 @@ exports[`<Article /> should render 1`] = `
             </div>
           </div>
           <div
-            class="sc-dxcDKg bRpVRq"
+            class="sc-f2a41fcc-6 vLCby"
           >
             this is an Article
           </div>
         </div>
         <div
-          class="sc-eulNck bjWozT"
+          class="sc-f2a41fcc-2 bdFsMG"
         >
           <div
-            class="sc-fMMURN kWgFDp"
+            class="sc-ef7c173-0 dYghnF"
           >
             <button
-              class="sc-ktPPKK bEdhoG no-after spacing-left"
+              class="sc-ef7c173-1 eNIxDW no-after spacing-left"
               title="Partager sur Facebook"
               type="button"
             >
               <span
-                class="sc-cVzyXs gEWrIr"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-ePDLzJ bgRJSO"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -95,16 +95,16 @@ exports[`<Article /> should render 1`] = `
               </span>
             </button>
             <a
-              class="sc-YysOf kwqtRY spacing-left"
+              class="sc-ef7c173-2 fyqTbA spacing-left"
               href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20Contrat%20de%20travail%20et%20formalit%C3%A9s%20d'embauche%20de%20l'assistante%20maternelle&body=%0A%0Ahttp%3A%2F%2Flocalhost%2F"
               title="Envoyer par email"
             >
               <span
-                class="sc-cVzyXs gEWrIr"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-ePDLzJ bgRJSO"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -126,16 +126,16 @@ exports[`<Article /> should render 1`] = `
               </span>
             </a>
             <button
-              class="sc-ktPPKK bEdhoG spacing-left"
+              class="sc-ef7c173-1 eNIxDW spacing-left"
               title="Partager sur LinkedIn"
               type="button"
             >
               <span
-                class="sc-cVzyXs gEWrIr"
+                class="sc-ef7c173-3 dTKkFC"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-ePDLzJ bgRJSO"
+                  class="sc-ef7c173-4 iQRswg"
                   fill="none"
                   viewBox="0 0 16 16"
                   xmlns="http://www.w3.org/2000/svg"
@@ -153,19 +153,19 @@ exports[`<Article /> should render 1`] = `
               </span>
             </button>
             <div
-              class="sc-hCPjZK dlWASs"
+              class="sc-95cc8fb1-0 iHYHyU"
             >
               <button
-                class="sc-ktPPKK bEdhoG spacing-left"
+                class="sc-ef7c173-1 eNIxDW spacing-left"
                 title="Plus d’options"
                 type="button"
               >
                 <span
-                  class="sc-cVzyXs gEWrIr"
+                  class="sc-ef7c173-3 dTKkFC"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-ePDLzJ bgRJSO"
+                    class="sc-ef7c173-4 iQRswg"
                     fill="none"
                     viewBox="0 0 16 16"
                     xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Breadcrumbs.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Breadcrumbs.test.js.snap
index bad7125e25..c64853be7b 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Breadcrumbs.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Breadcrumbs.test.js.snap
@@ -4,22 +4,22 @@ exports[`<Breadcrumbs /> should render a breadcrumbs 1`] = `
 <div>
   <nav
     aria-label="Fil d'ariane"
-    class="sc-fMMURN fjHxVG"
+    class="sc-4acc650d-0 iZmHLs"
   >
     <ol
-      class="sc-aXZVg sc-ktPPKK gZgZQL gqDoNV"
+      class="sc-d8f596bd-0 sc-4acc650d-1 jtWYDW fiOSiq"
     >
       <li
-        class="sc-YysOf elVbVY"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <a
-          class="sc-cVzyXs lnrukB"
+          class="sc-4acc650d-3 iwBcqI"
           href="/"
           title="Retour à l'accueil"
         >
           <svg
             aria-hidden="true"
-            class="sc-ePDLzJ jnAQnD"
+            class="sc-4acc650d-4 jhEUEf"
             fill="none"
             viewBox="0 0 16 16"
             xmlns="http://www.w3.org/2000/svg"
@@ -33,11 +33,11 @@ exports[`<Breadcrumbs /> should render a breadcrumbs 1`] = `
         </a>
       </li>
       <li
-        class="sc-YysOf elVbVY"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <svg
           aria-hidden="true"
-          class="sc-bVVIoq jZaWnE"
+          class="sc-4acc650d-5 doDLRb"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -49,18 +49,18 @@ exports[`<Breadcrumbs /> should render a breadcrumbs 1`] = `
         </svg>
          
         <a
-          class="sc-cVzyXs lnrukB"
+          class="sc-4acc650d-3 iwBcqI"
           href="/themes/item-1"
         >
           item 1
         </a>
       </li>
       <li
-        class="sc-YysOf elVbVY"
+        class="sc-4acc650d-2 fEtKOP"
       >
         <svg
           aria-hidden="true"
-          class="sc-bVVIoq jZaWnE"
+          class="sc-4acc650d-5 doDLRb"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -72,7 +72,7 @@ exports[`<Breadcrumbs /> should render a breadcrumbs 1`] = `
         </svg>
          
         <a
-          class="sc-cVzyXs lnrukB"
+          class="sc-4acc650d-3 iwBcqI"
           href="/themes/item-2"
         >
           item 2
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ContactModal.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ContactModal.test.js.snap
index b67353030b..94cdeaa4eb 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ContactModal.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ContactModal.test.js.snap
@@ -6,7 +6,7 @@ exports[`<ContactModal /> renders a popup when click on button 1`] = `
     aria-hidden="true"
   >
     <button
-      class="sc-kOPcWz gWtlVM"
+      class="sc-95bd4344-0 dqVtzj"
     >
       texte dans le bouton
     </button>
@@ -22,37 +22,37 @@ exports[`<ContactModal /> renders a popup when click on button 1`] = `
     >
       <div>
         <div
-          class="sc-bypJrT nMTGe"
+          class="sc-19478701-0 jZYVgz"
           data-reach-dialog-overlay=""
         >
           <div
             aria-label="Contact"
             aria-modal="true"
-            class="sc-ddjGPC byKttK"
+            class="sc-19478701-1 hQHZiT"
             data-reach-dialog-content=""
             role="dialog"
             tabindex="-1"
           >
             <header
-              class="sc-kzqdkY hWUlpB"
+              class="sc-e32628d4-0 cXUuvO"
             >
               <h1
-                class="sc-bVHCgj igcPZY"
+                class="sc-5f05e99b-0 dQbgIy"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Contact
               </h1>
             </header>
             <div
-              class="sc-iGgWBj cWzIZL"
+              class="sc-2a0a4b0a-0 dLOZmV"
             >
               <p>
                 Si vous souhaitez nous interroger sur vos droits ou sur des dispositions en droit du travail, nous vous invitons à contacter
                  
                 <button
-                  class="sc-kOPcWz gACNan"
+                  class="sc-95bd4344-0 hgVQqQ"
                 >
                   les services du ministère du Travail
                   <svg
@@ -94,11 +94,11 @@ exports[`<ContactModal /> renders a popup when click on button 1`] = `
               </a>
             </p>
             <button
-              class="sc-kOPcWz kyVwqT sc-dSCufp iCRrvW"
+              class="sc-95bd4344-0 dxXsic sc-19478701-2 fGtwND"
               title="fermer la modale"
             >
               <div
-                class="sc-cWSHoV bKtA-De"
+                class="sc-8dcb2faa-0 gxfPDw"
               >
                 fermer la modale
               </div>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Html.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Html.test.js.snap
index edb1324120..96d9284ae1 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Html.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Html.test.js.snap
@@ -3,7 +3,7 @@
 exports[`<Html /> should render 1`] = `
 <div>
   <div
-    class="sc-fMMURN"
+    class="sc-85c198dc-0"
   >
     <strong>
       Hello
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap
index 772d90281c..f50681152f 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap
@@ -3,28 +3,28 @@
 exports[`<RelatedItems /> should render 1`] = `
 <div>
   <div
-    class="sc-aXZVg gZgZQL"
+    class="sc-d8f596bd-0 jtWYDW"
   >
     <div
       aria-level="2"
-      class="sc-kAyceB dvmaTz"
+      class="sc-b879fc2d-0 hyiHle"
       role="heading"
     >
       Modèles et outils liés
        :
     </div>
     <ul
-      class="sc-cfxfcM kMmTaI"
+      class="sc-ab356c14-0 bpNHPl"
     >
       <li
-        class="sc-fMMURN fUjtLa"
+        class="sc-98ab2f81-0 eJqLXV"
       >
         <a
-          class="sc-bmzYkS eyKmWS"
+          class="sc-60a7e89-0 haggkt"
         >
           <svg
             aria-hidden="true"
-            class="sc-dtBdUo hpIOmX"
+            class="sc-60a7e89-2 bJDpVh"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -35,21 +35,21 @@ exports[`<RelatedItems /> should render 1`] = `
             />
           </svg>
           <span
-            class="sc-iHGNWf hQSWKy"
+            class="sc-60a7e89-1 eSlLWj"
           >
             externalTool
           </span>
         </a>
       </li>
       <li
-        class="sc-fMMURN fUjtLa"
+        class="sc-98ab2f81-0 eJqLXV"
       >
         <a
-          class="sc-bmzYkS eyKmWS"
+          class="sc-60a7e89-0 haggkt"
         >
           <svg
             aria-hidden="true"
-            class="sc-dtBdUo hpIOmX"
+            class="sc-60a7e89-2 bJDpVh"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -60,7 +60,7 @@ exports[`<RelatedItems /> should render 1`] = `
             />
           </svg>
           <span
-            class="sc-iHGNWf hQSWKy"
+            class="sc-60a7e89-1 eSlLWj"
           >
             modele de courrier
           </span>
@@ -69,24 +69,24 @@ exports[`<RelatedItems /> should render 1`] = `
     </ul>
     <div
       aria-level="2"
-      class="sc-kAyceB dvmaTz"
+      class="sc-b879fc2d-0 hyiHle"
       role="heading"
     >
       Articles liés
        :
     </div>
     <ul
-      class="sc-cfxfcM kMmTaI"
+      class="sc-ab356c14-0 bpNHPl"
     >
       <li
-        class="sc-fMMURN fUjtLa"
+        class="sc-98ab2f81-0 eJqLXV"
       >
         <a
-          class="sc-bmzYkS eyKmWS"
+          class="sc-60a7e89-0 haggkt"
         >
           <svg
             aria-hidden="true"
-            class="sc-dtBdUo hpIOmX"
+            class="sc-60a7e89-2 bJDpVh"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -97,21 +97,21 @@ exports[`<RelatedItems /> should render 1`] = `
             />
           </svg>
           <span
-            class="sc-iHGNWf hQSWKy"
+            class="sc-60a7e89-1 eSlLWj"
           >
             fiche sp
           </span>
         </a>
       </li>
       <li
-        class="sc-fMMURN fUjtLa"
+        class="sc-98ab2f81-0 eJqLXV"
       >
         <a
-          class="sc-bmzYkS eyKmWS"
+          class="sc-60a7e89-0 haggkt"
         >
           <svg
             aria-hidden="true"
-            class="sc-dtBdUo hpIOmX"
+            class="sc-60a7e89-2 bJDpVh"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -122,7 +122,7 @@ exports[`<RelatedItems /> should render 1`] = `
             />
           </svg>
           <span
-            class="sc-iHGNWf hQSWKy"
+            class="sc-60a7e89-1 eSlLWj"
           >
             contrib
           </span>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignement.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignement.test.js.snap
index 89f3882fb6..2ece1318ed 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignement.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignement.test.js.snap
@@ -3,33 +3,33 @@
 exports[`<ServiceRenseignement /> should render suggestions 1`] = `
 <div>
   <header
-    class="sc-kzqdkY hWUlpB"
+    class="sc-e32628d4-0 cXUuvO"
   >
     <h1
-      class="sc-bVHCgj igcPZY"
+      class="sc-5f05e99b-0 dQbgIy"
     >
       <span
-        class="sc-gsFSXq djREvw"
+        class="sc-a4d7a179-0 jRxkkJ"
       />
       Les services du ministère du Travail
     </h1>
   </header>
   <h2
-    class="sc-kAyceB dvmaTz"
+    class="sc-b879fc2d-0 hyiHle"
   >
     Contact téléphonique
   </h2>
   <a
-    class="sc-fMMURN bfUEsp"
+    class="sc-56e7bccd-0 zNGbE"
     href="tel:+0033806000126"
   >
     <strong
-      class="sc-ktPPKK kfEjUo"
+      class="sc-56e7bccd-1 kKLMqi"
     >
       0 806 000 126
     </strong>
     <em
-      class="sc-YysOf jBOJPY"
+      class="sc-56e7bccd-2 foxXKK"
     >
       Service gratuit 
       <span>
@@ -38,12 +38,12 @@ exports[`<ServiceRenseignement /> should render suggestions 1`] = `
     </em>
   </a>
   <h2
-    class="sc-kAyceB dvmaTz"
+    class="sc-b879fc2d-0 hyiHle"
   >
     Contact par email et prise de rendez-vous
   </h2>
   <form
-    class="sc-cVzyXs hgfzis"
+    class="sc-56e7bccd-3 bCQUEe"
   >
     <label
       for="search-service"
@@ -51,11 +51,11 @@ exports[`<ServiceRenseignement /> should render suggestions 1`] = `
       Saisissez votre numéro de département :
     </label>
     <div
-      class="sc-sLsrZ kGdGKi sc-ePDLzJ cGNVRK"
+      class="sc-669fe731-0 amSvQ sc-56e7bccd-4 jcgfHv"
     >
       <input
         autocomplete="off"
-        class="sc-dBmzty djgFPK"
+        class="sc-669fe731-1 bBYNqO"
         id="search-service"
         maxlength="3"
         name="departement"
@@ -66,13 +66,13 @@ exports[`<ServiceRenseignement /> should render suggestions 1`] = `
     </div>
     <button
       aria-label="Recherchez le service"
-      class="sc-kOPcWz kyVwqT sc-bVVIoq iNXDba"
+      class="sc-95bd4344-0 dxXsic sc-56e7bccd-5 ifcrZi"
       title="Lancer une recherche"
       type="submit"
     >
       <svg
         aria-hidden="true"
-        class="sc-dPZUQH rwHjB"
+        class="sc-56e7bccd-6 dEWSgJ"
         fill="none"
         viewBox="0 0 32 32"
         xmlns="http://www.w3.org/2000/svg"
@@ -85,7 +85,7 @@ exports[`<ServiceRenseignement /> should render suggestions 1`] = `
     </button>
   </form>
   <div
-    class="sc-eBHhsj ieQJGs"
+    class="sc-56e7bccd-7 cdORgZ"
   >
     <p>
       Attention, ces services délivrent une information juridique, ils ne sont pas compétents pour :
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignementModal.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignementModal.test.js.snap
index c7643ad32d..6f8e95eab3 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignementModal.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/ServiceRenseignementModal.test.js.snap
@@ -6,7 +6,7 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
     aria-hidden="true"
   >
     <button
-      class="sc-kOPcWz gWtlVM"
+      class="sc-95bd4344-0 dqVtzj"
     >
       texte dans le bouton
     </button>
@@ -22,45 +22,45 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
     >
       <div>
         <div
-          class="sc-bypJrT nMTGe"
+          class="sc-19478701-0 jZYVgz"
           data-reach-dialog-overlay=""
         >
           <div
             aria-label="Service de renseignement"
             aria-modal="true"
-            class="sc-ddjGPC byKttK"
+            class="sc-19478701-1 hQHZiT"
             data-reach-dialog-content=""
             role="dialog"
             tabindex="-1"
           >
             <header
-              class="sc-kzqdkY hWUlpB"
+              class="sc-e32628d4-0 cXUuvO"
             >
               <h1
-                class="sc-bVHCgj igcPZY"
+                class="sc-5f05e99b-0 dQbgIy"
               >
                 <span
-                  class="sc-gsFSXq djREvw"
+                  class="sc-a4d7a179-0 jRxkkJ"
                 />
                 Les services du ministère du Travail
               </h1>
             </header>
             <h2
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Contact téléphonique
             </h2>
             <a
-              class="sc-fMMURN bfUEsp"
+              class="sc-56e7bccd-0 zNGbE"
               href="tel:+0033806000126"
             >
               <strong
-                class="sc-ktPPKK kfEjUo"
+                class="sc-56e7bccd-1 kKLMqi"
               >
                 0 806 000 126
               </strong>
               <em
-                class="sc-YysOf jBOJPY"
+                class="sc-56e7bccd-2 foxXKK"
               >
                 Service gratuit 
                 <span>
@@ -69,12 +69,12 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
               </em>
             </a>
             <h2
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Contact par email et prise de rendez-vous
             </h2>
             <form
-              class="sc-cVzyXs hgfzis"
+              class="sc-56e7bccd-3 bCQUEe"
             >
               <label
                 for="search-service"
@@ -82,11 +82,11 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
                 Saisissez votre numéro de département :
               </label>
               <div
-                class="sc-sLsrZ kGdGKi sc-ePDLzJ cGNVRK"
+                class="sc-669fe731-0 amSvQ sc-56e7bccd-4 jcgfHv"
               >
                 <input
                   autocomplete="off"
-                  class="sc-dBmzty djgFPK"
+                  class="sc-669fe731-1 bBYNqO"
                   id="search-service"
                   maxlength="3"
                   name="departement"
@@ -97,13 +97,13 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
               </div>
               <button
                 aria-label="Recherchez le service"
-                class="sc-kOPcWz kyVwqT sc-bVVIoq iNXDba"
+                class="sc-95bd4344-0 dxXsic sc-56e7bccd-5 ifcrZi"
                 title="Lancer une recherche"
                 type="submit"
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-dPZUQH rwHjB"
+                  class="sc-56e7bccd-6 dEWSgJ"
                   fill="none"
                   viewBox="0 0 32 32"
                   xmlns="http://www.w3.org/2000/svg"
@@ -116,7 +116,7 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
               </button>
             </form>
             <div
-              class="sc-eBHhsj ieQJGs"
+              class="sc-56e7bccd-7 cdORgZ"
             >
               <p>
                 Attention, ces services délivrent une information juridique, ils ne sont pas compétents pour :
@@ -137,11 +137,11 @@ exports[`<ServiceRenseignementModal /> renders a popup when click on button 1`]
               </ul>
             </div>
             <button
-              class="sc-kOPcWz kyVwqT sc-dSCufp iCRrvW"
+              class="sc-95bd4344-0 dxXsic sc-19478701-2 fGtwND"
               title="fermer la modale"
             >
               <div
-                class="sc-cWSHoV bKtA-De"
+                class="sc-8dcb2faa-0 gxfPDw"
               >
                 fermer la modale
               </div>
diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Share.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Share.test.js.snap
index b594779884..2e3c4750f2 100644
--- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Share.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/Share.test.js.snap
@@ -3,19 +3,19 @@
 exports[`<Share /> renders 1`] = `
 <div>
   <div
-    class="sc-fMMURN kWgFDp"
+    class="sc-ef7c173-0 dYghnF"
   >
     <button
-      class="sc-ktPPKK bEdhoG no-after spacing-left"
+      class="sc-ef7c173-1 eNIxDW no-after spacing-left"
       title="Partager sur Facebook"
       type="button"
     >
       <span
-        class="sc-cVzyXs gEWrIr"
+        class="sc-ef7c173-3 dTKkFC"
       >
         <svg
           aria-hidden="true"
-          class="sc-ePDLzJ bgRJSO"
+          class="sc-ef7c173-4 iQRswg"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -33,16 +33,16 @@ exports[`<Share /> renders 1`] = `
       </span>
     </button>
     <a
-      class="sc-YysOf kwqtRY spacing-left"
+      class="sc-ef7c173-2 fyqTbA spacing-left"
       href="mailto:?subject=A%20lire%20sur%20le%20Code%20du%20travail%20num%C3%A9rique%20%3A%20undefined&body=undefined%0A%0Ahttp%3A%2F%2Flocalhost%2F"
       title="Envoyer par email"
     >
       <span
-        class="sc-cVzyXs gEWrIr"
+        class="sc-ef7c173-3 dTKkFC"
       >
         <svg
           aria-hidden="true"
-          class="sc-ePDLzJ bgRJSO"
+          class="sc-ef7c173-4 iQRswg"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -64,16 +64,16 @@ exports[`<Share /> renders 1`] = `
       </span>
     </a>
     <button
-      class="sc-ktPPKK bEdhoG spacing-left"
+      class="sc-ef7c173-1 eNIxDW spacing-left"
       title="Partager sur LinkedIn"
       type="button"
     >
       <span
-        class="sc-cVzyXs gEWrIr"
+        class="sc-ef7c173-3 dTKkFC"
       >
         <svg
           aria-hidden="true"
-          class="sc-ePDLzJ bgRJSO"
+          class="sc-ef7c173-4 iQRswg"
           fill="none"
           viewBox="0 0 16 16"
           xmlns="http://www.w3.org/2000/svg"
@@ -91,19 +91,19 @@ exports[`<Share /> renders 1`] = `
       </span>
     </button>
     <div
-      class="sc-hCPjZK dlWASs"
+      class="sc-95cc8fb1-0 iHYHyU"
     >
       <button
-        class="sc-ktPPKK bEdhoG spacing-left"
+        class="sc-ef7c173-1 eNIxDW spacing-left"
         title="Plus d’options"
         type="button"
       >
         <span
-          class="sc-cVzyXs gEWrIr"
+          class="sc-ef7c173-3 dTKkFC"
         >
           <svg
             aria-hidden="true"
-            class="sc-ePDLzJ bgRJSO"
+            class="sc-ef7c173-4 iQRswg"
             fill="none"
             viewBox="0 0 16 16"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/common/tiles/__tests__/__snapshots__/Custom.test.js.snap b/packages/code-du-travail-frontend/src/common/tiles/__tests__/__snapshots__/Custom.test.js.snap
index 5b5ff9e41d..57d582f2e9 100644
--- a/packages/code-du-travail-frontend/src/common/tiles/__tests__/__snapshots__/Custom.test.js.snap
+++ b/packages/code-du-travail-frontend/src/common/tiles/__tests__/__snapshots__/Custom.test.js.snap
@@ -3,13 +3,13 @@
 exports[`<CallToActionTile /> should render 1`] = `
 <div>
   <div
-    class="sc-ibQAlb jRDQvX sc-ktPPKK bboxQq"
+    class="sc-d47d8018-0 ezEIGw sc-98e66f5e-1 fCudut"
   >
     <div
-      class="sc-guJBdh jBpgpS"
+      class="sc-d47d8018-2 eBZhiP"
     >
       <div
-        class="sc-jGKxIK hbhiZV"
+        class="sc-d47d8018-1 xAHKj"
       >
         <svg
           aria-hidden="true"
@@ -36,10 +36,10 @@ exports[`<CallToActionTile /> should render 1`] = `
         </svg>
       </div>
       <div
-        class="sc-hZDyAQ tqlOz"
+        class="sc-d47d8018-3 cAXyng"
       >
         <p
-          class="sc-ktJbId fhphst"
+          class="sc-d47d8018-5 jNRMjT"
         >
           <a
             href="/test"
@@ -50,19 +50,19 @@ exports[`<CallToActionTile /> should render 1`] = `
       </div>
     </div>
     <div
-      class="sc-gmgFlS ikhbYa"
+      class="sc-d47d8018-6 ipSAXR"
     >
       <div
-        class="sc-fMMURN kUcQRI"
+        class="sc-98e66f5e-0 bQDuAS"
       >
         <p>
           Cette tuile vous fera dire bonjour !
         </p>
         <div
-          class="sc-YysOf aTCxW"
+          class="sc-98e66f5e-2 cDPdrN"
         >
           <p
-            class="sc-krNlru cdYvzt"
+            class="sc-3633cc97-1 gDIqvu"
           >
             Bonjour
              
diff --git a/packages/code-du-travail-frontend/src/contributions/__tests__/DisplayContentContribution.test.tsx b/packages/code-du-travail-frontend/src/contributions/__tests__/DisplayContentContribution.test.tsx
index ebbb000348..33151d7b52 100644
--- a/packages/code-du-travail-frontend/src/contributions/__tests__/DisplayContentContribution.test.tsx
+++ b/packages/code-du-travail-frontend/src/contributions/__tests__/DisplayContentContribution.test.tsx
@@ -15,15 +15,15 @@ describe("DisplayContentContribution", () => {
       expect(baseElement.firstChild).toMatchInlineSnapshot(`
         <div>
           <div
-            class="sc-eulNck hOEymR"
+            class="sc-525da103-0 clIhqj"
           >
             <h2
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Mon titre
             </h2>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Mon sous titre
             </h3>
@@ -42,15 +42,15 @@ describe("DisplayContentContribution", () => {
       expect(baseElement.firstChild).toMatchInlineSnapshot(`
         <div>
           <div
-            class="sc-eulNck hOEymR"
+            class="sc-525da103-0 clIhqj"
           >
             <h4
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Mon title
             </h4>
             <h5
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Mon title
             </h5>
@@ -69,10 +69,10 @@ describe("DisplayContentContribution", () => {
       expect(baseElement.firstChild).toMatchInlineSnapshot(`
         <div>
           <div
-            class="sc-eulNck hOEymR"
+            class="sc-525da103-0 clIhqj"
           >
             <h6
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               Mon title
             </h6>
@@ -325,10 +325,10 @@ describe("DisplayContentContribution", () => {
 
       expect(asFragment().firstChild).toMatchInlineSnapshot(`
         <div
-          class="sc-eulNck hOEymR"
+          class="sc-525da103-0 clIhqj"
         >
           <table
-            class="sc-cmaqmh juENof"
+            class="sc-4e3ba411-0 kKVapO"
           >
             <thead>
               <tr>
@@ -402,7 +402,7 @@ describe("DisplayContentContribution", () => {
 
       expect(asFragment().firstChild).toMatchInlineSnapshot(`
         <div
-          class="sc-eulNck hOEymR"
+          class="sc-525da103-0 clIhqj"
         >
           <table>
             <tbody>
@@ -448,7 +448,7 @@ describe("DisplayContentContribution", () => {
 
       expect(asFragment().firstChild).toMatchInlineSnapshot(`
         <div
-          class="sc-eulNck hOEymR"
+          class="sc-525da103-0 clIhqj"
         >
           <p>
             Ceci est un
@@ -539,7 +539,7 @@ describe("DisplayContentContribution", () => {
 
     expect(asFragment().firstChild).toMatchInlineSnapshot(`
       <div
-        class="sc-eulNck hOEymR"
+        class="sc-525da103-0 clIhqj"
       >
         <p>
           hello
@@ -557,7 +557,7 @@ describe("DisplayContentContribution", () => {
 
     expect(asFragment().firstChild).toMatchInlineSnapshot(`
       <div
-        class="sc-eulNck hOEymR"
+        class="sc-525da103-0 clIhqj"
       >
         <p>
           Ceci est un
@@ -595,7 +595,7 @@ describe("DisplayContentContribution", () => {
 
     expect(asFragment().firstChild).toMatchInlineSnapshot(`
       <div
-        class="sc-eulNck hOEymR"
+        class="sc-525da103-0 clIhqj"
       >
         <p>
           <strong>
diff --git a/packages/code-du-travail-frontend/src/contributions/__tests__/ReferencesJuridique.test.tsx b/packages/code-du-travail-frontend/src/contributions/__tests__/ReferencesJuridique.test.tsx
index 0d5af2f1b9..818e3772ba 100644
--- a/packages/code-du-travail-frontend/src/contributions/__tests__/ReferencesJuridique.test.tsx
+++ b/packages/code-du-travail-frontend/src/contributions/__tests__/ReferencesJuridique.test.tsx
@@ -41,17 +41,17 @@ describe("ReferencesJuridiques", () => {
 
     expect(asFragment().firstChild).toMatchInlineSnapshot(`
       <div
-        class="sc-iGgWBj cRLRjd"
+        class="sc-2a0a4b0a-0 hPfzrL"
       >
         <div>
           <button
             aria-expanded="false"
-            class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+            class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
             type="button"
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -67,27 +67,27 @@ describe("ReferencesJuridiques", () => {
               />
             </svg>
             <span
-              class="sc-fBWQRz lqUBb"
+              class="sc-da0440cf-2 cdlSfE"
             >
               Références
             </span>
           </button>
           <div
-            class="sc-fjvvzt gtrYRc"
+            class="sc-da0440cf-0 kQbZar"
           >
             <ul
-              class="sc-cfxfcM sc-ktPPKK kMmTaI oLIMV"
+              class="sc-ab356c14-0 sc-ab4aba5d-1 bpNHPl dDdmoO"
             >
               <li>
                 <a
                   aria-label="Titre 2 (Nouvelle fenêtre)"
-                  class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+                  class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
                   href="http://lien2"
                   target="_blank"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-dtBdUo hpIOmX"
+                    class="sc-60a7e89-2 bJDpVh"
                     fill="none"
                     viewBox="0 0 28 15"
                     xmlns="http://www.w3.org/2000/svg"
@@ -98,7 +98,7 @@ describe("ReferencesJuridiques", () => {
                     />
                   </svg>
                   <span
-                    class="sc-iHGNWf hQSWKy"
+                    class="sc-60a7e89-1 eSlLWj"
                   >
                     Titre 2
                   </span>
@@ -107,13 +107,13 @@ describe("ReferencesJuridiques", () => {
               <li>
                 <a
                   aria-label="Titre 5 (Nouvelle fenêtre)"
-                  class="sc-bmzYkS eyKmWS sc-fMMURN hDRMbe no-after"
+                  class="sc-60a7e89-0 haggkt sc-ab4aba5d-0 gOxGeu no-after"
                   href="http://lien4"
                   target="_blank"
                 >
                   <svg
                     aria-hidden="true"
-                    class="sc-dtBdUo hpIOmX"
+                    class="sc-60a7e89-2 bJDpVh"
                     fill="none"
                     viewBox="0 0 28 15"
                     xmlns="http://www.w3.org/2000/svg"
@@ -124,7 +124,7 @@ describe("ReferencesJuridiques", () => {
                     />
                   </svg>
                   <span
-                    class="sc-iHGNWf hQSWKy"
+                    class="sc-60a7e89-1 eSlLWj"
                   >
                     Titre 5
                   </span>
diff --git a/packages/code-du-travail-frontend/src/contributions/__tests__/__snapshots__/DisplayContentContribution.test.tsx.snap b/packages/code-du-travail-frontend/src/contributions/__tests__/__snapshots__/DisplayContentContribution.test.tsx.snap
index 7564b8e4f6..21c86d1fd7 100644
--- a/packages/code-du-travail-frontend/src/contributions/__tests__/__snapshots__/DisplayContentContribution.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/contributions/__tests__/__snapshots__/DisplayContentContribution.test.tsx.snap
@@ -3,10 +3,10 @@
 exports[`DisplayContentContribution Accordions should not fail if no summary tag 1`] = `
 <div>
   <div
-    class="sc-eulNck hOEymR"
+    class="sc-525da103-0 clIhqj"
   >
     <div
-      class="sc-dExYaf hOgKYe"
+      class="sc-525da103-1 sXmdw"
       data-accordion-component="Accordion"
       data-testid="contrib-accordion"
     >
@@ -14,7 +14,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
         id="report-ou-suspension-du-preavis"
       >
         <div
-          class="sc-jXbUNg heDTFL"
+          class="sc-1571bed7-0"
           data-accordion-component="AccordionItem"
         >
           <div
@@ -25,7 +25,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
               aria-controls="accordion__panel-report-ou-suspension-du-preavis"
               aria-disabled="false"
               aria-expanded="false"
-              class="sc-kpDqfm heoudo"
+              class="sc-1571bed7-2 gNtlHI"
               data-accordion-component="AccordionItemButton"
               id="accordion__heading-report-ou-suspension-du-preavis"
               role="button"
@@ -33,7 +33,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
             >
               <svg
                 aria-hidden="true"
-                class="sc-imWYAI gTeNha"
+                class="sc-93c68677-0 fWneNg"
                 fill="none"
                 height="24"
                 stroke="currentColor"
@@ -49,10 +49,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                 />
               </svg>
               <div
-                class="sc-dAlyuH eyjExg"
+                class="sc-1571bed7-3 figaQV"
               >
                 <h3
-                  class="sc-kAyceB dvmaTz"
+                  class="sc-b879fc2d-0 hyiHle"
                   data-testid="contrib-accordion-0"
                   style="margin: 0px;"
                 >
@@ -63,13 +63,13 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
           </div>
           <div
             aria-hidden="true"
-            class="sc-dhKdcB hlTUsz"
+            class="sc-1571bed7-1 hamHiw"
             data-accordion-component="AccordionItemPanel"
             hidden=""
             id="accordion__panel-report-ou-suspension-du-preavis"
           >
             <div
-              class="sc-bXCLTC fcbJdD"
+              class="sc-32c7807-0 iMDCLs"
             >
               <div>
                 <p>
@@ -80,7 +80,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
       
                 </p>
                 <div
-                  class="sc-dExYaf hOgKYe"
+                  class="sc-525da103-1 sXmdw"
                   data-accordion-component="Accordion"
                   data-testid="contrib-accordion"
                 >
@@ -88,7 +88,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                     id="conges-payes"
                   >
                     <div
-                      class="sc-jXbUNg heDTFL"
+                      class="sc-1571bed7-0"
                       data-accordion-component="AccordionItem"
                     >
                       <div
@@ -99,7 +99,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                           aria-controls="accordion__panel-conges-payes"
                           aria-disabled="false"
                           aria-expanded="false"
-                          class="sc-kpDqfm heoudo"
+                          class="sc-1571bed7-2 gNtlHI"
                           data-accordion-component="AccordionItemButton"
                           id="accordion__heading-conges-payes"
                           role="button"
@@ -107,7 +107,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                         >
                           <svg
                             aria-hidden="true"
-                            class="sc-imWYAI gTeNha"
+                            class="sc-93c68677-0 fWneNg"
                             fill="none"
                             height="24"
                             stroke="currentColor"
@@ -123,10 +123,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                             />
                           </svg>
                           <div
-                            class="sc-dAlyuH eyjExg"
+                            class="sc-1571bed7-3 figaQV"
                           >
                             <h4
-                              class="sc-kAyceB dvmaTz"
+                              class="sc-b879fc2d-0 hyiHle"
                               data-testid="contrib-accordion-0"
                               style="margin: 0px;"
                             >
@@ -137,17 +137,17 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                       </div>
                       <div
                         aria-hidden="true"
-                        class="sc-dhKdcB hlTUsz"
+                        class="sc-1571bed7-1 hamHiw"
                         data-accordion-component="AccordionItemPanel"
                         hidden=""
                         id="accordion__panel-conges-payes"
                       >
                         <div
-                          class="sc-bXCLTC fcbJdD"
+                          class="sc-32c7807-0 iMDCLs"
                         >
                           <div>
                             <div
-                              class="sc-dExYaf hOgKYe"
+                              class="sc-525da103-1 sXmdw"
                               data-accordion-component="Accordion"
                               data-testid="contrib-accordion"
                             >
@@ -155,7 +155,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                 id="dates-des-conges-fixees-avant-la-notification-du-licenciement"
                               >
                                 <div
-                                  class="sc-jXbUNg heDTFL"
+                                  class="sc-1571bed7-0"
                                   data-accordion-component="AccordionItem"
                                 >
                                   <div
@@ -166,7 +166,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                       aria-controls="accordion__panel-dates-des-conges-fixees-avant-la-notification-du-licenciement"
                                       aria-disabled="false"
                                       aria-expanded="false"
-                                      class="sc-kpDqfm heoudo"
+                                      class="sc-1571bed7-2 gNtlHI"
                                       data-accordion-component="AccordionItemButton"
                                       id="accordion__heading-dates-des-conges-fixees-avant-la-notification-du-licenciement"
                                       role="button"
@@ -174,7 +174,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                     >
                                       <svg
                                         aria-hidden="true"
-                                        class="sc-imWYAI gTeNha"
+                                        class="sc-93c68677-0 fWneNg"
                                         fill="none"
                                         height="24"
                                         stroke="currentColor"
@@ -190,10 +190,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                         />
                                       </svg>
                                       <div
-                                        class="sc-dAlyuH eyjExg"
+                                        class="sc-1571bed7-3 figaQV"
                                       >
                                         <h5
-                                          class="sc-kAyceB dvmaTz"
+                                          class="sc-b879fc2d-0 hyiHle"
                                           data-testid="contrib-accordion-0"
                                           style="margin: 0px;"
                                         >
@@ -206,13 +206,13 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                   </div>
                                   <div
                                     aria-hidden="true"
-                                    class="sc-dhKdcB hlTUsz"
+                                    class="sc-1571bed7-1 hamHiw"
                                     data-accordion-component="AccordionItemPanel"
                                     hidden=""
                                     id="accordion__panel-dates-des-conges-fixees-avant-la-notification-du-licenciement"
                                   >
                                     <div
-                                      class="sc-bXCLTC fcbJdD"
+                                      class="sc-32c7807-0 iMDCLs"
                                     >
                                       <div>
                                         <p>
@@ -232,7 +232,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                 id="dates-des-conges-fixees-apres-la-notification-du-licenciement"
                               >
                                 <div
-                                  class="sc-jXbUNg crDDWD"
+                                  class="sc-1571bed7-0 dpEeGj"
                                   data-accordion-component="AccordionItem"
                                 >
                                   <div
@@ -243,7 +243,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                       aria-controls="accordion__panel-dates-des-conges-fixees-apres-la-notification-du-licenciement"
                                       aria-disabled="false"
                                       aria-expanded="false"
-                                      class="sc-kpDqfm heoudo"
+                                      class="sc-1571bed7-2 gNtlHI"
                                       data-accordion-component="AccordionItemButton"
                                       id="accordion__heading-dates-des-conges-fixees-apres-la-notification-du-licenciement"
                                       role="button"
@@ -251,7 +251,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                     >
                                       <svg
                                         aria-hidden="true"
-                                        class="sc-imWYAI gTeNha"
+                                        class="sc-93c68677-0 fWneNg"
                                         fill="none"
                                         height="24"
                                         stroke="currentColor"
@@ -267,10 +267,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                         />
                                       </svg>
                                       <div
-                                        class="sc-dAlyuH eyjExg"
+                                        class="sc-1571bed7-3 figaQV"
                                       >
                                         <h5
-                                          class="sc-kAyceB dvmaTz"
+                                          class="sc-b879fc2d-0 hyiHle"
                                           data-testid="contrib-accordion-1"
                                           style="margin: 0px;"
                                         >
@@ -283,13 +283,13 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                   </div>
                                   <div
                                     aria-hidden="true"
-                                    class="sc-dhKdcB hlTUsz"
+                                    class="sc-1571bed7-1 hamHiw"
                                     data-accordion-component="AccordionItemPanel"
                                     hidden=""
                                     id="accordion__panel-dates-des-conges-fixees-apres-la-notification-du-licenciement"
                                   >
                                     <div
-                                      class="sc-bXCLTC fcbJdD"
+                                      class="sc-32c7807-0 iMDCLs"
                                     >
                                       <div>
                                         <p>
@@ -310,7 +310,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                 id="licenciement-notifie-pendant-les-conges-payes"
                               >
                                 <div
-                                  class="sc-jXbUNg crDDWD"
+                                  class="sc-1571bed7-0 dpEeGj"
                                   data-accordion-component="AccordionItem"
                                 >
                                   <div
@@ -321,7 +321,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                       aria-controls="accordion__panel-licenciement-notifie-pendant-les-conges-payes"
                                       aria-disabled="false"
                                       aria-expanded="false"
-                                      class="sc-kpDqfm heoudo"
+                                      class="sc-1571bed7-2 gNtlHI"
                                       data-accordion-component="AccordionItemButton"
                                       id="accordion__heading-licenciement-notifie-pendant-les-conges-payes"
                                       role="button"
@@ -329,7 +329,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                     >
                                       <svg
                                         aria-hidden="true"
-                                        class="sc-imWYAI gTeNha"
+                                        class="sc-93c68677-0 fWneNg"
                                         fill="none"
                                         height="24"
                                         stroke="currentColor"
@@ -345,10 +345,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                         />
                                       </svg>
                                       <div
-                                        class="sc-dAlyuH eyjExg"
+                                        class="sc-1571bed7-3 figaQV"
                                       >
                                         <h5
-                                          class="sc-kAyceB dvmaTz"
+                                          class="sc-b879fc2d-0 hyiHle"
                                           data-testid="contrib-accordion-2"
                                           style="margin: 0px;"
                                         >
@@ -359,13 +359,13 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
                                   </div>
                                   <div
                                     aria-hidden="true"
-                                    class="sc-dhKdcB hlTUsz"
+                                    class="sc-1571bed7-1 hamHiw"
                                     data-accordion-component="AccordionItemPanel"
                                     hidden=""
                                     id="accordion__panel-licenciement-notifie-pendant-les-conges-payes"
                                   >
                                     <div
-                                      class="sc-bXCLTC fcbJdD"
+                                      class="sc-32c7807-0 iMDCLs"
                                     >
                                       <div>
                                         <p>
@@ -397,10 +397,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
 
 exports[`DisplayContentContribution Accordions should replace details element by one accordion 1`] = `
 <div
-  class="sc-eulNck hOEymR"
+  class="sc-525da103-0 clIhqj"
 >
   <div
-    class="sc-dExYaf hOgKYe"
+    class="sc-525da103-1 sXmdw"
     data-accordion-component="Accordion"
     data-testid="contrib-accordion"
   >
@@ -408,7 +408,7 @@ exports[`DisplayContentContribution Accordions should replace details element by
       id="ceci-est-un-titre"
     >
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -419,7 +419,7 @@ exports[`DisplayContentContribution Accordions should replace details element by
             aria-controls="accordion__panel-ceci-est-un-titre"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-ceci-est-un-titre"
             role="button"
@@ -427,7 +427,7 @@ exports[`DisplayContentContribution Accordions should replace details element by
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -443,10 +443,10 @@ exports[`DisplayContentContribution Accordions should replace details element by
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 data-testid="contrib-accordion-0"
                 style="margin: 0px;"
               >
@@ -457,13 +457,13 @@ exports[`DisplayContentContribution Accordions should replace details element by
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-ceci-est-un-titre"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <div>
               <p>
@@ -481,10 +481,10 @@ exports[`DisplayContentContribution Accordions should replace details element by
 
 exports[`DisplayContentContribution Accordions should replace details element within details element 1`] = `
 <div
-  class="sc-eulNck hOEymR"
+  class="sc-525da103-0 clIhqj"
 >
   <div
-    class="sc-dExYaf hOgKYe"
+    class="sc-525da103-1 sXmdw"
     data-accordion-component="Accordion"
     data-testid="contrib-accordion"
   >
@@ -492,7 +492,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
       id="ceci-est-un-titre"
     >
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -503,7 +503,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
             aria-controls="accordion__panel-ceci-est-un-titre"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-ceci-est-un-titre"
             role="button"
@@ -511,7 +511,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -527,10 +527,10 @@ exports[`DisplayContentContribution Accordions should replace details element wi
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 data-testid="contrib-accordion-0"
                 style="margin: 0px;"
               >
@@ -541,17 +541,17 @@ exports[`DisplayContentContribution Accordions should replace details element wi
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-ceci-est-un-titre"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <div>
               <div
-                class="sc-dExYaf hOgKYe"
+                class="sc-525da103-1 sXmdw"
                 data-accordion-component="Accordion"
                 data-testid="contrib-accordion"
               >
@@ -559,7 +559,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
                   id="ceci-est-un-sous-titre"
                 >
                   <div
-                    class="sc-jXbUNg heDTFL"
+                    class="sc-1571bed7-0"
                     data-accordion-component="AccordionItem"
                   >
                     <div
@@ -570,7 +570,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
                         aria-controls="accordion__panel-ceci-est-un-sous-titre"
                         aria-disabled="false"
                         aria-expanded="false"
-                        class="sc-kpDqfm heoudo"
+                        class="sc-1571bed7-2 gNtlHI"
                         data-accordion-component="AccordionItemButton"
                         id="accordion__heading-ceci-est-un-sous-titre"
                         role="button"
@@ -578,7 +578,7 @@ exports[`DisplayContentContribution Accordions should replace details element wi
                       >
                         <svg
                           aria-hidden="true"
-                          class="sc-imWYAI gTeNha"
+                          class="sc-93c68677-0 fWneNg"
                           fill="none"
                           height="24"
                           stroke="currentColor"
@@ -594,10 +594,10 @@ exports[`DisplayContentContribution Accordions should replace details element wi
                           />
                         </svg>
                         <div
-                          class="sc-dAlyuH eyjExg"
+                          class="sc-1571bed7-3 figaQV"
                         >
                           <h4
-                            class="sc-kAyceB dvmaTz"
+                            class="sc-b879fc2d-0 hyiHle"
                             data-testid="contrib-accordion-0"
                             style="margin: 0px;"
                           >
@@ -608,13 +608,13 @@ exports[`DisplayContentContribution Accordions should replace details element wi
                     </div>
                     <div
                       aria-hidden="true"
-                      class="sc-dhKdcB hlTUsz"
+                      class="sc-1571bed7-1 hamHiw"
                       data-accordion-component="AccordionItemPanel"
                       hidden=""
                       id="accordion__panel-ceci-est-un-sous-titre"
                     >
                       <div
-                        class="sc-bXCLTC fcbJdD"
+                        class="sc-32c7807-0 iMDCLs"
                       >
                         <div>
                           <p>
@@ -640,10 +640,10 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
 <body>
   <div>
     <div
-      class="sc-eulNck hOEymR"
+      class="sc-525da103-0 clIhqj"
     >
       <div
-        class="sc-dExYaf hOgKYe"
+        class="sc-525da103-1 sXmdw"
         data-accordion-component="Accordion"
         data-testid="contrib-accordion"
       >
@@ -651,7 +651,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
           id="ceci-est-le-titre-1"
         >
           <div
-            class="sc-jXbUNg heDTFL"
+            class="sc-1571bed7-0"
             data-accordion-component="AccordionItem"
           >
             <div
@@ -662,7 +662,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
                 aria-controls="accordion__panel-ceci-est-le-titre-1"
                 aria-disabled="false"
                 aria-expanded="false"
-                class="sc-kpDqfm heoudo"
+                class="sc-1571bed7-2 gNtlHI"
                 data-accordion-component="AccordionItemButton"
                 id="accordion__heading-ceci-est-le-titre-1"
                 role="button"
@@ -670,7 +670,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-imWYAI gTeNha"
+                  class="sc-93c68677-0 fWneNg"
                   fill="none"
                   height="24"
                   stroke="currentColor"
@@ -686,10 +686,10 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
                   />
                 </svg>
                 <div
-                  class="sc-dAlyuH eyjExg"
+                  class="sc-1571bed7-3 figaQV"
                 >
                   <h3
-                    class="sc-kAyceB dvmaTz"
+                    class="sc-b879fc2d-0 hyiHle"
                     data-testid="contrib-accordion-0"
                     style="margin: 0px;"
                   >
@@ -700,13 +700,13 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
             </div>
             <div
               aria-hidden="true"
-              class="sc-dhKdcB hlTUsz"
+              class="sc-1571bed7-1 hamHiw"
               data-accordion-component="AccordionItemPanel"
               hidden=""
               id="accordion__panel-ceci-est-le-titre-1"
             >
               <div
-                class="sc-bXCLTC fcbJdD"
+                class="sc-32c7807-0 iMDCLs"
               >
                 <div>
                   <p>
@@ -722,7 +722,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
           id="ceci-est-le-titre-2"
         >
           <div
-            class="sc-jXbUNg crDDWD"
+            class="sc-1571bed7-0 dpEeGj"
             data-accordion-component="AccordionItem"
           >
             <div
@@ -733,7 +733,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
                 aria-controls="accordion__panel-ceci-est-le-titre-2"
                 aria-disabled="false"
                 aria-expanded="false"
-                class="sc-kpDqfm heoudo"
+                class="sc-1571bed7-2 gNtlHI"
                 data-accordion-component="AccordionItemButton"
                 id="accordion__heading-ceci-est-le-titre-2"
                 role="button"
@@ -741,7 +741,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
               >
                 <svg
                   aria-hidden="true"
-                  class="sc-imWYAI gTeNha"
+                  class="sc-93c68677-0 fWneNg"
                   fill="none"
                   height="24"
                   stroke="currentColor"
@@ -757,10 +757,10 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
                   />
                 </svg>
                 <div
-                  class="sc-dAlyuH eyjExg"
+                  class="sc-1571bed7-3 figaQV"
                 >
                   <h3
-                    class="sc-kAyceB dvmaTz"
+                    class="sc-b879fc2d-0 hyiHle"
                     data-testid="contrib-accordion-1"
                     style="margin: 0px;"
                   >
@@ -771,13 +771,13 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
             </div>
             <div
               aria-hidden="true"
-              class="sc-dhKdcB hlTUsz"
+              class="sc-1571bed7-1 hamHiw"
               data-accordion-component="AccordionItemPanel"
               hidden=""
               id="accordion__panel-ceci-est-le-titre-2"
             >
               <div
-                class="sc-bXCLTC fcbJdD"
+                class="sc-32c7807-0 iMDCLs"
               >
                 <div>
                   <p>
@@ -797,7 +797,7 @@ exports[`DisplayContentContribution Accordions should replace multiple details e
 
 exports[`DisplayContentContribution Alerts should replace div with alert class in li component to Alert component 1`] = `
 <div
-  class="sc-eulNck hOEymR"
+  class="sc-525da103-0 clIhqj"
 >
   <div>
     <p>
@@ -846,7 +846,7 @@ exports[`DisplayContentContribution Alerts should replace div with alert class i
         </p>
         <br />
         <div
-          class="sc-jsJBEP ftwa-dj"
+          class="sc-6c78813f-0 fnbVWG"
         >
           <p>
             <strong>
@@ -863,10 +863,10 @@ exports[`DisplayContentContribution Alerts should replace div with alert class i
 
 exports[`DisplayContentContribution Alerts should replace div with alert class to Alert component 1`] = `
 <div
-  class="sc-eulNck hOEymR"
+  class="sc-525da103-0 clIhqj"
 >
   <div
-    class="sc-jsJBEP ftwa-dj"
+    class="sc-6c78813f-0 fnbVWG"
   >
     <p>
       <strong>
@@ -880,10 +880,10 @@ exports[`DisplayContentContribution Alerts should replace div with alert class t
 
 exports[`DisplayContentContribution Headings should not add headings higher than h6 for accordion 1`] = `
 <div
-  class="sc-eulNck hOEymR"
+  class="sc-525da103-0 clIhqj"
 >
   <div
-    class="sc-dExYaf hOgKYe"
+    class="sc-525da103-1 sXmdw"
     data-accordion-component="Accordion"
     data-testid="contrib-accordion"
   >
@@ -891,7 +891,7 @@ exports[`DisplayContentContribution Headings should not add headings higher than
       id="ceci-est-un-titre"
     >
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -902,7 +902,7 @@ exports[`DisplayContentContribution Headings should not add headings higher than
             aria-controls="accordion__panel-ceci-est-un-titre"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-ceci-est-un-titre"
             role="button"
@@ -910,7 +910,7 @@ exports[`DisplayContentContribution Headings should not add headings higher than
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -926,10 +926,10 @@ exports[`DisplayContentContribution Headings should not add headings higher than
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h6
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 data-testid="contrib-accordion-0"
                 style="margin: 0px;"
               >
@@ -940,13 +940,13 @@ exports[`DisplayContentContribution Headings should not add headings higher than
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-ceci-est-un-titre"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <div>
               <strong>
@@ -964,10 +964,10 @@ exports[`DisplayContentContribution Headings should not add headings higher than
 exports[`DisplayContentContribution Tables should render correctly a table with multiple head lines 1`] = `
 <div>
   <div
-    class="sc-eulNck hOEymR"
+    class="sc-525da103-0 clIhqj"
   >
     <table
-      class="sc-cmaqmh juENof"
+      class="sc-4e3ba411-0 kKVapO"
     >
       <thead>
         <tr>
diff --git a/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap b/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap
index bf273651ee..cd526a52bf 100644
--- a/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap
+++ b/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap
@@ -3,18 +3,18 @@
 exports[`<Convention /> renders 1`] = `
 <div>
   <div
-    class="sc-kzqdkY dZUDIh"
+    class="sc-e32628d4-0 cwDqXq"
   >
     <h2
-      class="sc-dSIIpw otPXl"
+      class="sc-d6e72754-0 gUBAuw"
     >
       <span
-        class="sc-gsFSXq ljkohw"
+        class="sc-a4d7a179-0 gGBEJx"
       />
       Questions-réponses fréquentes
     </h2>
     <p
-      class="sc-bDpDS dovLJR"
+      class="sc-ea8c0a81-0 dHtsEU"
     >
       Description de la CC
     </p>
@@ -25,7 +25,7 @@ exports[`<Convention /> renders 1`] = `
   >
     <div>
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -36,7 +36,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-0"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-0"
             role="button"
@@ -44,7 +44,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -60,10 +60,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Congés et repos
@@ -73,18 +73,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-0"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-conditions-dindemnisation-pendant-le-conge-de-maternite"
                 >
                   Quelles sont les conditions d’indemnisation pendant le congé de maternité ? 
@@ -92,7 +92,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-du-conge-de-maternite"
                 >
                   Quelle est la durée du congé de maternité ?
@@ -100,7 +100,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-si-le-salarie-est-malade-pendant-ses-conges-quelles-en-sont-les-consequences"
                 >
                   Si le salarié est malade pendant ses congés, quelles en sont les conséquences ?
@@ -108,7 +108,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-les-conges-pour-evenements-familiaux"
                 >
                   Les congés pour événements familiaux
@@ -116,7 +116,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-jours-feries-et-ponts-dans-le-secteur-prive"
                 >
                   Jours fériés et ponts dans le secteur privé
@@ -124,7 +124,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-travail-du-dimanche-quelle-contrepartie"
                 >
                   Travail du dimanche : quelle contrepartie ?
@@ -137,7 +137,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -148,7 +148,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-1"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-1"
             role="button"
@@ -156,7 +156,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -172,10 +172,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Départ de l’entreprise
@@ -185,18 +185,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-1"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-faut-il-respecter-un-delai-de-carence-entre-deux-cdd-si-oui-quelle-est-sa-duree"
                 >
                   Faut-il respecter un délai de carence entre deux CDD ? Si oui, quelle est sa durée ?
@@ -204,7 +204,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-dans-le-cadre-dun-cdd-quel-est-le-montant-de-lindemnite-de-fin-de-contrat"
                 >
                   Dans le cadre d’un CDD, quel est le montant de l’indemnité de fin de contrat ? 
@@ -212,7 +212,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-faut-il-respecter-un-delai-de-carence-entre-deux-contrats-de-mission-interim"
                 >
                   Faut-il respecter un délai de carence entre deux contrats de mission (intérim) ? 
@@ -220,7 +220,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-dans-le-cadre-dun-contrat-de-mission-interim-quel-est-le-montant-de-lindemnite-de-fin-de-contrat"
                 >
                   Dans le cadre d’un contrat de mission (intérim), quel est le montant de l’indemnité de fin de contrat ? 
@@ -228,7 +228,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-du-preavis-en-cas-de-demission"
                 >
                   Quelle est la durée du préavis en cas de démission ?
@@ -236,7 +236,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-de-preavis-en-cas-de-licenciement"
                 >
                   Quelle est la durée de préavis en cas de licenciement ?
@@ -244,7 +244,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-de-preavis-en-cas-de-depart-a-la-retraite"
                 >
                   Quelle est la durée de préavis en cas de départ à la retraite ?
@@ -252,7 +252,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-de-preavis-en-cas-de-mise-a-la-retraite"
                 >
                   Quelle est la durée de préavis en cas de mise à la retraite ?
@@ -260,7 +260,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-le-preavis-de-licenciement-doit-il-etre-execute-en-totalite-y-compris-si-le-salarie-a-retrouve-un-emploi"
                 >
                   Le préavis de licenciement doit-il être exécuté en totalité ? Y compris si le salarié a retrouvé un emploi ?
@@ -268,7 +268,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-le-preavis-de-demission-doit-il-etre-execute-en-totalite-y-compris-si-le-salarie-a-retrouve-un-emploi"
                 >
                   Le préavis de démission doit-il être exécuté en totalité ? Y compris si le salarié a retrouvé un emploi ?
@@ -276,7 +276,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-le-salarie-peut-il-sabsenter-pour-rechercher-un-emploi-pendant-son-preavis"
                 >
                   Le salarié peut-il s’absenter pour rechercher un emploi pendant son préavis ?
@@ -284,7 +284,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-arret-maladie-pendant-le-preavis-quelles-consequences"
                 >
                   Arrêt maladie pendant le préavis : quelles conséquences ?
@@ -292,7 +292,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-consequences-du-deces-de-lemployeur-sur-le-contrat-de-travail"
                 >
                   Quelles sont les conséquences du décès de l’employeur sur le contrat de travail ?
@@ -300,7 +300,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-a-quelles-indemnites-peut-pretendre-un-salarie-qui-part-a-la-retraite"
                 >
                   À quelles indemnités peut prétendre un salarié qui part à la retraite ?
@@ -313,7 +313,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -324,7 +324,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-2"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-2"
             role="button"
@@ -332,7 +332,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -348,10 +348,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Embauche et contrat de travail
@@ -361,18 +361,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-2"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-si-un-poste-se-libere-ou-est-cree-dans-lentreprise-lemployeur-doit-il-en-informer-les-salaries-ou-le-leur-proposer-en-priorite"
                 >
                   Si un poste se libère ou est créé dans l’entreprise, l’employeur doit-il en informer les salariés ? Ou le leur proposer en priorité ?
@@ -380,7 +380,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-maximale-de-la-periode-dessai-sans-et-avec-renouvellement"
                 >
                   Quelle est la durée maximale de la période d'essai, sans et avec renouvellement ?
@@ -388,7 +388,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-la-periode-dessai-peut-elle-etre-renouvelee"
                 >
                   La période d’essai peut-elle être renouvelée ?
@@ -396,7 +396,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-arret-maladie-pendant-la-periode-dessai-quelles-sont-les-regles"
                 >
                   Arrêt maladie pendant la période d'essai : quelles sont les règles ?
@@ -404,7 +404,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-est-il-obligatoire-davoir-un-contrat-de-travail-ecrit-et-signe"
                 >
                   Est-il obligatoire d'avoir un contrat de travail écrit et signé ?
@@ -412,7 +412,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-informations-doivent-figurer-dans-le-contrat-de-travail-ou-la-lettre-dengagement"
                 >
                   Quelles informations doivent figurer dans le contrat de travail ou la lettre d'engagement ?
@@ -420,7 +420,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-lentreprise-peut-elle-embaucher-dans-le-cadre-dun-cdi-de-chantier-ou-doperation"
                 >
                   L'entreprise peut-elle embaucher dans le cadre d'un CDI de chantier ou d’opération ? 
@@ -428,7 +428,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-conditions-de-la-clause-de-non-concurrence"
                 >
                   Quelles sont les conditions de la clause de non-concurrence ?
@@ -436,7 +436,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-combien-de-fois-le-contrat-de-travail-peut-il-etre-renouvele"
                 >
                   Combien de fois le contrat de travail peut-il être renouvelé ?
@@ -444,7 +444,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-peut-etre-la-duree-maximale-dun-cdd"
                 >
                   Quelle peut être la durée maximale d'un CDD ?
@@ -452,7 +452,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-embauche-en-contrat-dextra-cdd-dusage"
                 >
                   Embauche en contrat d'extra (CDD d'usage)
@@ -460,7 +460,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelle-est-la-duree-maximale-du-contrat-de-mission-interim"
                 >
                   Quelle est la durée maximale du contrat de mission (intérim) ?
@@ -468,7 +468,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-en-cas-de-perte-de-marche-par-lemployeur-quelles-sont-les-conditions-dun-transfert-des-contrats-de-travail"
                 >
                   En cas de perte de marché par l’employeur, quelles sont les conditions d'un transfert des contrats de travail ? 
@@ -481,7 +481,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -492,7 +492,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-3"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-3"
             role="button"
@@ -500,7 +500,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -516,10 +516,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Salaire et Rémunération
@@ -529,18 +529,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-3"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-comment-determiner-lanciennete-du-salarie"
                 >
                   Comment déterminer l'ancienneté du salarié ?
@@ -548,7 +548,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quand-le-salarie-a-t-il-droit-a-une-prime-danciennete-quel-est-son-montant"
                 >
                   Quand le salarié a-t-il droit à une prime d’ancienneté ? Quel est son montant ?
@@ -556,7 +556,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-conditions-dattribution-de-la-prime-pour-travaux-dangereux-et-de-la-prime-pour-travaux-insalubres"
                 >
                   Quelles sont les conditions d'attribution de la prime pour travaux dangereux et de la prime pour travaux insalubres ?
@@ -564,7 +564,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-primes-prevues-par-la-convention-collective"
                 >
                   Quelles sont les primes prévues par la convention collective ?
@@ -577,7 +577,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -588,7 +588,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-4"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-4"
             role="button"
@@ -596,7 +596,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -612,10 +612,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Santé, sécurité et conditions de travail
@@ -625,18 +625,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-4"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
                 >
                   En cas d’arrêt maladie du salarié, l’employeur doit-il assurer le maintien de salaire ?
@@ -644,7 +644,7 @@ exports[`<Convention /> renders 1`] = `
               </li>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-en-cas-de-maladie-le-salarie-a-t-il-droit-a-une-garantie-demploi"
                 >
                   En cas de maladie, le salarié a-t-il droit à une garantie d’emploi ?
@@ -657,7 +657,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -668,7 +668,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-5"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-5"
             role="button"
@@ -676,7 +676,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -692,10 +692,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Temps de travail
@@ -705,18 +705,18 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-5"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <ul>
               <li>
                 <a
-                  class="sc-YysOf fAlElC"
+                  class="sc-f9eac082-0 YYaHd"
                   href="/contribution/2941-quelles-sont-les-conditions-de-cumul-demplois"
                 >
                   Quelles sont les conditions de cumul d'emplois ?
@@ -729,24 +729,24 @@ exports[`<Convention /> renders 1`] = `
     </div>
   </div>
   <div
-    class="sc-kzqdkY dZUDIh"
+    class="sc-e32628d4-0 cwDqXq"
   >
     <h2
-      class="sc-dSIIpw otPXl"
+      class="sc-d6e72754-0 gUBAuw"
     >
       <span
-        class="sc-gsFSXq ljkohw"
+        class="sc-a4d7a179-0 gGBEJx"
       />
       Articles de la convention collective
     </h2>
     <p
-      class="sc-bDpDS dovLJR"
+      class="sc-ea8c0a81-0 dHtsEU"
     >
       Consultez les articles de la convention collective qui s’appliquent à votre situation dans les thèmes sélectionnés ci-dessous.
     </p>
   </div>
   <div
-    class="sc-fxwrCY gwaFzF"
+    class="sc-9845d97e-0 jdstGa"
     data-accordion-component="Accordion"
   >
     <div
@@ -761,7 +761,7 @@ exports[`<Convention /> renders 1`] = `
           aria-controls="accordion__panel-raa-6"
           aria-disabled="false"
           aria-expanded="false"
-          class="sc-hIUJlX fucbFP"
+          class="sc-9845d97e-1 jffOUe"
           data-accordion-component="AccordionItemButton"
           id="accordion__heading-raa-6"
           role="button"
@@ -769,7 +769,7 @@ exports[`<Convention /> renders 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="sc-jnOGJG edPXtC"
+            class="sc-9845d97e-2 kPPRyj"
             fill="none"
             viewBox="0 0 16 16"
             xmlns="http://www.w3.org/2000/svg"
@@ -782,20 +782,20 @@ exports[`<Convention /> renders 1`] = `
             />
           </svg>
           <div
-            class="sc-dZoequ bcPqgL"
+            class="sc-9845d97e-3 biBldq"
           >
             En savoir plus
           </div>
         </div>
       </div>
       <div
-        class="sc-ggpjZQ fponfT"
+        class="sc-9845d97e-5 kPgcSs"
         data-accordion-component="AccordionItemPanel"
         hidden=""
         id="accordion__panel-raa-6"
       >
         <div
-          class="sc-eZkCL HkMzx"
+          class="sc-9845d97e-4 dcRMRW"
         >
           <p>
             Les thèmes sélectionnés par le ministère du Travail sont les thèmes pour lesquels la convention collective s’applique à votre situation. Cela signifique que même s’il existe un accord d’entreprise sur ces thèmes, celui-ci ne peut prévoir de règles différentes de celles prévues par la convention collective.
@@ -837,7 +837,7 @@ exports[`<Convention /> renders 1`] = `
   >
     <div>
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -848,7 +848,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-7"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-7"
             role="button"
@@ -856,7 +856,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -872,10 +872,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Salaires minima hiérarchiques
@@ -885,31 +885,31 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-7"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <div
-              class="sc-gFAWRd euznOP"
+              class="sc-2496d0f8-0 dvplyw"
             >
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000047011451/?idConteneur=2941"
@@ -921,26 +921,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Avenant n° 51-2022 du 23 mars 2022 relatif aux salaires
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000047011462/?idConteneur=2941"
@@ -952,7 +952,7 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Avenant n° 52-2022 du 23 mars 2022 relatif aux salaires
                   </div>
@@ -965,7 +965,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -976,7 +976,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-8"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-8"
             role="button"
@@ -984,7 +984,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -1000,10 +1000,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Durée du travail, répartition et aménagement des horaires
@@ -1013,31 +1013,31 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-8"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <div
-              class="sc-gFAWRd euznOP"
+              class="sc-2496d0f8-0 dvplyw"
             >
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805638/?idConteneur=2941"
@@ -1049,26 +1049,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805639/?idConteneur=2941"
@@ -1080,26 +1080,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000033116260/?idConteneur=2941"
@@ -1111,26 +1111,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805641/?idConteneur=2941"
@@ -1142,26 +1142,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805642/?idConteneur=2941"
@@ -1173,26 +1173,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805643/?idConteneur=2941"
@@ -1204,26 +1204,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805644/?idConteneur=2941"
@@ -1235,26 +1235,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805645/?idConteneur=2941"
@@ -1266,26 +1266,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805646/?idConteneur=2941"
@@ -1297,26 +1297,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805647/?idConteneur=2941"
@@ -1328,26 +1328,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805648/?idConteneur=2941"
@@ -1359,26 +1359,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000033116262/?idConteneur=2941"
@@ -1390,26 +1390,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805650/?idConteneur=2941"
@@ -1421,26 +1421,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805652/?idConteneur=2941"
@@ -1452,26 +1452,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Principes généraux sur la durée du travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805653/?idConteneur=2941"
@@ -1483,26 +1483,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Travail du dimanche et des jours fériés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805654/?idConteneur=2941"
@@ -1514,26 +1514,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Travail du dimanche et des jours fériés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805656/?idConteneur=2941"
@@ -1545,26 +1545,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Travail du dimanche et des jours fériés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805657/?idConteneur=2941"
@@ -1576,26 +1576,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Travail du dimanche et des jours fériés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805660/?idConteneur=2941"
@@ -1607,26 +1607,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     C. – Temps d'astreinte
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805659/?idConteneur=2941"
@@ -1638,26 +1638,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     C. – Temps d'astreinte
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805658/?idConteneur=2941"
@@ -1669,26 +1669,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     C. – Temps d'astreinte
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805669/?idConteneur=2941"
@@ -1700,26 +1700,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Travailleurs de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805667/?idConteneur=2941"
@@ -1731,26 +1731,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Travailleurs de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805666/?idConteneur=2941"
@@ -1762,26 +1762,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Travailleurs de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805665/?idConteneur=2941"
@@ -1793,26 +1793,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Travailleurs de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805664/?idConteneur=2941"
@@ -1824,26 +1824,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Travailleurs de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805671/?idConteneur=2941"
@@ -1855,26 +1855,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Salariés travaillant occasionnellement la nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805672/?idConteneur=2941"
@@ -1886,26 +1886,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Salariés travaillant occasionnellement la nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805673/?idConteneur=2941"
@@ -1917,26 +1917,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Salariés travaillant occasionnellement la nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805662/?idConteneur=2941"
@@ -1948,26 +1948,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Chapitre II Travail de nuit
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805675/?idConteneur=2941"
@@ -1979,26 +1979,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Dispositions communes aux différents modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805676/?idConteneur=2941"
@@ -2010,26 +2010,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     A. – Dispositions communes aux différents modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000033116268/?idConteneur=2941"
@@ -2041,26 +2041,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000033116266/?idConteneur=2941"
@@ -2072,26 +2072,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805679/?idConteneur=2941"
@@ -2103,26 +2103,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805678/?idConteneur=2941"
@@ -2134,26 +2134,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Modes d'aménagement du temps de travail
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805677/?idConteneur=2941"
@@ -2165,7 +2165,7 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     B. – Modes d'aménagement du temps de travail
                   </div>
@@ -2178,7 +2178,7 @@ exports[`<Convention /> renders 1`] = `
     </div>
     <div>
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -2189,7 +2189,7 @@ exports[`<Convention /> renders 1`] = `
             aria-controls="accordion__panel-raa-9"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-raa-9"
             role="button"
@@ -2197,7 +2197,7 @@ exports[`<Convention /> renders 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -2213,10 +2213,10 @@ exports[`<Convention /> renders 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h3
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 Emploi des travailleurs handicapés
@@ -2226,41 +2226,41 @@ exports[`<Convention /> renders 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-raa-9"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p
-              class="sc-gdyeKB jXhxaU"
+              class="sc-bdaf45c8-0 nMxaE"
             >
               Important
             </p>
             <p
-              class="sc-ktPPKK JUXiO"
+              class="sc-7b1e2e34-0 igMhfx"
             >
               Pour que ce thème s’applique à votre situation, il doit être indiqué dans l’article en question qu’un accord d’entreprise ne peut pas déroger à la convention collective; à moins que l’accord d’entreprise ne prévoie des garanties au moins équivalentes.
             </p>
             <div
-              class="sc-gFAWRd euznOP"
+              class="sc-2496d0f8-0 dvplyw"
             >
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805517/?idConteneur=2941"
@@ -2272,26 +2272,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805515/?idConteneur=2941"
@@ -2303,26 +2303,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805514/?idConteneur=2941"
@@ -2334,26 +2334,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805513/?idConteneur=2941"
@@ -2365,26 +2365,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805512/?idConteneur=2941"
@@ -2396,26 +2396,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805511/?idConteneur=2941"
@@ -2427,26 +2427,26 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
                 </div>
               </div>
               <div
-                class="sc-gmPhUn cRQifg"
+                class="sc-28aac820-0 oopOP"
               >
                 <div
-                  class="sc-ibQAlb fuLYQY no-after"
+                  class="sc-d47d8018-0 cDsGtD no-after"
                 >
                   <div
-                    class="sc-guJBdh jBpgpS"
+                    class="sc-d47d8018-2 eBZhiP"
                   >
                     <div
-                      class="sc-hZDyAQ tqlOz"
+                      class="sc-d47d8018-3 cAXyng"
                     >
                       <p
-                        class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                        class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                       >
                         <a
                           href="https://legifrance.gouv.fr/conv_coll/id/KALIARTI000025805509/?idConteneur=2941"
@@ -2458,7 +2458,7 @@ exports[`<Convention /> renders 1`] = `
                     </div>
                   </div>
                   <div
-                    class="sc-gmgFlS ikhbYa"
+                    class="sc-d47d8018-6 ipSAXR"
                   >
                     Titre IX Emploi des travailleurs handicapés
                   </div>
@@ -2471,37 +2471,37 @@ exports[`<Convention /> renders 1`] = `
     </div>
   </div>
   <div
-    class="sc-kzqdkY dZUDIh"
+    class="sc-e32628d4-0 cwDqXq"
   >
     <h2
-      class="sc-dSIIpw otPXl"
+      class="sc-d6e72754-0 gUBAuw"
     >
       <span
-        class="sc-gsFSXq ljkohw"
+        class="sc-a4d7a179-0 gGBEJx"
       />
       Recherche dans la convention collective
     </h2>
     <p
-      class="sc-bDpDS dovLJR"
+      class="sc-ea8c0a81-0 dHtsEU"
     >
       Recherchez par mots clés dans le texte de la convention collective sur le site Légifrance.
     </p>
   </div>
   <form
     action="https://legifrance.gouv.fr/search/kali#kali"
-    class="sc-dPZUQH kRwqtK"
+    class="sc-4bdafa31-3 dxTscc"
     target="_blank"
   >
     <div
-      class="sc-cVzyXs ldkmtD"
+      class="sc-4bdafa31-0 jpKYqL"
     >
       <div
-        class="sc-sLsrZ kGdGKi sc-ePDLzJ hVyPHU"
+        class="sc-669fe731-0 amSvQ sc-4bdafa31-1 hgHvZj"
       >
         <input
           aria-label="Recherchez dans la collection collective"
           autocomplete="off"
-          class="sc-dBmzty djgFPK"
+          class="sc-669fe731-1 bBYNqO"
           id="search-agreement"
           name="rawQuery"
           placeholder="Congés exceptionnels, prime"
@@ -2540,14 +2540,14 @@ exports[`<Convention /> renders 1`] = `
       />
       <button
         aria-label="Recherchez dans la collection collective"
-        class="sc-kOPcWz kyVwqT sc-bVVIoq jRINtt"
+        class="sc-95bd4344-0 dxXsic sc-4bdafa31-2 XkEJn"
         title="Lancer une recherche"
         type="submit"
       >
         <svg
           aria-hidden="true"
           aria-label="rechercher (nouvelle fenêtre)"
-          class="sc-eBHhsj blcEOJ"
+          class="sc-4bdafa31-4 AbUwa"
           fill="none"
           viewBox="0 0 32 32"
           xmlns="http://www.w3.org/2000/svg"
@@ -2561,10 +2561,10 @@ exports[`<Convention /> renders 1`] = `
     </div>
   </form>
   <div
-    class="sc-hRJfrW fHhwIY"
+    class="sc-66a696c4-0 MNJNF"
   >
     <div
-      class="sc-iHbSHJ dqcYtl"
+      class="sc-66a696c4-1 dvlKxa"
     >
       <svg
         aria-hidden="true"
@@ -2584,7 +2584,7 @@ exports[`<Convention /> renders 1`] = `
       </svg>
     </div>
     <div
-      class="sc-klVQfs giEiHo"
+      class="sc-66a696c4-2 eRMOZl"
     >
       Selon le thème, un accord collectif d’entreprise peut prévoir des règles différentes par rapport à la convention collective.
        
diff --git a/packages/code-du-travail-frontend/src/conventions/Search/__tests__/__snapshots__/Search.test.js.snap b/packages/code-du-travail-frontend/src/conventions/Search/__tests__/__snapshots__/Search.test.js.snap
index 7b61b37b9f..a81425a66c 100644
--- a/packages/code-du-travail-frontend/src/conventions/Search/__tests__/__snapshots__/Search.test.js.snap
+++ b/packages/code-du-travail-frontend/src/conventions/Search/__tests__/__snapshots__/Search.test.js.snap
@@ -3,16 +3,16 @@
 exports[`<Search /> should render 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -21,16 +21,16 @@ exports[`<Search /> should render 1`] = `
     />
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
@@ -44,16 +44,16 @@ exports[`<Search /> should render 1`] = `
 exports[`<Search /> should show no results when no result 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -62,25 +62,25 @@ exports[`<Search /> should show no results when no result 1`] = `
     />
   </div>
   <div
-    class="sc-dNsVcS inJOKt"
+    class="sc-7029e335-4 iyEKsr"
   >
     <p
-      class="sc-krNlru bpribs"
+      class="sc-3633cc97-1 bjxtLv"
     >
       Aucun résultat n’a été trouvé.
     </p>
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
@@ -94,16 +94,16 @@ exports[`<Search /> should show no results when no result 1`] = `
 exports[`<Search /> should show spinner when loading 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -112,10 +112,10 @@ exports[`<Search /> should show spinner when loading 1`] = `
     />
   </div>
   <div
-    class="sc-dNsVcS inJOKt"
+    class="sc-7029e335-4 iyEKsr"
   >
     <p
-      class="sc-krNlru bpribs"
+      class="sc-3633cc97-1 bjxtLv"
     >
       <svg
         aria-labelledby="title desc"
@@ -166,16 +166,16 @@ exports[`<Search /> should show spinner when loading 1`] = `
     </p>
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
@@ -189,16 +189,16 @@ exports[`<Search /> should show spinner when loading 1`] = `
 exports[`<Search /> when input is IDCC, should search conventions 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -207,32 +207,32 @@ exports[`<Search /> when input is IDCC, should search conventions 1`] = `
     />
   </div>
   <div
-    class="sc-dNsVcS inJOKt"
+    class="sc-7029e335-4 iyEKsr"
   >
     <div
-      class="sc-iGgWBj sc-kqGoIF cRLRjd kkFmrd"
+      class="sc-2a0a4b0a-0 sc-f1b633f2-0 hPfzrL hVjMsy"
     >
       <h3
-        class="sc-kAyceB dvmaTz"
+        class="sc-b879fc2d-0 hyiHle"
       >
         CONVENTIONS COLLECTIVES (2
          
         résultats)
       </h3>
       <ul
-        class="sc-cfxfcM kMmTaI"
+        class="sc-ab356c14-0 bpNHPl"
       >
         <li
-          class="sc-dxcDKg brJeBa"
+          class="sc-f1b633f2-1 fOEIjw"
         >
           <a
-            class="sc-fMMURN gbvVXw"
+            class="sc-b0ba5588-0 ehbXdn"
             href="/convention-collective/275-small-titre"
           >
             small titre
              
             <span
-              class="sc-ktPPKK epkktb"
+              class="sc-b0ba5588-1 gLArfB"
             >
               (IDCC 
               0275
@@ -241,16 +241,16 @@ exports[`<Search /> when input is IDCC, should search conventions 1`] = `
           </a>
         </li>
         <li
-          class="sc-dxcDKg brJeBa"
+          class="sc-f1b633f2-1 fOEIjw"
         >
           <a
-            class="sc-fMMURN krEXxa"
+            class="sc-b0ba5588-0 KiIXl"
             href="/convention-collective/276-smaller-convention-2"
           >
             smaller convention 2
              
             <span
-              class="sc-ktPPKK epkktb"
+              class="sc-b0ba5588-1 gLArfB"
             >
               (IDCC 
               0276
@@ -262,16 +262,16 @@ exports[`<Search /> when input is IDCC, should search conventions 1`] = `
     </div>
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
@@ -285,16 +285,16 @@ exports[`<Search /> when input is IDCC, should search conventions 1`] = `
 exports[`<Search /> when input is a valid IDCC, should show only the perfect match 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -303,32 +303,32 @@ exports[`<Search /> when input is a valid IDCC, should show only the perfect mat
     />
   </div>
   <div
-    class="sc-dNsVcS inJOKt"
+    class="sc-7029e335-4 iyEKsr"
   >
     <div
-      class="sc-iGgWBj sc-kqGoIF cRLRjd kkFmrd"
+      class="sc-2a0a4b0a-0 sc-f1b633f2-0 hPfzrL hVjMsy"
     >
       <h3
-        class="sc-kAyceB dvmaTz"
+        class="sc-b879fc2d-0 hyiHle"
       >
         CONVENTIONS COLLECTIVES (1
          
         résultat)
       </h3>
       <ul
-        class="sc-cfxfcM kMmTaI"
+        class="sc-ab356c14-0 bpNHPl"
       >
         <li
-          class="sc-dxcDKg brJeBa"
+          class="sc-f1b633f2-1 fOEIjw"
         >
           <a
-            class="sc-fMMURN gbvVXw"
+            class="sc-b0ba5588-0 ehbXdn"
             href="/convention-collective/4567-smaller-convention-2"
           >
             smaller convention 2
              
             <span
-              class="sc-ktPPKK epkktb"
+              class="sc-b0ba5588-1 gLArfB"
             >
               (IDCC 
               4567
@@ -340,16 +340,16 @@ exports[`<Search /> when input is a valid IDCC, should show only the perfect mat
     </div>
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
@@ -363,16 +363,16 @@ exports[`<Search /> when input is a valid IDCC, should show only the perfect mat
 exports[`<Search /> when searching by text, should use enterprise API 1`] = `
 <div>
   <label
-    class="sc-dkmUuB iZQlLq"
+    class="sc-75bae102-0 jzkYDa"
     for="convention-search"
   >
     Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
   </label>
   <div
-    class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+    class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
   >
     <input
-      class="sc-dBmzty djgFPK"
+      class="sc-669fe731-1 bBYNqO"
       id="convention-search"
       name="q"
       placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -381,25 +381,25 @@ exports[`<Search /> when searching by text, should use enterprise API 1`] = `
     />
   </div>
   <div
-    class="sc-dNsVcS inJOKt"
+    class="sc-7029e335-4 iyEKsr"
   >
     <p
-      class="sc-krNlru bpribs"
+      class="sc-3633cc97-1 bjxtLv"
     >
       Le service de recherche est indisponible.
     </p>
   </div>
   <p
-    class="sc-kRRyDe faJSef"
+    class="sc-7029e335-1 eQVARQ"
   >
     Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
     <span
-      class="sc-knuQbY bHxskD"
+      class="sc-7029e335-2 emEtHs"
     >
       Consultez
        
       <button
-        class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+        class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
         type="button"
       >
         notre aide
diff --git a/packages/code-du-travail-frontend/src/conventions/__tests__/__snapshots__/SearchModal.test.js.snap b/packages/code-du-travail-frontend/src/conventions/__tests__/__snapshots__/SearchModal.test.js.snap
index e9e70ecc99..17d7f8f0b6 100644
--- a/packages/code-du-travail-frontend/src/conventions/__tests__/__snapshots__/SearchModal.test.js.snap
+++ b/packages/code-du-travail-frontend/src/conventions/__tests__/__snapshots__/SearchModal.test.js.snap
@@ -32,28 +32,28 @@ exports[`<ConventionModal /> should render a popup when click on button 1`] = `
     >
       <div>
         <div
-          class="sc-bypJrT nMTGe"
+          class="sc-19478701-0 jZYVgz"
           data-reach-dialog-overlay=""
         >
           <div
             aria-label="Rechercher votre convention collective"
             aria-modal="true"
-            class="sc-ddjGPC byKttK"
+            class="sc-19478701-1 hQHZiT"
             data-reach-dialog-content=""
             role="dialog"
             tabindex="-1"
           >
             <label
-              class="sc-dkmUuB iZQlLq"
+              class="sc-75bae102-0 jzkYDa"
               for="convention-search"
             >
               Renseignez le nom de votre convention collective, le nom de votre entreprise ou son SIRET.
             </label>
             <div
-              class="sc-sLsrZ kGdGKi sc-gvZAcH fPuXxa"
+              class="sc-669fe731-0 amSvQ sc-7029e335-0 btjXXy"
             >
               <input
-                class="sc-dBmzty djgFPK"
+                class="sc-669fe731-1 bBYNqO"
                 id="convention-search"
                 name="q"
                 placeholder="Nom de la convention collective, de l’entreprise ou son SIRET"
@@ -62,16 +62,16 @@ exports[`<ConventionModal /> should render a popup when click on button 1`] = `
               />
             </div>
             <p
-              class="sc-kRRyDe faJSef"
+              class="sc-7029e335-1 eQVARQ"
             >
               Vous ne connaissez pas ou ne trouvez pas votre convention collective ?
               <span
-                class="sc-knuQbY bHxskD"
+                class="sc-7029e335-2 emEtHs"
               >
                 Consultez
                  
                 <button
-                  class="sc-kOPcWz cOwJar sc-ERObt cLnyVe"
+                  class="sc-95bd4344-0 ksRRNY sc-7029e335-3 enfoOw"
                   type="button"
                 >
                   notre aide
@@ -80,11 +80,11 @@ exports[`<ConventionModal /> should render a popup when click on button 1`] = `
               </span>
             </p>
             <button
-              class="sc-kOPcWz kyVwqT sc-dSCufp iCRrvW"
+              class="sc-95bd4344-0 dxXsic sc-19478701-2 fGtwND"
               title="fermer la modale"
             >
               <div
-                class="sc-cWSHoV bKtA-De"
+                class="sc-8dcb2faa-0 gxfPDw"
               >
                 fermer la modale
               </div>
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/__tests__/__snapshots__/FicheServicePublic.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/__tests__/__snapshots__/FicheServicePublic.test.js.snap
index 9db5ee6192..37110c7fe6 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/__tests__/__snapshots__/FicheServicePublic.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/__tests__/__snapshots__/FicheServicePublic.test.js.snap
@@ -3,10 +3,10 @@
 exports[`<FicheServicePublic /> should render 1`] = `
 <div>
   <div
-    class="sc-lnPyaJ hzNhte"
+    class="sc-574082a7-0 hHWQPj"
   >
     <p
-      class="sc-iXzfSG GeWyC"
+      class="sc-18dbc613-1 eiNaYz"
     >
       
             La démission vous permet de rompre votre contrat de travail de votre propre initiative. Cependant, pour être valable, elle doit respecter certaines conditions. Vous devez prévenir votre employeur de votre volonté de démissionner. Sauf en cas de dispense, vous poursuivez votre activité jusqu'au terme du préavis de démission. Des dispositions spécifiques de rupture anticipée du contrat de travail sont prévues selon votre situation au moment de votre démission (
@@ -21,21 +21,21 @@ exports[`<FicheServicePublic /> should render 1`] = `
          
     </p>
     <div
-      class="sc-brPLxw jqqklj"
+      class="sc-ac4a133f-0 fvNPWb"
       data-rttabs="true"
     >
       <div
-        class="sc-iMWBiJ kmA-Drm"
+        class="sc-ac4a133f-1 fxZtdi"
       >
         <ul
-          class="sc-fvtFIe cHMgmW"
+          class="sc-ac4a133f-2 fHCeXh"
           role="tablist"
         >
           <li
             aria-controls="react-tabs-1"
             aria-disabled="false"
             aria-selected="true"
-            class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+            class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
             data-rttab="true"
             id="react-tabs-0"
             role="tab"
@@ -47,7 +47,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
             aria-controls="react-tabs-3"
             aria-disabled="false"
             aria-selected="false"
-            class="sc-bBeLUv hoMOVm"
+            class="sc-ac4a133f-3 faZqNG"
             data-rttab="true"
             id="react-tabs-2"
             role="tab"
@@ -58,7 +58,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
             aria-controls="react-tabs-5"
             aria-disabled="false"
             aria-selected="false"
-            class="sc-bBeLUv hoMOVm"
+            class="sc-ac4a133f-3 faZqNG"
             data-rttab="true"
             id="react-tabs-4"
             role="tab"
@@ -69,31 +69,31 @@ exports[`<FicheServicePublic /> should render 1`] = `
       </div>
       <div
         aria-labelledby="react-tabs-0"
-        class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+        class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
         id="react-tabs-1"
         role="tabpanel"
       >
         <div
-          class="sc-cWSHoV bKtA-De"
+          class="sc-8dcb2faa-0 gxfPDw"
         >
           <h2
-            class="sc-kAyceB dvmaTz"
+            class="sc-b879fc2d-0 hyiHle"
           >
             CDI
           </h2>
         </div>
         <div
-          class="sc-jMakVo gHeVja"
+          class="sc-ac4a133f-5 yflIk"
         >
           <div
-            class="sc-fMMURN gGkofM"
+            class="sc-74e63776-0 gELTXP"
             data-accordion-component="Accordion"
           >
             <div
               id="de-quoi-sagit-il"
             >
               <div
-                class="sc-jXbUNg heDTFL"
+                class="sc-1571bed7-0"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -104,7 +104,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-de-quoi-sagit-il"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-de-quoi-sagit-il"
                     role="button"
@@ -112,7 +112,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -128,10 +128,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         De quoi s'agit-il ?
@@ -141,13 +141,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-de-quoi-sagit-il"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       La démission est un mode de rupture du contrat de travail qui  vous permet de quitter votre entreprise sans avoir à justifier cette décision.
@@ -169,7 +169,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="conditions"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -180,7 +180,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-conditions"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-conditions"
                     role="button"
@@ -188,7 +188,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -204,10 +204,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Conditions
@@ -217,27 +217,27 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-conditions"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Le salarié peut mettre fin à son contrat de travail dans les cas suivants :
                     </p>
                     <ul>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Dans le cadre d'une rupture volontaire du contrat de travail par le salarié
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -250,7 +250,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -260,7 +260,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -270,7 +270,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -288,7 +288,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="volonte-de-demissionner"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -299,7 +299,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-volonte-de-demissionner"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-volonte-de-demissionner"
                     role="button"
@@ -307,7 +307,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -323,10 +323,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Volonté de démissionner
@@ -336,13 +336,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-volonte-de-demissionner"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Pour qu'une démission soit valable, vous devez manifester de façon claire et non équivoque votre volonté de mettre fin au contrat de travail.
@@ -391,7 +391,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="procedure"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -402,7 +402,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-procedure"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-procedure"
                     role="button"
@@ -410,7 +410,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -426,10 +426,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Procédure
@@ -439,13 +439,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-procedure"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Pour manifester votre volonté claire et non équivoque de démissionner, vous devez nécessairement prévenir votre employeur.
@@ -455,21 +455,21 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     </p>
                     <div
                       aria-label="Modèle de document Lettre de démission du salarié (nouvelle fenêtre)"
-                      class="sc-ibQAlb fuLYQY sc-ePDLzJ eidZVY no-after"
+                      class="sc-d47d8018-0 cDsGtD sc-54b316ce-0 kCUWSF no-after"
                     >
                       <div
-                        class="sc-guJBdh jBpgpS"
+                        class="sc-d47d8018-2 eBZhiP"
                       >
                         <div
-                          class="sc-hZDyAQ tqlOz"
+                          class="sc-d47d8018-3 cAXyng"
                         >
                           <p
-                            class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                            class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
                           >
                             Modèle de document
                           </p>
                           <p
-                            class="sc-ktJbId fhphst"
+                            class="sc-d47d8018-5 jNRMjT"
                           >
                             <a
                               href="https://www.service-public.fr/simulateur/calcul/Demission"
@@ -482,7 +482,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </div>
                       </div>
                       <div
-                        class="sc-gmgFlS ikhbYa"
+                        class="sc-d47d8018-6 ipSAXR"
                       >
                         Source: 
                         Direction de l'information légale et administrative (Premier ministre)
@@ -509,7 +509,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="preavis"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -520,7 +520,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-preavis"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-preavis"
                     role="button"
@@ -528,7 +528,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -544,10 +544,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Préavis
@@ -557,38 +557,38 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-preavis"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       Vous ne pouvez pas quitter votre travail dès que vous avez signifié votre démission à votre employeur. Vous continuez de travailler jusqu'à la fin de votre contrat de travail, dans le respect du délai de préavis prévu (sauf en cas de dispense du préavis).
                     </p>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Durée
                     </h4>
                     <div
-                      class="sc-brPLxw jqqklj"
+                      class="sc-ac4a133f-0 fvNPWb"
                       data-rttabs="true"
                     >
                       <div
-                        class="sc-iMWBiJ kmA-Drm"
+                        class="sc-ac4a133f-1 fxZtdi"
                       >
                         <ul
-                          class="sc-fvtFIe cHMgmW"
+                          class="sc-ac4a133f-2 fHCeXh"
                           role="tablist"
                         >
                           <li
                             aria-controls="react-tabs-7"
                             aria-disabled="false"
                             aria-selected="true"
-                            class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+                            class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
                             data-rttab="true"
                             id="react-tabs-6"
                             role="tab"
@@ -600,7 +600,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             aria-controls="react-tabs-9"
                             aria-disabled="false"
                             aria-selected="false"
-                            class="sc-bBeLUv hoMOVm"
+                            class="sc-ac4a133f-3 faZqNG"
                             data-rttab="true"
                             id="react-tabs-8"
                             role="tab"
@@ -611,7 +611,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             aria-controls="react-tabs-11"
                             aria-disabled="false"
                             aria-selected="false"
-                            class="sc-bBeLUv hoMOVm"
+                            class="sc-ac4a133f-3 faZqNG"
                             data-rttab="true"
                             id="react-tabs-10"
                             role="tab"
@@ -622,35 +622,35 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       </div>
                       <div
                         aria-labelledby="react-tabs-6"
-                        class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+                        class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
                         id="react-tabs-7"
                         role="tabpanel"
                       >
                         <div
-                          class="sc-cWSHoV bKtA-De"
+                          class="sc-8dcb2faa-0 gxfPDw"
                         >
                           <h4
-                            class="sc-kAyceB dvmaTz"
+                            class="sc-b879fc2d-0 hyiHle"
                           >
                             Cas général
                           </h4>
                         </div>
                         <div
-                          class="sc-jMakVo gHeVja"
+                          class="sc-ac4a133f-5 yflIk"
                         >
                           <p>
                             La durée du préavis de démission est fixée :
                           </p>
                           <ul>
                             <li
-                              class="sc-ktPPKK jtA-dSF"
+                              class="sc-5f052859-0 cWQbML"
                             >
                               <p>
                                 Soit par convention collective ou accord collectif
                               </p>
                             </li>
                             <li
-                              class="sc-ktPPKK jtA-dSF"
+                              class="sc-5f052859-0 cWQbML"
                             >
                               <p>
                                 
@@ -663,7 +663,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                               </p>
                             </li>
                             <li
-                              class="sc-ktPPKK jtA-dSF"
+                              class="sc-5f052859-0 cWQbML"
                             >
                               <p>
                                 Soit par le droit local (en Alsace-Moselle)
@@ -677,10 +677,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             Si vous travaillez à temps partiel, la durée calendaire du préavis de démission est la même que celle d'un salarié à temps plein.
                           </p>
                           <div
-                            class="sc-iGgWBj sc-eBHhsj cWzIZL gRKOwf"
+                            class="sc-2a0a4b0a-0 sc-18dbc613-0 dLOZmV hGgpvs"
                           >
                             <h5
-                              class="sc-kAyceB dvmaTz"
+                              class="sc-b879fc2d-0 hyiHle"
                             >
                               À savoir
                             </h5>
@@ -692,19 +692,19 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       </div>
                       <div
                         aria-labelledby="react-tabs-8"
-                        class="sc-ihgnxF bbehlM"
+                        class="sc-ac4a133f-4 haGXHZ"
                         id="react-tabs-9"
                         role="tabpanel"
                       />
                       <div
                         aria-labelledby="react-tabs-10"
-                        class="sc-ihgnxF bbehlM"
+                        class="sc-ac4a133f-4 haGXHZ"
                         id="react-tabs-11"
                         role="tabpanel"
                       />
                     </div>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Dispense de préavis
                     </h4>
@@ -713,7 +713,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     </p>
                     <ul>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -723,7 +723,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -737,21 +737,21 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       En dehors de ces deux cas, vous pouvez être dispensé d'effectuer votre préavis, de votre propre initiative ou à la demande de votre employeur, dans les conditions suivantes :
                     </p>
                     <div
-                      class="sc-brPLxw jqqklj"
+                      class="sc-ac4a133f-0 fvNPWb"
                       data-rttabs="true"
                     >
                       <div
-                        class="sc-iMWBiJ kmA-Drm"
+                        class="sc-ac4a133f-1 fxZtdi"
                       >
                         <ul
-                          class="sc-fvtFIe cHMgmW"
+                          class="sc-ac4a133f-2 fHCeXh"
                           role="tablist"
                         >
                           <li
                             aria-controls="react-tabs-13"
                             aria-disabled="false"
                             aria-selected="true"
-                            class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+                            class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
                             data-rttab="true"
                             id="react-tabs-12"
                             role="tab"
@@ -763,7 +763,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             aria-controls="react-tabs-15"
                             aria-disabled="false"
                             aria-selected="false"
-                            class="sc-bBeLUv hoMOVm"
+                            class="sc-ac4a133f-3 faZqNG"
                             data-rttab="true"
                             id="react-tabs-14"
                             role="tab"
@@ -774,34 +774,34 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       </div>
                       <div
                         aria-labelledby="react-tabs-12"
-                        class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+                        class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
                         id="react-tabs-13"
                         role="tabpanel"
                       >
                         <div
-                          class="sc-cWSHoV bKtA-De"
+                          class="sc-8dcb2faa-0 gxfPDw"
                         >
                           <h4
-                            class="sc-kAyceB dvmaTz"
+                            class="sc-b879fc2d-0 hyiHle"
                           >
                             Vous demandez une dispense de préavis
                           </h4>
                         </div>
                         <div
-                          class="sc-jMakVo gHeVja"
+                          class="sc-ac4a133f-5 yflIk"
                         >
                           <p>
                             Vous pouvez demander à votre employeur de vous dispenser d'effectuer votre préavis (par écrit ou par oral) :
                           </p>
                           <div
-                            class="sc-fMMURN gGkofM"
+                            class="sc-74e63776-0 gELTXP"
                             data-accordion-component="Accordion"
                           >
                             <div
                               id="accord-de-lemployeur"
                             >
                               <div
-                                class="sc-jXbUNg heDTFL"
+                                class="sc-1571bed7-0"
                                 data-accordion-component="AccordionItem"
                               >
                                 <div
@@ -812,7 +812,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                     aria-controls="accordion__panel-accord-de-lemployeur"
                                     aria-disabled="false"
                                     aria-expanded="false"
-                                    class="sc-kpDqfm heoudo"
+                                    class="sc-1571bed7-2 gNtlHI"
                                     data-accordion-component="AccordionItemButton"
                                     id="accordion__heading-accord-de-lemployeur"
                                     role="button"
@@ -820,7 +820,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                   >
                                     <svg
                                       aria-hidden="true"
-                                      class="sc-imWYAI gTeNha"
+                                      class="sc-93c68677-0 fWneNg"
                                       fill="none"
                                       height="24"
                                       stroke="currentColor"
@@ -836,10 +836,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                       />
                                     </svg>
                                     <div
-                                      class="sc-dAlyuH eyjExg"
+                                      class="sc-1571bed7-3 figaQV"
                                     >
                                       <h5
-                                        class="sc-kAyceB dvmaTz"
+                                        class="sc-b879fc2d-0 hyiHle"
                                         style="margin: 0px;"
                                       >
                                         Accord de l'employeur
@@ -849,13 +849,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                 </div>
                                 <div
                                   aria-hidden="true"
-                                  class="sc-dhKdcB hlTUsz"
+                                  class="sc-1571bed7-1 hamHiw"
                                   data-accordion-component="AccordionItemPanel"
                                   hidden=""
                                   id="accordion__panel-accord-de-lemployeur"
                                 >
                                   <div
-                                    class="sc-bXCLTC fcbJdD"
+                                    class="sc-32c7807-0 iMDCLs"
                                   >
                                     <p>
                                       
@@ -874,7 +874,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                               id="refus-de-lemployeur"
                             >
                               <div
-                                class="sc-jXbUNg crDDWD"
+                                class="sc-1571bed7-0 dpEeGj"
                                 data-accordion-component="AccordionItem"
                               >
                                 <div
@@ -885,7 +885,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                     aria-controls="accordion__panel-refus-de-lemployeur"
                                     aria-disabled="false"
                                     aria-expanded="false"
-                                    class="sc-kpDqfm heoudo"
+                                    class="sc-1571bed7-2 gNtlHI"
                                     data-accordion-component="AccordionItemButton"
                                     id="accordion__heading-refus-de-lemployeur"
                                     role="button"
@@ -893,7 +893,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                   >
                                     <svg
                                       aria-hidden="true"
-                                      class="sc-imWYAI gTeNha"
+                                      class="sc-93c68677-0 fWneNg"
                                       fill="none"
                                       height="24"
                                       stroke="currentColor"
@@ -909,10 +909,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                       />
                                     </svg>
                                     <div
-                                      class="sc-dAlyuH eyjExg"
+                                      class="sc-1571bed7-3 figaQV"
                                     >
                                       <h5
-                                        class="sc-kAyceB dvmaTz"
+                                        class="sc-b879fc2d-0 hyiHle"
                                         style="margin: 0px;"
                                       >
                                         Refus de l'employeur
@@ -922,13 +922,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                 </div>
                                 <div
                                   aria-hidden="true"
-                                  class="sc-dhKdcB hlTUsz"
+                                  class="sc-1571bed7-1 hamHiw"
                                   data-accordion-component="AccordionItemPanel"
                                   hidden=""
                                   id="accordion__panel-refus-de-lemployeur"
                                 >
                                   <div
-                                    class="sc-bXCLTC fcbJdD"
+                                    class="sc-32c7807-0 iMDCLs"
                                   >
                                     <p>
                                       Si votre employeur refuse, vous devez effectuer votre préavis, sous peine de devoir lui verser une indemnité d'un montant égal à la rémunération brute que vous auriez perçue si vous aviez travaillé.
@@ -942,13 +942,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       </div>
                       <div
                         aria-labelledby="react-tabs-14"
-                        class="sc-ihgnxF bbehlM"
+                        class="sc-ac4a133f-4 haGXHZ"
                         id="react-tabs-15"
                         role="tabpanel"
                       />
                     </div>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Report ou suspension du préavis
                     </h4>
@@ -957,14 +957,14 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     </p>
                     <ul>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Accord entre le salarié et l'employeur
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           
@@ -977,7 +977,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Arrêt de travail
@@ -987,7 +987,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Dispositions conventionnelles
@@ -998,7 +998,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       </li>
                     </ul>
                     <h4
-                      class="sc-kAyceB dvmaTz"
+                      class="sc-b879fc2d-0 hyiHle"
                     >
                       Absence pour recherche d'emploi
                     </h4>
@@ -1015,27 +1015,27 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       Toutefois, des dispositions conventionnelles ou, à défaut, un usage dans la localité ou la profession peuvent prévoir des temps d'absence pour rechercher un emploi pendant la durée du préavis.
                     </p>
                     <div
-                      class="sc-YysOf caiEQr"
+                      class="sc-b28d9feb-0 jhRKAI"
                     >
                       <strong
-                        class="sc-cVzyXs fqSKBP"
+                        class="sc-b28d9feb-1 FSydE"
                       >
                         Ou s'adresser ?
                       </strong>
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                       >
                         Agessa et Maison des artistes - Sécurité sociale
                       </h3>
                       <div
-                        class="sc-fMMURN gGkofM"
+                        class="sc-74e63776-0 gELTXP"
                         data-accordion-component="Accordion"
                       >
                         <div
                           id="par-telephone"
                         >
                           <div
-                            class="sc-jXbUNg heDTFL"
+                            class="sc-1571bed7-0"
                             data-accordion-component="AccordionItem"
                           >
                             <div
@@ -1046,7 +1046,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                 aria-controls="accordion__panel-par-telephone"
                                 aria-disabled="false"
                                 aria-expanded="false"
-                                class="sc-kpDqfm heoudo"
+                                class="sc-1571bed7-2 gNtlHI"
                                 data-accordion-component="AccordionItemButton"
                                 id="accordion__heading-par-telephone"
                                 role="button"
@@ -1054,7 +1054,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                               >
                                 <svg
                                   aria-hidden="true"
-                                  class="sc-imWYAI gTeNha"
+                                  class="sc-93c68677-0 fWneNg"
                                   fill="none"
                                   height="24"
                                   stroke="currentColor"
@@ -1070,10 +1070,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                   />
                                 </svg>
                                 <div
-                                  class="sc-dAlyuH eyjExg"
+                                  class="sc-1571bed7-3 figaQV"
                                 >
                                   <h4
-                                    class="sc-kAyceB dvmaTz"
+                                    class="sc-b879fc2d-0 hyiHle"
                                     style="margin: 0px;"
                                   >
                                     Par téléphone
@@ -1083,13 +1083,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             </div>
                             <div
                               aria-hidden="true"
-                              class="sc-dhKdcB hlTUsz"
+                              class="sc-1571bed7-1 hamHiw"
                               data-accordion-component="AccordionItemPanel"
                               hidden=""
                               id="accordion__panel-par-telephone"
                             >
                               <div
-                                class="sc-bXCLTC fcbJdD"
+                                class="sc-32c7807-0 iMDCLs"
                               >
                                 <p>
                                   Du lundi au vendredi : de 9h à 17h
@@ -1105,7 +1105,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                           id="par-messagerie"
                         >
                           <div
-                            class="sc-jXbUNg crDDWD"
+                            class="sc-1571bed7-0 dpEeGj"
                             data-accordion-component="AccordionItem"
                           >
                             <div
@@ -1116,7 +1116,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                 aria-controls="accordion__panel-par-messagerie"
                                 aria-disabled="false"
                                 aria-expanded="false"
-                                class="sc-kpDqfm heoudo"
+                                class="sc-1571bed7-2 gNtlHI"
                                 data-accordion-component="AccordionItemButton"
                                 id="accordion__heading-par-messagerie"
                                 role="button"
@@ -1124,7 +1124,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                               >
                                 <svg
                                   aria-hidden="true"
-                                  class="sc-imWYAI gTeNha"
+                                  class="sc-93c68677-0 fWneNg"
                                   fill="none"
                                   height="24"
                                   stroke="currentColor"
@@ -1140,10 +1140,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                   />
                                 </svg>
                                 <div
-                                  class="sc-dAlyuH eyjExg"
+                                  class="sc-1571bed7-3 figaQV"
                                 >
                                   <h4
-                                    class="sc-kAyceB dvmaTz"
+                                    class="sc-b879fc2d-0 hyiHle"
                                     style="margin: 0px;"
                                   >
                                     Par messagerie
@@ -1153,13 +1153,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             </div>
                             <div
                               aria-hidden="true"
-                              class="sc-dhKdcB hlTUsz"
+                              class="sc-1571bed7-1 hamHiw"
                               data-accordion-component="AccordionItemPanel"
                               hidden=""
                               id="accordion__panel-par-messagerie"
                             >
                               <div
-                                class="sc-bXCLTC fcbJdD"
+                                class="sc-32c7807-0 iMDCLs"
                               >
                                 <p>
                                   http://www.secu-artistes-auteurs.fr/contact
@@ -1172,7 +1172,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                           id="par-courrier"
                         >
                           <div
-                            class="sc-jXbUNg crDDWD"
+                            class="sc-1571bed7-0 dpEeGj"
                             data-accordion-component="AccordionItem"
                           >
                             <div
@@ -1183,7 +1183,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                 aria-controls="accordion__panel-par-courrier"
                                 aria-disabled="false"
                                 aria-expanded="false"
-                                class="sc-kpDqfm heoudo"
+                                class="sc-1571bed7-2 gNtlHI"
                                 data-accordion-component="AccordionItemButton"
                                 id="accordion__heading-par-courrier"
                                 role="button"
@@ -1191,7 +1191,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                               >
                                 <svg
                                   aria-hidden="true"
-                                  class="sc-imWYAI gTeNha"
+                                  class="sc-93c68677-0 fWneNg"
                                   fill="none"
                                   height="24"
                                   stroke="currentColor"
@@ -1207,10 +1207,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                                   />
                                 </svg>
                                 <div
-                                  class="sc-dAlyuH eyjExg"
+                                  class="sc-1571bed7-3 figaQV"
                                 >
                                   <h4
-                                    class="sc-kAyceB dvmaTz"
+                                    class="sc-b879fc2d-0 hyiHle"
                                     style="margin: 0px;"
                                   >
                                     Par courrier
@@ -1220,13 +1220,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                             </div>
                             <div
                               aria-hidden="true"
-                              class="sc-dhKdcB hlTUsz"
+                              class="sc-1571bed7-1 hamHiw"
                               data-accordion-component="AccordionItemPanel"
                               hidden=""
                               id="accordion__panel-par-courrier"
                             >
                               <div
-                                class="sc-bXCLTC fcbJdD"
+                                class="sc-32c7807-0 iMDCLs"
                               >
                                 <p>
                                   60 rue du Faubourg Poissonnière
@@ -1248,7 +1248,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="indemnisation"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -1259,7 +1259,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-indemnisation"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-indemnisation"
                     role="button"
@@ -1267,7 +1267,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -1283,10 +1283,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Indemnisation
@@ -1296,13 +1296,13 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-indemnisation"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       <strong>
@@ -1372,7 +1372,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
               id="documents-remis-au-salarie"
             >
               <div
-                class="sc-jXbUNg crDDWD"
+                class="sc-1571bed7-0 dpEeGj"
                 data-accordion-component="AccordionItem"
               >
                 <div
@@ -1383,7 +1383,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                     aria-controls="accordion__panel-documents-remis-au-salarie"
                     aria-disabled="false"
                     aria-expanded="false"
-                    class="sc-kpDqfm heoudo"
+                    class="sc-1571bed7-2 gNtlHI"
                     data-accordion-component="AccordionItemButton"
                     id="accordion__heading-documents-remis-au-salarie"
                     role="button"
@@ -1391,7 +1391,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
                   >
                     <svg
                       aria-hidden="true"
-                      class="sc-imWYAI gTeNha"
+                      class="sc-93c68677-0 fWneNg"
                       fill="none"
                       height="24"
                       stroke="currentColor"
@@ -1407,10 +1407,10 @@ exports[`<FicheServicePublic /> should render 1`] = `
                       />
                     </svg>
                     <div
-                      class="sc-dAlyuH eyjExg"
+                      class="sc-1571bed7-3 figaQV"
                     >
                       <h3
-                        class="sc-kAyceB dvmaTz"
+                        class="sc-b879fc2d-0 hyiHle"
                         style="margin: 0px;"
                       >
                         Documents remis au salarié
@@ -1420,41 +1420,41 @@ exports[`<FicheServicePublic /> should render 1`] = `
                 </div>
                 <div
                   aria-hidden="true"
-                  class="sc-dhKdcB hlTUsz"
+                  class="sc-1571bed7-1 hamHiw"
                   data-accordion-component="AccordionItemPanel"
                   hidden=""
                   id="accordion__panel-documents-remis-au-salarie"
                 >
                   <div
-                    class="sc-bXCLTC fcbJdD"
+                    class="sc-32c7807-0 iMDCLs"
                   >
                     <p>
                       L'employeur doit remettre au salarié les documents suivants :
                     </p>
                     <ul>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Certificat de travail
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Attestation Pôle emploi
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           Solde de tout compte
                         </p>
                       </li>
                       <li
-                        class="sc-ktPPKK jtA-dSF"
+                        class="sc-5f052859-0 cWQbML"
                       >
                         <p>
                           En cas de dispositifs de participation, d'intéressement et des plans d'épargne salariale au sein de l'entreprise, état récapitulatif de l'ensemble des sommes et valeurs mobilières épargnées
@@ -1470,34 +1470,34 @@ exports[`<FicheServicePublic /> should render 1`] = `
       </div>
       <div
         aria-labelledby="react-tabs-2"
-        class="sc-ihgnxF bbehlM"
+        class="sc-ac4a133f-4 haGXHZ"
         id="react-tabs-3"
         role="tabpanel"
       />
       <div
         aria-labelledby="react-tabs-4"
-        class="sc-ihgnxF bbehlM"
+        class="sc-ac4a133f-4 haGXHZ"
         id="react-tabs-5"
         role="tabpanel"
       />
     </div>
     <div
       aria-label="Modèle de document Lettre de démission du salarié (nouvelle fenêtre)"
-      class="sc-ibQAlb fuLYQY sc-ePDLzJ eidZVY no-after"
+      class="sc-d47d8018-0 cDsGtD sc-54b316ce-0 kCUWSF no-after"
     >
       <div
-        class="sc-guJBdh jBpgpS"
+        class="sc-d47d8018-2 eBZhiP"
       >
         <div
-          class="sc-hZDyAQ tqlOz"
+          class="sc-d47d8018-3 cAXyng"
         >
           <p
-            class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+            class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
           >
             Modèle de document
           </p>
           <p
-            class="sc-ktJbId fhphst"
+            class="sc-d47d8018-5 jNRMjT"
           >
             <a
               href="https://www.service-public.fr/simulateur/calcul/Demission"
@@ -1510,7 +1510,7 @@ exports[`<FicheServicePublic /> should render 1`] = `
         </div>
       </div>
       <div
-        class="sc-gmgFlS ikhbYa"
+        class="sc-d47d8018-6 ipSAXR"
       >
         Source: 
         Direction de l'information légale et administrative (Premier ministre)
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/ElementBuilder.test.js b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/ElementBuilder.test.js
index c514dac762..d36fd6b6a8 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/ElementBuilder.test.js
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/ElementBuilder.test.js
@@ -75,22 +75,22 @@ const tests = [
       expect(container).toMatchInlineSnapshot(`
         <div>
           <div
-            class="sc-iGgWBj sc-eBHhsj cWzIZL gRKOwf"
+            class="sc-2a0a4b0a-0 sc-18dbc613-0 dLOZmV hGgpvs"
           >
             stuff 0
           </div>
           <div
-            class="sc-iGgWBj sc-eBHhsj cWzIZL gRKOwf"
+            class="sc-2a0a4b0a-0 sc-18dbc613-0 dLOZmV hGgpvs"
           >
             stuff 1
           </div>
           <div
-            class="sc-iGgWBj sc-eBHhsj cWzIZL gRKOwf"
+            class="sc-2a0a4b0a-0 sc-18dbc613-0 dLOZmV hGgpvs"
           >
             stuff 2
           </div>
           <div
-            class="sc-iGgWBj sc-eBHhsj cWzIZL gRKOwf"
+            class="sc-2a0a4b0a-0 sc-18dbc613-0 dLOZmV hGgpvs"
           >
             stuff 3
           </div>
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Accordion.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Accordion.test.js.snap
index 8c3e82f32c..c0d280e94a 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Accordion.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Accordion.test.js.snap
@@ -3,13 +3,13 @@
 exports[`<Accordion /> should have two different levels of headings 1`] = `
 <div>
   <div
-    class="sc-kzqdkY kUMpKA"
+    class="sc-e32628d4-0 eFvDQP"
   >
     <h2
-      class="sc-dSIIpw crsCQS"
+      class="sc-d6e72754-0 egzXkL"
     >
       <span
-        class="sc-gsFSXq ljkohw"
+        class="sc-a4d7a179-0 gGBEJx"
       />
       titre 0
     </h2>
@@ -18,14 +18,14 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
     paragraphe 0
   </p>
   <div
-    class="sc-iXzfSG GeWyC"
+    class="sc-74e63776-0 gELTXP"
     data-accordion-component="Accordion"
   >
     <div
       id="titre-1"
     >
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -36,7 +36,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
             aria-controls="accordion__panel-titre-1"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-1"
             role="button"
@@ -44,7 +44,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -60,10 +60,10 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h2
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 1
@@ -73,13 +73,13 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-1"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 1-1
@@ -95,7 +95,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
       id="titre-2"
     >
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -106,7 +106,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
             aria-controls="accordion__panel-titre-2"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-2"
             role="button"
@@ -114,7 +114,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -130,10 +130,10 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h2
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 2
@@ -143,13 +143,13 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-2"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 2-1
@@ -158,7 +158,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
               paragraphe 2-2
             </p>
             <h3
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               titre 2-1
             </h3>
@@ -170,7 +170,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
       id="titre-3"
     >
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -181,7 +181,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
             aria-controls="accordion__panel-titre-3"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-3"
             role="button"
@@ -189,7 +189,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -205,10 +205,10 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h2
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 3
@@ -218,13 +218,13 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-3"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 3-1
@@ -243,7 +243,7 @@ exports[`<Accordion /> should have two different levels of headings 1`] = `
 exports[`<Accordion /> should render all, siblings included 1`] = `
 <div>
   <h5
-    class="sc-kAyceB dvmaTz"
+    class="sc-b879fc2d-0 hyiHle"
   >
     titre 0
   </h5>
@@ -251,14 +251,14 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
     paragraphe 0
   </p>
   <div
-    class="sc-iXzfSG GeWyC"
+    class="sc-74e63776-0 gELTXP"
     data-accordion-component="Accordion"
   >
     <div
       id="titre-1"
     >
       <div
-        class="sc-jXbUNg heDTFL"
+        class="sc-1571bed7-0"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -269,7 +269,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
             aria-controls="accordion__panel-titre-1"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-1"
             role="button"
@@ -277,7 +277,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -293,10 +293,10 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h5
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 1
@@ -306,13 +306,13 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-1"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 1-1
@@ -328,7 +328,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
       id="titre-2"
     >
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -339,7 +339,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
             aria-controls="accordion__panel-titre-2"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-2"
             role="button"
@@ -347,7 +347,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -363,10 +363,10 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h5
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 2
@@ -376,13 +376,13 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-2"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 2-1
@@ -391,7 +391,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
               paragraphe 2-2
             </p>
             <h6
-              class="sc-kAyceB dvmaTz"
+              class="sc-b879fc2d-0 hyiHle"
             >
               titre 2-1
             </h6>
@@ -403,7 +403,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
       id="titre-3"
     >
       <div
-        class="sc-jXbUNg crDDWD"
+        class="sc-1571bed7-0 dpEeGj"
         data-accordion-component="AccordionItem"
       >
         <div
@@ -414,7 +414,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
             aria-controls="accordion__panel-titre-3"
             aria-disabled="false"
             aria-expanded="false"
-            class="sc-kpDqfm heoudo"
+            class="sc-1571bed7-2 gNtlHI"
             data-accordion-component="AccordionItemButton"
             id="accordion__heading-titre-3"
             role="button"
@@ -422,7 +422,7 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
           >
             <svg
               aria-hidden="true"
-              class="sc-imWYAI gTeNha"
+              class="sc-93c68677-0 fWneNg"
               fill="none"
               height="24"
               stroke="currentColor"
@@ -438,10 +438,10 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
               />
             </svg>
             <div
-              class="sc-dAlyuH eyjExg"
+              class="sc-1571bed7-3 figaQV"
             >
               <h5
-                class="sc-kAyceB dvmaTz"
+                class="sc-b879fc2d-0 hyiHle"
                 style="margin: 0px;"
               >
                 titre 3
@@ -451,13 +451,13 @@ exports[`<Accordion /> should render all, siblings included 1`] = `
         </div>
         <div
           aria-hidden="true"
-          class="sc-dhKdcB hlTUsz"
+          class="sc-1571bed7-1 hamHiw"
           data-accordion-component="AccordionItemPanel"
           hidden=""
           id="accordion__panel-titre-3"
         >
           <div
-            class="sc-bXCLTC fcbJdD"
+            class="sc-32c7807-0 iMDCLs"
           >
             <p>
               paragraphe 3-1
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/FragmentConditionne.test.tsx.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/FragmentConditionne.test.tsx.snap
index 3a174138ed..471bde75f2 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/FragmentConditionne.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/FragmentConditionne.test.tsx.snap
@@ -3,13 +3,13 @@
 exports[`FragmentConditionne Should display element within 1`] = `
 <div>
   <div
-    class="sc-kzqdkY kUMpKA"
+    class="sc-e32628d4-0 eFvDQP"
   >
     <h2
-      class="sc-dSIIpw crsCQS"
+      class="sc-d6e72754-0 egzXkL"
     >
       <span
-        class="sc-gsFSXq ljkohw"
+        class="sc-a4d7a179-0 gGBEJx"
       />
       Comment le saisir le médiateur de l'apprentissage ?
     </h2>
@@ -18,21 +18,21 @@ exports[`FragmentConditionne Should display element within 1`] = `
     Le médiateur de l'apprentissage à saisir dépend de l'activité de l'entreprise. Il est désigné par la chambre consulaire.
   </p>
   <div
-    class="sc-brPLxw jqqklj"
+    class="sc-ac4a133f-0 fvNPWb"
     data-rttabs="true"
   >
     <div
-      class="sc-iMWBiJ kmA-Drm"
+      class="sc-ac4a133f-1 fxZtdi"
     >
       <ul
-        class="sc-fvtFIe cHMgmW"
+        class="sc-ac4a133f-2 fHCeXh"
         role="tablist"
       >
         <li
           aria-controls="react-tabs-1"
           aria-disabled="false"
           aria-selected="true"
-          class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+          class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
           data-rttab="true"
           id="react-tabs-0"
           role="tab"
@@ -44,7 +44,7 @@ exports[`FragmentConditionne Should display element within 1`] = `
           aria-controls="react-tabs-3"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-2"
           role="tab"
@@ -55,7 +55,7 @@ exports[`FragmentConditionne Should display element within 1`] = `
           aria-controls="react-tabs-5"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-4"
           role="tab"
@@ -66,7 +66,7 @@ exports[`FragmentConditionne Should display element within 1`] = `
           aria-controls="react-tabs-7"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-6"
           role="tab"
@@ -77,30 +77,30 @@ exports[`FragmentConditionne Should display element within 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-0"
-      class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+      class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
       id="react-tabs-1"
       role="tabpanel"
     >
       <div
-        class="sc-cWSHoV bKtA-De"
+        class="sc-8dcb2faa-0 gxfPDw"
       >
         <h2
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           Commerce - industrie
         </h2>
       </div>
       <div
-        class="sc-jMakVo gHeVja"
+        class="sc-ac4a133f-5 yflIk"
       >
         <p>
           Il faut saisir la chambre de commerce et d'industrie.
         </p>
         <div
-          class="sc-YysOf caiEQr"
+          class="sc-b28d9feb-0 jhRKAI"
         >
           <strong
-            class="sc-cVzyXs fqSKBP"
+            class="sc-b28d9feb-1 FSydE"
           >
             Ou s'adresser ?
           </strong>
@@ -117,19 +117,19 @@ exports[`FragmentConditionne Should display element within 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-2"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-3"
       role="tabpanel"
     />
     <div
       aria-labelledby="react-tabs-4"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-5"
       role="tabpanel"
     />
     <div
       aria-labelledby="react-tabs-6"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-7"
       role="tabpanel"
     />
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Image.test.tsx.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Image.test.tsx.snap
index cf1deff30a..55049314bd 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Image.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Image.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`Image should display image and caption 1`] = `
 <div>
   <figure
     aria-label="Comment calculer un délai quand il y a un jour férié ?"
-    class="sc-bVVIoq kewZOe"
+    class="sc-6c336c92-0 fZSumh"
     role="group"
   >
     <img
@@ -12,7 +12,7 @@ exports[`Image should display image and caption 1`] = `
       src="https://www.service-public.fr/webapp/images/vdd/extralarge/I4596.jpg"
     />
     <figcaption
-      class="sc-dPZUQH cnPGFO"
+      class="sc-6c336c92-1 gbntbh"
     >
       <span>
         Crédits : 
@@ -21,7 +21,7 @@ exports[`Image should display image and caption 1`] = `
     </figcaption>
   </figure>
   <div
-    class="sc-fxwrCY gwaFzF"
+    class="sc-9845d97e-0 jdstGa"
     data-accordion-component="Accordion"
   >
     <div
@@ -36,7 +36,7 @@ exports[`Image should display image and caption 1`] = `
           aria-controls="accordion__panel-raa-0"
           aria-disabled="false"
           aria-expanded="false"
-          class="sc-hIUJlX fucbFP"
+          class="sc-9845d97e-1 jffOUe"
           data-accordion-component="AccordionItemButton"
           id="accordion__heading-raa-0"
           role="button"
@@ -44,7 +44,7 @@ exports[`Image should display image and caption 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="sc-jnOGJG edPXtC"
+            class="sc-9845d97e-2 kPPRyj"
             fill="none"
             viewBox="0 0 16 16"
             xmlns="http://www.w3.org/2000/svg"
@@ -57,23 +57,23 @@ exports[`Image should display image and caption 1`] = `
             />
           </svg>
           <div
-            class="sc-dZoequ bcPqgL"
+            class="sc-9845d97e-3 biBldq"
           >
             Voir en détail
           </div>
         </div>
       </div>
       <div
-        class="sc-ggpjZQ bUcNVB"
+        class="sc-9845d97e-5 mALye"
         data-accordion-component="AccordionItemPanel"
         hidden=""
         id="accordion__panel-raa-0"
       >
         <div
-          class="sc-eZkCL HkMzx"
+          class="sc-9845d97e-4 dcRMRW"
         >
           <div
-            class="sc-iGgWBj cWzIZL"
+            class="sc-2a0a4b0a-0 dLOZmV"
           >
             <p>
               Comment calculer un délai quand il y a un jour férié ?
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/List.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/List.test.js.snap
index 07589d8a2e..da5cc77421 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/List.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/List.test.js.snap
@@ -4,16 +4,16 @@ exports[`<List /> should render and increment heading level of children by one 1
 <div>
   <ul>
     <li
-      class="sc-iXzfSG QhErf"
+      class="sc-5f052859-0 cWQbML"
     >
       <h3
-        class="sc-kAyceB dvmaTz"
+        class="sc-b879fc2d-0 hyiHle"
       >
         title
       </h3>
     </li>
     <li
-      class="sc-iXzfSG QhErf"
+      class="sc-5f052859-0 cWQbML"
     >
       <p>
         ok
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/OuSAdresser.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/OuSAdresser.test.js.snap
index ab53a5062b..e21ec386fc 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/OuSAdresser.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/OuSAdresser.test.js.snap
@@ -3,10 +3,10 @@
 exports[`<OuSAdresser /> should render a ressource web component 1`] = `
 <div>
   <div
-    class="sc-eBHhsj kkmErP"
+    class="sc-b28d9feb-0 jhRKAI"
   >
     <strong
-      class="sc-iXzfSG Mcffn"
+      class="sc-b28d9feb-1 FSydE"
     >
       Ou s'adresser ?
     </strong>
@@ -25,15 +25,15 @@ exports[`<OuSAdresser /> should render a ressource web component 1`] = `
 exports[`<OuSAdresser /> should render a simple case 1`] = `
 <div>
   <div
-    class="sc-eBHhsj kkmErP"
+    class="sc-b28d9feb-0 jhRKAI"
   >
     <strong
-      class="sc-iXzfSG Mcffn"
+      class="sc-b28d9feb-1 FSydE"
     >
       Ou s'adresser ?
     </strong>
     <h2
-      class="sc-kAyceB dvmaTz"
+      class="sc-b879fc2d-0 hyiHle"
     >
       Nom du centre
     </h2>
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/ServiceEnLigne.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/ServiceEnLigne.test.js.snap
index f601df0c82..d5b86e0c3b 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/ServiceEnLigne.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/ServiceEnLigne.test.js.snap
@@ -4,21 +4,21 @@ exports[`<ServiceEnLigne /> should render 1`] = `
 <div>
   <div
     aria-label="Se retrouve dans en entête Texte qui se retrouve dans le lien (nouvelle fenêtre)"
-    class="sc-ibQAlb fuLYQY sc-fMMURN gmeVji no-after"
+    class="sc-d47d8018-0 cDsGtD sc-54b316ce-0 kCUWSF no-after"
   >
     <div
-      class="sc-guJBdh jBpgpS"
+      class="sc-d47d8018-2 eBZhiP"
     >
       <div
-        class="sc-hZDyAQ tqlOz"
+        class="sc-d47d8018-3 cAXyng"
       >
         <p
-          class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+          class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
         >
           Se retrouve dans en entête
         </p>
         <p
-          class="sc-ktJbId fhphst"
+          class="sc-d47d8018-5 jNRMjT"
         >
           <a
             href="url à retoruver dans le lien"
@@ -31,7 +31,7 @@ exports[`<ServiceEnLigne /> should render 1`] = `
       </div>
     </div>
     <div
-      class="sc-gmgFlS ikhbYa"
+      class="sc-d47d8018-6 ipSAXR"
     >
       Source: 
       Source qui se retrouve sous le lien
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Table.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Table.test.js.snap
index 9ee7f98fc5..e2fdca596e 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Table.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Table.test.js.snap
@@ -3,7 +3,7 @@
 exports[`<Table /> should render with th, td, colspan etc. 1`] = `
 <div>
   <table
-    class="sc-cmaqmh juENof"
+    class="sc-4e3ba411-0 kKVapO"
   >
     <caption>
       Conditions ouvrant droit à la retraite anticipée pour carrière longue
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Tabulator.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Tabulator.test.js.snap
index f3a58e7762..35d642d4d1 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Tabulator.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Tabulator.test.js.snap
@@ -3,21 +3,21 @@
 exports[`<Tabulator /> should have two different levels of headings 1`] = `
 <div>
   <div
-    class="sc-brPLxw jqqklj"
+    class="sc-ac4a133f-0 fvNPWb"
     data-rttabs="true"
   >
     <div
-      class="sc-iMWBiJ kmA-Drm"
+      class="sc-ac4a133f-1 fxZtdi"
     >
       <ul
-        class="sc-fvtFIe cHMgmW"
+        class="sc-ac4a133f-2 fHCeXh"
         role="tablist"
       >
         <li
           aria-controls="react-tabs-1"
           aria-disabled="false"
           aria-selected="true"
-          class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+          class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
           data-rttab="true"
           id="react-tabs-0"
           role="tab"
@@ -29,7 +29,7 @@ exports[`<Tabulator /> should have two different levels of headings 1`] = `
           aria-controls="react-tabs-3"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-2"
           role="tab"
@@ -40,24 +40,24 @@ exports[`<Tabulator /> should have two different levels of headings 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-0"
-      class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+      class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
       id="react-tabs-1"
       role="tabpanel"
     >
       <div
-        class="sc-cWSHoV bKtA-De"
+        class="sc-8dcb2faa-0 gxfPDw"
       >
         <h2
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           CDI
         </h2>
       </div>
       <div
-        class="sc-jMakVo gHeVja"
+        class="sc-ac4a133f-5 yflIk"
       >
         <h3
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           titre 1
         </h3>
@@ -68,7 +68,7 @@ exports[`<Tabulator /> should have two different levels of headings 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-2"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-3"
       role="tabpanel"
     />
@@ -79,21 +79,21 @@ exports[`<Tabulator /> should have two different levels of headings 1`] = `
 exports[`<Tabulator /> should incease heading levels if not 0 1`] = `
 <div>
   <div
-    class="sc-brPLxw jqqklj"
+    class="sc-ac4a133f-0 fvNPWb"
     data-rttabs="true"
   >
     <div
-      class="sc-iMWBiJ kmA-Drm"
+      class="sc-ac4a133f-1 fxZtdi"
     >
       <ul
-        class="sc-fvtFIe cHMgmW"
+        class="sc-ac4a133f-2 fHCeXh"
         role="tablist"
       >
         <li
           aria-controls="react-tabs-5"
           aria-disabled="false"
           aria-selected="true"
-          class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+          class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
           data-rttab="true"
           id="react-tabs-4"
           role="tab"
@@ -105,7 +105,7 @@ exports[`<Tabulator /> should incease heading levels if not 0 1`] = `
           aria-controls="react-tabs-7"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-6"
           role="tab"
@@ -116,24 +116,24 @@ exports[`<Tabulator /> should incease heading levels if not 0 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-4"
-      class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+      class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
       id="react-tabs-5"
       role="tabpanel"
     >
       <div
-        class="sc-cWSHoV bKtA-De"
+        class="sc-8dcb2faa-0 gxfPDw"
       >
         <h3
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           CDI
         </h3>
       </div>
       <div
-        class="sc-jMakVo gHeVja"
+        class="sc-ac4a133f-5 yflIk"
       >
         <h4
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           titre 1
         </h4>
@@ -144,7 +144,7 @@ exports[`<Tabulator /> should incease heading levels if not 0 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-6"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-7"
       role="tabpanel"
     />
@@ -155,21 +155,21 @@ exports[`<Tabulator /> should incease heading levels if not 0 1`] = `
 exports[`<Tabulator /> should render 1`] = `
 <div>
   <div
-    class="sc-brPLxw jqqklj"
+    class="sc-ac4a133f-0 fvNPWb"
     data-rttabs="true"
   >
     <div
-      class="sc-iMWBiJ kmA-Drm"
+      class="sc-ac4a133f-1 fxZtdi"
     >
       <ul
-        class="sc-fvtFIe cHMgmW"
+        class="sc-ac4a133f-2 fHCeXh"
         role="tablist"
       >
         <li
           aria-controls="react-tabs-9"
           aria-disabled="false"
           aria-selected="true"
-          class="sc-bBeLUv hoMOVm react-tabs__tab--selected"
+          class="sc-ac4a133f-3 faZqNG react-tabs__tab--selected"
           data-rttab="true"
           id="react-tabs-8"
           role="tab"
@@ -181,7 +181,7 @@ exports[`<Tabulator /> should render 1`] = `
           aria-controls="react-tabs-11"
           aria-disabled="false"
           aria-selected="false"
-          class="sc-bBeLUv hoMOVm"
+          class="sc-ac4a133f-3 faZqNG"
           data-rttab="true"
           id="react-tabs-10"
           role="tab"
@@ -192,24 +192,24 @@ exports[`<Tabulator /> should render 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-8"
-      class="sc-ihgnxF bbehlM react-tabs__tab-panel--selected"
+      class="sc-ac4a133f-4 haGXHZ react-tabs__tab-panel--selected"
       id="react-tabs-9"
       role="tabpanel"
     >
       <div
-        class="sc-cWSHoV bKtA-De"
+        class="sc-8dcb2faa-0 gxfPDw"
       >
         <h4
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           CDI
         </h4>
       </div>
       <div
-        class="sc-jMakVo gHeVja"
+        class="sc-ac4a133f-5 yflIk"
       >
         <h5
-          class="sc-kAyceB dvmaTz"
+          class="sc-b879fc2d-0 hyiHle"
         >
           titre 1
         </h5>
@@ -220,7 +220,7 @@ exports[`<Tabulator /> should render 1`] = `
     </div>
     <div
       aria-labelledby="react-tabs-10"
-      class="sc-ihgnxF bbehlM"
+      class="sc-ac4a133f-4 haGXHZ"
       id="react-tabs-11"
       role="tabpanel"
     />
diff --git a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Title.test.js.snap b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Title.test.js.snap
index a9041a6753..fa0c689d9b 100644
--- a/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Title.test.js.snap
+++ b/packages/code-du-travail-frontend/src/fiche-service-public/components/__tests__/__snapshots__/Title.test.js.snap
@@ -3,7 +3,7 @@
 exports[`<Title /> heading should default to H6 1`] = `
 <div>
   <h6
-    class="sc-kAyceB dvmaTz"
+    class="sc-b879fc2d-0 hyiHle"
   />
 </div>
 `;
@@ -11,7 +11,7 @@ exports[`<Title /> heading should default to H6 1`] = `
 exports[`<Title /> should render a H{x} whose {x} is headingLevel + 2 1`] = `
 <div>
   <h4
-    class="sc-kAyceB dvmaTz"
+    class="sc-b879fc2d-0 hyiHle"
   />
 </div>
 `;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/BrandTop.test.tsx b/packages/code-du-travail-frontend/src/modules/layout/__tests__/BrandTop.test.tsx
new file mode 100644
index 0000000000..e4a462cd01
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/BrandTop.test.tsx
@@ -0,0 +1,10 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { BrandTop } from "../BrandTop";
+
+describe("<BrandTop />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(<BrandTop />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/Footer.test.tsx b/packages/code-du-travail-frontend/src/modules/layout/__tests__/Footer.test.tsx
new file mode 100644
index 0000000000..44851889ee
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/Footer.test.tsx
@@ -0,0 +1,10 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { Footer } from "../Footer";
+
+describe("<Footer />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(<Footer />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/NeedMoreInfo.test.tsx b/packages/code-du-travail-frontend/src/modules/layout/__tests__/NeedMoreInfo.test.tsx
new file mode 100644
index 0000000000..826279dbca
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/NeedMoreInfo.test.tsx
@@ -0,0 +1,10 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { NeedMoreInfo } from "../NeedMoreInfo";
+
+describe("<NeedMoreInfo />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(<NeedMoreInfo />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/BrandTop.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/BrandTop.test.tsx.snap
new file mode 100644
index 0000000000..bc8c695222
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/BrandTop.test.tsx.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<BrandTop /> should match snapshot 1`] = `
+<div>
+  RÉPUBLIQUE
+  <br />
+  FRANÇAISE
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/Footer.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/Footer.test.tsx.snap
new file mode 100644
index 0000000000..942829b484
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/Footer.test.tsx.snap
@@ -0,0 +1,448 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Footer /> should match snapshot 1`] = `
+<div>
+  <footer
+    class="fr-footer"
+    id="fr-footer"
+    role="contentinfo"
+  >
+    <div
+      class="fr-footer__top"
+    >
+      <div
+        class="fr-container"
+      >
+        <div
+          class="fr-grid-row fr-grid-row--gutters"
+        >
+          <div
+            class="fr-col-12 fr-col-sm-3 fr-col-md-2"
+          >
+            <h3
+              class="fr-footer__top-cat"
+            >
+              Code du travail numérique
+            </h3>
+            <ul
+              class="fr-footer__top-list"
+            >
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/droit-du-travail"
+                >
+                  Le droit du travail
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/glossaire"
+                >
+                  Glossaire
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/a-propos"
+                >
+                  À propos
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/stats"
+                >
+                  Statistiques d’utilisation
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/integration"
+                >
+                  Intégrer les outils du Code du travail numérique
+                </a>
+              </li>
+            </ul>
+          </div>
+          <div
+            class="fr-col-12 fr-col-sm-3 fr-col-md-2"
+          >
+            <h3
+              class="fr-footer__top-cat"
+            >
+              Outils populaires
+            </h3>
+            <ul
+              class="fr-footer__top-list"
+            >
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/outils/simulateur-embauche"
+                >
+                  Calcul du salaire brut/net
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/outils/indemnite-rupture-conventionnelle"
+                >
+                  Calcul de l'indemnité de rupture conventionnelle
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/outils/convention-collective"
+                >
+                  Trouver sa convention collective
+                </a>
+              </li>
+            </ul>
+          </div>
+          <div
+            class="fr-col-12 fr-col-sm-3 fr-col-md-2"
+          >
+            <h3
+              class="fr-footer__top-cat"
+            >
+              Modèles populaires
+            </h3>
+            <ul
+              class="fr-footer__top-list"
+            >
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/modeles-de-courriers/lettre-de-demission"
+                >
+                  Lettre de démission
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/modeles-de-courriers/rupture-du-contrat-en-periode-dessai-par-le-salarie"
+                >
+                  Rupture du contrat en période d'essai par le salarié
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/modeles-de-courriers/convocation-a-un-entretien-prealable-au-licenciement-pour-motif-personnel"
+                >
+                  Convocation à un entretien préalable au licenciement pour motif personnel
+                </a>
+              </li>
+            </ul>
+          </div>
+          <div
+            class="fr-col-12 fr-col-sm-3 fr-col-md-2"
+          >
+            <h3
+              class="fr-footer__top-cat"
+            >
+              Fiches pratiques populaires
+            </h3>
+            <ul
+              class="fr-footer__top-list"
+            >
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/contribution/quelle-est-la-duree-du-preavis-en-cas-de-demission"
+                >
+                  Durée du préavis de démission
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/contribution/les-conges-pour-evenements-familiaux"
+                >
+                  Congés pour événements familiaux
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/contribution/en-cas-darret-maladie-du-salarie-lemployeur-doit-il-assurer-le-maintien-de-salaire"
+                >
+                  Maintien du salaire en cas d'arrêt maladie
+                </a>
+              </li>
+            </ul>
+          </div>
+          <div
+            class="fr-col-12 fr-col-sm-3 fr-col-md-2"
+          >
+            <h3
+              class="fr-footer__top-cat"
+            >
+              Conventions collectives populaires
+            </h3>
+            <ul
+              class="fr-footer__top-list"
+            >
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/convention-collective/1090-services-de-lautomobile-commerce-et-reparation-de-lautomobile-du-cycle"
+                >
+                  Services de l'automobile
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/convention-collective/3248-metallurgie"
+                >
+                  Métallurgie
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__top-link"
+                  href="/convention-collective/573-commerces-de-gros"
+                >
+                  Commerce de gros
+                </a>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="fr-container"
+    >
+      <div
+        class="fr-footer__body"
+      >
+        <div
+          class="fr-footer__brand fr-enlarge-link"
+        >
+          <a
+            href="/"
+            title="Accueil - Code du travail numérique, Ministère du Travail"
+          >
+            <p
+              class="fr-logo bx-sh_none!"
+            >
+              RÉPUBLIQUE
+              <br />
+              FRANÇAISE
+            </p>
+          </a>
+        </div>
+        <div
+          class="fr-footer__content"
+        >
+          <ul
+            class="fr-footer__content-list"
+          >
+            <li
+              class="fr-footer__content-item"
+            >
+              <a
+                class="fr-footer__content-link"
+                href="https://travail-emploi.gouv.fr"
+                target="_blank"
+                title="travail-emploi.gouv.fr - ouvre une nouvelle fenêtre"
+              >
+                travail-emploi.gouv.fr
+              </a>
+            </li>
+            <li
+              class="fr-footer__content-item"
+            >
+              <a
+                class="fr-footer__content-link"
+                href="https://info.gouv.fr"
+                target="_blank"
+                title="info.gouv.fr - ouvre une nouvelle fenêtre"
+              >
+                info.gouv.fr
+              </a>
+            </li>
+            <li
+              class="fr-footer__content-item"
+            >
+              <a
+                class="fr-footer__content-link"
+                href="https://service-public.fr"
+                target="_blank"
+                title="service-public.fr - ouvre une nouvelle fenêtre"
+              >
+                service-public.fr
+              </a>
+            </li>
+            <li
+              class="fr-footer__content-item"
+            >
+              <a
+                class="fr-footer__content-link"
+                href="https://legifrance.gouv.fr"
+                target="_blank"
+                title="legifrance.gouv.fr - ouvre une nouvelle fenêtre"
+              >
+                legifrance.gouv.fr
+              </a>
+            </li>
+            <li
+              class="fr-footer__content-item"
+            >
+              <a
+                class="fr-footer__content-link"
+                href="https://data.gouv.fr"
+                target="_blank"
+                title="data.gouv.fr - ouvre une nouvelle fenêtre"
+              >
+                data.gouv.fr
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+      <div
+        class="fr-footer__partners"
+      >
+        <h4
+          class="fr-footer__partners-title"
+        >
+          Nos partenaires
+        </h4>
+        <div
+          class="fr-footer__partners-logos"
+        >
+          <div
+            class="fr-footer__partners-sub"
+          >
+            <ul>
+              <li>
+                <a
+                  class="fr-footer__partners-link fr-raw-link"
+                  href="https://www.service-public.fr/"
+                >
+                  <img
+                    alt="service-public.fr, le site officiel de l'administration française"
+                    class="fr-footer__logo bx-sh_none!"
+                    src="/static/assets/img/logo_sp_hd_rvb.png"
+                    style="height: 5.625rem;"
+                  />
+                </a>
+              </li>
+              <li>
+                <a
+                  class="fr-footer__partners-link fr-raw-link"
+                  href="https://www.legifrance.gouv.fr/"
+                >
+                  <img
+                    alt="legifrance.gouv.fr - le service public de la diffusion du droit"
+                    class="fr-footer__logo bx-sh_none!"
+                    src="/static/assets/img/legifrance.svg"
+                    style="height: 5.625rem;"
+                  />
+                </a>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+      <div
+        class="fr-footer__bottom"
+      >
+        <ul
+          class="fr-footer__bottom-list"
+        >
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <span
+              class="fr-footer__bottom-link"
+            >
+              Accessibilité : partiellement conforme
+            </span>
+          </li>
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <a
+              class="fr-footer__bottom-link"
+              href="/mentions-legales"
+            >
+              Mentions légales
+            </a>
+          </li>
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <a
+              class="fr-footer__bottom-link"
+              href="/politique-confidentialite"
+            >
+              Politique de confidentialité
+            </a>
+          </li>
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <a
+              class="fr-footer__bottom-link"
+              href="https://github.com/SocialGouv/code-du-travail-numerique/tree/vvX.Y.Z"
+              rel="noopener noreferrer"
+              target="_blank"
+            >
+              Contribuer sur Github
+            </a>
+          </li>
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <a
+              class="fr-footer__bottom-link"
+              href="/plan-du-site"
+            >
+              Plan du site
+            </a>
+          </li>
+          <li
+            class="fr-footer__bottom-item"
+          >
+            <button
+              aria-controls="fr-theme-modal"
+              class="fr-footer__bottom-link fr-icon-theme-fill fr-link--icon-left"
+              data-fr-opened="false"
+              id="fr-theme-modal-control-button"
+            >
+              Paramètres d'affichage
+            </button>
+          </li>
+        </ul>
+        <div
+          class="fr-footer__bottom-copy"
+        >
+          <p>
+            Sauf mention explicite de propriété intellectuelle détenue par des tiers, les contenus de ce site sont proposés sous
+             
+            <a
+              href="https://github.com/etalab/licence-ouverte/blob/master/LO.md"
+              target="_blank"
+              title="licence etalab-2.0 - ouvre une nouvelle fenêtre"
+            >
+              licence etalab-2.0
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  </footer>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/NeedMoreInfo.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/NeedMoreInfo.test.tsx.snap
new file mode 100644
index 0000000000..3a75e7838e
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/__tests__/__snapshots__/NeedMoreInfo.test.tsx.snap
@@ -0,0 +1,42 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<NeedMoreInfo /> should match snapshot 1`] = `
+<div>
+  <div
+    class="bg_var(--background-alt-blue-france)"
+  >
+    <div
+      class="fr-container"
+    >
+      <div
+        class="fr-grid-row fr-grid-row--center"
+      >
+        <div
+          class="fr-col-md-6 fr-py-6w"
+        >
+          <h2
+            class="c_var(--text-action-high-blue-france)! ta_center"
+          >
+            Besoin de plus d'informations ?
+          </h2>
+          <p
+            class="c_var(--text-action-high-blue-france)"
+          >
+            Les services du ministère du Travail en région informent, conseillent et orientent les salariés et les employeurs du secteur privé sur leurs questions en droit du travail.
+          </p>
+          <div
+            class="d_flex jc_center"
+          >
+            <button
+              class="fr-btn fr-btn--secondary fr-icon-chat-3-line fr-btn--icon-right"
+              id="fr-button-:r0:"
+            >
+              Trouver les services près de chez moi
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/HeaderDsfr.test.tsx b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/HeaderDsfr.test.tsx
new file mode 100644
index 0000000000..cda77d348d
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/HeaderDsfr.test.tsx
@@ -0,0 +1,11 @@
+import { render } from "@testing-library/react";
+import React from "react";
+
+import { Header } from "..";
+
+describe("<Header />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(<Header />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/SearchInput.test.tsx b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/SearchInput.test.tsx
new file mode 100644
index 0000000000..c990ee36bf
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/SearchInput.test.tsx
@@ -0,0 +1,18 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { SearchInput } from "../SearchInput";
+
+describe("<SearchInput />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(
+      <SearchInput
+        className="my-class"
+        id="my-id"
+        placeholder="my-placeholder"
+        type="search"
+        onSearchSubmit={() => {}}
+      />
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/HeaderDsfr.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/HeaderDsfr.test.tsx.snap
new file mode 100644
index 0000000000..11c954095a
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/HeaderDsfr.test.tsx.snap
@@ -0,0 +1,445 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Header /> should match snapshot 1`] = `
+<div>
+  <button
+    aria-controls="fr-theme-modal"
+    aria-hidden="true"
+    class="fr-btn fr-hidden"
+    data-fr-opened="false"
+    id="fr-theme-modal-hidden-control-button"
+    tabindex="-1"
+    type="button"
+  >
+     
+  </button>
+  <dialog
+    aria-labelledby="fr-modal-title-fr-theme-modal"
+    class="fr-modal"
+    data-fr-concealing-backdrop="true"
+    id="fr-theme-modal"
+    role="dialog"
+  >
+    <div
+      class="fr-container fr-container--fluid fr-container-md"
+    >
+      <div
+        class="fr-grid-row fr-grid-row--center"
+      >
+        <div
+          class="fr-col-12 fr-col-md-6 fr-col-lg-4"
+        >
+          <div
+            class="fr-modal__body"
+          >
+            <div
+              class="fr-modal__header"
+            >
+              <button
+                aria-controls="fr-theme-modal"
+                class="fr-btn--close fr-btn"
+                title="Fermer"
+                type="button"
+              >
+                Fermer
+              </button>
+            </div>
+            <div
+              class="fr-modal__content"
+            >
+              <h1
+                class="fr-modal__title"
+                id="fr-modal-title-fr-theme-modal"
+              >
+                Paramètres d'affichage
+              </h1>
+              <div
+                class="fr-display"
+              >
+                <div
+                  class="fr-form-group"
+                >
+                  <fieldset
+                    class="fr-fieldset"
+                  >
+                    <legend
+                      class="fr-fieldset__legend fr-text--regular"
+                    >
+                      Choisissez un thème pour personnaliser l'apparence du site.
+                    </legend>
+                    <div
+                      class="fr-fieldset__content"
+                    >
+                      <div
+                        class="fr-radio-group fr-radio-rich"
+                      >
+                        <input
+                          id=":r0:-light"
+                          name="fr-radios-theme"
+                          type="radio"
+                          value="light"
+                        />
+                        <label
+                          class="fr-label"
+                          for=":r0:-light"
+                        >
+                          Thème clair
+                        </label>
+                        <div
+                          class="fr-radio-rich__img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            height="80px"
+                            viewBox="0 0 80 80"
+                            width="80px"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <use
+                              class="fr-artwork-decorative"
+                              xlink:href="/img.jpg#artwork-decorative"
+                            />
+                            <use
+                              class="fr-artwork-minor"
+                              xlink:href="/img.jpg#artwork-minor"
+                            />
+                            <use
+                              class="fr-artwork-major"
+                              xlink:href="/img.jpg#artwork-major"
+                            />
+                          </svg>
+                        </div>
+                      </div>
+                      <div
+                        class="fr-radio-group fr-radio-rich"
+                      >
+                        <input
+                          id=":r0:-dark"
+                          name="fr-radios-theme"
+                          type="radio"
+                          value="dark"
+                        />
+                        <label
+                          class="fr-label"
+                          for=":r0:-dark"
+                        >
+                          Thème sombre
+                        </label>
+                        <div
+                          class="fr-radio-rich__img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            height="80px"
+                            viewBox="0 0 80 80"
+                            width="80px"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <use
+                              class="fr-artwork-decorative"
+                              xlink:href="/img.jpg#artwork-decorative"
+                            />
+                            <use
+                              class="fr-artwork-minor"
+                              xlink:href="/img.jpg#artwork-minor"
+                            />
+                            <use
+                              class="fr-artwork-major"
+                              xlink:href="/img.jpg#artwork-major"
+                            />
+                          </svg>
+                        </div>
+                      </div>
+                      <div
+                        class="fr-radio-group fr-radio-rich"
+                      >
+                        <input
+                          id=":r0:-system"
+                          name="fr-radios-theme"
+                          type="radio"
+                          value="system"
+                        />
+                        <label
+                          class="fr-label"
+                          for=":r0:-system"
+                        >
+                          Système.
+                          <span
+                            class="fr-hint-text"
+                          >
+                            Utilise les paramètres système.
+                          </span>
+                        </label>
+                        <div
+                          class="fr-radio-rich__img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            height="80px"
+                            viewBox="0 0 80 80"
+                            width="80px"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <use
+                              class="fr-artwork-decorative"
+                              xlink:href="/img.jpg#artwork-decorative"
+                            />
+                            <use
+                              class="fr-artwork-minor"
+                              xlink:href="/img.jpg#artwork-minor"
+                            />
+                            <use
+                              class="fr-artwork-major"
+                              xlink:href="/img.jpg#artwork-major"
+                            />
+                          </svg>
+                        </div>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </dialog>
+  <header
+    class="fr-header"
+    id="fr-header"
+    role="banner"
+  >
+    <div
+      class="fr-header__body"
+    >
+      <div
+        class="fr-container"
+      >
+        <div
+          class="fr-header__body-row"
+        >
+          <div
+            class="fr-header__brand fr-enlarge-link"
+          >
+            <div
+              class="fr-header__brand-top"
+            >
+              <div
+                class="fr-header__logo"
+              >
+                <p
+                  class="fr-logo"
+                >
+                  RÉPUBLIQUE
+                  <br />
+                  FRANÇAISE
+                </p>
+              </div>
+              <div
+                class="fr-header__navbar"
+              >
+                <button
+                  aria-controls="fr-header-search-modal"
+                  class="fr-btn--search fr-btn"
+                  data-fr-opened="false"
+                  id="fr-header-search-button"
+                  title="Rechercher"
+                >
+                  Rechercher
+                </button>
+                <button
+                  aria-controls="header-menu-modal-fr-header"
+                  aria-haspopup="menu"
+                  class="fr-btn--menu fr-btn"
+                  data-fr-opened="false"
+                  id="fr-header-menu-button"
+                  title="Menu"
+                >
+                  Menu
+                </button>
+              </div>
+            </div>
+            <div
+              class="fr-header__service"
+            >
+              <a
+                href="/"
+                title="Accueil - Code du travail numérique, Ministère du Travail"
+              >
+                <p
+                  class="fr-header__service-title"
+                >
+                  <img
+                    alt="Code du travail numérique"
+                    data-nimg="1"
+                    decoding="async"
+                    height="60"
+                    loading="lazy"
+                    src="/static/assets/img/logo.svg"
+                    style="color: transparent;"
+                    width="200"
+                  />
+                </p>
+              </a>
+              <p
+                class="fr-header__service-tagline"
+              />
+            </div>
+          </div>
+          <div
+            class="fr-header__tools"
+          >
+            <div
+              class="fr-header__search fr-modal"
+              id="fr-header-search-modal"
+            >
+              <div
+                class="fr-container fr-container-lg--fluid"
+              >
+                <button
+                  aria-controls="fr-header-search-modal"
+                  class="fr-btn--close fr-btn"
+                  id="fr-header-search-button"
+                  title="Fermer"
+                >
+                  Fermer
+                </button>
+                <div
+                  class="fr-search-bar"
+                  role="search"
+                >
+                  <label
+                    class="fr-label"
+                    for="fr-header-search-input"
+                  >
+                    Rechercher
+                  </label>
+                  <input
+                    aria-activedescendant=""
+                    aria-autocomplete="list"
+                    aria-controls="downshift-:r2:-menu"
+                    aria-expanded="false"
+                    aria-labelledby="downshift-:r2:-label"
+                    autocomplete="off"
+                    class="fr-input"
+                    id="fr-header-search-input"
+                    placeholder="Rechercher"
+                    role="combobox"
+                    type="search"
+                    value=""
+                  />
+                  <ul
+                    aria-labelledby="downshift-:r2:-label"
+                    class="pos_absolute top_2.5rem w_100% z_100 bg_var(--background-default-grey)"
+                    id="downshift-:r2:-menu"
+                    role="listbox"
+                  />
+                  <button
+                    class="fr-btn"
+                    id="fr-header-search-bar-button"
+                    title="Rechercher"
+                  >
+                    Rechercher
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      aria-labelledby="fr-header-menu-button"
+      class="fr-header__menu fr-modal"
+      id="header-menu-modal-fr-header"
+    >
+      <div
+        class="fr-container"
+      >
+        <button
+          aria-controls="header-menu-modal-fr-header"
+          class="fr-btn--close fr-btn"
+          id="fr-header-mobile-overlay-button-close"
+          title="Fermer"
+        >
+          Fermer
+        </button>
+        <div
+          class="fr-header__menu-links"
+        >
+          <ul
+            class="fr-btns-group"
+          />
+        </div>
+        <nav
+          aria-label="Menu principal"
+          class="fr-nav"
+          id="fr-header-main-navigation"
+          role="navigation"
+        >
+          <ul
+            class="fr-nav__list"
+          >
+            <li
+              class="fr-nav__item"
+            >
+              <a
+                class="fr-nav__link"
+                href="/outils"
+                id="fr-header-main-navigation-link-0"
+              >
+                Boîte à outils
+              </a>
+            </li>
+            <li
+              class="fr-nav__item"
+            >
+              <a
+                class="fr-nav__link"
+                href="/modeles-de-courriers"
+                id="fr-header-main-navigation-link-1"
+              >
+                Modèles de documents
+              </a>
+            </li>
+            <li
+              class="fr-nav__item"
+            >
+              <a
+                class="fr-nav__link"
+                href="/contribution"
+                id="fr-header-main-navigation-link-2"
+              >
+                Vos fiches pratiques
+              </a>
+            </li>
+            <li
+              class="fr-nav__item"
+            >
+              <a
+                class="fr-nav__link"
+                href="/convention-collective"
+                id="fr-header-main-navigation-link-3"
+              >
+                Votre convention collective
+              </a>
+            </li>
+            <li
+              class="fr-nav__item"
+            >
+              <a
+                class="fr-nav__link"
+                href="/themes"
+                id="fr-header-main-navigation-link-4"
+              >
+                Thèmes
+              </a>
+            </li>
+          </ul>
+        </nav>
+      </div>
+    </div>
+  </header>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/SearchInput.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/SearchInput.test.tsx.snap
new file mode 100644
index 0000000000..7fbd862598
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/layout/header/__tests__/__snapshots__/SearchInput.test.tsx.snap
@@ -0,0 +1,26 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<SearchInput /> should match snapshot 1`] = `
+<div>
+  <input
+    aria-activedescendant=""
+    aria-autocomplete="list"
+    aria-controls="downshift-:r0:-menu"
+    aria-expanded="false"
+    aria-labelledby="downshift-:r0:-label"
+    autocomplete="off"
+    class="my-class"
+    id="my-id"
+    placeholder="my-placeholder"
+    role="combobox"
+    type="search"
+    value=""
+  />
+  <ul
+    aria-labelledby="downshift-:r0:-label"
+    class="pos_absolute top_2.5rem w_100% z_100 bg_var(--background-default-grey)"
+    id="downshift-:r0:-menu"
+    role="listbox"
+  />
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/layout/index.tsx b/packages/code-du-travail-frontend/src/modules/layout/index.tsx
index 8deaac741d..e2e3d11b58 100644
--- a/packages/code-du-travail-frontend/src/modules/layout/index.tsx
+++ b/packages/code-du-travail-frontend/src/modules/layout/index.tsx
@@ -5,11 +5,13 @@ import { NeedMoreInfo } from "./NeedMoreInfo";
 
 export const DsfrLayout = ({ children }: { children: React.ReactNode }) => {
   return (
-    <>
-      <Header />
-      <div className={fr.cx("fr-container")}>{children}</div>
-      <NeedMoreInfo />
-      <Footer />
-    </>
+    <html>
+      <body>
+        <Header />
+        <main className={fr.cx("fr-container")}>{children}</main>
+        <NeedMoreInfo />
+        <Footer />
+      </body>
+    </html>
   );
 };
diff --git a/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/MentionsLegales.test.tsx b/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/MentionsLegales.test.tsx
new file mode 100644
index 0000000000..f353cd9f8f
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/MentionsLegales.test.tsx
@@ -0,0 +1,10 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { MentionsLegales } from "..";
+
+describe("<MentionsLegales />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(<MentionsLegales />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/__snapshots__/MentionsLegales.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/__snapshots__/MentionsLegales.test.tsx.snap
new file mode 100644
index 0000000000..b3fe0abf6f
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/mentions-legales/__tests__/__snapshots__/MentionsLegales.test.tsx.snap
@@ -0,0 +1,123 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<MentionsLegales /> should match snapshot 1`] = `
+<div>
+  <div
+    class="fr-grid-row fr-grid-row--center"
+  >
+    <div
+      class="fr-my-4w fr-col-12 fr-my-md-12w fr-col-md-6"
+    >
+      <h1
+        class="fr-mt-0"
+        id="mentions-legales"
+      >
+        Mentions légales
+      </h1>
+      <h2>
+        Éditeur
+      </h2>
+      <div
+        class="fr-mb-3w"
+      >
+        <p
+          class="fr-mb-0"
+        >
+          Le site est édité par la
+           
+          <a
+            href="https://www.fabrique.social.gouv.fr/"
+            target="_blank"
+          >
+            fabrique des Ministères sociaux
+          </a>
+           
+          située :
+        </p>
+        <address>
+          Tour Mirabeau
+          <br />
+          39-43 Quai André Citroën
+          <br />
+          75015 PARIS
+          <br />
+          Tél. : 01 40 56 60 00
+        </address>
+      </div>
+      <h2>
+        Directeur de la publication
+      </h2>
+      <p>
+        Pierre RAMAIN, Directeur Général du Travail
+      </p>
+      <h2>
+        Hébergement du site
+      </h2>
+      <div
+        class="fr-mb-3w"
+      >
+        <p>
+          Ce site est hébergé par OVH SAS : 
+          <br />
+          2 rue Kellermann 
+          <br />
+          56100 Roubaix 
+          <br />
+          France
+          <strong>
+            Le code du logiciel est libre, et peut donc être vérifié et amélioré par toutes et tous à l’adresse suivante:
+             
+            <a
+              href="https://github.com/SocialGouv/code-du-travail-numerique"
+            >
+              https://github.com/SocialGouv/code-du-travail-numerique
+            </a>
+            .
+          </strong>
+        </p>
+      </div>
+      <h2>
+        Accessibilité
+      </h2>
+      <p>
+        La conformité aux normes d’accessibilité numérique est un objectif ultérieur mais nous tâchons de rendre dès la conception, ce site accessible à toutes et à tous.
+      </p>
+      <h3>
+        Signaler un dysfonctionnement
+      </h3>
+      <p>
+        Si vous rencontrez un défaut d’accessibilité vous empêchant d’accéder à un contenu ou une fonctionnalité du site,
+         
+        <a
+          href="mailto:codedutravailnumerique@travail.gouv.fr"
+          title="Envoyer un mail à codedutravailnumerique@travail.gouv.fr"
+        >
+          merci de nous en faire part.
+        </a>
+      </p>
+      <p>
+        Si vous n’obtenez pas de réponse rapide de notre part, vous êtes en droit de faire parvenir vos doléances ou une demande de saisine au Défenseur des droits.
+      </p>
+      <h3>
+        En savoir plus
+      </h3>
+      <p>
+        Pour en savoir plus sur la politique d’accessibilité numérique de l’État :
+         
+        <a
+          href="http://references.modernisation.gouv.fr/accessibilite-numerique"
+          target="_blank"
+        >
+          http://references.modernisation.gouv.fr/accessibilite-numerique
+        </a>
+      </p>
+      <h2>
+        Sécurité
+      </h2>
+      <p>
+        Le site est protégé par un certificat électronique, matérialisé pour la grande majorité des navigateurs par un cadenas. Cette protection participe à la confidentialité des échanges.
+      </p>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/stats/__tests__/Stats.test.tsx b/packages/code-du-travail-frontend/src/modules/stats/__tests__/Stats.test.tsx
new file mode 100644
index 0000000000..d905d16743
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/stats/__tests__/Stats.test.tsx
@@ -0,0 +1,17 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { Stats } from "..";
+
+describe("<Stats />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(
+      <Stats
+        nbDocuments={100}
+        nbPageViews={200}
+        nbSearches={300}
+        nbVisits={400}
+      />
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/stats/__tests__/StatsDisplay.test.tsx b/packages/code-du-travail-frontend/src/modules/stats/__tests__/StatsDisplay.test.tsx
new file mode 100644
index 0000000000..86926ba9fd
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/stats/__tests__/StatsDisplay.test.tsx
@@ -0,0 +1,12 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { StatsDisplay } from "../StatsDisplay";
+
+describe("<StatsDisplay />", () => {
+  it("should match snapshot", () => {
+    const { container } = render(
+      <StatsDisplay metric={100} title="Contenus référencés" />
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/Stats.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/Stats.test.tsx.snap
new file mode 100644
index 0000000000..965f513220
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/Stats.test.tsx.snap
@@ -0,0 +1,128 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Stats /> should match snapshot 1`] = `
+<div>
+  <div
+    class="fr-grid-row"
+  >
+    <div
+      class="fr-my-4w fr-col-12"
+    >
+      <h1
+        class="fr-mt-0"
+      >
+        Statistiques d'utilisation
+      </h1>
+      <div
+        class="fr-grid-row fr-grid-row--gutters"
+      >
+        <div
+          class="fr-col-12 fr-col-md-3"
+        >
+          <div
+            class="fr-callout h_100%"
+            id="fr-callout-:r0:"
+          >
+            <p
+              class="fr-callout__text"
+            >
+               
+              <span
+                class="ta_right d_block fr-mt-4v fr-display--xs"
+              >
+                100
+              </span>
+              <span
+                class="ta_left fr-text--bold fr-text--xl"
+              >
+                Contenus référencés
+              </span>
+               
+            </p>
+          </div>
+        </div>
+        <div
+          class="fr-col-12 fr-col-md-3"
+        >
+          <div
+            class="fr-callout h_100%"
+            id="fr-callout-:r1:"
+          >
+            <p
+              class="fr-callout__text"
+            >
+               
+              <span
+                class="ta_right d_block fr-mt-4v fr-display--xs"
+              >
+                400
+              </span>
+              <span
+                class="ta_left fr-text--bold fr-text--xl"
+              >
+                Visites
+              </span>
+               
+            </p>
+          </div>
+        </div>
+        <div
+          class="fr-col-12 fr-col-md-3"
+        >
+          <div
+            class="fr-callout h_100%"
+            id="fr-callout-:r2:"
+          >
+            <p
+              class="fr-callout__text"
+            >
+               
+              <span
+                class="ta_right d_block fr-mt-4v fr-display--xs"
+              >
+                300
+              </span>
+              <span
+                class="ta_left fr-text--bold fr-text--xl"
+              >
+                Recherches
+              </span>
+               
+            </p>
+          </div>
+        </div>
+        <div
+          class="fr-col-12 fr-col-md-3"
+        >
+          <div
+            class="fr-callout h_100%"
+            id="fr-callout-:r3:"
+          >
+            <p
+              class="fr-callout__text"
+            >
+               
+              <span
+                class="ta_right d_block fr-mt-4v fr-display--xs"
+              >
+                200
+              </span>
+              <span
+                class="ta_left fr-text--bold fr-text--xl"
+              >
+                Consultations
+              </span>
+               
+            </p>
+          </div>
+        </div>
+      </div>
+      <p
+        class="fr-mt-4v"
+      >
+        Statistiques d’utilisation depuis le 01/01/2020
+      </p>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/StatsDisplay.test.tsx.snap b/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/StatsDisplay.test.tsx.snap
new file mode 100644
index 0000000000..ebdca2c91f
--- /dev/null
+++ b/packages/code-du-travail-frontend/src/modules/stats/__tests__/__snapshots__/StatsDisplay.test.tsx.snap
@@ -0,0 +1,31 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<StatsDisplay /> should match snapshot 1`] = `
+<div>
+  <div
+    class="fr-col-12 fr-col-md-3"
+  >
+    <div
+      class="fr-callout h_100%"
+      id="fr-callout-:r0:"
+    >
+      <p
+        class="fr-callout__text"
+      >
+         
+        <span
+          class="ta_right d_block fr-mt-4v fr-display--xs"
+        >
+          100
+        </span>
+        <span
+          class="ta_left fr-text--bold fr-text--xl"
+        >
+          Contenus référencés
+        </span>
+         
+      </p>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/__tests__/__snapshots__/index.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/__tests__/__snapshots__/index.test.tsx.snap
index b8e75ada50..9a6728351b 100644
--- a/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/__tests__/__snapshots__/index.test.tsx.snap
@@ -3,29 +3,29 @@
 exports[`<DureePreavisDemission /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-ERObt kpWsGC"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-eulNck dMhJop"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-iapWAC hrVAPv"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-dExYaf eXWENA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             Simulateur de durée de préavis de démission
           </h1>
         </div>
         <div
-          class="sc-dxcDKg bBiLxp"
+          class="sc-5aee3f4f-4 bSUtKC"
         >
           <svg
             aria-hidden="true"
-            class="sc-kRRyDe iCRqCC"
+            class="sc-5aee3f4f-6 lLPlr"
             fill="none"
             viewBox="0 0 52 52"
             xmlns="http://www.w3.org/2000/svg"
@@ -64,71 +64,71 @@ exports[`<DureePreavisDemission /> should render 1`] = `
             </defs>
           </svg>
           <span
-            class="sc-gvZAcH czFZQA"
+            class="sc-5aee3f4f-5 hThlzo"
           >
             1 à 2 min
           </span>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-ePDLzJ cWzIZL fVUnkE"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-bVVIoq lTBGX"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-dPZUQH ldNvXD"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-eBHhsj fQWqbT"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/4
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-iXzfSG gKinch"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-lnPyaJ iEBnCU"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             Introduction
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
             Convention collective
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               3
             </span>
             Informations
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               4
             </span>
@@ -143,15 +143,15 @@ exports[`<DureePreavisDemission /> should render 1`] = `
         Des informations disponibles sur le bulletin de salaire pourraient être utiles pour réaliser cette simulation.
       </p>
       <div
-        class="sc-ktPPKK fovbo"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-fMMURN sc-YysOf cMdyCT dIpKoA"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-cVzyXs kxnwsU"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/steps/__tests__/__snapshots__/Result.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/steps/__tests__/__snapshots__/Result.test.tsx.snap
index 0576a123c2..6641d94c8b 100644
--- a/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/steps/__tests__/__snapshots__/Result.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/DureePreavisDemission/steps/__tests__/__snapshots__/Result.test.tsx.snap
@@ -3,37 +3,37 @@
 exports[`<StepResult /> should render CC answer 1`] = `
 <div>
   <h2
-    class="sc-ePDLzJ eKYbCt"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
   <p>
     À partir des éléments que vous avez saisis, la durée du préavis de démission est estimée à : 
     <strong
-      class="sc-bVVIoq cTIGFs"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       2 mois
     </strong>
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     .
   </p>
   <p
-    class="sc-dPZUQH buUIDV"
+    class="sc-967f95b8-4 bNAzKG"
     data-testid="notice-preavis-demission"
   >
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     Le préavis débute le jour où le salarié remet sa lettre de démission en main propre ou à la date de première présentation de la lettre recommandée, peu importe le jour de son retrait par l’employeur.
     <i
-      class="sc-dPZUQH buUIDV"
+      class="sc-967f95b8-4 bNAzKG"
     >
        
       Exemple : si l’employeur reçoit le courrier recommandé le
@@ -43,7 +43,7 @@ exports[`<StepResult /> should render CC answer 1`] = `
       4 juin
       .
       <span
-        class="sc-dPZUQH buUIDV"
+        class="sc-967f95b8-4 bNAzKG"
       >
          
         Si le 
@@ -52,7 +52,7 @@ exports[`<StepResult /> should render CC answer 1`] = `
       </span>
     </i>
     <span
-      class="sc-dPZUQH buUIDV"
+      class="sc-967f95b8-4 bNAzKG"
       data-testid="notice-commun-accord"
     >
       <br />
@@ -62,12 +62,12 @@ exports[`<StepResult /> should render CC answer 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -83,16 +83,16 @@ exports[`<StepResult /> should render CC answer 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -120,7 +120,7 @@ exports[`<StepResult /> should render CC answer 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -155,13 +155,13 @@ exports[`<StepResult /> should render CC answer 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-fMMURN ftwa-dj gWJAcM"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -181,10 +181,10 @@ exports[`<StepResult /> should render CC answer 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-ktPPKK iuuGs"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une autre durée de préavis
         </p>
diff --git a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/__tests__/__snapshots__/index.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/__tests__/__snapshots__/index.test.tsx.snap
index b71c0bd6e3..d46e8dc845 100644
--- a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/__tests__/__snapshots__/index.test.tsx.snap
@@ -3,29 +3,29 @@
 exports[`<DureePreavisLicenciement /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-ERObt kpWsGC"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-eulNck dMhJop"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-iapWAC hrVAPv"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-dExYaf eXWENA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             Calculer le préavis de licenciement
           </h1>
         </div>
         <div
-          class="sc-dxcDKg bBiLxp"
+          class="sc-5aee3f4f-4 bSUtKC"
         >
           <svg
             aria-hidden="true"
-            class="sc-kRRyDe iCRqCC"
+            class="sc-5aee3f4f-6 lLPlr"
             fill="none"
             viewBox="0 0 52 52"
             xmlns="http://www.w3.org/2000/svg"
@@ -64,81 +64,81 @@ exports[`<DureePreavisLicenciement /> should render 1`] = `
             </defs>
           </svg>
           <span
-            class="sc-gvZAcH czFZQA"
+            class="sc-5aee3f4f-5 hThlzo"
           >
             2 à 5 min
           </span>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-ePDLzJ cWzIZL fVUnkE"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-bVVIoq lTBGX"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-dPZUQH ldNvXD"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-eBHhsj fQWqbT"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/5
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-iXzfSG gKinch"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-lnPyaJ iEBnCU"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             Introduction
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
             Situation du salarié
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               3
             </span>
             Convention collective
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               4
             </span>
             Informations complémentaires
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               5
             </span>
@@ -163,15 +163,15 @@ exports[`<DureePreavisLicenciement /> should render 1`] = `
         .
       </p>
       <div
-        class="sc-ktPPKK fovbo"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-fMMURN sc-YysOf cMdyCT dIpKoA"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-cVzyXs kxnwsU"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Result.test.js.snap b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Result.test.js.snap
index f415e03c87..99c487097b 100644
--- a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Result.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Result.test.js.snap
@@ -3,12 +3,12 @@
 exports[`<StepResult /> should render with O duration 1`] = `
 <div>
   <h2
-    class="sc-YysOf ffQTXG"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
   <strong
-    class="sc-cVzyXs bbvhfc"
+    class="sc-967f95b8-3 bZGDlr"
     role="alert"
   >
     Aucun préavis
@@ -19,12 +19,12 @@ exports[`<StepResult /> should render with O duration 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -40,16 +40,16 @@ exports[`<StepResult /> should render with O duration 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Résultat
       </h2>
@@ -73,7 +73,7 @@ exports[`<StepResult /> should render with O duration 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -122,7 +122,7 @@ exports[`<StepResult /> should render with O duration 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -157,13 +157,13 @@ exports[`<StepResult /> should render with O duration 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-bVVIoq ftwa-dj bOOnkC"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -183,10 +183,10 @@ exports[`<StepResult /> should render with O duration 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-dPZUQH yZMQN"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
@@ -202,7 +202,7 @@ exports[`<StepResult /> should render with O duration 1`] = `
 exports[`<StepResult /> should render with both CC duration and CDT duration 1`] = `
 <div>
   <h2
-    class="sc-YysOf ffQTXG"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
@@ -210,30 +210,30 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
     À partir des éléments que vous avez saisis, la durée du préavis de licenciement est estimée à :
      
     <strong
-      class="sc-cVzyXs bbvhfc"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       1 mois
     </strong>
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     .
   </p>
   <p
-    class="sc-ePDLzJ gdXTTi"
+    class="sc-967f95b8-4 bNAzKG"
     data-testid="notice-preavis-licenciement"
   >
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     Le préavis débute à la date de la première présentation de la notification du licenciement par lettre recommandée, peu importe le jour de son retrait par le salarié.
     <i
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
     >
        
       Exemple : si le salarié reçoit le courrier recommandé le
@@ -246,7 +246,7 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
        tombe un samedi, un dimanche, un jour férié ou un jour qui n’est habituellement pas travaillé dans l’entreprise, le salarié effectuera son dernier jour dans l’entreprise le jour ouvrable suivant.
     </i>
     <span
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
       data-testid="notice-commun-accord"
     >
       <br />
@@ -256,12 +256,12 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -277,16 +277,16 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Résultat
       </h2>
@@ -310,7 +310,7 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -359,7 +359,7 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -394,13 +394,13 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-bVVIoq ftwa-dj bOOnkC"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -420,10 +420,10 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-dPZUQH yZMQN"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
@@ -439,7 +439,7 @@ exports[`<StepResult /> should render with both CC duration and CDT duration 1`]
 exports[`<StepResult /> should render with only CC duration 1`] = `
 <div>
   <h2
-    class="sc-YysOf ffQTXG"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
@@ -447,30 +447,30 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
     À partir des éléments que vous avez saisis, la durée du préavis de licenciement est estimée à :
      
     <strong
-      class="sc-cVzyXs bbvhfc"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       1 mois
     </strong>
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     .
   </p>
   <p
-    class="sc-ePDLzJ gdXTTi"
+    class="sc-967f95b8-4 bNAzKG"
     data-testid="notice-preavis-licenciement"
   >
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     Le préavis débute à la date de la première présentation de la notification du licenciement par lettre recommandée, peu importe le jour de son retrait par le salarié.
     <i
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
     >
        
       Exemple : si le salarié reçoit le courrier recommandé le
@@ -483,7 +483,7 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
        tombe un samedi, un dimanche, un jour férié ou un jour qui n’est habituellement pas travaillé dans l’entreprise, le salarié effectuera son dernier jour dans l’entreprise le jour ouvrable suivant.
     </i>
     <span
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
       data-testid="notice-commun-accord"
     >
       <br />
@@ -493,12 +493,12 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -514,16 +514,16 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Résultat
       </h2>
@@ -547,7 +547,7 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -596,7 +596,7 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -631,13 +631,13 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-bVVIoq ftwa-dj bOOnkC"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -657,10 +657,10 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-dPZUQH yZMQN"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
@@ -676,7 +676,7 @@ exports[`<StepResult /> should render with only CC duration 1`] = `
 exports[`<StepResult /> should render with when no CC 1`] = `
 <div>
   <h2
-    class="sc-YysOf ffQTXG"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
@@ -684,30 +684,30 @@ exports[`<StepResult /> should render with when no CC 1`] = `
     À partir des éléments que vous avez saisis, la durée du préavis de licenciement est estimée à :
      
     <strong
-      class="sc-cVzyXs bbvhfc"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       2 mois
     </strong>
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     .
   </p>
   <p
-    class="sc-ePDLzJ gdXTTi"
+    class="sc-967f95b8-4 bNAzKG"
     data-testid="notice-preavis-licenciement"
   >
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     Le préavis débute à la date de la première présentation de la notification du licenciement par lettre recommandée, peu importe le jour de son retrait par le salarié.
     <i
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
     >
        
       Exemple : si le salarié reçoit le courrier recommandé le
@@ -720,7 +720,7 @@ exports[`<StepResult /> should render with when no CC 1`] = `
        tombe un samedi, un dimanche, un jour férié ou un jour qui n’est habituellement pas travaillé dans l’entreprise, le salarié effectuera son dernier jour dans l’entreprise le jour ouvrable suivant.
     </i>
     <span
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
       data-testid="notice-commun-accord"
     >
       <br />
@@ -730,12 +730,12 @@ exports[`<StepResult /> should render with when no CC 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -751,16 +751,16 @@ exports[`<StepResult /> should render with when no CC 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Résultat
       </h2>
@@ -781,7 +781,7 @@ exports[`<StepResult /> should render with when no CC 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -811,13 +811,13 @@ exports[`<StepResult /> should render with when no CC 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-bVVIoq ftwa-dj bOOnkC"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -837,10 +837,10 @@ exports[`<StepResult /> should render with when no CC 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-dPZUQH yZMQN"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
@@ -856,7 +856,7 @@ exports[`<StepResult /> should render with when no CC 1`] = `
 exports[`<StepResult /> should render with when unhandled CC 1`] = `
 <div>
   <h2
-    class="sc-YysOf ffQTXG"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Durée du préavis
   </h2>
@@ -864,30 +864,30 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
     À partir des éléments que vous avez saisis, la durée du préavis de licenciement est estimée à :
      
     <strong
-      class="sc-cVzyXs bbvhfc"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       2 mois
     </strong>
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     .
   </p>
   <p
-    class="sc-ePDLzJ gdXTTi"
+    class="sc-967f95b8-4 bNAzKG"
     data-testid="notice-preavis-licenciement"
   >
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     >
       *
     </sup>
     Le préavis débute à la date de la première présentation de la notification du licenciement par lettre recommandée, peu importe le jour de son retrait par le salarié.
     <i
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
     >
        
       Exemple : si le salarié reçoit le courrier recommandé le
@@ -900,7 +900,7 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
        tombe un samedi, un dimanche, un jour férié ou un jour qui n’est habituellement pas travaillé dans l’entreprise, le salarié effectuera son dernier jour dans l’entreprise le jour ouvrable suivant.
     </i>
     <span
-      class="sc-ePDLzJ gdXTTi"
+      class="sc-967f95b8-4 bNAzKG"
       data-testid="notice-commun-accord"
     >
       <br />
@@ -910,12 +910,12 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -931,16 +931,16 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Résultat
       </h2>
@@ -964,7 +964,7 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-YysOf ffQTXG"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -1001,13 +1001,13 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-bVVIoq ftwa-dj bOOnkC"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -1027,10 +1027,10 @@ exports[`<StepResult /> should render with when unhandled CC 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-dPZUQH yZMQN"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
diff --git a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Status.test.js.snap b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Status.test.js.snap
index 1a16250aef..4218d8e0b5 100644
--- a/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Status.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/DureePreavisLicenciement/steps/__tests__/__snapshots__/Status.test.js.snap
@@ -3,28 +3,28 @@
 exports[`<StepStatus /> should render 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Le licenciement est-il dû à une faute grave (ou lourde) ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-eBHhsj czXmMA"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-oui"
         id="seriousMisconduct-oui"
         name="seriousMisconduct"
@@ -32,17 +32,17 @@ exports[`<StepStatus /> should render 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-non"
         id="seriousMisconduct-non"
         name="seriousMisconduct"
@@ -50,7 +50,7 @@ exports[`<StepStatus /> should render 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-non"
       >
         Non
@@ -63,28 +63,28 @@ exports[`<StepStatus /> should render 1`] = `
 exports[`<StepStatus /> should render coefficient 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Le licenciement est-il dû à une faute grave (ou lourde) ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-eBHhsj czXmMA"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-oui"
         id="seriousMisconduct-oui"
         name="seriousMisconduct"
@@ -92,18 +92,18 @@ exports[`<StepStatus /> should render coefficient 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-non"
         id="seriousMisconduct-non"
         name="seriousMisconduct"
@@ -111,7 +111,7 @@ exports[`<StepStatus /> should render coefficient 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-non"
       >
         Non
@@ -119,29 +119,29 @@ exports[`<StepStatus /> should render coefficient 1`] = `
     </div>
   </div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Le salarié concerné est-il reconnu en tant que travailleur handicapé ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-eBHhsj czXmMA"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="disabledWorker-oui"
         id="disabledWorker-oui"
         name="disabledWorker"
@@ -149,17 +149,17 @@ exports[`<StepStatus /> should render coefficient 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="disabledWorker-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="disabledWorker-non"
         id="disabledWorker-non"
         name="disabledWorker"
@@ -167,7 +167,7 @@ exports[`<StepStatus /> should render coefficient 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="disabledWorker-non"
       >
         Non
@@ -175,25 +175,25 @@ exports[`<StepStatus /> should render coefficient 1`] = `
     </div>
   </div>
   <div
-    class="sc-bVVIoq hWWKRA"
+    class="sc-bcc8e06a-2 jPdZuK"
   >
     <legend
-      class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
       for="input-cdt.ancienneté"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Quelle est l'ancienneté du salarié ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
         <button
           aria-label="Plus d'informations"
-          class="sc-kOPcWz cOwJar sc-hknOHE fzwJwI"
+          class="sc-95bd4344-0 ksRRNY sc-5e170fa-0 clgbGd"
           title="Plus d'informations"
           type="button"
         >
@@ -228,15 +228,15 @@ exports[`<StepStatus /> should render coefficient 1`] = `
       </span>
     </legend>
     <label
-      class="sc-cVzyXs bRoDJk"
+      class="sc-bcc8e06a-0 hNAiww"
     >
       Choisissez parmi les catégories d'ancienneté telles que définies par le Code du travail
     </label>
     <div
-      class="sc-dlWCHZ ejmZlt sc-ePDLzJ kbJXkG"
+      class="sc-5a2c6b8f-0 yOEut sc-bcc8e06a-1 lhvsEJ"
     >
       <select
-        class="sc-kWtpeL ejsegf"
+        class="sc-5a2c6b8f-2 leEqvE"
         data-testid="cdt.ancienneté"
         id="input-cdt.ancienneté"
         name="cdt.ancienneté"
@@ -268,7 +268,7 @@ exports[`<StepStatus /> should render coefficient 1`] = `
       </select>
       <div
         aria-hidden="true"
-        class="sc-hHOBiw cYUewx"
+        class="sc-5a2c6b8f-1 dTDGVJ"
       >
         <svg
           aria-hidden="true"
@@ -304,28 +304,28 @@ exports[`<StepStatus /> should render coefficient 1`] = `
 exports[`<StepStatus /> should render seriousMisconduct 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Le licenciement est-il dû à une faute grave (ou lourde) ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-eBHhsj czXmMA"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-oui"
         id="seriousMisconduct-oui"
         name="seriousMisconduct"
@@ -333,18 +333,18 @@ exports[`<StepStatus /> should render seriousMisconduct 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="seriousMisconduct-non"
         id="seriousMisconduct-non"
         name="seriousMisconduct"
@@ -352,7 +352,7 @@ exports[`<StepStatus /> should render seriousMisconduct 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="seriousMisconduct-non"
       >
         Non
@@ -360,28 +360,28 @@ exports[`<StepStatus /> should render seriousMisconduct 1`] = `
     </div>
   </div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-YysOf gLYcDV"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Le salarié concerné est-il reconnu en tant que travailleur handicapé ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-eBHhsj czXmMA"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="disabledWorker-oui"
         id="disabledWorker-oui"
         name="disabledWorker"
@@ -389,17 +389,17 @@ exports[`<StepStatus /> should render seriousMisconduct 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="disabledWorker-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="disabledWorker-non"
         id="disabledWorker-non"
         name="disabledWorker"
@@ -407,7 +407,7 @@ exports[`<StepStatus /> should render seriousMisconduct 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="disabledWorker-non"
       >
         Non
diff --git a/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/__tests__/__snapshots__/index.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/__tests__/__snapshots__/index.test.tsx.snap
index 92a8204ca4..78603459db 100644
--- a/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/__tests__/__snapshots__/index.test.tsx.snap
@@ -3,29 +3,29 @@
 exports[`<HeuresRechercheEmploi /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-ERObt kpWsGC"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-eulNck dMhJop"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-iapWAC hrVAPv"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-dExYaf eXWENA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             Heures pour recherche d'emploi
           </h1>
         </div>
         <div
-          class="sc-dxcDKg bBiLxp"
+          class="sc-5aee3f4f-4 bSUtKC"
         >
           <svg
             aria-hidden="true"
-            class="sc-kRRyDe iCRqCC"
+            class="sc-5aee3f4f-6 lLPlr"
             fill="none"
             viewBox="0 0 52 52"
             xmlns="http://www.w3.org/2000/svg"
@@ -64,81 +64,81 @@ exports[`<HeuresRechercheEmploi /> should render 1`] = `
             </defs>
           </svg>
           <span
-            class="sc-gvZAcH czFZQA"
+            class="sc-5aee3f4f-5 hThlzo"
           >
             2 à 5 min
           </span>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-ePDLzJ cWzIZL fVUnkE"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-bVVIoq lTBGX"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-dPZUQH ldNvXD"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-eBHhsj fQWqbT"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/5
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-iXzfSG gKinch"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-lnPyaJ iEBnCU"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             Introduction
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
             Convention collective
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               3
             </span>
             Type de rupture
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               4
             </span>
             Informations
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               5
             </span>
@@ -163,15 +163,15 @@ exports[`<HeuresRechercheEmploi /> should render 1`] = `
         .
       </p>
       <div
-        class="sc-ktPPKK fovbo"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-fMMURN sc-YysOf cMdyCT dIpKoA"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-cVzyXs kxnwsU"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/steps/__tests__/__snapshots__/Result.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/steps/__tests__/__snapshots__/Result.test.tsx.snap
index 02944e7e8c..8ef93883af 100644
--- a/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/steps/__tests__/__snapshots__/Result.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/HeuresRechercheEmploi/steps/__tests__/__snapshots__/Result.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`<StepResult /> should render no results 1`] = `
 <div>
   <h2
-    class="sc-ePDLzJ eKYbCt"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Nombre d’heures d’absence autorisée pour rechercher un emploi
   </h2>
@@ -13,12 +13,12 @@ exports[`<StepResult /> should render no results 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -34,16 +34,16 @@ exports[`<StepResult /> should render no results 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -78,7 +78,7 @@ exports[`<StepResult /> should render no results 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -101,13 +101,13 @@ exports[`<StepResult /> should render no results 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-fMMURN ftwa-dj gWJAcM"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -127,10 +127,10 @@ exports[`<StepResult /> should render no results 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-ktPPKK iuuGs"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
@@ -146,7 +146,7 @@ exports[`<StepResult /> should render no results 1`] = `
 exports[`<StepResult /> should render with duration 1`] = `
 <div>
   <h2
-    class="sc-ePDLzJ eKYbCt"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Nombre d’heures d’absence autorisée pour rechercher un emploi
   </h2>
@@ -155,19 +155,19 @@ exports[`<StepResult /> should render with duration 1`] = `
      :
     <br />
     <strong
-      class="sc-bVVIoq cTIGFs"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       2 heures par jour
     </strong>
      
     <sup
-      class="sc-eBHhsj hwyzbG"
+      class="sc-47a094d6-0 gIlxPg"
     />
     .
   </p>
   <h2
-    class="sc-ePDLzJ eKYbCt"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Rémunération pendant les heures d’absence autorisée
   </h2>
@@ -175,7 +175,7 @@ exports[`<StepResult /> should render with duration 1`] = `
     Le salaire est maintenu.
   </p>
   <h2
-    class="sc-ePDLzJ eKYbCt"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Conditions d’utilisation
   </h2>
@@ -185,12 +185,12 @@ exports[`<StepResult /> should render with duration 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -206,16 +206,16 @@ exports[`<StepResult /> should render with duration 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -243,7 +243,7 @@ exports[`<StepResult /> should render with duration 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-ePDLzJ eKYbCt"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -266,13 +266,13 @@ exports[`<StepResult /> should render with duration 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-fMMURN ftwa-dj gWJAcM"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -292,10 +292,10 @@ exports[`<StepResult /> should render with duration 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-ktPPKK iuuGs"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister une durée plus favorable
         </p>
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/__tests__/__snapshots__/index.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/__tests__/__snapshots__/index.test.tsx.snap
index 131cf92fdd..c96e999646 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/__tests__/__snapshots__/index.test.tsx.snap
@@ -3,29 +3,29 @@
 exports[`<SimulateurIndemnitePrecarite /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-ERObt kpWsGC"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-eulNck dMhJop"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-iapWAC hrVAPv"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-dExYaf eXWENA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             Calculer l'indemnité de précarité
           </h1>
         </div>
         <div
-          class="sc-dxcDKg bBiLxp"
+          class="sc-5aee3f4f-4 bSUtKC"
         >
           <svg
             aria-hidden="true"
-            class="sc-kRRyDe iCRqCC"
+            class="sc-5aee3f4f-6 lLPlr"
             fill="none"
             viewBox="0 0 52 52"
             xmlns="http://www.w3.org/2000/svg"
@@ -64,81 +64,81 @@ exports[`<SimulateurIndemnitePrecarite /> should render 1`] = `
             </defs>
           </svg>
           <span
-            class="sc-gvZAcH czFZQA"
+            class="sc-5aee3f4f-5 hThlzo"
           >
             5 min
           </span>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-ePDLzJ cWzIZL fVUnkE"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-bVVIoq lTBGX"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-dPZUQH ldNvXD"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-eBHhsj fQWqbT"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/5
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-iXzfSG gKinch"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-lnPyaJ iEBnCU"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             Introduction
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
             Convention collective
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               3
             </span>
             Informations générales
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               4
             </span>
             Rémunération
           </li>
           <li
-            class="sc-iXzfSG dLCZmb"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-lnPyaJ hRwIIr"
+              class="sc-a01ac225-5 hTBVdk"
             >
               5
             </span>
@@ -153,15 +153,15 @@ exports[`<SimulateurIndemnitePrecarite /> should render 1`] = `
         Les montants des salaires perçus pourraient être utiles pour réaliser cette simulation.
       </p>
       <div
-        class="sc-ktPPKK fovbo"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-fMMURN sc-YysOf cMdyCT dIpKoA"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-cVzyXs kxnwsU"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/Salaires.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/Salaires.test.js.snap
index 8e6061a2e7..eed9c21b07 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/Salaires.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/Salaires.test.js.snap
@@ -3,44 +3,44 @@
 exports[`<Salaires /> should add a salaire 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ePDLzJ jQfqXq"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quels sont les salaires mensuels bruts perçus durant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-iXzfSG ejpEic"
+    class="sc-a2eff38b-2 fQvuKl"
   >
     <label
-      class="sc-dPZUQH cDWjTe"
+      class="sc-a2eff38b-0 famBqO"
       for="5"
     >
       Montant :
     </label>
     <div
-      class="sc-bVVIoq gCRYls"
+      class="sc-d7c10f93-0 kgLXdV"
     >
       <div
-        class="sc-sLsrZ kGdGKi"
+        class="sc-669fe731-0 amSvQ"
       >
         <input
-          class="sc-dBmzty eccLNx"
+          class="sc-669fe731-1 htKjGt"
           id="5"
           name="salaires[0].salaire"
           type="number"
           value=""
         />
         <div
-          class="sc-fifgRP cbFsXt"
+          class="sc-669fe731-2 kODRkJ"
         >
           <span>
             €
@@ -49,13 +49,13 @@ exports[`<Salaires /> should add a salaire 1`] = `
       </div>
     </div>
     <button
-      class="sc-kOPcWz kyVwqT sc-eBHhsj hBuWPj"
+      class="sc-95bd4344-0 dxXsic sc-a2eff38b-1 cannHC"
       type="button"
     >
       Supprimer
       <svg
         aria-hidden="true"
-        class="sc-ktPPKK fwWQIb"
+        class="sc-88652f35-1 hhzrTN"
         fill="none"
         viewBox="0 0 32 32"
         xmlns="http://www.w3.org/2000/svg"
@@ -70,12 +70,12 @@ exports[`<Salaires /> should add a salaire 1`] = `
     </button>
   </div>
   <button
-    class="sc-kOPcWz kyVwqT sc-fMMURN iqBUxl"
+    class="sc-95bd4344-0 dxXsic sc-88652f35-0 jXCgfW"
     type="button"
   >
     <svg
       aria-hidden="true"
-      class="sc-YysOf iVyZDd"
+      class="sc-88652f35-2 bpyfbF"
       fill="none"
       viewBox="0 0 16 16"
       xmlns="http://www.w3.org/2000/svg"
@@ -95,27 +95,27 @@ exports[`<Salaires /> should add a salaire 1`] = `
 exports[`<Salaires /> should delete a salaires 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ePDLzJ jQfqXq"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quels sont les salaires mensuels bruts perçus durant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <button
-    class="sc-kOPcWz kyVwqT sc-fMMURN iqBUxl"
+    class="sc-95bd4344-0 dxXsic sc-88652f35-0 jXCgfW"
     type="button"
   >
     <svg
       aria-hidden="true"
-      class="sc-YysOf iVyZDd"
+      class="sc-88652f35-2 bpyfbF"
       fill="none"
       viewBox="0 0 16 16"
       xmlns="http://www.w3.org/2000/svg"
@@ -135,44 +135,44 @@ exports[`<Salaires /> should delete a salaires 1`] = `
 exports[`<Salaires /> should render 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ePDLzJ jQfqXq"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quels sont les salaires mensuels bruts perçus durant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-iXzfSG ejpEic"
+    class="sc-a2eff38b-2 fQvuKl"
   >
     <label
-      class="sc-dPZUQH cDWjTe"
+      class="sc-a2eff38b-0 famBqO"
       for="1"
     >
       Montant :
     </label>
     <div
-      class="sc-bVVIoq gCRYls"
+      class="sc-d7c10f93-0 kgLXdV"
     >
       <div
-        class="sc-sLsrZ kGdGKi"
+        class="sc-669fe731-0 amSvQ"
       >
         <input
-          class="sc-dBmzty eccLNx"
+          class="sc-669fe731-1 htKjGt"
           id="1"
           name="salaires[0].salaire"
           type="number"
           value="3000"
         />
         <div
-          class="sc-fifgRP cbFsXt"
+          class="sc-669fe731-2 kODRkJ"
         >
           <span>
             €
@@ -181,13 +181,13 @@ exports[`<Salaires /> should render 1`] = `
       </div>
     </div>
     <button
-      class="sc-kOPcWz kyVwqT sc-eBHhsj hBuWPj"
+      class="sc-95bd4344-0 dxXsic sc-a2eff38b-1 cannHC"
       type="button"
     >
       Supprimer
       <svg
         aria-hidden="true"
-        class="sc-ktPPKK fwWQIb"
+        class="sc-88652f35-1 hhzrTN"
         fill="none"
         viewBox="0 0 32 32"
         xmlns="http://www.w3.org/2000/svg"
@@ -202,12 +202,12 @@ exports[`<Salaires /> should render 1`] = `
     </button>
   </div>
   <button
-    class="sc-kOPcWz kyVwqT sc-fMMURN iqBUxl"
+    class="sc-95bd4344-0 dxXsic sc-88652f35-0 jXCgfW"
     type="button"
   >
     <svg
       aria-hidden="true"
-      class="sc-YysOf iVyZDd"
+      class="sc-88652f35-2 bpyfbF"
       fill="none"
       viewBox="0 0 16 16"
       xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeContrat.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeContrat.test.js.snap
index dc50c04b3c..cb28872e9a 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeContrat.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeContrat.test.js.snap
@@ -3,49 +3,49 @@
 exports[`<TypeContrat /> should render 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quel est le type du contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="contrat-cdd"
       name="contrat"
       type="radio"
       value="CDD"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="contrat-cdd"
     >
       Contrat à durée déterminée (CDD)
     </label>
   </div>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="contrat-ci"
       name="contrat"
       type="radio"
       value="CTT"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="contrat-ci"
     >
       Contrat de travail temporaire (Contrat d’intérim)
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeRemuneration.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeRemuneration.test.js.snap
index 816d855806..9d0cdabde0 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeRemuneration.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/components/__tests__/__snapshots__/TypeRemuneration.test.js.snap
@@ -3,32 +3,32 @@
 exports[`<TypeRemuneration /> should render 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Comment souhaitez-vous indiquer la rémunération perçue pendant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-amount"
       name="typeRemuneration"
       type="radio"
       value="total"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-amount"
     >
       <span>
@@ -41,17 +41,17 @@ exports[`<TypeRemuneration /> should render 1`] = `
     </label>
   </div>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-pay"
       name="typeRemuneration"
       type="radio"
       value="mensuel"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-pay"
     >
       <span>
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CDD.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CDD.test.js.snap
index 5a390b253f..1a56119800 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CDD.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CDD.test.js.snap
@@ -4,29 +4,29 @@ exports[`<StepCDD /> should render 1`] = `
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le CDD a-t-il été rompu pendant la période d’essai du salarié ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="finContratPeriodeDessai"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="finContratPeriodeDessai-oui"
           id="finContratPeriodeDessai-oui"
           name="finContratPeriodeDessai"
@@ -34,17 +34,17 @@ exports[`<StepCDD /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="finContratPeriodeDessai-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="finContratPeriodeDessai-non"
           id="finContratPeriodeDessai-non"
           name="finContratPeriodeDessai"
@@ -52,7 +52,7 @@ exports[`<StepCDD /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="finContratPeriodeDessai-non"
         >
           Non
@@ -60,29 +60,29 @@ exports[`<StepCDD /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         À la fin du CDD, le salarié a-t-il été immédiatement embauché en CDI, sans interruption, sur un même poste ou sur un poste différent ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="propositionCDIFindeContrat"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFindeContrat-oui"
           id="propositionCDIFindeContrat-oui"
           name="propositionCDIFindeContrat"
@@ -90,17 +90,17 @@ exports[`<StepCDD /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFindeContrat-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFindeContrat-non"
           id="propositionCDIFindeContrat-non"
           name="propositionCDIFindeContrat"
@@ -108,7 +108,7 @@ exports[`<StepCDD /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFindeContrat-non"
         >
           Non
@@ -116,29 +116,29 @@ exports[`<StepCDD /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le CDD a-t-il été rompu avant la fin prévue pour une des raisons suivantes : la propre initiative du salarié, la faute grave ou faute lourde du salarié, cas de force majeure ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="interruptionFauteGrave"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="interruptionFauteGrave-oui"
           id="interruptionFauteGrave-oui"
           name="interruptionFauteGrave"
@@ -146,17 +146,17 @@ exports[`<StepCDD /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="interruptionFauteGrave-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="interruptionFauteGrave-non"
           id="interruptionFauteGrave-non"
           name="interruptionFauteGrave"
@@ -164,7 +164,7 @@ exports[`<StepCDD /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="interruptionFauteGrave-non"
         >
           Non
@@ -172,29 +172,29 @@ exports[`<StepCDD /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le salarié a-t-il refusé de renouveler le CDD alors que le renouvellement et ses modalités étaient prévus dès l’origine dans son contrat ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="refusRenouvellementAuto"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusRenouvellementAuto-oui"
           id="refusRenouvellementAuto-oui"
           name="refusRenouvellementAuto"
@@ -202,17 +202,17 @@ exports[`<StepCDD /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusRenouvellementAuto-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusRenouvellementAuto-non"
           id="refusRenouvellementAuto-non"
           name="refusRenouvellementAuto"
@@ -220,7 +220,7 @@ exports[`<StepCDD /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusRenouvellementAuto-non"
         >
           Non
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CTT.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CTT.test.js.snap
index 9759a2b829..5f061e9853 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CTT.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/CTT.test.js.snap
@@ -4,29 +4,29 @@ exports[`<StepCTT /> should render 1`] = `
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         S’agit-il d’un contrat de mission-formation ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="cttFormation"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="cttFormation-oui"
           id="cttFormation-oui"
           name="cttFormation"
@@ -34,17 +34,17 @@ exports[`<StepCTT /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="cttFormation-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="cttFormation-non"
           id="cttFormation-non"
           name="cttFormation"
@@ -52,7 +52,7 @@ exports[`<StepCTT /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="cttFormation-non"
         >
           Non
@@ -60,29 +60,29 @@ exports[`<StepCTT /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le contrat d'intérim a-t-il été rompu avant la fin prévue pour une des raisons suivantes : la propre initiative du salarié, la faute grave du salarié, cas de force majeure ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="ruptureContratFauteGrave"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="ruptureContratFauteGrave-oui"
           id="ruptureContratFauteGrave-oui"
           name="ruptureContratFauteGrave"
@@ -90,17 +90,17 @@ exports[`<StepCTT /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="ruptureContratFauteGrave-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="ruptureContratFauteGrave-non"
           id="ruptureContratFauteGrave-non"
           name="ruptureContratFauteGrave"
@@ -108,7 +108,7 @@ exports[`<StepCTT /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="ruptureContratFauteGrave-non"
         >
           Non
@@ -116,29 +116,29 @@ exports[`<StepCTT /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         À la fin du contrat d'intérim, le salarié a-t-il été immédiatement embauché en CDI au sein de l'entreprise dans laquelle il effectuait sa mission ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="propositionCDIFinContrat"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFinContrat-oui"
           id="propositionCDIFinContrat-oui"
           name="propositionCDIFinContrat"
@@ -146,17 +146,17 @@ exports[`<StepCTT /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFinContrat-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFinContrat-non"
           id="propositionCDIFinContrat-non"
           name="propositionCDIFinContrat"
@@ -164,7 +164,7 @@ exports[`<StepCTT /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFinContrat-non"
         >
           Non
@@ -172,29 +172,29 @@ exports[`<StepCTT /> should render 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le salarié a-t-il refusé la mise en œuvre de la souplesse prévue dans le contrat d’intérim ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-cVzyXs jfrnZf"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="refusSouplesse"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusSouplesse-oui"
           id="refusSouplesse-oui"
           name="refusSouplesse"
@@ -202,17 +202,17 @@ exports[`<StepCTT /> should render 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusSouplesse-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusSouplesse-non"
           id="refusSouplesse-non"
           name="refusSouplesse"
@@ -220,7 +220,7 @@ exports[`<StepCTT /> should render 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusSouplesse-non"
         >
           Non
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Indemnite.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Indemnite.test.js.snap
index 852ee1f8e3..e9224ef3e7 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Indemnite.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Indemnite.test.js.snap
@@ -3,7 +3,7 @@
 exports[`<StepIndemnite /> should render cdd indemnite with conventional provision message 1`] = `
 <div>
   <h2
-    class="sc-bVVIoq dqmLUd"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Montant
   </h2>
@@ -11,7 +11,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
     La prime d'intervention
      est estimée à : 
     <strong
-      class="sc-dPZUQH fggKzv"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       <span>
@@ -23,12 +23,12 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -44,16 +44,16 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -74,7 +74,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
         </li>
       </ul>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Formule
       </h2>
@@ -349,7 +349,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
         </span>
       </div>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -396,13 +396,13 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-iXzfSG ftwa-dj bdsVWO"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -422,10 +422,10 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-lnPyaJ dsXzGD"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister un montant plus favorable
         </p>
@@ -453,7 +453,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with conventional provisi
 exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] = `
 <div>
   <h2
-    class="sc-bVVIoq dqmLUd"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Montant
   </h2>
@@ -461,7 +461,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
     La prime de précarité
      est estimée à : 
     <strong
-      class="sc-dPZUQH fggKzv"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       <span>
@@ -473,12 +473,12 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -494,16 +494,16 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -524,7 +524,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
         </li>
       </ul>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Formule
       </h2>
@@ -799,7 +799,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
         </span>
       </div>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -834,13 +834,13 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-iXzfSG ftwa-dj bdsVWO"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -860,10 +860,10 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-lnPyaJ dsXzGD"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister un montant plus favorable
         </p>
@@ -894,7 +894,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no ccn message 1`] =
 exports[`<StepIndemnite /> should render cdd indemnite with no conventional provision message 1`] = `
 <div>
   <h2
-    class="sc-bVVIoq dqmLUd"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Montant
   </h2>
@@ -902,7 +902,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
     La prime de précarité
      est estimée à : 
     <strong
-      class="sc-dPZUQH fggKzv"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       <span>
@@ -914,12 +914,12 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -935,16 +935,16 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -965,7 +965,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
         </li>
       </ul>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Formule
       </h2>
@@ -1240,7 +1240,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
         </span>
       </div>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -1287,13 +1287,13 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-iXzfSG ftwa-dj bdsVWO"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -1313,10 +1313,10 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-lnPyaJ dsXzGD"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister un montant plus favorable
         </p>
@@ -1347,7 +1347,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with no conventional prov
 exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message 1`] = `
 <div>
   <h2
-    class="sc-bVVIoq dqmLUd"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Montant
   </h2>
@@ -1355,7 +1355,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
     La prime de précarité
      est estimée à : 
     <strong
-      class="sc-dPZUQH fggKzv"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       <span>
@@ -1367,12 +1367,12 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -1388,16 +1388,16 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -1418,7 +1418,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
         </li>
       </ul>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Formule
       </h2>
@@ -1693,7 +1693,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
         </span>
       </div>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -1728,13 +1728,13 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-iXzfSG ftwa-dj bdsVWO"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -1754,10 +1754,10 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-lnPyaJ dsXzGD"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister un montant plus favorable
         </p>
@@ -1788,7 +1788,7 @@ exports[`<StepIndemnite /> should render cdd indemnite with unhandled cc message
 exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
 <div>
   <h2
-    class="sc-bVVIoq dqmLUd"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Montant
   </h2>
@@ -1796,7 +1796,7 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
     La prime de précarité
      est estimée à : 
     <strong
-      class="sc-dPZUQH fggKzv"
+      class="sc-967f95b8-3 bZGDlr"
       role="alert"
     >
       <span>
@@ -1808,12 +1808,12 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
   <div>
     <button
       aria-expanded="false"
-      class="sc-kOPcWz ezOCpB sc-bbSZdi jpCDWv"
+      class="sc-95bd4344-0 kEXnui sc-da0440cf-1 fwhlXZ"
       type="button"
     >
       <svg
         aria-hidden="true"
-        class="sc-imWYAI gTeNha"
+        class="sc-93c68677-0 fWneNg"
         fill="none"
         height="24"
         stroke="currentColor"
@@ -1829,16 +1829,16 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
         />
       </svg>
       <span
-        class="sc-fBWQRz lqUBb"
+        class="sc-da0440cf-2 cdlSfE"
       >
         Voir le détail du calcul
       </span>
     </button>
     <div
-      class="sc-fjvvzt gtrYRc"
+      class="sc-da0440cf-0 kQbZar"
     >
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Éléments saisis
       </h2>
@@ -1859,7 +1859,7 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
         </li>
       </ul>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Formule
       </h2>
@@ -2134,7 +2134,7 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
         </span>
       </div>
       <h2
-        class="sc-bVVIoq dqmLUd"
+        class="sc-967f95b8-2 fsAvGZ"
       >
         Sources
       </h2>
@@ -2169,13 +2169,13 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
     </div>
   </div>
   <div
-    class="sc-jsJBEP sc-iXzfSG ftwa-dj bdsVWO"
+    class="sc-6c78813f-0 sc-add1a668-0 fnbVWG eTxwuf"
   >
     <div
-      class="sc-hRJfrW fHhwIY"
+      class="sc-66a696c4-0 MNJNF"
     >
       <div
-        class="sc-iHbSHJ dqcYtl"
+        class="sc-66a696c4-1 dvlKxa"
       >
         <svg
           aria-hidden="true"
@@ -2195,10 +2195,10 @@ exports[`<StepIndemnite /> should render ctt indemnite 1`] = `
         </svg>
       </div>
       <div
-        class="sc-klVQfs giEiHo"
+        class="sc-66a696c4-2 eRMOZl"
       >
         <p
-          class="sc-krNlru kcuIcb sc-lnPyaJ dsXzGD"
+          class="sc-3633cc97-1 bjSNvY sc-add1a668-1 dblvAa"
         >
           Attention il peut exister un montant plus favorable
         </p>
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/InfosGenerales.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/InfosGenerales.test.js.snap
index 192611d663..8c62b508e0 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/InfosGenerales.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/InfosGenerales.test.js.snap
@@ -4,49 +4,49 @@ exports[`<StepInfosGenerales /> should render 1`] = `
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Quel est le type du contrat de travail ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-cdd"
         name="contractType"
         type="radio"
         value="CDD"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-cdd"
       >
         Contrat à durée déterminée (CDD)
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-ci"
         name="contractType"
         type="radio"
         value="CTT"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-ci"
       >
         Contrat de travail temporaire (Contrat d’intérim)
@@ -65,79 +65,79 @@ exports[`<StepInfosGenerales /> should render with CDD 1`] = `
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Quel est le type du contrat de travail ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-cdd"
         name="contractType"
         type="radio"
         value="CDD"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-cdd"
       >
         Contrat à durée déterminée (CDD)
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-ci"
         name="contractType"
         type="radio"
         value="CTT"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-ci"
       >
         Contrat de travail temporaire (Contrat d’intérim)
       </label>
     </div>
     <div
-      class="sc-ePDLzJ eidZVY"
+      class="sc-bcc8e06a-2 jPdZuK"
     >
       <legend
-        class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+        class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
         data-testid="question-label"
         for="input-criteria.cddType"
       >
         <span
-          class="sc-iMTnTL kgzsrX"
+          class="sc-3633cc97-0 eiVtrx"
         >
           Quel est le type de CDD ?
           <span
-            class="sc-iMTnTL gvHveA"
+            class="sc-3633cc97-0 hpZWjW"
           >
              (obligatoire)
           </span>
         </span>
       </legend>
       <div
-        class="sc-dlWCHZ ejmZlt sc-cVzyXs fHTQfe"
+        class="sc-5a2c6b8f-0 yOEut sc-bcc8e06a-1 lhvsEJ"
       >
         <select
-          class="sc-kWtpeL ejsegf"
+          class="sc-5a2c6b8f-2 leEqvE"
           data-testid="criteria.cddType"
           id="input-criteria.cddType"
           name="criteria.cddType"
@@ -199,7 +199,7 @@ exports[`<StepInfosGenerales /> should render with CDD 1`] = `
         </select>
         <div
           aria-hidden="true"
-          class="sc-hHOBiw cYUewx"
+          class="sc-5a2c6b8f-1 dTDGVJ"
         >
           <svg
             aria-hidden="true"
@@ -242,79 +242,79 @@ exports[`<StepInfosGenerales /> should render with CDD and not handled ccn 1`] =
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Quel est le type du contrat de travail ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-cdd"
         name="contractType"
         type="radio"
         value="CDD"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-cdd"
       >
         Contrat à durée déterminée (CDD)
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-ci"
         name="contractType"
         type="radio"
         value="CTT"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-ci"
       >
         Contrat de travail temporaire (Contrat d’intérim)
       </label>
     </div>
     <div
-      class="sc-ePDLzJ eidZVY"
+      class="sc-bcc8e06a-2 jPdZuK"
     >
       <legend
-        class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+        class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
         data-testid="question-label"
         for="input-criteria.cddType"
       >
         <span
-          class="sc-iMTnTL kgzsrX"
+          class="sc-3633cc97-0 eiVtrx"
         >
           Quel est le type de CDD ?
           <span
-            class="sc-iMTnTL gvHveA"
+            class="sc-3633cc97-0 hpZWjW"
           >
              (obligatoire)
           </span>
         </span>
       </legend>
       <div
-        class="sc-dlWCHZ ejmZlt sc-cVzyXs fHTQfe"
+        class="sc-5a2c6b8f-0 yOEut sc-bcc8e06a-1 lhvsEJ"
       >
         <select
-          class="sc-kWtpeL ejsegf"
+          class="sc-5a2c6b8f-2 leEqvE"
           data-testid="criteria.cddType"
           id="input-criteria.cddType"
           name="criteria.cddType"
@@ -376,7 +376,7 @@ exports[`<StepInfosGenerales /> should render with CDD and not handled ccn 1`] =
         </select>
         <div
           aria-hidden="true"
-          class="sc-hHOBiw cYUewx"
+          class="sc-5a2c6b8f-1 dTDGVJ"
         >
           <svg
             aria-hidden="true"
@@ -419,79 +419,79 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
 <div>
   <form>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Quel est le type du contrat de travail ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-cdd"
         name="contractType"
         type="radio"
         value="CDD"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-cdd"
       >
         Contrat à durée déterminée (CDD)
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
         checked=""
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         id="contractType-ci"
         name="contractType"
         type="radio"
         value="CTT"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="contractType-ci"
       >
         Contrat de travail temporaire (Contrat d’intérim)
       </label>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         S’agit-il d’un contrat de mission-formation ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dPZUQH lcbAQM"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="cttFormation"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="cttFormation-oui"
           id="cttFormation-oui"
           name="cttFormation"
@@ -499,17 +499,17 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="cttFormation-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="cttFormation-non"
           id="cttFormation-non"
           name="cttFormation"
@@ -517,7 +517,7 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="cttFormation-non"
         >
           Non
@@ -525,29 +525,29 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le contrat d'intérim a-t-il été rompu avant la fin prévue pour une des raisons suivantes : la propre initiative du salarié, la faute grave du salarié, cas de force majeure ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dPZUQH lcbAQM"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="ruptureContratFauteGrave"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="ruptureContratFauteGrave-oui"
           id="ruptureContratFauteGrave-oui"
           name="ruptureContratFauteGrave"
@@ -555,17 +555,17 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="ruptureContratFauteGrave-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="ruptureContratFauteGrave-non"
           id="ruptureContratFauteGrave-non"
           name="ruptureContratFauteGrave"
@@ -573,7 +573,7 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="ruptureContratFauteGrave-non"
         >
           Non
@@ -581,29 +581,29 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         À la fin du contrat d'intérim, le salarié a-t-il été immédiatement embauché en CDI au sein de l'entreprise dans laquelle il effectuait sa mission ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dPZUQH lcbAQM"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="propositionCDIFinContrat"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFinContrat-oui"
           id="propositionCDIFinContrat-oui"
           name="propositionCDIFinContrat"
@@ -611,17 +611,17 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFinContrat-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="propositionCDIFinContrat-non"
           id="propositionCDIFinContrat-non"
           name="propositionCDIFinContrat"
@@ -629,7 +629,7 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="propositionCDIFinContrat-non"
         >
           Non
@@ -637,29 +637,29 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
       </div>
     </div>
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Le salarié a-t-il refusé la mise en œuvre de la souplesse prévue dans le contrat d’intérim ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dPZUQH lcbAQM"
+      class="sc-967f95b8-1 DCwXK"
       data-testid="refusSouplesse"
     >
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusSouplesse-oui"
           id="refusSouplesse-oui"
           name="refusSouplesse"
@@ -667,17 +667,17 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="true"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusSouplesse-oui"
         >
           Oui
         </label>
       </div>
       <div
-        class="sc-EgOXT hwZLfP"
+        class="sc-f2c30c13-1 cRwNeF"
       >
         <input
-          class="sc-eZYNyq dHHdZ"
+          class="sc-f2c30c13-2 bKCzpJ"
           data-testid="refusSouplesse-non"
           id="refusSouplesse-non"
           name="refusSouplesse"
@@ -685,7 +685,7 @@ exports[`<StepInfosGenerales /> should render with CTT 1`] = `
           value="false"
         />
         <label
-          class="sc-iEXKAA fJPAEp"
+          class="sc-f2c30c13-0 ebobyG"
           for="refusSouplesse-non"
         >
           Non
diff --git a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Remuneration.test.js.snap b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Remuneration.test.js.snap
index 03fc06ccbe..092c3f48ff 100644
--- a/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Remuneration.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/IndemnitePrecarite/steps/__tests__/__snapshots__/Remuneration.test.js.snap
@@ -3,32 +3,32 @@
 exports[`<StepRemuneration /> should render multiple inputs 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Comment souhaitez-vous indiquer la rémunération perçue pendant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-amount"
       name="typeRemuneration"
       type="radio"
       value="total"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-amount"
     >
       <span>
@@ -41,18 +41,18 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
     </label>
   </div>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
       checked=""
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-pay"
       name="typeRemuneration"
       type="radio"
       value="mensuel"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-pay"
     >
       <span>
@@ -65,44 +65,44 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
     </label>
   </div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quels sont les salaires mensuels bruts perçus durant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-kqGoIF hPMFhk"
+    class="sc-a2eff38b-2 fQvuKl"
   >
     <label
-      class="sc-dExYaf UAPj"
+      class="sc-a2eff38b-0 famBqO"
       for="2"
     >
       Montant :
     </label>
     <div
-      class="sc-YysOf kSFYEP"
+      class="sc-d7c10f93-0 kgLXdV"
     >
       <div
-        class="sc-sLsrZ kGdGKi"
+        class="sc-669fe731-0 amSvQ"
       >
         <input
-          class="sc-dBmzty eccLNx"
+          class="sc-669fe731-1 htKjGt"
           id="2"
           name="salaires[0].salaire"
           type="number"
           value="2000"
         />
         <div
-          class="sc-fifgRP cbFsXt"
+          class="sc-669fe731-2 kODRkJ"
         >
           <span>
             €
@@ -111,13 +111,13 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
       </div>
     </div>
     <button
-      class="sc-kOPcWz kyVwqT sc-iapWAC fqnCcg"
+      class="sc-95bd4344-0 dxXsic sc-a2eff38b-1 cannHC"
       type="button"
     >
       Supprimer
       <svg
         aria-hidden="true"
-        class="sc-lnPyaJ eEFUQo"
+        class="sc-88652f35-1 hhzrTN"
         fill="none"
         viewBox="0 0 32 32"
         xmlns="http://www.w3.org/2000/svg"
@@ -132,29 +132,29 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
     </button>
   </div>
   <div
-    class="sc-kqGoIF hPMFhk"
+    class="sc-a2eff38b-2 fQvuKl"
   >
     <label
-      class="sc-dExYaf UAPj"
+      class="sc-a2eff38b-0 famBqO"
       for="4"
     >
       Montant :
     </label>
     <div
-      class="sc-YysOf kSFYEP"
+      class="sc-d7c10f93-0 kgLXdV"
     >
       <div
-        class="sc-sLsrZ kGdGKi"
+        class="sc-669fe731-0 amSvQ"
       >
         <input
-          class="sc-dBmzty eccLNx"
+          class="sc-669fe731-1 htKjGt"
           id="4"
           name="salaires[1].salaire"
           type="number"
           value="1500"
         />
         <div
-          class="sc-fifgRP cbFsXt"
+          class="sc-669fe731-2 kODRkJ"
         >
           <span>
             €
@@ -163,13 +163,13 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
       </div>
     </div>
     <button
-      class="sc-kOPcWz kyVwqT sc-iapWAC fqnCcg"
+      class="sc-95bd4344-0 dxXsic sc-a2eff38b-1 cannHC"
       type="button"
     >
       Supprimer
       <svg
         aria-hidden="true"
-        class="sc-lnPyaJ eEFUQo"
+        class="sc-88652f35-1 hhzrTN"
         fill="none"
         viewBox="0 0 32 32"
         xmlns="http://www.w3.org/2000/svg"
@@ -184,12 +184,12 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
     </button>
   </div>
   <button
-    class="sc-kOPcWz kyVwqT sc-iXzfSG eflQP"
+    class="sc-95bd4344-0 dxXsic sc-88652f35-0 jXCgfW"
     type="button"
   >
     <svg
       aria-hidden="true"
-      class="sc-eulNck gbsKZB"
+      class="sc-88652f35-2 bpyfbF"
       fill="none"
       viewBox="0 0 16 16"
       xmlns="http://www.w3.org/2000/svg"
@@ -204,7 +204,7 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
     Ajouter un salaire
   </button>
   <p
-    class="sc-eBHhsj cpDWF"
+    class="sc-967f95b8-4 bNAzKG"
   >
     Majorations, indemnités, primes et accessoires compris sauf les remboursements de frais et l’indemnité de congés payés.
   </p>
@@ -214,33 +214,33 @@ exports[`<StepRemuneration /> should render multiple inputs 1`] = `
 exports[`<StepRemuneration /> should render one input 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Comment souhaitez-vous indiquer la rémunération perçue pendant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
       checked=""
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-amount"
       name="typeRemuneration"
       type="radio"
       value="total"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-amount"
     >
       <span>
@@ -253,17 +253,17 @@ exports[`<StepRemuneration /> should render one input 1`] = `
     </label>
   </div>
   <div
-    class="sc-EgOXT hwZLfP"
+    class="sc-f2c30c13-1 cRwNeF"
   >
     <input
-      class="sc-eZYNyq dHHdZ"
+      class="sc-f2c30c13-2 bKCzpJ"
       id="typeRemuneration-pay"
       name="typeRemuneration"
       type="radio"
       value="mensuel"
     />
     <label
-      class="sc-iEXKAA fJPAEp"
+      class="sc-f2c30c13-0 ebobyG"
       for="typeRemuneration-pay"
     >
       <span>
@@ -276,36 +276,36 @@ exports[`<StepRemuneration /> should render one input 1`] = `
     </label>
   </div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
     for="currency-1"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       Quelle est la rémunération totale brute perçue durant le contrat de travail ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-YysOf kSFYEP"
+    class="sc-d7c10f93-0 kgLXdV"
   >
     <div
-      class="sc-sLsrZ kGdGKi"
+      class="sc-669fe731-0 amSvQ"
     >
       <input
-        class="sc-dBmzty eccLNx"
+        class="sc-669fe731-1 htKjGt"
         id="currency-1"
         name="salaire"
         type="number"
         value="3000"
       />
       <div
-        class="sc-fifgRP cbFsXt"
+        class="sc-669fe731-2 kODRkJ"
       >
         <span>
           €
@@ -314,7 +314,7 @@ exports[`<StepRemuneration /> should render one input 1`] = `
     </div>
   </div>
   <p
-    class="sc-eBHhsj cpDWF"
+    class="sc-967f95b8-4 bNAzKG"
   >
     Majorations, indemnités, primes et accessoires compris sauf les remboursements de frais et l’indemnité de congés payés.
   </p>
diff --git a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/SelectQuestion.test.js.snap b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/SelectQuestion.test.js.snap
index 793f6af600..fc207a1f27 100644
--- a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/SelectQuestion.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/SelectQuestion.test.js.snap
@@ -3,29 +3,29 @@
 exports[`<SelectQuestion /> should render with default value 1`] = `
 <div>
   <div
-    class="sc-ePDLzJ eidZVY"
+    class="sc-bcc8e06a-2 jPdZuK"
   >
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
       for="input-foo"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Une question ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dlWCHZ ejmZlt sc-cVzyXs fHTQfe"
+      class="sc-5a2c6b8f-0 yOEut sc-bcc8e06a-1 lhvsEJ"
     >
       <select
-        class="sc-kWtpeL ejsegf"
+        class="sc-5a2c6b8f-2 leEqvE"
         data-testid="foo"
         id="input-foo"
         name="foo"
@@ -51,7 +51,7 @@ exports[`<SelectQuestion /> should render with default value 1`] = `
       </select>
       <div
         aria-hidden="true"
-        class="sc-hHOBiw cYUewx"
+        class="sc-5a2c6b8f-1 dTDGVJ"
       >
         <svg
           aria-hidden="true"
@@ -87,29 +87,29 @@ exports[`<SelectQuestion /> should render with default value 1`] = `
 exports[`<SelectQuestion /> should render with selectedValue value 1`] = `
 <div>
   <div
-    class="sc-ePDLzJ eidZVY"
+    class="sc-bcc8e06a-2 jPdZuK"
   >
     <legend
-      class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+      class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
       data-testid="question-label"
       for="input-foo"
     >
       <span
-        class="sc-iMTnTL kgzsrX"
+        class="sc-3633cc97-0 eiVtrx"
       >
         Une question ?
         <span
-          class="sc-iMTnTL gvHveA"
+          class="sc-3633cc97-0 hpZWjW"
         >
            (obligatoire)
         </span>
       </span>
     </legend>
     <div
-      class="sc-dlWCHZ ejmZlt sc-cVzyXs fHTQfe"
+      class="sc-5a2c6b8f-0 yOEut sc-bcc8e06a-1 lhvsEJ"
     >
       <select
-        class="sc-kWtpeL ejsegf"
+        class="sc-5a2c6b8f-2 leEqvE"
         data-testid="foo"
         id="input-foo"
         name="foo"
@@ -135,7 +135,7 @@ exports[`<SelectQuestion /> should render with selectedValue value 1`] = `
       </select>
       <div
         aria-hidden="true"
-        class="sc-hHOBiw cYUewx"
+        class="sc-5a2c6b8f-1 dTDGVJ"
       >
         <svg
           aria-hidden="true"
diff --git a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepInformations.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepInformations.test.tsx.snap
index 267d48c923..b06ddc570e 100644
--- a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepInformations.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepInformations.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`<StepInformations /> should render 1`] = `
 <div>
   <h2
-    class="sc-iXzfSG chPUXZ"
+    class="sc-967f95b8-2 fsAvGZ"
   >
     Statut du salarié
   </h2>
diff --git a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepList.test.js.snap b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepList.test.js.snap
index c0151692e7..ba82d987ad 100644
--- a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepList.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/StepList.test.js.snap
@@ -3,34 +3,34 @@
 exports[`<StepList /> should render 1`] = `
 <div>
   <div
-    class="sc-iGgWBj sc-fMMURN cWzIZL bqwUUB"
+    class="sc-2a0a4b0a-0 sc-d8aa1285-0 dLOZmV fXgtLL"
   >
     <span
       aria-level="2"
-      class="sc-ktPPKK kpvBXh"
+      class="sc-d8aa1285-1 chWVII"
       role="heading"
     >
       Étape
       <span
-        class="sc-YysOf khzvAH"
+        class="sc-d8aa1285-2 igsihc"
       >
         s
       </span>
       <span
-        class="sc-cVzyXs dWiJhM"
+        class="sc-d8aa1285-3 liYAUH"
       >
          
         2/3
       </span>
     </span>
     <ol
-      class="sc-cfxfcM kMmTaI"
+      class="sc-ab356c14-0 bpNHPl"
     >
       <li
-        class="sc-ePDLzJ hiBQED"
+        class="sc-d8aa1285-4 kndAk"
       >
         <span
-          class="sc-bVVIoq bYzUJq"
+          class="sc-d8aa1285-5 iyybZh"
         >
           1
         </span>
@@ -38,21 +38,21 @@ exports[`<StepList /> should render 1`] = `
       </li>
       <li
         aria-live="polite"
-        class="sc-ePDLzJ beslFp"
+        class="sc-d8aa1285-4 gOmjO"
         title="onglet actif"
       >
         <span
-          class="sc-bVVIoq beXsyB"
+          class="sc-d8aa1285-5 bIdbrG"
         >
           2
         </span>
         Step Two
       </li>
       <li
-        class="sc-ePDLzJ hiBQED"
+        class="sc-d8aa1285-4 kndAk"
       >
         <span
-          class="sc-bVVIoq bYzUJq"
+          class="sc-d8aa1285-5 iyybZh"
         >
           3
         </span>
diff --git a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/Wizard.test.tsx.snap b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/Wizard.test.tsx.snap
index 70dba453c9..825c0d4d69 100644
--- a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/Wizard.test.tsx.snap
+++ b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/Wizard.test.tsx.snap
@@ -3,63 +3,63 @@
 exports[`<Wizard /> should call navigate the previous step when click on précédent 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-fFlnrN guAbeS"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-hBtRBD hoRcHt"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-bOQTJJ enQbXO"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-hYmls fxMBUA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             test H1
           </h1>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-eifrsQ cWzIZL kbgGSr"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-fKWMtX dwODUN"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-kgOKUu lRoEZ"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-bfhvDw cRllDc"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/2
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-cMa-dbN dVEDhW"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-fUBkdm gKleHP"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             First Step
           </li>
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
@@ -71,15 +71,15 @@ exports[`<Wizard /> should call navigate the previous step when click on précé
         Premiere Etape
       </p>
       <div
-        class="sc-epALIP gMUQhG"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-dJiZtA sc-iLsKjm kAtcjM gdEPCY"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-lbJcrp bPOrps"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -99,51 +99,51 @@ exports[`<Wizard /> should call navigate the previous step when click on précé
 exports[`<Wizard /> should handle initialState.stepIndex 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-fFlnrN guAbeS"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-hBtRBD hoRcHt"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-bOQTJJ enQbXO"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-hYmls fxMBUA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             test H1
           </h1>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-eifrsQ cWzIZL kbgGSr"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-fKWMtX dwODUN"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-kgOKUu lRoEZ"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-bfhvDw cRllDc"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             2/2
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               1
             </span>
@@ -151,11 +151,11 @@ exports[`<Wizard /> should handle initialState.stepIndex 1`] = `
           </li>
           <li
             aria-live="polite"
-            class="sc-cMa-dbN dVEDhW"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-fUBkdm gKleHP"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               2
             </span>
@@ -178,16 +178,16 @@ exports[`<Wizard /> should handle initialState.stepIndex 1`] = `
         />
       </label>
       <div
-        class="sc-epALIP gMUQhG"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz dSQWfG sc-dJiZtA kAtcjM"
+          class="sc-95bd4344-0 ddXsil sc-bc9d1e5-0 kyKZPU"
           type="button"
         >
           Précédent
         </button>
         <button
-          class="sc-kOPcWz gWtlVM sc-dJiZtA kAtcjM"
+          class="sc-95bd4344-0 dqVtzj sc-bc9d1e5-0 kyKZPU"
           type="button"
         >
           Imprimer le résultat
@@ -201,73 +201,73 @@ exports[`<Wizard /> should handle initialState.stepIndex 1`] = `
 exports[`<Wizard /> should handle initialValues 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-fFlnrN guAbeS"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-hBtRBD hoRcHt"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-bOQTJJ enQbXO"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-hYmls fxMBUA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             test H1
           </h1>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-eifrsQ cWzIZL kbgGSr"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-fKWMtX dwODUN"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-kgOKUu lRoEZ"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-bfhvDw cRllDc"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/3
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-cMa-dbN dVEDhW"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-fUBkdm gKleHP"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             First Step
           </li>
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
             Second Step
           </li>
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               3
             </span>
@@ -279,15 +279,15 @@ exports[`<Wizard /> should handle initialValues 1`] = `
         Premiere Etape
       </p>
       <div
-        class="sc-epALIP gMUQhG"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-dJiZtA sc-iLsKjm kAtcjM gdEPCY"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-lbJcrp bPOrps"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
@@ -307,51 +307,51 @@ exports[`<Wizard /> should handle initialValues 1`] = `
 exports[`<Wizard /> should navigate to the second step when click on Commencer 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-fFlnrN guAbeS"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-hBtRBD hoRcHt"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-bOQTJJ enQbXO"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-hYmls fxMBUA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             test H1
           </h1>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-eifrsQ cWzIZL kbgGSr"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-fKWMtX dwODUN"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-kgOKUu lRoEZ"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-bfhvDw cRllDc"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             2/2
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               1
             </span>
@@ -359,11 +359,11 @@ exports[`<Wizard /> should navigate to the second step when click on Commencer 1
           </li>
           <li
             aria-live="polite"
-            class="sc-cMa-dbN dVEDhW"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-fUBkdm gKleHP"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               2
             </span>
@@ -386,16 +386,16 @@ exports[`<Wizard /> should navigate to the second step when click on Commencer 1
         />
       </label>
       <div
-        class="sc-epALIP gMUQhG"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz dSQWfG sc-dJiZtA kAtcjM"
+          class="sc-95bd4344-0 ddXsil sc-bc9d1e5-0 kyKZPU"
           type="button"
         >
           Précédent
         </button>
         <button
-          class="sc-kOPcWz gWtlVM sc-dJiZtA kAtcjM"
+          class="sc-95bd4344-0 dqVtzj sc-bc9d1e5-0 kyKZPU"
           type="button"
         >
           Imprimer le résultat
@@ -409,63 +409,63 @@ exports[`<Wizard /> should navigate to the second step when click on Commencer 1
 exports[`<Wizard /> should render a step 1`] = `
 <div>
   <div
-    class="sc-iGgWBj biWgIW"
+    class="sc-2a0a4b0a-0 hpYuum"
   >
     <form
-      class="sc-fFlnrN guAbeS"
+      class="sc-d0ca486a-0 LJxxm"
     >
       <div
-        class="sc-hBtRBD hoRcHt"
+        class="sc-5aee3f4f-0 fhnnMB"
       >
         <div
-          class="sc-bOQTJJ enQbXO"
+          class="sc-5aee3f4f-2 euiyAA"
         >
           <h1
-            class="sc-hYmls fxMBUA"
+            class="sc-5aee3f4f-1 gWOcBY"
           >
             test H1
           </h1>
         </div>
       </div>
       <div
-        class="sc-iGgWBj sc-eifrsQ cWzIZL kbgGSr"
+        class="sc-2a0a4b0a-0 sc-a01ac225-0 dLOZmV dIXgrP"
       >
         <span
-          class="sc-fKWMtX dwODUN"
+          class="sc-a01ac225-1 iBHdtt"
         >
           Étape
           <span
-            class="sc-kgOKUu lRoEZ"
+            class="sc-a01ac225-2 cIHIqR"
           >
             s
           </span>
           <span
-            class="sc-bfhvDw cRllDc"
+            class="sc-a01ac225-3 iiwWRG"
           >
              
             1/2
           </span>
         </span>
         <ol
-          class="sc-cfxfcM kMmTaI"
+          class="sc-ab356c14-0 bpNHPl"
         >
           <li
             aria-live="polite"
-            class="sc-cMa-dbN dVEDhW"
+            class="sc-a01ac225-4 fGtyTv"
             title="onglet actif"
           >
             <span
-              class="sc-fUBkdm gKleHP"
+              class="sc-a01ac225-5 gsA-Dvn"
             >
               1
             </span>
             First Step
           </li>
           <li
-            class="sc-cMa-dbN kjfnCY"
+            class="sc-a01ac225-4 kUwEMV"
           >
             <span
-              class="sc-fUBkdm fvEnYs"
+              class="sc-a01ac225-5 hTBVdk"
             >
               2
             </span>
@@ -477,15 +477,15 @@ exports[`<Wizard /> should render a step 1`] = `
         Premiere Etape
       </p>
       <div
-        class="sc-epALIP gMUQhG"
+        class="sc-bc9d1e5-1 csPxMe"
       >
         <button
-          class="sc-kOPcWz cefBoA sc-dJiZtA sc-iLsKjm kAtcjM gdEPCY"
+          class="sc-95bd4344-0 jqYNvz sc-bc9d1e5-0 sc-bc9d1e5-2 kyKZPU gPKfXM"
         >
           Commencer
           <svg
             aria-hidden="true"
-            class="sc-lbJcrp bPOrps"
+            class="sc-bc9d1e5-3 iwXRVM"
             fill="none"
             viewBox="0 0 28 15"
             xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/YesNoQuestion.test.js.snap b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/YesNoQuestion.test.js.snap
index b4ac582aef..a599d98466 100644
--- a/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/YesNoQuestion.test.js.snap
+++ b/packages/code-du-travail-frontend/src/outils/common/__tests__/__snapshots__/YesNoQuestion.test.js.snap
@@ -3,28 +3,28 @@
 exports[`<YesNoQuestion /> should render 1`] = `
 <div>
   <legend
-    class="sc-ejfMa-d ibZxvo sc-ktPPKK ejXCAU"
+    class="sc-7b4bcbaf-0 iaxPSC sc-fb2bdc6b-0 cWKeit"
     data-testid="question-label"
   >
     <span
-      class="sc-iMTnTL kgzsrX"
+      class="sc-3633cc97-0 eiVtrx"
     >
       lorem ipsum ?
       <span
-        class="sc-iMTnTL gvHveA"
+        class="sc-3633cc97-0 hpZWjW"
       >
          (obligatoire)
       </span>
     </span>
   </legend>
   <div
-    class="sc-cVzyXs jfrnZf"
+    class="sc-967f95b8-1 DCwXK"
   >
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="test-oui"
         id="test-oui"
         name="test"
@@ -32,17 +32,17 @@ exports[`<YesNoQuestion /> should render 1`] = `
         value="true"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="test-oui"
       >
         Oui
       </label>
     </div>
     <div
-      class="sc-EgOXT hwZLfP"
+      class="sc-f2c30c13-1 cRwNeF"
     >
       <input
-        class="sc-eZYNyq dHHdZ"
+        class="sc-f2c30c13-2 bKCzpJ"
         data-testid="test-non"
         id="test-non"
         name="test"
@@ -50,7 +50,7 @@ exports[`<YesNoQuestion /> should render 1`] = `
         value="false"
       />
       <label
-        class="sc-iEXKAA fJPAEp"
+        class="sc-f2c30c13-0 ebobyG"
         for="test-non"
       >
         Non
diff --git a/packages/code-du-travail-frontend/src/search/__tests__/__snapshots__/SearchResults.test.js.snap b/packages/code-du-travail-frontend/src/search/__tests__/__snapshots__/SearchResults.test.js.snap
index 73bbcd8de1..0dd113762d 100644
--- a/packages/code-du-travail-frontend/src/search/__tests__/__snapshots__/SearchResults.test.js.snap
+++ b/packages/code-du-travail-frontend/src/search/__tests__/__snapshots__/SearchResults.test.js.snap
@@ -6,37 +6,37 @@ exports[`<SearchResults/> should render results 1`] = `
 <div>
   <div
     aria-label="Résultats de recherche"
-    class="sc-aXZVg elbebC"
+    class="sc-d8f596bd-0 hCPxfF"
     role="region"
   >
     <h2
-      class="sc-kAyceB dvmaTz"
+      class="sc-b879fc2d-0 hyiHle"
       id="SearchResults"
     >
       Résultats de recherche pour “search test”
     </h2>
     <ul
-      class="sc-cfxfcM kMmTaI"
+      class="sc-ab356c14-0 bpNHPl"
     >
       <li
-        class="sc-cVzyXs gktFLr"
+        class="sc-309e108-0 ixiTFh"
       >
         <div
-          class="sc-ibQAlb fuLYQY"
+          class="sc-d47d8018-0 cDsGtD"
         >
           <div
-            class="sc-guJBdh jBpgpS"
+            class="sc-d47d8018-2 eBZhiP"
           >
             <div
-              class="sc-hZDyAQ tqlOz"
+              class="sc-d47d8018-3 cAXyng"
             >
               <p
-                class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
               >
                 test theme content
               </p>
               <h2
-                class="sc-ktJbId fhphst"
+                class="sc-d47d8018-5 jNRMjT"
               >
                 <a
                   href="/fiche-service-public/mer-il-est-fou?q=search test"
@@ -47,13 +47,13 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-gmgFlS ikhbYa"
+            class="sc-d47d8018-6 ipSAXR"
           >
             <div
-              class="sc-dPZUQH chkXbW"
+              class="sc-309e108-3 fZcRyu"
             >
               <p
-                class="sc-krNlru bpribs"
+                class="sc-3633cc97-1 bjxtLv"
               >
                 description
               </p>
@@ -62,16 +62,16 @@ exports[`<SearchResults/> should render results 1`] = `
         </div>
       </li>
       <li
-        class="sc-cVzyXs gktFLr"
+        class="sc-309e108-0 ixiTFh"
       >
         <div
-          class="sc-ibQAlb fuLYQY sc-ktPPKK bboxQq"
+          class="sc-d47d8018-0 cDsGtD sc-98e66f5e-1 fCudut"
         >
           <div
-            class="sc-kOHTFB enIaVF"
+            class="sc-9d3cf83b-0 gYcXmc"
           >
             <div
-              class="sc-dtInlm krTdyM"
+              class="sc-9d3cf83b-1 laYFae"
             >
               <svg
                 aria-hidden="true"
@@ -95,18 +95,18 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-guJBdh jBpgpS"
+            class="sc-d47d8018-2 eBZhiP"
           >
             <div
-              class="sc-hZDyAQ tqlOz"
+              class="sc-d47d8018-3 cAXyng"
             >
               <p
-                class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
               >
                 Outils
               </p>
               <h2
-                class="sc-ktJbId fhphst"
+                class="sc-d47d8018-5 jNRMjT"
               >
                 <a
                   href="/outils/simulateur-precarite?q=search test"
@@ -117,25 +117,25 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-gmgFlS ikhbYa"
+            class="sc-d47d8018-6 ipSAXR"
           >
             <div
-              class="sc-fMMURN kUcQRI"
+              class="sc-98e66f5e-0 bQDuAS"
             >
               <div
-                class="sc-dPZUQH chkXbW"
+                class="sc-309e108-3 fZcRyu"
               >
                 <p
-                  class="sc-krNlru bpribs"
+                  class="sc-3633cc97-1 bjxtLv"
                 >
                   description
                 </p>
               </div>
               <div
-                class="sc-YysOf aTCxW"
+                class="sc-98e66f5e-2 cDPdrN"
               >
                 <p
-                  class="sc-krNlru cdYvzt"
+                  class="sc-3633cc97-1 gDIqvu"
                 >
                   Consulter
                    
@@ -157,25 +157,25 @@ exports[`<SearchResults/> should render results 1`] = `
         </div>
       </li>
       <li
-        class="sc-cVzyXs gktFLr"
+        class="sc-309e108-0 ixiTFh"
       >
         <div
           aria-label="Outils externes telerc description undefined (nouvelle fenêtre)"
-          class="sc-ibQAlb fuLYQY sc-ktPPKK bboxQq no-after"
+          class="sc-d47d8018-0 cDsGtD sc-98e66f5e-1 fCudut no-after"
         >
           <div
-            class="sc-guJBdh jBpgpS"
+            class="sc-d47d8018-2 eBZhiP"
           >
             <div
-              class="sc-hZDyAQ tqlOz"
+              class="sc-d47d8018-3 cAXyng"
             >
               <p
-                class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
               >
                 Outils externes
               </p>
               <h3
-                class="sc-ktJbId fhphst"
+                class="sc-d47d8018-5 jNRMjT"
               >
                 <a
                   href="https://www.telerc.travail.gouv.fr/RuptureConventionnellePortailPublic/jsp/site/Portal.jsp?page_id=14"
@@ -188,25 +188,25 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-gmgFlS ikhbYa"
+            class="sc-d47d8018-6 ipSAXR"
           >
             <div
-              class="sc-fMMURN kUcQRI"
+              class="sc-98e66f5e-0 bQDuAS"
             >
               <div
-                class="sc-dPZUQH chkXbW"
+                class="sc-309e108-3 fZcRyu"
               >
                 <p
-                  class="sc-krNlru bpribs"
+                  class="sc-3633cc97-1 bjxtLv"
                 >
                   description
                 </p>
               </div>
               <div
-                class="sc-YysOf aTCxW"
+                class="sc-98e66f5e-2 cDPdrN"
               >
                 <p
-                  class="sc-krNlru cdYvzt"
+                  class="sc-3633cc97-1 gDIqvu"
                 >
                   Consulter
                    
@@ -228,16 +228,16 @@ exports[`<SearchResults/> should render results 1`] = `
         </div>
       </li>
       <li
-        class="sc-cVzyXs gktFLr"
+        class="sc-309e108-0 ixiTFh"
       >
         <div
-          class="sc-ibQAlb fuLYQY sc-ktPPKK bboxQq"
+          class="sc-d47d8018-0 cDsGtD sc-98e66f5e-1 fCudut"
         >
           <div
-            class="sc-kOHTFB enIaVF"
+            class="sc-9d3cf83b-0 gYcXmc"
           >
             <div
-              class="sc-dtInlm krTdyM"
+              class="sc-9d3cf83b-1 laYFae"
             >
               <svg
                 aria-hidden="true"
@@ -261,18 +261,18 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-guJBdh jBpgpS"
+            class="sc-d47d8018-2 eBZhiP"
           >
             <div
-              class="sc-hZDyAQ tqlOz"
+              class="sc-d47d8018-3 cAXyng"
             >
               <p
-                class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
               >
                 test root content
               </p>
               <h2
-                class="sc-ktJbId fhphst"
+                class="sc-d47d8018-5 jNRMjT"
               >
                 <a
                   href="/outils/mer-il-est-fou2?q=search test"
@@ -283,25 +283,25 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-gmgFlS ikhbYa"
+            class="sc-d47d8018-6 ipSAXR"
           >
             <div
-              class="sc-fMMURN kUcQRI"
+              class="sc-98e66f5e-0 bQDuAS"
             >
               <div
-                class="sc-dPZUQH chkXbW"
+                class="sc-309e108-3 fZcRyu"
               >
                 <p
-                  class="sc-krNlru bpribs"
+                  class="sc-3633cc97-1 bjxtLv"
                 >
                   description
                 </p>
               </div>
               <div
-                class="sc-YysOf aTCxW"
+                class="sc-98e66f5e-2 cDPdrN"
               >
                 <p
-                  class="sc-krNlru cdYvzt"
+                  class="sc-3633cc97-1 gDIqvu"
                 >
                   Consulter
                    
@@ -323,16 +323,16 @@ exports[`<SearchResults/> should render results 1`] = `
         </div>
       </li>
       <li
-        class="sc-cVzyXs gktFLr"
+        class="sc-309e108-0 ixiTFh"
       >
         <div
-          class="sc-ibQAlb fuLYQY"
+          class="sc-d47d8018-0 cDsGtD"
         >
           <div
-            class="sc-kOHTFB enIaVF"
+            class="sc-9d3cf83b-0 gYcXmc"
           >
             <div
-              class="sc-dtInlm krTdyM"
+              class="sc-9d3cf83b-1 laYFae"
             >
               <svg
                 aria-hidden="true"
@@ -356,18 +356,18 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-guJBdh jBpgpS"
+            class="sc-d47d8018-2 eBZhiP"
           >
             <div
-              class="sc-hZDyAQ tqlOz"
+              class="sc-d47d8018-3 cAXyng"
             >
               <p
-                class="sc-jaXxmE sc-fTFjTM kgvDSh bVFyjF"
+                class="sc-9261d202-0 sc-d47d8018-4 iTbcuX llhzYx"
               >
                 test theme content
               </p>
               <h2
-                class="sc-ktJbId fhphst"
+                class="sc-d47d8018-5 jNRMjT"
               >
                 <a
                   href="/contribution/mer-il-est-fou4?q=search test"
@@ -378,13 +378,13 @@ exports[`<SearchResults/> should render results 1`] = `
             </div>
           </div>
           <div
-            class="sc-gmgFlS ikhbYa"
+            class="sc-d47d8018-6 ipSAXR"
           >
             <div
-              class="sc-dPZUQH chkXbW"
+              class="sc-309e108-3 fZcRyu"
             >
               <p
-                class="sc-krNlru bpribs"
+                class="sc-3633cc97-1 bjxtLv"
               >
                 description
               </p>
@@ -395,46 +395,46 @@ exports[`<SearchResults/> should render results 1`] = `
     </ul>
   </div>
   <div
-    class="sc-gEvEer cHLyxF"
+    class="sc-a384ed57-0 fCzpjp"
   >
     <div
-      class="sc-eqUAAy jedSti"
+      class="sc-a384ed57-1 GFedb"
     />
     <div
-      class="sc-dcJsrY gQPQLH"
+      class="sc-a384ed57-3 dylJnL"
     >
       <div
-        class="sc-aXZVg gZgZQL"
+        class="sc-d8f596bd-0 jtWYDW"
       >
         <div
-          class="sc-kzqdkY kUMpKA"
+          class="sc-e32628d4-0 eFvDQP"
         >
           <h2
-            class="sc-dSIIpw crsCQS"
+            class="sc-d6e72754-0 egzXkL"
           >
             <span
-              class="sc-gsFSXq ljkohw"
+              class="sc-a4d7a179-0 gGBEJx"
             />
             Que dit le code du travail ?
           </h2>
         </div>
         <div
-          class="sc-gFAWRd euznOP"
+          class="sc-2496d0f8-0 dvplyw"
         >
           <div
-            class="sc-gmPhUn cRQifg"
+            class="sc-28aac820-0 oopOP"
           >
             <div
-              class="sc-ibQAlb fuLYQY"
+              class="sc-d47d8018-0 cDsGtD"
             >
               <div
-                class="sc-guJBdh jBpgpS"
+                class="sc-d47d8018-2 eBZhiP"
               >
                 <div
-                  class="sc-hZDyAQ tqlOz"
+                  class="sc-d47d8018-3 cAXyng"
                 >
                   <p
-                    class="sc-ktJbId fhphst"
+                    class="sc-d47d8018-5 jNRMjT"
                   >
                     <a
                       href="/code-du-travail/L1243-1?q=search test"
@@ -445,7 +445,7 @@ exports[`<SearchResults/> should render results 1`] = `
                 </div>
               </div>
               <div
-                class="sc-gmgFlS ikhbYa"
+                class="sc-d47d8018-6 ipSAXR"
               >
                 la description
               </div>
@@ -453,37 +453,37 @@ exports[`<SearchResults/> should render results 1`] = `
           </div>
         </div>
         <div
-          class="sc-kzqdkY kUMpKA"
+          class="sc-e32628d4-0 eFvDQP"
         >
           <h2
-            class="sc-dSIIpw crsCQS"
+            class="sc-d6e72754-0 egzXkL"
           >
             <span
-              class="sc-gsFSXq ljkohw"
+              class="sc-a4d7a179-0 gGBEJx"
             />
             Les thèmes suivants peuvent vous intéresser
           </h2>
         </div>
         <div
-          class="sc-gFAWRd euznOP"
+          class="sc-2496d0f8-0 dvplyw"
         >
           <div
-            class="sc-gmPhUn hAkHtJ"
+            class="sc-28aac820-0 emsaPO"
           >
             <div
-              class="sc-ibQAlb jRDQvX"
+              class="sc-d47d8018-0 ezEIGw"
             >
               <div
-                class="sc-guJBdh jBpgpS"
+                class="sc-d47d8018-2 eBZhiP"
               >
                 <span
-                  class="sc-gsFSXq efpSUc"
+                  class="sc-a4d7a179-0 JKSoZ"
                 />
                 <div
-                  class="sc-hZDyAQ tqlOz"
+                  class="sc-d47d8018-3 cAXyng"
                 >
                   <p
-                    class="sc-ktJbId fhphst"
+                    class="sc-d47d8018-5 jNRMjT"
                   >
                     <a
                       href="/themes/1-contrat?q=search test"
diff --git a/packages/code-du-travail-frontend/test/jest.setup.js b/packages/code-du-travail-frontend/test/jest.setup.js
index 15e5ccbb4b..7cae8510f2 100644
--- a/packages/code-du-travail-frontend/test/jest.setup.js
+++ b/packages/code-du-travail-frontend/test/jest.setup.js
@@ -2,6 +2,20 @@ import "@testing-library/jest-dom";
 
 import MockDate from "mockdate";
 
+import * as mockRouter from "next-router-mock";
+
+const useRouter = mockRouter.useRouter;
+
+jest.mock("next/navigation", () => ({
+  ...mockRouter,
+  useSearchParams: () => {
+    const router = useRouter();
+    const path = router.query;
+    return new URLSearchParams(path);
+  },
+  usePathname: jest.fn(),
+}));
+
 MockDate.set("2020-1-4");
 
 if (typeof window !== "undefined") {
diff --git a/yarn.lock b/yarn.lock
index 41f90c9dac..aaf8558d20 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -13,9 +13,9 @@ __metadata:
   linkType: hard
 
 "@adobe/css-tools@npm:^4.0.1":
-  version: 4.2.0
-  resolution: "@adobe/css-tools@npm:4.2.0"
-  checksum: dc5cc92ba3d562e7ffddb79d6d222c7e00b65f255fd2725b3d71490ff268844be322f917415d8c4ab39eca646343b632058db8bd5b1d646193fcc94d1d3e420b
+  version: 4.4.0
+  resolution: "@adobe/css-tools@npm:4.4.0"
+  checksum: 1f08fb49bf17fc7f2d1a86d3e739f29ca80063d28168307f1b0a962ef37501c5667271f6771966578897f2e94e43c4770fd802728a6e6495b812da54112d506a
   languageName: node
   linkType: hard
 
@@ -1769,7 +1769,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.10.0, @babel/runtime@npm:^7.12.13, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.17.8, @babel/runtime@npm:^7.19.4, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.24.5, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.9.2":
+"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.10.0, @babel/runtime@npm:^7.12.13, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.17.8, @babel/runtime@npm:^7.19.4, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.24.5, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.8.4":
   version: 7.24.7
   resolution: "@babel/runtime@npm:7.24.7"
   dependencies:
@@ -1778,6 +1778,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/runtime@npm:^7.9.2":
+  version: 7.25.6
+  resolution: "@babel/runtime@npm:7.25.6"
+  dependencies:
+    regenerator-runtime: ^0.14.0
+  checksum: ee1a69d3ac7802803f5ee6a96e652b78b8addc28c6a38c725a4ad7d61a059d9e6cb9f6550ed2f63cce67a1bd82e0b1ef66a1079d895be6bfb536a5cfbd9ccc32
+  languageName: node
+  linkType: hard
+
 "@babel/template@npm:^7.18.10, @babel/template@npm:^7.20.7, @babel/template@npm:^7.21.9, @babel/template@npm:^7.24.7, @babel/template@npm:^7.3.3":
   version: 7.24.7
   resolution: "@babel/template@npm:7.24.7"
@@ -1918,6 +1927,7 @@ __metadata:
     memoizee: ^0.4.15
     mockdate: ^3.0.5
     next: 14.2.5
+    next-router-mock: ^0.9.13
     nextjs-http-supertest: ^1.0.6
     p-debounce: ^2.1.0
     postcss: ^8.4.44
@@ -7377,6 +7387,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-darwin-arm64@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-darwin-arm64@npm:1.7.23"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@swc/core-darwin-x64@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-darwin-x64@npm:1.3.66"
@@ -7384,6 +7401,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-darwin-x64@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-darwin-x64@npm:1.7.23"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@swc/core-linux-arm-gnueabihf@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-linux-arm-gnueabihf@npm:1.3.66"
@@ -7391,6 +7415,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-linux-arm-gnueabihf@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-linux-arm-gnueabihf@npm:1.7.23"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@swc/core-linux-arm64-gnu@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-linux-arm64-gnu@npm:1.3.66"
@@ -7398,6 +7429,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-linux-arm64-gnu@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-linux-arm64-gnu@npm:1.7.23"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@swc/core-linux-arm64-musl@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-linux-arm64-musl@npm:1.3.66"
@@ -7405,6 +7443,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-linux-arm64-musl@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-linux-arm64-musl@npm:1.7.23"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@swc/core-linux-x64-gnu@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-linux-x64-gnu@npm:1.3.66"
@@ -7412,6 +7457,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-linux-x64-gnu@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-linux-x64-gnu@npm:1.7.23"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@swc/core-linux-x64-musl@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-linux-x64-musl@npm:1.3.66"
@@ -7419,6 +7471,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-linux-x64-musl@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-linux-x64-musl@npm:1.7.23"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@swc/core-win32-arm64-msvc@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-win32-arm64-msvc@npm:1.3.66"
@@ -7426,6 +7485,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-win32-arm64-msvc@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-win32-arm64-msvc@npm:1.7.23"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@swc/core-win32-ia32-msvc@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-win32-ia32-msvc@npm:1.3.66"
@@ -7433,6 +7499,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core-win32-ia32-msvc@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-win32-ia32-msvc@npm:1.7.23"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@swc/core-win32-x64-msvc@npm:1.3.66":
   version: 1.3.66
   resolution: "@swc/core-win32-x64-msvc@npm:1.3.66"
@@ -7440,7 +7513,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@swc/core@npm:^1.3.35, @swc/core@npm:^1.3.36, @swc/core@npm:^1.3.60, @swc/core@npm:^1.3.66":
+"@swc/core-win32-x64-msvc@npm:1.7.23":
+  version: 1.7.23
+  resolution: "@swc/core-win32-x64-msvc@npm:1.7.23"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@swc/core@npm:^1.3.35, @swc/core@npm:^1.3.36, @swc/core@npm:^1.3.66":
   version: 1.3.66
   resolution: "@swc/core@npm:1.3.66"
   dependencies:
@@ -7484,6 +7564,52 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/core@npm:^1.3.60":
+  version: 1.7.23
+  resolution: "@swc/core@npm:1.7.23"
+  dependencies:
+    "@swc/core-darwin-arm64": 1.7.23
+    "@swc/core-darwin-x64": 1.7.23
+    "@swc/core-linux-arm-gnueabihf": 1.7.23
+    "@swc/core-linux-arm64-gnu": 1.7.23
+    "@swc/core-linux-arm64-musl": 1.7.23
+    "@swc/core-linux-x64-gnu": 1.7.23
+    "@swc/core-linux-x64-musl": 1.7.23
+    "@swc/core-win32-arm64-msvc": 1.7.23
+    "@swc/core-win32-ia32-msvc": 1.7.23
+    "@swc/core-win32-x64-msvc": 1.7.23
+    "@swc/counter": ^0.1.3
+    "@swc/types": ^0.1.12
+  peerDependencies:
+    "@swc/helpers": "*"
+  dependenciesMeta:
+    "@swc/core-darwin-arm64":
+      optional: true
+    "@swc/core-darwin-x64":
+      optional: true
+    "@swc/core-linux-arm-gnueabihf":
+      optional: true
+    "@swc/core-linux-arm64-gnu":
+      optional: true
+    "@swc/core-linux-arm64-musl":
+      optional: true
+    "@swc/core-linux-x64-gnu":
+      optional: true
+    "@swc/core-linux-x64-musl":
+      optional: true
+    "@swc/core-win32-arm64-msvc":
+      optional: true
+    "@swc/core-win32-ia32-msvc":
+      optional: true
+    "@swc/core-win32-x64-msvc":
+      optional: true
+  peerDependenciesMeta:
+    "@swc/helpers":
+      optional: true
+  checksum: a21e9a67d305ad9b49b6def9f9698b374db6c15b2ded5e5cf29390221181fc6b91bfa317b53fd41d9cca989d85b79bbbca5ab27635df1e0232cad4681f618fa5
+  languageName: node
+  linkType: hard
+
 "@swc/counter@npm:^0.1.3":
   version: 0.1.3
   resolution: "@swc/counter@npm:0.1.3"
@@ -7523,6 +7649,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@swc/types@npm:^0.1.12":
+  version: 0.1.12
+  resolution: "@swc/types@npm:0.1.12"
+  dependencies:
+    "@swc/counter": ^0.1.3
+  checksum: cf7f89e46f859864075d7965582baea9c5f98830f45b1046251568c9bdf1ca484b1bf37f6d3c32b7c82ecf8cd5df89d22f05268c391819c44e49911bb1a8e71a
+  languageName: node
+  linkType: hard
+
 "@szmarczak/http-timer@npm:^4.0.5":
   version: 4.0.6
   resolution: "@szmarczak/http-timer@npm:4.0.6"
@@ -7532,7 +7667,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@testing-library/dom@npm:^8.0.0, @testing-library/dom@npm:^8.11.3":
+"@testing-library/dom@npm:^8.0.0":
   version: 8.20.0
   resolution: "@testing-library/dom@npm:8.20.0"
   dependencies:
@@ -7548,9 +7683,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@testing-library/dom@npm:^8.11.3":
+  version: 8.20.1
+  resolution: "@testing-library/dom@npm:8.20.1"
+  dependencies:
+    "@babel/code-frame": ^7.10.4
+    "@babel/runtime": ^7.12.5
+    "@types/aria-query": ^5.0.1
+    aria-query: 5.1.3
+    chalk: ^4.1.0
+    dom-accessibility-api: ^0.5.9
+    lz-string: ^1.5.0
+    pretty-format: ^27.0.2
+  checksum: 06fc8dc67849aadb726cbbad0e7546afdf8923bd39acb64c576d706249bd7d0d05f08e08a31913fb621162e3b9c2bd0dce15964437f030f9fa4476326fdd3007
+  languageName: node
+  linkType: hard
+
 "@testing-library/jest-dom@npm:^5.16.5":
-  version: 5.16.5
-  resolution: "@testing-library/jest-dom@npm:5.16.5"
+  version: 5.17.0
+  resolution: "@testing-library/jest-dom@npm:5.17.0"
   dependencies:
     "@adobe/css-tools": ^4.0.1
     "@babel/runtime": ^7.9.2
@@ -7561,7 +7712,7 @@ __metadata:
     dom-accessibility-api: ^0.5.6
     lodash: ^4.17.15
     redent: ^3.0.0
-  checksum: 94911f901a8031f3e489d04ac057cb5373621230f5d92bed80e514e24b069fb58a3166d1dd86963e55f078a1bd999da595e2ab96ed95f452d477e272937d792a
+  checksum: 9f28dbca8b50d7c306aae40c3aa8e06f0e115f740360004bd87d57f95acf7ab4b4f4122a7399a76dbf2bdaaafb15c99cc137fdcb0ae457a92e2de0f3fbf9b03b
   languageName: node
   linkType: hard
 
@@ -8248,11 +8399,11 @@ __metadata:
   linkType: hard
 
 "@types/testing-library__jest-dom@npm:^5.9.1":
-  version: 5.14.6
-  resolution: "@types/testing-library__jest-dom@npm:5.14.6"
+  version: 5.14.9
+  resolution: "@types/testing-library__jest-dom@npm:5.14.9"
   dependencies:
     "@types/jest": "*"
-  checksum: 92f81cefeacba3b5c06d4b3fbea0341fe2bcaa6e425c026ae262de39f1148c2588cf3003112aa4ac0880c3972ffb77641a863f3be71518d1d8080402c944e326
+  checksum: d364494fc2545316292e88861146146af1e3818792ca63b62a63758b2f737669b687f4aaddfcfbcb7d0e1ed7890a9bd05de23ff97f277d5e68de574497a9ee72
   languageName: node
   linkType: hard
 
@@ -9001,6 +9152,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"aria-query@npm:5.1.3":
+  version: 5.1.3
+  resolution: "aria-query@npm:5.1.3"
+  dependencies:
+    deep-equal: ^2.0.5
+  checksum: 929ff95f02857b650fb4cbcd2f41072eee2f46159a6605ea03bf63aa572e35ffdff43d69e815ddc462e16e07de8faba3978afc2813650b4448ee18c9895d982b
+  languageName: node
+  linkType: hard
+
 "aria-query@npm:^5.0.0, aria-query@npm:^5.3.0":
   version: 5.3.0
   resolution: "aria-query@npm:5.3.0"
@@ -10091,6 +10251,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"call-bind@npm:^1.0.7":
+  version: 1.0.7
+  resolution: "call-bind@npm:1.0.7"
+  dependencies:
+    es-define-property: ^1.0.0
+    es-errors: ^1.3.0
+    function-bind: ^1.1.2
+    get-intrinsic: ^1.2.4
+    set-function-length: ^1.2.1
+  checksum: 295c0c62b90dd6522e6db3b0ab1ce26bdf9e7404215bda13cfee25b626b5ff1a7761324d58d38b1ef1607fc65aca2d06e44d2e18d0dfc6c14b465b00d8660029
+  languageName: node
+  linkType: hard
+
 "call-me-maybe@npm:^1.0.1":
   version: 1.0.2
   resolution: "call-me-maybe@npm:1.0.2"
@@ -11532,6 +11705,32 @@ __metadata:
   languageName: node
   linkType: hard
 
+"deep-equal@npm:^2.0.5":
+  version: 2.2.3
+  resolution: "deep-equal@npm:2.2.3"
+  dependencies:
+    array-buffer-byte-length: ^1.0.0
+    call-bind: ^1.0.5
+    es-get-iterator: ^1.1.3
+    get-intrinsic: ^1.2.2
+    is-arguments: ^1.1.1
+    is-array-buffer: ^3.0.2
+    is-date-object: ^1.0.5
+    is-regex: ^1.1.4
+    is-shared-array-buffer: ^1.0.2
+    isarray: ^2.0.5
+    object-is: ^1.1.5
+    object-keys: ^1.1.1
+    object.assign: ^4.1.4
+    regexp.prototype.flags: ^1.5.1
+    side-channel: ^1.0.4
+    which-boxed-primitive: ^1.0.2
+    which-collection: ^1.0.1
+    which-typed-array: ^1.1.13
+  checksum: ee8852f23e4d20a5626c13b02f415ba443a1b30b4b3d39eaf366d59c4a85e6545d7ec917db44d476a85ae5a86064f7e5f7af7479f38f113995ba869f3a1ddc53
+  languageName: node
+  linkType: hard
+
 "deep-is@npm:^0.1.3, deep-is@npm:~0.1.3":
   version: 0.1.4
   resolution: "deep-is@npm:0.1.4"
@@ -11595,6 +11794,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"define-data-property@npm:^1.1.4":
+  version: 1.1.4
+  resolution: "define-data-property@npm:1.1.4"
+  dependencies:
+    es-define-property: ^1.0.0
+    es-errors: ^1.3.0
+    gopd: ^1.0.1
+  checksum: 8068ee6cab694d409ac25936eb861eea704b7763f7f342adbdfe337fc27c78d7ae0eff2364b2917b58c508d723c7a074326d068eef2e45c4edcd85cf94d0313b
+  languageName: node
+  linkType: hard
+
 "define-lazy-prop@npm:^2.0.0":
   version: 2.0.0
   resolution: "define-lazy-prop@npm:2.0.0"
@@ -12275,6 +12485,39 @@ __metadata:
   languageName: node
   linkType: hard
 
+"es-define-property@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "es-define-property@npm:1.0.0"
+  dependencies:
+    get-intrinsic: ^1.2.4
+  checksum: f66ece0a887b6dca71848fa71f70461357c0e4e7249696f81bad0a1f347eed7b31262af4a29f5d726dc026426f085483b6b90301855e647aa8e21936f07293c6
+  languageName: node
+  linkType: hard
+
+"es-errors@npm:^1.3.0":
+  version: 1.3.0
+  resolution: "es-errors@npm:1.3.0"
+  checksum: ec1414527a0ccacd7f15f4a3bc66e215f04f595ba23ca75cdae0927af099b5ec865f9f4d33e9d7e86f512f252876ac77d4281a7871531a50678132429b1271b5
+  languageName: node
+  linkType: hard
+
+"es-get-iterator@npm:^1.1.3":
+  version: 1.1.3
+  resolution: "es-get-iterator@npm:1.1.3"
+  dependencies:
+    call-bind: ^1.0.2
+    get-intrinsic: ^1.1.3
+    has-symbols: ^1.0.3
+    is-arguments: ^1.1.1
+    is-map: ^2.0.2
+    is-set: ^2.0.2
+    is-string: ^1.0.7
+    isarray: ^2.0.5
+    stop-iteration-iterator: ^1.0.0
+  checksum: 8fa118da42667a01a7c7529f8a8cca514feeff243feec1ce0bb73baaa3514560bd09d2b3438873cf8a5aaec5d52da248131de153b28e2638a061b6e4df13267d
+  languageName: node
+  linkType: hard
+
 "es-iterator-helpers@npm:^1.0.12, es-iterator-helpers@npm:^1.0.15":
   version: 1.0.15
   resolution: "es-iterator-helpers@npm:1.0.15"
@@ -14213,6 +14456,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"get-intrinsic@npm:^1.2.4":
+  version: 1.2.4
+  resolution: "get-intrinsic@npm:1.2.4"
+  dependencies:
+    es-errors: ^1.3.0
+    function-bind: ^1.1.2
+    has-proto: ^1.0.1
+    has-symbols: ^1.0.3
+    hasown: ^2.0.0
+  checksum: 414e3cdf2c203d1b9d7d33111df746a4512a1aa622770b361dadddf8ed0b5aeb26c560f49ca077e24bfafb0acb55ca908d1f709216ccba33ffc548ec8a79a951
+  languageName: node
+  linkType: hard
+
 "get-nonce@npm:^1.0.0":
   version: 1.0.1
   resolution: "get-nonce@npm:1.0.1"
@@ -14839,6 +15095,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"has-property-descriptors@npm:^1.0.2":
+  version: 1.0.2
+  resolution: "has-property-descriptors@npm:1.0.2"
+  dependencies:
+    es-define-property: ^1.0.0
+  checksum: fcbb246ea2838058be39887935231c6d5788babed499d0e9d0cc5737494c48aba4fe17ba1449e0d0fbbb1e36175442faa37f9c427ae357d6ccb1d895fbcd3de3
+  languageName: node
+  linkType: hard
+
 "has-proto@npm:^1.0.1":
   version: 1.0.1
   resolution: "has-proto@npm:1.0.1"
@@ -15556,6 +15821,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"internal-slot@npm:^1.0.4":
+  version: 1.0.7
+  resolution: "internal-slot@npm:1.0.7"
+  dependencies:
+    es-errors: ^1.3.0
+    hasown: ^2.0.0
+    side-channel: ^1.0.4
+  checksum: cadc5eea5d7d9bc2342e93aae9f31f04c196afebb11bde97448327049f492cd7081e18623ae71388aac9cd237b692ca3a105be9c68ac39c1dec679d7409e33eb
+  languageName: node
+  linkType: hard
+
 "interpret@npm:^1.0.0":
   version: 1.4.0
   resolution: "interpret@npm:1.4.0"
@@ -15635,7 +15911,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-arguments@npm:^1.0.4":
+"is-arguments@npm:^1.0.4, is-arguments@npm:^1.1.1":
   version: 1.1.1
   resolution: "is-arguments@npm:1.1.1"
   dependencies:
@@ -15990,6 +16266,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-map@npm:^2.0.2":
+  version: 2.0.3
+  resolution: "is-map@npm:2.0.3"
+  checksum: e6ce5f6380f32b141b3153e6ba9074892bbbbd655e92e7ba5ff195239777e767a976dcd4e22f864accaf30e53ebf961ab1995424aef91af68788f0591b7396cc
+  languageName: node
+  linkType: hard
+
 "is-nan@npm:^1.2.1":
   version: 1.3.2
   resolution: "is-nan@npm:1.3.2"
@@ -16130,6 +16413,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-set@npm:^2.0.2":
+  version: 2.0.3
+  resolution: "is-set@npm:2.0.3"
+  checksum: 36e3f8c44bdbe9496c9689762cc4110f6a6a12b767c5d74c0398176aa2678d4467e3bf07595556f2dba897751bde1422480212b97d973c7b08a343100b0c0dfe
+  languageName: node
+  linkType: hard
+
 "is-shared-array-buffer@npm:^1.0.2":
   version: 1.0.2
   resolution: "is-shared-array-buffer@npm:1.0.2"
@@ -17987,7 +18277,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lz-string@npm:^1.4.4":
+"lz-string@npm:^1.4.4, lz-string@npm:^1.5.0":
   version: 1.5.0
   resolution: "lz-string@npm:1.5.0"
   bin:
@@ -18841,6 +19131,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"next-router-mock@npm:^0.9.13":
+  version: 0.9.13
+  resolution: "next-router-mock@npm:0.9.13"
+  peerDependencies:
+    next: ">=10.0.0"
+    react: ">=17.0.0"
+  checksum: e6f9bae52cdd4905f628addc14abd1fe9aac7e8a3dbc50d438e82c9c0472cba850a7a624fbd94e68c00b61fd07803a2754587db2ec0fffbd3c45a896c6193bf2
+  languageName: node
+  linkType: hard
+
 "next-tick@npm:1, next-tick@npm:^1.1.0":
   version: 1.1.0
   resolution: "next-tick@npm:1.1.0"
@@ -19509,6 +19809,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"object-is@npm:^1.1.5":
+  version: 1.1.6
+  resolution: "object-is@npm:1.1.6"
+  dependencies:
+    call-bind: ^1.0.7
+    define-properties: ^1.2.1
+  checksum: 3ea22759967e6f2380a2cbbd0f737b42dc9ddb2dfefdb159a1b927fea57335e1b058b564bfa94417db8ad58cddab33621a035de6f5e5ad56d89f2dd03e66c6a1
+  languageName: node
+  linkType: hard
+
 "object-keys@npm:^1.1.1":
   version: 1.1.1
   resolution: "object-keys@npm:1.1.1"
@@ -22619,6 +22929,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"set-function-length@npm:^1.2.1":
+  version: 1.2.2
+  resolution: "set-function-length@npm:1.2.2"
+  dependencies:
+    define-data-property: ^1.1.4
+    es-errors: ^1.3.0
+    function-bind: ^1.1.2
+    get-intrinsic: ^1.2.4
+    gopd: ^1.0.1
+    has-property-descriptors: ^1.0.2
+  checksum: a8248bdacdf84cb0fab4637774d9fb3c7a8e6089866d04c817583ff48e14149c87044ce683d7f50759a8c50fb87c7a7e173535b06169c87ef76f5fb276dfff72
+  languageName: node
+  linkType: hard
+
 "set-function-name@npm:^2.0.0, set-function-name@npm:^2.0.1":
   version: 2.0.1
   resolution: "set-function-name@npm:2.0.1"
@@ -23252,6 +23576,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"stop-iteration-iterator@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "stop-iteration-iterator@npm:1.0.0"
+  dependencies:
+    internal-slot: ^1.0.4
+  checksum: d04173690b2efa40e24ab70e5e51a3ff31d56d699550cfad084104ab3381390daccb36652b25755e420245f3b0737de66c1879eaa2a8d4fc0a78f9bf892fcb42
+  languageName: node
+  linkType: hard
+
 "store2@npm:^2.14.2":
   version: 2.14.2
   resolution: "store2@npm:2.14.2"