/*
Block Name: Staff Grid
Description: A responsive grid of staff member cards with photo, name and role.
*/

.block-staff-grid .staff-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.5rem; }
.block-staff-grid .staff-grid__card { overflow: hidden; box-shadow: 0 4px 12px rgba(0,0,0,0.1);border-radius: 0 0 1rem 1rem;}
.block-staff-grid .staff-grid__photo { width: 100%; height: auto; object-fit: cover; object-position: top; display: block; border-radius: 1rem 1rem 0 0; }
.block-staff-grid .staff-grid__initials-wrap { width: 100%; background-color: var(--brand-2); border-radius: 1rem; display: flex; align-items: center; justify-content: center; }
.block-staff-grid .staff-grid__initials { color: #fff; }
.block-staff-grid .staff-grid__info { padding: 1.5rem; background: #fff; border-radius: 0 0 1rem 1rem;}
.block-staff-grid .staff-grid__name { font-weight: 600; color: var(--brand-1); margin:0 0 -0.3rem 0rem; font-size: 2.2rem; }
.block-staff-grid .staff-grid__role { color: var(--text-color); margin: 0; }

@media (max-width: 860px) { .block-staff-grid .staff-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 580px) { .block-staff-grid .staff-grid { grid-template-columns: repeat(2, 1fr); } }