diff --git a/package-lock.json b/package-lock.json
index 99f4491..c8e6597 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "pinia": "^2.1.7",
         "pinia-plugin-persistedstate": "^3.2.1",
         "postcss": "^8.4.33",
+        "swiper": "^11.0.7",
         "vue": "^3.3.4",
         "vue-gtag": "^2.0.1",
         "vue-router": "^4.2.5",
@@ -5418,6 +5419,24 @@
         "url": "https://github.com/chalk/supports-color?sponsor=1"
       }
     },
+    "node_modules/swiper": {
+      "version": "11.0.7",
+      "resolved": "https://registry.npmjs.org/swiper/-/swiper-11.0.7.tgz",
+      "integrity": "sha512-cDfglW1B6uSmB6eB6pNmzDTNLmZtu5bWWa1vak0RU7fOI9qHjMzl7gVBvYSl34b0RU2N11HxxETJqQ5LeqI1cA==",
+      "funding": [
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/swiperjs"
+        },
+        {
+          "type": "open_collective",
+          "url": "http://opencollective.com/swiper"
+        }
+      ],
+      "engines": {
+        "node": ">= 4.7.0"
+      }
+    },
     "node_modules/symbol-tree": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
diff --git a/package.json b/package.json
index b4f2dde..dde38e5 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "pinia": "^2.1.7",
     "pinia-plugin-persistedstate": "^3.2.1",
     "postcss": "^8.4.33",
+    "swiper": "^11.0.7",
     "vue": "^3.3.4",
     "vue-gtag": "^2.0.1",
     "vue-router": "^4.2.5",
diff --git a/src/App.vue b/src/App.vue
index c992413..3935c77 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,25 +1,15 @@
 <template>
-	<v-app>
-		<v-app-bar
-			color="transparent"
-			app
-			elevation="4"
-		>
-			<div class="w-100 d-flex align-center justify-space-between main-container">
-				<a
-					class="d-flex align-center logo"
-					@click="navigateToHome"
-				>
-					<v-img
-						height="36"
-						width="36"
-						:src="imgUrl"
-						alt="Logo SouJunior"
-					/>
-					<h1 class="text-h5 font-weight-bold font-semibold primary-color ml-3 logo-text">SouJunior Labs</h1>
-				</a>
-				<div class="d-flex align-center ga-2">
-					<!--v-icon
+  <v-app :class="ef">
+    <v-app-bar class="header" color="transparent" app elevation="4">
+      <div class="w-100 d-flex align-center justify-space-between main-container">
+        <a class="d-flex align-center logo" @click="navigateToHome">
+          <v-img height="36" width="36" :src="imgUrl" alt="Logo SouJunior" />
+          <h1 class="text-h5 font-weight-bold font-semibold primary-color ml-3 logo-text">
+            SouJunior Labs
+          </h1>
+        </a>
+        <div class="d-flex align-center ga-2">
+          <!--v-icon
 						v-if="currentTheme.dark"
 						variant="text"
 						icon="mdi-weather-night"
@@ -28,7 +18,7 @@
 						class="mr-8 cursor-pointer"
 						@click="toggleTheme"
 					/-->
-					<!--v-icon
+          <!--v-icon
 						v-if="!currentTheme.dark"
 						variant="text"
 						icon="mdi-white-balance-sunny"
@@ -37,158 +27,144 @@
 						class="mr-8 cursor-pointer"
 						@click="toggleTheme"
 					/-->
-					<v-btn
-						variant="text"
-						class="font-weight-semibold"
-						:to="{ name: 'home' }"
-					>
-                        Home 
-					</v-btn>
-					<v-btn
-						v-if="logged === true"
-						variant="text"
-						class="font-weight-semibold"
-						:to="{ name: 'onboarding' }"
-					>
-                        Onboarding	
-					</v-btn>
-					<v-btn
-						v-if="logged === false"
-						variant="text"
-						class="font-weight-semibold"
-						:to="{ name: 'registry' }"
-					>
-						Registro
-					</v-btn>
-					<v-btn
-						v-if="logged === false"
-						variant="text"
-						class="font-weight-semibold"
-						:to="{ name: 'login' }"
-					>
-						Login
-					</v-btn>
-					<v-btn
-						v-if="logged === true"
-						variant="text"
-						class="font-weight-semibold"
-                        :to="{ name: 'products' }"
-					>
-						Produtos
-					</v-btn>
-					<v-menu
-						v-if="logged === true"
-						open-on-hover
-					>
-						<template v-slot:activator="{ props }">
-							<v-btn
-								variant="text"
-								class="font-weight-semibold"
-								v-bind="props"
-							>
-								{{ auth.getName() }}
-								<v-icon right>mdi-chevron-down</v-icon>
-							</v-btn>
-						</template>
-
-						<v-list>
-							<v-list-item
-								link
-								:to="{ name: 'profile' }"
-							>
-								<v-list-item-title>Profile</v-list-item-title>
-							</v-list-item>
-							<v-list-item
-								link
-                                @click="auth.logout()"
-							>
-								<v-list-item-title>Logout</v-list-item-title>
-							</v-list-item>
-						</v-list>
-					</v-menu>
-				</div>
-			</div>
-		</v-app-bar>
-
-		<transition
-			name="fade"
-			mode="out-in"
-		>
-			<v-main
-				class="d-flex flex-grow-1 main-container"
-				style="margin-top: 64px"
-			>
-				<RouterView />
-			</v-main>
-		</transition>
-	</v-app>
+          <v-btn variant="text" class="font-weight-semibold" :to="{ name: 'home' }"> Home </v-btn>
+          <v-btn
+            v-if="logged === true"
+            variant="text"
+            class="font-weight-semibold"
+            :to="{ name: 'onboarding' }"
+          >
+            Onboarding
+          </v-btn>
+          <!-- <v-btn
+            v-if="logged === false"
+            variant="text"
+            class="font-weight-semibold"
+            :to="{ name: 'registry' }"
+          >
+            Registro
+          </v-btn> -->
+          <v-btn
+            v-if="logged === false"
+            variant="text"
+            class="font-weight-semibold"
+            :to="{ name: 'login' }"
+          >
+            Login
+          </v-btn>
+          <v-btn
+            v-if="logged === true"
+            variant="text"
+            class="font-weight-semibold"
+            :to="{ name: 'products' }"
+          >
+            Produtos
+          </v-btn>
+          <v-menu v-if="logged === true" open-on-hover>
+            <template v-slot:activator="{ props }">
+              <v-btn variant="text" class="font-weight-semibold" v-bind="props">
+                {{ auth.getName() }}
+                <v-icon right>mdi-chevron-down</v-icon>
+              </v-btn>
+            </template>
+
+            <v-list>
+              <v-list-item link :to="{ name: 'profile' }">
+                <v-list-item-title>Profile</v-list-item-title>
+              </v-list-item>
+              <v-list-item link @click="auth.logout()">
+                <v-list-item-title>Logout</v-list-item-title>
+              </v-list-item>
+            </v-list>
+          </v-menu>
+        </div>
+      </div>
+    </v-app-bar>
+
+    <transition name="fade" mode="out-in">
+      <v-main class="d-flex flex-grow-1 main-container" style="margin-top: 64px">
+        <RouterView />
+      </v-main>
+    </transition>
+  </v-app>
 </template>
 
 <script setup>
