Enhance header and nav styles with gradients and padding

Author: thecancerguide

style.css

@@ -6,25 +6,36 @@ body {
 }
 
 header {
-    background-color: #ffd54f;
-    padding: 20px;
-    text-align: center;
+    background: linear-gradient(135deg, #FFD54F, #FFF8E1);
+    padding: 40px;
+    text-align: center;
 }
 
 header h1 {
-    margin: 0;
-    color: #0d47a1;
+    color: #1565C0;
+    font-size: 48px;
+    margin-bottom: 10px;
 }
 
 nav {
     margin-top: 15px;
 }
 
 nav a {
-    text-decoration: none;
-    color: #0d47a1;
-    margin: 15px;
-    font-weight: bold;
+    display: inline-block;
+    text-decoration: none;
+    background-color: #FFD54F;
+    color: #0D47A1;
+    padding: 10px 18px;
+    margin: 8px;
+    border-radius: 30px;
+    font-weight: bold;
+    transition: 0.3s;
+}
+
+nav a:hover {
+    background-color: #81D4FA;
+    transform: translateY(-2px);
 }
 
 nav a:hover {
@@ -63,7 +74,12 @@ button:hover {
 }
 
 section {
-    padding: 50px;
+    background: white;
+    margin: 30px auto;
+    padding: 30px;
+    width: 85%;
+    border-radius: 20px;
+    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
 }
 
 ul {