/* Variables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
	--color-primary: rgb(6, 83, 136);
	--color-primary-light: rgb(35, 101, 146);
	--color-primary-muted: rgb(245, 248, 250);
	--color-secondary: rgb(138, 10, 29);
	--color-body: rgb(26, 26, 26);
	--padding-default: 4.5rem;
}


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.btn {
	--color-bg: var(--color-primary);
	--color-border: var(--color-primary);
	--color-text: rgb(255, 255, 255);
	display: inline-block;
	padding: 0.7em 1.5em;
	background-color: var(--color-bg);
	border: 2px solid var(--color-border);
	border-radius: 0.4em;
	font-weight: bold;
	color: var(--color-text);
	text-align: center;
	text-decoration: none;
	transition: 0.2s ease background-color;
}

.btn.outline {
	--color-bg: transparent;
	--color-border: var(--color-primary);
	--color-text: var(--color-primary);
	border: 2px solid var(--color-border);
}

.btn:not(.outline)[data-color="white"] {
	--color-bg: rgb(255, 255, 255);
	--color-text: var(--color-primary);
}

.btn.outline[data-color="white"] {
	--color-border: rgb(255, 255, 255);
	--color-text: rgb(255, 255, 255);
}

.btn:hover,
.btn:focus {
	--color-bg: var(--color-primary-light);
	text-decoration: none;
}

.btn.outline:hover,
.btn.outline:focus {
	--color-bg: var(--color-primary-light);
	--color-text: rgb(255, 255, 255);
}

.btn[data-color="white"]:hover,
.btn[data-color="white"]:focus {
	--color-bg: rgb(238, 238, 238);
	--color-border: var(--color-primary);
	--color-text: var(--color-primary);
}

.txt-flow * + .btn {
	margin-top: 1.25rem;
	margin-bottom: 0.25rem;
}


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul, ol {
	padding-left: 1.2rem;
	margin-block: 1rem;
}

li + li {
	margin-top: 0.25rem;
}

li :is(ul, ol) {
	margin-block: 0.25rem;
}

li ul {
	list-style: circle;
}


/* Icon Masks
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.icon-mask {
	-webkit-mask-image: var(--icon);
	mask-image: var(--icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	mask-size: cover;
}


/* Responsive Embeds
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.embed-container {
	max-width: 100%;
	height: 0;
	position: relative;
	padding-bottom: 56.25%;
	overflow: hidden;
}

	.embed-container iframe,
	.embed-container object,
	.embed-container embed {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}


/* Structure
–––––––––––––––––––––––––––––––––––––––––––––––––– */
main {
	width: 100%;
	padding-block: var(--padding-default);
}

.wrapper {
	width: 65rem;
	max-width: 100%;
	padding-inline: 2rem;
	margin: 0 auto;
}

.section-full {
	width: 100%;
	padding-block: var(--padding-default);
	background-color: rgb(240, 240, 240);
}

.section-row + .section-row {
	margin-top: var(--padding-default);
}

.columns > .wp-block-group__inner-container {
	columns: auto 2;
	gap: 2rem;
	margin-top: 1rem;
}

	.columns > .wp-block-group__inner-container > * {
		break-inside: avoid;
	}

	.columns > .wp-block-group__inner-container > :first-child {
		margin-top: 0;
	}

.page-w-sidebar {
	display: grid;
	grid-template-columns: minmax(10rem, 25%) minmax(0, 1fr);
	gap: 2rem;
	padding-top: 2rem;
	margin-top: 1.5rem;
	border-top: 2px solid var(--color-secondary);
}

	.page-w-sidebar > div > :first-child {
		margin-top: 0;
	}

