diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000..ed9e0dc
--- /dev/null
+++ b/.env.example
@@ -0,0 +1,2 @@
+NUXT_HUB_PROJECT_URL=https://my-nuxhub.project.dev
+NUXT_HUB_PROJECT_SECRET_KEY=my-project-secret-used-in-cloudflare-env
\ No newline at end of file
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
new file mode 100644
index 0000000..e7fcddc
--- /dev/null
+++ b/.github/workflows/deploy.yml
@@ -0,0 +1,36 @@
+name: Deploy with NuxtHub CLI
+on: push
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+        name: Install pnpm
+        with:
+          run_install: false
+      - name: Install Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+      - name: Get pnpm store directory
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+      - uses: actions/cache@v4
+        name: Setup pnpm cache
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Deploy with nuxthub
+        run: npx nuxthub deploy
+        env:
+          NUXT_HUB_PROJECT_KEY: ${{ secrets.NUXT_HUB_PROJECT_KEY}}
+          NUXT_HUB_USER_TOKEN: ${{ secrets.NUXT_HUB_USER_TOKEN }}
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 4e76dcb..a3f113c 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -5,5 +5,5 @@
   "editor.quickSuggestions": {
     "strings": "on"
   },
-  "cSpell.words": ["pinia", "slideover", "Slideover"]
+  "cSpell.words": ["nuxtjs", "pinia", "slideover", "Slideover"]
 }
