/* =========================================================
   KEN'S DISTRIBUTING
   BLOG + BLOG CATEGORY ARCHIVES
   ========================================================= */


/* =========================================================
   PAGE
   ========================================================= */

.kendisco-blog-page {
	--kendisco-blog-width: 1440px;
	--kendisco-blog-navy: #0F172A;
	--kendisco-blog-orange: #FF5F14;
	--kendisco-blog-text: #1F2937;
	--kendisco-blog-muted: #64748B;
	--kendisco-blog-border: #E2E8F0;
	--kendisco-blog-bg: #FFFFFF;

	width: 100%;

	margin: 0;

	padding: 0;

	background:
		var(--kendisco-blog-bg);

	color:
		var(--kendisco-blog-text);
}


.kendisco-blog-page *,
.kendisco-blog-page *::before,
.kendisco-blog-page *::after {
	box-sizing:
		border-box;
}


.kendisco-blog-width {
	width: 100%;

	max-width:
		var(--kendisco-blog-width);

	margin:
		0 auto;

	padding:
		0 24px;
}


/* =========================================================
   HERO
   ========================================================= */

.kendisco-blog-hero {
	width: 100%;

	margin: 0;

	padding: 0;

	background:
		var(--kendisco-blog-navy);

	border-top:
		3px solid
		var(--kendisco-blog-orange);
}


.kendisco-blog-hero-inner {
	display: flex;

	min-height:
		210px;

	flex-direction:
		column;

	align-items:
		center;

	justify-content:
		center;

	padding:
		36px 0;

	text-align:
		center;
}


.kendisco-blog-category-hero
.kendisco-blog-hero-inner {
	min-height:
		165px;
}


.kendisco-blog-hero h1 {
	margin:
		0 !important;

	padding:
		0 !important;

	color:
		#FFFFFF !important;

	font-family:
		inherit !important;

	font-size:
		42px !important;

	font-style:
		normal !important;

	font-weight:
		750 !important;

	line-height:
		1.15 !important;

	letter-spacing:
		-0.02em !important;
}


.kendisco-blog-hero-line {
	width:
		84px;

	height:
		4px;

	margin:
		22px auto 0;

	background:
		var(--kendisco-blog-orange);
}


.kendisco-blog-hero p {
	margin:
		34px 0 0 !important;

	padding:
		0 !important;

	color:
		#FFFFFF !important;

	font-family:
		inherit !important;

	font-size:
		14px !important;

	font-weight:
		400 !important;

	line-height:
		1.5 !important;
}


/* =========================================================
   MAIN LAYOUT
   ========================================================= */

.kendisco-blog-content-section {
	width: 100%;

	margin: 0;

	padding:
		58px 0
		62px;

	background:
		#FFFFFF;
}


.kendisco-blog-layout {
	display: grid;

	width: 100%;

	grid-template-columns:
		minmax(0, 1fr)
		320px;

	gap:
		40px;

	align-items:
		start;
}


.kendisco-blog-list-column,
.kendisco-blog-grid-column {
	min-width: 0;
}


/* =========================================================
   BLOG LIST
   ========================================================= */

.kendisco-blog-list {
	display: flex;

	width: 100%;

	flex-direction:
		column;

	gap:
		27px;
}


.kendisco-blog-list-card {
	display: grid;

	width: 100%;

	grid-template-columns:
		270px
		minmax(0, 1fr);

	gap:
		30px;

	align-items:
		center;

	margin: 0;

	padding:
		0 0 3px;

	background:
		#FFFFFF;
}


.kendisco-blog-list-image {
	display: flex;

	width: 100%;

	aspect-ratio:
		4 / 3;

	align-items:
		center;

	justify-content:
		center;

	overflow:
		hidden;

	background:
		#F8FAFC;

	border-radius:
		6px;

	text-decoration:
		none;
}


.kendisco-blog-featured-image {
	display: block;

	width:
		100% !important;

	height:
		100% !important;

	max-width:
		100% !important;

	margin: 0 !important;

	object-fit:
		contain;

	object-position:
		center;
}


.kendisco-blog-image-placeholder {
	display: flex;

	width: 100%;

	height: 100%;

	align-items:
		center;

	justify-content:
		center;

	padding:
		20px;

	background:
		linear-gradient(
			135deg,
			#0F172A,
			#1E293B
		);

	color:
		#FFFFFF;

	font-size:
		14px;

	font-weight:
		700;

	text-align:
		center;
}


