/* =========================================================
   HOME SERVICE / PRODUCT SWITCH - V25
   - Layanan tampil sebelum Produk
   - Layanan memakai gaya card Produk lama
   - Produk memakai gaya card Layanan lama
   - Carousel layanan AUTO LOOP satu arah ke kiri
   - Tombol panah dihapus
   ========================================================= */

/* ---------- LAYANAN ---------- */
.home-services-section{
    padding-top:52px !important;
}

.home-services-head{
    display:block;
}

.home-services-head > div:first-child{
    min-width:0;
}

.home-service-carousel{
    position:relative;
    overflow:hidden;
}

.home-service-carousel-viewport{
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-behavior:smooth;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    -ms-overflow-style:none;
    touch-action:pan-y pinch-zoom;
}

.home-service-carousel-viewport::-webkit-scrollbar{
    display:none;
}

.home-service-carousel-viewport.is-dragging{
    cursor:grabbing;
    scroll-behavior:auto;
    user-select:none;
}

.home-service-carousel-track{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 54px) / 4);
    gap:18px;
    padding:2px 2px 8px;
}

.home-service-slide-card{
    min-width:0;
    min-height:245px;
    display:flex !important;
    flex-direction:column;
    position:relative;
}

.home-service-slide-card .home-service-slide-icon{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    margin-bottom:16px;
    border-radius:13px;
    background:#EDF4FF;
    color:var(--royal);
    font-size:1rem;
}

.home-service-slide-card h3{
    margin:0 0 9px !important;
}

.home-service-slide-card p{
    margin-bottom:18px !important;
    color:var(--ink-soft);
}

.home-service-slide-card .card-link{
    margin-top:auto;
}

.home-service-slide-card-online{
    border-color:#C9D7F3;
    background:
        radial-gradient(circle at 88% 12%, rgba(28,181,219,.08), transparent 34%),
        var(--paper);
}

/* Clone untuk infinite loop tidak dibaca screen reader. */
.home-service-slide-card[data-loop-clone="true"]{
    pointer-events:auto;
}

/* ---------- DOT ---------- */
.home-service-carousel-dots{
    min-height:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-top:10px;
}

.home-service-carousel-dot{
    width:6px;
    height:6px;
    padding:0;
    border:0;
    border-radius:999px;
    background:#CAD4E8;
    cursor:pointer;
    transition:width .2s ease, background .2s ease;
}

.home-service-carousel-dot.is-active{
    width:20px;
    background:var(--royal);
}

/* ---------- PRODUK ---------- */
.home-products-switch-section{
    padding-top:38px !important;
}

.home-product-switch-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.home-product-switch-card{
    min-height:178px;
}

.home-product-switch-card > div{
    min-width:0;
}

.home-product-switch-card p{
    max-width:48ch;
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1100px){
    .home-service-carousel-track{
        grid-auto-columns:calc((100% - 18px) / 2);
    }
}

@media(max-width:980px){
    .home-product-switch-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:700px){
    .home-services-section{
        padding-top:36px !important;
    }

    .home-service-carousel-track{
        grid-auto-columns:86%;
        gap:14px;
        padding-bottom:6px;
    }

    .home-service-slide-card{
        min-height:220px;
    }

    .home-product-switch-card{
        min-height:auto;
    }
}

@media(max-width:420px){
    .home-service-carousel-track{
        grid-auto-columns:92%;
    }
}

@media(prefers-reduced-motion:reduce){
    .home-service-carousel-viewport{
        scroll-behavior:auto;
    }
}