/* POSTS */

.POSTS::before,
.POSTS::after {
	content: "";
	display: block;
	overflow: hidden;
	clear: both;
}

.POSTS .filter {
	float: left;
	width: var(--col-3);
	margin: 0 var(--s5) 0 0;
	overflow: hidden;
}

.POSTS .filter input[type="text"],
.POSTS .filter select {
	appearance: none;
	font-family: inherit;
	font-size: 16rem;
	color: var(--black);
	display: block;
	background: var(--white);
	width: 100%;
	padding: 0 var(--s3);
	margin: 0;
	border-radius: 9999rem;
	border: 1px solid var(--grey-300);
	box-sizing: border-box;
	height: var(--s6);
	line-height: var(--s6);
	margin-bottom: var(--s1);
	min-height: 0;
}

.POSTS .filter input[type="text"]:focus,
.POSTS .filter select:focus {
	outline: none;
	border-color: var(--blue-500);
}

.POSTS .filter input[type="text"]::placeholder,
.POSTS .filter select::placeholder {
	color: var(--black);
}

.POSTS .filter input[type="text"] {
	padding-right: var(--s6);
	background: url('../../assets/images/ui-search.svg') no-repeat right 16rem top 15rem / 16rem 16rem;
}

.POSTS .filter select {
	padding-right: var(--s6);
	background: url('../../assets/images/ui-expand.svg') no-repeat right 20rem top 21rem / 10rem 7rem;
}

.POSTS .filter select.b-disabled {
	display: none;
}

.POSTS .filter .search {
	position: relative;
}

.POSTS .filter button {
	position: absolute;
	top: 0;
	right: 0;
	width: var(--s6);
	height: var(--s6);
	cursor: pointer;
	opacity: 0;
	text-indent: -9999rem;
}

.POSTS .post {
	height: calc(100% + 1px);
	border-radius: var(--s4);
	background: var(--purple-blue-gradient);
	box-sizing: border-box;
	margin: 0 -1px -1px 0;
	overflow: hidden;
	position: relative;
	color: var(--black);
}

.POSTS .post::before {
	content: '';
	position: absolute;
	top: 1px;
	left: 1px;
	right: 1px;
	bottom: 1px;
	background: var(--white);
	border-radius: calc(var(--s4) - 1px);
	transition: background-color 0.25s;
}

.POSTS .post:hover::before {
	background-color: var(--blue-50);
}

.POSTS .post .inner-wrapper {
	box-sizing: border-box;
	padding: var(--s5) var(--s5) var(--s8);
	height: 100%;
	position: relative;
	overflow: hidden;
}

.POSTS .image {
	overflow: hidden;
	border-radius: var(--s1);
	margin-bottom: var(--s5);
}

.POSTS .content a::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.POSTS .press-date {
	font-size: 14rem;
	text-transform: uppercase;
	margin-bottom: var(--s2);
}

.POSTS .time-to-read {
	text-transform: uppercase;
	font-size: 14rem;
}

.POSTS .categories {
	position: absolute;
	bottom: var(--s5);
	left: var(--s5);
	background: var(--purple-100);
	border-radius: 999rem;
	font-size: 14rem;
	line-height: var(--s5);
	padding: 0 var(--s3);
	font-weight: 500;
}

.POSTS .date {
	display: none;
}

.POSTS .content p {
	opacity: 0.8;
}

.POSTS .link {
	position: absolute;
	bottom: var(--s5);
	right: var(--s5);
	line-height: var(--s5);
}

.POSTS .link svg {
	fill: currentColor;
	margin-left: var(--s3);
}

.POSTS .posts + .pagination {
	margin: var(--s7) 0 0 calc(var(--col-3) + var(--s5));
	text-align: center;
	line-height: var(--s5);
	color: var(--black);
}

.POSTS .pagination .page-numbers {
	color: var(--black);
	text-decoration: none;
	display: inline-block;
	border-radius: 4rem;
	margin: 0;
	min-width: var(--s5);
	text-align: center;
	padding: 0 4rem;
	font-size: 16rem;
	box-sizing: border-box;
	vertical-align: top;
	transition: background-color 0.25s;
}

.POSTS .pagination a.page-numbers:hover {
	color: var(--black);
	background: var(--blue-50);
}

.POSTS .pagination .page-numbers.current {
	background: var(--blue-50);
	box-shadow: inset 0 0 0 1rem var(--blue-500);
}

.POSTS .pagination .prev,
.POSTS .pagination .next {
	display: none;
	text-indent: -9999rem;
	background: url('../../assets/images/button-arrow-blue.svg') no-repeat center / 20rem 13rem;
}

.POSTS .pagination .prev {margin-right: var(--s5); transform: scaleX(-1);}
.POSTS .pagination .next {margin-left: var(--s5);}

