:root {
	/* @link https://utopia.fyi/type/calculator?c=360,16,1.25,1240,24,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
	--step--2: clamp(
		0.64rem,
		0.5091rem + 0.5818vw,
		0.96rem
	);
	--step--1: clamp(0.8rem, 0.6364rem + 0.7273vw, 1.2rem);
	--step-0: clamp(1rem, 0.7955rem + 0.9091vw, 1.5rem);
	--step-1: clamp(
		1.25rem,
		0.9943rem + 1.1364vw,
		1.875rem
	);
	--step-2: clamp(
		1.5625rem,
		1.2429rem + 1.4205vw,
		2.3438rem
	);
	--step-3: clamp(
		1.9531rem,
		1.5536rem + 1.7756vw,
		2.9297rem
	);
	--step-4: clamp(
		2.4414rem,
		1.942rem + 2.2195vw,
		3.6621rem
	);
	--step-5: clamp(
		3.0518rem,
		2.4275rem + 2.7743vw,
		4.5776rem
	);
	/* @link https://utopia.fyi/space/calculator?c=360,16,1.25,1240,24,1.25,5,2,&s=0.75,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
	--space-xs: clamp(
		0.75rem,
		0.5966rem + 0.6818vw,
		1.125rem
	);
	--space-s: clamp(1rem, 0.7955rem + 0.9091vw, 1.5rem);
	--space-m: clamp(1.5rem, 1.1932rem + 1.3636vw, 2.25rem);
	--space-l: clamp(2rem, 1.5909rem + 1.8182vw, 3rem);
	--space-xl: clamp(3rem, 2.3864rem + 2.7273vw, 4.5rem);
	--space-2xl: clamp(4rem, 3.1818rem + 3.6364vw, 6rem);
	--space-3xl: clamp(6rem, 4.7727rem + 5.4545vw, 9rem);

	/* One-up pairs */
	--space-xs-s: clamp(
		0.75rem,
		0.4432rem + 1.3636vw,
		1.5rem
	);
	--space-s-m: clamp(1rem, 0.4886rem + 2.2727vw, 2.25rem);
	--space-m-l: clamp(1.5rem, 0.8864rem + 2.7273vw, 3rem);
	--space-l-xl: clamp(2rem, 0.9773rem + 4.5455vw, 4.5rem);
	--space-xl-2xl: clamp(3rem, 1.7727rem + 5.4545vw, 6rem);
	--space-2xl-3xl: clamp(
		4rem,
		1.9545rem + 9.0909vw,
		9rem
	);

	/* Custom pairs */
	--space-s-l: clamp(1rem, 0.1818rem + 3.6364vw, 3rem);
}

div.stack > * + * {
	margin-block-start: 1lh;
}

div.entry-container {
	border: 1px solid #ddd;
	box-shadow: 0 1px 2px -1px #ccc;
}

details.member-card,
details.member-card h2,
details.member-card h3 {
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	color: #555;
}

details.member-card h2 {
	font-size: var(--step-0);
	font-weight: 400;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-block-start: var(--space-xs);
	padding-block-end: var(--space-s);
	padding-inline: var(--space-s);
	gap: var(--space-xs);
}

details.member-card h2 > *:first-child {
	flex-grow: 1;
	flex-basis: 100%;
}

details.member-card h2 > :last-child {
	flex-basis: 100%;
}

details.member-card h3 {
	font-size: var(--step--1);
	font-weight: 700;
	text-transform: uppercase;
}

details.member-card summary {
	list-style: none;
	background-color: #f5f5f5;
}

details.member-card .member-social {
	display: flex;
	justify-content: flex-end;
	flex: 1 1 15%;
}

details[open].member-card .expander i {
	transform: rotate(180deg);
}

details.member-card section.member-info {
	padding-inline: var(--space-s);
}

details.member-card a.field-icon,
details.member-card span.field-icon,
details.member-card a.field-icon:visited,
details.member-card a.field-icon:hover {
	background-color: #555;
	color: #fff;
	font-size: var(--step--1);
	border: 3px solid #555;
	clip-path: circle(45%);
}

span.icon-container {
	padding-block-start: 0.1lh;
}

details.member-card p.directory-field {
	display: flex;
	flex-wrap: wrap;
	gap: 1ch;
	color: #555;
	font-size: var(--step--1);
}

details.member-card p.directory-field span.field-icon {
	align-self: center;
}

details.member-card p.directory-field span.field-icon > i {
	line-height: 0;
}

details.member-card p.directory-field span.field-label {
	align-self: center;
	flex: 1 1 0;
	color: #777;
}

details.member-card p.directory-field span.field-content {
	flex-grow: 1;
	flex-basis: calc((30rem - 100%) * 999);
	font-weight: 700;
}

@media screen and (width > 768px) {
	details.member-card summary {
		gap: var(--space-s, 1ch);
	}

	details.member-card p.directory-field span.field-icon {
		align-self: flex-start;
	}

	details.member-card p.directory-field span.field-label,
	details.member-card	span.field-content {
		align-self: initial;
		padding-block-start: 0.1lh;
	}
}