/*==================================================
EVER THEME
Blog
Version 2.0.0
==================================================*/

/* BLOG ARCHIVE
==================================================*/

.ever-blog {
	position: relative;
}

.ever-blog__header {
	max-width: 820px;
	margin-bottom: var(--space-8);
}

.ever-blog__eyebrow {
	margin-bottom: var(--space-4);

	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);

	letter-spacing: 0.18em;
	text-transform: uppercase;

	color: var(--color-primary);
}

.ever-blog__title {
	margin: 0 0 var(--space-4);
}

.ever-blog__intro {
	max-width: 680px;
	margin: 0;

	color: var(--color-text-light);
}

/* BLOG GRID
==================================================*/

.ever-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-7) var(--space-6);
}

/* ARTICLE CARD
==================================================*/

.ever-article-card {
	position: relative;

	display: flex;
	flex-direction: column;

	min-width: 0;
	height: 100%;

	overflow: hidden;

	background: var(--color-surface);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);

	box-shadow: var(--shadow-xs);

	transition:
		transform var(--transition),
		box-shadow var(--transition),
		border-color var(--transition);
}

.ever-article-card:hover {
	transform: translateY(-6px);

	border-color: var(--color-primary-light);

	box-shadow: var(--shadow-md);
}

/* ARTICLE CARD MEDIA
==================================================*/

.ever-article-card__media {
	position: relative;

	display: block;

	aspect-ratio: 4 / 3;

	overflow: hidden;

	background: var(--color-secondary);
}

.ever-article-card__media img {
	width: 100%;
	height: 100%;

	object-fit: cover;

	transition: transform var(--transition-slow);
}

.ever-article-card:hover .ever-article-card__media img {
	transform: scale(1.045);
}

/* ARTICLE CARD CATEGORY
==================================================*/

.ever-article-card__category {
	position: absolute;
	top: var(--space-4);
	left: var(--space-4);
	z-index: 2;

	display: inline-flex;
	align-items: center;

	padding: 8px 14px;

	font-size: 11px;
	font-weight: var(--fw-medium);
	line-height: 1;

	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;

	color: var(--color-primary-dark);
	background: rgba(250, 248, 247, 0.92);

	border: 1px solid rgba(141, 119, 182, 0.12);
	border-radius: var(--radius-round);

	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* ARTICLE CARD CONTENT
==================================================*/

.ever-article-card__content {
	display: flex;
	flex: 1;
	flex-direction: column;

	padding: var(--space-6);
}

.ever-article-card__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-3);

	margin-bottom: var(--space-4);

	font-size: 13px;

	color: var(--color-text-light);
}

.ever-article-card__meta > * + *::before {
	content: "·";

	margin-right: var(--space-3);

	color: var(--color-primary);
}

.ever-article-card__title {
	margin: 0 0 var(--space-4);

	font-size: clamp(27px, 2.4vw, 34px);
	line-height: 1.12;
}

.ever-article-card__title a {
	color: var(--color-primary-dark);
	text-decoration: none;

	transition: color var(--transition-fast);
}

.ever-article-card__title a:hover {
	color: var(--color-primary);
}

.ever-article-card__excerpt {
	margin: 0 0 var(--space-5);

	font-size: 16px;
	line-height: var(--lh-relaxed);

	color: var(--color-text-light);
}

.ever-article-card__footer {
	margin-top: auto;
	padding-top: var(--space-3);
}

/* FEATURED ARTICLE
==================================================*/

.ever-article-card--featured {
	grid-column: span 2;

	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
}

.ever-article-card--featured .ever-article-card__media {
	height: 100%;
	aspect-ratio: auto;
}

.ever-article-card--featured .ever-article-card__content {
	justify-content: center;

	padding: var(--space-8);
}

.ever-article-card--featured .ever-article-card__title {
	font-size: clamp(36px, 4vw, 52px);
}

/* BLOG FILTERS
==================================================*/

.ever-blog-filters {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-3);

	margin-bottom: var(--space-7);
}

.ever-blog-filter {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 42px;
	padding: 9px 18px;

	font-size: 13px;
	font-weight: var(--fw-medium);

	text-decoration: none;

	color: var(--color-text);
	background: transparent;

	border: 1px solid var(--color-border);
	border-radius: var(--radius-round);

	transition:
		color var(--transition-fast),
		background var(--transition-fast),
		border-color var(--transition-fast);
}

.ever-blog-filter:hover,
.ever-blog-filter.is-active {
	color: var(--color-surface);
	background: var(--color-primary);

	border-color: var(--color-primary);
}

/* SINGLE ARTICLE
==================================================*/

.ever-single {
	position: relative;
}

.ever-single__header {
	max-width: 920px;

	margin-inline: auto;
	margin-bottom: var(--space-8);

	text-align: center;
}

