﻿@charset "UTF-8";
section.team-directory {
    --block-background-color: var(--okd-block-theme-bg-neutral-110);
    --td-line: var(--okd-block-theme-line-on-dark, rgba(255, 255, 255, 0.12));
    --td-heading: var(--okd-block-theme-heading-on-dark);
    --td-body: var( --okd-block-theme-body-on-dark, var(--okd--preset--color--neutral-20));
    --td-card-job: var(--okd--preset--color--neutral-40);
    --td-card-body-hover-fill: var(--okd--preset--color--neutral-90);
    --td-dialog-bg: var(--okd--preset--color--neutral-100);
    --td-dialog-kicker: var(--okd--preset--color--neutral-40);
    --td-dialog-job: var(--okd--preset--color--neutral-40);
    --td-dialog-bio: var(--okd--preset--color--neutral-40);
    --td-dialog-close-icon: #5a636a;
    --td-sticky-bg: var(--block-background-color);
    --td-inactive-heading: var(--okd--preset--color--neutral-80);
    --td-inactive-body: var(--okd--preset--color--neutral-80);
    --td-inactive-dot: var(--okd--preset--color--neutral-50);
    --okd-block-border-line-color: var(--td-line);
    --td-dialog-content-width: 465px;
    --td-dialog-viewport-inline-end: calc( ( 100vw - min( calc( var(--okd-block-max-width) - 2 * var(--okd-line-gutter)), calc(100vw - 2 * var(--okd-line-gutter)))) / 2);
    --td-dialog-guide-clearance: var(--okd--preset--spacing--16);
    --td-dialog-mobile-padding-inline: calc( var(--td-dialog-guide-clearance) + var(--okd-line-width) + var(--td-dialog-guide-clearance));
    color: var(--td-body);
    overflow: visible;
    padding-inline: var(--okd-line-gutter);
    position: relative
}

@media (min-width:1025px) {
    section.team-directory {
        --td-dialog-guide-clearance: var(--okd--preset--spacing--24)
    }
}

@media (max-width:1024px) {
    section.team-directory {
        --td-dialog-mobile-padding-inline: 40px
    }
}

section.team-directory.-theme-neutral-100 {
    --block-background-color: var(--okd-block-theme-bg-neutral-100);
    --td-dialog-bg: var(--okd--preset--color--neutral-110)
}

