.title-and-content {
    margin: 0 auto;
    padding: var(--block-margin) 0;
    column-gap: var(--large-column-gap);
    align-items: unset;
    row-gap: var(--title-and-body-gap);
}

.title-and-content h2 {
    font: var(--font-headline-3);

    @media not all and (min-width: 768px) {
        font-size: 4rem;
        line-height: 1;
        text-wrap: pretty;
    }
}

.title-and-content-buttons {
    gap: var(--buttons-gap);
    
    @media (min-width: 768px) {
        justify-content: flex-end;
    }
}

.title-and-content-content {
    display: flex;
    flex-direction: column;
    row-gap: var(--body-and-buttons-gap);

    @media not all and (min-width: 768px) {

        & p {
            font-size: 1.8rem;
            line-height: 1.5;
        }
    }
}

.title-and-content-content > p {
    margin-bottom: 0;
}