.POSTS .screen-reader-text {
	display: none;
}

.POSTS .flickity-viewport {overflow: visible;}
.POSTS .b-columns {margin: 0;}
.POSTS .b-column {padding: 0; width: 33.333333%;}

/* ajax load more */

.POSTS .alm-listing {
	display: flex;
	flex-wrap: wrap;
}

.POSTS .alm-item {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 33.333333%;
}

.POSTS .ajax-load-more-wrap[data-total-posts="0"] .alm-listing:empty::before {content: "No results found."; padding: 0 var(--s3);}
.POSTS .alm-btn-wrap {text-align: center; overflow: hidden;}
.POSTS .alm-load-more-btn {margin-top: var(--s7);}
.POSTS .alm-load-more-btn.done {display: none;}
.POSTS .posts.alt-hide-button .alm-load-more-btn.more {display: none;}

@media screen and (min-width: 961px) {
	.POSTS .filter {position: sticky; top: var(--s7);}
}

@media screen and (max-width: 1440px) {
	.POSTS .link {text-indent: -9999rem;}
}

@media screen and (max-width: 960px) {
	.POSTS .filter {float: none; margin: 0 0 var(--s5) 0; width: auto;}
	.POSTS .b-column {width: 100%;}
	.POSTS .alm-item {width: 100%;}
	.POSTS .alm-load-more-btn {margin-top: var(--s5);}
	.POSTS .posts + .pagination {margin: var(--s5) 0 0 0; line-height: var(--s4);}
	.POSTS .pagination .page-numbers {min-width: var(--s4); font-size: 14rem;}
	.POSTS .pagination .prev,
	.POSTS .pagination .next {display: none;}
	.POSTS .press-date {margin-bottom: var(--s1); font-size: 12rem;}
}



/* featured */

.POSTS[data-variant="featured"] .alm-listing {margin: -2rem;}
.POSTS[data-variant="featured"] .alm-item {padding: 2rem;}

.POSTS[data-variant="featured"] .post {border: 2px solid transparent; background: var(--grey-100); transition: background-color 0.25s, border-color 0.25s;}
.POSTS[data-variant="featured"] .post:hover {border-color: var(--blue-500); background: var(--blue-50);}
.POSTS[data-variant="featured"] .post::before {display: none;}

@media screen and (min-width: 961px) {
	.POSTS[data-variant="featured"] .alm-item:first-child {width: 100%;}
	.POSTS[data-variant="featured"] .alm-item:first-child h5 {font-size: 28rem; line-height: 1.2; font-weight: 400;}
	.POSTS[data-variant="featured"] .alm-item:first-child .post .image {float: right; width: calc(66.66% + 10px); margin: 0 0 var(--ns7) var(--s5);}
	.POSTS[data-variant="featured"] .alm-item:first-child .post .image ~ .content h5 {font-size: 38rem;}
	.POSTS[data-variant="featured"] .alm-item:first-child .post .image ~ .link {right: calc(66.66% + 42px)}
}

@media screen and (min-width: 1441px) {
	.POSTS[data-variant="featured"] .alm-item:first-child h5 {font-size: 38rem;}
	.POSTS[data-variant="featured"] .alm-item:first-child .post .image ~ .content h5 {font-size: 52rem;}
}



/* future-events */

.POSTS[data-variant="future-events"] .alm-listing {margin: -2rem;}
.POSTS[data-variant="future-events"] .alm-item {padding: 2rem; width: 100%;}

.POSTS[data-variant="future-events"] .post {border: 2px solid transparent; background: var(--grey-100); transition: background-color 0.25s, border-color 0.25s;}
.POSTS[data-variant="future-events"] .post:hover {border-color: var(--blue-500); background: var(--blue-50);}
.POSTS[data-variant="future-events"] .post::before {display: none;}

.POSTS[data-variant="future-events"] .time-to-read {display: none;}
.POSTS[data-variant="future-events"] .categories {display: none;}
.POSTS[data-variant="future-events"] .content p {margin-bottom: 0;}

.POSTS[data-variant="future-events"] .date {
	position: absolute;
	bottom: var(--s5);
	left: var(--s5);
	display: block;
	width: var(--s9);
	margin-right: var(--s5);
	border-radius: var(--s3);
	background: var(--grey-100);
	box-shadow: inset 0 0 0 1px var(--black);
	text-align: center;
	padding: var(--s2) 0;
	flex-shrink: 0;
	align-self: flex-start;
	transition: background-color 0.25s, color 0.25s, box-shadow 0.25s;
}

.POSTS[data-variant="future-events"] .post:hover .date {
	background-color: var(--blue-500);
	color: var(--white);
	box-shadow: inset 0 0 0 1px var(--blue-500);
}

