.elementor-3186 .elementor-element.elementor-element-125b9eb{--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(min-width:768px){.elementor-3186 .elementor-element.elementor-element-125b9eb{--content-width:1380px;}}/* Start custom CSS for html, class: .elementor-element-bde096d */.doctors-section{padding:60px 5px}
.container{max-width:1380px;margin:0 auto}
.section-title{text-align:center;font-size:36px;font-weight:800;color:#2c3e50;margin-bottom:22px}

.carousel{position:relative}
.carousel-viewport{overflow:hidden}
.carousel-track{display:flex;gap:18px;will-change:transform}

.carousel-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;border:1px solid #e5e7eb;background:#fff;
  color:#2c3e50;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.08);cursor:pointer;z-index:2
}
.carousel-btn.prev{left:-10px}
.carousel-btn.next{right:-10px}

:root{--cards:5}
@media (max-width:1100px){:root{--cards:3}}
@media (max-width:680px){:root{--cards:2}}

.doctor-card{
  flex:0 0 calc((100% - (var(--cards) - 1) * 18px)/var(--cards));
  background:#fff;border-radius:16px;overflow:hidden;position:relative;
  border:1px solid #eef1f4;box-shadow:0 4px 20px rgba(0,0,0,.08);
  transition:transform .35s ease, box-shadow .35s ease
}
.doctor-card:hover{transform:translateY(-6px);box-shadow:0 12px 40px rgba(33,150,243,.18)}
.doctor-card::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,#4CAF50 0%, #2196F3 100%);opacity:0;transition:opacity .35s ease}
.doctor-card:hover::before{opacity:1}

.doctor-media{position:relative;background:linear-gradient(135deg,#e3f2fd 0%, #f1f8e9 100%);height:240px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.doctor-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.doctor-card:hover .doctor-media img{transform:scale(1.04)}

.ribbon{
  position:absolute;left:12px;top:12px;
  background:linear-gradient(135deg,#21c1f3 0%, #0ea5e9 100%);
  color:#fff;padding:6px 12px;border-radius:999px;font-weight:800;font-size:13px;
  box-shadow:0 6px 16px rgba(14,165,233,.28)
}

.exp-badge{
  position:absolute;right:12px;bottom:12px;
  width:70px;height:70px;border-radius:50%;
  background:#fff;border:2px solid #21c1f3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#2c3e50;box-shadow:0 8px 22px rgba(0,0,0,.08);text-transform:uppercase;letter-spacing:.02em
}
.exp-badge em{font-size:10px;color:#6b7280;font-style:normal;line-height:1;margin-bottom:2px}
.exp-badge b{font-size:20px;line-height:1}
.exp-badge i{font-size:11px;color:#6b7280;font-style:normal;line-height:1;margin-top:2px}

.doctor-content{padding:14px 14px 16px}
.doctor-name{margin:2px 0 4px;font-size:18px;color:#2c3e50}
.doctor-sub{margin:0 0 12px;color:#6b7280}
.btn-blue{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:999px;background:linear-gradient(180deg,#21c1f3,#0ea5e9);color:#fff;text-decoration:none;font-weight:800;box-shadow:0 6px 18px rgba(0,0,0,.08)}/* End custom CSS */