So it begins..

styles/reset.css

@@ -0,0 +1,149 @@
+/* Copyright (c) 2023 Luka Ivanovic */
+/* https://github.com/luka-hash/css-reset */
+/* This code is licensed under MIT licence */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+}
+
+a,
+article,
+audio,
+blockquote,
+body,
+canvas,
+caption,
+code,
+dd,
+del,
+details,
+div,
+dl,
+dt,
+em,
+fieldset,
+figcaption,
+figure,
+footer,
+form,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+header,
+hgroup,
+html,
+iframe,
+img,
+ins,
+kbd,
+label,
+legend,
+li,
+mark,
+menu,
+nav,
+ol,
+output,
+p,
+pre,
+s,
+section,
+small,
+span,
+strong,
+sub,
+summary,
+sup,
+table,
+tbody,
+td,
+tfoot,
+th,
+thead,
+time,
+tr,
+ul,
+video {
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+article,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+
+body {
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+}
+
+ol,
+ul {
+  list-style: none;
+}
+
+blockquote {
+  quotes: none;
+}
+
+blockquote::before,
+blockquote::after {
+  content: '';
+  content: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+img,
+picture,
+video,
+canvas,
+svg {
+  display: block;
+  max-width: 100%;
+}
+
+input,
+button,
+textarea,
+select {
+  font: inherit;
+}
+
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  overflow-wrap: break-word;
+  hyphens: auto;
+}

styles/style.css

@@ -34,10 +34,12 @@ body {
 
 body {
   display: grid;
-  grid-template-columns: 1fr;
-  grid-template-rows: 5rem 1fr 5rem;
-  grid-column-gap: 0px;
-  grid-row-gap: 0px;
+  grid-template:
+    "header" 10vh
+    "main" 1fr
+    "footer" 10vh
+    / 1fr;
+  gap: 0;
   font-family: 'Iosevka';
 }
 
@@ -50,17 +52,17 @@ footer {
 }
 
 header {
-  grid-area: 1 / 1 / 2 / 2;
+  grid-area: "header";
   border-bottom: 2px solid var(--border);
 }
 
 footer {
-  grid-area: 3 / 1 / 4 / 2;
+  grid-area: "footer";
   border-top: 2px solid var(--border);
 }
 
 #main {
-  grid-area: 2 / 1 / 3 / 2;
+  grid-area: "main";
   padding: 3rem 3rem 3rem 3rem;
   font-size: 1.3rem;
   line-height: 2rem;
@@ -85,7 +87,7 @@ a:focus {
   text-decoration: line-through var(--text);
 }
 
-.logo {
+#logo {
   font-size: 3rem;
   font-weight: bold;
 }
@@ -98,7 +100,7 @@ a:focus {
 
 #mesh {
   position: absolute;
-  bottom: 5rem;
+  bottom: 10vh;
   right: 0;
   user-select: none;
   pointer-events: none;
@@ -121,6 +123,20 @@ screen and (max-width: 1500px) {
   }
 }
 
+.links {
+  display: flex;
+}
+
+@media screen and (max-width: 540px) {
+  #logo {
+    font-size: 2.2rem;
+  }
+
+  .links {
+    display: none;
+  }
+}
+
 #sections-button {
   display: none;
 }
@@ -133,8 +149,8 @@ screen and (max-width: 1500px) {
   border: 2px solid var(--border);
   background-color: var(--bg);
   position: absolute;
-  bottom: calc(5rem - 2px);
-  left: 0;
+  bottom: calc(10vh - 2px);
+  left: calc(0px - 2px);
   align-items: center;
   padding: 2rem 3rem;
   display: none;