section.team-directory.-theme-neutral-10 {
    --block-background-color: var(--okd-block-theme-bg-neutral-10);
    --td-heading: var(--okd-block-theme-heading-on-light);
    --td-body: var(--okd-block-theme-body-on-light);
    --td-card-job: var(--okd--preset--color--neutral-70);
    --td-card-body-hover-fill: var(--okd--preset--color--neutral-20);
    --td-line: var(--okd--preset--color--neutral-40);
    --td-dialog-bg: var(--okd--preset--color--neutral-0, #fff);
    --td-dialog-kicker: var(--okd--preset--color--neutral-60);
    --td-dialog-job: var(--okd--preset--color--neutral-70);
    --td-dialog-bio: var(--okd--preset--color--neutral-70);
    --td-dialog-close-icon: var(--okd--preset--color--neutral-60);
    --td-sticky-bg: var(--okd-block-theme-bg-neutral-10, #fafafa);
    --td-inactive-heading: var(--okd--preset--color--neutral-60);
    --td-inactive-body: var(--okd--preset--color--neutral-70);
    --td-inactive-dot: var(--okd--preset--color--neutral-50)
}

section.team-directory .team-directory__inner {
    container-name: teamdir;
    container-type: inline-size;
    margin-inline: auto;
    max-width: calc(var(--okd-block-max-width) - var(--okd-line-gutter) * 2);
    overflow: visible;
    position: relative;
    width: 100%
}

section.team-directory .team-directory__groups {
    display: flex;
    flex-direction: column;
    gap: 0
}

section.team-directory .team-directory__group.u-grid {
    margin-inline: 0;
    max-width: none
}

section.team-directory .team-directory__group.u-grid>.team-directory__group-head,
section.team-directory .team-directory__group.u-grid>.team-directory__group-body {
    min-width: 0
}

section.team-directory .team-directory__group {
    align-items: stretch;
    padding-top: 140px;
    position: relative;
    width: 100%
}

@media (min-width:1025px) {
    section.team-directory .team-directory__group {
        padding-top: 0
    }
}

section.team-directory .team-directory__group+.team-directory__group {
    border-top: var(--okd-line-width) solid var(--td-line)
}

section.team-directory .team-directory__group+.team-directory__group::before {
    --circle-background-color: var(--okd-line-color);
    --circle-size: 8px;
    background-color: var(--circle-background-color);
    -webkit-clip-path: circle(50%);
    clip-path: circle(50%);
    display: block;
    height: var(--circle-size);
    pointer-events: none;
    position: absolute;
    width: var(--circle-size);
    z-index: 10;
    --circle-background-color: var(--td-line);
    content: "";
    left: 0;
    pointer-events: none;
    top: 0;
    transform: translate(-50%, -50%)
}

section.team-directory .team-directory__group-head {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin-inline: auto;
    padding: var(--okd--preset--spacing--24);
    width: 100%
}

@media (min-width:1025px) {
    section.team-directory .team-directory__group-head {
        border-right: var(--okd-line-width) solid var(--td-line);
        padding-block: var(--okd--preset--spacing--48)
    }
}

section.team-directory .team-directory__group-title {
    font-size: clamp(16px, calc(16px + 3 * ((100vw - 420px) / (1620 - 420))), 19px);
    line-height: 1.5;
    color: var(--td-heading);
    font-weight: 400;
    letter-spacing: .01em;
    margin: 0;
    transition: color 0.5s ease-out
}

section.team-directory .team-directory__group-body {
    min-width: 0
}

section.team-directory .team-directory__grid {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

@container teamdir (max-width:1100px) {
    section.team-directory .team-directory__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@container teamdir (max-width:720px) {
    section.team-directory .team-directory__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@container teamdir (max-width:420px) {
    section.team-directory .team-directory__grid {
        grid-template-columns: 1fr
    }
}

@media (max-width:1024px) {
    section.team-directory .team-directory__grid {
        border-left: var(--okd-line-width) solid var(--td-line)
    }
}

section.team-directory .team-directory__card {
    appearance: none;
    background: #fff0;
    border: 0;
    border-bottom: var(--okd-line-width) solid var(--td-line);
    border-radius: 0;
    border-right: var(--okd-line-width) solid var(--td-line);
    color: inherit;
    cursor: pointer;
    display: grid;
    gap: 0;
    grid-template-areas: "media" "body";
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    margin: 0;
    min-width: 0;
    padding: 0;
    position: relative;
    text-align: left;
    transition: opacity 0.35s ease;
    width: 100%
}

@container teamdir (max-width:420px) {
    section.team-directory .team-directory__card {
        grid-template-areas: "body media";
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: auto
    }
}

section.team-directory .team-directory__card:focus-visible {
    outline: 2px solid var(--okd--preset--color--hypergreen);
    outline-offset: 3px;
    z-index: 5
}

section.team-directory.team-directory--modal-open .team-directory__card:focus-visible {
    z-index: 6
}

section.team-directory .team-directory__card-media {
    aspect-ratio: 1/1;
    background-color: #fff0;
    grid-area: media;
    isolation: isolate;
    min-width: 0;
    overflow: visible;
    position: relative;
    width: 100%
}

section.team-directory .team-directory__card-diagonal {
    color: var(--td-line);
    inset: 0;
    opacity: .85;
    pointer-events: none;
    position: absolute;
    z-index: 0
}

section.team-directory .team-directory__card-diagonal-svg {
    display: block;
    height: 100%;
    width: 100%
}

section.team-directory .team-directory__card-dots {
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.5s ease-out;
    z-index: 5
}

section.team-directory .team-directory__card-dots--foot {
    z-index: 4
}

section.team-directory .team-directory__card-dot {
    --circle-background-color: var(--okd-line-color);
    --circle-size: 8px;
    background-color: var(--circle-background-color);
    -webkit-clip-path: circle(50%);
    clip-path: circle(50%);
    display: block;
    height: var(--circle-size);
    pointer-events: none;
    position: absolute;
    width: var(--circle-size);
    z-index: 10;
    --circle-background-color: var(--td-inactive-dot);
    --circle-size: 6px;
    position: absolute
}

section.team-directory .team-directory__card-dot--tl {
    left: 0;
    top: 0;
    transform: translate(-50%, -50%)
}

section.team-directory .team-directory__card-dot--tr {
    right: 0;
    top: 0;
    transform: translate(50%, -50%)
}

section.team-directory .team-directory__card-dot--bl {
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%)
}

section.team-directory .team-directory__card-dot--br {
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%)
}

section.team-directory .team-directory__card-dot--foot-bl {
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%)
}

section.team-directory .team-directory__card-dot--foot-br {
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%)
}

section.team-directory .team-directory__card-media-inner {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    display: block;
    height: 100%;
    overflow: hidden;
    position: relative;
    transform-origin: center center;
    width: 100%;
    z-index: 2
}

section.team-directory .team-directory__card-img-el {
    display: block;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transform-origin: center;
    transition: transform 0.35s ease;
    width: 100%
}

section.team-directory .team-directory__card-img-fallback {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    opacity: .35;
    width: 100%
}

section.team-directory .team-directory__card-text {
    align-self: stretch;
    background-image: linear-gradient(var(--td-card-body-hover-fill), var(--td-card-body-hover-fill));
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 100% 0%;
    display: flex;
    flex-direction: column;
    gap: 4px;
    grid-area: body;
    min-height: 0;
    min-width: 0;
    padding-block-end: 21px;
    padding-block-start: var(--okd--preset--spacing--16, 16px);
    padding-inline: var(--okd--preset--spacing--16, 16px);
    transition: background-size 0.5s cubic-bezier(.4, 0, .2, 1)
}

section.team-directory .team-directory__card-open-hint {
    display: none
}

@container teamdir (max-width:420px) {
    section.team-directory .team-directory__card-text {
        justify-content: flex-end
    }
    section.team-directory .team-directory__card-open-hint {
        align-items: center;
        background: rgb(239 240 241 / .15);
        backdrop-filter: blur(48px);
        border-radius: 4px;
        bottom: 16px;
        box-sizing: border-box;
        display: flex;
        height: 32px;
        justify-content: center;
        pointer-events: none;
        position: absolute;
        right: 16px;
        width: 32px;
        z-index: 3
    }
    section.team-directory .team-directory__card-open-hint svg {
        display: block;
        flex-shrink: 0
    }
    section.team-directory .team-directory__card-open-hint svg path {
        stroke: #fff
    }
    section.team-directory.-theme-neutral-10 .team-directory__card-open-hint svg path {
        stroke: var(--td-heading)
    }
}

section.team-directory .team-directory__card-name {
    color: var(--td-heading);
    font-size: 14px;
    letter-spacing: .02em;
    line-height: 1.5;
    transition: color 0.5s ease-out
}

section.team-directory .team-directory__card-job {
    color: var(--td-card-job, var(--okd--preset--color--neutral-40));
    font-size: 12px;
    letter-spacing: .01em;
    line-height: 1.5;
    margin: 0;
    transition: color 0.5s ease-out
}

@media (hover:hover) and (pointer:fine) {
    section.team-directory .team-directory__card:hover .team-directory__card-name,
    section.team-directory .team-directory__card:focus-visible .team-directory__card-name {
        color: var(--okd--preset--color--hypergreen)
    }
    section.team-directory .team-directory__card:hover .team-directory__card-img-el,
    section.team-directory .team-directory__card:focus-visible .team-directory__card-img-el {
        transform: scale(1.02)
    }
    section.team-directory .team-directory__card:hover .team-directory__card-text {
        background-size: 100% 100%
    }
}

section.team-directory .team-directory__card:focus-visible .team-directory__card-text {
    background-size: 100% 100%
}

section.team-directory.team-directory--modal-open .team-directory__group-title {
    color: var(--td-inactive-heading)
}

section.team-directory.team-directory--modal-open .team-directory__card {
    z-index: 2
}

section.team-directory.team-directory--modal-open .team-directory__card .team-directory__card-dots {
    opacity: 1
}

@container teamdir (min-width:421px) {
    section.team-directory.team-directory--modal-open .team-directory__card .team-directory__card-text {
        border-top: var(--okd-line-width) solid var(--td-line)
    }
}

section.team-directory.team-directory--modal-open .team-directory__card .team-directory__card-name {
    color: var(--td-inactive-heading)
}

section.team-directory.team-directory--modal-open .team-directory__card .team-directory__card-job {
    color: var(--td-inactive-body);
    opacity: 1
}

@media (prefers-reduced-motion:reduce) {
    section.team-directory .team-directory__card,
    section.team-directory .team-directory__card-text,
    section.team-directory .team-directory__card-name,
    section.team-directory .team-directory__card-img-el,
    section.team-directory .team-directory__card-dots,
    section.team-directory .team-directory__group-title {
        transition: none
    }
    section.team-directory .team-directory__card:hover .team-directory__card-img-el,
    section.team-directory .team-directory__card:focus-visible .team-directory__card-img-el {
        transform: none
    }
    section.team-directory.team-directory--modal-open .team-directory__card .team-directory__card-media-inner {
        clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);
        -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%)
    }
}

