.fbwrap{
    background-color: var(--wp--preset--color--mid);
    padding: var(--wp--preset--spacing--mainpadding);
    margin: 0 calc(-1 * var(--wp--preset--spacing--mainpadding));

    .fbitem{

        background: var(--wp--preset--color--light);
        border-radius: var(--wp--custom--border-radius);
        overflow: hidden;

        display: flex;
        gap: var(--wp--preset--spacing--30);
        margin-bottom:  var(--wp--preset--spacing--30);
        justify-content: space-between;
        align-items: center;
        align-items: stretch; /* wichtig */
        flex-wrap: wrap;
        max-width: var(--wp--style--global--content-size);
        margin-left: auto !important;
        margin-right: auto !important;

        b{
            color: var(--wp--preset--color--petrol);
            font-family: var(--wp--preset--font-family--heading);
        }

        a{
            color: var(--wp--preset--color--petrol);
            text-decoration: none;
            transition: var(--wp--custom--main-trans);
            font-weight: 500;
            font-family: var(--wp--preset--font-family--heading);

            &::after{
                content: '→';
                position: relative;
                margin-left: .25rem;
                display: inline-block;
                transition: var(--wp--custom--main-trans);
            }

            &:hover{
                 &::after{
                    transform: translateX(1rem);
                 }
            }
        }

        .content{
            padding: var(--wp--preset--spacing--30);
            width: calc(55% - var(--wp--preset--spacing--30));
            align-self: center;
        }

        figure{
            overflow: hidden;
            margin: 0;
            display: flex;
            width: calc(45% - var(--wp--preset--spacing--30));
            height: auto;

            aspect-ratio: 16 / 9;

            img{
                width: 100%;
                height: 100%;
                object-fit: cover;
                transition: var(--wp--custom--main-trans);
                border-radius: 0;
            }
        }

        &:hover{
            figure{
                img{
                    scale: 1.1;
                }
            }
        }
    }
}


@media screen and (max-width: 768px) {
    .fbwrap{
        .fbitem{
            flex-direction: column-reverse;

            .content{
                width: 100%;
            }

            figure{
                width: 100%;
            }
        }
    }
}