-import { computed } from 'vue';
-import { useRouter, RouterView } from 'vue-router';
-import { useAuthStore } from '@/stores/auth';
-import { useTheme } from 'vuetify';
-import imgUrl from '@/assets/logo-green-transparent.png';
+import { computed } from 'vue'
+import { useRouter, RouterView, useRoute } from 'vue-router'
+import { useAuthStore } from '@/stores/auth'
+import { useTheme } from 'vuetify'
+import imgUrl from '@/assets/logo-green-transparent.png'
 
-const router = useRouter();
-const theme = useTheme();
+const router = useRouter()
+const theme = useTheme()
 
-const currentTheme = computed(() => theme.current.value);
+const currentTheme = computed(() => theme.current.value)
 
-const auth = useAuthStore();
+const auth = useAuthStore()
 
+const route = useRoute()
 
-const logged = computed(() => auth.getName() != '');
+const logged = computed(() => auth.getName() != '')
 
-const productUuid = computed(() => auth.getName() != '' ?  auth.products[0] : false);
+const productUuid = computed(() => (auth.getName() != '' ? auth.products[0] : false))
 
-console.log('logged', logged);
+console.log('logged', route.path)
+const ef = computed(() => (route.path === '/' ? 'homeBackgroundEffect' : ''))
 
 const navigateToHome = () => {
-	router.push({ name: 'home' })
-};
+  router.push({ name: 'home' })
+}
 
 function toggleTheme() {
-	theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark';
-	localStorage.setItem('theme', theme.global.name.value);
+  theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark'
+  localStorage.setItem('theme', theme.global.name.value)
 }
-
 </script>
 
 <style lang="scss">
+.homeBackgroundEffect {
+  background-image: url('/src/assets/home/homeBackground.png');
+  background-size: cover;
+}
+
+.header {
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+}
+
 .main-container {
-	margin-left: 240px;
-	margin-right: 240px;
-	padding: 0;
-
-	@media (max-width: 1600px) {
-		margin-left: 120px;
-		margin-right: 120px;
-	}
+  margin-left: 240px;
+  margin-right: 240px;
+  padding: 0;
+
+  @media (max-width: 1600px) {
+    margin-left: 120px;
+    margin-right: 120px;
+  }
 }
 
 .primary-color {
-	color: #06d7a0;
+  color: #06d7a0;
 }
 
 .logo {
-	cursor: pointer;
-	transition: ease-in-out 0.2s;
+  cursor: pointer;
+  transition: ease-in-out 0.2s;
 
-	&:hover {
-		filter: brightness(1.25);
-		transition: ease-in-out 0.2s;
-	}
+  &:hover {
+    filter: brightness(1.25);
+    transition: ease-in-out 0.2s;
+  }
 }
 
 .drag-none {
-	user-select: none;
-	-moz-drag-over: none;
-	-webkit-user-drag: none;
+  user-select: none;
+  -moz-drag-over: none;
+  -webkit-user-drag: none;
 }
 
 .logo-text {
-	font-family: "Radio Canada", serif !important;
+  font-family: 'Radio Canada', serif !important;
 }
 </style>
