/* MDP Smart Recommendations v1.4.1 */
.mdp-reco-wrap{margin:24px 0}
.mdp-reco-title{font-size:1.25rem;margin:0 0 12px 0;font-weight:700;line-height:1.2}
.mdp-grid{display:grid;gap:14px}
@media(min-width:768px){ .mdp-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:767.98px){ .mdp-grid{grid-template-columns:repeat(2,1fr)} }

.mdp-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.06);transition:transform .15s ease, box-shadow .15s ease}
.mdp-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.10)}
.mdp-card-link{display:block;color:inherit;text-decoration:none}
.mdp-thumb{position:relative;aspect-ratio:3/2;overflow:hidden;background:#f3f4f6}
.mdp-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.mdp-card:hover .mdp-thumb img{transform:scale(1.04)}
.mdp-card-title{font-size:1rem;line-height:1.35;padding:10px 12px 14px 12px;margin:0;font-weight:700}

/* Ribbon */
.mdp-ribbon{position:absolute;top:10px;left:10px;background:linear-gradient(135deg,var(--mdp-rib-start,#ff4d4d),var(--mdp-rib-end,#ff7a1a));color:var(--mdp-rib-text,#fff);padding:6px 10px;border-radius:999px;font-size:.75rem;font-weight:700;box-shadow:0 3px 10px var(--mdp-rib-shadow,rgba(0,0,0,.12));transition:all .2s ease}
.mdp-reco-wrap.mdp-ribbon-pill .mdp-ribbon{border-radius:999px}
.mdp-reco-wrap.mdp-ribbon-flag .mdp-ribbon{border-radius:10px;padding:6px 12px 6px 10px}
.mdp-reco-wrap.mdp-ribbon-flag .mdp-ribbon:after{content:"";position:absolute;right:-8px;top:50%;transform:translateY(-50%);border-left:8px solid var(--mdp-rib-end,#ff7a1a);border-top:8px solid transparent;border-bottom:8px solid transparent}
.mdp-reco-wrap.mdp-ribbon-corner .mdp-ribbon{top:0;left:0;border-radius:0;padding:8px 14px;clip-path:polygon(0 0,100% 0,calc(100% - 16px) 100%,0 100%)}

/* Dynamic columns */
.mdp-reco-wrap[data-cols-desktop="4"] .mdp-grid{grid-template-columns:repeat(4,1fr)}
.mdp-reco-wrap[data-cols-desktop="5"] .mdp-grid{grid-template-columns:repeat(5,1fr)}
.mdp-reco-wrap[data-cols-desktop="6"] .mdp-grid{grid-template-columns:repeat(6,1fr)}
@media(max-width:767.98px){
  .mdp-reco-wrap[data-cols-mobile="1"] .mdp-grid{grid-template-columns:repeat(1,1fr)}
  .mdp-reco-wrap[data-cols-mobile="3"] .mdp-grid{grid-template-columns:repeat(3,1fr)}
  .mdp-reco-wrap[data-cols-mobile="4"] .mdp-grid{grid-template-columns:repeat(4,1fr)}
}