.material-card { display:flex; flex-direction:column; border-radius:8px; overflow:hidden; background:#fff; gap:0; }
.material-card.mc-image-left, .material-card.mc-image-right { flex-direction:row; align-items:stretch; }
.material-card.mc-image-right .mc-image { order:2; }
.mc-image img { width:100%; height:auto; display:block; margin:0; padding:0; border:none; transition:0.3s; }
.hover-enabled .mc-image img:hover { transform:scale(1.05); }

.mc-title { font-weight:600; margin-bottom:8px; }
.mc-subtitle { font-weight:400; margin-bottom:6px; }
.mc-text { margin-bottom:12px; }

.mc-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; justify-content:flex-start; }
.mc-chip { display:inline-flex; align-items:center; padding:4px 12px; font-size:13px; border-radius:16px; background:#eee; }

.mc-button-wrap { text-align:left; }
.mc-button { display:inline-flex; align-items:center; background:#1976d2; color:#fff; text-decoration:none; padding:8px 16px; border-radius:4px; transition:0.2s; box-sizing:border-box; }
.mc-button .mc-btn-icon svg { width:20px; height:20px; vertical-align:middle; }
.mc-btn-icon.before { margin-right:6px; }
.mc-btn-icon.after { margin-left:6px; }
.mc-button.full-width { display:flex; width:100%; justify-content:center; }

@media (max-width: 768px) {
  .material-card.mc-image-left, .material-card.mc-image-right { flex-direction:column; }
}