/* Grid: flex-basis (not max-width) decides wrapping so leftover cards on
   the last line stretch to fill the row instead of leaving dead space. */
.stm-grid{display:flex;flex-wrap:wrap;gap:20px;}
.stm-grid--single{display:block;}
.stm-grid .stm-card{flex:1 1 calc((100% - 40px)/3); max-width:calc((100% - 40px)/3);}
@media (max-width:640px){
	.stm-grid .stm-card{flex-basis:calc((100% - 20px)/2) !important; max-width:calc((100% - 20px)/2);}
}

.stm-card{
	overflow:hidden;
	border-radius:12px;
	padding:14px;
	box-sizing:border-box;
	cursor:pointer;
}
.stm-card--dark{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.14);}
.stm-card--light{background:#f6f7f8;border:1px solid #dde3ee;}

.stm-card__photo img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;display:block;border-radius:8px;}
.stm-card__body{padding:14px 0 0 0;}
.stm-card__name{font-size:20px;font-weight:600;}
.stm-card__title{font-size:14px;margin-top:2px;}
.stm-card--dark .stm-card__name{color:#ffffff;}
.stm-card--dark .stm-card__title{color:#3E7BFA;}
.stm-card--light .stm-card__name{color:#0b1230;}
.stm-card--light .stm-card__title{color:#3E7BFA;}

/* Popup */
.stm-popup{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(1,7,31,0.72);}
.stm-popup[hidden]{display:none;}
.stm-popup__panel{position:relative;background:#ffffff;border-radius:14px;max-width:480px;width:100%;max-height:85vh;overflow-y:auto;padding:32px;box-sizing:border-box;}
.stm-popup__close{position:absolute;top:12px;right:12px;width:32px;height:32px;border:0;background:transparent;font-size:24px;line-height:1;cursor:pointer;color:#5b6b85;}
.stm-popup__photo{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;display:block;margin-bottom:16px;}
.stm-popup__name{font-size:22px;font-weight:600;margin:0 0 4px;color:#0b1230;}
.stm-popup__title{font-size:14px;color:#3E7BFA;margin:0 0 16px;}
.stm-popup__description{font-size:14px;line-height:1.6;color:#3a4152;}

/* Slider: FlexSlider's own JS sets slide widths; the card just needs to
   fill its slide li. */
.stm-slider .slides li{padding:0 10px;box-sizing:border-box;}
.stm-slider .stm-card{width:100%;}
