/* ===== New Staff Page ===== */

/* ===== STAFF GRID ===== */
.staff-row { display: flex; flex-wrap: wrap; margin: 0 -0.75rem; }
.staff-col { flex: 0 0 20%; max-width: 20%; padding: 0 0.75rem; margin-bottom: 1.5rem; }
@media (max-width: 767.98px) { .staff-col { flex: 0 0 100%; max-width: 100%; } }

/* ===== STAFF CARD ===== */
.staff-card {
  background: #F0F0F0; border: 1px solid; color: #c8c8c8;
  border-radius: 6px; overflow: hidden; transition: all 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  height: 100%; display: flex; flex-direction: column;
}
.staff-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.16);
  border-color: #808080;
}

.card-img-wrap {
  background: #f8f9fa;
  display: flex; justify-content: center; align-items: center;
  border-bottom: 6px solid #55bdcb;
}
.card-img-wrap img {
  width: 100%; max-width: 150px; height: auto; border-radius: 4px;
  object-fit: cover; transition: scale(1.00);
}
.staff-card:hover .card-img-wrap img { transform: scale(1.00); }
.staff-card-body { padding: 1.25rem; text-align: center; flex: 1; display: flex; flex-direction: column; justify-content: center; }

/*.card-body { padding: 1.25rem; text-align: center; flex: 1; display: flex; flex-direction: column; justify-content: center; }*/
.person-title {
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 1px;
  color: #888; margin-bottom: 0.25rem; font-weight: 600;
}
.person-name {
  font-size: 1.05rem; font-weight: 600; color: #1a1a1a;
  text-decoration: none; display: block; margin-bottom: 0.75rem;
  transition: scale(1.00);
}
.person-name:hover { color: #0056b3; }
.contact-info { font-size: 0.85rem; color: #666; line-height: 1.6; }
.contact-info a { color: #0056b3; text-decoration: none; }
.contact-info a:hover { text-decoration: underline; }
.contact-info .oi { margin-right: 4px; font-size: 0.8rem; vertical-align: middle; }