Improve accessibility, refactor CSS to relative units, and add fluid hero scaling

styles.css

@@ -90,16 +90,12 @@
 
   .hero-logo{
     display:block;
-    width:min(100%, 26.25rem);
+    width:clamp(17.5rem, 28vw, 31rem);
     max-width:100%;
     height:auto;
     margin:0 auto 1.75rem;
   }
 
-  @media (max-width: 35em){
-    .hero-logo{ width:min(100%, 17.5rem); }
-  }
-
   /* ---------- brass rule divider ---------- */
   .rule-row{
     display:flex; align-items:center; gap:1rem;
@@ -158,7 +154,11 @@
   /* ---------- hero ---------- */
   .hero{
     position:relative;
-    padding-block:5.5rem 6rem;
+    min-height:calc(100vh - 4.5rem);
+    display:flex;
+    align-items:center;
+    justify-content:center;
+    padding-block:clamp(4.5rem, 8vh, 7.5rem);
     text-align:center;
     overflow:hidden;
     background:var(--ground); /* fallback if brick-texture.png fails to load */