diff --git a/app/app.config.ts b/app/app.config.ts
index ffd489c..35c1406 100644
--- a/app/app.config.ts
+++ b/app/app.config.ts
@@ -1,8 +1,8 @@
 export default defineAppConfig({
   ui: {
     colors: {
-      primary: "rose",
-      neutral: "zinc",
+      primary: "indigo",
+      neutral: "slate",
     },
     theme: {
       transitions: "out-in",
diff --git a/app/app.vue b/app/app.vue
index fd1db59..c4500af 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
-const colorMode = useColorMode()
+import favicon from "~/assets/images/favicon.svg"
 
+const colorMode = useColorMode()
 const color = computed(() => (colorMode.value === "dark" ? "#111827" : "white"))
 
 useHead({
@@ -9,14 +10,14 @@ useHead({
     { name: "viewport", content: "width=device-width, initial-scale=1" },
     { key: "theme-color", name: "theme-color", content: color },
   ],
-  link: [{ rel: "icon", href: "/favicon.ico" }],
+  link: [{ rel: "icon", type: "image/svg+xml", href: favicon }],
   htmlAttrs: {
     lang: "en",
   },
 })
 
 useSeoMeta({
-  titleTemplate: "%s - Sinta-se acompanhado",
+  titleTemplate: "Wladi Veras  • %s",
   ogImage: "https://saas-template.nuxt.dev/social-card.png",
   twitterImage: "https://saas-template.nuxt.dev/social-card.png",
   twitterCard: "summary_large_image",
@@ -40,11 +41,13 @@ useSeoMeta({
 @import "@nuxt/ui";
 
 :root {
-  --font-family-sans: "Montserrat", sans-serif;
+  font-family: "Fira Code", "Fira Mono", "Roboto Mono", monospace;
+  --font-family-sans: "Fira Code", "Fira Mono", "Roboto Mono", monospace;
+
   --breakpoint-3xl: 1920px;
 
   --ui-primary: var(--ui-color-primary-700);
-  --ui-radius: var(--radius-xl);
+  --ui-radius: var(--radius-md);
 
   --ui-text-dimmed: var(--ui-color-neutral-400);
   --ui-text-muted: var(--ui-color-neutral-500);
diff --git a/app/assets/images/favicon.svg b/app/assets/images/favicon.svg
new file mode 100644
index 0000000..67ec23d
--- /dev/null
+++ b/app/assets/images/favicon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" zoomAndPan="magnify" viewBox="0 0 375 374.999991" height="500" preserveAspectRatio="xMidYMid meet" version="1.0"><defs><clipPath id="2d366c7b85"><path d="M 0 80.246094 L 375 80.246094 L 375 294.746094 L 0 294.746094 Z M 0 80.246094 " clip-rule="nonzero"/></clipPath></defs><g clip-path="url(#2d366c7b85)"><path fill="#000000" d="M 1.335938 90.273438 L 121.652344 291.519531 C 122.847656 293.523438 125.007812 294.75 127.34375 294.75 C 129.675781 294.75 131.835938 293.523438 133.03125 291.519531 L 187.5 200.410156 L 241.96875 291.519531 C 243.167969 293.523438 245.328125 294.75 247.660156 294.75 C 249.988281 294.75 252.148438 293.523438 253.347656 291.519531 L 373.664062 90.273438 C 374.890625 88.222656 374.917969 85.675781 373.738281 83.597656 C 372.5625 81.523438 370.359375 80.242188 367.976562 80.242188 L 307.132812 80.242188 C 304.777344 80.242188 302.601562 81.488281 301.410156 83.515625 L 253.710938 164.839844 C 251.859375 167.996094 252.917969 172.054688 256.074219 173.910156 C 259.230469 175.761719 263.292969 174.703125 265.144531 171.546875 L 310.925781 93.5 L 356.289062 93.5 L 247.660156 275.203125 L 195.222656 187.496094 L 253.347656 90.273438 C 254.574219 88.222656 254.601562 85.675781 253.421875 83.597656 C 252.246094 81.523438 250.042969 80.242188 247.660156 80.242188 L 186.8125 80.242188 C 184.460938 80.242188 182.285156 81.488281 181.097656 83.515625 L 133.394531 164.839844 C 131.542969 167.996094 132.601562 172.054688 135.757812 173.910156 C 138.914062 175.761719 142.976562 174.703125 144.828125 171.546875 L 190.609375 93.5 L 235.972656 93.5 L 181.828125 184.0625 C 181.8125 184.089844 181.792969 184.121094 181.777344 184.148438 L 127.34375 275.203125 L 18.710938 93.5 L 116.191406 93.5 L 102.859375 118.007812 C 101.113281 121.222656 102.300781 125.25 105.515625 126.996094 C 108.730469 128.746094 112.757812 127.554688 114.507812 124.34375 L 133.164062 90.039062 C 134.28125 87.984375 134.234375 85.496094 133.039062 83.484375 C 131.84375 81.472656 129.679688 80.242188 127.34375 80.242188 L 7.027344 80.242188 C 4.640625 80.242188 2.4375 81.523438 1.257812 83.597656 C 0.0820312 85.675781 0.109375 88.222656 1.335938 90.273438 " fill-opacity="1" fill-rule="nonzero"/></g></svg>
\ No newline at end of file
diff --git a/app/components/Logo.vue b/app/components/Logo.vue
new file mode 100644
index 0000000..36a9976
--- /dev/null
+++ b/app/components/Logo.vue
@@ -0,0 +1,78 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    :width="props.height"
+    zoomAndPan="magnify"
+    viewBox="0 0 375 374.999991"
+    :height="props.width"
+    :preserveAspectRatio="props.preserveAspectRatio"
+    :class="props.className"
+  >
+    <defs>
+      <clipPath id="2d366c7b85">
+        <path
+          d="M 0 80.246094 L 375 80.246094 L 375 294.746094 L 0 294.746094 Z M 0 80.246094 "
+          clip-rule="nonzero"
+        />
+      </clipPath>
+    </defs>
+    <g clip-path="url(#2d366c7b85)">
+      <path
+        :fill="props.color"
+        d="M 1.335938 90.273438 L 121.652344 291.519531 C 122.847656 293.523438 125.007812 294.75 127.34375 294.75 C 129.675781 294.75 131.835938 293.523438 133.03125 291.519531 L 187.5 200.410156 L 241.96875 291.519531 C 243.167969 293.523438 245.328125 294.75 247.660156 294.75 C 249.988281 294.75 252.148438 293.523438 253.347656 291.519531 L 373.664062 90.273438 C 374.890625 88.222656 374.917969 85.675781 373.738281 83.597656 C 372.5625 81.523438 370.359375 80.242188 367.976562 80.242188 L 307.132812 80.242188 C 304.777344 80.242188 302.601562 81.488281 301.410156 83.515625 L 253.710938 164.839844 C 251.859375 167.996094 252.917969 172.054688 256.074219 173.910156 C 259.230469 175.761719 263.292969 174.703125 265.144531 171.546875 L 310.925781 93.5 L 356.289062 93.5 L 247.660156 275.203125 L 195.222656 187.496094 L 253.347656 90.273438 C 254.574219 88.222656 254.601562 85.675781 253.421875 83.597656 C 252.246094 81.523438 250.042969 80.242188 247.660156 80.242188 L 186.8125 80.242188 C 184.460938 80.242188 182.285156 81.488281 181.097656 83.515625 L 133.394531 164.839844 C 131.542969 167.996094 132.601562 172.054688 135.757812 173.910156 C 138.914062 175.761719 142.976562 174.703125 144.828125 171.546875 L 190.609375 93.5 L 235.972656 93.5 L 181.828125 184.0625 C 181.8125 184.089844 181.792969 184.121094 181.777344 184.148438 L 127.34375 275.203125 L 18.710938 93.5 L 116.191406 93.5 L 102.859375 118.007812 C 101.113281 121.222656 102.300781 125.25 105.515625 126.996094 C 108.730469 128.746094 112.757812 127.554688 114.507812 124.34375 L 133.164062 90.039062 C 134.28125 87.984375 134.234375 85.496094 133.039062 83.484375 C 131.84375 81.472656 129.679688 80.242188 127.34375 80.242188 L 7.027344 80.242188 C 4.640625 80.242188 2.4375 81.523438 1.257812 83.597656 C 0.0820312 85.675781 0.109375 88.222656 1.335938 90.273438 "
+        :fill-opacity="props.opacity"
+        fill-rule="nonzero"
+      />
+    </g>
+  </svg>
+</template>
+
+<script setup lang="ts">
+interface Props {
+  width?: number | string
+  height?: number | string
+  color?: string
+  opacity?: number
+  preserveAspectRatio?: string
+  className?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  width: 500,
+  height: 500,
+  color: "#000000",
+  opacity: 1,
+  preserveAspectRatio: "xMidYMid meet",
+  className: "cursor-pointer hover:opacity-75 logo-animate",
+})
+</script>
+
+<style scoped>
+svg {
+  transition: all 0.3s ease;
+}
+.logo-hover:hover {
+  transform: scale(1.1);
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.2);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+.logo-animate:hover {
+  animation: pulse 2s infinite;
+}
+
+svg path {
+  transition: fill 0.3s ease;
+}
+</style>
diff --git a/app/components/Logotype.vue b/app/components/Logotype.vue
new file mode 100644
index 0000000..b8358d0
--- /dev/null
+++ b/app/components/Logotype.vue
@@ -0,0 +1,319 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    zoomAndPan="magnify"
+    version="1.0"
+    :width="props.height"
+    viewBox="0 0 401.25 190.499994"
+    :height="props.width"
+    :preserveAspectRatio="props.preserveAspectRatio"
+    :class="props.className"
+  >
+    <defs>
+      <g />
+      <clipPath id="d6f82dfa5e">
+        <path
+          d="M 106.382812 0 L 293.390625 0 L 293.390625 106.96875 L 106.382812 106.96875 Z M 106.382812 0 "
+          clip-rule="nonzero"
+        />
+      </clipPath>
+    </defs>
+    <g clip-path="url(#d6f82dfa5e)">
+      <path
+        :fill="props.color"
+        d="M 107.046875 5 L 167.050781 105.363281 C 167.644531 106.359375 168.722656 106.972656 169.886719 106.972656 C 171.050781 106.972656 172.125 106.359375 172.722656 105.363281 L 199.886719 59.925781 L 227.050781 105.363281 C 227.648438 106.359375 228.722656 106.972656 229.886719 106.972656 C 231.050781 106.972656 232.125 106.359375 232.722656 105.363281 L 292.726562 5 C 293.335938 3.980469 293.351562 2.707031 292.761719 1.671875 C 292.175781 0.636719 291.078125 0 289.886719 0 L 259.546875 0 C 258.371094 0 257.285156 0.621094 256.691406 1.632812 L 232.90625 42.1875 C 231.980469 43.761719 232.511719 45.785156 234.085938 46.710938 C 235.660156 47.632812 237.683594 47.105469 238.605469 45.53125 L 261.4375 6.609375 L 284.0625 6.609375 L 229.886719 97.222656 L 203.738281 53.484375 L 232.722656 5 C 233.335938 3.980469 233.347656 2.707031 232.761719 1.671875 C 232.175781 0.636719 231.078125 0 229.886719 0 L 199.542969 0 C 198.371094 0 197.285156 0.621094 196.691406 1.632812 L 172.90625 42.1875 C 171.980469 43.761719 172.507812 45.785156 174.082031 46.710938 C 175.65625 47.632812 177.683594 47.105469 178.605469 45.53125 L 201.4375 6.609375 L 224.058594 6.609375 L 197.058594 51.773438 C 197.050781 51.785156 197.042969 51.800781 197.03125 51.816406 L 169.886719 97.222656 L 115.714844 6.609375 L 164.324219 6.609375 L 157.679688 18.832031 C 156.804688 20.433594 157.398438 22.441406 159.003906 23.316406 C 160.605469 24.1875 162.613281 23.59375 163.484375 21.992188 L 172.789062 4.882812 C 173.347656 3.859375 173.324219 2.617188 172.726562 1.617188 C 172.132812 0.613281 171.050781 0 169.886719 0 L 109.886719 0 C 108.695312 0 107.597656 0.636719 107.011719 1.671875 C 106.421875 2.707031 106.4375 3.980469 107.046875 5 "
+        :fill-opacity="props.opacity"
+        fill-rule="nonzero"
+      />
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(70.718902, 155.614922)">
+        <g>
+          <path
+            d="M 8.75 0 L 0.484375 -27.515625 L 5.625 -27.515625 L 11.484375 -7.265625 L 17.59375 -25.921875 L 21.421875 -25.921875 L 27.515625 -7.265625 L 33.390625 -27.515625 L 38.53125 -27.515625 L 30.265625 0 L 25.5 0 L 19.5 -18.109375 L 13.515625 0 Z M 8.75 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(109.728056, 155.614922)">
+        <g>
+          <path
+            d="M 3.546875 0 L 3.546875 -27.515625 L 8.5 -27.515625 L 8.5 -4.671875 L 20.25 -4.671875 L 20.25 0 Z M 3.546875 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(130.430368, 155.614922)">
+        <g>
+          <path
+            d="M 0.234375 0 L 11.265625 -27.515625 L 14.953125 -27.515625 L 25.921875 0 L 20.59375 0 L 18.46875 -5.984375 L 7.765625 -5.984375 L 5.625 0 Z M 9.453125 -10.203125 L 16.796875 -10.203125 L 13.125 -20.25 Z M 9.453125 -10.203125 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(156.585781, 155.614922)">
+        <g>
+          <path
+            d="M 3.546875 0 L 3.546875 -27.515625 L 11.53125 -27.515625 C 14.65625 -27.515625 17.28125 -26.972656 19.40625 -25.890625 C 21.53125 -24.804688 23.132812 -23.222656 24.21875 -21.140625 C 25.300781 -19.066406 25.84375 -16.539062 25.84375 -13.5625 C 25.84375 -10.695312 25.285156 -8.253906 24.171875 -6.234375 C 23.066406 -4.222656 21.445312 -2.679688 19.3125 -1.609375 C 17.1875 -0.535156 14.578125 0 11.484375 0 Z M 8.5 -4.53125 L 11 -4.53125 C 12.519531 -4.53125 13.890625 -4.691406 15.109375 -5.015625 C 16.335938 -5.335938 17.378906 -5.859375 18.234375 -6.578125 C 19.085938 -7.296875 19.742188 -8.242188 20.203125 -9.421875 C 20.671875 -10.609375 20.90625 -12.054688 20.90625 -13.765625 C 20.90625 -15.953125 20.585938 -17.71875 19.953125 -19.0625 C 19.328125 -20.414062 18.316406 -21.40625 16.921875 -22.03125 C 15.535156 -22.664062 13.710938 -22.984375 11.453125 -22.984375 L 8.5 -22.984375 Z M 8.5 -4.53125 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(184.026569, 155.614922)">
+        <g>
+          <path
+            d="M 3.546875 0 L 3.546875 -27.515625 L 8.5 -27.515625 L 8.5 0 Z M 3.546875 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(196.062344, 155.614922)"><g /></g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(205.644223, 155.614922)">
+        <g>
+          <path
+            d="M 11.265625 0 L 0.234375 -27.515625 L 5.703125 -27.515625 L 13.125 -8.03125 L 20.515625 -27.515625 L 25.921875 -27.515625 L 14.953125 0 Z M 11.265625 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(231.799636, 155.614922)">
+        <g>
+          <path
+            d="M 3.546875 0 L 3.546875 -27.515625 L 21.859375 -27.515625 L 21.859375 -22.984375 L 8.5 -22.984375 L 8.5 -16.03125 L 20.9375 -16.03125 L 20.9375 -11.484375 L 8.5 -11.484375 L 8.5 -4.671875 L 21.859375 -4.671875 L 21.859375 0 Z M 3.546875 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(256.046465, 155.614922)">
+        <g>
+          <path
+            d="M 3.546875 0.03125 L 3.546875 -27.515625 L 12.453125 -27.515625 C 13.734375 -27.515625 14.945312 -27.335938 16.09375 -26.984375 C 17.25 -26.628906 18.265625 -26.101562 19.140625 -25.40625 C 20.015625 -24.707031 20.703125 -23.851562 21.203125 -22.84375 C 21.710938 -21.84375 21.96875 -20.703125 21.96875 -19.421875 C 21.96875 -18.265625 21.738281 -17.210938 21.28125 -16.265625 C 20.820312 -15.316406 20.1875 -14.5 19.375 -13.8125 C 18.5625 -13.132812 17.632812 -12.613281 16.59375 -12.25 L 24.25 0.03125 L 18.578125 0.03125 L 11.796875 -11.765625 L 8.5 -11.765625 L 8.5 0.03125 Z M 8.53125 -15.796875 L 12.890625 -15.796875 C 14.203125 -15.859375 15.226562 -16.207031 15.96875 -16.84375 C 16.707031 -17.476562 17.078125 -18.3125 17.078125 -19.34375 C 17.078125 -20.488281 16.664062 -21.398438 15.84375 -22.078125 C 15.019531 -22.753906 13.898438 -23.09375 12.484375 -23.09375 L 8.53125 -23.09375 Z M 8.53125 -15.796875 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(280.741226, 155.614922)">
+        <g>
+          <path
+            d="M 0.234375 0 L 11.265625 -27.515625 L 14.953125 -27.515625 L 25.921875 0 L 20.59375 0 L 18.46875 -5.984375 L 7.765625 -5.984375 L 5.625 0 Z M 9.453125 -10.203125 L 16.796875 -10.203125 L 13.125 -20.25 Z M 9.453125 -10.203125 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(306.89664, 155.614922)">
+        <g>
+          <path
+            d="M 11.40625 0.3125 C 10.1875 0.3125 8.992188 0.144531 7.828125 -0.1875 C 6.671875 -0.53125 5.609375 -1.035156 4.640625 -1.703125 C 3.671875 -2.367188 2.851562 -3.207031 2.1875 -4.21875 C 1.53125 -5.238281 1.09375 -6.421875 0.875 -7.765625 L 5.78125 -9.015625 C 5.894531 -7.867188 6.222656 -6.929688 6.765625 -6.203125 C 7.304688 -5.484375 7.984375 -4.945312 8.796875 -4.59375 C 9.617188 -4.25 10.515625 -4.078125 11.484375 -4.078125 C 12.472656 -4.078125 13.300781 -4.226562 13.96875 -4.53125 C 14.644531 -4.84375 15.15625 -5.265625 15.5 -5.796875 C 15.851562 -6.335938 16.03125 -6.929688 16.03125 -7.578125 C 16.03125 -8.285156 15.84375 -8.894531 15.46875 -9.40625 C 15.09375 -9.914062 14.585938 -10.351562 13.953125 -10.71875 C 13.328125 -11.09375 12.617188 -11.4375 11.828125 -11.75 C 11.035156 -12.070312 10.21875 -12.394531 9.375 -12.71875 C 8.53125 -13.050781 7.707031 -13.425781 6.90625 -13.84375 C 6.113281 -14.269531 5.40625 -14.769531 4.78125 -15.34375 C 4.15625 -15.925781 3.648438 -16.625 3.265625 -17.4375 C 2.890625 -18.25 2.703125 -19.210938 2.703125 -20.328125 C 2.703125 -21.554688 2.929688 -22.640625 3.390625 -23.578125 C 3.847656 -24.515625 4.472656 -25.304688 5.265625 -25.953125 C 6.066406 -26.609375 6.984375 -27.101562 8.015625 -27.4375 C 9.046875 -27.769531 10.140625 -27.9375 11.296875 -27.9375 C 12.992188 -27.9375 14.578125 -27.546875 16.046875 -26.765625 C 17.515625 -25.992188 18.722656 -24.769531 19.671875 -23.09375 L 15.5625 -20.59375 C 15.082031 -21.519531 14.453125 -22.238281 13.671875 -22.75 C 12.890625 -23.269531 12.039062 -23.53125 11.125 -23.53125 C 10.46875 -23.53125 9.875 -23.40625 9.34375 -23.15625 C 8.820312 -22.914062 8.410156 -22.570312 8.109375 -22.125 C 7.804688 -21.6875 7.65625 -21.175781 7.65625 -20.59375 C 7.65625 -19.9375 7.84375 -19.378906 8.21875 -18.921875 C 8.59375 -18.460938 9.09375 -18.0625 9.71875 -17.71875 C 10.351562 -17.375 11.066406 -17.046875 11.859375 -16.734375 C 12.648438 -16.429688 13.46875 -16.113281 14.3125 -15.78125 C 15.15625 -15.457031 15.972656 -15.078125 16.765625 -14.640625 C 17.554688 -14.210938 18.265625 -13.703125 18.890625 -13.109375 C 19.523438 -12.523438 20.03125 -11.816406 20.40625 -10.984375 C 20.789062 -10.148438 20.984375 -9.164062 20.984375 -8.03125 C 20.984375 -6.726562 20.734375 -5.5625 20.234375 -4.53125 C 19.734375 -3.5 19.039062 -2.617188 18.15625 -1.890625 C 17.28125 -1.171875 16.265625 -0.625 15.109375 -0.25 C 13.953125 0.125 12.71875 0.3125 11.40625 0.3125 Z M 11.40625 0.3125 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(58.958174, 178.478595)">
+        <g>
+          <path
+            d="M 4.828125 0.140625 C 4.347656 0.140625 3.882812 0.078125 3.4375 -0.046875 C 2.988281 -0.179688 2.578125 -0.378906 2.203125 -0.640625 C 1.835938 -0.910156 1.53125 -1.238281 1.28125 -1.625 C 1.03125 -2.019531 0.863281 -2.476562 0.78125 -3 L 1.828125 -3.328125 C 1.890625 -2.773438 2.066406 -2.316406 2.359375 -1.953125 C 2.648438 -1.597656 3.007812 -1.332031 3.4375 -1.15625 C 3.875 -0.976562 4.335938 -0.890625 4.828125 -0.890625 C 5.328125 -0.890625 5.765625 -0.96875 6.140625 -1.125 C 6.523438 -1.289062 6.828125 -1.539062 7.046875 -1.875 C 7.265625 -2.21875 7.375 -2.660156 7.375 -3.203125 C 7.375 -3.609375 7.289062 -3.957031 7.125 -4.25 C 6.96875 -4.539062 6.75 -4.789062 6.46875 -5 C 6.195312 -5.21875 5.890625 -5.414062 5.546875 -5.59375 C 5.203125 -5.769531 4.84375 -5.9375 4.46875 -6.09375 C 4.101562 -6.25 3.75 -6.414062 3.40625 -6.59375 C 3.0625 -6.78125 2.753906 -6.988281 2.484375 -7.21875 C 2.210938 -7.457031 1.992188 -7.738281 1.828125 -8.0625 C 1.660156 -8.394531 1.578125 -8.785156 1.578125 -9.234375 C 1.578125 -9.671875 1.660156 -10.070312 1.828125 -10.4375 C 1.992188 -10.8125 2.21875 -11.128906 2.5 -11.390625 C 2.789062 -11.648438 3.125 -11.851562 3.5 -12 C 3.882812 -12.144531 4.296875 -12.21875 4.734375 -12.21875 C 5.429688 -12.21875 6.054688 -12.066406 6.609375 -11.765625 C 7.171875 -11.472656 7.632812 -11.019531 8 -10.40625 L 7.171875 -9.828125 C 6.921875 -10.316406 6.578125 -10.671875 6.140625 -10.890625 C 5.703125 -11.117188 5.234375 -11.234375 4.734375 -11.234375 C 4.378906 -11.234375 4.046875 -11.15625 3.734375 -11 C 3.421875 -10.851562 3.164062 -10.640625 2.96875 -10.359375 C 2.78125 -10.085938 2.6875 -9.753906 2.6875 -9.359375 C 2.6875 -9.003906 2.765625 -8.695312 2.921875 -8.4375 C 3.085938 -8.175781 3.304688 -7.945312 3.578125 -7.75 C 3.859375 -7.5625 4.171875 -7.382812 4.515625 -7.21875 C 4.859375 -7.050781 5.210938 -6.878906 5.578125 -6.703125 C 5.953125 -6.535156 6.3125 -6.351562 6.65625 -6.15625 C 7 -5.957031 7.304688 -5.726562 7.578125 -5.46875 C 7.859375 -5.207031 8.078125 -4.894531 8.234375 -4.53125 C 8.398438 -4.175781 8.484375 -3.757812 8.484375 -3.28125 C 8.484375 -2.757812 8.390625 -2.289062 8.203125 -1.875 C 8.023438 -1.457031 7.769531 -1.097656 7.4375 -0.796875 C 7.113281 -0.492188 6.726562 -0.257812 6.28125 -0.09375 C 5.832031 0.0625 5.347656 0.140625 4.828125 0.140625 Z M 4.828125 0.140625 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(74.732611, 178.478595)">
+        <g>
+          <path
+            d="M 6.421875 0.171875 C 5.710938 0.171875 5.070312 0.0664062 4.5 -0.140625 C 3.925781 -0.359375 3.429688 -0.660156 3.015625 -1.046875 C 2.597656 -1.429688 2.25 -1.878906 1.96875 -2.390625 C 1.6875 -2.910156 1.476562 -3.476562 1.34375 -4.09375 C 1.207031 -4.707031 1.140625 -5.351562 1.140625 -6.03125 C 1.140625 -6.695312 1.207031 -7.335938 1.34375 -7.953125 C 1.476562 -8.566406 1.6875 -9.132812 1.96875 -9.65625 C 2.25 -10.175781 2.597656 -10.625 3.015625 -11 C 3.429688 -11.382812 3.925781 -11.679688 4.5 -11.890625 C 5.070312 -12.109375 5.710938 -12.21875 6.421875 -12.21875 C 7.148438 -12.21875 7.796875 -12.109375 8.359375 -11.890625 C 8.929688 -11.679688 9.425781 -11.382812 9.84375 -11 C 10.269531 -10.625 10.625 -10.175781 10.90625 -9.65625 C 11.1875 -9.132812 11.394531 -8.566406 11.53125 -7.953125 C 11.675781 -7.335938 11.75 -6.695312 11.75 -6.03125 C 11.75 -5.351562 11.675781 -4.707031 11.53125 -4.09375 C 11.394531 -3.476562 11.1875 -2.910156 10.90625 -2.390625 C 10.625 -1.878906 10.269531 -1.429688 9.84375 -1.046875 C 9.425781 -0.660156 8.929688 -0.359375 8.359375 -0.140625 C 7.796875 0.0664062 7.148438 0.171875 6.421875 0.171875 Z M 6.421875 -0.90625 C 7.023438 -0.90625 7.5625 -0.992188 8.03125 -1.171875 C 8.5 -1.359375 8.898438 -1.613281 9.234375 -1.9375 C 9.566406 -2.257812 9.835938 -2.632812 10.046875 -3.0625 C 10.265625 -3.5 10.421875 -3.96875 10.515625 -4.46875 C 10.617188 -4.96875 10.671875 -5.488281 10.671875 -6.03125 C 10.671875 -6.550781 10.617188 -7.0625 10.515625 -7.5625 C 10.421875 -8.070312 10.265625 -8.539062 10.046875 -8.96875 C 9.835938 -9.394531 9.566406 -9.769531 9.234375 -10.09375 C 8.898438 -10.425781 8.5 -10.679688 8.03125 -10.859375 C 7.5625 -11.046875 7.023438 -11.140625 6.421875 -11.140625 C 5.835938 -11.140625 5.3125 -11.046875 4.84375 -10.859375 C 4.382812 -10.679688 3.988281 -10.425781 3.65625 -10.09375 C 3.320312 -9.769531 3.046875 -9.394531 2.828125 -8.96875 C 2.617188 -8.539062 2.460938 -8.070312 2.359375 -7.5625 C 2.265625 -7.0625 2.21875 -6.550781 2.21875 -6.03125 C 2.21875 -5.363281 2.296875 -4.722656 2.453125 -4.109375 C 2.617188 -3.492188 2.867188 -2.945312 3.203125 -2.46875 C 3.546875 -1.988281 3.984375 -1.609375 4.515625 -1.328125 C 5.046875 -1.046875 5.679688 -0.90625 6.421875 -0.90625 Z M 6.421875 -0.90625 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(93.97379, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 9.390625 -12.046875 L 9.390625 -11.078125 L 3.015625 -11.078125 L 3.015625 -6.5 L 8.640625 -6.5 L 8.640625 -5.5625 L 3.015625 -5.5625 L 3.015625 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(110.446685, 178.478595)">
+        <g>
+          <path
+            d="M 4.734375 0 L 4.734375 -11.140625 L 0.59375 -11.140625 L 0.59375 -12.046875 L 10.03125 -12.046875 L 10.03125 -11.140625 L 5.890625 -11.140625 L 5.890625 0 Z M 4.734375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(127.439168, 178.478595)">
+        <g>
+          <path
+            d="M 4.0625 0 L 0.734375 -12.046875 L 1.90625 -12.046875 L 4.828125 -1.28125 L 7.90625 -11.34375 L 8.84375 -11.34375 L 11.9375 -1.28125 L 14.859375 -12.046875 L 16.015625 -12.046875 L 12.6875 0 L 11.359375 0 L 8.40625 -9.46875 L 5.390625 0 Z M 4.0625 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(150.555947, 178.478595)">
+        <g>
+          <path
+            d="M 0.640625 0 L 5.09375 -12.046875 L 5.984375 -12.046875 L 10.40625 0 L 9.171875 0 L 8.265625 -2.609375 L 2.8125 -2.609375 L 1.90625 0 Z M 3.203125 -3.703125 L 7.875 -3.703125 L 5.546875 -10.34375 Z M 3.203125 -3.703125 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(167.965802, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0.015625 L 1.859375 -12.03125 L 5.203125 -12.03125 C 5.722656 -12.03125 6.207031 -11.953125 6.65625 -11.796875 C 7.101562 -11.648438 7.492188 -11.429688 7.828125 -11.140625 C 8.160156 -10.859375 8.414062 -10.515625 8.59375 -10.109375 C 8.78125 -9.703125 8.875 -9.242188 8.875 -8.734375 C 8.875 -8.179688 8.765625 -7.6875 8.546875 -7.25 C 8.335938 -6.820312 8.035156 -6.46875 7.640625 -6.1875 C 7.253906 -5.90625 6.796875 -5.710938 6.265625 -5.609375 L 9.515625 0.015625 L 8.140625 0.015625 L 5.125 -5.453125 L 3.015625 -5.453125 L 3.015625 0.015625 Z M 3.03125 -6.5625 L 5.421875 -6.5625 C 5.867188 -6.582031 6.269531 -6.675781 6.625 -6.84375 C 6.976562 -7.007812 7.253906 -7.25 7.453125 -7.5625 C 7.660156 -7.882812 7.765625 -8.28125 7.765625 -8.75 C 7.765625 -9.226562 7.648438 -9.632812 7.421875 -9.96875 C 7.203125 -10.3125 6.898438 -10.570312 6.515625 -10.75 C 6.140625 -10.925781 5.707031 -11.015625 5.21875 -11.015625 L 3.03125 -11.015625 Z M 3.03125 -6.5625 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(184.626091, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 9.609375 -12.046875 L 9.609375 -11.078125 L 3.015625 -11.078125 L 3.015625 -6.5 L 8.65625 -6.5 L 8.65625 -5.5625 L 3.015625 -5.5625 L 3.015625 -1.03125 L 9.609375 -1.03125 L 9.609375 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(201.533389, 178.478595)"><g /></g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(212.614514, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 9.609375 -12.046875 L 9.609375 -11.078125 L 3.015625 -11.078125 L 3.015625 -6.5 L 8.65625 -6.5 L 8.65625 -5.5625 L 3.015625 -5.5625 L 3.015625 -1.03125 L 9.609375 -1.03125 L 9.609375 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(229.521812, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 3.765625 -12.046875 L 8.984375 -0.890625 L 8.984375 -12.046875 L 10.140625 -12.046875 L 10.140625 0 L 8.203125 0 L 3.03125 -11.171875 L 3.03125 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(247.894172, 178.478595)">
+        <g>
+          <path
+            d="M 6.453125 0.171875 C 5.546875 0.171875 4.753906 0.0078125 4.078125 -0.3125 C 3.410156 -0.632812 2.863281 -1.082031 2.4375 -1.65625 C 2.007812 -2.226562 1.6875 -2.890625 1.46875 -3.640625 C 1.257812 -4.390625 1.15625 -5.1875 1.15625 -6.03125 C 1.15625 -6.707031 1.222656 -7.351562 1.359375 -7.96875 C 1.492188 -8.582031 1.703125 -9.148438 1.984375 -9.671875 C 2.265625 -10.191406 2.613281 -10.640625 3.03125 -11.015625 C 3.457031 -11.398438 3.953125 -11.695312 4.515625 -11.90625 C 5.085938 -12.125 5.726562 -12.234375 6.4375 -12.234375 C 7.5625 -12.234375 8.53125 -11.960938 9.34375 -11.421875 C 10.15625 -10.890625 10.785156 -10.113281 11.234375 -9.09375 L 10.171875 -8.625 C 9.796875 -9.414062 9.289062 -10.03125 8.65625 -10.46875 C 8.03125 -10.90625 7.285156 -11.125 6.421875 -11.125 C 5.691406 -11.125 5.066406 -10.988281 4.546875 -10.71875 C 4.023438 -10.445312 3.59375 -10.078125 3.25 -9.609375 C 2.914062 -9.140625 2.671875 -8.601562 2.515625 -8 C 2.359375 -7.40625 2.28125 -6.773438 2.28125 -6.109375 C 2.28125 -5.421875 2.359375 -4.765625 2.515625 -4.140625 C 2.679688 -3.515625 2.929688 -2.957031 3.265625 -2.46875 C 3.597656 -1.988281 4.03125 -1.609375 4.5625 -1.328125 C 5.09375 -1.054688 5.722656 -0.921875 6.453125 -0.921875 C 6.992188 -0.921875 7.5 -1.007812 7.96875 -1.1875 C 8.4375 -1.375 8.847656 -1.640625 9.203125 -1.984375 C 9.566406 -2.335938 9.851562 -2.773438 10.0625 -3.296875 C 10.269531 -3.816406 10.375 -4.414062 10.375 -5.09375 L 7.609375 -5.09375 L 7.609375 -5.984375 L 11.421875 -5.984375 L 11.421875 0 L 10.453125 0 L 10.484375 -2.3125 C 10.367188 -2 10.195312 -1.695312 9.96875 -1.40625 C 9.738281 -1.113281 9.453125 -0.847656 9.109375 -0.609375 C 8.765625 -0.367188 8.367188 -0.175781 7.921875 -0.03125 C 7.484375 0.101562 6.992188 0.171875 6.453125 0.171875 Z M 6.453125 0.171875 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(267.067203, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 3.015625 -12.046875 L 3.015625 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(278.318685, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 3.765625 -12.046875 L 8.984375 -0.890625 L 8.984375 -12.046875 L 10.140625 -12.046875 L 10.140625 0 L 8.203125 0 L 3.03125 -11.171875 L 3.03125 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(296.691044, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 9.609375 -12.046875 L 9.609375 -11.078125 L 3.015625 -11.078125 L 3.015625 -6.5 L 8.65625 -6.5 L 8.65625 -5.5625 L 3.015625 -5.5625 L 3.015625 -1.03125 L 9.609375 -1.03125 L 9.609375 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(313.598342, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0 L 1.859375 -12.046875 L 9.609375 -12.046875 L 9.609375 -11.078125 L 3.015625 -11.078125 L 3.015625 -6.5 L 8.65625 -6.5 L 8.65625 -5.5625 L 3.015625 -5.5625 L 3.015625 -1.03125 L 9.609375 -1.03125 L 9.609375 0 Z M 1.859375 0 "
+          />
+        </g>
+      </g>
+    </g>
+    <g :fill="props.color" :fill-opacity="props.opacity">
+      <g transform="translate(330.50564, 178.478595)">
+        <g>
+          <path
+            d="M 1.859375 0.015625 L 1.859375 -12.03125 L 5.203125 -12.03125 C 5.722656 -12.03125 6.207031 -11.953125 6.65625 -11.796875 C 7.101562 -11.648438 7.492188 -11.429688 7.828125 -11.140625 C 8.160156 -10.859375 8.414062 -10.515625 8.59375 -10.109375 C 8.78125 -9.703125 8.875 -9.242188 8.875 -8.734375 C 8.875 -8.179688 8.765625 -7.6875 8.546875 -7.25 C 8.335938 -6.820312 8.035156 -6.46875 7.640625 -6.1875 C 7.253906 -5.90625 6.796875 -5.710938 6.265625 -5.609375 L 9.515625 0.015625 L 8.140625 0.015625 L 5.125 -5.453125 L 3.015625 -5.453125 L 3.015625 0.015625 Z M 3.03125 -6.5625 L 5.421875 -6.5625 C 5.867188 -6.582031 6.269531 -6.675781 6.625 -6.84375 C 6.976562 -7.007812 7.253906 -7.25 7.453125 -7.5625 C 7.660156 -7.882812 7.765625 -8.28125 7.765625 -8.75 C 7.765625 -9.226562 7.648438 -9.632812 7.421875 -9.96875 C 7.203125 -10.3125 6.898438 -10.570312 6.515625 -10.75 C 6.140625 -10.925781 5.707031 -11.015625 5.21875 -11.015625 L 3.03125 -11.015625 Z M 3.03125 -6.5625 "
+          />
+        </g>
+      </g>
+    </g>
+  </svg>
+</template>
+<script setup lang="ts">
+interface Props {
+  width?: number | string
+  height?: number | string
+  color?: string
+  opacity?: number
+  preserveAspectRatio?: string
+  className?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  width: 500,
+  height: 500,
+  color: "#000000",
+  opacity: 1,
+  preserveAspectRatio: "xMidYMid meet",
+  className: "cursor-pointer hover:opacity-75 logo-animate",
+})
+</script>
+
+<style scoped>
+svg {
+  transition: all 0.3s ease;
+}
+.logo-hover:hover {
+  transform: scale(1.1);
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.2);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+.logo-animate:hover {
+  animation: pulse 2s infinite;
+}
+
+svg path {
+  transition: fill 0.3s ease;
+}
+</style>
diff --git a/app/components/default/Header.vue b/app/components/default/Header.vue
index 8ed9ab4..46779f2 100644
--- a/app/components/default/Header.vue
+++ b/app/components/default/Header.vue
@@ -1,115 +1,103 @@
 <template>
-  <div class="hidden md:flex">
-    <UNavigationMenu
-      highlight
-      :items="navigation"
-      orientation="horizontal"
-      class="data-[orientation=horizontal]:border-b data-[orientation=vertical]:border-l border-[var(--ui-border)]"
-      trailing-icon="i-lucide-arrow-down"
-      color="primary"
-    >
-      <template #logo-label>
-        <div class="flex align-center justify-center items-center min-h-full">
-          <img
-            src="https://icon-sets.iconify.design/assets/logo-text-dark.svg"
-            class="h-8"
-          />
-        </div>
-      </template>
-    </UNavigationMenu>
-  </div>
-  <div
-    class="flex md:hidden m-1 border-b border-gray-200 flex items-center justify-between w-full h-14 p-2"
+  <header
+    ref="header"
+    class="fixed w-full top-0 z-50 transition-transform duration-300 backdrop-blur-sm"
+    :class="{ '-translate-y-full': isHeaderHidden }"
   >
-    <UIcon
-      name="line-md:menu"
-      class="cursor-pointer"
-      size="2rem"
-      @click="open"
-    />
-    <div class="flex-grow flex justify-center">
-      <img
-        src="https://icon-sets.iconify.design/assets/logo-text-dark.svg"
-        class="h-8"
+    <div class="hidden md:flex">
+      <UNavigationMenu
+        highlight
+        :items="navigationMenu"
+        orientation="horizontal"
+        class="data-[orientation=horizontal]:border-b data-[orientation=vertical]:border-l border-[var(--ui-border)]"
+        trailing-icon="i-lucide-arrow-down"
+        color="primary"
+      >
+        <template #logo-label>
+          <div class="flex align-center justify-center items-center min-h-full">
+            <Logo width="50" height="50" color="#4f46e5" alt="Logo" />
+          </div>
+        </template>
+
+        <template #resume-label>
+          <UButton
+            icon="mdi:resume"
+            variant="outline"
+            size="xl"
+            class="text-indigo-500 border-1 border-indigo-500/100 cursor-pointer"
+          >
+            Currículo
+          </UButton>
+        </template>
+      </UNavigationMenu>
+    </div>
+
+    <div
+      class="flex md:hidden m-1 border-b border-gray-800 flex items-center justify-between w-full h-14 p-2"
+    >
+      <UIcon
+        name="line-md:menu"
+        class="cursor-pointer"
+        color="neutral"
+        size="2rem"
+        @click="open"
       />
+      <div class="flex-grow flex justify-center">
+        <Logo width="50" height="50" color="#4f46e5" />
+      </div>
+      <DefaultSearch />
     </div>
-    <UIcon name="line-md:search" size="2rem" />
-  </div>
+  </header>
 </template>
 
 <script lang="ts" setup>
-import { SlideoverNavigation } from "#components"
-
-const count = ref(0)
+import { ModalNavigationMenu } from "#components"
 
 const slideover = useSlideover()
+const header = ref(null)
+const isHeaderHidden = ref(false)
+const lastScrollPosition = ref(0)
+const scrollThreshold = 100
 
-function open() {
-  count.value++
+onMounted(() => {
+  window.addEventListener("scroll", handleScroll)
+})
 
-  slideover.open(SlideoverNavigation, {
-    title: "Slideover",
-    count: count.value,
-  })
+onUnmounted(() => {
+  window.removeEventListener("scroll", handleScroll)
+})
+
+const handleScroll = () => {
+  const currentScrollPosition = window.scrollY
+
+  // Don't do anything if we haven't scrolled enough
+  if (
+    Math.abs(currentScrollPosition - lastScrollPosition.value) < scrollThreshold
+  ) {
+    return
+  }
+
+  // Show header when scrolling up or at top
+  if (
+    currentScrollPosition < lastScrollPosition.value ||
+    currentScrollPosition < 50
+  ) {
+    isHeaderHidden.value = false
+  }
+  // Hide header when scrolling down and not at top
+  else if (
+    currentScrollPosition > lastScrollPosition.value &&
+    currentScrollPosition > 50
+  ) {
+    isHeaderHidden.value = true
+  }
+
+  lastScrollPosition.value = currentScrollPosition
 }
 
-const navigation = ref([
-  [
-    {
-      slot: "logo",
-    },
-    {
-      label: "Link 1",
-      icon: "i-lucide-book-open",
-      to: "/",
-      active: true,
-      children: [
-        {
-          label: "Algo",
-          description: "Descrição.",
-          icon: "i-lucide-house",
-        },
-      ],
-    },
-    {
-      label: "Link 2",
-      icon: "i-lucide-book-open",
-      to: "/ss",
-      children: [
-        {
-          label: "Algo",
-          description: "Descrição.",
-          icon: "i-lucide-house",
-        },
-      ],
-    },
-    {
-      label: "Link 3",
-      icon: "i-lucide-book-open",
-      to: "/ssss",
-      children: [
-        {
-          label: "Algo",
-          description: "Descrição.",
-          icon: "i-lucide-house",
-        },
-      ],
-    },
-  ],
-  [
-    {
-      icon: "i-simple-icons-github",
-      badge: "3.8k",
-      to: "#",
-      target: "_blank",
-    },
-    {
-      label: "Ajuda",
-      icon: "i-lucide-circle-help",
-      disabled: true,
-    },
-  ],
-])
+function open() {
+  slideover.open(ModalNavigationMenu)
+}
 </script>
 
 <style></style>
diff --git a/app/components/default/Search.vue b/app/components/default/Search.vue
new file mode 100644
index 0000000..bcd40e6
--- /dev/null
+++ b/app/components/default/Search.vue
@@ -0,0 +1,65 @@
+<template>
+  <UDrawer :handle="false">
+    <UButton
+      color="neutral"
+      variant="link"
+      size="xl"
+      class="cursor-pointer mr-2"
+      icon="line-md:search"
+    />
+    <template #content>
+      <UCommandPalette
+        v-model:search-term="searchTerm"
+        :loading="status === 'pending'"
+        :groups="groups"
+        placeholder="Pesquisar Projetos..."
+        class="h-80"
+      />
+    </template>
+  </UDrawer>
+</template>
+
+<script lang="ts" setup>
+const searchTerm = ref("")
+
+const { data: projects, status } = await useFetch(
+  "https://6733eeb1a042ab85d118670a.mockapi.io/api/v1/projects",
+  {
+    params: { q: searchTerm },
+    transform: (
+      data: {
+        id: number
+        email: string
+        createdAt: string
+        project: string
+        project_image: string
+      }[]
+    ) => {
+      return (
+        data?.map((project) => ({
+          id: project.id,
+          label: project.project,
+          suffix: FormatDate(project.createdAt),
+          avatar: {
+            src: project.project_image,
+          },
+        })) || []
+      )
+    },
+    lazy: true,
+  }
+)
+
+const groups = computed(() => [
+  {
+    id: "projects",
+    label: searchTerm.value
+      ? `Pesquisando o projeto “${searchTerm.value}”...`
+      : "Projetos",
+    items: projects.value || [],
+    filter: false,
+  },
+])
+</script>
+
+<style></style>
diff --git a/app/components/modal/NavigationMenu.vue b/app/components/modal/NavigationMenu.vue
new file mode 100644
index 0000000..7036a94
--- /dev/null
+++ b/app/components/modal/NavigationMenu.vue
@@ -0,0 +1,38 @@
+<template>
+  <UDrawer direction="left" :ui="{ container: 'max-w-xl mx-auto' }">
+    <template #body>
+      <div
+        class="flex align-center justify-center items-center w-full min-w-[20rem]"
+      >
+        <Logotype
+          width="200"
+          height="200"
+          color="#4f46e5"
+          alt="Logo"
+          class="center"
+        />
+      </div>
+      <UNavigationMenu
+        orientation="vertical"
+        :items="navigationMenu"
+        class="data-[orientation=vertical]:w-auto"
+      >
+      </UNavigationMenu>
+    </template>
+
+    <template #footer>
+      <UButton
+        icon="mdi:resume"
+        variant="outline"
+        size="xl"
+        class="text-indigo-500 border-1 border-indigo-500/100 m-auto"
+      >
+        Currículo
+      </UButton>
+    </template>
+  </UDrawer>
+</template>
+
+<script setup lang="ts">
+const slideover = useSlideover()
+</script>
diff --git a/app/components/slideover/Navigation.vue b/app/components/slideover/Navigation.vue
deleted file mode 100644
index dc744bb..0000000
--- a/app/components/slideover/Navigation.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<template>
-  <USlideover
-    side="left"
-    :description="`This slideover was opened programmatically ${count} times`"
-  >
-    <template #body>
-      <Placeholder class="h-full" />
-    </template>
-
-    <template #footer>
-      <UButton color="neutral" label="Close" @click="slideover.close()" />
-    </template>
-  </USlideover>
-</template>
-
-<script setup lang="ts">
-const slideover = useSlideover()
-
-defineProps<{
-  count: number
-}>()
-</script>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index d5476ad..c1a5e9a 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -1,71 +1,32 @@
 <template>
-  <section class="max-w-[40rem] mt-20">
-    <h2 class="text-5xl font-semibold">
-      A <span class="text-rose-400">maior plataforma</span> de acompanhantes do
-      Brasil
+  <section class="hero max-w-[62rem] mt-50" aria-labelledby="main-heading">
+    <span class="text-indigo-500">Olá, eu me chamo</span>
+
+    <h1 id="main-heading" class="text-5xl font-bold text-slate-300 mt-2 mb-2">
+      Wladi <span class="underline decoration-indigo-500">Veras</span>
+    </h1>
+
+    <h2
+      id="main-heading"
+      class="text-5xl font-bold text-current text-slate-500"
+    >
+      Crio soluções para a web.
     </h2>
-    <p class="text-2xl max-w-[40rem] mt-5">
-      Fatal Model é <b>respeito</b>, <b>segurança</b> e <b>dignidade</b>.
-    </p>
-  </section>
 
-  <section></section>
+    <div class="text-1xl gap-2 max-w-[40rem] mt-5 text-slate-300 mt-10">
+      <p>
+        Sou especializado em criar soluções digitais robustas e de alta
+        qualidade. Com mais de 8 anos de experiência, trabalhei em projetos como
+        o chatbot e o gateway de pagamento, focando sempre na segurança,
+        escalabilidade e na entrega de produtos que atendem às necessidades dos
+        usuários.
+      </p>
+    </div>
+  </section>
 
   <UCard class="mt-20">
     <template #header>
-      <div class="space-y-4 space-x-4 text-center">
-        <UModal title="Modal with title">
-          <UButton
-            label="Open"
-            color="neutral"
-            variant="subtle"
-            trailing-icon="i-lucide-chevron-up"
-          />
-
-          <template #body>
-            <Placeholder class="h-48" />
-          </template>
-        </UModal>
-        <UDrawer direction="left">
-          <UButton
-            label="Open"
-            color="neutral"
-            variant="subtle"
-            trailing-icon="i-lucide-chevron-up"
-          />
-
-          <template #content>
-            <Placeholder class="w-96 m-4" />
-          </template>
-        </UDrawer>
-
-        <UDrawer direction="right">
-          <UButton
-            label="Open"
-            color="neutral"
-            variant="subtle"
-            trailing-icon="i-lucide-chevron-up"
-          />
-
-          <template #content>
-            <Placeholder class="w-96 m-4" />
-          </template>
-        </UDrawer>
-
-        <UDrawer should-scale-background>
-          <UButton
-            class="mt-3"
-            label="Open"
-            color="neutral"
-            variant="subtle"
-            trailing-icon="i-lucide-chevron-up"
-          />
-
-          <template #content>
-            <Placeholder class="h-48 m-4" />
-          </template>
-        </UDrawer>
-      </div>
+      <div class="space-y-4 space-x-4 text-center">xx</div>
     </template>
     <div class="flex justify-center items-center">
       <div class="flex flex-col items-center gap-4">
@@ -117,7 +78,7 @@ definePageMeta({
 })
 
 useSeoMeta({
-  title: "Top Models",
+  title: "Desenvolvedor Fullstack",
 })
 
 const schema = z.object({
diff --git a/app/utils/FormatDate.ts b/app/utils/FormatDate.ts
new file mode 100644
index 0000000..b082b74
--- /dev/null
+++ b/app/utils/FormatDate.ts
@@ -0,0 +1,4 @@
+export default (date: Date | string | number): string => {
+  const dateObj = new Date(date)
+  return dateObj.toISOString().split("T")[0]
+}
diff --git a/app/utils/navigationMenu.ts b/app/utils/navigationMenu.ts
new file mode 100644
index 0000000..35a3659
--- /dev/null
+++ b/app/utils/navigationMenu.ts
@@ -0,0 +1,50 @@
+import { componentNames } from "./../../.nuxt/components.d"
+export const navigationMenu = ref([
+  [
+    {
+      slot: "logo",
+    },
+    {
+      label: "Sobre",
+      icon: "i-lucide-book-open",
+      active: true,
+    },
+    {
+      label: "Experiência",
+      icon: "i-lucide-book-open",
+    },
+    {
+      label: "Projetos",
+      icon: "i-lucide-book-open",
+
+      children: [
+        {
+          label: "Projeto 1",
+          description: "Descrição.",
+          icon: "i-lucide-house",
+        },
+        {
+          label: "Projeto 2",
+          description: "Descrição.",
+          icon: "i-lucide-house",
+        },
+        {
+          label: "Projeto 3",
+          description: "Descrição.",
+          icon: "i-lucide-house",
+        },
+        {
+          label: "Projeto 4",
+          description: "Descrição.",
+          icon: "i-lucide-house",
+        },
+      ],
+    },
+  ],
+  [
+    {
+      slot: "resume",
+      disabled: false,
+    },
+  ],
+])
diff --git a/bun.lockb b/bun.lockb
index f45c014..21f84c4 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 0de5461..068a5cf 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,12 +1,26 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  modules: ["@nuxt/ui", "@pinia/nuxt"],
+  modules: ["@nuxt/ui", "@pinia/nuxt", "@nuxthub/core"],
+
   srcDir: "app/",
 
+  hub: {
+    remote: true,
+    ai: false,
+    blob: true,
+    database: true
+  }
+  
+  nitro: {
+    experimental: {
+      openAPI: true
+    }
+  },
+
   colorMode: {
-    preference: "light",
+    preference: "dark",
   },
-  devtools: { enabled: true },
 
+  devtools: { enabled: true },
   compatibilityDate: "2024-04-03",
-})
+})
\ No newline at end of file
diff --git a/package.json b/package.json
index 3c99a36..b72dce7 100644
--- a/package.json
+++ b/package.json
@@ -13,12 +13,17 @@
     "postinstall": "nuxt prepare"
   },
   "dependencies": {
-    "@nuxt/ui": "^3.0.0-alpha.7",
+    "@nuxt/ui": "^3.0.0-alpha.8",
+    "@nuxthub/core": "^0.8.7",
+    "@nuxtjs/i18n": "^9.0.0",
     "@pinia/nuxt": "^0.7.0",
     "nuxt": "^3.14.159",
-    "tailwindcss": "^4.0.0-alpha.31",
+    "tailwindcss": "^4.0.0-alpha.33",
     "vue": "latest",
     "vue-router": "latest",
     "zod": "^3.23.8"
+  },
+  "devDependencies": {
+    "wrangler": "^3.86.1"
   }
 }