general improvements

css/main.css

@@ -52,13 +52,11 @@ img {
 
 .glass {
     background: var(--glass-background);
-    backdrop-filter: blur(8px);
-    -webkit-backdrop-filter: blur(8px);
+    backdrop-filter: blur(4px);
+    -webkit-backdrop-filter: blur(4px);
     border-radius: var(--border-radius);
     border-top: 1px solid var(--glass-border);
     border-bottom: 1px solid var(--glass-border);
-    /* base shadows: outer shadow from variables + subtle inset
-         an extra animated outer shadow is layered to give a natural "alive" feel */
     box-shadow: 0 8px 36px 0 var(--glass-shadow), var(--inset-shadow);
     will-change: box-shadow;
     animation: glass-shadow 8s ease-in-out infinite !important;

css/sections/hero.css

@@ -196,4 +196,10 @@
         max-width: calc(100% / 2 - 6px);
         padding: 12px;
     }
+}
+
+.quote {
+    font-size: 0.9rem;
+    color: var(--text-color-dark);
+    font-style: italic;
 }

css/sections/projects.css

@@ -8,7 +8,8 @@
     backdrop-filter: blur(24px) saturate(140%) brightness(1.08);
     -webkit-backdrop-filter: blur(24px) saturate(140%) brightness(1.08);
     border-radius: var(--border-radius-large);
-    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.10);
+    box-shadow: 0 8px 36px 0 var(--glass-shadow), var(--inset-shadow);
+    border-bottom: 1px solid var(--glass-border);
     min-width: 280px;
     max-width: 340px;
     margin-left: 20px;

css/variables.css

@@ -9,8 +9,8 @@
     --button-hover-gradient: linear-gradient(120deg, rgba(30, 10, 50, 0.75), rgba(10, 10, 40, 0.4));
 
     --background-color: #000000;
-    --glass-background: rgba(20, 20, 20, 0.1);
-    --glass-border: rgba(255, 255, 255, 0.18);
+    --glass-background: rgba(4, 0, 10, 0.5);
+    --glass-border: rgba(255, 255, 255, 0.13);
     --glass-shadow: rgba(31, 38, 135, 0.30);
 
     --text-color: #ffffff;