
/* SUKMA Website v113.26
   Banner mobile dibuat seperti carousel aplikasi:
   lebar, pendek, horizontal, rounded, gambar penuh terlihat.
*/
@media (max-width:760px){
  .home-slider{
    width:calc(100% - 20px)!important;
    max-width:430px!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:2.75/1!important;
    margin:14px auto 24px!important;
    border-radius:18px!important;
    overflow:hidden!important;
    background:#5b5048!important;
    box-shadow:none!important;
  }

  .home-slider-track{
    position:relative!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    border-radius:inherit!important;
    overflow:hidden!important;
  }

  .home-slide,
  .home-slide.position-left,
  .home-slide.position-right,
  .home-slide.position-center,
  .home-slide.layout-full,
  .home-slide.layout-split{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border-radius:inherit!important;
    overflow:hidden!important;
  }

  /* Gambar mengikuti card seperti banner aplikasi */
  .home-slide-media,
  .home-slide.position-left .home-slide-media,
  .home-slide.position-right .home-slide-media,
  .home-slide.position-center .home-slide-media,
  .home-slide.layout-full .home-slide-media,
  .home-slide.layout-split .home-slide-media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    background:#5b5048!important;
    z-index:0!important;
  }

  .home-slide-media img,
  .home-slide.layout-full .home-slide-media img,
  .home-slide.layout-split .home-slide-media img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0!important;
    padding:0!important;
    background:#5b5048!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  /* Jangan tutupi desain/tulisan yang sudah ada di gambar */
  .home-slide-shade,
  .home-slide:before,
  .home-slide:after{
    display:none!important;
    content:none!important;
  }

  /* Jika slide punya teks HTML terpisah, sembunyikan di HP.
     Banner mengikuti desain gambar, seperti aplikasi. */
  .home-slide-content{
    display:none!important;
  }

  .home-slider-arrow{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:absolute!important;
    top:50%!important;
    width:32px!important;
    height:32px!important;
    margin:0!important;
    padding:0!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    font-size:20px!important;
    line-height:1!important;
    background:rgba(30,27,24,.72)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    z-index:10!important;
  }

  .home-slider-arrow.prev{left:8px!important;}
  .home-slider-arrow.next{right:8px!important;}

  .home-slider-footer{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:absolute!important;
    left:10px!important;
    right:10px!important;
    bottom:7px!important;
    width:auto!important;
    z-index:11!important;
  }

  .home-slider-trust,
  .home-slider-counter{
    display:none!important;
  }

  .home-slider-dots{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    margin:0!important;
    padding:0!important;
  }

  .home-slider-dot,
  .home-slider-dots button{
    width:8px!important;
    height:8px!important;
    min-width:8px!important;
    min-height:8px!important;
    padding:0!important;
    border-radius:999px!important;
    transform:none!important;
  }

  .home-slider-dot.active,
  .home-slider-dots button.active,
  .home-slider-dots button[aria-current="true"]{
    width:28px!important;
  }
}

/* iPhone / Android kecil */
@media (max-width:390px){
  .home-slider{
    width:calc(100% - 16px)!important;
    max-width:none!important;
    aspect-ratio:2.7/1!important;
    margin-top:12px!important;
    margin-bottom:22px!important;
    border-radius:16px!important;
  }

  .home-slider-arrow{
    width:30px!important;
    height:30px!important;
    font-size:18px!important;
  }
}

/* HP sangat kecil */
@media (max-width:340px){
  .home-slider{
    width:calc(100% - 12px)!important;
    aspect-ratio:2.55/1!important;
  }
}
