body {
    background-color: #ffffff;
    color: #000000;
    font-family: Arial, sans-serif;
    margin: 40px;
}

article {
    max-width: 900px;
    width: 90%;           /* Für kleinere Bildschirme */
    margin: 0 auto;
    padding: 20px;
}

h1 {
    background-color: #18a9ff; /* blau wie auf Bild */
    color: white;
    font-weight: 900;
    text-align: center;
    padding: 12px 0;
    margin-bottom: 30px;
    font-size: clamp(1.4rem, 5vw, 2rem); /* responsiv und lesbar */
    border-radius: 4px;
    line-height: 1.3;
}

.content {
    display: flex;
    flex-direction: column; /* Bild unter Text */
    gap: 20px;
    width: 100%;
}

.text-block {
    width: 100%;
}

.content p {
    border-left: 3px solid #000; /* schwarze Linie links nur am Text */
    padding-left: 15px; /* Abstand zwischen Linie und Text */
    font-size: clamp(1.2rem, 3vw, 1.4rem); /* besser lesbar */
    line-height: 1.5;
    margin: 0 0 1em 0;
}

.content img {
    max-width: 150px;
    height: auto;
    object-fit: contain;
    align-self: center; /* Bild zentrieren */
}