/* About page layout refinements. */
/* Separate the About page sections so the content feels lighter and easier to scan. */
body[class*="about"] .sppb-section {
    margin-bottom: 32px;
}

body[class*="about"] .sppb-section:last-child {
    margin-bottom: 0;
}

body[class*="about"] .sppb-row-column {
    padding-bottom: 12px;
}

body[class*="about"] :is(.sppb-addon-wrapper, .sppb-addon) {
    margin-bottom: 16px;
}

body[class*="about"] :is(.sppb-addon-wrapper, .sppb-addon):last-child {
    margin-bottom: 0;
}

@media (min-width: 992px) {
    /* Keep the hero/carousel from taking up most of the first viewport. */
    body[class*="about"] :is(.sppb-carousel .sppb-item, .sppb-carousel-pro .sppb-item, .sppb-carousel-extended .sppb-carousel-extended-item, .jt-cs .owl-carousel .owl-item) {
        height: 320px;
    }

    body[class*="about"] :is(.sppb-carousel .sppb-item, .sppb-carousel-pro .sppb-item, .sppb-carousel-extended .sppb-carousel-extended-item) img,
    body[class*="about"] .jt-cs .owl-carousel .owl-item img {
        height: 100%;
        object-fit: cover;
    }
}

/* Add breathing room between the carousel addon and the About card. */
body[class*="about"] :is(.sppb-addon-wrapper, .sppb-addon, .sppb-section):has(.sppb-carousel-pro, .sppb-carousel-extended, .jt-cs) {
    margin-bottom: 24px !important;
}

/* Formal, compact heading size for the blue About card. */
    body[class*="about"] .sppb-addon-title {
    font-size: 32px !important;
    line-height: 1.35 !important;
}

@media (max-width: 767.98px) {
    body[class*="about"] .sppb-section {
        margin-bottom: 22px;
    }

    body[class*="about"] .sppb-row-column {
        padding-bottom: 8px;
    }

    body[class*="about"] :is(.sppb-addon-wrapper, .sppb-addon) {
        margin-bottom: 12px;
    }
}