Move main menu margins to utility class in template.

assets/sass/_zen.scss

@@ -109,10 +109,6 @@ article {
 // Navigation
 
 .main-menu {
-  .page > & {
-    margin-block: var(--spacing-xs);
-  }
-
   a {
     display: block;
     background-color: var(--color-button);

assets/sass/components/header/_header.scss

@@ -6,11 +6,11 @@
   display: flex;
   flex-direction: column;
   gap: var(--gutters);
-  align-items: center;
   background-color: var(--color-header-bg);
 
   @media (min-width: 666px) {
     flex-direction: row;
+    align-items: center;
   }
 
   // Wrapping link for logo.

layouts/partials/menu.html

@@ -1,4 +1,4 @@
-<nav class="main-menu{{ if not ($.Param "menuinheader") }} layout__navigation{{ end }}" aria-label="{{ i18n "menu_title" }}">
+<nav class="main-menu{{ if not ($.Param "menuinheader") }} mx--xs layout__navigation{{ end }}" aria-label="{{ i18n "menu_title" }}">
 <ul class="flex-inline mx--0">
 {{ $currentPage := . -}}
 {{ range site.Menus.main -}}