diff --git a/components/header/Header.tsx b/components/header/Header.tsx
index aa5918f..bccf5b3 100644
--- a/components/header/Header.tsx
+++ b/components/header/Header.tsx
@@ -78,6 +78,8 @@ function Header({
   const platform = usePlatform();
   const items = navItems ?? [];
 
+  // console.log('Header - items: ', items)
+
   return (
     <>
       <header style={{ height: headerHeight }}>
@@ -86,7 +88,7 @@ function Header({
           searchbar={searchbar}
           platform={platform}
         >
-          <div class="bg-base-100 fixed w-full z-50">
+          <div class="fixed w-full z-50 n1-header__desktop">
             {alerts && alerts.length > 0 && <Alert alerts={alerts} />}
             <Navbar
               items={items}
diff --git a/components/header/ItemWhatsapp.tsx b/components/header/ItemWhatsapp.tsx
new file mode 100644
index 0000000..eeb182a
--- /dev/null
+++ b/components/header/ItemWhatsapp.tsx
@@ -0,0 +1,19 @@
+import LinkButtonWithArrow from '$store/components/ui/LinkButtonWithArrow.tsx';
+
+interface Props{
+    nameItemScape?: string | undefined;
+    url?: string  | undefined;
+    name?: string  | undefined;
+}
+
+function ItemWhatsapp( { nameItemScape, url, name }: Props ){
+    return(
+        <>
+          <li class={`group flex items-center n1-font-size--16 uppercase is-${nameItemScape}`}>
+            <LinkButtonWithArrow url={url} name={name} />
+          </li>        
+        </>
+    )
+}
+
+export default ItemWhatsapp;
\ No newline at end of file
diff --git a/components/header/NavItem.tsx b/components/header/NavItem.tsx
index 4d0460c..ed7286c 100644
--- a/components/header/NavItem.tsx
+++ b/components/header/NavItem.tsx
@@ -1,57 +1,133 @@
 import type { SiteNavigationElement } from "apps/commerce/types.ts";
 import Image from "apps/website/components/Image.tsx";
 import { headerHeight } from "./constants.ts";
+import ItemWhatsapp from '$store/components/header/ItemWhatsapp.tsx';
 
 function NavItem({ item }: { item: SiteNavigationElement }) {
   const { url, name, children } = item;
   const image = item?.image?.[0];
+  const nameItemScape = item?.name?.replaceAll(/\s/g, '-').toLowerCase();
+  const itemWhatsapp = nameItemScape === 'whatsapp' ? nameItemScape : null;
+  const itemLegend = nameItemScape === 'legenda' ? nameItemScape : null;
 
+  // console.log('Navitem - item: ', item?.name?.replaceAll(/\s/g, '-').toLowerCase())
+  // console.log('----> ', itemWhatsapp)
+  
   return (
-    <li class="group flex items-center">
-      <a href={url} class="py-6">
-        <span class="group-hover:underline text-xs font-thin">
-          {name}
-        </span>
-      </a>
+    <>
+      {itemWhatsapp ? 
+        (  
+          <ItemWhatsapp nameItemScape={nameItemScape} url={url} name={name} />
+        )
+        : itemLegend ?
+        (  
+          // <ItemLegend nameItemScape={nameItemScape} url={url} name={name} />
+          <>
+            <li class={`group flex items-center n1-font-size--16 uppercase is-${nameItemScape}`}>
+            <img class="w-[36px] h-[24px]" src='/image/header-sub-menu-pt-br.png' />
+              <a href={url} class="overflow-y-hidden h-5">
+                <span class="-translate-y-5 group-hover:translate-y-0 transition-all text-xs font-thin flex moveFromTop duration-500">
+                  {/* {name} */}
+                </span>
+                <span class="-translate-y-5 group-hover:translate-y-5 transition-all text-xs font-thin flex moveFromTop duration-500">
+                  {/* {name} */}
+                </span>
+              </a>
 
-      {children && children.length > 0 &&
+              {children && children.length > 0 &&
+                (
+                  <div
+                    class="fixed hidden hover:flex group-hover:flex bg-base-100 z-50 items-start justify-center gap-6 border-t border-b-2 border-base-200 w-screen"
+                    style={{ top: "0px", left: "0px", marginTop: headerHeight }}
+                  >
+                    {image?.url && (
+                      <Image
+                        class="p-6"
+                        src={image.url}
+                        alt={image.alternateName}
+                        width={300}
+                        height={332}
+                        loading="lazy"
+                      />
+                    )}
+                    <ul class="flex items-start justify-center gap-6">
+                      {children.map((node) => (
+                        <li class="p-6">
+                          <a class="hover:underline" href={node.url}>
+                            <span>{node.name}</span>
+                          </a>
+
+                          <ul class="flex flex-col gap-1 mt-4">
+                            {node.children?.map((leaf) => (
+                              <li>
+                                <a class="hover:underline" href={leaf.url}>
+                                  <span class="text-xs">{leaf.name}</span>
+                                </a>
+                              </li>
+                            ))}
+                          </ul>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
+                )
+              } 
+            </li>           
+          </>
+        )
+        :
         (
-          <div
-            class="fixed hidden hover:flex group-hover:flex bg-base-100 z-50 items-start justify-center gap-6 border-t border-b-2 border-base-200 w-screen"
-            style={{ top: "0px", left: "0px", marginTop: headerHeight }}
-          >
-            {image?.url && (
-              <Image
-                class="p-6"
-                src={image.url}
-                alt={image.alternateName}
-                width={300}
-                height={332}
-                loading="lazy"
-              />
-            )}
-            <ul class="flex items-start justify-center gap-6">
-              {children.map((node) => (
-                <li class="p-6">
-                  <a class="hover:underline" href={node.url}>
-                    <span>{node.name}</span>
-                  </a>
+          <li class={`group flex justify-between n1-font-size--16 uppercase is-${nameItemScape} items-center pt-3`}>
+            <a href={url} class="overflow-y-hidden h-5">
+              <span class="-translate-y-5 group-hover:translate-y-0 transition-all text-xs flex moveFromTop duration-500 font-black">
+                {name}
+              </span>
+              <span class="-translate-y-5 group-hover:translate-y-5 transition-all text-xs flex moveFromTop duration-500 font-black">
+                {name}
+              </span>
+            </a>
 
-                  <ul class="flex flex-col gap-1 mt-4">
-                    {node.children?.map((leaf) => (
-                      <li>
-                        <a class="hover:underline" href={leaf.url}>
-                          <span class="text-xs">{leaf.name}</span>
+            {children && children.length > 0 &&
+              (
+                <div
+                  class="fixed hidden hover:flex group-hover:flex bg-base-100 z-50 items-start justify-center gap-6 border-t border-b-2 border-base-200 w-screen"
+                  style={{ top: "0px", left: "0px", marginTop: headerHeight }}
+                >
+                  {image?.url && (
+                    <Image
+                      class="p-6"
+                      src={image.url}
+                      alt={image.alternateName}
+                      width={300}
+                      height={332}
+                      loading="lazy"
+                    />
+                  )}
+                  <ul class="flex items-start justify-center gap-6">
+                    {children.map((node) => (
+                      <li class="p-6">
+                        <a class="hover:underline" href={node.url}>
+                          <span>{node.name}</span>
                         </a>
+
+                        <ul class="flex flex-col gap-1 mt-4">
+                          {node.children?.map((leaf) => (
+                            <li>
+                              <a class="hover:underline" href={leaf.url}>
+                                <span class="text-xs">{leaf.name}</span>
+                              </a>
+                            </li>
+                          ))}
+                        </ul>
                       </li>
                     ))}
                   </ul>
-                </li>
-              ))}
-            </ul>
-          </div>
-        )}
-    </li>
+                </div>
+              )}
+          </li>
+        )
+      }
+    </>
   );
 }
 
diff --git a/components/header/Navbar.tsx b/components/header/Navbar.tsx
index 3017a19..3253847 100644
--- a/components/header/Navbar.tsx
+++ b/components/header/Navbar.tsx
@@ -24,6 +24,8 @@ function Navbar({ items, searchbar, logo, buttons, logoPosition = "left" }: {
 }) {
   const platform = usePlatform();
 
+  // console.log('Navibar - items: ', items)
+
   return (
     <>
       {/* Mobile Version */}
@@ -60,9 +62,9 @@ function Navbar({ items, searchbar, logo, buttons, logoPosition = "left" }: {
       </div>
 
       {/* Desktop Version */}
-      <div class="hidden lg:grid lg:grid-cols-3 items-center border-b border-base-200 w-full px-6">
+      <div class="hidden lg:grid lg:n1-grid-cols-3 items-center w-full py-6 n1-container">
         <ul
-          class={`flex gap-6 col-span-1 ${
+          class={`flex gap-8 col-span-1 ${
             logoPosition === "left" ? "justify-center" : "justify-start"
           }`}
         >
diff --git a/components/ui/LinkButtonWithArrow.tsx b/components/ui/LinkButtonWithArrow.tsx
new file mode 100644
index 0000000..a68dc74
--- /dev/null
+++ b/components/ui/LinkButtonWithArrow.tsx
@@ -0,0 +1,21 @@
+interface Props{
+    url?: string  | undefined;
+    name?: string  | undefined;
+}
+
+function LinkButtonWithArrow( {url, name}:Props ){
+    return(
+        <a href={url} class="btn bg-accent n1-btn-header-item--rounded">
+            <span class="text-primary n1-font-size--16">
+                {name}
+            </span>
+            <div class="rounded-[50%] p-[5px] bg-[#F8BC33]">
+                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
+                    <path fill-rule="evenodd" clip-rule="evenodd" d="M5.83333 5.83333C5.83333 5.3731 6.20643 5 6.66667 5H14.1667C14.6269 5 15 5.3731 15 5.83333V13.3333C15 13.7936 14.6269 14.1667 14.1667 14.1667C13.7064 14.1667 13.3333 13.7936 13.3333 13.3333V7.84518L6.42259 14.7559C6.09715 15.0814 5.56951 15.0814 5.24408 14.7559C4.91864 14.4305 4.91864 13.9028 5.24408 13.5774L12.1548 6.66667H6.66667C6.20643 6.66667 5.83333 6.29357 5.83333 5.83333Z" fill="#0C1F59"/>
+                </svg>
+            </div>
+        </a>        
+    )
+}
+
+export default LinkButtonWithArrow;
\ No newline at end of file
diff --git a/constants.tsx b/constants.tsx
index 6231505..5d8ca31 100644
--- a/constants.tsx
+++ b/constants.tsx
@@ -462,7 +462,7 @@ export const buttonClasses = {
   "Default": "",
   "Primary": "btn-primary",
   "Secondary": "btn-secondary",
-  "Tertiary": "btn-accent",
+  "Tertiary": "btn-accent bg-[#F6AB00]",
 };
 
 export function getButtonClasses(style: ButtonType) {
diff --git a/manifest.gen.ts b/manifest.gen.ts
index de4a21d..312ac8a 100644
--- a/manifest.gen.ts
+++ b/manifest.gen.ts
@@ -4,58 +4,58 @@
 
 import * as $$$0 from "./loaders/Layouts/ProductCard.tsx";
 import * as $$$1 from "./loaders/List/Sections.tsx";
-import * as $$$$$$0 from "./sections/Gallery.tsx";
-import * as $$$$$$1 from "./sections/Footer/Footer.tsx";
-import * as $$$$$$2 from "./sections/Category/CategoryBanner.tsx";
-import * as $$$$$$3 from "./sections/Category/CategoryList.tsx";
-import * as $$$$$$4 from "./sections/Category/CategoryGrid.tsx";
-import * as $$$$$$5 from "./sections/Images/ShoppableBanner.tsx";
-import * as $$$$$$6 from "./sections/Images/BannerGrid.tsx";
-import * as $$$$$$7 from "./sections/Images/ImageGallery.tsx";
-import * as $$$$$$8 from "./sections/Images/Carousel.tsx";
-import * as $$$$$$9 from "./sections/Layout/Container.tsx";
-import * as $$$$$$10 from "./sections/Layout/Grid.tsx";
-import * as $$$$$$11 from "./sections/Layout/Flex.tsx";
-import * as $$$$$$12 from "./sections/Layout/GridItem.tsx";
-import * as $$$$$$13 from "./sections/Cards/ImageCardsCarousel.tsx";
-import * as $$$$$$14 from "./sections/Cards/IconCardsCarouselWithImage.tsx";
-import * as $$$$$$15 from "./sections/Cards/ImageCardsCarouselWithImage.tsx";
-import * as $$$$$$16 from "./sections/Cards/IconCardsCarousel.tsx";
-import * as $$$$$$17 from "./sections/Animation/Animation.tsx";
-import * as $$$$$$18 from "./sections/Content/Hero.tsx";
-import * as $$$$$$19 from "./sections/Content/Features.tsx";
-import * as $$$$$$20 from "./sections/Content/Intro.tsx";
-import * as $$$$$$21 from "./sections/Content/BlogPosts.tsx";
-import * as $$$$$$22 from "./sections/Content/TextWithImage.tsx";
-import * as $$$$$$23 from "./sections/Content/RichText.tsx";
-import * as $$$$$$24 from "./sections/Content/Partners.tsx";
-import * as $$$$$$25 from "./sections/Content/Testimonials.tsx";
-import * as $$$$$$26 from "./sections/Content/Logos.tsx";
-import * as $$$$$$27 from "./sections/Content/CallToAction.tsx";
-import * as $$$$$$28 from "./sections/Content/Table.tsx";
-import * as $$$$$$29 from "./sections/Content/Faq.tsx";
-import * as $$$$$$30 from "./sections/Content/Benefits.tsx";
-import * as $$$$$$31 from "./sections/Content/ImageSection.tsx";
-import * as $$$$$$32 from "./sections/Product/Wishlist.tsx";
-import * as $$$$$$33 from "./sections/Product/NotFoundChallenge.tsx";
-import * as $$$$$$34 from "./sections/Product/SearchResult.tsx";
-import * as $$$$$$35 from "./sections/Product/ProductInfo.tsx";
-import * as $$$$$$36 from "./sections/Product/ProductShelf.tsx";
-import * as $$$$$$37 from "./sections/Product/ImageGallerySlider.tsx";
-import * as $$$$$$38 from "./sections/Product/ImageGalleryFrontBack.tsx";
-import * as $$$$$$39 from "./sections/Product/ShelfWithImage.tsx";
-import * as $$$$$$40 from "./sections/Product/ProductShelfTabbed.tsx";
+import * as $$$$$$0 from "./sections/Animation/Animation.tsx";
+import * as $$$$$$1 from "./sections/Cards/IconCardsCarousel.tsx";
+import * as $$$$$$2 from "./sections/Cards/IconCardsCarouselWithImage.tsx";
+import * as $$$$$$3 from "./sections/Cards/ImageCardsCarousel.tsx";
+import * as $$$$$$4 from "./sections/Cards/ImageCardsCarouselWithImage.tsx";
+import * as $$$$$$5 from "./sections/Category/CategoryBanner.tsx";
+import * as $$$$$$6 from "./sections/Category/CategoryGrid.tsx";
+import * as $$$$$$7 from "./sections/Category/CategoryList.tsx";
+import * as $$$$$$8 from "./sections/Content/Benefits.tsx";
+import * as $$$$$$9 from "./sections/Content/BlogPosts.tsx";
+import * as $$$$$$10 from "./sections/Content/CallToAction.tsx";
+import * as $$$$$$11 from "./sections/Content/Faq.tsx";
+import * as $$$$$$12 from "./sections/Content/Features.tsx";
+import * as $$$$$$13 from "./sections/Content/Hero.tsx";
+import * as $$$$$$14 from "./sections/Content/ImageSection.tsx";
+import * as $$$$$$15 from "./sections/Content/Intro.tsx";
+import * as $$$$$$16 from "./sections/Content/Logos.tsx";
+import * as $$$$$$17 from "./sections/Content/Partners.tsx";
+import * as $$$$$$18 from "./sections/Content/RichText.tsx";
+import * as $$$$$$19 from "./sections/Content/Table.tsx";
+import * as $$$$$$20 from "./sections/Content/Testimonials.tsx";
+import * as $$$$$$21 from "./sections/Content/TextWithImage.tsx";
+import * as $$$$$$22 from "./sections/Footer/Footer.tsx";
+import * as $$$$$$23 from "./sections/Gallery.tsx";
+import * as $$$$$$24 from "./sections/Header/Header.tsx";
+import * as $$$$$$25 from "./sections/Images/BannerGrid.tsx";
+import * as $$$$$$26 from "./sections/Images/Carousel.tsx";
+import * as $$$$$$27 from "./sections/Images/ImageGallery.tsx";
+import * as $$$$$$28 from "./sections/Images/ShoppableBanner.tsx";
+import * as $$$$$$29 from "./sections/Layout/Container.tsx";
+import * as $$$$$$30 from "./sections/Layout/Flex.tsx";
+import * as $$$$$$31 from "./sections/Layout/Grid.tsx";
+import * as $$$$$$32 from "./sections/Layout/GridItem.tsx";
+import * as $$$$$$33 from "./sections/Links/LinkTree.tsx";
+import * as $$$$$$34 from "./sections/Links/Shortcuts.tsx";
+import * as $$$$$$35 from "./sections/Miscellaneous/CampaignTimer.tsx";
+import * as $$$$$$36 from "./sections/Miscellaneous/CookieConsent.tsx";
+import * as $$$$$$37 from "./sections/Miscellaneous/Slide.tsx";
+import * as $$$$$$38 from "./sections/Newsletter/Newsletter.tsx";
+import * as $$$$$$39 from "./sections/Product/ImageGalleryFrontBack.tsx";
+import * as $$$$$$40 from "./sections/Product/ImageGallerySlider.tsx";
 import * as $$$$$$41 from "./sections/Product/NotFound.tsx";
-import * as $$$$$$42 from "./sections/Miscellaneous/CampaignTimer.tsx";
-import * as $$$$$$43 from "./sections/Miscellaneous/CookieConsent.tsx";
-import * as $$$$$$44 from "./sections/Miscellaneous/Slide.tsx";
-import * as $$$$$$45 from "./sections/Social/WhatsApp.tsx";
-import * as $$$$$$46 from "./sections/Social/InstagramPosts.tsx";
-import * as $$$$$$47 from "./sections/Theme/Theme.tsx";
-import * as $$$$$$48 from "./sections/Links/LinkTree.tsx";
-import * as $$$$$$49 from "./sections/Links/Shortcuts.tsx";
-import * as $$$$$$50 from "./sections/Newsletter/Newsletter.tsx";
-import * as $$$$$$51 from "./sections/Header/Header.tsx";
+import * as $$$$$$42 from "./sections/Product/NotFoundChallenge.tsx";
+import * as $$$$$$43 from "./sections/Product/ProductInfo.tsx";
+import * as $$$$$$44 from "./sections/Product/ProductShelf.tsx";
+import * as $$$$$$45 from "./sections/Product/ProductShelfTabbed.tsx";
+import * as $$$$$$46 from "./sections/Product/SearchResult.tsx";
+import * as $$$$$$47 from "./sections/Product/ShelfWithImage.tsx";
+import * as $$$$$$48 from "./sections/Product/Wishlist.tsx";
+import * as $$$$$$49 from "./sections/Social/InstagramPosts.tsx";
+import * as $$$$$$50 from "./sections/Social/WhatsApp.tsx";
+import * as $$$$$$51 from "./sections/Theme/Theme.tsx";
 import * as $$$$$$$$$$$0 from "./apps/decohub.ts";
 import * as $$$$$$$$$$$1 from "./apps/site.ts";
 
@@ -65,61 +65,60 @@ const manifest = {
     "deco-sites/agencian1/loaders/List/Sections.tsx": $$$1,
   },
   "sections": {
-    "deco-sites/agencian1/sections/Animation/Animation.tsx": $$$$$$17,
-    "deco-sites/agencian1/sections/Cards/IconCardsCarousel.tsx": $$$$$$16,
+    "deco-sites/agencian1/sections/Animation/Animation.tsx": $$$$$$0,
+    "deco-sites/agencian1/sections/Cards/IconCardsCarousel.tsx": $$$$$$1,
     "deco-sites/agencian1/sections/Cards/IconCardsCarouselWithImage.tsx":
-      $$$$$$14,
-    "deco-sites/agencian1/sections/Cards/ImageCardsCarousel.tsx": $$$$$$13,
+      $$$$$$2,
+    "deco-sites/agencian1/sections/Cards/ImageCardsCarousel.tsx": $$$$$$3,
     "deco-sites/agencian1/sections/Cards/ImageCardsCarouselWithImage.tsx":
-      $$$$$$15,
-    "deco-sites/agencian1/sections/Category/CategoryBanner.tsx": $$$$$$2,
-    "deco-sites/agencian1/sections/Category/CategoryGrid.tsx": $$$$$$4,
-    "deco-sites/agencian1/sections/Category/CategoryList.tsx": $$$$$$3,
-    "deco-sites/agencian1/sections/Content/Benefits.tsx": $$$$$$30,
-    "deco-sites/agencian1/sections/Content/BlogPosts.tsx": $$$$$$21,
-    "deco-sites/agencian1/sections/Content/CallToAction.tsx": $$$$$$27,
-    "deco-sites/agencian1/sections/Content/Faq.tsx": $$$$$$29,
-    "deco-sites/agencian1/sections/Content/Features.tsx": $$$$$$19,
-    "deco-sites/agencian1/sections/Content/Hero.tsx": $$$$$$18,
-    "deco-sites/agencian1/sections/Content/ImageSection.tsx": $$$$$$31,
-    "deco-sites/agencian1/sections/Content/Intro.tsx": $$$$$$20,
-    "deco-sites/agencian1/sections/Content/Logos.tsx": $$$$$$26,
-    "deco-sites/agencian1/sections/Content/Partners.tsx": $$$$$$24,
-    "deco-sites/agencian1/sections/Content/RichText.tsx": $$$$$$23,
-    "deco-sites/agencian1/sections/Content/Table.tsx": $$$$$$28,
-    "deco-sites/agencian1/sections/Content/Testimonials.tsx": $$$$$$25,
-    "deco-sites/agencian1/sections/Content/TextWithImage.tsx": $$$$$$22,
-    "deco-sites/agencian1/sections/Footer/Footer.tsx": $$$$$$1,
-    "deco-sites/agencian1/sections/Gallery.tsx": $$$$$$0,
-    "deco-sites/agencian1/sections/Header/Header.tsx": $$$$$$51,
-    "deco-sites/agencian1/sections/Images/BannerGrid.tsx": $$$$$$6,
-    "deco-sites/agencian1/sections/Images/Carousel.tsx": $$$$$$8,
-    "deco-sites/agencian1/sections/Images/ImageGallery.tsx": $$$$$$7,
-    "deco-sites/agencian1/sections/Images/ShoppableBanner.tsx": $$$$$$5,
-    "deco-sites/agencian1/sections/Layout/Container.tsx": $$$$$$9,
-    "deco-sites/agencian1/sections/Layout/Flex.tsx": $$$$$$11,
-    "deco-sites/agencian1/sections/Layout/Grid.tsx": $$$$$$10,
-    "deco-sites/agencian1/sections/Layout/GridItem.tsx": $$$$$$12,
-    "deco-sites/agencian1/sections/Links/LinkTree.tsx": $$$$$$48,
-    "deco-sites/agencian1/sections/Links/Shortcuts.tsx": $$$$$$49,
-    "deco-sites/agencian1/sections/Miscellaneous/CampaignTimer.tsx": $$$$$$42,
-    "deco-sites/agencian1/sections/Miscellaneous/CookieConsent.tsx": $$$$$$43,
-    "deco-sites/agencian1/sections/Miscellaneous/Slide.tsx": $$$$$$44,
-    "deco-sites/agencian1/sections/Newsletter/Newsletter.tsx": $$$$$$50,
-    "deco-sites/agencian1/sections/Product/ImageGalleryFrontBack.tsx":
-      $$$$$$38,
-    "deco-sites/agencian1/sections/Product/ImageGallerySlider.tsx": $$$$$$37,
+      $$$$$$4,
+    "deco-sites/agencian1/sections/Category/CategoryBanner.tsx": $$$$$$5,
+    "deco-sites/agencian1/sections/Category/CategoryGrid.tsx": $$$$$$6,
+    "deco-sites/agencian1/sections/Category/CategoryList.tsx": $$$$$$7,
+    "deco-sites/agencian1/sections/Content/Benefits.tsx": $$$$$$8,
+    "deco-sites/agencian1/sections/Content/BlogPosts.tsx": $$$$$$9,
+    "deco-sites/agencian1/sections/Content/CallToAction.tsx": $$$$$$10,
+    "deco-sites/agencian1/sections/Content/Faq.tsx": $$$$$$11,
+    "deco-sites/agencian1/sections/Content/Features.tsx": $$$$$$12,
+    "deco-sites/agencian1/sections/Content/Hero.tsx": $$$$$$13,
+    "deco-sites/agencian1/sections/Content/ImageSection.tsx": $$$$$$14,
+    "deco-sites/agencian1/sections/Content/Intro.tsx": $$$$$$15,
+    "deco-sites/agencian1/sections/Content/Logos.tsx": $$$$$$16,
+    "deco-sites/agencian1/sections/Content/Partners.tsx": $$$$$$17,
+    "deco-sites/agencian1/sections/Content/RichText.tsx": $$$$$$18,
+    "deco-sites/agencian1/sections/Content/Table.tsx": $$$$$$19,
+    "deco-sites/agencian1/sections/Content/Testimonials.tsx": $$$$$$20,
+    "deco-sites/agencian1/sections/Content/TextWithImage.tsx": $$$$$$21,
+    "deco-sites/agencian1/sections/Footer/Footer.tsx": $$$$$$22,
+    "deco-sites/agencian1/sections/Gallery.tsx": $$$$$$23,
+    "deco-sites/agencian1/sections/Header/Header.tsx": $$$$$$24,
+    "deco-sites/agencian1/sections/Images/BannerGrid.tsx": $$$$$$25,
+    "deco-sites/agencian1/sections/Images/Carousel.tsx": $$$$$$26,
+    "deco-sites/agencian1/sections/Images/ImageGallery.tsx": $$$$$$27,
+    "deco-sites/agencian1/sections/Images/ShoppableBanner.tsx": $$$$$$28,
+    "deco-sites/agencian1/sections/Layout/Container.tsx": $$$$$$29,
+    "deco-sites/agencian1/sections/Layout/Flex.tsx": $$$$$$30,
+    "deco-sites/agencian1/sections/Layout/Grid.tsx": $$$$$$31,
+    "deco-sites/agencian1/sections/Layout/GridItem.tsx": $$$$$$32,
+    "deco-sites/agencian1/sections/Links/LinkTree.tsx": $$$$$$33,
+    "deco-sites/agencian1/sections/Links/Shortcuts.tsx": $$$$$$34,
+    "deco-sites/agencian1/sections/Miscellaneous/CampaignTimer.tsx": $$$$$$35,
+    "deco-sites/agencian1/sections/Miscellaneous/CookieConsent.tsx": $$$$$$36,
+    "deco-sites/agencian1/sections/Miscellaneous/Slide.tsx": $$$$$$37,
+    "deco-sites/agencian1/sections/Newsletter/Newsletter.tsx": $$$$$$38,
+    "deco-sites/agencian1/sections/Product/ImageGalleryFrontBack.tsx": $$$$$$39,
+    "deco-sites/agencian1/sections/Product/ImageGallerySlider.tsx": $$$$$$40,
     "deco-sites/agencian1/sections/Product/NotFound.tsx": $$$$$$41,
-    "deco-sites/agencian1/sections/Product/NotFoundChallenge.tsx": $$$$$$33,
-    "deco-sites/agencian1/sections/Product/ProductInfo.tsx": $$$$$$35,
-    "deco-sites/agencian1/sections/Product/ProductShelf.tsx": $$$$$$36,
-    "deco-sites/agencian1/sections/Product/ProductShelfTabbed.tsx": $$$$$$40,
-    "deco-sites/agencian1/sections/Product/SearchResult.tsx": $$$$$$34,
-    "deco-sites/agencian1/sections/Product/ShelfWithImage.tsx": $$$$$$39,
-    "deco-sites/agencian1/sections/Product/Wishlist.tsx": $$$$$$32,
-    "deco-sites/agencian1/sections/Social/InstagramPosts.tsx": $$$$$$46,
-    "deco-sites/agencian1/sections/Social/WhatsApp.tsx": $$$$$$45,
-    "deco-sites/agencian1/sections/Theme/Theme.tsx": $$$$$$47,
+    "deco-sites/agencian1/sections/Product/NotFoundChallenge.tsx": $$$$$$42,
+    "deco-sites/agencian1/sections/Product/ProductInfo.tsx": $$$$$$43,
+    "deco-sites/agencian1/sections/Product/ProductShelf.tsx": $$$$$$44,
+    "deco-sites/agencian1/sections/Product/ProductShelfTabbed.tsx": $$$$$$45,
+    "deco-sites/agencian1/sections/Product/SearchResult.tsx": $$$$$$46,
+    "deco-sites/agencian1/sections/Product/ShelfWithImage.tsx": $$$$$$47,
+    "deco-sites/agencian1/sections/Product/Wishlist.tsx": $$$$$$48,
+    "deco-sites/agencian1/sections/Social/InstagramPosts.tsx": $$$$$$49,
+    "deco-sites/agencian1/sections/Social/WhatsApp.tsx": $$$$$$50,
+    "deco-sites/agencian1/sections/Theme/Theme.tsx": $$$$$$51,
   },
   "apps": {
     "deco-sites/agencian1/apps/decohub.ts": $$$$$$$$$$$0,
diff --git a/sections/Theme/Theme.tsx b/sections/Theme/Theme.tsx
index 0b04967..817872b 100644
--- a/sections/Theme/Theme.tsx
+++ b/sections/Theme/Theme.tsx
@@ -236,6 +236,7 @@ const defaultTheme = {
  *   --color-secondary: "#161616"
  * }
  */
+
 function Section({
   mainColors,
   complementaryColors,
@@ -257,11 +258,10 @@ function Section({
     [
       "--font-family",
       font?.family ||
-      "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif",
+      "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue',sans-serif"
     ],
   ]
     .map(([name, value]) => ({ name, value }));
-
   return (
     <SiteTheme
       fonts={font ? [font] : undefined}
diff --git a/static/fonts/ArchimotoN1-Black.ttf b/static/fonts/ArchimotoN1-Black.ttf
new file mode 100644
index 0000000..c81e091
Binary files /dev/null and b/static/fonts/ArchimotoN1-Black.ttf differ
diff --git a/static/fonts/ArchimotoN1-Regular.ttf b/static/fonts/ArchimotoN1-Regular.ttf
new file mode 100644
index 0000000..c0dbab3
Binary files /dev/null and b/static/fonts/ArchimotoN1-Regular.ttf differ
diff --git a/static/fonts/ArchimotoN1-Thin.ttf b/static/fonts/ArchimotoN1-Thin.ttf
new file mode 100644
index 0000000..4f3eba9
Binary files /dev/null and b/static/fonts/ArchimotoN1-Thin.ttf differ
diff --git a/static/fonts/ArchimotoV01-Medium.ttf b/static/fonts/ArchimotoV01-Medium.ttf
new file mode 100644
index 0000000..bea4de4
Binary files /dev/null and b/static/fonts/ArchimotoV01-Medium.ttf differ
diff --git a/static/image/header-sub-menu-en-en.png b/static/image/header-sub-menu-en-en.png
new file mode 100644
index 0000000..b30ae11
Binary files /dev/null and b/static/image/header-sub-menu-en-en.png differ
diff --git a/static/image/header-sub-menu-es-es.png b/static/image/header-sub-menu-es-es.png
new file mode 100644
index 0000000..8a25c76
Binary files /dev/null and b/static/image/header-sub-menu-es-es.png differ
diff --git a/static/image/header-sub-menu-pt-br.png b/static/image/header-sub-menu-pt-br.png
new file mode 100644
index 0000000..0f6648b
Binary files /dev/null and b/static/image/header-sub-menu-pt-br.png differ
diff --git a/static/sprites.svg b/static/sprites.svg
index 7923763..fc8ff04 100644
--- a/static/sprites.svg
+++ b/static/sprites.svg
@@ -109,5 +109,4 @@
 		<path d="M18 6m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path><path d="M18 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path><path d="M8.7 10.7l6.6 -3.4"></path>
 		<path d="M8.7 13.3l6.6 3.4"></path>
     </symbol>
-
 </svg>
diff --git a/tailwind.css b/tailwind.css
index edd3232..421485a 100644
--- a/tailwind.css
+++ b/tailwind.css
@@ -3,6 +3,9 @@
 @tailwind utilities;
 
 @layer base {
+  body{
+    @apply bg-primary
+  }
 
   /* Allow changing font family via CMS */
   html {
@@ -39,6 +42,45 @@
     @apply border-l border-transparent duration-200 whitespace-pre-line text-center;
     @apply flex flex-col items-center justify-start gap-8 py-10 px-8 lg:px-12;
   }
+
+  .text-base-150{color: #F3F4F7;}
+
+  .n1-container{     
+    max-width: 1440px;
+    margin: 0 auto;
+    padding: 0 120px;
+  }
+
+  .n1-btn-header-item--rounded{
+    border: none;
+    border-radius: 100px;
+    padding-left: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .n1-font-size--16{    
+    font-family: 'ArchimotoV01-Medium';
+    font-size: 16px;
+    line-height: 20px;    
+    text-transform: uppercase;
+  }
+  
+  .n1-grid-cols-3{
+    grid-template-columns: repeat(3, minmax(0, auto));
+  }
+
+  .n1-header__desktop{
+    background: linear-gradient(180deg, #0C1F59 -18.75%, rgba(12, 31, 89, 0.00) 100%);
+    backdrop-filter: blur(135px);
+    color: #fff;
+  }
+
+  .moveFromTop:hover { transform: translateY(20px) }
+  /* @keyframes moveFromTop {
+      from { transform: translateY(20px) }
+  }   */
 }
 
 .group:disabled .group-disabled\:animate-progress {