/* =========================================================
   KEN'S DISTRIBUTING — OPTIMIZED REVIEWS PAGE
   ========================================================= */

.kendisco-reviews-page {
	--kr-width: 1440px;
	--kr-navy: #0F172A;
	--kr-orange: #FF5F14;
	--kr-text: #1F2937;
	--kr-muted: #64748B;
	--kr-border: #E2E8F0;
	--kr-bg: #F8FAFC;

	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	background: var(--kr-bg);
	color: var(--kr-text);

	/*
	 * Explicit system fonts remove web-font dependency from the text
	 * Lighthouse is selecting as the LCP candidate.
	 */
	font-family: Arial, Helvetica, sans-serif;
}

.kendisco-reviews-page *,
.kendisco-reviews-page *::before,
.kendisco-reviews-page *::after {
	box-sizing: border-box;
}


/* =========================================================
   HERO
   ========================================================= */

.kendisco-reviews-hero {
	width: 100%;
	margin: 0;
	padding: 0;
	background: var(--kr-navy);
}

.kendisco-reviews-hero-inner {
	display: flex;
	width: 100%;
	max-width: var(--kr-width);
	min-height: 190px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	padding: 38px 24px;
	text-align: center;
}

.kendisco-reviews-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: 0 10px;

	margin: 0 !important;
	padding: 0 !important;

	color: #FFFFFF !important;
	font: 700 42px/1.1 Arial, Helvetica, sans-serif !important;
	letter-spacing: -0.02em !important;
	text-align: center;

	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
	transition: none !important;
}

.kendisco-reviews-title span,
.kendisco-reviews-title strong {
	font: inherit;
}

.kendisco-reviews-title strong {
	color: var(--kr-orange);
}

.kendisco-reviews-title-line {
	width: 82px;
	height: 4px;
	margin: 20px auto 0;
	background: var(--kr-orange);
}


/* =========================================================
   REVIEWS GRID
   ========================================================= */

.kendisco-reviews-section {
	width: 100%;
	margin: 0;
	padding: 48px 24px 58px;
	background: var(--kr-bg);
}

.kendisco-reviews-container {
	width: 100%;
	max-width: var(--kr-width);
	margin: 0 auto;
}

.kendisco-reviews-grid {
	display: grid;
	width: 100%;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	align-items: stretch;
}


/* =========================================================
   REVIEW CARD
   ========================================================= */

.kendisco-review-card {
	position: relative;
	display: flex;
	min-width: 0;
	min-height: 390px;
	flex-direction: column;

	margin: 0;
	padding: 68px 27px 26px;

	overflow: hidden;
	background: #FFFFFF;
	border: 1px solid var(--kr-border);
	border-radius: 6px;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.045);
	text-align: left;

	/*
	 * Isolate each review's layout/paint work from the rest of the
	 * large grid without size containment.
	 */
	contain: layout paint style;
}

/* Orange top rule. */
.kendisco-review-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--kr-orange);
}

/*
 * Decorative quote is now CSS instead of a real DOM node.
 * This removes one element from every review card.
 */
.kendisco-review-card::after {
	content: "“";
	position: absolute;
	top: 28px;
	left: 27px;

	height: 34px;
	color: var(--kr-orange);
	font: 700 54px/0.9 Georgia, "Times New Roman", serif;
	pointer-events: none;
}


/* =========================================================
   ABOVE-FOLD LCP CANDIDATES
   ========================================================= */

.kendisco-review-card-title,
.kendisco-review-card-text,
.kendisco-review-card-meta {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
	transition: none !important;
}

.kendisco-review-card-title {
	margin: 0 0 14px !important;
	padding: 0 !important;

	color: var(--kr-navy) !important;
	font: 700 19px/1.32 Arial, Helvetica, sans-serif !important;
	letter-spacing: 0 !important;
}

.kendisco-review-card-text {
	margin: 0 0 22px !important;
	padding: 0 !important;

	color: var(--kr-text) !important;
	font: 400 14px/1.68 Arial, Helvetica, sans-serif !important;
	letter-spacing: 0 !important;
}

.kendisco-review-card-meta {
	margin: auto 0 0 !important;
	padding: 16px 0 0 !important;

	border-top: 1px solid var(--kr-border);
	color: var(--kr-muted) !important;
	font: 600 12px/1.5 Arial, Helvetica, sans-serif !important;
	letter-spacing: 0 !important;
}


/* =========================================================
   BELOW-THE-FOLD RENDERING
   =========================================================
 *
 * The first six cards remain fully rendered because PageSpeed has
 * selected cards in that group as the LCP candidate.
 *
 * Starting at card 7, content-visibility lets Chromium skip the
 * layout/paint work for distant reviews until they approach the
 * viewport. The fallback intrinsic block size prevents the page from
 * collapsing while those cards are skipped.
 */

.kendisco-review-card:nth-child(n+7) {
	content-visibility: auto;
	contain-intrinsic-size: auto 390px;
}


/* =========================================================
   WIDESCREEN
   ========================================================= */

@media (min-width: 1600px) {

	.kendisco-reviews-page {
		--kr-width: 1520px;
	}

	.kendisco-reviews-grid {
		gap: 24px;
	}

	.kendisco-review-card {
		padding:
			70px 30px
			28px;
	}

	.kendisco-review-card::after {
		top: 30px;
		left: 30px;
	}

}


/* =========================================================
   TABLET / SMALL DESKTOP
   ========================================================= */

@media (max-width: 1100px) {

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

	.kendisco-reviews-title {
		font-size: 36px !important;
	}

}


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

@media (max-width: 767px) {

	.kendisco-reviews-hero-inner {
		min-height: 150px;
		padding: 30px 16px;
	}

	.kendisco-reviews-title {
		font-size: 30px !important;
	}

	.kendisco-reviews-title-line {
		width: 64px;
		height: 3px;
		margin-top: 15px;
	}

	.kendisco-reviews-section {
		padding: 28px 14px 36px;
	}

	.kendisco-reviews-grid {
		grid-template-columns: 1fr;
		gap: 15px;
	}

	.kendisco-review-card {
		min-height: 0;
		padding:
			59px 20px
			22px;
	}

	.kendisco-review-card::after {
		top: 23px;
		left: 20px;
		height: 30px;
		font-size: 48px;
	}

	.kendisco-review-card-title {
		font-size: 17px !important;
	}

	.kendisco-review-card-text {
		margin-bottom: 18px !important;
		font-size: 13px !important;
		line-height: 1.62 !important;
	}

	.kendisco-review-card-meta {
		font-size: 11px !important;
	}

	.kendisco-review-card:nth-child(n+7) {
		contain-intrinsic-size: auto 320px;
	}

}