Fix hero text contrast with dark glass card and gradient text color

The hero gradient (navy→blue→teal) used the same colors as the gradient
text (teal→blue), making the heading dissolve into the background.

Two fixes:
- hero__content now has a dark semi-transparent card (rgba 72% opacity)
  with blur backdrop, keeping the animated gradient background visible
  around it while text sits on a dark, readable surface
- --grad-text changed from teal→blue to orange→teal so the gradient
  heading contrasts against the card and visually pops

https://claude.ai/code/session_015wpwmheufcxkBuXivrSHhd

www/css/style.css

@@ -33,7 +33,7 @@
 
     /* Gradients */
     --grad-hero: linear-gradient(135deg, #0d1b3e 0%, #1565c0 60%, #00bcd4 100%);
-    --grad-text: linear-gradient(90deg, #00bcd4, #1565c0);
+    --grad-text: linear-gradient(90deg, #f57c00, #00bcd4);
     --grad-cta:  linear-gradient(135deg, #1565c0, #00bcd4);
 
     /* Typography */
@@ -292,8 +292,14 @@ ul { list-style: none; }
 .hero__content {
     position: relative;
     z-index: 1;
-    max-width: 700px;
-    padding-block: 4rem;
+    max-width: 680px;
+    padding: 3rem 3.5rem;
+    background: rgba(8, 14, 38, 0.72);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+    border: 1px solid rgba(255,255,255,.1);
+    border-radius: var(--r-lg);
+    margin-block: 4rem;
 }
 
 .hero__eyebrow {