/* 600px */
@media (max-width: 37.5em) {

	.wrapper {
		padding-inline: 1.5rem;
	}

	.columns > .wp-block-group__inner-container {
		columns: auto 1;
		gap: 2rem;
	}

	.page-w-sidebar {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

}


/* Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#header {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1.5rem;
	padding: 1rem 1.5rem;
	background-color: var(--color-primary);
}

#masthead.index #header {
	background-color: transparent;
}

	#header .logo {
		min-width: 4rem;
		max-width: 40%;
		display: block;
		flex: 0 1 9rem;
	}

#header-nav ul {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

#header-nav li {
	position: relative;
	margin: 0;
	opacity: 1;
	transition: 0.2s ease opacity;
}

	#header-nav li a {
		display: block;
		position: relative;
		padding: 1rem 0;
		font-weight: 700;
		color: rgb(255, 255, 255);
		text-decoration: none;
	}

	#header-nav li.outline a {
		padding: 0.35em 0.75em;
		background-color: transparent;
		border: 2px solid rgb(255, 255, 255);
		border-radius: 0.3em;
	}

	#header-nav li.outline a:hover,
	#header-nav li.outline a:focus {
		background-color: rgb(255, 255, 255);
		color: var(--color-body);
	}

	#header-nav ul:hover > li,
	#header-nav ul:focus-within > li {
		opacity: 0.6;
	}

	#header-nav li:hover,
	#header-nav li:focus-within {
		opacity: 1 !important;
	}

	#header-nav .sub-menu {
		width: 25ch;
		display: none;
		flex-direction: column;
		align-items: normal;
		gap: 0.35em;
		position: absolute;
		top: 100%;
		padding: 1em;
		background-color: rgb(255, 255, 255);
		border: 1px solid var(--color-primary);
		border-radius: 0.35em;
		box-shadow: 0 0.5em 2em rgb(0, 0, 0, 0.1);
	}

		#header-nav .sub-menu a {
			padding: 0;
			color: var(--color-body);
			font-weight: normal;
		}

	#header-nav li:focus-within > .sub-menu,
	#header-nav li:hover > .sub-menu {
		display: flex;
	}

/* 900px */
@media (max-width: 56.25em) {

	#header .logo {
		width: 8rem;
	}

}


/* Mobile Nav
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (max-width: 56.25em) {

	.js-nav-open {
		overflow: hidden;
	}

	#header [class^="mobile-nav"] {
		width: 2rem;
		height: 2rem;
		display: block;
		position: relative;
	}

	#header [class^="mobile-nav"]::before {
		content: "";
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transform: scale(125%);
	}

	#header-nav > .mobile-nav-close::before {
		display: none;
	}

	#header .mobile-nav-open {
		--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h18M3 6h18M3 18h18'/%3E%3C/svg%3E");
		background-color: rgb(255, 255, 255);
	}

	#header-nav > div > .mobile-nav-close {
		--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
		position: absolute;
		top: 2rem;
		right: 2rem;
		background-color: rgb(255, 255, 255);
	}

	#header-nav > div > .mobile-nav-close:focus {
		outline: auto;
	}
	
	#header-nav {
		width: 100vw;
		height: 0;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		opacity: 0;
		overflow: hidden;
		transition: 0.7s ease opacity;
	}

		#header-nav > div {
			width: 20rem;
			max-width: 100%;
			height: 100%;
			position: fixed;
			top: 0;
			right: -100%;
			z-index: 1;
			padding: 6rem 2rem 2rem;
			background-color: var(--color-primary);
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 2 1'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='1' gradientTransform='rotate(0,0.5,0.5)'%3E%3Cstop offset='0' stop-color='%232B5169'/%3E%3Cstop offset='1' stop-color='%232B5169'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%2368C5FF' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%2368C5FF' stop-opacity='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='2' y2='2'%3E%3Cstop offset='0' stop-color='%2368C5FF' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%2368C5FF' stop-opacity='1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='2' height='1'/%3E%3Cg fill-opacity='0.15'%3E%3Cpolygon fill='url(%23b)' points='0 1 0 0 2 0'/%3E%3Cpolygon fill='url(%23c)' points='2 1 2 0 0 0'/%3E%3C/g%3E%3C/svg%3E");
			background-attachment: fixed;
			background-size: cover;
			overflow-y: auto;
			transition: 0.7s ease right;
			box-shadow: 0 0 1rem rgb(0, 0, 0, 0.4);
		}

		#header-nav ul {
			flex-direction: column;
			align-items: stretch;
			gap: 1rem;
			font-size: 1.2rem;
		}

		#header-nav ul:hover > li,
		#header-nav ul:focus-within > li {
			opacity: 1;
		}

		#header-nav li a {
			padding: 0;
			color: rgb(255, 255, 255);
		}

		#header-nav li a.is-active::before {
			display: none;
		}

		#header-nav li.outline a {
			margin-top: 0.5rem;
			text-align: center;
		}

		#header-nav .sub-menu {
			width: auto;
			display: flex;
			align-items: stretch;
			gap: 1em;
			position: static;
			padding: 0 0 0 1em;
			margin-top: 1em;
			background-color: transparent;
			border: 0;
			border-left: 2px solid rgb(255, 255, 255, 0.25);
			border-radius: 0;
			box-shadow: none;
			font-size: 90%;
		}
	
			#header-nav .sub-menu a {
				color: rgb(255, 255, 255);
			}

	#header-nav:target,
	.js-nav-open #header-nav {
		height: 100%;
		opacity: 1;
	}

		:is(#header-nav:target, .js-nav-open #header-nav) > .mobile-nav-close {
			content: "";
			width: 100vw;
			height: 100%;
			position: fixed;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			z-index: -1;
			background-color: rgb(0, 0, 0, 0.2);
			cursor: default;
		}

		:is(#header-nav:target, .js-nav-open #header-nav) > div {
			right: 0;
		}
	
}


/* Banner
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#masthead {
	position: relative;
	z-index: 10;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

#masthead.index {
	--bg: url(../images/banner.jpg);
	height: clamp(20rem, 100vh, 44rem);
	padding: 0;
	background-image: var(--bg);
	background-position: center 15%;
}

#banner {
	min-height: 20rem;
	display: flex;
	align-items: center;
	position: relative;
	padding-block: var(--padding-default);
	background-image: var(--bg);
	background-position: right;
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-color: rgb(0, 0, 0);
	color: rgb(255, 255, 255);
}

	#banner .wrapper {
		position: relative;
		z-index: 1;
	}

	#banner .wrapper > :last-child {
		margin-bottom: 0;
	}

/* 900px */
@media (max-width: 56.25em) {

	#banner::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		background-color: rgb(0, 0, 0, 0.4);
	}

}

