/* ==========================================================================
   PAGEBUILDER: textboxes_3col
   shared section styles (.pb-section, .pb-content, .pb-headline, .pb-columns) are in style.css.
   ========================================================================== */

/* less space than on the live site (120px). */
.pb-textboxes-3col-intro {
    margin-bottom: 40px;
}

/* stacked columns read like the groups within a column: same 50px gap. */
.pb-textboxes-3col .pb-columns {
    row-gap: 50px;
}

/* columns wrap by available space instead of a fixed breakpoint: 3 on desktop, 2 + 1 on tablets, 1 on phones.
   the 280px minimum keeps long words like "Haftpflichtversicherung" inside their column. */
@media (min-width: 768px) {
    .pb-textboxes-3col .pb-columns {
        grid-auto-flow: row;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

/* !important: overrides inline margins from the editor content (e.g. the calculator box). */
.pb-textboxes-3col-text > :last-child {
    margin-bottom: 0 !important;
}

/* group headings are bold paragraphs in the editor content.
   the empty paragraphs between the groups are removed in the template, the space comes from here. */
.pb-textboxes-3col-text p:has(> strong) {
    margin-bottom: 10px;
    font-size: 20.93px;
    line-height: 30px;
}

/* 50px to the group above (collapses with its 20px paragraph margin), like on the live site. */
.pb-textboxes-3col-text p:has(> strong):not(:first-child) {
    margin-top: 50px;
}