i'm scared about how this is gonna render on mobile

css/index.css

@@ -105,9 +105,11 @@ body {
     font-size: 1.75rem;
     color: var(--overlay-1);
     display: inline-block;
-    margin-left: -1rem;
+
+
 }
 
+
 .intro-text {
     padding: 1vh;
 
@@ -126,3 +128,14 @@ body {
         padding: 1vh;
     }
 }
+
+.desktop-break {
+    display: none;
+}
+
+@media (min-width: 768px) {
+    .desktop-break {
+        display: block;
+    }
+}
+

index.html

@@ -41,10 +41,13 @@
         <div class="intro-header">
             <div class="HiIm">Hi, I'm </div>
             <div class="name">Ari</div>
+            <br class="desktop-break">
             <div class="pronouns">(She/They)</div>
         </div>
         <div class="intro-text">
             A 17 Year Old devloper from <b>England, United Kingdom</b> who rarely actually does devlopment work, and just tries to help out whenever she can.
+        </div>
+        
 </body>
     <script src="js/index.js"></script>
     <script src="js/cat.js" data-cat="assets/media/oneko.gif"></script>