/* 600px */
@media (max-width: 37.5em) {

	#banner {
		background-position: center;
	}

}


/* Partners
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#partners {
	width: 100%;
	padding: 3rem 0;
}

main + #partners {
	padding-top: 0;
}

	#partners .flex {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 1rem 5%;
		margin: 0 auto;
	}

	#partners img {
		width: auto;
		height: 3.5rem;
	}


/* Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#footer {
	width: 100%;
	padding: 3rem 0;
	background-color: rgb(245, 248, 250);
	border-top: 2px solid rgb(218, 229, 237);
	font-size: 0.8889rem;
}

	#footer a {
		color: var(--color-body);
		text-decoration: none !important;
	}

	#footer address {
		font-style: normal;
	}

	#footer .top {
		display: flex;
		align-items: center;
		gap: 1.5rem;
	}

		#footer .top > * {
			flex: 1 1 0;
		}

	#footer .contact {
		display: flex;
		flex: 0 0 auto;
		align-items: center;
		gap: 1.5rem;
	}

	#footer .copy {
		text-align: right;
	}

		#footer .copy p {
			margin-top: 0;
		}

	#footer .logo {
		width: 11rem;
	}

	#footer .trackie {
		width: 5.5556rem;
		display: inline-block;
		margin: 0;
	}

/* 600px */
@media (max-width: 37.5em) {

	#footer .top {
		flex-direction: column;
		gap: 1rem;
	}

	#footer .copy {
		text-align: center;
	}

}

/* 480px */
@media (max-width: 30em) {

	#footer .contact {
		flex-direction: column;
	}

	#footer address {
		text-align: center;
	}

}


/* Tabs
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.tab-list {
	width: 100%;
	display: flex;
	position: relative;
	z-index: 1;
	padding: 0;
	margin: 0 0 -2px;
	list-style: none;
	font-weight: bold;
	white-space: nowrap;
	overflow: hidden;
	overflow-x: auto;
}

	.tab-list li {
		margin: 0;
	}

	.tab-list a {
		display: block;
		padding: 1rem 1.5rem;
		border: 2px solid transparent;
		border-bottom: 0;
		text-decoration: none;
	}

	.tab-list a.is-active {
		background-color: var(--color-primary-muted);
		border-color: rgb(218, 229, 237);
	}

.tab-content-wrap {
	width: 100%;
	padding: 1.5rem;
	background-color: var(--color-primary-muted);
	border: 2px solid rgb(0, 0, 0, 0.1);
	border-color: rgb(218, 229, 237);
}

.tab-content {
	display: none;
}

.tab-content.is-active {
	display: block;
}


/* Home
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#home-procedures {
	position: relative;
	background: var(--bg) center / cover no-repeat;
	overflow: hidden;
}

#home-procedures::before,
#home-procedures::after {
	content: "";
	position: absolute;
	z-index: 0;
	pointer-events: none;
}

#home-procedures::before {
	width: 50rem;
	height: 50rem;
	top: 0;
	left: 50%;
	background: radial-gradient(rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%);
	border-radius: 50%;
	transform: translate(-50%, -50%);
}

#home-procedures::after {
	width: 100%;
	height: 50%;
	bottom: 0;
	left: 0;
	background: linear-gradient(rgb(255, 255, 255, 0), rgb(255, 255, 255, 0.5));
}

	#home-procedures .wrapper {
		position: relative;
		z-index: 1;
	}

	#home-procedures h2 {
		color: rgb(255, 255, 255);
		text-shadow: 0 0 1em rgb(0, 0, 0, 0.6);
	}

	#home-procedures h2::after {
		background-color: currentColor;
	}

	#home-procedures .list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 1.5rem;
		padding: 0;
		margin: 3rem 0;
		list-style: none;
		text-align: center;
	}

		#home-procedures .list li {
			aspect-ratio: 5/3;
			flex: 0 1 19rem;
			position: relative;
			margin: 0;
			background-color: rgb(255, 255, 255);
			border: 4px solid rgb(127, 174, 207);
		}

		#home-procedures .list li > div {
			width: 100%;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			position: relative;
			z-index: 1;
			padding: 1.5rem;
		}

		#home-procedures .list .name {
			font-size: 1.5rem;
			font-weight: 700;
			line-height: 1.2;
		}

		#home-procedures .list .btn {
			font-size: 90%;
		}

		#home-procedures .list .btn::before {
			content: "";
			position: absolute;
			inset: 0;
		}

/* 600px */
@media (max-width: 45em) {

	#home-procedures .list li {
		aspect-ratio: auto;
		flex: 1 1 100%;
	}

		#home-procedures .list li > div {
			padding: 3.5rem 1.5rem;
		}

}


