.elementor-9047 .elementor-element.elementor-element-b2a3f7d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9047 .elementor-element.elementor-element-b2a3f7d:not(.elementor-motion-effects-element-type-background), .elementor-9047 .elementor-element.elementor-element-b2a3f7d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F9F5EF;}.elementor-9047 .elementor-element.elementor-element-ea4c86e > .elementor-widget-container{padding:0px 0px 50px 0px;}.elementor-9047 .elementor-element.elementor-element-e754907{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:30px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;}.elementor-9047 .elementor-element.elementor-element-e754907:not(.elementor-motion-effects-element-type-background), .elementor-9047 .elementor-element.elementor-element-e754907 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F3EC;}.elementor-9047 .elementor-element.elementor-element-3eea3f5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9047 .elementor-element.elementor-element-3eea3f5:not(.elementor-motion-effects-element-type-background), .elementor-9047 .elementor-element.elementor-element-3eea3f5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9047 .elementor-element.elementor-element-46d5cdd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9047 .elementor-element.elementor-element-46d5cdd:not(.elementor-motion-effects-element-type-background), .elementor-9047 .elementor-element.elementor-element-46d5cdd > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F3EC;}.elementor-9047 .elementor-element.elementor-element-ce64fbd > .elementor-widget-container{padding:30px 0px 0px 0px;}.elementor-9047 .elementor-element.elementor-element-be7badf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9047 .elementor-element.elementor-element-be7badf:not(.elementor-motion-effects-element-type-background), .elementor-9047 .elementor-element.elementor-element-be7badf > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9047 .elementor-element.elementor-element-8dea64c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9047 .elementor-element.elementor-element-b797277.elementor-element{--align-self:center;}.elementor-9047 .elementor-element.elementor-element-d7f2cc7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:767px){.elementor-9047 .elementor-element.elementor-element-e754907{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9047 .elementor-element.elementor-element-8308928 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-9047 .elementor-element.elementor-element-be7badf{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(min-width:768px){.elementor-9047 .elementor-element.elementor-element-b2a3f7d{--content-width:1600px;}.elementor-9047 .elementor-element.elementor-element-e754907{--content-width:1600px;}.elementor-9047 .elementor-element.elementor-element-3eea3f5{--content-width:1600px;}.elementor-9047 .elementor-element.elementor-element-46d5cdd{--content-width:1600px;}.elementor-9047 .elementor-element.elementor-element-be7badf{--content-width:1600px;}.elementor-9047 .elementor-element.elementor-element-8dea64c{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-5a8ede2 *//* ================= FIX IMAGE TIDAK MUNCUL ================= */

/* pastikan card punya layout fleksibel */
.remedy-card{
  display:flex;
  flex-direction:column;
}

/* paksa image punya tinggi nyata */
.remedy-card img{
  width:100%;
  height:100%;
  min-height:60%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* info card jangan nindih gambar */
.remedy-card-info{
  position:relative !important;
  flex-shrink:0;
}

/* ================= ELEMENTOR FORCE RENDER ================= */

/* 1. Paksa card tetap ter-render walau non-active */
.remedy-card{
  opacity:1 !important;
  visibility:visible !important;
}

/* 2. Tapi sembunyikan via transform saja */
.remedy-card:not(.active){
  transform:translateX(200px) scale(.9);
  pointer-events:none;
}

/* 3. Active card */
.remedy-card.active{
  transform:translateX(0) scale(1);
  z-index:3;
}

/* 4. Pastikan image benar-benar di-paint */
.remedy-card img{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  height:100%;
  width:100%;
  object-fit:cover;
}

/* 5. Trigger GPU repaint (INI PENTING DI ELEMENTOR) */
.remedy-card,
.remedy-card *{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  will-change:transform;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ce64fbd *//* ======================================================
   CARD TALL – DESKTOP (UNCHANGED BEHAVIOR)
====================================================== */
.card.tall {
  display: flex;
  flex-direction: column;
}

.card.tall img {
  margin-top: auto;      /* dorong gambar ke bawah */
  height: 100%;          /* full tinggi card */
  object-fit: contain;   /* tetap proporsional */
}


/* ======================================================
   WHY SECTION – MOBILE NAV ARROW (TEXT ARROW)
   Frontend = Elementor Preview
====================================================== */
@media (max-width: 768px) {

  /* tombol */
  .slider-nav .nav-btn {
    width: 64px;
    height: 64px;
    border-width: 2px;
  }

  /* arrow text */
  .slider-nav .nav-btn .arrow {
    font-size: 36px;
    font-weight: 600;
    line-height: 1;
    display: block;
    transform: translateY(-1px);
    pointer-events: none;
  }

  .slider-nav .nav-btn:active {
    transform: scale(0.95);
  }
}


/* ======================================================
   MKSD RECOMMENDED – MOBILE NAV ARROW (SVG)
   NUCLEAR + PRODUCTION SAFE
====================================================== */
@media (max-width: 768px){

  /* tombol lingkaran */
  .mksd-recommend .mksd-nav .mksd-arrows .mksd-arrow {
    width: 64px !important;
    height: 64px !important;
    border-width: 2px;
  }

  /* SVG arrow — DIPAKSA SAMA SEPERTI ELEMENTOR */
  .mksd-recommend .mksd-nav .mksd-arrows .mksd-arrow svg {
    width: 24px !important;     /* ukuran dasar */
    height: 24px !important;
    display: block;
    transform: scale(1.6);     /* KUNCI UTAMA */
    transform-origin: center;
  }

  .mksd-recommend .mksd-arrow:active {
    transform: scale(0.94);
  }
}

/* ======================================================
   MKSD MOBILE ARROW – ABSOLUTE NUCLEAR FIX
   Works even if theme / Elementor override SVG
====================================================== */
@media only screen and (max-width: 768px) {

  /* tombol */
  body .mksd-recommend .mksd-arrow {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
  }

  /* SVG dipaksa keluar dari aturan theme */
  body .mksd-recommend .mksd-arrow svg {
    width: 40px !important;
    height: 40px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 40px !important;
    min-height: 40px !important;
    transform: none !important;
  }

  /* stroke dipertebal (INI KUNCI VISUAL) */
  body .mksd-recommend .mksd-arrow svg path {
    stroke-width: 3.2 !important;
  }
}

/* section full bleed tembus container */
.why{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  background:##F6F3EC!important;
  padding:80px 0;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5e652e7 *//* ================= FIX SPACING MKSD RECOMMEND ================= */

/* rapetin padding atas section */
.mksd-recommend{
  padding-top: 20px;   /* sebelumnya 80px */
}

/* rapetin jarak judul ke atas */
.mksd-title{
  margin-top: 0;
  margin-bottom: 6px; /* sebelumnya 10px */
}

/* rapetin subtitle ke judul */
.mksd-subtitle{
  margin-top: 0;
  margin-bottom: 20px; /* sebelumnya 32px */
}

/* MOBILE – lebih rapet lagi */
@media (max-width: 768px){
  .mksd-recommend{
    padding-top: 32px;
  }

  .mksd-title{
    font-size: 32px;
    margin-bottom: 4px;
  }

  .mksd-subtitle{
    margin-bottom: 16px;
  }
}/* End custom CSS */