@media (min-width: 768px) {
	.purdue-filters-landingpage.fixed + .purdue-frontpage-stories-wrapper {
		padding-top: 97px;
	}
}
.purdue-frontpage-stories-wrapper
	.purdue-archive-block__load-more
	.purdue-archive-block__load-no_more_message {
	color: $-purdue-aged !important;
}
.purdue-post-lists-wrapper {
	position: relative;
	background: white;
}
h2 {
	color: black;
	font-family: $rkv-font-family-h2 !important;
	font-weight: 400;
	font-size: 2.25rem;
	line-height: 1.1;
	margin-bottom: 1rem;
	text-transform: none !important;
	font-style: unset !important;
	text-align: left;
	width: 100%;
	@media (max-width: 767px) {
		font-size: 1.75rem;
		line-height: 1.3;
		margin-bottom: 18px;
	}
}
// .home {
// 	.purdue-archive-block__header {
// 		padding-top: 2.75rem !important;
// 		@media (max-width: 767px) {
// 			padding-top: 2rem !important;
// 		}
// 	}
// }

.purdue-featured-stories-wrapper {
	&.hide {
		display: none;
	}
	.purdue-archive-block .archive-card {
		.archive-card__content {
			.archive-card__content-type {
				display: none;
			}
		}
	}
	.purdue-archive-block__load-more .purdue-archive-block__load-more_trigger {
		padding: 0.75rem 1.25rem;
		border: 2px solid black;
		background: white;
		font-size: 1rem;
		color: black !important;
		font-family: $acumin-pro;
		font-weight: 400;
		border-radius: 0;
		&:hover {
			background: black;
			color: $-purdue-yellow !important;
			border: 2px solid black;
		}
	}
}
.purdue-archive-block__load-more .purdue-archive-block__load-more_trigger.all-stories {
	padding: 0.75rem 1.25rem;
	border: 2px solid black;
	background: white;
	font-size: 1rem;
	color: black !important;
	font-family: $acumin-pro;
	font-weight: 400;
	border-radius: 0;
	margin-bottom: 3rem;
	&:hover {
		background: black;
		color: $-purdue-yellow !important;
		border: 2px solid black;
	}
	&:after {
		content: none;
	}
}
.purdue-filters-landingpage {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	background: $-purdue-yellow;
	z-index: 12;
	height: 81.2px;
	&.fixed {
		position: fixed;
		top: 95px;
	}
	@media (max-width: 767px) {
		display: none;
	}
}
.purdue-filters-wrapper {
	display: flex;
	align-items: center;
	background: none;
	z-index: 12;
	position: relative;
	height: 100%;
	.purdue-filters-desc {
		color: black !important;
		font-size: 18px;
		font-weight: 600;
		font-family: $acumin-pro;
	}
	.purdue-archive-block__header[class] {
		padding-top: 0 !important;
		padding-left: 2rem;
		margin-top: 0;
		height: 100%;
		.rkv-archive__filter select {
			color: black !important;
			font-size: 14px;
			font-weight: 400;
			font-family: $acumin-pro;
			border: 1px solid $-purdue-black;
			background-color: $-purdue-white;
			padding: 0.1rem 1.5rem 0.1rem 0.5rem;
			background-position: right 0.7em top 60%;
			background-repeat: no-repeat;
			background-size: 0.65em auto;
			background-image: url('data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJjaGV2cm9uLWRvd24iIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1jaGV2cm9uLWRvd24gZmEtdy0xNCIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0yMDcuMDI5IDM4MS40NzZMMTIuNjg2IDE4Ny4xMzJjLTkuMzczLTkuMzczLTkuMzczLTI0LjU2OSAwLTMzLjk0MWwyMi42NjctMjIuNjY3YzkuMzU3LTkuMzU3IDI0LjUyMi05LjM3NSAzMy45MDEtLjA0TDIyNCAyODQuNTA1bDE1NC43NDUtMTU0LjAyMWM5LjM3OS05LjMzNSAyNC41NDQtOS4zMTcgMzMuOTAxLjA0bDIyLjY2NyAyMi42NjdjOS4zNzMgOS4zNzMgOS4zNzMgMjQuNTY5IDAgMzMuOTQxTDI0MC45NzEgMzgxLjQ3NmMtOS4zNzMgOS4zNzItMjQuNTY5IDkuMzcyLTMzLjk0MiAweiI+PC9wYXRoPjwvc3ZnPg==') !important;
			&.select-expand {
				background-image: none !important;
				overflow-y: visible;
			}
		}
	}
}
.purdue-archive-block__header[class] {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	align-content: flex-start;
	padding-top: 0;
	margin-top: 2.75rem;

	&:not(.show-filters) {
		justify-content: center;
	}

	@include mq($until: md) {
		flex-wrap: wrap;
		> * {
			width: 100%;
		}
	}
	.purdue-featured-stories-wrapper + &.purdue-archive-block__header--all {
		margin-top: 0;
	}
	.purdue-featured-stories-wrapper.hide + &.purdue-archive-block__header--all {
		margin-top: 2.75rem;
	}
	h3,
	h2 {
		body.dark-page,
		.has-rkv-black-background-color & {
			color: $-purdue-white;
		}
		margin-bottom: 2.5rem;
		@include mq($until: md) {
			margin-bottom: 2rem;
			text-align: center;
		}
	}
	.rkv-archive__filter {
		display: flex;
		gap: $rkv-gutter * 1.5;
		align-items: flex-start;
		@include mq($until: md) {
			flex-wrap: wrap;
			margin-bottom: 40.5px;
		}
		select {
			position: relative;
			z-index: 1;
			flex-grow: 1;
			min-width: 143.5px;
			width: auto;
			-moz-appearance: none;
			-webkit-appearance: none;
			appearance: none;
			background: transparent;
			border: none;
			border-radius: 0;
			border-bottom: 2px solid $-purdue-yellow;
			font-size: 14px;
			font-weight: 400;
			font-family: $acumin-pro;
			border: 1px solid $-purdue-yellow;
			padding: 0.1rem 1.5rem 0.1rem 0.5rem;
			background-position: right 0.7em top 60%;
			background-repeat: no-repeat;
			background-size: 0.65em auto;
			background-image: url('data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJjaGV2cm9uLWRvd24iIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1jaGV2cm9uLWRvd24gZmEtdy0xNCIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0yMDcuMDI5IDM4MS40NzZMMTIuNjg2IDE4Ny4xMzJjLTkuMzczLTkuMzczLTkuMzczLTI0LjU2OSAwLTMzLjk0MWwyMi42NjctMjIuNjY3YzkuMzU3LTkuMzU3IDI0LjUyMi05LjM3NSAzMy45MDEtLjA0TDIyNCAyODQuNTA1bDE1NC43NDUtMTU0LjAyMWM5LjM3OS05LjMzNSAyNC41NDQtOS4zMTcgMzMuOTAxLjA0bDIyLjY2NyAyMi42NjdjOS4zNzMgOS4zNzMgOS4zNzMgMjQuNTY5IDAgMzMuOTQxTDI0MC45NzEgMzgxLjQ3NmMtOS4zNzMgOS4zNzItMjQuNTY5IDkuMzcyLTMzLjk0MiAweiI+PC9wYXRoPjwvc3ZnPg==');

			text-align: left;
			line-height: 2em !important;
			cursor: pointer;
			&:focus-visible {
				outline-color: $-purdue-yellow-darker;
			}
			option {
				text-align: left;
				font-size: 14px;
				line-height: 1.4375;
				font-family: $acumin-pro;
				color: black;
			}
			.has-rkv-black-background-color &,
			body.dark-page & {
				color: $-purdue-white;
				option {
					color: $-purdue-black;
				}
				background-blend-mode: invert;
				background-image: url('data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJjaGV2cm9uLWRvd24iIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1jaGV2cm9uLWRvd24gZmEtdy0xNCIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48cGF0aCBkPSJNMjA3LjAyOSAzODEuNDc2TDEyLjY4NiAxODcuMTMyYy05LjM3My05LjM3My05LjM3My0yNC41NjkgMC0zMy45NDFsMjIuNjY3LTIyLjY2N2M5LjM1Ny05LjM1NyAyNC41MjItOS4zNzUgMzMuOTAxLS4wNEwyMjQgMjg0LjUwNWwxNTQuNzQ1LTE1NC4wMjFjOS4zNzktOS4zMzUgMjQuNTQ0LTkuMzE3IDMzLjkwMS4wNGwyMi42NjcgMjIuNjY3YzkuMzczIDkuMzczIDkuMzczIDI0LjU2OSAwIDMzLjk0MUwyNDAuOTcxIDM4MS40NzZjLTkuMzczIDkuMzcyLTI0LjU2OSA5LjM3Mi0zMy45NDIgMHoiIGZpbGw9IiNmZmZmZmYiPjwvcGF0aD48L3N2Zz4=');
			}
		}
	}
}
.single {
	.purdue-archive-block__header[class] {
		h2 {
			text-align: center;
		}
	}
}
.purdue-archive-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: $rkv-gutter * 1.5;
	padding-bottom: $rkv-gutter * 1.5;

	@include mq($until: sm) {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}

	@include mq($from: sm) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	@include mq($from: md) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	@include archive-card(auto);

	.archive-card.loaded-more {
		animation-duration: 0.3s;
		animation-name: archive-card-loaded-more;
		animation-iteration-count: 1;
		animation-timing-function: ease-in-out;

		animation-delay: calc((var(--index)) * 0.25s);
	}

	.rkv-entry.rkv-entry-none {
		margin: 0 auto;
		place-self: center center;
		text-align: center;
		@include mq($until: sm) {
			grid-row: span 1 / 2;
			grid-column: 1 / 2;
		}
		@include mq($from: sm) {
			grid-row: span 1 / 2;
			grid-column: 1 / 3;
		}
		@include mq($from: md) {
			grid-row: span 1 / 2;
			grid-column: 1 / 4;
		}
	}
}