/* Surgeons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#surgeons-list {
	--cols: 5;
	display: grid;
	grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
	gap: 1.5rem;
	padding: 0;
	list-style: none;
	text-align: center;
}

	#surgeons-list li {
		margin: 0;
	}

	#surgeons-list figure {
		background-color: rgb(240, 240, 240);
	}

		#surgeons-list figure img {
			opacity: 1;
			transition: 0.3s ease opacity;
		}

		#surgeons-list figure:hover img,
		#surgeons-list figure:focus img {
			opacity: 0.8;
		}

	#surgeons-list .name {
		font-weight: bold;
		line-height: 1.2;
	}

/* 800px */
@media (max-width: 50em) {

	#surgeons-list {
		--cols: 3;
	}

}

/* 480px */
@media (max-width: 30em) {

	#surgeons-list {
		--cols: 2;
	}

}


/* Services & Specialties
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#services-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem;
	padding: 0;
	margin: 2rem 0 3rem;
	list-style: none;
	text-align: center;
}

	#services-list li {
		aspect-ratio: 4/3;
		flex: 0 1 19rem;
		position: relative;
		margin: 0;
		background-color: rgb(0, 0, 0);
		background-image: var(--img);
		background-position: center;
		background-size: auto 100%;
		background-repeat: no-repeat;
		transition: 0.5s ease background-size;
	}

	#services-list li:hover,
	#services-list li:focus {
		background-size: auto 110%;
	}

		#services-list li > div {
			width: 100%;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			position: relative;
			z-index: 1;
			padding: 1.5rem;
		}

	#services-list .name {
		font-size: 1.5rem;
		font-weight: 700;
		color: rgb(255, 255, 255);
		line-height: 1.2;
		pointer-events: none;
	}

	#services-list .btn {
		margin: 1.25rem 0 0.25rem;
		font-size: 90%;
	}

	#services-list .btn::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background-color: rgb(0, 0, 0, 0.25);
		transition: 0.5s ease opacity;
	}

	#services-list li:hover .btn::before,
	#services-list li:focus .btn::before {
		opacity: 0;
	}

/* 600px */
@media (max-width: 45em) {

	#services-list li {
		flex: 1 1 100%;
	}

}


/* Service Procedures
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#service-procedures {
	padding: 0;
	margin-top: 2rem;
	list-style: none;
}

	#service-procedures li {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1.5rem;
		position: relative;
		padding: 1rem;
		border: 2px solid rgb(207, 207, 207);
		border-radius: 0.3rem;
		transition: 0.3s ease border-color;
	}

	#service-procedures li + li {
		margin-top: 1rem;
	}

	#service-procedures li:hover {
		border-color: var(--color-primary);
	}

	#service-procedures .img {
		width: 15rem;
		flex: 0 0 auto;
	}

	#service-procedures .name {
		margin-bottom: 0.5em;
		font-size: 1.2rem;
		font-weight: bold;
		line-height: 1.2;
	}

	#service-procedures a::after {
		content: "";
		position: absolute;
		inset: 0;
	}

/* 600px */
@media (max-width: 37.5em) {

	#service-procedures li {
		flex-direction: column;
		flex-flow: column-reverse;
		justify-content: start;
		align-items: start;
		text-align: center;
	}

		#service-procedures li > div,
		#service-procedures .img {
			width: 100%;
		}

}

