/* Constrain content to its column; wide tables scroll within the article. */
main, main article, main .row > [class*="col-"], .newsletter-archive { min-width: 0; }
/* break-word, not anywhere: anywhere also shrinks the min-content width, so text squeezed letter by letter
   next to floated images (product and TextBase pictures on mobile) instead of flowing below them. */
main article, main h1, main h2, main h3, .breadcrumb, .database-listing { overflow-wrap: break-word; }
/* Next to the 300px floated record image even break-word squeezes the text into the gap on phones; keep normal
   wrapping there so the text flows below the image as before. */
main article :has(> .product-image) { overflow-wrap: normal; }
main article img { max-width: 100%; height: auto; }
.newsletter-archive { max-width: 100%; overflow-x: auto; }
.archive-image-unavailable { display: inline-block; padding: .5em; color: #555; background: #f4f4f4; font-size: .9em; }
.database-listing li { margin-bottom: .6em; }
@media (max-width: 767px) {
    main article table { display: block; max-width: 100%; overflow-x: auto; }
    main article th, main article td { min-width: 0 !important; overflow-wrap: anywhere; }
    .col-prepare { display: block; width: 100%; }
    .prepare-section-link { min-width: 0; }
    .t0 { font-size: clamp(2rem, 8vw, 4rem) !important; letter-spacing: 2px !important; }
    .t0 img { max-width: 30%; height: auto; }
    .breadcrumb-sub-menu { max-width: 100%; }
}