Fix: show banner full height + reliable dropdown

- Increased brand-card-gap min-height to 500px (desktop) so
  the full background image is visible (509px at 1200px grid width)
- Responsive: 400px at 960px, 240px at 600px
- Dropped grid-row spanning approach; back to CSS background-image
  on .brands-grid with background-size: 100% auto
- Dropdown sets backgroundImage directly on .brands-grid via
  style.backgroundImage — no setTimeout, no opacity animation,
  no async timing issues

script.js

@@ -37,15 +37,12 @@
 
   /* ── Banner image selector ──────────────────────────────── */
   var bannerPicker = document.getElementById("banner-picker");
-  var bannerImg = document.getElementById("brands-banner-img");
-  if (bannerPicker && bannerImg) {
+  var brandsGrid = document.querySelector(".brands-grid");
+  if (bannerPicker && brandsGrid) {
     bannerPicker.addEventListener("change", function () {
       var val = this.value;
-      bannerImg.style.opacity = "0";
-      setTimeout(function () {
-        bannerImg.src = "asset/banner/" + val + ".png";
-        bannerImg.style.opacity = "1";
-      }, 200);
+      brandsGrid.style.backgroundImage =
+        "url(asset/banner/" + val + ".png)";
     });
   }
 })();