/**
 * People archive — curated sections of person tiles.
 *
 * No filters and no pagination: the sections are the structure, so what this file owns is the
 * rhythm between them and the tile grid inside each.
 */

section.archive-team .people-section {
	margin-top: var(--module-spacing-xlarge);
}

section.archive-team .people-section + .people-section {
	margin-top: var(--module-spacing-large);
}

section.archive-team .intro {
	display: flex;
	flex-direction: column;
	gap: var(--text-spacing-xsmall);
	grid-column: 1 / -1;
	margin-bottom: var(--text-spacing-small);
}

section.archive-team .intro > * {
	margin: 0;
}

section.archive-team .cards {
	column-gap: var(--text-spacing-medium);
	grid-column: 1 / -1;
	row-gap: var(--gap);
}

section.archive-team .cards > li {
	grid-column: span 3;
}

section.archive-team .card {
	height: 100%;
}

/***************************************************************************************************************************************************************************************/
/* MQ MAX-WIDTH 950 - Tablet Sizes */
/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(950rem/16)) {

	section.archive-team .cards > li {
		grid-column: span 6;
	}

	/* The subhead needs a clear run to the tiles it heads once the grid is only two wide — at four
	   the row of faces reads as its own band without one. */
	section.archive-team .intro {
		margin-bottom: var(--text-spacing-medium);
	}

}

/***************************************************************************************************************************************************************************************/
/* MQ MAX-WIDTH 650 - Mobile Sizes */
/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(650rem/16)) {

	section.archive-team .cards > li {
		grid-column: 1 / -1;
	}

}
