/* =============================================================================
 * LITSLINK BLOCKS — Reviews · 3 platforms (acf/ll-reviews-3platform)
 * Self-contained: block-scoped palette, literal font fallback. No global .block-head.
 * ========================================================================== */
.block-ll-reviews-3platform {
	--rev3-ink: #010005;
	--rev3-muted: #768297;
	--rev3-count: #374151;
	--rev3-bg: #f9fafb;
	--rev3-card-bg: #ffffff;
	--rev3-card-border: rgba(118, 130, 151, 0.2);
	--rev3-red: #ef4123;
	--rev3-amber: #f59e0b;
	--rev3-blue: #1c6bde;
	font-family: var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	background: var(--rev3-bg);
	padding: 80px 0;
	box-sizing: border-box;
}
.block-ll-reviews-3platform *,
.block-ll-reviews-3platform *::before,
.block-ll-reviews-3platform *::after { box-sizing: border-box; }

.block-ll-reviews-3platform__inner {
	max-width: 1300px;
	margin: 0 auto;
	padding: 0 70px;
}

/* Header */
.block-ll-reviews-3platform__head { text-align: center; margin: 0 auto 48px; max-width: 820px; }
.block-ll-reviews-3platform__eyebrow {
	margin: 0 0 12px;
	font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	color: var(--rev3-muted);
}
.block-ll-reviews-3platform__title {
	margin: 0; font-size: 40px; line-height: 1.2; font-weight: 700; color: var(--rev3-ink);
}
.block-ll-reviews-3platform__subtitle {
	margin: 16px auto 0; max-width: 760px; font-size: 17px; line-height: 1.6; color: #505967;
}

/* Grid — centered flex so 1–2 cards center as a group; 3 fill the row 1:1 with the old grid */
.block-ll-reviews-3platform__grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
}

/* Card */
.block-ll-reviews-3platform__card {
	flex: 0 0 calc((100% - 40px) / 3);
	max-width: calc((100% - 40px) / 3);
	display: flex;
	flex-direction: column;
	gap: 16px;
	background: var(--rev3-card-bg);
	border: 1px solid var(--rev3-card-border);
	border-radius: 16px;
	padding: 24px;
}
.block-ll-reviews-3platform__card-head { display: flex; gap: 12px; align-items: center; }
.block-ll-reviews-3platform__ident { display: flex; flex-direction: column; }
.block-ll-reviews-3platform__logo {
	flex: 0 0 28px;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font: 700 14px/1 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
}
.block-ll-reviews-3platform__logo svg { display: block; }
.block-ll-reviews-3platform__logo--clutch { background: var(--rev3-red); }
.block-ll-reviews-3platform__logo--goodfirms { background: var(--rev3-amber); }
.block-ll-reviews-3platform__logo--behance { background: var(--rev3-blue); font-size: 11px; }
.block-ll-reviews-3platform__name {
	font: 600 16px/1.5 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	color: var(--rev3-ink);
}
.block-ll-reviews-3platform__platform {
	font: 400 14px/1.45 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	color: var(--rev3-muted);
}

/* Rating */
.block-ll-reviews-3platform__rating { display: flex; flex-direction: column; gap: 10px; }
.block-ll-reviews-3platform__score {
	margin: 0;
	font: 700 44px/1 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
}
.block-ll-reviews-3platform__score--clutch { color: var(--rev3-red); }
.block-ll-reviews-3platform__score--goodfirms { color: var(--rev3-amber); }
.block-ll-reviews-3platform__score--behance { color: var(--rev3-blue); font-size: 40px; }
.block-ll-reviews-3platform__stars { display: flex; gap: 4px; }
.block-ll-reviews-3platform__star { display: block; }
.block-ll-reviews-3platform__link {
	/* Plain text now (was the Behance "View Projects" link, which duplicated the
	   award-pill URL). Reset the <p> UA margin; soft grey, medium weight — not
	   the blue accent, not heavy/black, since it is no longer a link. */
	margin: 0;
	font: 500 16px/1.4 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	color: var(--rev3-count);
}

