/* Local tokens for WHY US only (scoped, not global) */
#whyus {
    --second-family: 'Plus Jakarta Sans', sans-serif;
    --font-family: 'DM Sans', sans-serif;
    --whyus-bg: #ffffff;
    --badge-bg: #d8f3e5;
    --text-dark: #292929;
    --text-gray: #161616;
}

/* Section */
.whyus-section {
    width: 100%;
    background: var(--whyus-bg);
    padding: 38px 0;
}

/* Container */
#whyus .container-custom {
    max-width: 1420px;
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
}

/* Badge */
#whyus .badge {
    font-size: 16px;
    font-weight: 600;
    padding: 9px 14px;
    border-radius: 6px;
    background: var(--badge-bg);
    color: var(--text-dark);
    display: inline-block;
    margin-bottom: 0.75rem;
    font-family: var(--font-family);
}

/* Section title */
#whyus .whyus-title {
    font-weight: 700;
    font-size: 42px;
    line-height: 125%;
    color: var(--text-dark);
    margin-bottom: 3rem;
    font-family: var(--second-family);
}

/* Card title & text */
#whyus h5.title-whyus {
    font-weight: 600;
    font-size: 26px;
    line-height: 150%;
    /* margin-bottom: 0.75rem; */
    color: var(--text-dark);
    font-family: var(--second-family);
}
#whyus p.text-whyus {
    font-size: 16px;
    line-height: 1.6;
    font-weight: 400;
    color: var(--text-gray);
    margin: 0;
    font-family: var(--font-family);
}

.row.g-5 .col-md-4 {
    display: flex;
    flex-direction: column;
}

.row.g-5 .title-whyus {
    /* Judul akan menyesuaikan tinggi secara otomatis */
    flex-shrink: 0;
}

.row.g-5 .text-whyus {
    /* Deskripsi akan dimulai dari posisi yang sama */
    margin-top: 1rem; /* sesuaikan jarak sesuai kebutuhan */
}
/* Icon */
#whyus img {
    margin-bottom: 12px;
    width: 93px;
    height: auto;
    display: block;
}

/* Responsive */
@media (max-width: 991.98px) {
    #whyus .whyus-title {
        font-size: 28px;
    }
    #whyus h5.title-whyus {
        font-size: 21px;
    }
}
@media (max-width: 768px) {
    @media (max-width: 768px) {
        /* wrapper jadi slider horizontal */
        #whyus .row.g-5 {
            display: flex;
            flex-wrap: nowrap;
            overflow-x: auto;
            scroll-snap-type: x mandatory;
            -webkit-overflow-scrolling: touch;
            gap: 1rem;
        }

        /* setiap card */
        #whyus .col-md-4 {
            flex: 0 0 auto;
            width: 80%; /* card lebar 80% layar */
            scroll-snap-align: start;
            text-align: left; /* pastikan rata kiri */
        }

        /* gambar */
        #whyus img {
            width: 64px;
            margin-bottom: 12px;
            text-align: left;
        }

        /* judul */
        #whyus h5.title-whyus {
            font-size: 18px;
            text-align: left;
        }

        /* deskripsi */
        #whyus p.text-whyus {
            font-size: 14px;
            text-align: left;
            display: -webkit-box;
            -webkit-line-clamp: 4; /* max 4 baris */
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        /* sembunyikan scrollbar */
        #whyus .row.g-5::-webkit-scrollbar {
            display: none;
        }
        #whyus .row.g-5 {
            -ms-overflow-style: none; /* IE/Edge */
            scrollbar-width: none; /* Firefox */
        }
    }
}
@media (max-width: 576px) {
    .whyus-title {
        font-size: 32px;
    }
    #whyus p.text-whyus {
        font-size: 16px;
    }
    #whyus h5.title-whyus {
        font-size: 18px;
    }
    #whyus img {
        width: 64px;
    }
}