diff --git a/script.js b/script.js
index 641d97e..2b132e0 100644
--- a/script.js
+++ b/script.js
@@ -466,7 +466,21 @@ var si = 0,
                 });
               }
 
-              function animateHero(city, image) {
+              /* Click on a server card — slide its city into hero, no label */
+              var serverCards = document.querySelectorAll('.server-card');
+              serverCards.forEach(function(card, idx) {
+                card.addEventListener('click', function() {
+                  var s = SERVERS[idx];
+                  if (!s || !heroImages[s.host]) return;
+                  /* Move golden frame */
+                  serverCards.forEach(function(c) { c.classList.remove('server-best'); });
+                  card.classList.add('server-best');
+                  /* Slide hero bg without label */
+                  animateHero(null, heroImages[s.host], false);
+                });
+              });
+
+              function animateHero(city, image, showLabel) {
                 var hero = document.querySelector('.hero');
                 if (!hero) return;
                 var bg = hero.querySelector('.hero-bg');
@@ -480,23 +494,33 @@ var si = 0,
                 newEl.className = 'hero-bg-slide';
                 newEl.style.backgroundImage = "url('" + image + "')";
                 bg.appendChild(newEl);
-                var label = document.createElement('div');
-                label.className = 'hero-city-label';
-                label.innerHTML = 'Our <strong>' + city + '</strong> server fits your location';
-                hero.appendChild(label);
-                gsap.set(newEl, { x: '100%' });
-                gsap.set(label, { x: '150%' });
+
                 var tl = gsap.timeline();
+                gsap.set(newEl, { x: '100%' });
+
+                var label = null;
+                if (showLabel !== false && city) {
+                  label = document.createElement('div');
+                  label.className = 'hero-city-label';
+                  label.innerHTML = 'Our <strong>' + city + '</strong> server fits your location';
+                  hero.appendChild(label);
+                  gsap.set(label, { x: '150%' });
+                }
+
                 if (hasExisting) {
                   var oldEl = bg.children[0];
                   gsap.set(oldEl, { x: '0%' });
                   tl.to(oldEl, { x: '100%', duration: 3, ease: 'power2.out' }, 0)
-                    .to(newEl, { x: '0%',   duration: 3, ease: 'power2.out' }, 0)
-                    .to(label, { x: '0%',   duration: 2.5, ease: 'power2.out' }, 0.3)
-                    .call(function() { oldEl.remove(); });
+                    .to(newEl, { x: '0%',   duration: 3, ease: 'power2.out' }, 0);
+                  if (label) {
+                    tl.to(label, { x: '0%', duration: 2.5, ease: 'power2.out' }, 0.3);
+                  }
+                  tl.call(function() { oldEl.remove(); });
                 } else {
-                  tl.to(newEl, { x: '0%',   duration: 3, ease: 'power2.out' }, 0)
-                    .to(label, { x: '0%',   duration: 2.5, ease: 'power2.out' }, 0.3);
+                  tl.to(newEl, { x: '0%',   duration: 3, ease: 'power2.out' }, 0);
+                  if (label) {
+                    tl.to(label, { x: '0%', duration: 2.5, ease: 'power2.out' }, 0.3);
+                  }
                 }
               }