.lazyblock-textblock .lazyblock-inner {
    display: flex;
    flex-direction: column; /* Elemente untereinander */
    max-width: var(--content-max-width);
    width: 100%;
}

/* Container für Bild + Text */
.lazyblock-textblock-inhalt {
    display: flex;
    align-items: center; /* Bild oben ausrichten */
    gap: var(--block-margin); /* Abstand zwischen Bild und Text */
    margin-top: var(--block-margin);
    flex-wrap: wrap; /* ermöglicht Umbruch auf kleinen Bildschirmen */
        word-break: break-word;      /* bricht lange Wörter */
    overflow-wrap: break-word;
    hyphens: auto;               /* Browser kann Bindestriche nutzen */
}

.lazyblock-textblock-inhalt.has-image .lazyblock-textblock-bild {
    --bildbreite: 66%;
    width: 100%;
    flex: 0 0 var(--bildbreite);
    max-width: 350px;
    height: auto;
    /* Offset passend zur Breite */
    --offset: calc(var(--bildbreite) * var(--tan));

    /* clip-path: polygon(
        0 var(--offset),
        100% 0,
        100% calc(100% - var(--offset)),
        0 100%
    ); */
}

/* Querformat → 3:2 */
.lazyblock-textblock-bild.is-landscape {
    aspect-ratio: 3 / 2;
}

/* Hochformat → 2:3 */
.lazyblock-textblock-bild.is-portrait {
    aspect-ratio: 2 / 3;
}

.lazyblock-textblock-bild.is-square {
    aspect-ratio: 1 / 1;
}


.lazyblock-textblock-bild img.textblock-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Text wenn Bild vorhanden */
.lazyblock-textblock-inhalt.has-image .lazyblock-textblock-text {
    flex: 1;
    max-width: calc(100% - var(--bildbreite) - var(--block-margin));
}

/* Wenn KEIN Bild */
.lazyblock-textblock-inhalt.no-image .lazyblock-textblock-text {
    flex: 0 0 100%;
    max-width: 100%;
}

/* Responsive: Auf kleinen Bildschirmen untereinander */
@media (max-width: 768px) {
    .lazyblock-textblock-inhalt {
        flex-direction: column;
    }

    .lazyblock-textblock-bild,
    .lazyblock-textblock-text {
        flex: 1 1 100%;
        max-width: 100%;
    }
}