chore(website): further improve layout on mobile

apps/website/src/pages/Donate/Donate.css

@@ -5,8 +5,16 @@ section.donate {
 section.donate ul {
     list-style-type: none;
     display: flex;
-    gap: 0 1em;
+    gap: 1em;
     padding: 0;
+    flex-direction: column;
+}
+
+@media (min-width: 720px) {
+    section.donate ul {
+        gap: 0 1em;
+        flex-direction: row;
+    }
 }
 
 section.donate ul a {

apps/website/src/pages/Download/download.css

@@ -36,11 +36,6 @@
 .download-server .download-card:first-of-type { --accent-color: var(--brand-1); }
 .download-server .download-card:last-of-type { --accent-color: var(--brand-3); }
 
-.download-server {
-    width: 75%;
-    margin: auto;
-}
-
 .architecture-switch {
     display: flex;
     gap: 1em;
@@ -68,3 +63,10 @@
     background-color: var(--brand-1);
     color: var(--brand-foreground-color);
 }
+
+@media (min-width: 720px) {
+    .download-server {
+        width: 75%;
+        margin: auto;
+    }
+}

apps/website/src/style.css

@@ -31,7 +31,7 @@ body {
 }
 
 main {
-    min-height: calc(100vh - 80px);
+    min-height: calc(100vh - 80px - 90px);
     display: flex;
     flex-direction: column;
 }
@@ -53,18 +53,21 @@ a {
 }
 
 section {
-    padding: 3em 0;
-    flex-grow: 1;
-    display: flex;
+    padding: 1em 0;
     justify-content: center;
     align-items: stretch;
 }
 
+section.fill {
+    flex-grow: 1;
+    display: flex;
+}
+
 section h2 {
     text-align: center;
     font-weight: 100;
     margin-top: 0;
-    margin-bottom: 2em;
+    margin-bottom: 1em;
 }
 
 img {
@@ -107,6 +110,14 @@ img {
 }
 
 @media (min-width: 720px) {
+    section {
+        padding: 3em 0;
+    }
+
+    section h2 {
+        margin-bottom: 2em;
+    }
+
     .grid-3-cols {
         display: grid;
         grid-template-columns: 1fr 1fr 1fr;