:root {
    --mfwa-red: #e31e24;
    --mfwa-dark: #0b1a1c;
    --mfwa-grey-bg: #f4f4f4;
    --mfwa-text-main: #1a1a1a;
    --mfwa-text-muted: #555555;
}

.mfwa-pro-wrapper { width: 100%; margin: 40px 0; }
.mfwa-pro-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.mfwa-pro-card {
    display: flex; flex-direction: column; height: 100%;
    background: var(--mfwa-grey-bg); transition: transform 0.2s ease;
}

.mfwa-pro-media img { width: 100%; height: 220px; object-fit: cover; display: block; }

.mfwa-pro-body { padding: 25px; display: flex; flex-direction: column; }

.mfwa-pro-label {
    color: var(--mfwa-red) !important; font-size: 12px; font-weight: 800;
    text-transform: uppercase; text-decoration: none; margin-bottom: 12px;
}

.mfwa-pro-title a {
    font-family: Georgia, serif; font-size: 20px !important; font-weight: 700 !important;
    line-height: 1.3; color: var(--mfwa-text-main); text-decoration: none;
}

.mfwa-pro-excerpt { font-size: 14px; line-height: 1.6; color: var(--mfwa-text-muted); }

/* --- HERO CARD (1ST CHILD) --- */
.mfwa-pro-card:first-child {
    grid-column: 1 / -1; flex-direction: row !important;
    background: var(--mfwa-dark) !important; color: #ffffff !important;
    min-height: 420px; margin-bottom: 10px;
}

.mfwa-pro-card:first-child .mfwa-pro-media { flex: 0 0 55%; }
.mfwa-pro-card:first-child .mfwa-pro-media img { height: 100%; min-height: 420px; }

.mfwa-pro-card:first-child .mfwa-pro-body { flex: 0 0 45%; padding: 50px; justify-content: center; }

.mfwa-pro-card:first-child .mfwa-pro-title a { font-size: 32px !important; color: #ffffff !important; }
.mfwa-pro-card:first-child .mfwa-pro-excerpt { font-size: 17px; color: #cccccc !important; margin-top: 15px; }

@media (max-width: 1024px) {
    .mfwa-pro-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 800px) {
    .mfwa-pro-card:first-child { flex-direction: column !important; }
    .mfwa-pro-card:first-child .mfwa-pro-media, .mfwa-pro-card:first-child .mfwa-pro-body { width: 100%; }
}

@media (max-width: 600px) {
    .mfwa-pro-grid { grid-template-columns: 1fr; }
}