.team-members-grid {
	display:grid;
	grid-template-columns:1fr 1fr 1fr 1fr;
	margin-top:3em;
	gap:3em;
	margin-inline:auto;
}

/*.Staff {
	grid-template-columns:1fr 1fr 1fr;
}*/

@media (max-width: 1200px) {
	.team-members-grid {
		grid-template-columns:1fr 1fr 1fr;
		gap:2em;
	}
}

@media (max-width: 800px) {
	.team-members-grid {
		grid-template-columns:1fr 1fr;
		gap:1em;
	}
}

@media (max-width: 400px) {
	.team-members-grid {
		grid-template-columns:1fr;
	}
}

.person {
	all:unset;
	transition:transform .25s;
	width:100%;
	color:#213C52;
}
.person:hover {
	cursor:pointer;
	transform:scale(1.05);
}
.person img {
	width:100%;
	aspect-ratio:1;
	object-fit:cover;
	object-position:top center;
	border:1px solid #707070;
}
.person-name {	
	margin:.5em 0 0;
	font-size:1.2rem;
	color:#213C52;
}
.person-subtitle {
	margin:0;
}
.person .person-email {
	margin-top:0 !important;
	font-size:.9rem;
	word-break:break-all;
}
.dialog[open] {
	padding:3em;
	border:none;
	box-shadow:0 0 50px #0003;
	background:#F2F9FF;
	max-width:90%;
	width:1700px;
	display:flex;
	margin:auto;
}

.person-dialog {
	margin:auto;
}

@media (max-width: 1200px) {
	.dialog {
		margin-inline:1em;
	}
}

.close-dialog {
	all:unset;
	text-align:right;
	font-weight:bold;
	display:block;
	width:100%;
	padding:1em;
	box-sizing:border-box;
	position:absolute;
	top:0;
	right:0;
}
.close-dialog:hover {
	cursor:pointer;
	text-decoration:underline;
}

.person-bio-section {
	display:flex;
	padding:3em;
	gap:6em;
	align-items:start;
	max-width:1200px;
	margin:auto;
}


.person-bio-section .person-name {
	font-size:2rem;
}
.person-dialog-text,
.person-dialog-image-wrapper {
	flex-basis:50%;
}

.person-dialog-image-wrapper {
	display:flex;
	justify-content:flex-end;
}

.person-dialog-image {
	position:relative;
	width:100%;
	max-width:400px;
}

.person-dialog-image:before {
	position:absolute;
	content:" ";
	left:-20px;
	top:-20px;
	background:#023047;
	width:100%;
	height:100%;
	z-index:-1;
}

.person-dialog-image:after {
	position:absolute;
	content:" ";
	right:-20px;
	bottom:-20px;
	background:#FDBD00;
	width:75%;
	height:75%;
	z-index:-1;
}

.person-dialog-image img {
	width:100%;
	aspect-ratio:1;
	object-fit:cover;
	object-position:top center;
	display:block;
}

@media (max-width: 960px) {
	.person-bio-section {
		display:block;
	}
	.person-dialog-image-wrapper {
		justify-content:center;
		margin:40px 0 40px;
	}
}

.person-bio-section .person-subtitle {
	color:#213C52;
	font-size:1.2em;
	margin:0;
	margin-bottom:1em;
	padding-bottom:1em;
	border-bottom:1px solid currentColor;
}

.person-link {
	background:var(--pink);
	padding:.5em 1em;
	border:none;
	color:#fff !important;
	text-decoration:none;
	font-size:1.2rem;
	font-weight:bold;
}

.person-link:hover {
	background:var(--blue);
	color:#fff !important;
}