/* ── Explore Cities: turn card columns into a Slick carousel once there are
   more than 3 cities, so only 3 show at a time with prev/next arrows ────── */
.mn-explore-cities-row {
    align-items: center;
}
.mn-explore-cities-carousel {
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
}
.mn-explore-cities-slide {
    padding: 0 12px;
}

/* Custom round arrows (avoids relying on Slick's icon font, which this theme
   doesn't ship, so the default glyphs would render as empty boxes). */
.mn-explore-cities-track .slick-arrow.mn-cities-arrow {
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    z-index: 3;
    width: 38px;
    height: 38px;
    line-height: 34px;
    text-align: center;
    font-size: 22px;
    color: #000;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
    cursor: pointer;
    padding: 0;
}
.mn-explore-cities-track .slick-arrow.mn-cities-arrow.slick-disabled {
    opacity: .35;
    cursor: default;
}
.mn-explore-cities-track .mn-cities-prev { left: -19px; }
.mn-explore-cities-track .mn-cities-next { right: -19px; }

@media (max-width: 768px) {
    .mn-explore-cities-row {
        flex-wrap: wrap;
    }
    .mn-explore-cities-title-col,
    .mn-explore-cities-carousel {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .mn-explore-cities-carousel {
        margin-top: 20px;
    }
}