.mkey-container {
    --padding-inline: var(--mkey-padding-inline, 1rem);
    --content-max-width: var(--mkey-container-width, 1200px);
    --breakout-size: var(--mkey-breakout-width, 4rem);

    display: grid;
    grid-template-columns:
        [full-width-start]
            minmax(var(--padding-inline), 1fr)
        [breakout-start]
            minmax(0, var(--breakout-size))
        [content-start]
            min(100% - (var(--padding-inline) * 2), var(--content-max-width))
        [content-end]
            minmax(0, var(--breakout-size))
        [breakout-end]
            minmax(var(--padding-inline), 1fr)
        [full-width-end];
}

.mkey-container > :not(.breakout, .full-width),
.full-width > :not(.breakout, .full-width) {
    grid-column: content;
}

.mkey-container > .breakout {
    grid-column: breakout;
}

.mkey-container > .full-width {
    grid-column: full-width;
    display: grid;
    grid-template-columns: inherit;
}