/**
 * Brand cards with no logo.
 *
 * assets/css/brands.css is the UI team's file and is not edited, so the rules for the text variant
 * live here — the same arrangement as product-extras.css beside product-detail.css.
 *
 * The Brands page lists all 54 `product_brand` terms and only 14 carry artwork, so
 * templates/blocks/brands.php sets the brand's name inside the box instead of an image. `.brand-card`
 * is already a centred flex container (brands.css:54), so nothing here positions anything: this is
 * type, and a guarantee that a long name cannot burst a fixed-height box.
 *
 * **The box height is fixed and the grid is dense** — 140px at six across, 124px below 1440, and
 * three across from 992px down with no further reset, which leaves roughly 77px of text width on a
 * phone. Sized against the longest name in the catalogue, "Melbourne Acrylic Coatings Pty Ltd (MAC)"
 * at 40 characters, where the median is 8. `overflow: hidden` is the backstop for a name longer than
 * any that exists today: it clips rather than pushing the card out of the grid.
 */

.brand-card--text {
    text-align: center;
}

.brand-card__name {
    display: block;
    max-height: 100%;
    overflow: hidden;
    font-size: 15px;
    line-height: 1.25;
    font-weight: var(--font-weight-semibold);
    color: var(--black);
    /* Breaks inside a word only when a word alone is wider than the card — no brand name is today,
       but "anywhere" degrades to a clipped word rather than a horizontal overflow if one appears. */
    overflow-wrap: anywhere;
}

@media (max-width: 1439.98px) {
    .brand-card__name {
        font-size: 14px;
    }
}

@media (max-width: 991.98px) {
    .brand-card__name {
        font-size: 13px;
        line-height: 1.2;
    }
}