section.team-directory .team-directory__empty {
    color: var(--td-body);
    font-size: .9375rem;
    margin: 0;
    opacity: .85;
    padding: var(--okd--preset--spacing--24)
}

section.team-directory .team-directory__empty--block {
    padding-block: var(--okd--preset--spacing--32)
}

section.team-directory .team-directory__sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

section.team-directory.team-directory--editor .team-directory__card-text {
    padding-block-end: 21px !important;
    padding-block-start: 16px !important;
    padding-inline: 16px !important
}

section.team-directory.team-directory--editor .team-directory__card-text :where(p) {
    margin-block: 0 !important
}

@media (max-width:1024px) {
    section.team-directory .team-directory__group-head {
        background-color: var(--td-sticky-bg);
        border-bottom: var(--okd-line-width) solid var(--td-line);
        border-right: 0;
        box-shadow: inset var(--okd-line-width) 0 0 0 var(--td-line), inset calc(-1 * var(--okd-line-width)) 0 0 0 var(--td-line);
        overflow: visible;
        position: sticky;
        top: var(--okd-header-inline-height, 80px);
        width: 100%
    }
    section.team-directory .team-directory__group-head::before,
    section.team-directory .team-directory__group-head::after {
        --circle-background-color: var(--okd-line-color);
        --circle-size: 8px;
        background-color: var(--circle-background-color);
        -webkit-clip-path: circle(50%);
        clip-path: circle(50%);
        display: block;
        height: var(--circle-size);
        pointer-events: none;
        position: absolute;
        width: var(--circle-size);
        z-index: 10;
        --circle-background-color: var(--td-line);
        --circle-size: 6px;
        bottom: 0;
        content: ""
    }
    section.team-directory .team-directory__group-head::before {
        left: 0;
        transform: translate(-50%, 50%)
    }
    section.team-directory .team-directory__group-head::after {
        right: 0;
        transform: translate(50%, 50%)
    }
}