.ever-single__category {
	display: inline-flex;

	margin-bottom: var(--space-5);

	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);

	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;

	color: var(--color-primary);
}

.ever-single__title {
	margin: 0;

	font-size: clamp(48px, 6vw, 76px);
	line-height: 1.02;
	letter-spacing: -0.025em;

	color: var(--color-primary-dark);
}

.ever-single__meta {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--space-3);

	margin-top: var(--space-5);

	font-size: 14px;

	color: var(--color-text-light);
}

.ever-single__meta > * + *::before {
	content: "·";

	margin-right: var(--space-3);

	color: var(--color-primary);
}

/* SINGLE FEATURED IMAGE
==================================================*/

.ever-single__media {
	max-width: 1180px;

	margin:
		0
		auto
		var(--space-9);

	overflow: hidden;

	border-radius: var(--radius-xl);

	box-shadow: var(--shadow-sm);
}

.ever-single__media img {
	display: block;

	width: 100%;
	height: auto;
}

/* ARTICLE LAYOUT
==================================================*/

.ever-single__layout {
	display: grid;
	grid-template-columns: minmax(0, 760px) minmax(220px, 280px);
	justify-content: center;
	gap: var(--space-9);
}

/* ARTICLE CONTENT
==================================================*/

.ever-single__content {
	min-width: 0;

	font-size: 18px;
	line-height: 1.8;

	color: var(--color-text);
}

.ever-single__content > *:first-child {
	margin-top: 0;
}

.ever-single__content > *:last-child {
	margin-bottom: 0;
}

.ever-single__content p {
	margin-bottom: var(--space-5);
}

.ever-single__content h2 {
	margin:
		var(--space-8)
		0
		var(--space-4);

	font-size: clamp(36px, 4vw, 48px);
}

.ever-single__content h3 {
	margin:
		var(--space-7)
		0
		var(--space-4);

	font-size: clamp(29px, 3vw, 36px);
}

.ever-single__content h4 {
	margin:
		var(--space-6)
		0
		var(--space-3);

	font-size: 27px;
}

.ever-single__content ul,
.ever-single__content ol {
	margin:
		0
		0
		var(--space-5)
		var(--space-5);
}

.ever-single__content li {
	margin-bottom: var(--space-2);
}

.ever-single__content a {
	color: var(--color-primary);

	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

.ever-single__content img {
	border-radius: var(--radius-md);
}

/* BLOCKQUOTE
==================================================*/

.ever-single__content blockquote {
	position: relative;

	margin:
		var(--space-7)
		0;

	padding:
		var(--space-6)
		var(--space-7);

	font-family: var(--font-heading);
	font-size: clamp(27px, 3vw, 36px);
	line-height: 1.35;

	color: var(--color-primary-dark);
	background: var(--color-secondary);

	border: 0;
	border-radius: var(--radius-lg);
}

.ever-single__content blockquote p {
	margin: 0;
}

/* SIDEBAR
==================================================*/

.ever-single__sidebar {
	position: relative;
}

.ever-single__sidebar-inner {
	position: sticky;
	top: calc(var(--header-height-scroll) + var(--space-8));

	padding: var(--space-5);

	background: var(--color-surface);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
}

.ever-single__sidebar-title {
	margin-bottom: var(--space-4);

	font-size: 24px;
}

.ever-single__sidebar ul {
	margin: 0;
	padding: 0;

	list-style: none;
}

.ever-single__sidebar li + li {
	margin-top: var(--space-3);
}

.ever-single__sidebar a {
	font-size: 14px;

	color: var(--color-text-light);
	text-decoration: none;

	transition: color var(--transition-fast);
}

.ever-single__sidebar a:hover {
	color: var(--color-primary);
}

/* ARTICLE FOOTER
==================================================*/

.ever-single__footer {
	max-width: 760px;

	margin:
		var(--space-8)
		auto
		0;

	padding-top: var(--space-6);

	border-top: 1px solid var(--color-border);
}

.ever-single__tags {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.ever-single__tag {
	display: inline-flex;

	padding: 8px 14px;

	font-size: 12px;

	color: var(--color-primary-dark);
	background: var(--color-secondary);

	border-radius: var(--radius-round);

	text-decoration: none;

	transition:
		color var(--transition-fast),
		background var(--transition-fast);
}

.ever-single__tag:hover {
	color: var(--color-surface);
	background: var(--color-primary);
}

/* ARTICLE NAVIGATION
==================================================*/

.ever-post-navigation {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-5);

	max-width: 1180px;

	margin:
		var(--space-9)
		auto
		0;
}

.ever-post-navigation__item {
	display: flex;
	flex-direction: column;

	padding: var(--space-6);

	color: var(--color-text);
	background: var(--color-surface);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);

	text-decoration: none;

	transition:
		transform var(--transition),
		border-color var(--transition),
		box-shadow var(--transition);
}

