/* Portfolio project, portfolio categories and team member pages */
.pf-ind{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;background:var(--accent-t);color:var(--accent);font-size:13px;font-weight:650;text-decoration:none}
a.pf-ind:hover{background:var(--accent);color:var(--on-accent)}

/* project hero */
.pfp-row{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:center;margin-top:clamp(24px,3vw,40px)}
.pfp-copy{display:grid;gap:20px;justify-items:start;min-width:0}
.pfp-cats{display:flex;flex-wrap:wrap;gap:8px}
.pfp-copy .btns{margin-top:4px}
.pfp-res{display:flex;flex-wrap:wrap;gap:10px}
.pfp-res span{display:grid;gap:4px;min-width:150px;padding:14px 18px;border-radius:16px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);font-size:14px;line-height:1.35;color:var(--ink-2)}
.pfp-res span b{font-family:var(--f-display);font-size:clamp(30px,3vw,40px);line-height:1;font-weight:620;font-stretch:84%;letter-spacing:-.03em;color:var(--ink)}
.pfp-media{position:relative;display:grid;gap:16px;min-width:0}
.pfp-logo{position:absolute;z-index:2;left:-18px;top:44px;display:grid;place-items:center;width:112px;height:72px;padding:10px;border-radius:14px;background:var(--card);box-shadow:var(--sh-2)}
.pfp-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.pfp-shot{border-radius:18px}
.pfp-shot .pf-view{aspect-ratio:4/5}
@media (max-width:1080px){
  .pfp-row{grid-template-columns:minmax(0,1fr)}
  .pfp-media{max-width:560px}
  .pfp-shot .pf-view{aspect-ratio:4/3}
  .pfp-logo{display:none}
}
@media (max-width:760px){.pfp-res span{min-width:0;flex:1 1 140px}}

/* project story */
.pfp-story .frame{display:grid;gap:clamp(40px,5vw,72px)}
.pfp-intro{max-width:760px;font-size:19px;line-height:1.65;color:var(--ink-2)}
.pfp-step{display:grid;gap:clamp(24px,4vw,64px);align-items:center}
.pfp-step.has-img{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.pfp-step.has-img.is-flip .pfp-step-img{order:-1}
.pfp-step-copy{display:grid;gap:18px;max-width:640px}
.pfp-step-copy .rich{font-size:17px;line-height:1.65}
.pfp-step-img{margin:0;border-radius:20px;overflow:hidden;box-shadow:var(--sh-2);background:var(--bg-2)}
.pfp-step-img img{display:block;width:100%;height:auto}
.pfp-cta{display:grid;justify-items:center;gap:8px;max-width:860px;margin:0 auto;padding:clamp(28px,4vw,56px);border-radius:24px;background:var(--accent-t);box-shadow:inset 0 0 0 1px var(--line);text-align:center}
.pfp-cta .rich{font-size:18px;line-height:1.6;color:var(--ink)}
@media (max-width:900px){.pfp-step.has-img{grid-template-columns:minmax(0,1fr)}.pfp-step.has-img.is-flip .pfp-step-img{order:0}}

/* category archive filter links */
.pfg .pf-head:empty{display:none}

/* team member */
.tm-row{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(28px,5vw,80px);align-items:center;margin-top:clamp(24px,3vw,40px)}
.tm-row.no-photo{grid-template-columns:minmax(0,1fr)}
.tm-copy{display:grid;gap:18px;justify-items:start;min-width:0}
.tm-motto{max-width:34ch;font-family:var(--f-display);font-size:clamp(22px,2.2vw,30px);line-height:1.2;font-weight:500;font-stretch:92%;letter-spacing:-.02em;color:var(--ink-2);text-wrap:balance}
.tm-photo{margin:0;width:100%;max-width:420px;justify-self:end;aspect-ratio:10/11;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,var(--bg-3),color-mix(in srgb,var(--bg-3) 60%,var(--accent-t)));box-shadow:var(--sh-2)}
.tm-photo img{display:block;width:100%;height:100%;object-fit:cover}
.tm-body{display:grid;gap:clamp(32px,5vw,72px);align-items:start}
.tm-body.has-side{grid-template-columns:minmax(0,7fr) minmax(0,4fr)}
.tm-bio{max-width:720px;font-size:18px;line-height:1.7}
.tm-bio>*+*{margin-top:16px}
.tm-bio blockquote{margin:0;padding-left:20px;border-left:3px solid var(--accent)}
.tm-bio h4{font-size:20px;line-height:1.35;font-weight:600}
.tm-side{display:grid;gap:18px;position:sticky;top:calc(var(--hdr-h) + 24px)}
.tm-box{display:grid;gap:14px;padding:22px 22px 24px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}
.tm-h{font-family:var(--f-display);font-size:21px;line-height:1.15;font-weight:620;font-stretch:94%;letter-spacing:-.02em}
.tm-edu{font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.tm-edu p+p{margin-top:8px}
.tm-certs{display:grid;gap:10px;list-style:none;padding:0;margin:0}
.tm-certs li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:center;font-size:15px;line-height:1.4}
.tm-certs a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.tm-certs a:hover{color:var(--accent);text-decoration-color:currentColor}
.tm-cert-ic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--accent-t);color:var(--accent)}
.tm-cert-ic svg{width:14px;height:14px}
.tm-cert-pic{display:block;width:28px;height:28px;border-radius:6px;overflow:hidden;background:var(--bg-2)}
.tm-cert-pic img{width:100%;height:100%;object-fit:cover}
.tm-back{margin-top:clamp(32px,4vw,56px)}
@media (max-width:1080px){
  .tm-row,.tm-body.has-side{grid-template-columns:minmax(0,1fr)}
  .tm-photo{justify-self:start;max-width:360px}
  .tm-side{position:static}
}