diff --git a/src/assets/home/Discord.png b/src/assets/home/Discord.png
new file mode 100644
index 0000000..3cab397
Binary files /dev/null and b/src/assets/home/Discord.png differ
diff --git a/src/assets/home/Facebook.png b/src/assets/home/Facebook.png
new file mode 100644
index 0000000..b331613
Binary files /dev/null and b/src/assets/home/Facebook.png differ
diff --git a/src/assets/home/Github.png b/src/assets/home/Github.png
new file mode 100644
index 0000000..8aaa456
Binary files /dev/null and b/src/assets/home/Github.png differ
diff --git a/src/assets/home/Instagram.png b/src/assets/home/Instagram.png
new file mode 100644
index 0000000..9fc5e38
Binary files /dev/null and b/src/assets/home/Instagram.png differ
diff --git a/src/assets/home/Linkedin.png b/src/assets/home/Linkedin.png
new file mode 100644
index 0000000..689b629
Binary files /dev/null and b/src/assets/home/Linkedin.png differ
diff --git a/src/assets/home/Twitter.png b/src/assets/home/Twitter.png
new file mode 100644
index 0000000..acfb879
Binary files /dev/null and b/src/assets/home/Twitter.png differ
diff --git a/src/assets/home/YouTube.png b/src/assets/home/YouTube.png
new file mode 100644
index 0000000..14d1952
Binary files /dev/null and b/src/assets/home/YouTube.png differ
diff --git a/src/assets/home/areaIcon1.png b/src/assets/home/areaIcon1.png
new file mode 100644
index 0000000..53cc49d
Binary files /dev/null and b/src/assets/home/areaIcon1.png differ
diff --git a/src/assets/home/areaIcon10.png b/src/assets/home/areaIcon10.png
new file mode 100644
index 0000000..464f374
Binary files /dev/null and b/src/assets/home/areaIcon10.png differ
diff --git a/src/assets/home/areaIcon11.png b/src/assets/home/areaIcon11.png
new file mode 100644
index 0000000..2b43b53
Binary files /dev/null and b/src/assets/home/areaIcon11.png differ
diff --git a/src/assets/home/areaIcon12.png b/src/assets/home/areaIcon12.png
new file mode 100644
index 0000000..3077230
Binary files /dev/null and b/src/assets/home/areaIcon12.png differ
diff --git a/src/assets/home/areaIcon2.png b/src/assets/home/areaIcon2.png
new file mode 100644
index 0000000..d8b2cd6
Binary files /dev/null and b/src/assets/home/areaIcon2.png differ
diff --git a/src/assets/home/areaIcon3.png b/src/assets/home/areaIcon3.png
new file mode 100644
index 0000000..bb5c063
Binary files /dev/null and b/src/assets/home/areaIcon3.png differ
diff --git a/src/assets/home/areaIcon4.png b/src/assets/home/areaIcon4.png
new file mode 100644
index 0000000..c01e820
Binary files /dev/null and b/src/assets/home/areaIcon4.png differ
diff --git a/src/assets/home/areaIcon5.png b/src/assets/home/areaIcon5.png
new file mode 100644
index 0000000..8ea440b
Binary files /dev/null and b/src/assets/home/areaIcon5.png differ
diff --git a/src/assets/home/areaIcon6.png b/src/assets/home/areaIcon6.png
new file mode 100644
index 0000000..c1ffc3b
Binary files /dev/null and b/src/assets/home/areaIcon6.png differ
diff --git a/src/assets/home/areaIcon7.png b/src/assets/home/areaIcon7.png
new file mode 100644
index 0000000..5821e16
Binary files /dev/null and b/src/assets/home/areaIcon7.png differ
diff --git a/src/assets/home/areaIcon8.png b/src/assets/home/areaIcon8.png
new file mode 100644
index 0000000..f3d6631
Binary files /dev/null and b/src/assets/home/areaIcon8.png differ
diff --git a/src/assets/home/areaIcon9.png b/src/assets/home/areaIcon9.png
new file mode 100644
index 0000000..682a285
Binary files /dev/null and b/src/assets/home/areaIcon9.png differ
diff --git a/src/assets/home/djhonantan.png b/src/assets/home/djhonantan.png
new file mode 100644
index 0000000..5e17675
Binary files /dev/null and b/src/assets/home/djhonantan.png differ
diff --git a/src/assets/home/home-abouticon.png b/src/assets/home/home-abouticon.png
new file mode 100644
index 0000000..bce2ac9
Binary files /dev/null and b/src/assets/home/home-abouticon.png differ
diff --git a/src/assets/home/homeBackground.png b/src/assets/home/homeBackground.png
new file mode 100644
index 0000000..362cba0
Binary files /dev/null and b/src/assets/home/homeBackground.png differ
diff --git a/src/assets/home/howToUse.png b/src/assets/home/howToUse.png
new file mode 100644
index 0000000..417bf92
Binary files /dev/null and b/src/assets/home/howToUse.png differ
diff --git a/src/assets/home/icon1.png b/src/assets/home/icon1.png
new file mode 100644
index 0000000..2109d38
Binary files /dev/null and b/src/assets/home/icon1.png differ
diff --git a/src/assets/home/icon2.png b/src/assets/home/icon2.png
new file mode 100644
index 0000000..1b6b9d4
Binary files /dev/null and b/src/assets/home/icon2.png differ
diff --git a/src/assets/home/icon3.png b/src/assets/home/icon3.png
new file mode 100644
index 0000000..cc6370e
Binary files /dev/null and b/src/assets/home/icon3.png differ
diff --git a/src/assets/home/icon4.png b/src/assets/home/icon4.png
new file mode 100644
index 0000000..8113e81
Binary files /dev/null and b/src/assets/home/icon4.png differ
diff --git a/src/assets/home/inahye.png b/src/assets/home/inahye.png
new file mode 100644
index 0000000..39b2bc2
Binary files /dev/null and b/src/assets/home/inahye.png differ
diff --git a/src/assets/home/squadIcon1.png b/src/assets/home/squadIcon1.png
new file mode 100644
index 0000000..5bf01d2
Binary files /dev/null and b/src/assets/home/squadIcon1.png differ
diff --git a/src/assets/home/squadIcon2.png b/src/assets/home/squadIcon2.png
new file mode 100644
index 0000000..5f7ce2a
Binary files /dev/null and b/src/assets/home/squadIcon2.png differ
diff --git a/src/assets/home/thais.png b/src/assets/home/thais.png
new file mode 100644
index 0000000..9b56b7c
Binary files /dev/null and b/src/assets/home/thais.png differ
diff --git a/src/assets/home/thaynna.png b/src/assets/home/thaynna.png
new file mode 100644
index 0000000..ed52611
Binary files /dev/null and b/src/assets/home/thaynna.png differ
diff --git a/src/assets/home/wouerner.png b/src/assets/home/wouerner.png
new file mode 100644
index 0000000..3e7b18a
Binary files /dev/null and b/src/assets/home/wouerner.png differ
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 71bee72..0933283 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,73 +1,776 @@
 <template>
