.search-wrapper {
            max-width: 100%;
            margin: 0 auto;
            background: white;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            }

                                .search-heading {
                    text-align: center;
                    margin-bottom: 40px;
                    font-weight: 700;
                    letter-spacing: 1px;
                    }

                    .search-grid {
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: center;
                    margin: 0 -10px;
                    }

                    .search-col {
                    padding: 10px;
                    box-sizing: border-box;
                    width: 50%;
                    }

                    @media(max-width:576px) {
                    .search-col {
                        width: 30%;
                    }
                    .search-icon {
                    margin-bottom: 5px !important;
                    }
                    }

                    @media(min-width:576px) {
                    .search-col {
                        width: 25%;
                    }
                    }

                    @media(min-width:992px) {
                    .search-col {
                        width: 10%;
                    }
                    }

                    /* Base icon + title styles */
                    .search-icon {
                    font-size: 1.3rem;
                    width: 48px;
                    height: 48px;
                    padding: 10px;
                    border: 3px solid #fff;
                    border-radius: 12px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    background: rgba(255,255,255,.08);
                    box-shadow: 0 2px 8px rgba(0,0,0,.18);
                    transition: background .3s, border-color .3s;
                    margin-bottom: 18px;
                    }

                    .search-icon i {
                    font-size: 18px;
                    }

                    .search-title {
                    font-size: 0.85rem;
                    font-weight: 700;
                    letter-spacing: .5px;
                    margin-bottom: 6px;
                    text-shadow: 0 2px 8px rgba(0,0,0,.18);
                    }

                    /* On hover */
                    .search-card:hover .search-icon {
                    background: rgba(255,255,255,.18);
                    border-color: #ff7400;
                    color: #ff7400;
                    }

                    /* Card styles */
                    .search-card {
                    position: relative;
                    overflow: hidden;
                    border-radius: 16px;
                    aspect-ratio: 1/1;
                    background: #18181b;
                    text-decoration: none;
                    color: #fff;
                    box-shadow: 0 8px 32px rgba(0,0,0,.25), 0 1.5px 6px rgba(0,0,0,.08);
                    border: 1.5px solid rgba(255,255,255,.08);
                    transition: transform .25s cubic-bezier(.4,2,.6,1), box-shadow .25s;
                    display: block;
                    width: 100%;
                    }

                    .search-card:hover {
                    transform: translateY(-10px) scale(1.03);
                    box-shadow: 0 16px 48px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.12);
                    z-index: 2;
                    }

                    .search-card img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    opacity: .82;
                    filter: blur(.5px) brightness(.85);
                    transition: opacity .3s, filter .3s;
                    border-radius: 16px;
                    }

                    .search-card:hover img {
                    opacity: .6;
                    filter: blur(1.5px) brightness(.7);
                    }

                    .search-overlay {
                    position: absolute;
                    inset: 0;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    text-align: center;
                    padding: 28px 18px;
                    background: linear-gradient(135deg, rgba(0,0,0,.55) 60%, rgba(0,0,0,.25) 100%);
                    border-radius: 16px;
                    z-index: 1;
                    }

                    /* Responsive tweaks */
                    @media(max-width:767px) {
                    .search-icon {
                        width: 44px;
                        height: 44px;
                        font-size: 1.2rem;
                        padding: 8px;
                    }

                    .search-icon i {
                        font-size: 16px;
                    }

                    .search-title {
                        font-size: 0.7rem;
                    }
                    }

                    @media(max-width:520px) {
                    .search-hide {
                        display: none;
                    }
                    }

                        .city-card {
        border-radius: 0.5rem;
    }

    .city-card img {
        border-radius: 0.5rem;
        transition: transform 0.3s ease;
    }

    .city-card:hover img {
        transform: scale(1.1);
    }

    .city-card::before {
        content: "";
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background: linear-gradient(179.93deg, rgba(255, 255, 255, 0) 0.06%, rgba(0, 0, 0, 0.72) 83.9%, rgba(0, 0, 0, 0.8) 99.94%);
        z-index: 2;
        opacity: 0;
        transition: opacity 0.3s ease;
        border-radius: 0.5rem;
    }

    .city-card .card-hover-content {
        bottom: 15px;
        z-index: 3;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .city-card:hover::before,
    .city-card:hover .card-hover-content {
        opacity: 1;
    }

            .portrait-card {
            height: 250px;
            aspect-ratio: 3 / 4;
            border-radius: 0.5rem;
            position: relative;
            overflow: hidden;
        }

        @media(max-width:520px){
            .portrait-card {
            height: 190px;
            aspect-ratio: 3 / 4;
            border-radius: 0.5rem;
            position: relative;
            overflow: hidden;
        }
        }

        @media(max-width:786px){
            .portrait-card {
            height: 250px;
            aspect-ratio: 3 / 4;
            border-radius: 0.5rem;
            position: relative;
            overflow: hidden;
        }
        }

        .portrait-card img {
            height: 100%;
            width: 100%;
            object-fit: cover;
            transition: transform 0.3s ease;
            border-radius: 0.5rem;
        }

        .portrait-card:hover img {
            transform: scale(1.05);
        }

        .portrait-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(179.93deg, rgba(255, 255, 255, 0) 0.06%, rgba(0, 0, 0, 0.72) 83.9%, rgba(0, 0, 0, 0.8) 99.94%);
            z-index: 2;
            opacity: 0;
            transition: opacity 0.3s ease;
            border-radius: 0.5rem;
        }

        .portrait-card-hover {
            bottom: 15px;
            z-index: 3;
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        .portrait-card:hover::before,
        .portrait-card:hover .portrait-card-hover {
            opacity: 1;
            border-radius: 0.5rem;
        }

        @media (max-width: 576px) {
    #cardSlider7 {
        scroll-snap-type: x mandatory;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 1rem;
    }

    #cardSlider7 > .card {
        scroll-snap-align: start;
        flex: 0 0 48%;
        max-width: 48%;
        margin-right: 4%;
    }

    /* Remove right margin on the last card in the row to prevent overflow */
    #cardSlider7 > .card:last-child {
        margin-right: 0;
    }
}

                        .slider-navigation.location {
                        position: absolute;
                        top: 50%;
                        left: 0;
                        right: 0;
                        z-index: 10;
                        display: flex;
                        justify-content: space-between;
                        transform: translateY(-50%);
                        padding: 0 15px;
                        pointer-events: none;
                    }

                    .slider-navigation .slider-btn {
                        pointer-events: all;
                        background: white;
                        box-shadow: 0 0 10px rgba(0,0,0,0.1);
                        border: none;
                    }