/* Keep the agents shortcode grid aligned when names and roles have different lengths. */
#agents-module .agents-blocks-main > .row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px;
}

/* Bootstrap's clearfix pseudo elements must not become grid cells. */
#agents-module .agents-blocks-main > .row::before,
#agents-module .agents-blocks-main > .row::after {
    content: none;
}

#agents-module .agents-blocks-main > .row > [class*="col-"] {
    float: none;
    width: auto;
    min-width: 0;
    padding: 0 !important;
}

#agents-module .agents-block {
    box-sizing: border-box;
    height: 100%;
    padding: 24px 15px;
}

#agents-module .agents-block .auther-thumb {
    display: block;
    width: 150px;
    max-width: 100%;
    height: 150px;
    margin: 0 auto 20px;
}

#agents-module .agents-block .auther-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#agents-module .agents-block .block-body .auther-info {
    height: auto !important;
    overflow: visible;
    overflow-wrap: break-word;
}

#agents-module .agents-block:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, .14);
    transform: translateY(-3px);
}

@media (max-width: 991px) {
    #agents-module .agents-blocks-main > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (max-width: 519px) {
    #agents-module .agents-blocks-main > .row {
  
        gap: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #agents-module .agents-block {
        transition: none;
    }

    #agents-module .agents-block:hover {
        transform: none;
    }
}