#procedure-faqs details {
	background-color: var(--color-primary-muted);
	border: 2px solid rgb(0, 0, 0, 0.1);
	border-color: rgb(218, 229, 237);
	border-radius: 0.3rem;
	transition: 0.3s ease border-color;
}

#procedure-faqs details[open] {
	border-color: rgb(169, 195, 212);
}

#procedure-faqs details + details {
	margin-top: 1rem;
}

#procedure-faqs summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding: 1rem;
	list-style: none;
	font-weight: bold;
	color: var(--color-primary);
	cursor: pointer;
}

#procedure-faqs summary::-webkit-details-marker {
	display: none;
}

#procedure-faqs summary::after {
	content: "";
	width: 1.5em;
	height: 1.5em;
	display: block;
	flex: 0 0 auto;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(6,83,136,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
	transition: 0.3s ease transform;
}

#procedure-faqs details[open] summary::after {
	transform: rotate(180deg);
}

#procedure-faqs .answer {
	padding: 0 1rem 1rem;
}

	#procedure-faqs .answer > :first-child {
		margin-top: 0;
	}

	#procedure-faqs .answer > :last-child {
		margin-bottom: 0;
	}


/* Patient Education
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* #education-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	padding: 0;
	margin-top: 2rem;
	list-style: none;
}

	#education-list li {
		margin: 0;
	}

	#education-list a {
		height: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1rem;
		padding: 1rem;
		background-color: var(--color-primary);
		border-radius: 0.3rem;
		font-weight: bold;
		color: rgb(255, 255, 255);
		text-decoration: none;
	}

	#education-list a::after {
		content: "";
		width: 1.5em;
		height: 1.5em;
		display: block;
		flex: 0 0 auto;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
		transition: 0.3s ease transform;
	}

	#education-list a:hover,
	#education-list a:focus {
		background-color: var(--color-primary-light);
	}

	#education-list a:hover::after,
	#education-list a:focus::after {
		transform: translate(20%);
	} */

/* 600px */
/* @media (max-width: 37.5em) {

	#education-list {
		grid-template-columns: minmax(0, 1fr);
	}

} */


/* Joint Resources
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#joint-resources {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2rem;
	padding: 0;
	margin: 0;
	border-top: 0;
}

	#joint-resources > div > :first-child {
		margin-top: 0;
	}

	.resources-files {
		padding: 0;
		list-style: none;
	}

		.resources-files a.file {
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: 1rem;
			padding: 0.7em 1em;
			background-color: var(--color-primary);
			border-radius: 0.3rem;
			font-weight: bold;
			color: rgb(255, 255, 255);
			text-decoration: none;
		}

		.resources-files a.file::after {
			content: "";
			width: 1.2em;
			height: 1.2em;
			display: block;
			flex: 0 0 auto;
			margin: 0;
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M13 10H18L12 16L6 10H11V3H13V10ZM4 19H20V12H22V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V12H4V19Z'%3E%3C/path%3E%3C/svg%3E");
		}

			/* .resources-files a.file span {
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
			} */
	
		.resources-files a.file:hover,
		.resources-files a.file:focus {
			background-color: var(--color-primary-light);
		}

	.resources-videos {
		padding: 0;
		list-style: none;
	}

		.resources-videos li + li {
			margin-top: 1rem;
		}

/* 600px */
@media (max-width: 45em) {

	#joint-resources {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

}


/* Contact Us
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.contact-flex {
	display: flex;
	align-items: stretch;
	gap: 2rem;
}

.contact-flex + .contact-flex {
	margin-top: 2rem;
}

	.contact-flex > div {
		width: 100%;
		flex: 1 1 0;
	}

		.contact-flex > div > :first-child {
			margin-top: 0;
		}

	.contact-flex .map {
		height: 17rem;
	}

		.contact-flex .map iframe {
			width: 100%;
			height: 100%;
		}

	.contact-flex .content {
		align-self: center;
	}

/* 900px */
@media (max-width: 56.25em) {

	.contact-flex {
		flex-direction: column;
	}

}


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* 1800px */
@media (max-width: 112.5em) {}


/* 1200px */
@media (max-width: 75em) {}


/* 900px */
@media (max-width: 56.25em) {}


/* 600px */
@media (max-width: 37.5em) {}