section.keyvisual{
    display:grid;
    grid-template-areas:
        "keyvisual"
        "content";
    grid-template-rows:min-content auto;
    grid-template-columns:100%;
    gap:0;
}

article:has(> section.keyvisual) > section.keyvisual{
    grid-area:keyvisual;
}

article:has(> section.keyvisual) > section:not(.keyvisual){
    grid-area:content;
}

/* Footer ("Weiter lesen") ueber beide Spalten. */
section.keyvisual > footer{
    grid-column:1 / -1;
}

/* Ab Tablet: Keyvisual side-by-side mit Content. */
@media screen and (min-width: 45rem){
section.keyvisual{
        grid-template-areas:"keyvisual content";
        grid-template-rows:minmax(0, auto);
        grid-template-columns:minmax(10rem, 18rem) 1fr;
        gap:1rem;
    }
}
