.person-meta {
	> img {
		aspect-ratio: 5/7;
		object-fit: cover;
		border-radius: var(--corner-radius);
		border: 1px solid var(--line);
	}
}

.person-summary {
	padding-left: 1rem;
	> li {
		font-size: .9rem;
		font-style: italic;
		&::marker {
			color: var(--accent);
		}
	}
}

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

	> li {
		display: contents;

		> div {
			/* Single-cell grid stack: the label lies over the image bottom
			   without being positioned, so the card stays the containing
			   block for the name's .stretched-link overlay. */
			display: grid;
			position: relative;
			border-radius: var(--corner-radius);
			overflow: hidden;
			border: 1px solid var(--line);
			img {
				grid-area: 1 / 1;
				width: 100%;
				aspect-ratio: 1/1;
				object-fit: cover;
			}
		  .label {
				grid-area: 1 / 1;
				align-self: end;
				background-color: hsl(0 0% 0% / 0.3);
				line-height: 1;
				padding: 1em;
				font-family: 'Oswald', sans-serif;
				.job-title {
					font-size: .9rem;
					font-weight: 300;
					margin-bottom: .25rem;
				}
				.name {
					font-size: 1.25rem;
					a {
						color: inherit;
						text-decoration: none;
					}
					a:is(:hover, :focus-visible) {
						text-decoration: underline;
					}
				}
			}
			/* Inside ring: the card clips overflow, so the ring sits within it */
			.stretched-link:focus-visible {
				outline: none;
			}
			.stretched-link:focus-visible::after {
				outline: 2px solid var(--accent);
				outline-offset: -4px;
			}
		}
	}
}