.ever-post-navigation__item:hover {
	transform: translateY(-4px);

	border-color: var(--color-primary-light);

	box-shadow: var(--shadow-sm);
}

.ever-post-navigation__item--next {
	text-align: right;
}

.ever-post-navigation__label {
	margin-bottom: var(--space-3);

	font-size: 11px;
	font-weight: var(--fw-medium);

	letter-spacing: 0.14em;
	text-transform: uppercase;

	color: var(--color-primary);
}

.ever-post-navigation__title {
	font-family: var(--font-heading);
	font-size: 25px;
	line-height: 1.2;

	color: var(--color-primary-dark);
}

/* PAGINATION
==================================================*/

.ever-pagination,
.navigation.pagination {
	margin-top: var(--space-9);
}

.ever-pagination .nav-links,
.navigation.pagination .nav-links {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.ever-pagination .page-numbers,
.navigation.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 46px;
	height: 46px;
	padding-inline: 14px;

	font-size: 14px;
	font-weight: var(--fw-medium);

	color: var(--color-text);
	background: var(--color-surface);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-round);

	text-decoration: none;

	transition:
		color var(--transition-fast),
		background var(--transition-fast),
		border-color var(--transition-fast),
		transform var(--transition-fast);
}

.ever-pagination a.page-numbers:hover,
.navigation.pagination a.page-numbers:hover {
	color: var(--color-surface);
	background: var(--color-primary);

	border-color: var(--color-primary);

	transform: translateY(-2px);
}

.ever-pagination .page-numbers.current,
.navigation.pagination .page-numbers.current {
	color: var(--color-surface);
	background: var(--color-primary-dark);

	border-color: var(--color-primary-dark);
}

.ever-pagination .page-numbers.dots,
.navigation.pagination .page-numbers.dots {
	min-width: 30px;

	background: transparent;

	border-color: transparent;
}

/* EMPTY BLOG
==================================================*/

.ever-blog-empty {
	max-width: 720px;

	margin-inline: auto;
	padding: var(--space-8);

	text-align: center;

	background: var(--color-secondary);

	border-radius: var(--radius-lg);
}

.ever-blog-empty__title {
	margin-bottom: var(--space-4);

	font-size: 36px;
}

.ever-blog-empty__text {
	margin: 0;

	color: var(--color-text-light);
}

/* RESPONSIVE
==================================================*/

@media (max-width: 1024px) {

	.ever-blog-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ever-article-card--featured {
		grid-column: span 2;
	}

	.ever-single__layout {
		grid-template-columns: minmax(0, 760px);
	}

	.ever-single__sidebar {
		display: none;
	}

}

/* TABLET
==================================================*/

@media (max-width: 768px) {

	.ever-blog-grid {
		grid-template-columns: 1fr;
		gap: var(--space-6);
	}

	.ever-article-card--featured {
		grid-column: auto;

		display: flex;
	}

	.ever-article-card--featured .ever-article-card__media {
		aspect-ratio: 4 / 3;
	}

	.ever-article-card--featured .ever-article-card__content {
		padding: var(--space-6);
	}

	.ever-article-card--featured .ever-article-card__title {
		font-size: clamp(30px, 8vw, 38px);
	}

	.ever-single__header {
		margin-bottom: var(--space-7);
	}

	.ever-single__title {
		font-size: clamp(42px, 11vw, 58px);
	}

	.ever-single__media {
		margin-bottom: var(--space-7);

		border-radius: var(--radius-lg);
	}

	.ever-single__content {
		font-size: 17px;
	}

	.ever-single__content blockquote {
		padding: var(--space-5);
	}

	.ever-post-navigation {
		grid-template-columns: 1fr;
	}

	.ever-post-navigation__item--next {
		text-align: left;
	}

}

/* MOBILE
==================================================*/

@media (max-width: 480px) {

	.ever-blog__header {
		margin-bottom: var(--space-6);
	}

	.ever-blog-filters {
		margin-bottom: var(--space-6);
	}

	.ever-article-card {
		border-radius: var(--radius-md);
	}

	.ever-article-card__content {
		padding: var(--space-5);
	}

	.ever-article-card__title {
		font-size: 28px;
	}

	.ever-single__title {
		font-size: 40px;
	}

	.ever-single__content {
		font-size: 16px;
		line-height: 1.75;
	}

	.ever-single__content h2 {
		font-size: 34px;
	}

	.ever-single__content h3 {
		font-size: 29px;
	}

	.ever-single__content blockquote {
		font-size: 27px;

		border-radius: var(--radius-md);
	}

	.ever-post-navigation__item {
		padding: var(--space-5);
	}

	.ever-pagination .page-numbers,
	.navigation.pagination .page-numbers {
		min-width: 42px;
		height: 42px;

		padding-inline: 12px;
	}

	.ever-blog-empty {
		padding: var(--space-6);
	}

}