.elementor-2694 .elementor-element.elementor-element-e2a3056{--display:flex;--min-height:0px;--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-2694 .elementor-element.elementor-element-db16d4b{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2694 .elementor-element.elementor-element-98734e3{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2694 .elementor-element.elementor-element-79e0698{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2694 .elementor-element.elementor-element-ac8b4ed{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}@media(min-width:768px){.elementor-2694 .elementor-element.elementor-element-e2a3056{--width:65%;}}/* Start custom CSS for html, class: .elementor-element-1712cf5 *//* 1. IMPOR GOOGLE FONTS (Wajib di baris paling atas) */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700&display=swap');

/* --- WADAH GRID RESPONSIP --- */
/* (Bungkus elemen .card mu dengan <div class="doctor-grid"> di HTML agar sejajar) */
.doctor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15em, 1fr));
  gap: 1.5rem;
  padding: 1rem;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* --- KARTU UTAMA --- */
.card {
  position: relative;
  width: 100%;
  max-width: 20em;
  height: 43em;
  min-height: 24em; 
  box-shadow: 0px 1px 13px rgba(0,0,0,0.1);
  cursor: pointer;
  transition: all 120ms;
  display: flex;
  flex-direction: column;
  background: #fff;
  padding: 0.625em;
  padding-bottom: 3.8em; /* Ruang aman di bawah agar teks tidak tertabrak tombol */
  overflow: hidden;
  border-radius: 6px;
  
  /* Font Family ditanam di induk agar semua anak mewarisinya (Prinsip DRY) */
  font-family: 'Manrope', sans-serif; 
  font-size: 16px; /* Ukuran teks dasar untuk kalkulasi EM di layar laptop/desktop */
  margin: 0 auto;
}

/* --- GAMBAR FOTO --- */
.image {
  background: rgb(241, 241, 241);
  width: 100%;
  aspect-ratio: 4 / 5; /* Mengunci rasio pasfoto */
  object-fit: contain; /* Mencegah gambar gepeng/distorsi */
  display: block;
  border-radius: 4px;
}

/* --- FORMATTING TEKS --- */
.card-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-top: 12px;
}

.card .title {
  font-size: 1.1em;
  font-weight: 900;
  color: #000000; /* Warna biru medis */
  margin-bottom: 4px;
}

.card .specialty {
  font-size: 0.9em;
  font-weight: 400;
  color: #888;
}

.card .schedule-title {
  font-size: 1.1em;
  font-weight: 700;
  color: #000000;
  margin-top: 10px;
}

.card .schedule-time {
  font-size: 1.0em;
  font-weight: 500;
  color: #888;
  line-height: 1.4;
}

.card .rating {
  font-size: 1.5em;
  color: #f39c12; /* Warna emas */
  letter-spacing: 2px;
  margin-top: 6px;
}

/* --- TOMBOL CTA (BUAT JANJI) --- */
.card .cart-btn {
  position: absolute;
  left: 0;
  bottom: -60px;
  background: #00AC7C;
  color: #fff;
  height: 2.8em;
  width: 100%;
  transition: all 80ms;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none; /* Menghilangkan garis bawah default link */
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Efek saat kartu dihover */
.card:hover .cart-btn {
  bottom: 0;
  opacity: 1;
}

/* Efek klik pada kartu keseluruhan */
.card:active {
  transform: scale(0.98);
}

/* Efek klik khusus pada tombol */
.card .cart-btn:active {
  height: 3.125em;
}

/* Logika pergantian teks murni CSS */
.card .cart-btn .text-added { display: none; }
.card .cart-btn:active .text-default { display: none; }
.card .cart-btn:active .text-added { display: block; }

/* --- PENYESUAIAN TIPOGRAFI UNTUK MOBILE --- */
@media (max-width: 600px) {
  .card {
    /* Mengubah font-size induk otomatis membesarkan seluruh teks di dalam kartu */
    font-size: 14px; 
  }
}/* End custom CSS */