Add dedicated edition pages (server, workstation, cloud)

- Add /server, /workstation, /cloud routes with per-page SEO titles
- Extract shared nav, footer, and waitlist form into partials
- Nav links to edition pages with active-state highlighting; swap About/Security order
- Waitlist form pre-checks the current edition and adds a Cloud option
- Add page-hero variant, edition switcher, and active-nav styles
- Responsive fixes: nav wraps at 540px, waitlist checkboxes wrap on narrow screens

static/css/style.css

@@ -223,6 +223,13 @@ body {
   background: var(--color-bg-alt);
 }
 
+/* Current page indicator */
+.nav nav a.nav-active {
+  color: var(--color-text);
+  background: var(--color-bg-alt);
+  box-shadow: inset 0 -2px 0 var(--color-accent);
+}
+
 .nav-cta {
   background: var(--color-accent) !important;
   color: var(--color-cta-text) !important;
@@ -265,7 +272,8 @@ body {
 [data-theme="light"] .theme-icon-light { display: none; }
 
 /* ── Hero ── */
-.hero {
+.hero,
+.hero-page {
   position: relative;
   padding: 96px 28px 72px;
   text-align: center;
@@ -278,6 +286,15 @@ body {
   border-bottom: 1px solid var(--color-border-light);
 }
 
+/* Smaller hero variant used on the edition pages */
+.hero-page {
+  padding: 76px 28px 60px;
+}
+
+.hero-page h1 {
+  font-size: clamp(1.9rem, 4vw, 2.7rem);
+}
+
 .hero-inner {
   max-width: var(--w-narrow);
   margin: 0 auto;
@@ -609,6 +626,14 @@ body {
   background: var(--color-bg-alt);
 }
 
+/* ── Edition Switcher (cross-links between edition pages) ── */
+.edition-switcher {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  justify-content: center;
+}
+
 /* ── Feature Grid ── */
 .features-grid {
   display: grid;
@@ -1018,7 +1043,8 @@ body {
   border: none;
   padding: 0;
   display: flex;
-  gap: 24px;
+  flex-wrap: wrap;
+  gap: 16px 24px;
   justify-content: center;
 }
 
@@ -1249,7 +1275,8 @@ body {
     --pad-section: 56px;
   }
 
-  .hero {
+  .hero,
+  .hero-page {
     padding: 60px 22px 50px;
   }
 
@@ -1315,11 +1342,13 @@ body {
 }
 
 @media (max-width: 580px) {
-  .hero {
+  .hero,
+  .hero-page {
     padding: 44px 18px 36px;
   }
 
-  .hero h1 {
+  .hero h1,
+  .hero-page h1 {
     font-size: 1.75rem;
   }
 
@@ -1391,7 +1420,7 @@ body {
 }
 
 /* Very small screens: wrap the nav links onto their own row */
-@media (max-width: 480px) {
+@media (max-width: 540px) {
   .nav-inner {
     height: auto;
     flex-wrap: wrap;