fix hero image box shadow

Author: viktorpm

assets/css/style.css

@@ -153,17 +153,18 @@ body {
 
 .hero-image {
   width: 100%;
-  height: 300px;
+  max-height: 300px;
   overflow: hidden;
   border-radius: var(--border-radius);
-  box-shadow: var(--shadow);
   margin-bottom: 30px;
+   line-height: 0; /* remove any inline-gap around the banner image */
 }
 
 .hero-image img {
   width: 100%;
-  height: 100%;
+  height: auto;
   object-fit: cover;
+  display: block; /* remove bottom inline gap so banner fits flush */
 }
 
 .hero-content {
@@ -1215,10 +1216,6 @@ body {
     border-left: 4px solid var(--primary-color);
   }
 
-  .hero-image {
-    height: 200px;
-  }
-  
   .hero-content h1 {
     font-size: 32px;
   }