/* Responsive storefront width: preserve Bootstrap sizes below 1400px. */
@media (min-width: 1400px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: clamp(1320px, calc(100vw - 80px), 1680px);
    }
}

/* Keep every managed rich-text output inside its responsive content column. */
main,
main :where(
    article, section, .row, [class*="col-"],
    [class*="content"], [class*="description"], [class*="rich-text"]
) {
    min-width: 0;
}

main :where(
    p, li, dt, dd,
    h1, h2, h3, h4, h5, h6,
    blockquote, pre, code,
    a, span, strong, b, em, i, u, s, sub, sup
) {
    overflow-wrap: anywhere;
    word-break: break-word;
}

main :where(img, iframe, video, table) {
    max-width: 100%;
}

main pre,
main code {
    white-space: pre-wrap;
}
