/* Figma originals: grayscale at rest, slight zoom and color on hover. */
/* Keep the people section on the same centered content grid as header, context and footer. */
.demo-page #people>.inner{width:calc(100% - 192px);max-width:1248px;margin-inline:auto}
.demo-page #people .team-members{grid-template-columns:repeat(3,minmax(0,384px))}
@media(max-width:1439px){.demo-page #people .team-members{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1100px){.demo-page #people>.inner{width:calc(100% - 96px)}}
@media(max-width:750px){.demo-page #people>.inner{width:calc(100% - 48px)}.demo-page #people .team-members{grid-template-columns:1fr}}
.demo-page .team-member .abstract-portrait{height:auto;aspect-ratio:16/9;background:#0d1013;position:relative;overflow:hidden;outline:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;cursor:pointer}
.team-identity-image{position:absolute;inset:0;transform:scale(1);transition:transform 450ms cubic-bezier(.22,1,.36,1);pointer-events:none}
.abstract-portrait .team-identity-gray{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill;object-position:bottom;pointer-events:none}
.team-identity-color{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 450ms cubic-bezier(.22,1,.36,1)}
.team-identity-color img{position:absolute;display:block;max-width:none;width:320%;height:379.26%;left:var(--color-left);top:-207.41%;pointer-events:none}
.abstract-portrait.is-active .team-identity-image{transform:scale(1.03);transition-duration:500ms}
.abstract-portrait.is-active .team-identity-color{opacity:1;transition-duration:500ms}
.team-member .abstract-portrait:focus-visible{outline:1px solid #c9ae78;outline-offset:5px}
.demo-page .team-member h2{margin-top:24px}
@media(min-width:1200px){.demo-page .team-members{grid-template-columns:repeat(3,minmax(0,384px));gap:40px}}
@media(min-width:751px){.demo-page .team-member{min-height:432px}}
@media(max-width:750px){.demo-page .team-member .abstract-portrait{aspect-ratio:16/9;height:auto}.demo-page .team-member h2{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.team-identity-image{transform:none!important;transition:none}.team-identity-color{transition:none}}