.mpf-cardgrid__grid { display: grid; gap: 26px; }
.mpf-cardgrid__grid--2 { grid-template-columns: repeat(2, 1fr); }
.mpf-cardgrid__grid--3 { grid-template-columns: repeat(3, 1fr); }
.mpf-cardgrid__grid--4 { grid-template-columns: repeat(4, 1fr); }

.mpf-card {
    display: flex; flex-direction: column;
    background: var(--mpf-card-bg);
    border: 1px solid var(--mpf-border);
    border-radius: var(--mpf-radius);
    overflow: hidden;
    text-decoration: none;
    color: var(--mpf-text);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
a.mpf-card:hover { transform: translateY(-4px); box-shadow: var(--mpf-shadow-lg); border-color: var(--mpf-line); }
.mpf-card__media {
    background: #fff; aspect-ratio: 16/9; display: grid; place-items: center; padding: 22px;
    border-bottom: 1px solid var(--mpf-border);
}
.mpf-card__media img { max-height: 100%; width: auto; object-fit: contain; }
.mpf-card__body { padding: 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.mpf-card__body h3 { margin: 0; color: var(--mpf-navy); font-size: 1.18rem; }
.mpf-card__body p { margin: 0; color: var(--mpf-muted); font-size: .94rem; }
.mpf-card__more { margin-top: auto; padding-top: 8px; color: var(--mpf-blue); font-weight: 700; font-size: .9rem; }

@media (max-width: 900px) {
    .mpf-cardgrid__grid--3, .mpf-cardgrid__grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .mpf-cardgrid__grid { grid-template-columns: 1fr !important; }
}