/* ======== Gallery Section Styles ======== */

/* Card container */
.gallery-card {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); /* Smooth shadow */
    transition: all 0.3s ease; /* Smooth transition for hover effect */
    height: 350px; /* Set a fixed height for the image card */
}

/* Ensure image fills container with consistent height and width */
.gallery-image {
    width: 100%;           /* Full width of the parent container */
    height: 100%;          /* Full height of the parent container */
    object-fit: cover;     /* Ensures the image fills the space proportionally */
    border-radius: 15px;   /* Optional: rounded corners for images */
    transition: transform 0.3s ease; /* Image zoom effect */
}

/* Zoom effect on image hover */
.gallery-image:hover {
    transform: scale(1.1); /* Slight zoom-in effect on hover */
}

/* Card body */
.gallery-card-body {
    padding: 15px;
    background-color: #ffffff;
    border-radius: 0 0 15px 15px; /* Rounded bottom corners */
    text-align: center;
}

/* Responsive grid styling */
@media (max-width: 767px) {
    .gallery-card {
        margin-bottom: 20px;
    }
}

@media (max-width: 991px) {
    .gallery-card-body {
        padding: 10px;
    }

    .gallery-card-title {
        font-size: 1.1rem;
    }
}