/* =========================================================
   VERSI 21 - KATALOG POLISH
   Desktop rapi sejajar, HP pakai dropdown pilihan ekskul.
   ========================================================= */

.catalog-layout-v21{
  align-items:start !important;
}

.catalog-detail-v21{
  overflow:hidden !important;
}

.catalog-mobile-picker-v21{
  display:none;
  margin-top:14px;
}

.detail-top-v21{
  display:grid !important;
  grid-template-columns:minmax(320px, 38%) minmax(0, 1fr) minmax(210px, 230px) !important;
  grid-template-areas:
    "foto info harga"
    "foto manfaat manfaat" !important;
  gap:22px !important;
  align-items:stretch !important;
}

.detail-img-v21{
  grid-area:foto !important;
  width:100% !important;
  height:100% !important;
  min-height:286px !important;
  border-radius:16px !important;
}

.detail-img-v21 img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

.detail-main-v21{
  grid-area:info !important;
  min-width:0 !important;
  align-self:start !important;
}

.detail-main-v21 h1{
  font-size:38px !important;
  line-height:1.12 !important;
  margin:10px 0 12px !important;
}

.detail-main-v21 p{
  margin:0 !important;
  line-height:1.7 !important;
}

.price-card-v21{
  grid-area:harga !important;
  height:100% !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:12px !important;
  align-self:stretch !important;
  box-sizing:border-box !important;
}

.price-card-v21 .price{
  line-height:1.1 !important;
}

.price-card-v21 .btn{
  margin-top:2px !important;
}

.benefit-grid-v21{
  grid-area:manfaat !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:14px !important;
  margin-top:0 !important;
  align-self:end !important;
}

.benefit-grid-v21 .benefit-card{
  min-height:92px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  line-height:1.45 !important;
  box-sizing:border-box !important;
}

.section-line-v21{
  border:0 !important;
  border-top:1px solid var(--line) !important;
  margin:28px 0 !important;
}

.catalog-section-title-v21{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

.schedule-grid-v21{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

.schedule-card-v21{
  min-height:170px !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:8px !important;
  box-sizing:border-box !important;
}

.schedule-card-v21 p{
  margin:0 !important;
}

.trainer-title-v21{
  margin-top:30px !important;
  margin-bottom:8px !important;
}

.trainer-subtitle-v21{
  margin-top:0 !important;
}

.trainer-grid-v21{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(360px, 1fr)) !important;
  gap:18px !important;
}

.trainer-card-v21{
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:92px minmax(0,1fr) minmax(70px,96px) !important;
  gap:18px !important;
  align-items:center !important;
  box-sizing:border-box !important;
}

.trainer-card-v21 .trainer-photo{
  width:92px !important;
  height:92px !important;
}

.trainer-bio-v21{
  min-width:0 !important;
}

.trainer-bio-v21 p{
  margin-bottom:0 !important;
  line-height:1.65 !important;
}

.trainer-cv-v21{
  display:flex !important;
  justify-content:flex-end !important;
}

.trainer-cv-v21 .cv-thumb{
  width:86px !important;
  max-width:100% !important;
}

@media (max-width: 900px){
  .catalog-layout-v21{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .catalog-sidebar-v21{
    position:relative !important;
    top:auto !important;
    width:100% !important;
  }

  .catalog-mobile-picker-v21{
    display:block !important;
  }

  .catalog-sidebar-v21 .catalog-list{
    display:none !important;
  }

  .detail-top-v21{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "foto"
      "info"
      "harga"
      "manfaat" !important;
    gap:18px !important;
  }

  .detail-img-v21{
    min-height:220px !important;
    height:220px !important;
  }

  .detail-main-v21 h1{
    font-size:32px !important;
  }

  .price-card-v21{
    justify-content:flex-start !important;
  }

  .benefit-grid-v21{
    grid-template-columns:1fr !important;
  }

  .schedule-grid-v21,
  .trainer-grid-v21{
    grid-template-columns:1fr !important;
  }

  .trainer-card-v21{
    grid-template-columns:78px 1fr !important;
    align-items:start !important;
  }

  .trainer-card-v21 .trainer-photo{
    width:78px !important;
    height:78px !important;
  }

  .trainer-cv-v21{
    grid-column:1 / -1 !important;
    justify-content:flex-start !important;
  }
}