refactor: add standardized spacing variables and more style cleanup (#1287)

* refactor: add standardized spacing variables and more style cleanup

* refactor: rename `spacing-xxl` to `spacing-2xl` and introduce `spacing-3xl` for consistent spacing variables.

* refactor: Migrate related content styling to use the `subsection-list` component with updated layout adjustments.

* style: adjust padding values for article list tiles.

* refactor: Introduce shadow variables and dynamic spacing to prevent shadow cutoff in list layouts.

* refactor: relocate dark scheme Mermaid variables within the root scope.

assets/scss/partials/menu.scss

@@ -7,7 +7,7 @@
  */
 
 .hamburger {
-    padding-top: 10px;
+    padding-top: var(--spacing-sm);
     display: inline-block;
     cursor: pointer;
     transition-property: opacity, filter;
@@ -139,7 +139,7 @@
     display: none;
     margin: 0 calc(var(--container-padding) * -1);
 
-    padding: 30px 30px;
+    padding: var(--spacing-2xl);
 
     @include respond(xl) {
         padding: 15px 0;
@@ -148,10 +148,10 @@
     &,
     .menu-bottom-section ol {
         flex-direction: column;
-        gap: 30px;
+        gap: var(--spacing-2xl);
 
         @include respond(xl) {
-            gap: 25px;
+            gap: var(--spacing-xl);
         }
     }
 
@@ -220,7 +220,7 @@
     margin: 0;
     display: flex;
     flex-direction: row;
-    gap: 10px;
+    gap: var(--spacing-sm);
 
     svg {
         width: 24px;