.grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 25px;
    justify-content: center;
    align-content: start;
    margin: 20px auto;
    width: 100%;
}

.grid-item {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 200px;
}
.grid-item img {
    width: 100%; /* Ensure the image covers the full width */
    height: 100%; /* Ensure the image covers the full height */
    display: block; /* Removes any extra space below the image */
    object-fit: contain;
}

.grid-item-text {
    text-align: center; /* Center-align the text */
    padding-top: 5px; /* Space between image and text */
}