.committee-grid {
    width: 100%;
    list-style-type: none;
    display: grid;
    padding: 0px;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    grid-auto-rows: max(15rem, min-content);
    gap: 24px;
}

.committee-card :is(h3, h4) {
    font-size: 1.4em;
    grid-area: title;
}

.committee-card .member-bio {
    grid-area: bio;
}

.committee-card img {
    grid-area: photo;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    border-radius: 8px;
}


.committee-card {
    background-color: var(--card-background);
    color: var(--card-text);
    box-shadow: 8px 0 8px rgba(0,0,0,0.25), -8px 0 8px rgba(0,0,0,0.25);
    border-radius: 24px;
    padding: 24px;
    gap: 0 16px;
    display: grid;
    grid-template-columns: 30% 70%;
    grid-template-rows: min-content auto;
    grid-template-areas:
        "photo title"
        "photo bio";
}

.committee-card .committee-role {
    color: var(--shefesh-complement)
}