section.team-directory .team-directory__dialog {
    background: #fff0;
    border: none;
    margin: 0;
    max-height: var(--okd-vh);
    max-width: 100vw;
    padding: 0;
    z-index: 60
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog {
        z-index: 40
    }
}

section.team-directory .team-directory__dialog[open] {
    align-items: stretch;
    bottom: 0;
    display: flex;
    height: var(--okd-vh);
    justify-content: flex-end;
    left: 0;
    margin: 0;
    max-height: var(--okd-vh);
    max-width: 100vw;
    position: fixed;
    right: 0;
    top: 0;
    transform: none;
    translate: none;
    width: 100vw
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog[open] {
        bottom: auto;
        height: calc(var(--okd-vh) - var(--okd-header-inline-height, 80px));
        justify-content: stretch;
        left: 0;
        max-height: calc(var(--okd-vh) - var(--okd-header-inline-height, 80px));
        right: 0;
        top: var(--okd-header-inline-height, 80px);
        width: 100vw
    }
    section.team-directory .team-directory__dialog[open]::before,
    section.team-directory .team-directory__dialog[open]::after {
        --circle-background-color: var(--okd-line-color);
        --circle-size: 8px;
        background-color: var(--circle-background-color);
        -webkit-clip-path: circle(50%);
        clip-path: circle(50%);
        display: block;
        height: var(--circle-size);
        pointer-events: none;
        position: absolute;
        width: var(--circle-size);
        z-index: 10;
        --circle-background-color: var(--td-line);
        --circle-size: 8px;
        content: "";
        pointer-events: none;
        position: fixed;
        top: var(--okd-header-inline-height, 80px);
        z-index: 5
    }
    section.team-directory .team-directory__dialog[open]::before {
        left: var(--okd-line-gutter);
        transform: translate(-50%, -50%)
    }
    section.team-directory .team-directory__dialog[open]::after {
        left: auto;
        right: var(--okd-line-gutter);
        transform: translate(50%, -50%)
    }
}

