/**
* Veritas Team public styles.
*/

.veritas-team {
    --veritas-team-navy: #1b2a41;
    --veritas-team-teal: #09bbb6;
    --veritas-team-text: #000000;
    --veritas-team-border: #d9dee7;
    --veritas-team-bg: #ffffff;
    --veritas-team-filter-inactive-border: #a2a2a5;
    --veritas-team-filter-inactive-text: #a2a2a5;
    --veritas-team-columns: 4;
    color: var( --veritas-team-text );
}

.veritas-team[data-columns="1"] { --veritas-team-columns: 1; }
.veritas-team[data-columns="2"] { --veritas-team-columns: 2; }
.veritas-team[data-columns="3"] { --veritas-team-columns: 3; }
.veritas-team[data-columns="4"] { --veritas-team-columns: 4; }
.veritas-team[data-columns="5"] { --veritas-team-columns: 5; }
.veritas-team[data-columns="6"] { --veritas-team-columns: 6; }

.veritas-team__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 35px;
    justify-content: center;
    margin: 0 0 10px;
}

.veritas-team__filter {
    align-items: center;
    appearance: none;
    background: transparent;
    border: 1px solid #a2a2a5;
    border-radius: 999px;
    color: #a2a2a5;
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: 15px;
    font-weight: 400;
    justify-content: center;
    line-height: 1;
    padding: 5px 10px;
    transition: all 0.2s ease;
    width: 255px;
    text-wrap: pretty;
}

.veritas-team__filter--all {
    letter-spacing: 0;
    text-transform: none;
    width: 100px;
}

.veritas-team__filter--anchor {
    gap: 6px;
    text-decoration: none;
}

.veritas-team__filter--anchor .veritas-team-icon--arrow-down {
    fill: currentColor;
    flex-shrink: 0;
    height: 14px;
    width: 14px;
}

.veritas-team__filter:hover,
.veritas-team__filter:focus-visible {
    background: var( --veritas-team-teal );
    border-color: var( --veritas-team-teal );
    color: #ffffff;
    outline: none;
}

.veritas-team__filter.is-active {
    background: var( --veritas-team-teal );
    border-color: var( --veritas-team-teal );
    color: #ffffff;
}

.veritas-team__grid {
    display: grid;
    gap: 24px;
    margin-bottom: 10px;
    grid-template-columns: repeat( var( --veritas-team-columns ), minmax( 0, 1fr ) );
}

.veritas-team__divider {
    border: none;
    border-top: 1px solid var( --veritas-team-border );
    margin: 66px 0;
}

.veritas-team__heading {
    font-size: 32px;
    line-height: 1.35;
    margin: 66px 0 32px;
    text-align: center;
}

.veritas-team__section--strategic-partners {
    margin-top: 0;
}

.veritas-team__empty {
    color: #666666;
    margin: 0;
    text-align: center;
}

.veritas-team-card {
    background: var( --veritas-team-bg );
    display: flex;
    flex-direction: column;
    width: 200px;
    max-width: 100%;
    margin-inline: auto;
    text-align: center;
    padding-top: 30px;
}

.veritas-team-card[hidden] {
    display: none;
}

.veritas-team-card__photo {
    aspect-ratio: 1 / 1;
    margin: 0 0 16px;
    overflow: hidden;
    width: 100%;
}

.veritas-team-card__image {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.veritas-team-card__body {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
}

.veritas-team-card__name {
    color: var( --veritas-team-text );
    font-family: inherit;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 6px;
    padding: 0;
}

.veritas-team-card__position {
    color: var( --veritas-team-text );
    font-weight: 300;
    font-size: 17px;
    line-height: 1.45;
    margin: 0 0 6px;
    padding: 0;
}

.veritas-team-card__label-color {
    color: #09bbb6;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
    margin: 0 0 6px;
}

.veritas-team-card__label {
    color: var(--veritas-team-text);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
    margin: 0 0 6px;
    padding: 0;
}

.veritas-team-card__contact {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: center;
}

.veritas-team-card__contact-link {
	align-items: center;
	color: var( --veritas-team-teal );
	display: inline-flex;
	justify-content: center;
	position: relative;
	text-decoration: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.veritas-team-card__contact-link[data-tooltip]::before,
.veritas-team-card__contact-link[data-tooltip]::after {
	left: 50%;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transform: translateX( -50% );
	transition: opacity 0.2s ease, transform 0.2s ease;
	visibility: hidden;
	z-index: 2;
}

.veritas-team-card__contact-link[data-tooltip]::before {
	border: 5px solid transparent;
	border-top-color: var( --veritas-team-navy );
	bottom: calc( 100% + 2px );
	content: '';
}

.veritas-team-card__contact-link[data-tooltip]::after {
	background: var( --veritas-team-navy );
	border-radius: 4px;
	bottom: calc( 100% + 12px );
	color: #ffffff;
	content: attr( data-tooltip );
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	max-width: 220px;
	padding: 6px 10px;
	text-align: center;
	white-space: nowrap;
}

.veritas-team-card__contact-link[data-tooltip]:hover::before,
.veritas-team-card__contact-link[data-tooltip]:hover::after,
.veritas-team-card__contact-link[data-tooltip]:focus-visible::before,
.veritas-team-card__contact-link[data-tooltip]:focus-visible::after {
	opacity: 1;
	transform: translateX( -50% ) translateY( -2px );
	visibility: visible;
}

.veritas-team-card__contact-link:hover,
.veritas-team-card__contact-link:focus-visible {
    opacity: 0.75;
    outline: none;
    transform: translateY( -1px );
}

.veritas-team-icon {
    display: block;
    fill: var( --veritas-team-teal );
    height: 20px;
    width: 20px;
}

@media ( max-width: 1024px ) {
    .veritas-team__grid {
        gap: 40px 24px;
        grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
    }
}

@media ( max-width: 640px ) {
    .veritas-team__filters {
        gap: 8px;
        margin-bottom: 32px;
    }

    .veritas-team__grid {
        gap: 32px;
        grid-template-columns: 1fr;
    }

    .veritas-team-card__name {
        font-size: 1.0625rem;
    }

    .veritas-team-card__position {
        font-size: 0.9375rem;
    }
}