/*
 * kkbc-heading-wrap-1.css - a heading is never wider than a phone screen.
 *
 * Measured on 2026-10-13 after the font change (decision D7, Inter): on https://kkbcagency.de at 390 px each page was
 * 47 px wider than the screen. Causes (measured: content width against box width):
 *   - the heading of the footer, `.Footer h2 p` (footer.php), 45 px: the word "Marketingstrategie" needs 417 px in 350;
 *   - the heading of the inner hero, `.privacy_breadcum figcaption h3`, 45 px: "Ausschreibung" needs 343 px in 250.
 * Inter is wider than the old font, so a long word that fitted before does not fit now. The old rules give a heading
 * no way to break inside a word (style.css sets only size and weight). With this rule a word breaks only when it
 * does not fit in its line; a heading whose words fit does not change (checked on https://kkbc.co/about/: the height
 * of each heading is the same with and without the rule). German pages (lang="de-DE") break with a hyphen.
 * Tried on the live pages in the browser: the page width goes from 437 to 390 px on /rfp/, / and /blog/.
 * A later change of this file gets a new file name (kkbc-heading-wrap-2.css): the CDN keeps a file under its old name.
 */
@media (max-width: 767.98px) {
  h1, h2, h3, h4, h5, h6,
  h2 p, h3 p {
    overflow-wrap: break-word;
  }
  :lang(de) h1, :lang(de) h2, :lang(de) h3, :lang(de) h4, :lang(de) h5, :lang(de) h6 {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}