ul.people-list-linked {
	display: grid;
	gap: 1.5em;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	padding: 0;

	& > li {
		display: block;
		position: relative; /* anchors the name's .stretched-link overlay */

		& > img {
			aspect-ratio: 1/1;
			object-fit: cover;
		}

		& > .name {
			font-size: 1.25em;
		}

		& > .job-title {
			color: gray;
		}
	}

	/* Card-sized tab stop gets a card-sized focus ring */
	.stretched-link:focus-visible {
		outline: none;

		&::after {
			outline: 2px solid var(--accent, currentColor);
			outline-offset: 4px;
		}
	}
}

/* Detail modal: job title a step smaller than the stock template;
   education renders as the body's last paragraph, italicized. The
   last paragraph keeps its margin — the modal's bottom breathing room
   comes from it. */
.people-list-modals ws-modal {
	& h2 {
		margin-block-start: 0.5rem;

		& small {
			font-size: 0.7em;
		}
	}

	& .education {
		/* Padding, not margin: an end margin collapses out of the slot
		   area and is dropped from the modal's scrollable overflow, so
		   it never paints inside the box. Same 1rem as the standard
		   paragraph margin. */
		margin-block-end: 0;
		padding-block-end: 1rem;
		font-style: italic;
	}
}