/* Default Styling for .mm-masonry */
.mm-masonry {
    --gap: 16; /* Default gap */
    --col-width: 229; /* Default column width */
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--col-width) * 1px), 1fr));
    grid-auto-rows: 1px;
    column-gap: calc(var(--gap) * 1px);
}

/* Media Query Adjustments */
@media (min-width: 768px) {
    .mm-masonry {
        --gap: 16;
        --col-width: 229;
    }
}

@media (min-width: 1024px) {
    .mm-masonry {
        --gap: 24;
        --col-width: 300;
    }
}

@media (min-width: 1280px) {
    .mm-masonry {
        --gap: 24;
        --col-width: 394;
    }
}

/* Item Layout for Masonry Items */
.mm-masonry__item {
    --img-proportional-height: calc(var(--h) * var(--col-width) / var(--w));
    grid-row-end: span var(--img-proportional-height, 240);
    overflow: hidden;
    margin-bottom: calc(var(--gap) * 1px);
}

/* Centering Image and Applying Object Fit */
.mm-masonry__img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
    margin: 0 auto;
    max-width: 100%;
}
.text-sm-center {
    font-size: 24px; /* Adjust size as needed */
    text-align: center;
}
.text-sm-center {
    font-size: 18px; /* Base font size for smaller screens */
    text-align: center;
}

@media (min-width: 768px) {
    .text-sm-center {
        font-size: 24px; /* Larger size for medium screens and up */
    }
}

@media (min-width: 1024px) {
    .text-sm-center {
        font-size: 30px; /* Even larger size for larger screens */
    }
}