/* Hero Section */
.hero-heading {
    font-size: calc(var(--h1)*1.5);
    line-height: 1.2;
    color: var(--white); /* Textfarbe */
}

.hero-subheading {
  	width: 60ch;
    display: block; /* Macht aus dem Span ein Block-Element, sodass es auf einer neuen Zeile beginnt */
    font-size: calc(var(--h1)*0.75); /* Anpassung basierend auf der Größe von h1 */
    line-height: 1.3;
    white-space: normal; /* Text wird nicht umgebrochen */
  	width: 43ch;
    margin-top: calc(var(--space-xs)*0.1); /* Verkleinert den Abstand zum vorherigen Text */
    color: var(--white); /* Textfarbe */
}

/* Anpassungen für Bildschirme bis zu einer Breite von 600px */
@media (max-width: 600px) {
    .hero-heading {
        font-size: var(--h1); /* Anpassen, falls eine andere Schriftgröße gewünscht ist */
        line-height: 1;
        white-space: nowrap; /* Text wird nicht umgebrochen */
    }
}

/* Anpassungen für Bildschirme unter 991px */
@media (max-width: 991px) {
    .hero-subheading {
        white-space: break-spaces; /* Text wird an Leerzeichen umgebrochen */
        width: auto;
    }
}