/**
 * AP Series Spotlight — scoped styles. Depends on ap-base.css.
 */

.ap-series {
	background: var(--ap-paper-warm);
	padding: 4rem 0;
}

.ap-series__head {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin-bottom: 2.5rem;
}

.ap-series__head-main { max-width: 42rem; }

.ap-series .ap-series__title {
	margin: 0.75rem 0 0 !important;
	padding: 0 !important;
	font-family: var(--ap-font-display), Georgia, serif !important;
	font-weight: 400 !important;
	letter-spacing: -0.015em !important;
	line-height: 1.1 !important;
	font-size: 1.875rem !important;
	color: var(--ap-ink) !important;
}

.ap-series .ap-series__tagline {
	font-weight: 300 !important;
	font-style: italic !important;
	color: var(--ap-muted) !important;
}

.ap-series .ap-series__desc {
	margin: 1rem 0 0 !important;
	padding: 0 !important;
	font-family: var(--ap-font-body), ui-sans-serif, system-ui, sans-serif !important;
	font-size: 1rem !important;
	line-height: 1.625 !important;
	color: var(--ap-muted) !important;
}

.ap-series__action { flex-shrink: 0; }

.ap-series__row {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	margin: 0 -1.25rem;
	padding: 0 1.25rem 1rem;
}

.ap-series__item {
	width: 10rem;
	flex-shrink: 0;
	scroll-snap-align: start;
}

.ap-series__cover-link { display: block; }

.ap-series .ap-series__num { margin-top: 1rem !important; }

.ap-series .ap-series__issue-title {
	margin: 0.25rem 0 0 !important;
	padding: 0 !important;
	font-family: var(--ap-font-display), Georgia, serif !important;
	font-weight: 400 !important;
	font-size: 1.125rem !important;
	line-height: 1.375 !important;
}

.ap-series .ap-series__issue-title a {
	color: var(--ap-ink) !important;
	text-decoration: none !important;
	transition: color 0.25s ease;
}

.ap-series .ap-series__issue-title a:hover { color: var(--ap-red) !important; }

@media (min-width: 640px) {
	.ap-series__row {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1.25rem;
		overflow: visible;
		margin: 0;
		padding: 0;
	}
	.ap-series__item { width: auto; }
}

@media (min-width: 768px) {
	.ap-series { padding: 6rem 0; }
	.ap-series__head {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		margin-bottom: 3.5rem;
	}
	.ap-series .ap-series__title { font-size: 2.25rem !important; }
}

@media (min-width: 1024px) {
	.ap-series__row { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.ap-series .ap-series__title { font-size: 3rem !important; }
}
