add links and amend some design

components/HeroPages.vue

@@ -7,7 +7,7 @@
         'bg-consumo-base bg-linear-to-t from-consumo-base to-consumo-extra-light': bgColor === 'consumo',
         'bg-iguales-base bg-linear-to-t from-iguales-base to-iguales-extra-light': bgColor === 'iguales',
         'bg-aula-base bg-linear-to-t from-aula-base to-aula-extra-light': bgColor === 'aula',
-        'bg-certifica-base bg-linear-to-t from-certifica-base to-certifica-extra-light': bgColor === 'certifica',
+        'bg-linear-to-t from-certifica-light to-certifica-extra-light': bgColor === 'certifica',
         'bg-foro-base bg-linear-to-t from-foro-base to-foro-extra-light': bgColor === 'foro',
         'bg-ods-base bg-linear-to-t from-ods-base to-ods-extra-light': bgColor === 'ods',
       }">
@@ -22,11 +22,11 @@
     <div class=" flex flex-col items-center z-10 gap-6">
       <h1 class="font-bold max-w-4xl">{{ title }}</h1>
       <p class="text-2xl-custom max-w-3xl" v-html="subtitle"></p>
-      <NuxtLink v-if="button" :to="button.link">
+      <!-- <NuxtLink v-if="button" :to="button.link">
         <ButtonCTA :color="button.color" class="uppercase mt-6">
           {{ button.label }}
         </ButtonCTA>
-      </NuxtLink>
+      </NuxtLink> -->
     </div>
   </section>
 </template>

components/NavBar.vue

@@ -14,7 +14,7 @@
       <!-- Desktop menu -->
       <ul class="hidden md:flex items-center gap-6 font-semibold text-sm-custom">
         <li><NuxtLink :to="`/${langcode}/`" class="hover:bg-button-hover hover:text-white p-2 rounded-lg">INICIO</NuxtLink></li>
-        <li><NuxtLink to="#" class="hover:bg-button-hover hover:text-white p-2 rounded-lg">GUÍA PASO A PASO</NuxtLink></li>
+        <li><NuxtLink to="https://aula.kit-eco.social/" class="hover:bg-button-hover hover:text-white p-2 rounded-lg">GUÍA PASO A PASO</NuxtLink></li>
         <li><NuxtLink to="https://www.kit-eco.social/es/" class="hover:bg-button-hover hover:text-white p-2 rounded-lg">KIT-ECO.SOCIAL</NuxtLink></li>
        
       </ul>
@@ -40,7 +40,7 @@
     <div v-show="menuIsOpen" class="lg:hidden p-5 bg-gradient-conic rounded-3xl min-h-svh">
         <ul class="space-y-4 text-sm-custom text-end w-fit ml-auto">
           <li class="p-2"><NuxtLink :to="`/${langcode}/`">INICIO</NuxtLink></li>
-          <li class="p-2"><NuxtLink to="#">GUÍA PASO A PASO</NuxtLink></li>
+          <li class="p-2"><NuxtLink to="https://aula.kit-eco.social/">GUÍA PASO A PASO</NuxtLink></li>
           <li class="p-2"><NuxtLink to="https://www.kit-eco.social/es/">KIT-ECO.SOCIAL</NuxtLink></li>
         </ul>
       </div>

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>