/**
 * Metropolis Person Intro.
 */

.person-intro__inner {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(32px, 6vw, 96px);
	align-items: center;
}

.person-intro--solo .person-intro__inner {
	grid-template-columns: minmax(0, 1fr);
}

.person-intro__side {
	display: grid;
	gap: 16px;
}

.person-intro__media {
	margin: 0;
}

.person-intro__img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: var(--radius);
}

/* A short quote from Daniel inside the answer. */
.person-intro .section__answer blockquote {
	margin: 1.6em 0;
	font-family: var(--serif);
	font-size: 1.3125rem;
	line-height: 1.4;
	color: var(--fascia);
}

.person-intro .section__answer blockquote cite {
	display: block;
	margin-top: 10px;
	font-family: var(--sans);
	font-size: 0.9375rem;
	font-style: normal;
	color: var(--ink-soft);
}

.is-fascia.person-intro .section__answer blockquote { color: var(--on-fascia); }

/* The proprietor's nameplate: lettered like the fascia. */
.nameplate {
	padding: clamp(28px, 3vw, 40px);
	border-radius: 8px;
	box-shadow: 0 24px 48px -28px rgba(12, 39, 31, 0.45);
}

.nameplate__name {
	font-family: var(--serif);
	font-size: clamp(2rem, 3.4vw, 2.75rem);
	line-height: 1.05;
	letter-spacing: -0.015em;
	color: var(--on-fascia);
}

.nameplate__role {
	margin-top: 10px;
	font-size: 1.0625rem;
	color: var(--on-fascia-soft);
}

.nameplate__foot {
	display: grid;
	gap: 4px;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--fascia-line);
}

.nameplate__detail {
	font-size: 0.9375rem;
	color: var(--on-fascia-soft);
}

.nameplate__phone {
	font-size: 1.0625rem;
}

/* With a photo, the plate sits just under it, tucked up a little. */
.person-intro__media + .nameplate {
	margin: -40px 16px 0;
	position: relative;
}

.is-fascia .ticks .icon { color: var(--gold); }

@media (max-width: 960px) {
	.person-intro__inner { grid-template-columns: minmax(0, 1fr); }
	.person-intro__side { order: 2; max-width: 560px; }
	.person-intro .unlit--portrait { aspect-ratio: 16 / 10; }
}
