.team-member{--_card-bg: oklch(.93 0 0 / .5);--_card-radius: var(--radius-l);--_card-padding: 1.5rem;--_line-color: oklch(.7 0 0);--_line-inset: 1.5rem;--_line-dash-size: 5px;--_line-fade-stop: 90%;--_pattern-fg: oklch(.7 0 0 / .07);--_name-size: var(--h4);--_role-size: var(--text-s);--_bio-size: var(--text-s);flex-grow:1}.team-member__card{position:relative;overflow:hidden;border-radius:var(--_card-radius);background-color:var(--_card-bg);padding:var(--_card-padding);transition:background-color var(--transition)}.team-member__pattern{position:absolute;inset:0;block-size:100%;inline-size:100%;background:repeating-linear-gradient(315deg,var(--_pattern-fg) 0,var(--_pattern-fg) 1px,transparent 0,transparent 50%);background-size:var(--_line-dash-size) var(--_line-dash-size);background-attachment:fixed}.team-member__line{position:absolute;z-index:1}.team-member__line--top,.team-member__line--bottom{--_h-offset: 200px;inset-inline-start:calc(var(--_h-offset) / 2 * -1);inline-size:calc(100% + var(--_h-offset));block-size:1px;background:linear-gradient(to right,var(--_line-color),var(--_line-color) 50%,transparent 0,transparent);background-size:var(--_line-dash-size) 1px;mask:linear-gradient(to left,var(--_mask-bg) var(--_line-fade-stop),transparent),linear-gradient(to right,var(--_mask-bg) var(--_line-fade-stop),transparent),linear-gradient(black,black);--_mask-bg: #fff;mask-composite:exclude}.team-member__line--top{inset-block-start:var(--_line-inset)}.team-member__line--bottom{inset-block-end:var(--_line-inset)}.team-member__line--left,.team-member__line--right{--_v-offset: 80px;inset-block-start:calc(var(--_v-offset) / 2 * -1);block-size:calc(100% + var(--_v-offset));inline-size:1px;background:linear-gradient(to bottom,var(--_line-color),var(--_line-color) 50%,transparent 0,transparent);background-size:1px var(--_line-dash-size);mask:linear-gradient(to top,var(--_mask-bg) var(--_line-fade-stop),transparent),linear-gradient(to bottom,var(--_mask-bg) var(--_line-fade-stop),transparent),linear-gradient(black,black);--_mask-bg: #fff;mask-composite:exclude}.team-member__line--left{inset-inline-start:var(--_line-inset)}.team-member__line--right{inset-inline-end:var(--_line-inset)}.team-member__photo-area{display:grid;cursor:pointer}.team-member__photo-inner,.team-member__photo-overlay{grid-area:1 / 1}.team-member__photo-inner{overflow:hidden;border-radius:var(--_card-radius)}.team-member__photo{display:block;inline-size:100%;block-size:100%;aspect-ratio:1;object-fit:cover;transition:transform var(--transition);will-change:transform}.team-member__photo-overlay{position:relative;align-self:stretch;z-index:1;border-radius:var(--_card-radius);padding:var(--space-s);display:flex;align-items:flex-end;--icon-scheme: light;--icon-color: var(--text-light-muted);--icon-color-hover: var(--text-dark);&:before{background-image:linear-gradient(to bottom,#0b0b0b00 40%,#0b0b0bf2);opacity:1}&:after{background-color:#0b0b0b99;opacity:0}&:before,&:after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;transition:opacity var(--transition)}}.team-member__overlay-content{gap:var(--space-xs);margin-block-start:auto}.team-member__heading-wrapper{align-items:flex-start;text-align:start}.team-member__name{font-size:var(--_name-size);font-weight:500;color:#fff;& a,a:hover{color:inherit;transition:none}}.team-member__role{font-size:var(--_role-size);color:var(--text-light-muted);font-weight:400}.team-member__reveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .4s ease,opacity .3s ease .05s}.team-member__reveal-inner{overflow:hidden;gap:var(--space-xs)}.team-member__bio{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:var(--_bio-size);color:var(--text-light-muted);text-align:start}.team-member__social{flex-direction:row;align-items:center;gap:var(--space-xs);& li{inline-size:auto}}@media(hover:hover)and (pointer:fine){.team-member__photo-area:hover .team-member__photo{transform:scale(1.05)}.team-member__photo-area:hover .team-member__photo-overlay:before{opacity:0}.team-member__photo-area:hover .team-member__photo-overlay:after{opacity:1}.team-member__photo-area:hover .team-member__reveal{grid-template-rows:1fr;opacity:1}}