/* SN People: one wide row per builder — name and role left, excerpt right, hairlines between. */

.sn-people {
	position: relative;
}

.sn-people__row {
	position: relative;
	display: grid;
	grid-template-columns: 5fr 6fr;
	gap: 24px 48px;
	padding: clamp(40px, 5vw, 72px) 0;
	transition: opacity 0.6s var(--sn-ease-out);
}

/* Focus follows the pointer: the row being read stays bright, the other steps back.
   Not for full biographies, which are read at length. */
@media (hover: hover) {
	.sn-people:not(.sn-people--profiles):has(.sn-people__row:hover) .sn-people__row:not(:hover) {
		opacity: 0.4;
	}
}

.sn-people__rule {
	position: absolute;
	inset: 0 0 auto;
	height: 1px;
	background: var(--sn-hairline);
	transform-origin: 0 50%;
}

.sn-people__rule--end {
	position: relative;
	display: block;
	inset: auto;
}

.sn-people__name {
	margin: 0;
	color: var(--sn-plaster);
	font-family: var(--e-global-typography-projecttitle-font-family, "Libre Caslon Display"), Georgia, serif;
	font-size: clamp(44px, 5.6vw, 92px);
	font-weight: 400;
	line-height: 0.95;
	letter-spacing: -0.02em;
	transition: color 0.4s var(--sn-ease-out);
}

.sn-people__row:hover .sn-people__name {
	color: var(--sn-brass);
}


.sn-people__role {
	margin: 20px 0 0;
	color: var(--sn-stone);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.sn-people__body {
	max-width: 60ch;
	padding-top: 8px;
	color: var(--sn-body);
	font-size: 18px;
	line-height: 1.65;
}

.sn-people__body p {
	margin: 0 0 1em;
}

.sn-people__body p:last-child {
	margin-bottom: 0;
}

/* Narrow screens: name above the excerpt. */
@media (max-width: 1024px) {
	.sn-people__row {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.sn-people__body {
		font-size: 17px;
	}
}

/* Profiles: a 4:5 headshot beside the name and complete biography. */
.sn-people--profiles .sn-people__row {
	grid-template-columns: 4fr 7fr;
	gap: 40px clamp(40px, 6vw, 96px);
	align-items: start;
	padding: clamp(48px, 6vw, 96px) 0;
}

.sn-people--profiles .sn-people__name {
	transition: none;
}

.sn-people--profiles .sn-people__row:hover .sn-people__name {
	color: var(--sn-plaster);
}

.sn-people--profiles .sn-people__body {
	margin-top: clamp(24px, 2.4vw, 36px);
}

.sn-people__photo {
	position: relative;
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 5;
	margin: 0;
	overflow: hidden;
	background: var(--sn-umber);
	box-shadow: inset 0 0 0 1px var(--sn-hairline);
}

.sn-people .sn-people__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sn-people__placeholder {
	width: 26%;
	color: color-mix(in oklch, var(--sn-plaster) 16%, transparent);
	line-height: 0;
}

.sn-people__placeholder .sn-logo {
	width: 100%;
	height: auto;
}

@media (max-width: 767px) {
	.sn-people--profiles .sn-people__row {
		grid-template-columns: 1fr;
	}

	.sn-people__photo {
		max-width: 280px;
	}
}
