/* Long price strings must wrap on phones.
 *
 * .kr-price is white-space: nowrap in the template. That is right for "244 kr" and
 * wrong for the strings this site actually publishes, which carry a unit price in
 * the same span: "från 781 kr · ca 37 kr per 1 000 kcal" renders 333px wide and
 * pushes the page to 404px in a 390px viewport.
 *
 * Measured on /neat at 390px before the fix: document scrollWidth 404, traced to a
 * single card. After: 390, no element overflowing. Sideways scroll on a phone is a
 * conversion problem rather than a cosmetic one — the buy button drifts off screen.
 *
 * Note the whole compound string lives in one .kr-price span, so keeping that span
 * nowrap and only wrapping its parent does nothing. It is the span itself that has
 * to be allowed to break, which it does at the "·" separators.
 *
 * This lives in design/overrides/css, a supported rung, rather than in the theme:
 * the theme is vendored and an engine sync overwrites it. This exact fix was lost
 * that way once already.
 */
.kr-roundup__prices {
  flex-wrap: wrap;
  white-space: normal;
}

.kr-roundup__prices .kr-price {
  white-space: normal;
}