.kendisco-blog-list-copy {
	min-width: 0;
}


.kendisco-blog-list-copy h2 {
	margin:
		0 0 17px !important;

	padding:
		0 !important;

	color:
		var(--kendisco-blog-text) !important;

	font-family:
		inherit !important;

	font-size:
		24px !important;

	font-style:
		normal !important;

	font-weight:
		700 !important;

	line-height:
		1.22 !important;

	letter-spacing:
		-0.01em !important;
}


.kendisco-blog-list-copy h2 a,
.kendisco-blog-list-copy h2 a:link,
.kendisco-blog-list-copy h2 a:visited {
	color:
		var(--kendisco-blog-text) !important;

	text-decoration:
		none !important;
}


.kendisco-blog-list-copy h2 a:hover,
.kendisco-blog-list-copy h2 a:focus {
	color:
		var(--kendisco-blog-orange) !important;
}


/* =========================================================
   EXCERPTS
   ========================================================= */

.kendisco-blog-excerpt {
	margin:
		0 0 18px !important;

	padding:
		0 !important;

	color:
		#374151 !important;

	font-family:
		inherit !important;

	font-size:
		14px !important;

	font-weight:
		400 !important;

	line-height:
		1.62 !important;
}


/* =========================================================
   READ MORE
   ========================================================= */

.kendisco-blog-read-more,
.kendisco-blog-read-more:link,
.kendisco-blog-read-more:visited,
.kendisco-blog-read-more:hover,
.kendisco-blog-read-more:focus,
.kendisco-blog-read-more:active {
	display: inline-flex;

	min-height:
		43px;

	align-items:
		center;

	justify-content:
		center;

	gap:
		5px;

	padding:
		0 20px;

	background:
		var(--kendisco-blog-orange);

	border:
		1px solid
		var(--kendisco-blog-orange);

	border-radius:
		999px;

	color:
		#FFFFFF !important;

	font-family:
		inherit !important;

	font-size:
		13px !important;

	font-weight:
		650 !important;

	line-height:
		1 !important;

	text-decoration:
		none !important;

	transform:
		none !important;

	transition:
		background-color 0.15s ease,
		border-color 0.15s ease,
		color 0.15s ease;
}


.kendisco-blog-read-more:hover,
.kendisco-blog-read-more:focus {
	background:
		var(--kendisco-blog-navy);

	border-color:
		var(--kendisco-blog-navy);

	color:
		#FFFFFF !important;
}


/* =========================================================
   CATEGORY SIDEBAR
   ========================================================= */

.kendisco-blog-sidebar {
	position:
		sticky;

	top:
		18px;

	width:
		100%;

	margin: 0;

	padding:
		31px 24px
		26px;

	background:
		#08224D;

	border-radius:
		6px;

	color:
		#FFFFFF;
}


.kendisco-blog-sidebar-title {
	margin:
		0 !important;

	padding:
		0 !important;

	color:
		#FFFFFF !important;

	font-family:
		inherit !important;

	font-size:
		19px !important;

	font-style:
		normal !important;

	font-weight:
		750 !important;

	line-height:
		1.25 !important;

	letter-spacing:
		0 !important;

	text-transform:
		uppercase;
}


.kendisco-blog-sidebar-line {
	width:
		48px;

	height:
		3px;

	margin:
		8px 0 11px;

	background:
		var(--kendisco-blog-orange);
}


.kendisco-blog-category-nav {
	display: flex;

	width: 100%;

	flex-direction:
		column;
}


.kendisco-blog-category-nav a,
.kendisco-blog-category-nav a:link,
.kendisco-blog-category-nav a:visited,
.kendisco-blog-category-nav a:hover,
.kendisco-blog-category-nav a:focus,
.kendisco-blog-category-nav a:active {
	display: flex;

	min-height:
		51px;

	align-items:
		center;

	width:
		100%;

	padding:
		10px 0;

	border-bottom:
		1px solid
		rgba(255,255,255,0.16);

	color:
		#FFFFFF !important;

	font-family:
		inherit !important;

	font-size:
		13px !important;

	font-weight:
		500 !important;

	line-height:
		1.35 !important;

	text-decoration:
		none !important;

	transform:
		none !important;

	transition:
		color 0.15s ease;
}


.kendisco-blog-category-nav a:last-child {
	border-bottom:
		0;
}


