Varia: Cleanup padding on mobile screens

varia/sass/components/header/_site-main-navigation.scss

@@ -99,11 +99,11 @@
 
 		& > li {
 
-			& > a {
-				@include crop-text(map-deep-get($config-header, "main-nav", "font", "line-height"));
-			}
-
 			@include media(mobile) {
+				& > a {
+					@include crop-text(map-deep-get($config-header, "main-nav", "font", "line-height"));
+				}
+
 				&:first-of-type > a {
 					padding-left: 0;
 				}
@@ -144,7 +144,7 @@
 		font-family: #{map-deep-get($config-header, "main-nav", "font", "family")};
 		font-size: #{map-deep-get($config-header, "main-nav", "font", "size")};
 		font-weight: #{map-deep-get($config-header, "main-nav", "font", "weight")};
-		padding: #{map-deep-get($config-header, "main-nav", "link-padding")} 0;
+		padding: #{0.5 * map-deep-get($config-header, "main-nav", "link-padding")} 0;
 
 		@include media(mobile) {
 			padding: #{map-deep-get($config-header, "main-nav", "link-padding")};

varia/style-rtl.css

@@ -2376,26 +2376,22 @@ table th,
 	}
 }
 
-.main-navigation > div > ul > li > a {
-	line-height: 1;
-}
-
-.main-navigation > div > ul > li > a:before, .main-navigation > div > ul > li > a:after {
-	content: '';
-	display: block;
-	height: 0;
-	width: 0;
-}
-
-.main-navigation > div > ul > li > a:before {
-	margin-bottom: -0.12em;
-}
-
-.main-navigation > div > ul > li > a:after {
-	margin-top: -0.11em;
-}
-
 @media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li > a {
+		line-height: 1;
+	}
+	.main-navigation > div > ul > li > a:before, .main-navigation > div > ul > li > a:after {
+		content: '';
+		display: block;
+		height: 0;
+		width: 0;
+	}
+	.main-navigation > div > ul > li > a:before {
+		margin-bottom: -0.12em;
+	}
+	.main-navigation > div > ul > li > a:after {
+		margin-top: -0.11em;
+	}
 	.main-navigation > div > ul > li:first-of-type > a {
 		padding-right: 0;
 	}

varia/style.css

@@ -2381,26 +2381,22 @@ table th,
 	}
 }
 
-.main-navigation > div > ul > li > a {
-	line-height: 1;
-}
-
-.main-navigation > div > ul > li > a:before, .main-navigation > div > ul > li > a:after {
-	content: '';
-	display: block;
-	height: 0;
-	width: 0;
-}
-
-.main-navigation > div > ul > li > a:before {
-	margin-bottom: -0.12em;
-}
-
-.main-navigation > div > ul > li > a:after {
-	margin-top: -0.11em;
-}
-
 @media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li > a {
+		line-height: 1;
+	}
+	.main-navigation > div > ul > li > a:before, .main-navigation > div > ul > li > a:after {
+		content: '';
+		display: block;
+		height: 0;
+		width: 0;
+	}
+	.main-navigation > div > ul > li > a:before {
+		margin-bottom: -0.12em;
+	}
+	.main-navigation > div > ul > li > a:after {
+		margin-top: -0.11em;
+	}
 	.main-navigation > div > ul > li:first-of-type > a {
 		padding-left: 0;
 	}
@@ -2438,7 +2434,7 @@ table th,
 	font-family: sans-serif;
 	font-size: 1.2rem;
 	font-weight: bold;
-	padding: 16px 0;
+	padding: 8px 0;
 }
 
 @media only screen and (min-width: 560px) {