-	<v-container
-		fluid
-		class="pa-0 d-flex align-center justify-center container-gap"
-	>
-		<div class="d-flex flex-column justify-center align-center">
-			<div class="d-flex flex-column ga-6">
-				<div>
-					<h1 class="home-title text-left mb-2">SouJunior Labs</h1>
-					<h2 class="home-subtitle text-left text-grey-darken-1 text-h4">Laboratorio de oportunidades.</h2>
-				</div>
-				<br>
-				<div>
-					<p class="home-body text-left">Em um mundo onde a tecnologia se tornou
-						<br> uma ferramenta indispensável, temos uma missão única:
-						<br> utilizar o poder do desenvolvimento de software
-						<br> para impulsionar ações filantrópicas.
-						<br><br> Nosso projeto social, "Tecnologia para o Bem",
-						<br> é dedicado a criar soluções inovadoras de software
-						<br> que atendam às necessidades das organizações
-						<br> sem fins lucrativos e comunidades carentes.
-					</p>
-				</div>
-			</div>
-		</div>
-		<div class="d-flex flex-column justify-center align-center">
-			<img
-				:src="imgUrl"
-				width="100%"
-				height="100%"
-				alt="Logo SouJunior Labs"
-				class="drag-none floating"
-			>
-		</div>
-	</v-container>
+  <v-container class="home-page d-flex flex-column">
+    <v-container class="hero-section">
+      <div>
+        <div class="d-flex flex-column">
+          <h1>Vem pro Labs!</h1>
+          <p>
+            Aqui você desenvolve produtos reais e aprimora habilidades práticas para conquistar o
+            mercado de trabalho.
+          </p>
+          <a href="https://forms.gle/uptNHWPrLn4CgqMf9" target="_blank" rel="noopener noreferrer">
+            <v-btn class="font-weight-semibold">Quero fazer parte</v-btn>
+          </a>
+        </div>
+      </div>
+      <div>
+        <img :src="imgUrl" alt="Logo SouJunior Labs" class="drag-none floating" />
+      </div>
+    </v-container>
+    <v-container class="services-section">
+      <div>
+        <h2>
+          Ingressar no mundo tech poder ser desafiador e, buscando ajudar nesse desafio, a SouJunior
+          Labs, oferece:
+        </h2>
+      </div>
+      <div class="services">
+        <section>
+          <div>
+            <section>
+              <img :src="homeIcon1" alt="" />
+            </section>
+            <p>Suporte ao desenvolvimento de novos produtos;</p>
+          </div>
+          <div>
+            <section>
+              <img :src="homeIcon2" alt="" />
+            </section>
+            <p>Aprimoramento de habilidades práticas em equipes (soft e hard skills);</p>
+          </div>
+        </section>
+        <div class="vl"></div>
+        <section>
+          <div>
+            <section>
+              <img :src="homeIcon3" alt="" />
+            </section>
+            <p>Expansão de conexões e networking;</p>
+          </div>
+          <div>
+            <section>
+              <img :src="homeIcon4" alt="" />
+            </section>
+            <p>Colaboração na construção e fortalecimento de portfólios e currículos;</p>
+          </div>
+        </section>
+      </div>
+    </v-container>
+    <v-container class="about-section">
+      <div>
+        <img :src="homeAboutIcon" alt="Sobre a SouJunior Labs" />
+      </div>
+      <div>
+        <h3>Somos uma iniciativa voluntária comprometida em criar produtos reais.</h3>
+        <p>
+          Nosso propósito é oferecer suporte àqueles que buscam experiência prática, através da
+          criação colaborativa de produtos inovadores, assim impulsionando o desenvolvimento
+          profissional dos Juniors na área tech.
+        </p>
+      </div>
+    </v-container>
+    <v-container class="howToUse-section">
+      <div>
+        <h2>A Plataforma</h2>
+        <p>
+          Nossa plataforma foi projetada para auxiliar no gerenciamento dos produtos criados na
+          SouJunior Labs. Por enquanto, ela
+          <strong>está disponível apenas para os Founders dos produtos já cadastrados,</strong> mas
+          em breve todos poderão acessá-la.
+        </p>
+        <p>
+          Se você é um Founder ativo, primeiro precisamos fazer seu cadastro. Bem simples! Na aba de
+          registro, confirme que quer realizar o cadastro e, de posse do token enviado no canal
+          dedicado aos , no Discord da Sou Junior Labs, realize o seu cadastro.
+        </p>
+        <p>
+          Não esqueça de cadastrar seu produto e squad. Como o intuito é termos um local oficial
+          para nossos produtos, é importante manter esses dados sempre atualizados. Em breve,
+          teremos mais novidades.
+        </p>
+      </div>
+      <div>
+        <img :src="howToUse" alt="" />
+      </div>
+    </v-container>
+    <v-container class="occupation-section">
+      <div>
+        <h2>Aqui, todas as áreas são bem-vindas:</h2>
+        <div class="occupation-info">
+          <p>Participe da nossa comunidade e explore diversas oportunidades disponíveis</p>
+          <a href="https://forms.gle/uptNHWPrLn4CgqMf9" target="_blank" rel="noopener noreferrer">
+            <v-btn class="font-weight-semibold">Quero fazer parte</v-btn>
+          </a>
+        </div>
+      </div>
+      <div>
+        <div class="carousel-container">
+          <swiper
+            :slides-per-view="8"
+            :space-between="30"
+            :pagination="true"
+            :navigation="{ nextEl: '.navigationNext', prevEl: '.navigationPrev' }"
+            :breakpoints="{
+              320: { slidesPerView: 2, spaceBetween: 20 },
+              640: { slidesPerView: 3, spaceBetween: 30 },
+              768: { slidesPerView: 4, spaceBetween: 35 },
+              1024: { slidesPerView: 5, spaceBetween: 40 },
+              1280: { slidesPerView: 6, spaceBetween: 45 },
+              1536: { slidesPerView: 7, spaceBetween: 50 },
+              1920: { slidesPerView: 8, spaceBetween: 60 }
+            }"
+          >
+            <swiper-slide
+              v-for="(item, index) in carouselItemsRef"
+              :key="index"
+              class="d-flex flex-column align-center"
+            >
+              <v-img :src="item.icon" width="100" height="100" />
+              <p>{{ item.title }}</p>
+            </swiper-slide>
+          </swiper>
+        </div>
+        <div class="arrow-container">
+          <v-btn icon class="navigationPrev" @click="navigationPrev">
+            <v-icon>mdi-chevron-left</v-icon>
+          </v-btn>
+          <v-btn icon class="navigationNext" @click="navigationNext">
+            <v-icon>mdi-chevron-right</v-icon>
+          </v-btn>
+        </div>
+      </div>
+    </v-container>
+    <v-container class="squad-section">
+      <h5>Conheça nossa equipe</h5>
+      <p class="squad-text">
+        No SouJunior Labs, nossa equipe é apaixonada por criar produtos inovadores que fazem a
+        diferença. Estamos comprometidos em melhorar a experiência da comunidade e em ajudar
+        profissionais iniciantes a crescerem no mercado de tecnologia. Estamos sempre prontos para
+        ouvir suas ideias e responder às suas perguntas. Sinta-se à vontade para entrar em contato
+        conosco.
+      </p>
+      <v-row>
+        <v-col
+          v-for="member in teamMembers"
+          :key="member.id"
+          cols="12"
+          md="6"
+          lg="3"
+          class="d-flex flex-column align-center"
+        >
+          <v-card class="d-flex flex-column align-center">
+            <v-img :src="member.image" width="100" height="100" />
+            <h6>{{ member.name }}</h6>
+            <p>{{ member.role }}</p>
+            <div class="d-flex align-center justify-center ga-2 mt-3">
+              <a :href="member.linkedin" target="_blank" rel="noopener noreferrer">
+                <v-img height="20" width="20" :src="squadIcon1" alt="Linkedin" />
+              </a>
+              <a :href="member.github" target="_blank" rel="noopener noreferrer">
+                <v-img height="20" width="20" :src="squadIcon2" alt="Github" />
+              </a>
+            </div>
+          </v-card>
+        </v-col>
+        <v-col cols="12" md="6" lg="12" class="d-flex flex-column align-center">
+          <v-card class="d-flex flex-column align-center">
+            <v-img :src="wouernerIcon" width="100" height="100" />
+            <h6>Wouerner Brandão</h6>
+            <p>Founder e CEO SouJunior / Tech Lead</p>
+            <div class="d-flex align-center justify-center ga-2 mt-3">
+              <a
+                href="https://www.linkedin.com/in/wouerner/"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                <v-img height="20" width="20" :src="squadIcon1" alt="Linkedin" />
+              </a>
+              <a href="https://www.github.com/wouerner" target="_blank" rel="noopener noreferrer">
+                <v-img height="20" width="20" :src="squadIcon2" alt="Github" />
+              </a>
+            </div>
+          </v-card>
+        </v-col>
+      </v-row>
+    </v-container>
+    <v-container class="contact-section">
+      <div class="contact-section d-flex flex-column align-center">
+        <hr />
+        <v-card>
+          <h2>Precisa de Ajuda?</h2>
+          <p>
+            Se estiver enfrentando alguma dificuldade ao utilizar nossa plataforma ou se possuir
+            dúvidas ou sugestões que gostaria de compartilhar, entre em contato conosco através do
+            canal "Founders only" no Discord da Sou Junior Labs. Nossa equipe ficará feliz em
+            ouvi-lo e ajudá-lo.
+          </p>
+        </v-card>
+      </div>
+    </v-container>
+    <v-footer>
+      <v-row>
+        <v-col cols="12" class="d-flex">
+          <div>
+            <a class="d-flex align-center logo">
+              <v-img height="36" width="36" :src="logo_white" alt="Logo SouJunior" />
+              <h1 class="text-h5 font-weight-bold font-semibold primary-color ml-3 logo-text">
+                SouJunior Labs
+              </h1>
+            </a>
+          </div>
+          <div>
+            <div>
+              <p>Faça parte da nossa comunidade!</p>
+            </div>
+            <div class="d-flex align-center justify-center">
+              <section>
+                <a
+                  href="https://github.com/SouJunior-Labs"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon1" alt="Github" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://forms.gle/uptNHWPrLn4CgqMf9"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon2" alt="Discord" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://www.linkedin.com/company/soujunior-labs/"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon3" alt="Linkedin" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://www.instagram.com/soujunior.tech/"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon4" alt="Instagram" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://www.youtube.com/@soujuniortech"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon5" alt="Youtube" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://twitter.com/SouJunior_Tech"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon6" alt="Twitter" />
+                </a>
+              </section>
+              <section>
+                <a
+                  href="https://www.facebook.com/people/SouJunior/100086671131030"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <v-img height="36" width="36" :src="footerIcon7" alt="Facebook" />
+                </a>
+              </section>
+            </div>
+          </div>
+        </v-col>
+      </v-row>
+    </v-footer>
+  </v-container>
 </template>
 
 <script setup>
