/* ! [[ Event Module ]] */

/* ! [ Events - general ] */
.events-block {
	font-family: var(--font-secondary);
}
.events-block .events-heading {
	margin-bottom: 1rem;
}
.events-block .more-all {
	text-align: center;
	margin-bottom: 0;
}

.events-items {
/* 	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
	grid-gap: 3rem;
	align-items: stretch; */
}
	.event-item {
		position: relative;
		padding: 0;
		margin: 1rem 0 2rem;

		display: flex;
		flex-direction: column;
	}
		.event-title {
	/* 		margin: 0 0 1rem 0;
			font-weight: 600;
			font-size: 32px; */
			text-wrap: balance;
		}
		.event-item .event-title a {
			text-decoration: none;
		}
		.event-item .event-title a:hover {
			text-decoration: underline;
		}
		.event-meta {
			margin-bottom: .25rem;

			color: var(--blue-bright);
			font-weight: 700;
		}
			.event-meta > * {
				margin-bottom: 0rem;
			}
			.event-dates {
				font-size: inherit;
			}
			.event-dates .event-range {

			}
			.event-dates .event-date {

			}
			.event-location {
				font-size: inherit;
			}
	.event-figure {
		margin: 0;
		overflow: hidden;
		position: relative;
	}
		.event-img {
			display: block;
			width: 100%;
			height: auto;

			transition: transform .2s ease-in;
		}
		.event-item:hover .event-img {
			transform: scale(1.05);
		}
		.event-figure figcaption {
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			padding: .5rem .75rem .3rem;
			background: hsla(0, 0%, 0%, .5);
			color: #fff;
			font-size: .75rem;
		}
	.event-details {
		display: flex;
		flex-direction: column;
		padding: .5rem 0 0;
		padding: 0;
		flex-grow: 1;
	}
	.event-details > :last-child {
		margin-bottom: 0;
	}
		.event-brief {
			margin-bottom: auto;
			/* font-size: 18px; */
			color: var(--blue-navy);
		}
		.event-brief p {
			margin-bottom: .5rem;
			font-size: inherit;
		}
	.event-item .more {
		margin-block: 1rem .5rem;
	}
		.event-item .more a {
			display: block;
			max-width: 200px;
			padding: .25rem .5rem;
			margin-inline: auto;
			border: 1px solid var(--blue-bright);
			border-radius: calc( var(--border-radius) / 2);

			background-color: var(--blue-sky);
			color: var(--primary);

			text-align: center;
			text-transform: uppercase;
			font-size: 18px;
			font-weight: normal;

			transition: .2s background, .2s color;
		}
		.event-item .more a:hover {
			background-color: var(--blue-bright);
			color: #fff;
		}

/* ! Events Filter */
/* 	.events-filter {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		gap: 1rem;

		padding: 1rem;

		background-color: var(--blue-sky);
	}
		.events-filter [class^="input-"] {
			margin-bottom: 0;
		}
		.events-filter .input-daterange {
			display: flex;
			column-gap: .25rem;
		}
		.events-filter .button {
			margin-top: auto;
		} */


/* ! [ Events - Index ] */
	.events-index .more-all {
		display: none;
	}
	.events-index .events-heading {
		/* display: none; */
	}
	.events-index.event-items {

	}
		.events-index .event-item {
			display: flex;
			flex-direction: row;
			gap: 1rem 5%;
		}
		.events-index .event-figure {
			max-width: 300px;
			flex-basis: 35%;
			align-self: flex-start;

			border-radius: var(--border-radius);
			border: .5px solid currentcolor;
		}
		.events-index .event-img {
			/* aspect-ratio: 1/1; */
			object-fit: cover;
		}
		.events-index .event-details {
			flex-basis: 60%;
			flex-grow: 0;
		}
		.events-index .event-title {
			margin-bottom: .25rem;
		}
		.events-index .event-meta {
			display: flex;
			flex-wrap: wrap;
			column-gap: 2rem;
		}
		.events-index .more {
			margin: 0;
		}
		.events-index .more a {
			all: revert;

			text-transform: capitalize;
			font-size: 1rem;
			color: var(--blue-bright);
		}


/* ! [ Events - Upcoming ] */
	.events-upcoming,
	.events-featured {

	}
	.events-upcoming .events-items,
	.events-featured .events-items {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
		grid-column-gap: 4rem;
		grid-row-gap: 0;
	}
		.events-upcoming .event-item,
		.events-featured .event-item {
			border-radius: var(--border-radius);
			background-color: #fff;
			overflow: hidden;
		}
		.events-upcoming .event-details,
		.events-featured .event-details {
			padding: 1rem 1.5rem;
		}
		.events-upcoming .event-title,
		.events-featured .event-title {
			margin-bottom: .5rem;
		}
		.events-upcoming .event-img,
		.events-featured .event-img  {
			aspect-ratio: 2/1;
			object-fit: cover;
		}


	.events-upcoming .events-heading {
		text-align: center;
	}
	.events-upcoming .event-item:nth-child(n+4) {
		display: none; /* limit to first 3 items */
	}

	.events-featured {
		margin-bottom: 4rem;
		padding: 2rem 4rem;
		background-color: var(--blue-sky);
	}
		.events-featured .event-item:nth-child(n+5) {
			display: none; /* limit to first 4 items */
		}
		.events-featured .more-all {
			display: none;
		}

/* ! [ Events - Single event (view) ] */
	.event-view {

		margin-bottom: 2rem;
		display: flex;
		flex-wrap: wrap;
		column-gap: 2rem;
	}
	.event-view .event-content {
		flex-grow: 1;

	}
	.event-view .event-headline {
		width: 100%;
	}
	.event-view .event-figure {
		max-width: 1200px;
		margin-bottom: 2rem;
	}
	.event-view .event-img {
		max-width: 100%;
	}

	.event-view .event-meta {
		flex-basis: 100%;
		--section-bg: var(--blue-sky);
		color: var(--primary);

		padding: 1rem;
		margin-bottom: 1rem;
		border-start-start-radius: calc(var(--border-radius) * 1);
		border-end-start-radius: calc(var(--border-radius) * 1);
		background-color: var(--section-bg);
		box-shadow: 5vw 0 0 0 var(--section-bg), 10vw 0 0 0 var(--section-bg);

		font-weight: normal;
	}
		.event-view .event-date {
			display: inline;
		}
		.event-view .event-external-link {
			margin-top: 2rem;
		}


	@media (width > 1200px) {
		.event-meta {
			font-size: 20px;
		}
		.event-brief {
			font-size: 18px;
		}

		.events-upcoming .event-title,
		.events-featured .event-title {
			font-size: 32px;
			margin-bottom: 1rem;
		}
		.events-upcoming .event-details,
		.events-featured .event-details {
			padding: 1rem 2rem;
		}

		.event-view {
			margin-top: 2rem;
		}
		.event-view .event-content {
			flex-basis: 70%;
		}
		.event-view .event-meta {
			flex-basis: calc(30% - 2rem);
			order: 1;
			margin-bottom: auto;
		}
	}

	@media (width < 480px) {
		.events-featured {
			padding-inline: 1.5rem;
			margin-inline: -1.5rem;
		}
		.events-upcoming .events-items,
		.events-featured .events-items {
			grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
		}
		.event-brief p {
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 3;
			line-clamp: 3;
			overflow: hidden;
		}
	}