/* MatchTide UI Foundation Stage 3: shared layout primitives.
   Opt-in classes only. No global resets or page selectors. */

.mt-ui-page {
    width: min(calc(100% - (var(--mt-ui-gutter-mobile) * 2)), var(--mt-ui-container-max));
    margin-inline: auto;
}

.mt-ui-container {
    width: min(calc(100% - (var(--mt-ui-gutter-mobile) * 2)), var(--mt-ui-container-max));
    margin-inline: auto;
}

.mt-ui-container--readable {
    max-width: var(--mt-ui-readable-max);
}

.mt-ui-container--wide {
    max-width: var(--mt-ui-wide-max);
}

.mt-ui-masthead {
    display: grid;
    gap: var(--mt-ui-masthead-gap);
}

.mt-ui-masthead__identity,
.mt-ui-masthead__content {
    min-width: 0;
}

.mt-ui-masthead__aside {
    min-width: 0;
}

.mt-ui-grid {
    display: grid;
    gap: var(--mt-ui-space-xl);
}

.mt-ui-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mt-ui-grid--sidebar {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
}

.mt-ui-flow > * + * {
    margin-top: var(--mt-ui-space-lg);
}