@keyframes archive-card-loaded-more {
	from {
		transform: translateY(50%);
		opacity: 0;
	}

	to {
		transform: translateY(0%);
		opacity: 1;
	}
}

.purdue-archive-block__load-more {
	display: grid;
	grid-template: 'container';
	place-items: center;
	place-content: center;
	position: relative;
	> * {
		grid-area: container;
	}
	.purdue-archive-block__load-more_trigger {
		padding: 0.75rem 1.25rem;
		border: 2px solid black;
		background: white;
		font-size: 1rem;
		color: black;
		font-family: $acumin-pro;
		font-weight: 400;
		border-radius: 0;
		margin-bottom: 3rem;
		&:hover {
			background: black;
			color: $-purdue-yellow;
			border: 2px solid black;
		}
		text-decoration: none;
		body.dark-page & {
			border: 2px solid white;
			background: black;
			color: white;
			&:hover {
				background: white;
				color: $-purdue-aged;
				border: 2px solid white;
			}
		}
		body.home.dark-page & {
			border: 2px solid black;
			background: white;
			color: black;
			&:hover {
				background: black;
				color: $-purdue-yellow;
				border: 2px solid black;
			}
		}
		line-height: 1.5;
		transition: all 0.3s;
		transform-origin: top center;
	}
	&.rkv-no-more-posts {
		.purdue-archive-block__load-more_trigger {
			transform: scale(0);
			opacity: 0;
			pointer-events: none;
		}
		.purdue-archive-block__load-no_more_message {
			display: block;
			opacity: 1;
		}
	}
	.purdue-archive-block__load-no_more_message {
		display: none;
		opacity: 0;
		transition: 0.3s;
		text-align: center;
		margin: 4.93px auto;
		text-decoration: none;
		background: transparent;
		border: none;
		color: $-purdue-yellow-darker; // Darker color is default.
		body.dark-page &,
		.has-rkv-black-background-color & {
			color: $-purdue-yellow; // If on a dark page or against a dark background, we want a lighter color.
			.has-rkv-white-background-color {
				color: $-purdue-yellow-darker; // But, if we are on a light background on a dark page, we want the darker color.
			}
		}
		font-family: $rkv-font-family-headings;
		font-size: $rkv-font-size-default;
		line-height: 1.5;
		text-transform: uppercase;
		letter-spacing: 0.9px;
		padding-bottom: $rkv-gutter * 1.5;
		transition: all 0.3s;
		transform-origin: top center;
	}
}

[data-type='rkv/archive'] {
	select,
	a {
		pointer-events: none;
	}
}
