add links and amend some design

components/SectionWithCardsAndForm.vue

@@ -1,19 +1,11 @@
 <template>
   <section 
   :id="id"
-  class="flex flex-col gap-8 justify-center items-center rounded-3xl mb-8 px-8 md:px-4 pt-12 pb-16 md:p-16 md:pb-24"
-  :class="{
-    'bg-gradient-conic-cards': bgColor === 'gradient-conic',
-    'bg-gradient-conic-green': bgColor === 'gradient-conic-green',
-    'bg-linear-to-b from-consumo-extra-light to-background-light': bgColor === 'consumo',
-    'bg-linear-to-b from-iguales-extra-light to-background-light': bgColor === 'iguales',
-    'bg-linear-to-b from-aula-extra-light to-background-light': bgColor === 'aula',
-    'bg-linear-to-b from-certifica-light to-background-light': bgColor === 'certifica',
-    'bg-linear-to-b from-foro-light to-background-light': bgColor === 'foro',
-    'bg-linear-to-b from-ods-extra-light to-background-light': bgColor === 'ods',
-  }">
+  class="rounded-3xl mb-8 px-8 md:px-4 pt-12 pb-16 md:p-16 md:pb-24 bg-gradient-certifica"
+  >
+  <div class="flex flex-col gap-8 justify-center items-center container mx-auto">
     <div 
-    class="mx-auto  text-center"
+    class=" text-center"
     :class="{
       'flex flex-col justify-center items-center w-full': titlePosition === 'center',
       'flex flex-col items-start w-full': titlePosition === 'left',
@@ -45,6 +37,7 @@
     <div class="relative w-full min-h-96 h-[40rem] bg-background-extra-light rounded-3xl flex justify-center items-center">
       <iframe class="absolute top-0 w-full h-full rounded-3xl" src="https://form.certifica-t.kit-eco.social/" />
     </div>
+  </div>
   </section>
 </template>
 
@@ -87,3 +80,9 @@ export default {
   
 };
 </script>
+
+<style scoped>
+.bg-gradient-certifica {
+  background: linear-gradient(180deg, #F6F6E3 0%, var(--Background--bg-light, #F9F4F2) 100%);
+}
+</style>