feat: ensure consistent spacing between header and content, make header transparent

Author: godzidcrypto

src/layout/Header/HeaderDesktop.tsx

@@ -198,7 +198,7 @@ const $Header = styled.header`
 
   ${layoutMixins.container}
   backdrop-filter: none;
-  background-color: var(--color-layer-0);
+  background-color: 'transparent';
   border-radius: 0.75rem;
   overflow: visible;
   height: var(--page-currentHeaderHeight);

src/pages/markets/Markets.tsx

@@ -45,13 +45,13 @@ const $Page = styled.div`
 const $HeaderSection = styled.section`
   ${layoutMixins.contentSectionDetached}
 
-  margin: 1.5rem 0;
+  margin-bottom: 1.5rem;
 
   @media ${breakpoints.tablet} {
     ${layoutMixins.flexColumn}
     gap: 1rem;
 
-    margin: 1rem 0;
+    margin-bottom: 1rem;
   }
 `;
 

src/pages/vaults/VaultPage.tsx

@@ -123,7 +123,6 @@ const VaultPage = () => {
 
 const $Page = styled.div`
   ${layoutMixins.contentContainerPage}
-  padding-top: 1.5rem;
   padding-bottom: 1.5rem;
 `;