:root {
  color-scheme: light dark;
}

.test {
	font-weight: bold;
}

section {
	margin-left: 1.5rem;
	margin-bottom: 2rem;
}

.testifying-experts {
	max-width: 90vw;
	margin-left: 0;
	margin: auto;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-content: space-between;
	align-items: start;
	gap: min(3rem, 5vw, 5vh);
}

.expert {
	min-width: 40vw;
	max-width: min(35rem, 40vw);
	display: flex;
	flex-direction: column;
	justify-content: start;
	align-items: center;
}

.expert img {
	/* max-width: min(50vw, 50vh, 12rem); */
	/* height: 20rem; */
	width: 100%;
	max-height: min(40vh, 40rem);
	object-fit: scale-down;
}

body {
	margin: 0;
}

header {
	display: flex;
	flex-direction: column;
	width: 100%;
	align-items: center;
	background-color: light-dark(black, #f0f0f0);
	color: light-dark(white, black);
	margin: 0;
	padding-top: 0.5rem;
	.title {
		font-size: 250%;	
		font-family: sans-serif;
		margin: 0 5vw;
		text-align: center;
		text-wrap: balance;
	}
	.summary {
		font-size: 125%;
		margin: 0 5vw;
		text-align: center;
		text-wrap: balance;

		span:nth-of-type(3) {
			font-style: italic;
		}		
	}
	 .contact {
		width: 100%;
		box-sizing: border-box;
		margin-top: .25rem;
		padding: .25rem 1rem;
		background-color: light-dark(#202020, #e0e0e0);
		display: flex;
		flex-direction: row;
		justify-content: end;
		color: light-dark(white, black);
		a {
			color: light-dark(white, black);
			text-decoration: none;
		}
	}
}

.law {
	width: fit-content;
	min-width: min(50vw, 30rem);
	display: flex;
	flex-direction: column;
	justify-content: start;
	align-items: start;
	background-color: light-dark(#e0e0e0, #202020);
	padding: 0.25rem 1rem;
	margin: 0.5rem 0;
	margin-left: 1.5rem;
	border-radius: 0.5rem;

	.law-name {
		font-weight: bold;
 		font-size: 110%;
		font-family: serif;
		border-bottom: black dotted 1px;
		margin-bottom: 0.25rem;
	}
}
.cases {
	width: 100%;
}
.case {
	width: 100%;
	margin: 0.25rem 0;
	display: flex;
	flex-direction: row;
	justify-content: space-between;

	.case-name {
		font-size: 110%;
	}
	.case-labels {
		margin-left: 4rem;
		display: flex;
		flex-direction: row;
		gap: 2rem;
	}
	.case-experts {
		gap: 0.5rem;
	}

	a {
		text-decoration: none;
		color: light-dark(black, white);
	}

	.expert-name {
		display: inline-block;
		min-width: 4.25rem;
		/* width: fit-content; */
		text-align: center;
		padding: 0 1rem;
		border-radius: 0.5rem;
		background-color: light-dark(#f0f0f0, #101010);
	}

	.outcome {
		width: fit-content;
		margin-left: 1rem;
		padding: 0 0.5rem;
		border-radius: 0.5rem;
	}

	.pending {
		background-color: light-dark(rgba(255,255,255,0.5), rgba(0,0,0,.5));
		color: rgba(128, 128, 128, 1);
	}

	.victory {
		background-color: #006000;
		color: white;	
	}
	.pending {
		background-color: lightyellow;
	}
}

@media (max-width: 1000px) {
	.expert {
		max-width: min(60rem, 80vw);
	}
}

main {
	max-width: 95vw;
	margin: 0 auto;
}

.expert .bio {
	font-size: 120%;
}

.expert h3 {
	font-size: 160%;
}


.full-pitch {
	font-size: 150%;
	max-width: min(80%, 60rem);
	@media (max-width: 1000px) {
		font-size: 2.5vw;
		max-width: 100%;
	}

	display: flex;
	flex-direction: column;
	align-items: start;
	div {
		font-family: sans-serif;
		background-color: light-dark(#c8c8d8, #303030);
		padding: 0.5rem;
		border-radius: 0.5rem;
		max-width: 50vw;
		text-align: center;
		text-wrap: balance;
	}
	:nth-child(1) {
		border-bottom-right-radius: 0;
	}
	:nth-child(2) {
		align-self: center;
		border-top-left-radius: 0;
		border-bottom-right-radius: 0;
	}
	:nth-child(3) {
		align-self: flex-end;
		border-top-left-radius: 0;
	}
}

.vs {
	font-style: italic;
	padding: 0 0.15rem;
}
.plaintiff .defendant {
	font-style: normal;
}
.our-client {
	color: light-dark(#004000, #c0ffc0);
}
.our-opponent {
	color: light-dark(#400000, #ffc0c0);	
}
.victor {
	color: light-dark(#004000, #c0ffc0);
}