diff --git a/style.css b/style.css
index 8c02329..39027eb 100644
--- a/style.css
+++ b/style.css
@@ -18,7 +18,7 @@
   :root.dark {
     --background: #111;
     --text: #ddd;
-    --highlight: rgba(0, 255, 255, 0.3);
+    --highlight: rgba(0, 255, 255, 0.4);
   }
 }
 
@@ -40,19 +40,17 @@ a {
   position: relative;
 }
 
-a::after,
-.title::after {
+a::after {
   content: "";
   display: block;
   position: absolute;
   z-index: -1;
-  bottom: -0.1875rem;
+  bottom: -0.0625rem;
   right: 0;
   height: 0.4em;
   max-width: 75%;
   width: 0;
   background: var(--highlight);
-  transition: width ease-in-out 0.175s;
 }
 
 a:hover::after {
@@ -79,17 +77,12 @@ main {
   border-radius: 100%;
   overflow: hidden;
   background: var(--text);
-  opacity: 0;
-  transform: scale(0.2);
-  animation: 0.5s ease-in-out 0.8s profile-picture-show forwards;
 }
 
 .profile-picture img {
   object-fit: contain;
   width: 100%;
   height: 100%;
-  opacity: 0;
-  animation: 0.125s ease-in 1.4s profile-picture-fade forwards;
 }
 
 .title {
@@ -99,21 +92,28 @@ main {
   margin-left: 25%;
 }
 
+.title::after,
 .title::before {
   content: "";
   position: absolute;
+  z-index: -1;
   display: block;
-  right: 0;
   bottom: 0;
+  right: 0;
+  width: 100%;
+}
+
+.title::before {
+  bottom: 0.1875rem;
   height: 0.0625rem;
   max-width: 90%;
-  width: 0;
   background: var(--text);
-  animation: 0.45s ease-in-out 0.1s title-slide forwards;
 }
 
 .title::after {
-  animation: 0.45s ease-in-out 0.25s title-slide forwards;
+  height: 0.4em;
+  max-width: 75%;
+  background: var(--highlight);
 }
 
 .about {
@@ -124,18 +124,6 @@ main {
 .about footer {
   position: relative;
   margin-bottom: 1.25rem;
-  color: transparent;
-  animation: 0s linear 1s about-text forwards;
-}
-
-.about p::after,
-.about footer::after {
-  content: "";
-  position: absolute;
-  display: block;
-  width: 100%;
-  background: var(--text);
-  animation: 1.25s ease-in-out 0.5s about-mask forwards;
 }
 
 .about address {
@@ -156,6 +144,50 @@ main {
   margin-bottom: 1.25rem;
 }
 
+@media (prefers-reduced-motion: no-preference) {
+  a::after {
+    transition: width ease-in-out 0.15s;
+  }
+
+  .profile-picture {
+    opacity: 0;
+    transform: scale(0.2);
+    animation: 0.5s ease-in-out 1s profile-picture-show forwards;
+  }
+
+  .profile-picture img {
+    opacity: 0;
+    transform: scale(1.1);
+    animation: 0.15s ease-in 1.5s profile-picture-fade forwards;
+  }
+
+  .title::after {
+    width: 0;
+    animation: 0.45s ease-in-out 0.25s title-slide forwards;
+  }
+
+  .title::before {
+    width: 0;
+    animation: 0.45s ease-in-out 0.1s title-slide forwards;
+  }
+
+  .about p,
+  .about footer {
+    color: transparent;
+    animation: 0s step-end 0.9s about-text forwards;
+  }
+
+  .about p::after,
+  .about footer::after {
+    content: "";
+    position: absolute;
+    display: block;
+    width: 100%;
+    background: var(--text);
+    animation: 0.6s ease-in-out 0.6s about-text-mask forwards;
+  }
+}
+
 @keyframes profile-picture-show {
   10% {
     opacity: 1;
@@ -182,6 +214,7 @@ main {
 @keyframes profile-picture-fade {
   100% {
     opacity: 1;
+    transform: scale(1);
   }
 }
 
@@ -197,7 +230,7 @@ main {
   }
 }
 
-@keyframes about-mask {
+@keyframes about-text-mask {
   0% {
     top: 0;
     bottom: 100%;