/* Mop Up page: a window app, so its screenshots are wide rather than the
   tall menu bar panels the other Mac app pages show */

.mu-steps .ma-step {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
}

/* Copy above the screenshot on every step, never beside it */
.mu-steps .ma-step:nth-child(even) .ma-step-copy {
    order: 0;
}

.mu-steps .ma-step-copy {
    max-width: 46em;
}

.ma-panel.mu-window,
.mu-steps .ma-step .ma-panel.mu-window {
    max-width: 100%;
    justify-self: stretch;
    border-radius: 14px;
}

.mu-gallery .ma-panel.mu-window {
    border-radius: 10px;
}

@media (max-width: 860px) {
    .mu-gallery figure {
        width: 82vw;
        max-width: 420px;
    }
}

.mu-credit {
    background: var(--surface, #fff);
    border-radius: 32px;
    padding: 40px;
}

.mu-credit h2 {
    font-size: clamp(36px, 5vw, 56px);
    margin: 8px 0 14px;
}

.mu-credit p.ma-mono {
    max-width: 44em;
    line-height: 1.6;
}

/* Periwinkle hero, to match the icon */
.ma-hero.mu-hero {
    background: var(--periwinkle);
}