.kendisco-blog-category-nav a:hover,
.kendisco-blog-category-nav a:focus,
.kendisco-blog-category-nav a.is-current {
	color:
		var(--kendisco-blog-orange) !important;
}


/* =========================================================
   CATEGORY PAGE GRID
   ========================================================= */

.kendisco-blog-post-grid {
	display: grid;

	width: 100%;

	grid-template-columns:
		repeat(
			3,
			minmax(0, 1fr)
		);

	gap:
		28px;

	align-items:
		stretch;
}


.kendisco-blog-grid-card {
	display: flex;

	min-width: 0;

	flex-direction:
		column;

	margin: 0;

	overflow:
		hidden;

	background:
		#FFFFFF;

	border:
		1px solid
		var(--kendisco-blog-border);

	border-radius:
		6px;

	box-shadow:
		0 5px 18px
		rgba(15,23,42,0.07);
}


.kendisco-blog-grid-image {
	position: relative;

	display: flex;

	width: 100%;

	aspect-ratio:
		4 / 2.7;

	align-items:
		center;

	justify-content:
		center;

	overflow:
		hidden;

	background:
		#F8FAFC;

	text-decoration:
		none;
}


.kendisco-blog-category-badge {
	position:
		absolute;

	top:
		16px;

	right:
		16px;

	display:
		inline-flex;

	max-width:
		calc(100% - 32px);

	min-height:
		29px;

	align-items:
		center;

	justify-content:
		center;

	padding:
		5px 15px;

	background:
		var(--kendisco-blog-orange);

	border-radius:
		999px;

	color:
		#FFFFFF;

	font-size:
		10px;

	font-weight:
		700;

	line-height:
		1.2;

	text-align:
		center;

	text-transform:
		uppercase;
}


.kendisco-blog-grid-copy {
	display: flex;

	flex:
		1 1 auto;

	flex-direction:
		column;

	padding:
		28px 26px
		24px;
}


.kendisco-blog-grid-copy h2 {
	margin:
		0 0 23px !important;

	padding:
		0 !important;

	color:
		var(--kendisco-blog-navy) !important;

	font-family:
		inherit !important;

	font-size:
		22px !important;

	font-style:
		normal !important;

	font-weight:
		750 !important;

	line-height:
		1.2 !important;

	letter-spacing:
		-0.01em !important;
}


.kendisco-blog-grid-copy h2 a,
.kendisco-blog-grid-copy h2 a:link,
.kendisco-blog-grid-copy h2 a:visited {
	color:
		var(--kendisco-blog-navy) !important;

	text-decoration:
		none !important;
}


.kendisco-blog-grid-copy h2 a:hover,
.kendisco-blog-grid-copy h2 a:focus {
	color:
		var(--kendisco-blog-orange) !important;
}


.kendisco-blog-grid-copy
.kendisco-blog-excerpt {
	margin-bottom:
		24px !important;

	color:
		#6B7280 !important;
}


.kendisco-blog-grid-copy
.kendisco-blog-read-more {
	margin-top:
		auto;

	align-self:
		flex-start;
}


.kendisco-blog-grid-footer {
	padding:
		15px 26px;

	border-top:
		1px solid
		#EEF2F7;

	color:
		#9CA3AF;

	font-size:
		11px;

	line-height:
		1.4;
}


/* =========================================================
   PAGINATION
   ========================================================= */

.kendisco-blog-pagination {
	display: flex;

	flex-wrap:
		wrap;

	align-items:
		center;

	justify-content:
		center;

	gap:
		7px;

	margin:
		36px 0 0;

	padding: 0;
}


.kendisco-blog-pagination
.page-numbers {
	display: inline-flex;

	min-width:
		34px;

	height:
		34px;

	align-items:
		center;

	justify-content:
		center;

	padding:
		0 8px;

	border:
		1px solid
		transparent;

	border-radius:
		4px;

	color:
		var(--kendisco-blog-navy) !important;

	font-size:
		13px;

	font-weight:
		600;

	line-height:
		1;

	text-decoration:
		none !important;
}


.kendisco-blog-pagination
.page-numbers.current {
	background:
		var(--kendisco-blog-orange);

	border-color:
		var(--kendisco-blog-orange);

	color:
		#FFFFFF !important;
}


.kendisco-blog-pagination
a.page-numbers:hover,
.kendisco-blog-pagination
a.page-numbers:focus {
	border-color:
		var(--kendisco-blog-orange);

	color:
		var(--kendisco-blog-orange) !important;
}


