/* Text column styles */

/* Two column text layout */
.text-columns {
    column-count: 2;         /* Creates two columns */
    column-gap: 40px;        /* Space between columns */
    text-align: justify;     /* Optional: justified text alignment */
    margin-bottom: 20px;     /* Space below the text block */
}

/* Make sure headings don't break across columns */
.text-columns h2,
.text-columns h3,
.text-columns h4 {
    column-span: all;        /* Headings span across all columns */
    margin-bottom: 20px;
}

/* Optional: add a line between columns */
.text-columns-divider {
    column-rule: 1px solid #ddd;
}

/* Responsive: switch to single column on mobile */
@media (max-width: 768px) {
    .text-columns {
        column-count: 1;
    }
}

/* Three column text layout for larger content */
.text-columns-3 {
    column-count: 3;
    column-gap: 30px;
    text-align: justify;
}

@media (max-width: 992px) {
    .text-columns-3 {
        column-count: 2;
    }
}

@media (max-width: 768px) {
    .text-columns-3 {
        column-count: 1;
    }
}