Hero bg swaps to best server's city image on ping complete

- Maps each server to a city image (holland, brazil, india, england,
  boston/sydney from Wikimedia Commons CC-BY-SA)
- CSS var --hero-bg controls ::after background, falls back to Amsterdam
- 0.8s ease-out transition when the image swaps
- Uses local webp for Odoo-sourced images, JPG for Wikimedia imports

script.js

@@ -504,6 +504,15 @@ var si = 0,
                 }
               }
 
+              var heroImages = {
+                'meppel.odoo4projects.com': 'images/holland.webp',
+                'boston.odoo4projects.com': 'images/city-boston.jpg',
+                'manchester.odoo4projects.com': 'images/england.webp',
+                'mumbai.odoo4projects.com': 'images/india.webp',
+                'saopaulo.odoo4projects.com': 'images/brazil.webp',
+                'sydney.odoo4projects.com': 'images/city-sydney.jpg'
+              };
+
               function markBest() {
                 var valid = results.filter(function(r) { return r.time >= 0; });
                 if (valid.length === 0) return;
@@ -514,6 +523,11 @@ var si = 0,
                     c.el.classList.add('server-best');
                   }
                 });
+                /* Swap hero background to best server's city */
+                var hero = document.querySelector('.hero');
+                if (hero && heroImages[best.host]) {
+                  hero.style.setProperty('--hero-bg', "url('" + heroImages[best.host] + "')");
+                }
                 /* Update banner status */
                 bannerStatus.innerHTML =
                   '<span class="status-dot" style="animation:none;background:#4ade80;opacity:1;transform:scale(1)"></span> Fastest route found';