/* Bottom row: count (left) + award pill (right) */
.block-ll-reviews-3platform__foot {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.block-ll-reviews-3platform__count {
	margin: 0;
	font: 400 16px/1.4 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	color: var(--rev3-count);
}
.block-ll-reviews-3platform__pill {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	border: 1px solid transparent;
	border-radius: 999px;
	padding: 8px 16px;
	font: 600 14px/1 var(--ll-font, 'Montserrat', 'Montserrat-fallback', Arial, sans-serif);
	white-space: nowrap;
	text-decoration: none;
}
.block-ll-reviews-3platform__pill--clutch { color: #c2410c; background: #fff7ed; border-color: #fed7aa; }
.block-ll-reviews-3platform__pill--goodfirms { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.block-ll-reviews-3platform__pill--behance { color: var(--rev3-blue); background: #eff6ff; border-color: #bfdbfe; }

/* Opt-in: filled pill BUTTON per platform (Job Search mockup).
 * Scoped under the wrapper modifier so the default outlined badge above is
 * never touched on the pages already using this shared block. */
.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill {
	background: #ffffff;
	border-width: 1px;
	border-style: solid;
	padding: 12px 24px;
	font-size: 15px;
	font-weight: 700;
	transition: background-color .15s ease, color .15s ease;
}
.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--clutch { color: #ef4123; border-color: #ef4123; }
.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--goodfirms { color: #f5622d; border-color: #f5622d; }
.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--behance { color: #1690d3; border-color: #1690d3; }
/* Hover: fill with the platform colour, white text */
a.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--clutch:hover,
.block-ll-reviews-3platform--cta-button a.block-ll-reviews-3platform__pill--clutch:hover { background: #ef4123; color: #ffffff; }
a.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--goodfirms:hover,
.block-ll-reviews-3platform--cta-button a.block-ll-reviews-3platform__pill--goodfirms:hover { background: #f5622d; color: #ffffff; }
a.block-ll-reviews-3platform--cta-button .block-ll-reviews-3platform__pill--behance:hover,
.block-ll-reviews-3platform--cta-button a.block-ll-reviews-3platform__pill--behance:hover { background: #1690d3; color: #ffffff; }

/* Optional buttons row (opt-in; below the 3 platform cards, centered) */
.block-ll-reviews-3platform__buttons {
	margin-top: 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}
.block-ll-reviews-3platform__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-size: 15px; font-weight: 600; line-height: 1;
	padding: 15px 30px;
	border-radius: 999px;
	border: 1px solid transparent;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.block-ll-reviews-3platform__btn--primary {
	background: #1c6bde;
	color: #ffffff;
	border-color: #1c6bde;
}
.block-ll-reviews-3platform__btn--primary:hover { background: #1857b8; border-color: #1857b8; }
.block-ll-reviews-3platform__btn--outline {
	background: transparent;
	color: #1c6bde;
	border-color: #cfdaee;
}
.block-ll-reviews-3platform__btn--outline:hover { border-color: #1c6bde; background: rgba(28,107,222,.06); }

/* Optional CTA banner (opt-in footer; mirrors acf/ll-cta-bar-light) */
.block-ll-reviews-3platform__cta {
	margin-top: 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	background: #ffffff;
	border: 1px solid #ebedf0;
	border-radius: 20px;
	padding: 28px 40px;
}
.block-ll-reviews-3platform__cta-heading {
	margin: 0;
	font-size: 20px; line-height: 1.35; font-weight: 700; letter-spacing: -.2px;
	color: #10151c;
}
.block-ll-reviews-3platform__cta-subtext {
	margin: 8px 0 0;
	font-size: 15px; line-height: 1.5; font-weight: 400;
	color: #5a6472;
}
.block-ll-reviews-3platform__cta-btn {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #1690d3;
	color: #ffffff;
	text-decoration: none;
	font-size: 15px; font-weight: 600; line-height: 1;
	padding: 15px 28px;
	border-radius: 999px;
	transition: background-color .15s ease;
}
.block-ll-reviews-3platform__cta-btn:hover { background: #127bb4; }
.block-ll-reviews-3platform__cta-btn svg { display: block; }

/* Responsive */
@media (max-width: 1024px) {
	.block-ll-reviews-3platform { padding: 56px 0; }
	.block-ll-reviews-3platform__title { font-size: 30px; }
	.block-ll-reviews-3platform__card { flex-basis: 100%; max-width: 100%; }
}
@media (max-width: 782px) {
	.block-ll-reviews-3platform__cta { flex-direction: column; align-items: flex-start; padding: 24px; border-radius: 16px; }
	.block-ll-reviews-3platform__cta-heading { font-size: 18px; }
	.block-ll-reviews-3platform__cta-btn { width: 100%; justify-content: center; }
	.block-ll-reviews-3platform__buttons { flex-direction: column; }
	.block-ll-reviews-3platform__btn { width: 100%; }
}
@media (max-width: 767px) {
	/* Match library standard: 20px side gutters on mobile (desktop keeps its wide gutter). */
	.block-ll-reviews-3platform__inner { padding: 0 20px; }
	.block-ll-reviews-3platform { padding: 44px 0; }
	.block-ll-reviews-3platform__title { font-size: 24px; }
	.block-ll-reviews-3platform__subtitle { font-size: 15px; }
	.block-ll-reviews-3platform__score { font-size: 36px; }
}
