
/* Inspo Plugin
------------------------------------------- 

Table of contents
	- Single Page
	- Page Loop
	- Media Queries

------------------------------------------- */

/* Archive
-------------------------------------------- */

.inspo-archive .site-inner,
.single-inspo .site-inner {
	max-width: 100%;
	padding: 0;
}

.inspo-archive .content .row,
.single-inspo .content .row {
	padding: 40px 24px;
}

.inspo-archive .content .row .wrap,
.single-inspo .content .row .wrap {
	margin: 0 auto;
	max-width: 1140px;
}

.inspo-archive .content .row.filters-container .wrap {
	max-width: 960px;
}

.facet-label.reset {
	display: none;
}

.inspo-archive .content .row.inspiration-container,
.single-inspo .content .row.inspo-site-capture {
	padding-top: 0;
}

.inspo-archive .content .row.inspiration-container .wrap,
.single-inspo .content .row.inspo-site-capture .wrap {
	margin-top: -40px;
}

.inspo-post {
	position: relative;
}

.inspo-post img{
	opacity: 1;
	transition: all 0.2s ease-in-out;
}

.inspo-post:focus-within img,
.inspo-post:hover img {
	opacity: .6;
}

.inspo-post .featured-img {
	background-color: var(--white);
	box-shadow: 0 4px 12px rgb(6 30 61 / 20%); 
	margin-bottom: 16px;
}

.inspo-post .featured-img,
.inspo-post .featured-img img,
.inspo-site-capture img {
	border-radius: 8px;
}

.inspo-post .content {
	padding-left: 8px;
	padding-right: 8px;
}

.inspo-post h2 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 8px;
}

.inspo-post .more-link {
	font-size: 24px;
	margin-bottom: 0;
	position: unset;
}

.inspo-post .more-link a {
	font-weight: 600;
	text-underline-offset: 2px;
}

.inspo-post .more-link a:before {
	bottom: 0;
	content: '';
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

/* Single Page
-------------------------------------------- */

.single-inspo .content .row.inspo-header {
	padding-top: 40px;
}

.single-inspo .content .row.inspo-header .wrap {
	margin: 0 auto;
	max-width: 960px;
}

p.author i {
	color: var(--green);
	margin-right: 12px;
}

p.site-link {
	margin-bottom: 16px;
}

.terms-container {
	border-top: 2px solid rgba(237, 224, 215, 0.2);
	margin-top: 24px;
	padding-top: 24px;
}

.term-wrap {
	margin-bottom: 24px;
}

.term-wrap:last-of-type {
	margin-bottom: 0;
}

.term-wrap .meta-label {
	color: var(--green);
	display: block;
	font-family: 'Antonio', serif;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 1px;
	margin-bottom: 8px;
	text-transform: uppercase;
}

.term-wrap .meta-terms {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.term-wrap .meta-terms .term {
	background-color: rgba(255, 255, 255, 0.08);
    border-radius: 4px;
	color: var(--white);
	font-size: 14px;
	padding: 8px 12px;
}

.inspo-site-capture img {
	box-shadow: 0 4px 12px rgb(6 30 61 / 20%); 
	width: 100%;
}

/* Media Queries
------------------------------------------- */

@media only screen and (min-width: 961px) {

	.inspo-archive .content .row,
	.single-inspo .content .row {
		padding: 120px 24px;
	}

	.inspo-archive .filters-container .wrap {
		display: flex;
		flex-wrap: wrap;
		gap: 0 24px;
	}

	.inspo-archive .filters-container .wrap:after,
	.inspo-archive .filters-container .wrap:before {
		display: none;
	}

	.search-wrap {
		width: 100%;
	}

	.industry-wrap,
	.sections-wrap,
	.feature-wrap {
		width: calc( ( 100% - 48px ) / 3 );
	}

	.inspo-archive .content .row.inspiration-container {
		padding-left: 40px;
		padding-right: 40px;
	}

	.inspo-archive .content .row.inspiration-container .wrap {
		display: flex;
		flex-wrap: wrap;
		gap: 40px 24px;
		margin-top: -80px;
		max-width: 100%;
	}

	.single-inspo .content .row.inspo-site-capture .wrap {
		margin-top: -80px;
	}

	.inspiration-container .wrap:after,
	.inspiration-container .wrap:before {
		display: none;
	}

	.inspo-post {
		width: calc( ( 100% - 48px ) / 3 );
	}

	.inspo-post .content,
	.inspo-header .wrap {
		align-items: center;
		display: flex;
		justify-content: space-between;
	}

	.inspo-header .wrap {
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 0 24px;
	}

	.inspo-header .wrap:after,
	.inspo-header .wrap:before {
		display: none;
	}

	.inspo-post h2 {
		margin-bottom: 0;
	}

	.single-inspo .content .row.inspo-header {
		padding-top: 80px;
	}

	.row .col-50 {
		width: calc( 50% - 12px );
	}

	.row .col-100 {
		width: 100%;
	}

	p.author {
		margin-bottom: 0;
	}

	p.site-link {
		text-align: right;
	}

	.save-link {
		margin-bottom: 0;
	    text-align: right;
	}

	.term-wrap .meta-label {
		margin-bottom: 0;
		padding-top: 5px;
	}

	.term-wrap {
		display: flex;
		gap: 24px;
		width: 100%;
	}

}

@media only screen and (min-width: 2000px) {

	.inspo-post {
		width: calc( ( 100% - 72px ) / 4 );
	}

}