Bit of a mobile pass on the audio page

assets/sass/pages/audio.scss

@@ -21,7 +21,8 @@
     padding-top: 330px;
 
     @include media-down(lg) {
-      padding-top: 400px;
+      padding-top: 50px;
+      width: 95%;
     }
 
     .audio-intro {
@@ -102,6 +103,13 @@
       width: 100%;
       pointer-events: none;
 
+      @include media-down(lg) {
+        left: auto;
+        top: auto;
+        position: relative;
+        margin-bottom: 50px;
+      }
+
       .neon-text {
         @include media-down(lg) {
           font-size: 5rem;
@@ -159,12 +167,12 @@
       gap: 20px;
 
       @include media-down(lg) {
-        grid-template-columns: repeat(3, 1fr);
+        grid-template-columns: repeat(2, 1fr);
         gap: 15px;
       }
 
       @include media-down(md) {
-        grid-template-columns: repeat(2, 1fr);
+        grid-template-columns: 1fr;
       }
     }
 
@@ -190,6 +198,27 @@
       color: inherit;
       position: relative;
 
+      @include media-down(lg) {
+        display: grid;
+        grid-template-columns: auto 1fr;
+      }
+
+      .track-cover {
+        @include media-down(lg) {
+          max-width: 100px;
+        }
+        @include media-down(md) {
+          max-width: 60px;
+        }
+      }
+
+      .track-details {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+      }
+
       &:hover {
         border-color: #00ffff;
         box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);

assets/sass/pages/blog.scss

@@ -37,6 +37,10 @@
     .blog-header {
       text-align: center;
       padding-bottom: 20px;
+
+      @include media-down(lg) {
+        font-size: 0.75rem;
+      }
     }
 
     // Brand on bezel
@@ -607,6 +611,10 @@
     margin-bottom: 20px;
     padding-bottom: 15px;
     border-bottom: 1px solid rgba(0, 255, 0, 0.2);
+
+    @include media-down(lg) {
+      text-align: right;
+    }
   }
 
   .blog-post-navigation {