.msdd-cards,.msdd-cards *{box-sizing:border-box}
.msdd-cards{width:100%;display:grid;gap:24px;font-family:inherit;container-type:inline-size}
.msdd-columns-1{grid-template-columns:minmax(0,1fr)}
/* Two cards only when the Elementor/container width is actually large enough. */
.msdd-columns-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr))}

.msdd-doctor-card{display:flex;align-items:stretch;width:100%;min-width:0;min-height:220px;padding:18px;background:#fff;border:1px solid #e1e5ed;border-radius:20px;box-shadow:0 4px 16px rgba(19,35,84,.12);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.msdd-doctor-card:hover{transform:translateY(-2px);box-shadow:0 9px 26px rgba(19,35,84,.16)}
.msdd-photo{display:block;flex:0 0 200px;width:200px;min-width:200px;min-height:200px;background:#f2f4f8;overflow:hidden;text-decoration:none}
.msdd-photo img{display:block!important;width:100%!important;height:100%!important;min-height:200px!important;max-width:none!important;object-fit:cover!important;object-position:center top!important;margin:0!important}
.msdd-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:200px;background:#eef1f6;color:#132354;font-size:58px;font-weight:300}
.msdd-info{display:flex;flex:1;min-width:0;flex-direction:column;justify-content:center;padding:2px 4px 2px 18px}
.msdd-name{margin:0 0 6px!important;font-size:23px!important;line-height:1.25!important;font-weight:800!important;overflow-wrap:anywhere}
.msdd-name a{color:#132354!important;text-decoration:none!important}
.msdd-name a:hover{color:#132354!important}
.msdd-external{display:inline-block;margin-left:4px;font-size:15px;vertical-align:2px}
.msdd-specialty{margin:0 0 10px;color:#132354;font-size:16px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.msdd-meta{display:grid;gap:8px;margin:0 0 14px;color:#111827;font-size:15px;line-height:1.4}
.msdd-meta-row{display:flex;align-items:flex-start;gap:7px;margin:0;min-width:0}
.msdd-meta-row>span:last-child{min-width:0;overflow-wrap:anywhere}
.msdd-meta-row strong{color:#132354;font-weight:700}
.msdd-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 17px;width:17px;height:20px;color:#132354}
.msdd-icon svg{display:block;width:16px;height:16px;fill:currentColor}
.msdd-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.msdd-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:39px;padding:9px 14px;border:0;border-radius:7px;color:#fff!important;font-size:14px;font-weight:700;line-height:1.2;text-align:center;text-decoration:none!important;transition:transform .2s ease,opacity .2s ease}
.msdd-btn:hover{transform:translateY(-1px);opacity:.94;color:#fff!important}
.msdd-btn svg{width:16px;height:16px;fill:currentColor}
.msdd-appointment{background:#132354;box-shadow:4px 4px 0 #2aa9b2}
.msdd-whatsapp{background:#159657;box-shadow:4px 4px 0 #48b9b4}
.msdd-empty{width:100%;padding:34px;text-align:center;border:1px dashed #cbd5e1;border-radius:14px;background:#fff;color:#52617a}

/* Compact horizontal layout when the Elementor column is medium/narrow. */
@container (max-width:620px){
 .msdd-doctor-card{min-height:200px;padding:14px;border-radius:17px}
 .msdd-photo{flex-basis:165px;width:165px;min-width:165px;min-height:190px}
 .msdd-photo img,.msdd-placeholder{min-height:190px!important}
 .msdd-info{padding-left:14px}
 .msdd-name{font-size:20px!important}
 .msdd-specialty{font-size:14px}
 .msdd-meta{font-size:14px;gap:6px;margin-bottom:11px}
 .msdd-actions{gap:9px}
 .msdd-btn{font-size:13px;padding:8px 11px;min-height:36px}
}

/* Only truly small mobile cards stack vertically. */
@container (max-width:440px){
 .msdd-doctor-card{flex-direction:column;padding:13px}
 .msdd-photo{width:100%;min-width:0;flex-basis:auto;min-height:270px}
 .msdd-photo img,.msdd-placeholder{height:270px!important;min-height:270px!important}
 .msdd-info{padding:16px 3px 3px}
 .msdd-actions{flex-direction:column;align-items:stretch}
 .msdd-btn{width:100%}
}

/* Fallback for browsers without container queries. */
@media(max-width:520px){
 .msdd-doctor-card{flex-direction:column;padding:13px}
 .msdd-photo{width:100%;min-width:0;flex-basis:auto;min-height:270px}
 .msdd-photo img,.msdd-placeholder{height:270px!important;min-height:270px!important}
 .msdd-info{padding:16px 3px 3px}
 .msdd-actions{flex-direction:column;align-items:stretch}
 .msdd-btn{width:100%}
}

.msdd-single-doctor-page{width:100%;margin:0;padding:0}
.msdd-single-doctor-content{width:100%;margin:0;padding:0}
.msdd-single-doctor-content>.elementor{width:100%}
