Make Gradient bigger and Center Searchbar vertically

src/index.html

@@ -32,6 +32,7 @@ limitations under the License.
             </ul>
         </nav>
 
+        <div class="hero">
             <header>
                 <h1>seekra</h1>
                 <p>
@@ -45,7 +46,7 @@ limitations under the License.
                     <button type="submit">Search</button>
                 </div>
             </form>
-        
+        </div>
         <footer>
             <p>&copy; 2026 seekra.</p>
         </footer>

src/static/css/main.css

@@ -2,6 +2,14 @@ body {
     margin: 0;
     background-color: #ffffff;
 }
+.hero {
+    background: 
+        radial-gradient(ellipse at 40% 60%, rgba(255,255,255,0.55) 0%, transparent 75%),
+        linear-gradient(160deg, #c8d8f0, #7aa0d8, #5077C7, #dce8f8);
+    height: 300px;
+    display: flex;
+    flex-direction: column;
+}
 
 header {
     text-align: center;
@@ -24,7 +32,7 @@ header p {
 form {
     display: flex;
     justify-content: center;
-    margin-top: 20px;
+    margin-top: 60px;
     width: 100%;
 }
 
@@ -59,8 +67,6 @@ form {
     background: #374FA5;
 }
 
-
-
 footer{
     text-align: center;
     margin-top: 20px;

src/static/css/nav/navbar/navbar.css

@@ -2,7 +2,6 @@
     display: flex;
     justify-content: center;
     padding: 10px 0;
-    border-bottom: 1px solid #000000;
 }
 
 .global-nav ul {