Clients: 3x3 checkerboard arrangement, heavy/light logos alternating, uniform cells

src/pages/index.astro

@@ -25,10 +25,17 @@ const whyUs = [
   },
 ];
 
+// Client logos, arranged checkerboard: heavy dark logos alternate with light ones
 const clients = [
-  "___1.png", "_2.jpg", "photo-610z4l.jpg", "29595058_20159791717.jpg",
-  "9f97a370e8530d40a0ff.jpg", "unnamed.jpg", "evraz.jpg",
-  "c5aa9760-2920-4b4d-b.png", "17304586690.jpg",
+  "___1.png",                    // УГМК — heavy
+  "unnamed.jpg",                 // Атлас Майнинг — light
+  "c5aa9760-2920-4b4d-b.png",    // ВНИМИ — heavy
+  "29595058_20159791717.jpg",    // Норникель — light
+  "9f97a370e8530d40a0ff.jpg",    // РМК — heavy
+  "_2.jpg",                      // Полюс — light
+  "evraz.jpg",                   // Евраз — medium
+  "17304586690.jpg",             // УГХ — light
+  "photo-610z4l.jpg",            // Алроса — medium
 ].map((f) => "/images/" + f);
 ---
 
@@ -173,9 +180,11 @@ const clients = [
 
       <!-- Client logos -->
       <div class="mt-12">
-        <div class="grid grid-cols-2 items-center justify-items-center gap-x-10 gap-y-10 sm:grid-cols-3 lg:grid-cols-5">
+        <div class="grid grid-cols-2 items-center justify-items-center gap-x-10 gap-y-8 sm:grid-cols-3">
           {clients.map((src) => (
-            <img src={src} alt="Логотип заказчика" class="max-h-24 w-auto max-w-[220px] object-contain" loading="lazy" />
+            <span class="flex h-28 w-full items-center justify-center">
+              <img src={src} alt="Логотип заказчика" class="max-h-24 w-auto max-w-[220px] object-contain" loading="lazy" />
+            </span>
           ))}
         </div>
       </div>