.profile-card{cursor:pointer;color:inherit;text-decoration:none}.profile-card .roundel{opacity:0;transform:translateY(10%);transition:opacity .25s var(--ease-circ),transform .4s var(--ease-circ)}.profile-card .roundel .icon{transition:transform .3s var(--ease-circ),color .25s var(--ease-circ)}.profile-card:not(.is-active):hover .roundel{opacity:1;transform:translateY(0)}.profile-card.is-active .roundel{opacity:1;transform:translateY(0) rotate(90deg)}.profile-card.is-active .roundel:before{background-color:var(--c-primary-accent);transform:none!important}.profile-card.is-active .roundel .icon{color:var(--c-primary-accent-text)}span.profile-card{cursor:default}button.profile-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;padding:0;border:0;background:none;text-align:inherit}a.profile-card:not(.is-active):hover .roundel:before,button.profile-card:not(.is-active):hover .roundel:before{background-color:var(--c-primary-accent)}a.profile-card:not(.is-active):hover .roundel .icon,button.profile-card:not(.is-active):hover .roundel .icon{color:var(--c-primary-accent-text)}.profile-card__image{position:relative;width:100%;padding-top:100%;overflow:hidden}.profile-card__image .profile-card__default,.profile-card__image img{position:absolute;left:0;top:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;aspect-ratio:1/1;transition:all .3s ease;border-radius:var(--border-radius)}a.profile-card:hover .profile-card__image img{filter:grayscale(25%)}.profile-card__inr{--flex-justify:space-between;--flex-align:flex-start;margin-top:var(--space-wide)}.profile-card__details>*{display:block}.profile-card__details>*+*{margin-top:.5rem}.profile-card__name{font-size:var(--step-3);font-weight:var(--fw-medium);line-height:1;position:relative;display:inline-block}.profile-card__name:after{content:"";position:absolute;width:0;height:2px;bottom:0;left:0;background-color:currentColor;transition:width .3s var(--ease-circ)}a.profile-card:not(.is-active):hover .profile-card__name:after,button.profile-card:not(.is-active):hover .profile-card__name:after{width:100%}.profile-card__role{font-size:var(--step-0);font-weight:var(--fw-thin)}