.tile-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 16px;
}

.tile {
    flex: 1 1 calc(33.333% - 16px);
    max-width: calc(33.333% - 16px);
}

.tile-row {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    gap: 16px;
}

@media (max-width: 992px) {
    .tile {
        flex: 1 1 calc(50% - 16px);
        max-width: calc(50% - 16px);
    }
}

@media (max-width: 576px) {
    .tile {
        flex: 1 1 100%;
        max-width: 100%;
    }
}
.scroll-wrapper {
    overflow-y: auto;
    padding-right: 8px; /* for scrollbar breathing room */
}