---

    header {
      height: 30vh; 

Warum relativ zur Viewporthöhe? Das heißt, auf Telefonen (im Hochformat) sehr hoch? Und im Querformat womöglich nicht hoch genug, dass der Text reinpasst?

Warum nicht einfach so hoch, wie es der Text erfordert?

Ja... wie geht das am optimalsten? Was ich damit bezweckt habe ist, dass das eingebundene Bild bei 30vh abgeschnitten wird, das Bild ansich geht unten noch weiter.

---

    .Titel {
      position: absolute;
      top: 8vh;
      left: 50%;
      transform: translate(-50%, -50%);

Warum absolute Positionierung? Wegen Zentrierung? Die geht anders; hier wohl einfach mit text-align: center.

Nein, mit text-align: center ist das ganz chaotisch, das habe ich probiert. Das wird da irgendwie so halb und ganz links angezeigt.