/* Phone typography; tablet and desktop layouts keep their existing rules. */
@media screen and (max-width:767px), screen and (max-width:960px) and (max-height:500px) and (pointer:coarse){
  body.site-mobile-layout{hyphens:none;-webkit-hyphens:none;word-break:normal;overflow-wrap:break-word}
  body.site-mobile-layout main :is(h1,h2,h3,h4){hyphens:none!important;-webkit-hyphens:none!important;word-break:normal!important;overflow-wrap:normal!important;line-height:1.25!important;max-width:100%;text-wrap:pretty}
  body.site-mobile-layout main h1{font-size:clamp(1.3rem,5.6vw,1.5rem)!important}
  body.site-mobile-layout main h2{font-size:clamp(1.18rem,5vw,1.35rem)!important;margin-top:0;margin-bottom:12px}
  body.site-mobile-layout main h3{font-size:1.1rem!important}
  body.site-mobile-layout main h4{font-size:1rem!important}
  body.site-mobile-layout .hero{padding:16px 0 24px}
  body.site-mobile-layout .hero .hero-grid-clean{display:flex;flex-direction:column;align-items:stretch;gap:12px}
  body.site-mobile-layout .hero-grid-clean>h1{margin:0;text-align:left}
  body.site-mobile-layout .hero-grid-clean>.cover-wrap{width:140px;margin:0 auto;flex:none}
  body.site-mobile-layout .hero .book-replica{width:140px;height:232.67px}
  body.site-mobile-layout .hero .book-replica-art{transform:scale(.221169036335)}
  body.site-mobile-layout .hero-copy .lead{margin-top:0}
}

/* Ruhigere Jahreszeile auf beiden Startseiten, auch am Desktop. */
.hero h1 .hero-years{display:block;margin-top:5px;font-size:.78em;font-weight:400;line-height:1.35;color:var(--muted,#6e6b63)}