diff --git a/public/assets/css/style.css b/public/assets/css/style.css
index 2aeeb43..d448499 100755
--- a/public/assets/css/style.css
+++ b/public/assets/css/style.css
@@ -3,6 +3,7 @@
     --color-contrast: 256, 256, 256;
 
     --padding: clamp(40px, 2vw, 2vw);
+    --border-size: clamp(4px, .25vw, .25vw);
 }
 
 /* -- Cornerstones -- */
@@ -68,6 +69,8 @@ body > div {
     text-align: center;
     user-select: none;
     background-color: rgba(var(--color-contrast), .13);
+    backdrop-filter: blur(2px);
+    -webkit-backdrop-filter: blur(2px);
     box-shadow: 
         inset 0 .3vh 1.6vh rgba(0, 0, 0, 0),
         0 .1vh .3vh rgba(0, 0, 0, .12),
@@ -83,9 +86,9 @@ body > div {
 #intro a {
     padding: var(--padding-vert) 2vw;
     border-radius: 100px;
-    border: solid clamp(4px, .25vw, .25vw) rgba(var(--color-contrast), .3);
+    border: solid var(--border-size) rgba(var(--color-contrast), 0);
     margin: var(--padding) 0;
-    width: calc(100% - var(--padding));
+    width: calc(100% - ((var(--padding) / 2) + var(--border-size)));
 }
 
 #intro p {
@@ -112,6 +115,7 @@ body > div {
     border-radius: clamp(18px, 1vw, 1vw);
     backdrop-filter: saturate(100) brightness(.4);
     -webkit-backdrop-filter: saturate(100) brightness(.4);
+    border: solid var(--border-size) rgba(var(--color-contrast), .1);
     box-shadow:  0 1vh 2vh rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);
 }
 
@@ -120,7 +124,7 @@ body > div {
     height: var(--portrait-size);
     position: absolute;
     border-radius: 100%;
-    top: calc((var(--portrait-size) / 2) * -1);
+    top: calc(((var(--portrait-size) / 2) + var(--border-size)) * -1);
     background-color: rgb(var(--color-base));
     box-shadow: 0 1vh 2vh rgba(0, 0, 0 , .19), 0 6px 6px rgba(0, 0, 0 , .23);
 }
@@ -143,11 +147,15 @@ body > div {
 @media (pointer: fine) {
     :is(#intro, #card) a {
         --transition-speed: 200ms;
-        transition: var(--transition-speed) background-color, var(--transition-speed) box-shadow;
+        transition: 
+            var(--transition-speed) background-color,
+            var(--transition-speed) box-shadow,
+            var(--transition-speed) border-color;
     }
 
     :is(#intro, #card) a:hover {
         background-color: rgba(var(--color-contrast), .2);
+        border-color: rgba(var(--color-contrast), .2);
         box-shadow: 
             inset 0 .3vh 1.6vh rgba(0, 0, 0, .16),
             0 .3vh .6vh rgba(0, 0, 0, .16),
@@ -159,6 +167,17 @@ body > div {
     }
 }
 
+@media (max-width: 330px) {
+    p, a {
+        text-align: left;
+        font-size: 18px;
+    }
+
+    #card {
+        padding: calc(var(--padding) / 2);
+    }
+}
+
 @media (min-aspect-ratio: 14/9) and (min-height: 600px) {
     body {
         display: grid;
diff --git a/public/index.html b/public/index.html
index 0c5be16..0716e2e 100755
--- a/public/index.html
+++ b/public/index.html
@@ -38,7 +38,7 @@
             <div>
                 <p>...and ☕, full-time</p>
             </div>
-            <a href="contact" data-func>contact me</a>
+            <!--<a href="contact">contact me</a>-->
         </div>
     </div>
     <script type="module" src="assets/js/script.mjs"></script>