-import imgUrl from '@/assets/logo-green-transparent.png';
+import { ref } from 'vue'
+import { Swiper, SwiperSlide } from 'swiper/vue'
+import 'swiper/css'
+import imgUrl from '@/assets/logo-green-transparent.png'
+import logo_white from '@/assets/logo-white-transparent.png'
+import homeIcon1 from '@/assets/home/icon1.png'
+import homeIcon2 from '@/assets/home/icon2.png'
+import homeIcon3 from '@/assets/home/icon3.png'
+import homeIcon4 from '@/assets/home/icon4.png'
+import homeAboutIcon from '@/assets/home/home-abouticon.png'
+import areaIcon1 from '@/assets/home/areaIcon1.png'
+import areaIcon2 from '@/assets/home/areaIcon2.png'
+import areaIcon3 from '@/assets/home/areaIcon3.png'
+import areaIcon4 from '@/assets/home/areaIcon4.png'
+import areaIcon5 from '@/assets/home/areaIcon5.png'
+import areaIcon6 from '@/assets/home/areaIcon6.png'
+import areaIcon7 from '@/assets/home/areaIcon7.png'
+import areaIcon8 from '@/assets/home/areaIcon8.png'
+import areaIcon9 from '@/assets/home/areaIcon9.png'
+import areaIcon10 from '@/assets/home/areaIcon10.png'
+import areaIcon11 from '@/assets/home/areaIcon11.png'
+import areaIcon12 from '@/assets/home/areaIcon12.png'
+import howToUse from '@/assets/home/howToUse.png'
+import footerIcon1 from '@/assets/home/Github.png'
+import footerIcon2 from '@/assets/home/Discord.png'
+import footerIcon3 from '@/assets/home/Linkedin.png'
+import footerIcon4 from '@/assets/home/Instagram.png'
+import footerIcon5 from '@/assets/home/YouTube.png'
+import footerIcon6 from '@/assets/home/Twitter.png'
+import footerIcon7 from '@/assets/home/Facebook.png'
+import squadIcon1 from '@/assets/home/squadIcon1.png'
+import squadIcon2 from '@/assets/home/squadIcon2.png'
+import djhonantanIcon from '@/assets/home/djhonantan.png'
+import inahyeIcon from '@/assets/home/inahye.png'
+import thaisIcon from '@/assets/home/thais.png'
+import thaynnaIcon from '@/assets/home/thaynna.png'
+import wouernerIcon from '@/assets/home/wouerner.png'
+
+const carouselItems = [
+  { title: 'Business', icon: areaIcon1 },
+  { title: 'Tech Recruiter', icon: areaIcon2 },
+  { title: 'Produtos', icon: areaIcon3 },
+  { title: 'Ágil', icon: areaIcon4 },
+  { title: 'Social Media', icon: areaIcon5 },
+  { title: 'UI & UX Design', icon: areaIcon6 },
+  { title: 'Front-end', icon: areaIcon7 },
+  { title: 'Back-end', icon: areaIcon8 },
+  { title: 'Data', icon: areaIcon9 },
+  { title: 'Mobile', icon: areaIcon10 },
+  { title: 'QA', icon: areaIcon11 },
+  { title: 'DevOps', icon: areaIcon12 }
+]
+const carouselItemsRef = ref(carouselItems)
+const navigationNext = () => {
+  carouselItemsRef.value = carouselItemsRef.value
+    .slice(1)
+    .concat(carouselItemsRef.value.slice(0, 1))
+}
+const navigationPrev = () => {
+  carouselItemsRef.value = carouselItemsRef.value
+    .slice(-1)
+    .concat(carouselItemsRef.value.slice(0, -1))
+}
+
+const teamMembers = [
+  {
+    id: 1,
+    name: 'Djhonantan Parreira',
+    role: 'Front-end Developer',
+    linkedin: 'https://www.linkedin.com/in/djhonantanparreira/',
+    github: 'https://www.github.com/djhonantanparreira',
+    image: djhonantanIcon
+  },
+  {
+    id: 2,
+    name: 'Inahyê Dourado',
+    role: 'Product Manager',
+    linkedin: 'https://www.linkedin.com/in/inahyedourado/',
+    github: 'https://github.com/InahyeDourado',
+    image: inahyeIcon
+  },
+  {
+    id: 3,
+    name: 'Thais Escobar',
+    role: 'Product Manager',
+    linkedin: 'https://www.linkedin.com/in/thais-escobar/',
+    github: 'https://github.com/thaisescobarf',
+    image: thaisIcon
+  },
+  {
+    id: 4,
+    name: 'Thaynná Oliveira',
+    role: 'UI/UX Designer',
+    linkedin: 'https://www.linkedin.com/in/thaygjo/',
+    github: 'https://github.com/thaygjo',
+    image: thaynnaIcon
+  }
+]
 </script>
 
 <style scoped>