@media (max-width:1024px) {
    body:has(.team-directory__dialog[open]) header.header .header_inline .okd-block-container-lines::before,
    body:has(.team-directory__dialog[open]) header.header .header_inline .okd-block-container-lines::after {
        visibility: hidden
    }
    body:has(.team-directory__dialog[open]) {
        overflow: hidden
    }
}

section.team-directory .team-directory__dialog::backdrop {
    background: #fff0
}

section.team-directory .team-directory__dialog-scrim {
    background: #fff0;
    border: 0;
    cursor: pointer;
    inset: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    z-index: 0
}

section.team-directory .team-directory__dialog-panel {
    background: var(--td-dialog-bg);
    border: 0;
    border-left: var(--okd-line-width) solid var(--td-line);
    border-radius: 0;
    color: var(--td-body);
    display: flex;
    flex: 0 0 min(var(--td-dialog-content-width) + var(--td-dialog-viewport-inline-end), 100vw);
    flex-direction: column;
    height: 100%;
    margin: 0;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: min(var(--td-dialog-content-width) + var(--td-dialog-viewport-inline-end), 100vw);
    will-change: transform;
    z-index: 1
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-panel {
        overflow: visible
    }
    section.team-directory .team-directory__dialog-panel::before {
        background-color: var(--td-line);
        content: "";
        height: var(--okd-line-width);
        pointer-events: none;
        position: absolute;
        right: 0;
        top: calc(var(--okd-header-inline-height) + 0.5px - var(--okd-line-width));
        width: var(--td-dialog-viewport-inline-end);
        z-index: 3
    }
    section.team-directory .team-directory__dialog-panel::after {
        background-color: var(--td-line);
        content: "";
        inset-block: 0;
        pointer-events: none;
        position: absolute;
        right: var(--td-dialog-viewport-inline-end);
        width: var(--okd-line-width);
        z-index: 2
    }
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-panel {
        border-left: 0;
        border-top: var(--okd-line-width) solid var(--td-line);
        flex: 1 1 auto;
        height: 100%;
        width: 100%
    }
    section.team-directory .team-directory__dialog-panel::before,
    section.team-directory .team-directory__dialog-panel::after {
        background-color: var(--td-line);
        content: "";
        inset-block: 0;
        pointer-events: none;
        position: absolute;
        width: var(--okd-line-width);
        z-index: 2
    }
    section.team-directory .team-directory__dialog-panel::before {
        left: var(--td-dialog-guide-clearance)
    }
    section.team-directory .team-directory__dialog-panel::after {
        left: auto;
        right: var(--td-dialog-guide-clearance)
    }
}

