﻿.event-tour-title {
    font-size: 7.8rem;
    z-index: 9;
    font-weight: 800 !important;
    position: absolute;
}

.description-text {
    color: #235784;
}

.object-fit-cover {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 0.5rem;
}

.img-wrapper {
    height: 100%;
    display: flex;
    flex-direction: column;
    /*    fix event tour --*/
    overflow: hidden;
    border-radius: 0 !important;
}

    .img-wrapper > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        /* ✅ Responsive rounded corners - min 0.75rem, max 2.5rem, smoothly scales with viewport */
/*        border-radius: clamp(0.75rem, 2.5vw, 2.5rem) !important;*/
        display: block; /* ✅ jaga-jaga hilangin inline-gap bawaan img */
    }

/*small screen*/
@media (max-width: 767.98px) {
    #events-group-img {
        position: relative;
        padding-block: 2rem;
    }

    #tours-group-img {
        position: relative;
        padding-block:2rem;
    }

    .event-tour-title {
        font-size: 6rem !important;
    }

    .row {
        position: relative;
    }

    #events-group-text {
        position: absolute;
        top: 35%;
        left: 50%;
        right: 50%;
        transform: translate(-50%,-50%);
        background: rgba(0, 0, 0, 0.85);
        background: linear-gradient( to bottom, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 100% );
        padding-top: 2rem;
        width: 80%;
        z-index: 3;
        font-size: 1.2rem;
        text-align: center;
    }

    #tours-group-text {
        position: absolute;
        top: 85%;
        left: 50%;
        right: 50%;
        transform: translate(-50%,-50%);
        background: rgba(0, 0, 0, 0.85);
        background: linear-gradient( to bottom, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 100% );
        padding-top: 2rem;
        width: 80%;
        z-index: 3;
        font-size: 1.2rem;
        text-align: center;
    }

    .eventtour-sm-btn :hover {
        text-decoration: none;
    }

    .eventtour-sm-btn {
        background-color: white;
        padding: 1rem 2.5rem !important;
        border-radius: 2rem !important;
    }

    .eventtour-text-white {
        color: #fff !important;
    }

    .img-wrapper {
        padding-inline: 2rem;
        overflow: hidden;
        object-fit: cover !important;
    }

        .img-wrapper img {
            /*            height: 100%;
            width: auto;
            object-fit: contain;*/
            /* ✅ Mobile: radius lebih kecil tapi tetap proporsional dengan screen - max 2rem */
            border-radius: clamp(0.75rem, 5vw, 2rem) !important;
        }

    #events-title {
        top: 15%;
        left: 50%;
        transform: translate(-50%,-50%);
        text-shadow: 0 9px 10px rgba(0, 0, 0, 0.6);
    }

    #tours-title {
        top: 15%;
        left: 50%;
        transform: translate(-50%,-50%);
/*        text-shadow: 0 9px 10px rgba(0, 0, 0, 0.6);*/
    }
}

/* medium screens */
@media (min-width: 768px) and (max-width: 991.98px) {

    .img-wrapper img {
        height: 100%;
        max-height: 250px;
    }

    #events-title {
        top: 0;
        right: 100% !important;
    }

    #tours-title {
        top: 0;
        left: 100% !important;
    }
}

/* large screen */
@media (min-width: 992px) {
    .img-wrapper {
        height: 100%;
        overflow: hidden;
        transform: scale(1.12) !important;
        transform-origin: center center !important;
    }

        .img-wrapper img {
            height: 100%;
            width: auto;
            object-fit: contain;
        }

    .event-tour-title {
    }

    #events-title {
        top: -3rem;
        right: 12.1rem !important;
    }

    #tours-title {
        top: -3rem;
        left: 16.8rem;
    }

    #events-img-wrapper {
        margin-top: -3.5rem !important;
    }

    #tours-img-wrapper {
        margin-bottom: 3rem;
    }
}
