/* ===== STAFF list page ===== */
.staff-intro{padding:40px 0 96px;position:relative;overflow:hidden}
.staff-intro .staff-lead{
  text-align:center;font-size:26px;font-weight:700;letter-spacing:.02em;
  margin-bottom:26px;line-height:1.7;
}
.staff-intro .staff-desc{
  text-align:center;font-size:13.5px;color:#555;line-height:2;
  max-width:760px;margin:0 auto 60px;
}

/* staff card grid */
.scards{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px}
.scard{display:block}
.scard__photo{
  position:relative;aspect-ratio:3/3.7;overflow:hidden;border-radius:3px;
  background:#cfcfcf;margin-bottom:16px;
}
.scard__photo img{width:100%;height:100%;object-fit:cover}
.scard__en{
  position:absolute;left:14px;bottom:14px;z-index:2;
  font-family:var(--latin);font-weight:700;font-size:34px;line-height:1.02;
  color:#fff;letter-spacing:.02em;text-shadow:0 2px 10px rgba(0,0,0,.25);
}
.scard__role{font-size:11px;color:#8a8a8a;letter-spacing:.04em;margin-bottom:4px}
.scard__name{font-size:16px;font-weight:700;letter-spacing:.04em}
.scard:hover .scard__photo img{opacity:.9}

@media(max-width:900px){
  .scards{grid-template-columns:1fr 1fr;gap:28px 20px}
  .staff-intro .staff-lead{font-size:20px}
}

@media(max-width:820px){
  .staff-intro{padding:24px 0 56px}
  .staff-intro .staff-lead{font-size:19px;margin-bottom:18px}
  .staff-intro .staff-desc{font-size:13px;margin-bottom:36px}
  .scards{grid-template-columns:1fr 1fr;gap:24px 14px}
  .scard__en{font-size:20px;left:10px;bottom:10px}
  .scard__role{font-size:10.5px}
  .scard__name{font-size:14px}
}