section.team-directory .team-directory__dialog-top {
    align-items: center;
    border-bottom: var(--okd-line-width) solid var(--td-line);
    display: flex;
    flex-shrink: 0;
    height: calc(var(--okd-header-inline-height) + 0.5px);
    justify-content: flex-end;
    position: relative;
    width: 100%
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-top {
        align-self: flex-start;
        padding-inline: var(--okd-line-gutter);
        width: calc(100% - var(--td-dialog-viewport-inline-end));
        z-index: 2
    }
    section.team-directory .team-directory__dialog-top::before,
    section.team-directory .team-directory__dialog-top::after {
        --circle-background-color: var(--okd-line-color);
        --circle-size: 8px;
        background-color: var(--circle-background-color);
        -webkit-clip-path: circle(50%);
        clip-path: circle(50%);
        display: block;
        height: var(--circle-size);
        pointer-events: none;
        position: absolute;
        width: var(--circle-size);
        z-index: 10;
        --circle-background-color: var(--td-line);
        --circle-size: 6px;
        bottom: 0;
        content: "";
        z-index: 1
    }
    section.team-directory .team-directory__dialog-top::before {
        left: 0;
        transform: translate(-50%, 50%)
    }
    section.team-directory .team-directory__dialog-top::after {
        right: 0;
        transform: translate(50%, 50%)
    }
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-top {
        align-items: center;
        border-bottom: none;
        height: auto;
        justify-content: space-between;
        min-height: 0;
        padding-block: var(--okd--preset--spacing--24, 24px) var(--okd--preset--spacing--48, 48px);
        padding-inline: var(--td-dialog-mobile-padding-inline)
    }
}

section.team-directory .team-directory__dialog-kicker--toolbar {
    padding-top: 0
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-kicker--toolbar {
        display: none
    }
}