/* =========================================================
   EMPTY
   ========================================================= */

.kendisco-blog-empty {
	margin: 0 !important;

	padding:
		28px;

	background:
		#F8FAFC;

	border:
		1px solid
		var(--kendisco-blog-border);

	border-radius:
		6px;

	color:
		var(--kendisco-blog-muted) !important;

	font-size:
		14px !important;
}


/* =========================================================
   WIDESCREEN
   ========================================================= */

@media (min-width: 1600px) {

	.kendisco-blog-page {
		--kendisco-blog-width:
			1520px;
	}


	.kendisco-blog-layout {
		grid-template-columns:
			minmax(0, 1fr)
			340px;

		gap:
			46px;
	}


	.kendisco-blog-list-card {
		grid-template-columns:
			290px
			minmax(0, 1fr);
	}

}


/* =========================================================
   SMALL DESKTOP / TABLET
   ========================================================= */

@media (max-width: 1199px) {

	.kendisco-blog-layout {
		grid-template-columns:
			minmax(0, 1fr)
			270px;

		gap:
			28px;
	}


	.kendisco-blog-list-card {
		grid-template-columns:
			220px
			minmax(0, 1fr);

		gap:
			22px;
	}


	.kendisco-blog-list-copy h2 {
		font-size:
			20px !important;
	}


	.kendisco-blog-post-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);

		gap:
			20px;
	}


	.kendisco-blog-grid-copy {
		padding:
			23px 20px
			21px;
	}


	.kendisco-blog-grid-copy h2 {
		font-size:
			19px !important;
	}

}


/* =========================================================
   STACK SIDEBAR
   ========================================================= */

@media (max-width: 900px) {

	.kendisco-blog-layout {
		grid-template-columns:
			1fr;
	}


	.kendisco-blog-sidebar {
		position:
			static;

		order:
			-1;
	}


	.kendisco-blog-category-nav {
		display: grid;

		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);

		column-gap:
			22px;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.kendisco-blog-width {
		padding:
			0 15px;
	}


	.kendisco-blog-hero-inner {
		min-height:
			165px;

		padding:
			30px 0;
	}


	.kendisco-blog-category-hero
	.kendisco-blog-hero-inner {
		min-height:
			135px;
	}


	.kendisco-blog-hero h1 {
		font-size:
			30px !important;
	}


	.kendisco-blog-hero-line {
		width:
			62px;

		height:
			3px;

		margin-top:
			15px;
	}


	.kendisco-blog-hero p {
		margin-top:
			22px !important;

		font-size:
			12px !important;
	}


	.kendisco-blog-content-section {
		padding:
			30px 0
			40px;
	}


	.kendisco-blog-layout {
		gap:
			24px;
	}


	.kendisco-blog-sidebar {
		padding:
			23px 18px
			20px;
	}


	.kendisco-blog-category-nav {
		grid-template-columns:
			1fr;
	}


	.kendisco-blog-list {
		gap:
			22px;
	}


	.kendisco-blog-list-card {
		grid-template-columns:
			1fr;

		gap:
			15px;

		padding-bottom:
			18px;

		border-bottom:
			1px solid
			var(--kendisco-blog-border);
	}


	.kendisco-blog-list-image {
		aspect-ratio:
			16 / 10;
	}


	.kendisco-blog-list-copy h2 {
		margin-bottom:
			11px !important;

		font-size:
			20px !important;
	}


	.kendisco-blog-excerpt {
		margin-bottom:
			15px !important;

		font-size:
			13px !important;
	}


	.kendisco-blog-read-more,
	.kendisco-blog-read-more:link,
	.kendisco-blog-read-more:visited,
	.kendisco-blog-read-more:hover,
	.kendisco-blog-read-more:focus,
	.kendisco-blog-read-more:active {
		min-height:
			40px;

		padding:
			0 18px;

		font-size:
			12px !important;
	}


	.kendisco-blog-post-grid {
		grid-template-columns:
			1fr;

		gap:
			16px;
	}


	.kendisco-blog-grid-image {
		aspect-ratio:
			16 / 10;
	}


	.kendisco-blog-grid-copy {
		padding:
			21px 19px
			20px;
	}


	.kendisco-blog-grid-copy h2 {
		margin-bottom:
			14px !important;

		font-size:
			20px !important;
	}


	.kendisco-blog-grid-footer {
		padding:
			13px 19px;
	}


	.kendisco-blog-pagination {
		margin-top:
			28px;
	}

}