/**
 * Iconbox V2 Component Styles
 * Makes cards equal height on desktop, flexible on mobile
 */

/* Base styles for iconbox blocks */
.contact_info_box .iconbox_block {
    padding: 20px;
    align-items: center;
}

.contact_info_box .iconbox_block .iconbox_icon,
.contact_info_box .iconbox_block .iconbox_title {
    margin-bottom: 15px;
}


/* Desktop: Make cards equal height using flexbox */
@media (min-width: 992px) {
    .contact_info_box .row {
        display: flex;
        flex-wrap: wrap;
    }

    .contact_info_box .row > [class*="col-"] {
        display: flex;
        flex-direction: column;
    }

    .contact_info_box .iconbox_block {
        flex: 1;
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    /* Push content to top, let space distribute evenly */
    .contact_info_box .iconbox_block .iconbox_content {
        flex: 1;
    }
}

/* Tablet (md): 2 cards per row, equal height within each row */
@media (min-width: 768px) and (max-width: 991px) {
    .contact_info_box .row {
        display: flex;
        flex-wrap: wrap;
    }

    .contact_info_box .row > [class*="col-"] {
        display: flex;
        flex-direction: column;
    }

    .contact_info_box .iconbox_block {
        flex: 1;
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .contact_info_box .iconbox_block .iconbox_content {
        flex: 1;
    }
}

/* Mobile (sm and below): Cards stack naturally with auto height */
@media (max-width: 767px) {
    .contact_info_box .row {
        display: block;
    }

    .contact_info_box .iconbox_block {
        height: auto;
    }
}