section.team-directory .team-directory__dialog-kicker {
    color: var(--td-dialog-kicker);
    font-size: 16px;
    letter-spacing: .01em;
    line-height: 1.5;
    margin: 0;
    padding-top: var(--okd--preset--spacing--24, 24px)
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-kicker--in-head {
        border: 0;
        clip: rect(0, 0, 0, 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px
    }
}

section.team-directory .team-directory__dialog-close {
    align-items: center;
    align-self: center;
    background: #fff0;
    border: none;
    color: var(--td-dialog-close-icon);
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    height: 48px;
    justify-content: center;
    margin: 0;
    padding: 0;
    width: 48px
}

section.team-directory .team-directory__dialog-close-stack {
    display: grid;
    height: 23px;
    place-items: center;
    position: relative;
    width: 23px
}

section.team-directory .team-directory__dialog-close-icon {
    align-items: center;
    display: flex;
    grid-area: 1/1;
    justify-content: center
}

section.team-directory .team-directory__dialog-close-icon svg {
    display: block
}

section.team-directory .team-directory__dialog-close-icon--base {
    color: inherit
}

section.team-directory .team-directory__dialog-close-icon--hover {
    clip-path: inset(50%);
    color: var(--okd--preset--color--hypergreen);
    transition: clip-path 0.45s cubic-bezier(.4, 0, .2, 1)
}

@media (hover:hover) and (pointer:fine) {
    section.team-directory .team-directory__dialog-close:hover .team-directory__dialog-close-icon--hover {
        clip-path: inset(0)
    }
}

section.team-directory .team-directory__dialog-close:focus-visible .team-directory__dialog-close-icon--hover {
    clip-path: inset(0)
}

@media (prefers-reduced-motion:reduce) {
    section.team-directory .team-directory__dialog-close-icon--hover {
        transition: none
    }
}

section.team-directory .team-directory__dialog-close:focus-visible {
    outline: 2px solid var(--okd--preset--color--hypergreen);
    outline-offset: 2px
}

section.team-directory .team-directory__dialog[data-td-close-focus-muted] .team-directory__dialog-close:focus-visible {
    outline: none
}

section.team-directory .team-directory__dialog-scroll {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    position: relative
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-scroll {
        align-self: flex-start;
        max-width: min(var(--td-dialog-content-width), 100% - var(--td-dialog-viewport-inline-end));
        width: 100%
    }
}

section.team-directory .team-directory__dialog-scroll.team-directory__dialog-scroll--native {
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-scroll.team-directory__dialog-scroll--native {
        -ms-overflow-style: none;
        scrollbar-width: none
    }
    section.team-directory .team-directory__dialog-scroll.team-directory__dialog-scroll--native::-webkit-scrollbar {
        display: none
    }
}

section.team-directory .team-directory__dialog-scroll-inner {
    padding-block: 0 var(--okd--preset--spacing--48)
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-scroll-inner {
        flex: 1 1 auto;
        min-height: 0;
        padding-block-end: 0;
        padding-inline: var(--okd-line-gutter) 0
    }
    section.team-directory .team-directory__dialog-scroll-inner::after {
        content: "";
        display: block;
        height: var(--okd--preset--spacing--48, 48px)
    }
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-scroll-inner {
        flex: 0 0 auto;
        min-height: 100%;
        padding-inline: var(--td-dialog-mobile-padding-inline)
    }
}

section.team-directory .team-directory__dialog-head {
    align-items: stretch;
    display: grid;
    gap: var(--okd--preset--spacing--24);
    grid-template-columns: minmax(0, 1fr) minmax(0, 42%)
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-head {
        align-items: start;
        grid-template-columns: 1fr
    }
}

section.team-directory .team-directory__dialog-head:has(.team-directory__dialog-media[hidden]) {
    grid-template-columns: 1fr
}

section.team-directory .team-directory__dialog-head-text {
    display: flex;
    flex-direction: column;
    gap: var(--okd--preset--spacing--20);
    justify-content: flex-start;
    min-height: 0;
    min-width: 0
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-head-text {
        gap: 0;
        justify-content: space-between
    }
}

section.team-directory .team-directory__dialog-head-identity {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-width: 0
}

section.team-directory .team-directory__dialog-media {
    aspect-ratio: 1/1;
    margin: 0;
    max-width: 100%;
    overflow: hidden;
    width: 100%
}

@media (max-width:1024px) {
    section.team-directory .team-directory__dialog-media {
        display: none !important
    }
}

section.team-directory .team-directory__dialog-media img,
section.team-directory .team-directory__dialog-img {
    border-radius: 0;
    display: block;
    height: 100%;
    max-height: none;
    object-fit: cover;
    width: 100%
}

section.team-directory .team-directory__dialog-title {
    color: var(--td-heading);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -.01em;
    line-height: 1.1;
    margin: 0;
    padding-inline-end: 0;
    text-wrap: pretty
}

section.team-directory [data-td-dialog-reveal] {
    backface-visibility: hidden;
    transform: translateZ(0)
}

section.team-directory [data-td-dialog-reveal].is-td-dialog-str-split [class*=-mask] {
    clip-path: inset(-.22em -.05em -.32em -.05em);
    overflow: visible !important
}

section.team-directory [data-td-dialog-reveal].is-td-dialog-str-split [class*=team-directory__dialog-line] {
    display: block;
    margin-block-end: -.22em;
    padding-block-end: .22em
}

section.team-directory .team-directory__dialog-job {
    color: var(--td-dialog-job);
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    text-wrap: pretty
}

section.team-directory .team-directory__dialog-bio {
    color: var(--td-dialog-bio);
    font-size: 14px;
    letter-spacing: .02em;
    line-height: 1.5;
    margin-top: var(--okd--preset--spacing--48, 48px);
    text-wrap: pretty
}

section.team-directory .team-directory__dialog-bio p:not(:last-child) {
    margin-bottom: 1em
}

@media (min-width:1025px) {
    section.team-directory .team-directory__dialog-bio {
        padding-inline-end: var(--td-dialog-guide-clearance)
    }
}