/* Client Team directory and embedded Team cards. Project layout belongs to client-system.css. */
.hpm-team-page { margin: 0; background: #f2f5f6; color: #17232d; }
.hpm-team-shell { min-height: 100vh; background: #f2f5f6; }
.hpm-team-shell main { padding-top: 72px; }
.hpm-team-shell .hpm-team-hero {
  padding: 70px 7vw 52px;
  background: radial-gradient(circle at 85% 15%, color-mix(in srgb, var(--hpm-brand-secondary) 82%, white 18%), transparent 40%), linear-gradient(145deg, var(--hpm-brand-secondary), var(--hpm-brand-primary));
  color: #fff;
}
.hpm-team-hero nav { display: flex; gap: 8px; align-items: center; color: rgba(255,255,255,.72); font-size: 13px; }
.hpm-team-hero nav a { color: #fff; text-decoration: none; }
.hpm-team-hero nav a:focus-visible,.hpm-team-card a:focus-visible,.hpm-team-project-group header>a:focus-visible,.hpm-team-back:focus-visible { outline: 3px solid var(--hpm-accent); outline-offset: 3px; border-radius: 3px; }
.hpm-team-hero>p { margin: 42px 0 8px; color: var(--hpm-accent); font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.hpm-team-hero h1 { margin: 0 0 16px; font-size: clamp(42px,6vw,78px); line-height: .95; letter-spacing: -.05em; }
.hpm-team-hero>span { display: block; max-width: 650px; color: rgba(255,255,255,.82); font-size: 17px; line-height: 1.6; }
.hpm-team-groups { max-width: 1440px; margin: 0 auto; padding: 54px 7vw 72px; }
.hpm-team-group { margin: 0; padding: 0 0 52px; }
.hpm-team-group+.hpm-team-group { padding-top: 46px; border-top: 1px solid #dce3e8; }
.hpm-team-group__heading { margin-bottom: 22px; }
.hpm-team-group__heading p { margin: 0 0 6px; color: #8b6c25; font-size: 11px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.hpm-team-group__heading h2 { margin: 0; font-size: clamp(28px,3vw,38px); letter-spacing: -.025em; }
.hpm-team-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.hpm-team-grid--primary { grid-template-columns: repeat(2,minmax(0,1fr)); }
.hpm-team-card { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 16px; min-width: 0; padding: 18px; border: 1px solid #dce3e8; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(20,33,43,.06); }
.hpm-team-card .hpm-person-avatar { width: 82px; height: 94px; border-radius: 12px; background: linear-gradient(135deg,var(--hpm-brand-secondary),var(--hpm-brand-primary)); font-size: 21px; }
.hpm-team-card--primary { grid-template-columns: 112px minmax(0,1fr); padding: 22px; border-top: 3px solid var(--hpm-accent); }
.hpm-team-card--primary .hpm-person-avatar { width: 112px; height: 128px; }
.hpm-team-card--compact { grid-template-columns: 64px minmax(0,1fr); padding: 15px; box-shadow: none; }
.hpm-team-card--compact .hpm-person-avatar { width: 64px; height: 72px; border-radius: 10px; font-size: 17px; }
.hpm-team-card__body { min-width: 0; }
.hpm-team-card__category { display: block; color: #8b6c25; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hpm-team-card h3 { overflow-wrap: anywhere; margin: 5px 0 3px; font-size: 19px; line-height: 1.2; }
.hpm-team-card__credentials { color: #52616d; font-weight: 500; }
.hpm-team-card__role { display: block; color: #40525f; font-size: 13px; }
.hpm-team-card p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; margin: 9px 0; color: #687584; font-size: 13px; line-height: 1.5; }
.hpm-team-card__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.hpm-team-card__actions a { color: var(--hpm-brand-primary); font-size: 12px; font-weight: 800; text-decoration: none; }
.hpm-team-project-group { padding: 24px 0; }
.hpm-team-project-group+.hpm-team-project-group { border-top: 1px solid #e1e7eb; }
.hpm-team-project-group>header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.hpm-team-project-group header span { color: #788691; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hpm-team-project-group h3 { margin: 4px 0 0; font-size: 23px; }
.hpm-team-project-group header>a,.hpm-team-back { color: var(--hpm-brand-primary); font-weight: 800; text-decoration: none; }
.hpm-project-team .hpm-team-grid,.hpm-team-home .hpm-team-grid { margin-top: 18px; }
.hpm-team-visibility-notice p { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width:1000px) { .hpm-team-grid,.hpm-team-grid--primary { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) {
  .hpm-team-shell main { padding-top: 62px; }
  .hpm-team-shell .hpm-team-hero { padding: 48px 22px 38px; }
  .hpm-team-groups { padding: 38px 20px 52px; }
  .hpm-team-grid,.hpm-team-grid--primary { grid-template-columns: 1fr; }
  .hpm-team-card,.hpm-team-card--primary { grid-template-columns: 72px minmax(0,1fr); padding: 16px; }
  .hpm-team-card .hpm-person-avatar,.hpm-team-card--primary .hpm-person-avatar { width: 72px; height: 82px; }
  .hpm-team-project-group>header { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion:reduce) { .hpm-team-card,.hpm-team-card * { transition: none !important; } }
