/* =====================================================================
   Page styles for our-team.php
   Loaded after style.css, only on this page.
   ===================================================================== */

/* team */
.team{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
.member{flex:0 1 calc((100% - 4*18px)/5);min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .3s,box-shadow .3s}
.member:hover{transform:translateY(-4px);box-shadow:0 24px 44px -30px rgba(24,24,24,.45)}
.avatar{aspect-ratio:4/5;max-width:100%;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:44px;color:var(--accent-ink);background:var(--accent);position:relative;overflow:hidden}
.avatar::after{content:"";position:absolute;width:140%;aspect-ratio:1;border-radius:50%;border:28px solid rgba(255,255,255,.1);left:40%;top:30%}
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.avatar.photo{background:#EDEBE9}
.avatar.photo::after{display:none}
.member:hover .avatar img{transform:scale(1.05)}
.member:nth-child(3) .avatar{background:#181818;color:#fff}
.member:nth-child(4) .avatar{background:var(--soft);color:var(--accent)}
.member:nth-child(5) .avatar{background:#181818;color:var(--accent)}
.member .info{padding:16px 18px 18px}
.member h3{font-family:var(--body);font-size:16.5px;font-weight:600;letter-spacing:0}
.member p{font-size:14px;color:var(--muted)}
@media (max-width:1100px){.member{flex-basis:calc((100% - 2*18px)/3)}}
@media (max-width:620px){
  .team{gap:12px}
  .member{flex-basis:calc((100% - 12px)/2)}
  .member .info{padding:12px 14px 14px}
  .avatar{font-size:34px}
}

/* mobile sliders: team + news */
@media (max-width:620px){
  .team{display:grid;grid-auto-flow:column;grid-auto-columns:72%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;justify-content:start;padding-bottom:6px}
  .team .member{scroll-snap-align:start}
}

/* our team */
.lead-photo{margin:0;border-radius:24px;overflow:hidden;aspect-ratio:4/5;max-height:640px;box-shadow:0 40px 80px -50px rgba(24,24,24,.5)}
.lead-photo img{width:100%;height:100%;object-fit:cover;display:block}
.lead-role{margin-top:8px;font-family:var(--mono);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.split2 h2 + .lead-role + .lead{margin-top:18px}
.tm-grid .member{display:flex;flex-direction:column}
.tm-dept{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.tm-bio{margin-top:10px;font-size:13.5px!important;line-height:1.55}
@media (max-width:620px){
  .team.tm-grid{display:grid;grid-auto-flow:row;grid-template-columns:1fr 1fr;grid-auto-columns:auto;overflow:visible;gap:12px}
  .tm-bio{display:none}
}