darken images on homepage and switch to white text

config.yaml

@@ -21,6 +21,7 @@ params:
       - categoryName: 'Arches'
         img: /img/catalog/12ftRoundArch2.jpg.webp
         alt: 
+        style:
       - categoryName: 'Canopies'
         img: /img/catalog/40ftgardencanopy4.jpg.webp
         alt:

themes/gallo/layouts/partials/categories.html

@@ -23,15 +23,15 @@
       >
         <div class="relative h-full max-w-full">
           <strong
-            class="text-gray-800 w-full z-10 text-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-2xl"
+            class="text-white w-full z-10 text-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-3xl"
           >
             {{ .categoryName }}
         </strong>
           <img
-            class="min-h-full h-auto w-full opacity-60"
+            class="min-h-full h-auto w-full opacity-90"
             src="{{ .img }}"
             alt="Category {{ .categoryName }}"
-            style="{{ .style | safeCSS }}"
+            style="{{ .style | safeCSS }} filter: brightness(60%);"
           />
         </div>
       </a>