Two-tier logo showcase with centered extra logo

This component uses Tailwind's grid system to create a two-tier logo showcase, with an extra centered logo in the second tier. It has a dark gray background for contrast with the white logos. The outer div sets up the dark background color and padding. The inner div centers the content and sets the max width. The grid div creates a grid with 4 columns by default, expanding to 6 columns on small screens. This allows the logos to wrap nicely. The top tier has 2 logos in the first 2 columns, spanning 2 columns each. The bottom tier has 4 logos, 2 in the first 2 columns, 1 centered by spanning columns and using col-start, and 1 in the last 2 columns. On large screens, the top logos are narrowed to 1 column each and the centered logo stays centered.