Ajoute lasection feuille de paie

src/routes/welcome/+page.svelte

@@ -41,7 +41,7 @@
 
 <main class="h-full bg-yellow-50">
   <section
-    class="relative h-[78%] before:absolute before:top-0 before:inset-x-0 before:h-[50vh] before:bg-gradient-to-b before:from-[#9AAAB4] before:to-transparent"
+    class="relative h-[78%] before:absolute before:top-0 before:inset-x-0 before:h-[50vh] before:bg-gradient-to-b before:from-[#9AAAB4] before:to-transparent fond"
   >
     <div class="h-full relative z-10 flex flex-col justify-evenly items-center">
       <h1 class="font-serif text-4xl text-center leading-snug">
@@ -275,17 +275,64 @@
           </a>
         {/each}
       </div>
+      <div class="flex lg:justify-start justify-center">
+        <button
+          class="mt-5 font-sans flex items-center gap-2 py-2 px-5 shadow-lg bg-le-bleu hover:bg-blue-800 active:bg-blue-900 rounded-md text-white text-sm font-bold tracking-[0.085em] uppercase"
+          title="Vers le simulateur budgétaire de l'impôt sur le revenu"
+        >
+          Utiliser le simulateur budgétaire<iconify-icon
+            class="ml-2 align-[-0.4rem] text-2xl"
+            icon="ri-arrow-right-line"
+          />
+        </button>
+      </div>
+    </div>
+  </section>
+  <section
+    class="grid grid-cols-4 gap-x-12 px-10 md:px-20 lg:px-40 pb-20 pt-10 gap-y-12 bg-[#E3E4D6]"
+  >
+    <h2
+      class="justify-self-center text-2xl font-bold col-span-4 text-center relative z-10 max-w-prose"
+    >
+      <span
+        class="border-b-2 border-black pb-3 font-serif italic font-light highlight"
+        >la feuille de paie</span
+      >
+      <br />
+      <br />
+      Visualiser l’ensemble des impôts, cotisations et prestations sociales qui affectent
+      un cas type
+    </h2>
 
+    <div
+      class="font-serif text-lg col-span-4 lg:col-span-2 justify-self-center lg:justify-self-end"
+    >
+      <img
+        class="max-h-[500px]"
+        src="welcome-capture-ecran-feuille-de-paie.png"
+      />
+    </div>
+    <div class="font-serif text-lg col-span-4 lg:col-span-2">
+      <span>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sit amet
+        laoreet mauris, ut cursus lorem. Sed vitae dolor risus. Ut molestie
+        imperdiet dapibus. Nulla facilisi. Vivamus laoreet nibh at magna auctor,
+        eget accumsan er at volutpat. Pellentesque id est pellentesque, aliquam
+        purus id, ullamcorper lorem. Integer sit amet metus nulla. Vivamus
+        ullamcorper rutrum erat. Fusce tincidunt augue et effici iaculis.</span
+      >
+      <div class="flex lg:justify-start justify-center">
         <button
           class="mt-5 font-sans flex items-center gap-2 py-2 px-5 shadow-lg bg-le-bleu hover:bg-blue-800 active:bg-blue-900 rounded-md text-white text-sm font-bold tracking-[0.085em] uppercase"
           title="Vers le simulateur budgétaire de l'impôt sur le revenu"
         >
-        Simulateur budgétaire<iconify-icon
+          Consulter la feuille de paie d'un cas type<iconify-icon
             class="ml-2 align-[-0.4rem] text-2xl"
             icon="ri-arrow-right-line"
           />
         </button>
       </div>
+    </div>
   </section>
 </main>