/* ---------------------------------------------------------------------------
   Labels that have to survive a longer language.

   app.css sets `white-space: nowrap` on the category title with no ellipsis, no
   overflow and no max-width, so the text simply spills out of its slide. That
   is invisible in English, where every category name is short, and collides
   with the neighbouring card the moment the site is translated - "Technologie
   et électronique" and "Éducation et apprentissage" ran into each other and
   were clipped mid-word.

   Wrapping rather than truncating, because a category name is the only thing
   identifying the card: an ellipsis on "Alimentation et boiss…" is not a label,
   it is a guess. balance keeps a two-line name from breaking as one long line
   and one orphan word.

   Overridden here rather than edited in app.css so a theme update does not
   quietly take it back.
   --------------------------------------------------------------------------- */

.home-category-title {
    white-space: normal;
    text-wrap: balance;
    line-height: 1.35;
    max-width: 100%;
    /* For a single word longer than the card - German compounds, long brand
       names - which would otherwise overflow even with wrapping allowed. */
    overflow-wrap: anywhere;
}

/* Cards in a row now differ in height by a line, so the icons stop lining up
   unless every slide is stretched to the tallest. */
.home-categories-swiper .swiper-slide {
    height: auto;
}

.home-category {
    height: 100%;
    justify-content: flex-start;
}

/* The gap the title used to occupy on one line, kept so a one-line and a
   two-line card still have their icons on the same baseline. */
.home-category-icon {
    flex-shrink: 0;
}