.POSTS[data-variant="future-events"] .date span {
	display: block;
}

.POSTS[data-variant="future-events"] .date span:nth-child(1) {font-size: 20rem;}
.POSTS[data-variant="future-events"] .date span:nth-child(2) {font-size: 52rem; line-height: 1.2; letter-spacing: -0.05em}
.POSTS[data-variant="future-events"] .date span:nth-child(3) {font-size: 16rem;}

@media screen and (min-width: 961px) {
	.POSTS[data-variant="future-events"] h5 {font-size: 38rem; line-height: 1.2; font-weight: 400;}
	.POSTS[data-variant="future-events"] .post .inner-wrapper {padding-bottom: 192rem;}
	.POSTS[data-variant="future-events"] .post .content {overflow: hidden;}
	.POSTS[data-variant="future-events"] .post .image {float: right; width: calc(66.66% + 10px); margin: 0 0 -160rem var(--s5);}
	.POSTS[data-variant="future-events"] .post .link {right: calc(66.66% + 42px)}
}

@media screen and (min-width: 1441px) {
	.POSTS[data-variant="future-events"] h5 {font-size: 52rem;}
}

@media screen and (max-width: 960px) {
	.POSTS[data-variant="future-events"] .post .inner-wrapper {display: flex; flex-wrap: wrap; padding-bottom: var(--s5);}
	.POSTS[data-variant="future-events"] .image {order: 1; width: 100%;}
	.POSTS[data-variant="future-events"] .content {order: 3; flex: 1 1;}
	.POSTS[data-variant="future-events"] .date {width: var(--s7); margin-right: var(--s3); position: static; order: 2; flex-shrink: 0;}
	.POSTS[data-variant="future-events"] .date span:nth-child(1) {font-size: 16rem;}
	.POSTS[data-variant="future-events"] .date span:nth-child(2) {font-size: 32rem;}
	.POSTS[data-variant="future-events"] .date span:nth-child(3) {font-size: 12rem;}
	.POSTS[data-variant="future-events"] .link {display: none;}
}



/* past-events */

.POSTS[data-variant="past-events"] .alm-listing {
	margin: 0;
	border-bottom: 1px solid var(--blue-500);
}

.POSTS[data-variant="past-events"] .alm-item {
	padding: var(--s5) 0 0;
	margin: 0 0 var(--s5) 0;
	border-top: 1px solid var(--blue-500);
	width: 100%;
}

.POSTS[data-variant="past-events"] .post {
	background: var(--white);
	border-radius: var(--s4);
}

.POSTS[data-variant="past-events"] .post::before {
	display: none;
}

.POSTS[data-variant="past-events"] .post .inner-wrapper {
	display: flex;
	align-items: center;
	padding: 0;
}

.POSTS[data-variant="past-events"] .date {
	order: 1;
	display: block;
	width: var(--s9);
	margin-right: var(--s5);
	border-radius: var(--s3);
	background: var(--grey-100);
	text-align: center;
	padding: var(--s2) 0;
	flex-shrink: 0;
	align-self: flex-start;
	transition: background-color 0.25s, color 0.25s;
}

.POSTS[data-variant="past-events"] .post:hover .date {
	background-color: var(--blue-500);
	color: var(--white);
}

.POSTS[data-variant="past-events"] .date span {
	display: block;
}

.POSTS[data-variant="past-events"] .date span:nth-child(1) {font-size: 20rem;}
.POSTS[data-variant="past-events"] .date span:nth-child(2) {font-size: 52rem; line-height: 1.2; letter-spacing: -0.05em}
.POSTS[data-variant="past-events"] .date span:nth-child(3) {font-size: 16rem;}

.POSTS[data-variant="past-events"] .content {
	order: 2;
	flex-grow: 1;
}

.POSTS[data-variant="past-events"] .content p {
	margin-bottom: 0;
}

.POSTS[data-variant="past-events"] .link {
	flex-shrink: 0;
	order: 3;
	position: static;
	margin: 0 var(--s5);
}

.POSTS[data-variant="past-events"] .image {display: none;}
.POSTS[data-variant="past-events"] .time-to-read {display: none;}
.POSTS[data-variant="past-events"] .categories {display: none;}

@media screen and (max-width: 960px) {
	.POSTS[data-variant="past-events"] .date {width: var(--s7); margin-right: var(--s3);}
	.POSTS[data-variant="past-events"] .date span:nth-child(1) {font-size: 16rem;}
	.POSTS[data-variant="past-events"] .date span:nth-child(2) {font-size: 32rem;}
	.POSTS[data-variant="past-events"] .date span:nth-child(3) {font-size: 12rem;}
	.POSTS[data-variant="past-events"] .link {display: none;}
}