-.floating {
-	animation: float 6s ease-in-out infinite;
-	filter: drop-shadow(0 0 15px #06d7a033);
+.home-page {
+  padding: 0;
+  margin-top: 50px;
+  gap: 75px;
+}
+.hero-section {
+  display: flex;
+  justify-content: space-evenly;
+  align-items: center;
+  gap: 80px;
+}
+.hero-section h1 {
+  font-family: 'Radio Canada', sans-serif;
+  font-size: 64px;
+  color: #06d7a0;
+  margin-bottom: 20px;
+}
+.hero-section p {
+  font-size: 32px;
+  font-weight: 400;
+}
+
+.hero-section .v-btn {
+  max-width: fit-content;
+  background-color: #62d4a4;
+  color: black;
+  margin-top: 10px;
 }
 
+.hero-section img {
+  @media screen and (max-width: 1300px) {
+    max-height: 300px;
+  }
+  @media screen and (max-width: 968px) {
+    max-height: 100px;
+  }
+  @media screen and (max-width: 768px) {
+    display: none;
+  }
+}
+.floating {
+  animation: float 6s ease-in-out infinite;
+  filter: drop-shadow(0 0 15px #06d7a033);
+}
 @keyframes float {
+  0%,
+  100% {
+    transform: translateY(0);
+  }
+  50% {
+    transform: translateY(-20px);
+  }
+}
+h2 {
+  font-size: 36px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 700;
+  color: #62d4a4;
+}
+h3 {
+  font-size: 32px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 700;
+  color: #62d4a4;
+}
+h4 {
+  font-size: 22px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 700;
+}
+h5 {
+  font-size: 40px;
+  font-family: 'Inter', sans-serif;
+  font-weight: 600;
+  color: #ffffff;
+}
+h6 {
+  font-size: 20px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 600;
+  color: #ffffff;
+}
+.services-section {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.services-section h2 {
+  text-align: center;
+  max-width: 1100px;
+}
+.services {
+  display: flex;
+  justify-content: space-evenly;
+  align-items: center;
+  gap: 20px;
+  margin-top: 20px;
+  @media screen and (max-width: 768px) {
+    flex-direction: column;
+  }
+}
+.services section div {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.services section div img {
+  width: 32px;
+  height: 32px;
+}
+.services section div p {
+  font-family: 'Radio Canada', sans-serif;
+  font-size: 22px;
+  font-weight: 400;
+}
+.vl {
+  border-left: 2px solid #06d7a0;
+  height: 100px;
+  margin: 0 20px;
+}
+.about-section {
+  display: flex;
+  justify-content: space-evenly;
+  align-items: center;
+  gap: 80px;
+}
+
+.about-section div {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
 
-	0%,
-	100% {
-		transform: translateY(0);
-	}
+.about-section div img {
+  width: 500px;
+  height: 500px;
+  @media screen and (max-width: 1500px) {
+    max-height: 400px;
+    max-width: 400px;
+  }
+  @media screen and (max-width: 1300px) {
+    max-height: 300px;
+    max-width: 300px;
+  }
+  @media screen and (max-width: 968px) {
+    max-height: 100px;
+    max-width: 100px;
+  }
+  @media screen and (max-width: 768px) {
+    max-height: 100px;
+    max-width: 100px;
+  }
+  @media screen and (max-width: 768px) {
+    display: none;
+  }
+}
+.about-section div p {
+  font-family: 'Inter', sans-serif;
+  font-size: 22px;
+  font-weight: 400;
+}
+.occupation-section {
+  background-color: transparent;
+}
+.occupation-section p {
+  font-family: 'Radio Canada', sans-serif;
+  font-size: 22px;
+  font-weight: 400;
+}
+.occupation-info {
+  display: flex;
+  gap: 20px;
+  margin-top: 20px;
+}
+.occupation-info p {
+  max-width: 800px;
+}
+.occupation-info .v-btn {
+  background-color: #62d4a4;
+  color: black;
+}
+.arrow-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 20px;
+}
+.navigationPrev,
+.navigationNext {
+  background-color: transparent;
+  color: #62d4a4;
+  border: 1px solid #62d4a4;
+}
+.navigationPrev:hover,
+.navigationNext:hover {
+  background-color: #62d4a4;
+  color: black;
+}
+.carousel-container {
+  text-align: center;
+  padding: 50px 0;
+}
+.carousel-container .swiper-slide {
+  background-color: #40715c;
+  border-radius: 1rem;
+  cursor: pointer;
+  padding: 10px;
+}
+.carousel-container .swiper-slide p {
+  font-size: 16px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 400;
+}
+.howToUse-section {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 20px;
+}
+
+.howToUse-section div {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  max-width: 600px;
+  @media screen and (max-width: 768px) {
+    text-align: center;
+  }
+}
+
+.howToUse-section div img {
+  max-height: 450px;
+  @media screen and (max-width: 1500px) {
+    max-height: 400px;
+  }
+  @media screen and (max-width: 1300px) {
+    display: none;
+  }
+}
+.howToUse-section div p {
+  font-family: 'Radio Canada', sans-serif;
+  font-size: 22px;
+  font-weight: 400;
+}
+.contact-section {
+  display: flex;
+  justify-content: center;
+}
+
+hr {
+  border-image: linear-gradient(to right, #60a69c, #000) 250;
+  height: 1px;
+  margin: 20px 0;
+  padding: 0;
+  width: 100%;
+}
+
+.contact-section .v-card {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  gap: 12px;
+  padding: 40px;
+  background-color: transparent;
+  text-align: center;
+  border: none;
+  box-shadow: none;
+}
+
+.contact-section .v-card p {
+  max-width: 800px;
+}
+.logo {
+  cursor: pointer;
+  transition: ease-in-out 0.2s;
+  &:hover {
+    filter: brightness(1.25);
+    transition: ease-in-out 0.2s;
+  }
+}
+.logo-text {
+  font-family: 'Radio Canada', serif !important;
+  color: white;
+}
+
+.squad-section {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.squad-section .v-row {
+  display: flex;
+  margin-top: 20px;
+}
+
+.squad-section .squad-text {
+  font-family: 'Inter', sans-serif;
+  font-size: 20px;
+  font-weight: 400;
+  margin-top: 20px;
+  max-width: 900px;
+  text-align: center;
+}
+
+.squad-section .v-card {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  gap: 3px;
+  padding: 30px 0px 20px 0px;
+  background-color: transparent;
+  text-align: center;
+  border: 1px solid #62d4a4;
+  border-radius: 8px;
+  background-color: #335445;
+}
+
+.squad-section .v-card .v-img {
+  margin-bottom: 20px;
+}
+
+.squad-section .v-card p {
+  font-size: 16px;
+  font-family: 'Radio Canada', sans-serif;
+  font-weight: 400;
+  color: #62d4a4;
+}
+
+.squad-section .v-card a {
+  cursor: pointer;
+  transition: ease-in-out 0.2s;
+  &:hover {
+    filter: brightness(1.25);
+    transition: ease-in-out 0.2s;
+  }
+}
+
+.v-footer {
+  background-color: transparent;
+  padding-bottom: 80px;
+}
 
-	50% {
-		transform: translateY(-20px);
-	}
+.v-footer .v-col {
+  align-items: center;
+  justify-content: space-between;
+  @media screen and (max-width: 768px) {
+    flex-direction: column;
+  }
 }
 
-.container-gap {
-	gap: 120px;
+.v-footer .v-col div {
+  gap: 40px;
+  margin-top: 10px;
+  @media screen and (max-width: 768px) {
+    text-align: center;
+    flex-direction: column;
+  }
 }
 
-.home-title {
-	font-family: "Radio Canada", serif !important;
-	font-size: 3.6rem;
+.v-footer p {
+  font-family: 'Radio Canada', sans-serif;
+  color: #62d4a4;
+  font-size: 32px;
+  font-weight: 700;
 }
 
-.home-body {
-	font-size: 1.4rem;
-	font-weight: 300;
+.v-footer a {
+  cursor: pointer;
+  transition: ease-in-out 0.2s;
+  &:hover {
+    filter: brightness(1.25);
+    transition: ease-in-out 0.2s;
+  }
 }
 </style>
diff --git a/src/views/user/LoginView.vue b/src/views/user/LoginView.vue
index a327c82..99a97de 100644
--- a/src/views/user/LoginView.vue
+++ b/src/views/user/LoginView.vue
@@ -1,75 +1,67 @@
 <template>
-<v-container fluid class="pa-0 d-flex align-center justify-center">
+  <v-container fluid class="pa-0 d-flex align-center justify-center">
     <v-col class="d-flex flex-grow-0 v-col-gap">
-        <img :src="imgUrl" width="auto" height="100%" alt="Logo SouJunior Labs" class="floating">
+      <img :src="imgUrl" width="auto" height="100%" alt="Logo SouJunior Labs" class="floating" />
       <v-card class="login-form secondary">
-          <p>Entrar</p>
-          <hr class="mt-1 mb-8">
-          <v-form @submit.prevent>
-            <v-text-field
-              variant="outlined"
-              v-model="user.email"
-              :rules="emailRules"
-              label="Email"
-              class="mb-2"
-            />
-            <v-text-field
-              :append-inner-icon="visible ? 'mdi-eye' : 'mdi-eye-off'"
-              :type="visible ? 'text' : 'password'"
-              @click:append-inner="visible = !visible"
-              variant="outlined"
-              v-model="user.password"
-              :rules="passwordRules"
-              label="Senha"
-            />
-            <div class="d-flex align-center justify-space-between">
-              <label>
-                <input type="checkbox" class="mr-2">
-                Lembrar-me
-              </label>
-              <a href="/">Precisa de ajuda?</a>
-            </div>
-            <hr class="mb-6 mt-8">
-            <v-btn color="primary" type="submit" block @click="submitLogin">Login</v-btn>
-            <v-btn block class="mt-2" :to="{ name: 'registry' }">Registrar</v-btn>
-          </v-form>
+        <p>Entrar</p>
+        <hr class="mt-1 mb-8" />
+        <v-form @submit.prevent>
+          <v-text-field
+            variant="outlined"
+            v-model="user.email"
+            :rules="emailRules"
+            label="Email"
+            class="mb-2"
+          />
+          <v-text-field
+            :append-inner-icon="visible ? 'mdi-eye' : 'mdi-eye-off'"
+            :type="visible ? 'text' : 'password'"
+            @click:append-inner="visible = !visible"
+            variant="outlined"
+            v-model="user.password"
+            :rules="passwordRules"
+            label="Senha"
+          />
+          <hr class="mb-6 mt-3" />
+          <v-btn color="primary" type="submit" block @click="submitLogin">Login</v-btn>
+          <v-btn block class="mt-2 cancelButton" :to="{ name: 'registry' }">Registrar</v-btn>
+        </v-form>
       </v-card>
     </v-col>
-</v-container>
+  </v-container>
 </template>
 
 <script setup>
-
 import { reactive, ref } from 'vue'
-import imgUrl from '@/assets/logo-green-transparent.png';
+import imgUrl from '@/assets/logo-green-transparent.png'
 import { useAuthStore } from '@/stores/auth'
 
-const authStore = useAuthStore();
+const authStore = useAuthStore()
 
 const user = reactive({
-  email: 'w@w.com',
-  password: '12345678'
-});
+  email: '',
+  password: ''
+})
 
 const submitLogin = async () => {
-    try {
-        await authStore.login(user);
-    } catch (error) {
-        console.log(error);
-    }
+  try {
+    await authStore.login(user)
+  } catch (error) {
+    console.log(error)
+  }
 }
 
 const emailRules = [
   (v) => !!v || 'E-mail é obrigatório',
-  (v) => /.+@.+\..+/.test(v) || 'E-mail deve ser válido',
-];
+  (v) => /.+@.+\..+/.test(v) || 'E-mail deve ser válido'
+]
 
 const passwordRules = [
   (v) => !!v || 'Senha é obrigatória',
-  (v) => v.length >= 8 || 'Senha deve ter no mínimo 8 caracteres',
-];
+  (v) => v.length >= 8 || 'Senha deve ter no mínimo 8 caracteres'
+]
 
-const visible = ref(false);
+const visible = ref(false)
 </script>
 
 <style scoped>
@@ -108,11 +100,11 @@ const visible = ref(false);
 }
 
 .login-form hr {
-  border: 1.46px solid #CBCBCB;
+  border: 1.46px solid #cbcbcb;
 }
 
 .login-form div a {
-  color: #62D4A4;
+  color: #62d4a4;
   text-decoration: none;
   font-size: 16px;
   font-family: 'Radio Canada', serif !important;
@@ -124,4 +116,14 @@ const visible = ref(false);
   font-family: 'Sora', sans-serif !important;
   font-weight: 400;
 }
-</style>
\ No newline at end of file
+
+.cancelButton {
+  border: 1px solid #62d4a4;
+  color: #325f4b;
+}
+
+.cancelButton:hover {
+  background-color: #325f4b;
+  color: #fff;
+}
+</style>
diff --git a/src/views/user/ProfileView.vue b/src/views/user/ProfileView.vue
index d17b554..7d93c55 100644
--- a/src/views/user/ProfileView.vue
+++ b/src/views/user/ProfileView.vue
@@ -1,42 +1,39 @@
 <template>
   <v-container>
     <v-row align="center" justify="center">
-        <v-col cols="6">
-            <h1 class="text-primary">Dados pessoais:</h1>
-        </v-col>
+      <v-col cols="6">
+        <h1 class="text-primary">Dados pessoais:</h1>
+      </v-col>
     </v-row>
 
     <v-row align="center" justify="center">
       <v-col cols="6">
         <v-form>
-          <v-text-field label="Nome completo *"
-                        variant="outlined"
-                        v-model="profile.name" disabled>
-          </v-text-field>
-          <v-text-field label="E-mail *"
-                        variant="outlined"
-                        v-model="profile.email">
+          <v-text-field label="Nome completo *" variant="outlined" v-model="profile.name" disabled>
           </v-text-field>
-          <v-text-field label="Cidade *"
-                        variant="outlined"
-                        v-model="profile.city" :rules="[rules.textOnly]">
+          <v-text-field label="E-mail *" variant="outlined" v-model="profile.email"> </v-text-field>
+          <v-text-field
+            label="Cidade *"
+            variant="outlined"
+            v-model="profile.city"
+            :rules="[rules.textOnly]"
+          >
           </v-text-field>
-          <v-text-field label="Estado *"
-                        variant="outlined"
-                        v-model="profile.state" :rules="[rules.textOnly]">
+          <v-text-field
+            label="Estado *"
+            variant="outlined"
+            v-model="profile.state"
+            :rules="[rules.textOnly]"
+          >
           </v-text-field>
-          <v-text-field label="Perfil do LinkedIn *"
-                        variant="outlined"
-                        v-model="profile.linkedin">
+          <v-text-field label="Perfil do LinkedIn *" variant="outlined" v-model="profile.linkedin">
           </v-text-field>
-          <v-text-field label="Perfil no Discord *"
-                        variant="outlined"
-                        v-model="profile.discord">
+          <v-text-field label="Perfil no Discord *" variant="outlined" v-model="profile.discord">
           </v-text-field>
           <v-row>
             <v-col>
               <v-btn color="primary" @click="submitProfile">Atualizar</v-btn>
-              <v-btn class="ml-3" :to="{ name: 'home' }">cancelar</v-btn>
+              <v-btn class="ml-3" :to="{ name: 'onboarding' }">Cancelar</v-btn>
             </v-col>
           </v-row>
         </v-form>
@@ -46,30 +43,30 @@
 </template>
 
 <script setup>
-import { reactive } from 'vue';
-import { useAuthStore} from '@/stores/auth.js';
+import { reactive } from 'vue'
+import { useAuthStore } from '@/stores/auth.js'
 
-const auth = useAuthStore();
+const auth = useAuthStore()
 
 const profile = reactive({
   name: auth.auth.name,
   email: auth.auth.email,
-  password: '12345678',
   city: '',
   state: '',
   linkedin: '',
   discord: ''
-});
+})
 
 const rules = {
-  textOnly: (value) => /^[a-zA-Z\sáàâãéèêíïóôõöúçñÁÀÂÃÉÈÊÍÏÓÔÕÖÚÇÑ]*$/.test(value) || 'Apenas texto é permitido.'
-};
+  textOnly: (value) =>
+    /^[a-zA-Z\sáàâãéèêíïóôõöúçñÁÀÂÃÉÈÊÍÏÓÔÕÖÚÇÑ]*$/.test(value) || 'Apenas texto é permitido.'
+}
 
 const submitProfile = async () => {
   try {
-    auth.updateProfile(profile);
+    auth.updateProfile(profile)
   } catch (error) {
-    console.log(error);
+    console.log(error)
   }
-};
+}
 </script>
diff --git a/src/views/user/RegistryView.vue b/src/views/user/RegistryView.vue
index d3e47e4..82c16cb 100644
--- a/src/views/user/RegistryView.vue
+++ b/src/views/user/RegistryView.vue
@@ -23,7 +23,9 @@
             </p>
             <v-col align="center" class="mt-6">
               <v-btn color="primary" @click="nextStep">Continuar</v-btn>
-              <v-btn class="ml-3" :to="{ name: 'home' }" @click="resetForm">Cancelar</v-btn>
+              <v-btn class="ml-3 cancelButton" :to="{ name: 'home' }" @click="resetForm"
+                >Cancelar</v-btn
+              >
             </v-col>
           </template>
           <template v-slot:item.2>
@@ -68,11 +70,12 @@
               <v-checkbox
                 label="Eu concordo com os termos e condições."
                 v-model="applicant.terms"
+                @click="dialog = true"
               ></v-checkbox>
               <v-row>
                 <v-col align="center">
                   <v-btn @click="submitApplicant" color="primary">Cadastrar-se</v-btn>
-                  <v-btn class="ml-3" :to="{ name: 'home' }" @click="resetForm">Cancelar</v-btn>
+                  <v-btn class="ml-3 cancelButton" @click="cancelForm">Cancelar</v-btn>
                 </v-col>
               </v-row>
             </v-form>
@@ -83,19 +86,37 @@
               para a pagina de login.
             </p>
             <v-col align="center" class="mt-6">
-              <v-btn color="primary" @click="redirectToLogin">Continuar</v-btn>
+              <v-btn color="primary" :to="{ name: 'login' }">Continuar</v-btn>
             </v-col>
           </template>
         </v-stepper>
       </v-col>
       <v-col cols="7" class="mt-6">
-        <v-card v-if="step === 1" class="pa-6" outlined color="primary"
+        <v-card v-if="step === 1" class="pa-6" outlined color="#325F4B"
           >No momento, o cadastro esta liberado apenas para os founders dos projetos já ativos. Mas
-          em breve esperamos ter todos por aqui. Se você é founder, confira o register_token de
-          acesso no canal do Discord exclusivo para os founders.</v-card
+          em breve esperamos ter todos por aqui. Se você é founder, confira o token de acesso no
+          canal do Discord exclusivo para os founders.</v-card
         >
       </v-col>
     </v-row>
+    <v-dialog v-model="dialog" max-width="600">
+      <v-card class="pa-3">
+        <v-card-title>Termos e Condições</v-card-title>
+        <v-card-text>
+          <p>
+            Todas as participações no SouJunior Labs são VOLUNTÁRIAS, não remuneradas e sem qualquer
+            vínculo empregatício. As participações visam, unicamente, servir de experiência ao
+            voluntário que também contribuirá com o crescimento do projeto. A SouJunior Labs não
+            garante vaga de trabalho à pessoa voluntária, embora exista a possibilidade de que
+            receba convites para oportunidades em empresas parceiras, externas e/ou recrutadores.
+          </p>
+        </v-card-text>
+        <v-card-actions class="d-flex justify-end">
+          <v-btn @click="acceptTerms" color="primary">Aceitar</v-btn>
+          <v-btn @click="rejectTerms" color="error">Cancelar</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
   </v-container>
 </template>
 
@@ -103,6 +124,9 @@
 import { ref, reactive } from 'vue'
 import { useUserStore } from '@/stores/user.js'
 import imgUrl from '@/assets/logo-green-transparent.png'
+import { useRouter } from 'vue-router'
+
+const $router = useRouter()
 
 const userStore = useUserStore()
 
@@ -173,6 +197,25 @@ const submitApplicant = async () => {
     }
   }
 }
+
+const cancelForm = () => {
+  if (confirm('Você deseja mesmo cancelar esta ação?')) {
+    resetForm()
+    $router.push({ name: 'home' })
+  }
+}
+
+const dialog = ref(false)
+
+const acceptTerms = () => {
+  applicant.terms = true
+  dialog.value = false
+}
+
+const rejectTerms = () => {
+  applicant.terms = false
+  dialog.value = false
+}
 </script>
 
 <style scoped>
@@ -197,4 +240,29 @@ const submitApplicant = async () => {
 p {
   font-size: 18px;
 }
+
+.v-text-field {
+  padding-bottom: 10px;
+}
+
+.v-stepper {
+  box-shadow: none;
+}
+
+.v-stepper :deep(.v-stepper-header) {
+  box-shadow: none;
+}
+.v-stepper :deep(.v-stepper-item__avatar) {
+  margin-inline-end: 0;
+}
+
+.cancelButton {
+  border: 1px solid #62d4a4;
+  color: #325f4b;
+}
+
+.cancelButton:hover {
+  background-color: #325f4b;
+  color: #fff;
+}
 </style>