/**
 * Blog page (home.php — WordPress's real "posts page", all 1,000+ existing
 * posts). Structure (hero, sidebar filters, card grid, CTA banner) modeled
 * on a reference site the user liked; colors/fonts stay this site's own
 * navy/gold "cricket" system (--proace-* tokens from cricket-predictions.css,
 * redeclared here so this file has no load-order dependency on that one).
 * Only small uppercase labels/meta borrow the reference's monospace face.
 */

:root {
	--blog-navy-deep: #071427;
	--blog-navy: #0d2a4d;
	--blog-blue: #1e5087;
	--blog-blue-light: #3a86e0;
	--blog-accent: #ffb020;
	--blog-ice: #eaf4ff;
	--blog-ice-muted: rgba( 234, 244, 255, 0.62 );
	--blog-border: rgba( 255, 255, 255, 0.12 );
	--blog-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

.cricket-blog-page {
	position: relative;
	padding: 60px 0 90px;
	overflow: hidden;
	background:
		radial-gradient( 700px 460px at 10% -10%, rgba( 255, 176, 32, 0.14 ), transparent 60% ),
		radial-gradient( 750px 500px at 95% 5%, rgba( 58, 134, 224, 0.18 ), transparent 55% ),
		linear-gradient( 180deg, #0a1830 0%, #05121f 40%, #040b17 100% );
}

.cricket-blog-page__fx {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: hidden;
	z-index: 0;
}

.cricket-blog-page__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur( 10px );
	opacity: 0.5;
	animation: cricket-blog-orb-drift 24s ease-in-out infinite;
}

.cricket-blog-page__orb--a {
	top: -140px;
	left: -100px;
	width: 420px;
	height: 420px;
	background: radial-gradient( circle, rgba( 255, 176, 32, 0.2 ), transparent 70% );
}

.cricket-blog-page__orb--b {
	top: -80px;
	right: -120px;
	width: 460px;
	height: 460px;
	background: radial-gradient( circle, rgba( 58, 134, 224, 0.22 ), transparent 70% );
	animation-duration: 28s;
	animation-delay: -6s;
}

@keyframes cricket-blog-orb-drift {
	0%, 100% { transform: translate( 0, 0 ) scale( 1 ); }
	50% { transform: translate( 26px, 34px ) scale( 1.06 ); }
}

.cricket-blog-page__dots {
	position: absolute;
	inset: 0;
	opacity: 0.4;
	background-image: radial-gradient( circle, rgba( 255, 255, 255, 0.08 ) 1px, transparent 1px );
	background-size: 26px 26px;
}

@media ( prefers-reduced-motion: reduce ) {
	.cricket-blog-page__orb {
		animation: none !important;
	}
}

.cricket-blog-page .container {
	position: relative;
	z-index: 1;
}

/* -----------------------------------------------------------------------
 * Hero
 * --------------------------------------------------------------------- */

.cricket-blog-hero {
	text-align: center;
	max-width: 700px;
	margin: 0 auto 48px;
}

.cricket-blog-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var( --blog-mono );
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.35em;
	color: var( --blog-accent );
	margin-bottom: 18px;
}

.cricket-blog-hero__eyebrow::before,
.cricket-blog-hero__eyebrow::after {
	content: "";
	width: 28px;
	height: 1px;
	background: rgba( 255, 176, 32, 0.4 );
}

.cricket-blog-hero__title {
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 900;
	font-size: clamp( 38px, 5.5vw, 64px );
	color: var( --blog-ice );
	margin: 0 0 16px;
	letter-spacing: -0.01em;
}

.cricket-blog-hero__title span {
	background-image: linear-gradient( 100deg, #ffe066, var( --blog-accent ), #ff8a5c );
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.cricket-blog-hero__sub {
	font-size: 16px;
	color: var( --blog-ice-muted );
	line-height: 1.6;
	margin: 0;
}

/* -----------------------------------------------------------------------
 * Layout: sidebar + main
 * --------------------------------------------------------------------- */

.cricket-blog-layout {
	display: grid;
	grid-template-columns: 270px 1fr;
	gap: 30px;
	align-items: start;
}

.cricket-blog-sidebar__card {
	position: sticky;
	top: 24px;
	background: rgba( 255, 255, 255, 0.03 );
	border: 1px solid var( --blog-border );
	border-radius: 16px;
	padding: 22px 20px;
}

.cricket-blog-sidebar__title {
	display: flex;
	align-items: center;
	gap: 9px;
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 15px;
	color: var( --blog-ice );
	margin: 0 0 18px;
}

.cricket-blog-sidebar__title svg {
	color: var( --blog-accent );
}

.cricket-blog-sidebar__search {
	display: flex;
	align-items: center;
	gap: 8px;
	background: rgba( 255, 255, 255, 0.04 );
	border: 1px solid var( --blog-border );
	border-radius: 999px;
	padding: 9px 14px;
	margin-bottom: 22px;
}

.cricket-blog-sidebar__search input {
	flex: 1;
	border: none;
	background: none;
	outline: none;
	color: var( --blog-ice );
	font-size: 12.5px;
	font-family: 'PT Sans', sans-serif;
	min-width: 0;
}

.cricket-blog-sidebar__search input::placeholder {
	color: var( --blog-ice-muted );
}

.cricket-blog-sidebar__search button {
	background: none;
	border: none;
	padding: 0;
	color: var( --blog-ice-muted );
	display: flex;
	cursor: pointer;
}

.cricket-blog-sidebar__label {
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var( --blog-ice-muted );
	margin: 0 0 10px;
}

.cricket-blog-sidebar__list {
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
}

.cricket-blog-sidebar__list li + li {
	margin-top: 2px;
}

.cricket-blog-sidebar__list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var( --blog-ice-muted );
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.cricket-blog-sidebar__list a:hover {
	background: rgba( 255, 255, 255, 0.05 );
	color: var( --blog-ice );
}

.cricket-blog-sidebar__list a.active {
	background: rgba( 255, 176, 32, 0.12 );
	color: var( --blog-accent );
	font-weight: 800;
}

.cricket-blog-sidebar__list a span {
	font-family: var( --blog-mono );
	font-size: 10.5px;
	opacity: 0.7;
}

.cricket-blog-sidebar__dot {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	margin-right: 2px;
	flex: 0 0 auto;
}

.cricket-blog-sidebar__list li[data-extra],
.cricket-blog-sidebar__tags a[data-extra] {
	display: none;
}

.cricket-blog-sidebar__list.is-expanded li[data-extra] {
	display: block;
}

.cricket-blog-sidebar__tags.is-expanded a[data-extra] {
	display: inline-flex;
}

.cricket-blog-sidebar__more {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	margin: -8px 0 22px;
	padding: 8px;
	border: 1px dashed var( --blog-border );
	border-radius: 10px;
	background: none;
	color: var( --blog-ice-muted );
	font-family: var( --blog-mono );
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.cricket-blog-sidebar__more:hover {
	border-color: var( --blog-accent );
	color: var( --blog-accent );
}

.cricket-blog-sidebar__more svg {
	transition: transform 0.2s ease;
}

.cricket-blog-sidebar__more[aria-expanded="true"] svg {
	transform: rotate( 180deg );
}

.cricket-blog-sidebar__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 7px;
	margin-bottom: 12px;
}

.cricket-blog-sidebar__tags a {
	font-family: var( --blog-mono );
	font-weight: 600;
	color: var( --blog-ice-muted );
	background: rgba( 255, 255, 255, 0.04 );
	border: 1px solid var( --blog-border );
	border-radius: 999px;
	padding: 5px 10px;
	text-decoration: none;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.cricket-blog-sidebar__tags a:hover {
	border-color: var( --blog-accent );
	color: var( --blog-accent );
}

.cricket-blog-sidebar__tags + .cricket-blog-sidebar__more {
	margin-top: -4px;
	margin-bottom: 0;
}

/* -----------------------------------------------------------------------
 * Main column
 * --------------------------------------------------------------------- */

.cricket-blog-main__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}

.cricket-blog-main__head h2 {
	display: flex;
	align-items: center;
	gap: 9px;
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 21px;
	color: var( --blog-ice );
	margin: 0;
}

.cricket-blog-main__head h2 svg {
	color: var( --blog-accent );
}

.cricket-blog-main__head span {
	font-family: var( --blog-mono );
	font-size: 11.5px;
	color: var( --blog-ice-muted );
}

.cricket-blog-empty {
	color: var( --blog-ice-muted );
	font-size: 14px;
	padding: 30px 0;
}

/* Featured card */

.cricket-blog-featured {
	position: relative;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	background: rgba( 255, 255, 255, 0.03 );
	border: 1px solid var( --blog-border );
	border-radius: 18px;
	overflow: hidden;
	margin-bottom: 26px;
	text-decoration: none;
	transition: border-color 0.2s ease, transform 0.2s ease;
}

.cricket-blog-featured:hover {
	border-color: rgba( 255, 176, 32, 0.4 );
	transform: translateY( -2px );
	/* The parent theme's generic a:hover rule (specificity 0,1,1) otherwise
	   beats this card's own text-decoration:none (0,1,0) on hover, since
	   .selector:hover (0,2,0) is what's needed to win outright. */
	text-decoration: none;
}

.cricket-blog-featured__img {
	position: relative;
	min-height: 280px;
	background-size: cover;
	background-position: center;
}

.cricket-blog-featured__badge {
	position: absolute;
	top: 18px;
	left: 18px;
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #fff;
	background: rgba( 76, 29, 149, 0.75 );
	backdrop-filter: blur( 4px );
	padding: 5px 12px;
	border-radius: 999px;
}

.cricket-blog-featured__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 30px 32px;
	gap: 12px;
}

.cricket-blog-featured__meta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var( --blog-mono );
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var( --blog-ice-muted );
}

.cricket-blog-featured__meta .dot {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var( --blog-ice-muted );
}

.cricket-blog-featured__title {
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: clamp( 20px, 2.4vw, 27px );
	line-height: 1.25;
	color: var( --blog-ice );
}

.cricket-blog-featured__excerpt {
	font-size: 14px;
	color: var( --blog-ice-muted );
	line-height: 1.6;
}

.cricket-blog-featured__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 10px;
	padding-top: 16px;
	border-top: 1px solid var( --blog-border );
}

.cricket-blog-featured__author {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	font-weight: 700;
	color: var( --blog-ice-muted );
}

.cricket-blog-featured__read {
	display: flex;
	align-items: center;
	gap: 6px;
	font-family: var( --blog-mono );
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var( --blog-accent );
}

/* Card grid */

.cricket-blog-grid {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 22px;
}

.cricket-blog-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: rgba( 255, 255, 255, 0.03 );
	border: 1px solid var( --blog-border );
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	isolation: isolate;
	transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.cricket-blog-card:hover {
	border-color: rgba( 255, 176, 32, 0.4 );
	transform: translateY( -3px );
	box-shadow: 0 16px 34px rgba( 0, 0, 0, 0.35 );
	/* See the matching note on .cricket-blog-featured:hover above. */
	text-decoration: none;
}

/* Diagonal light-sheen sweep on hover — same technique as the podium/feed
   glass cards elsewhere in this project, here as a one-shot hover sweep
   rather than a static highlight. */
.cricket-blog-card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient( 115deg, transparent 40%, rgba( 255, 255, 255, 0.12 ) 50%, transparent 60% );
	background-size: 250% 250%;
	background-position: 120% -20%;
	opacity: 0;
	transition: background-position 0.7s ease, opacity 0.15s ease;
}

.cricket-blog-card:hover::after {
	opacity: 1;
	background-position: -20% 120%;
}

/* Scroll-reveal entrance (cricket-blog.js toggles .is-visible via
   IntersectionObserver; reduced-motion marks everything visible
   immediately without observing — see the JS and the block below). */
.cricket-blog-card[data-reveal] {
	opacity: 0;
	translate: 0 22px;
	transition: opacity 0.5s ease, translate 0.5s cubic-bezier( 0.16, 1, 0.3, 1 );
}

.cricket-blog-card[data-reveal].is-visible {
	opacity: 1;
	translate: 0 0;
}

.cricket-blog-card__img-wrap {
	position: relative;
	display: block;
	height: 170px;
	overflow: hidden;
}

.cricket-blog-card__img {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 0.5s ease;
}

.cricket-blog-card:hover .cricket-blog-card__img {
	transform: scale( 1.07 );
}

/* Wide — a full-width horizontal spotlight, occasional bento rhythm break. */
.cricket-blog-card--wide {
	grid-column: 1 / -1;
	flex-direction: row;
}

.cricket-blog-card--wide .cricket-blog-card__img-wrap {
	width: 40%;
	flex: 0 0 40%;
	height: auto;
}

.cricket-blog-card--wide .cricket-blog-card__body {
	justify-content: center;
}

.cricket-blog-card--wide .cricket-blog-card__title {
	font-size: 19px;
}

/* Compact — denser, text-forward, no excerpt. Grid items stretch to match
   the tallest card in their row by default; without an excerpt (the only
   flex:1 filler in __body) that stretched height became a dead gap inside
   the card instead of just spacing. align-self:start keeps this card at
   its own natural height — any leftover row space is blank grid gutter
   below it, not empty space burned inside its own bordered box. */
.cricket-blog-card--compact {
	align-self: start;
}

.cricket-blog-card--compact .cricket-blog-card__img-wrap {
	height: 110px;
}

.cricket-blog-card--compact .cricket-blog-card__excerpt {
	display: none;
}

.cricket-blog-card--compact .cricket-blog-card__body {
	padding: 14px 16px 16px;
	gap: 6px;
}

.cricket-blog-card--compact .cricket-blog-card__title {
	font-size: 14px;
}

.cricket-blog-card__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	font-family: var( --blog-mono );
	font-size: 9.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #fff;
	background: rgba( 30, 80, 135, 0.8 );
	backdrop-filter: blur( 4px );
	padding: 4px 10px;
	border-radius: 999px;
}

.cricket-blog-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 18px 20px 20px;
	flex: 1;
}

.cricket-blog-card__meta {
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var( --blog-ice-muted );
}

.cricket-blog-card__title {
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 700;
	font-size: 15.5px;
	line-height: 1.35;
	color: var( --blog-ice );
}

.cricket-blog-card__excerpt {
	font-size: 12.5px;
	color: var( --blog-ice-muted );
	line-height: 1.55;
	flex: 1;
}

.cricket-blog-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 6px;
	padding-top: 12px;
	border-top: 1px solid var( --blog-border );
}

.cricket-blog-card__author {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 11.5px;
	font-weight: 700;
	color: var( --blog-ice-muted );
}

.cricket-blog-card__read {
	display: flex;
	align-items: center;
	gap: 5px;
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	color: var( --blog-accent );
}

/* Pagination */

.cricket-blog-pagination {
	margin-top: 34px;
}

.cricket-blog-pagination .page-numbers {
	display: inline-flex;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
}

.cricket-blog-pagination .page-numbers li {
	display: inline-flex;
}

.cricket-blog-pagination a.page-numbers,
.cricket-blog-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border-radius: 10px;
	border: 1px solid var( --blog-border );
	background: rgba( 255, 255, 255, 0.03 );
	color: var( --blog-ice-muted );
	font-family: var( --blog-mono );
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none;
}

.cricket-blog-pagination a.page-numbers:hover {
	border-color: var( --blog-accent );
	color: var( --blog-accent );
}

.cricket-blog-pagination span.page-numbers.current {
	background: linear-gradient( 90deg, var( --blog-blue ), var( --blog-blue-light ) );
	border-color: transparent;
	color: #fff;
}

/* CTA banner */

.cricket-blog-cta {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 48px;
	padding: 26px 30px;
	border-radius: 18px;
	background: linear-gradient( 100deg, rgba( 79, 209, 139, 0.14 ), rgba( 10, 30, 56, 0.4 ) );
	border: 1px solid rgba( 79, 209, 139, 0.25 );
}

.cricket-blog-cta__icon {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba( 79, 209, 139, 0.16 );
	color: #4fd18b;
}

.cricket-blog-cta__body {
	flex: 1;
	min-width: 220px;
}

.cricket-blog-cta__body h3 {
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 17px;
	color: var( --blog-ice );
	margin: 0 0 4px;
}

.cricket-blog-cta__body p {
	font-size: 13px;
	color: var( --blog-ice-muted );
	margin: 0;
}

.cricket-blog-cta__btn {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	padding: 11px 20px;
	border-radius: 999px;
	background: linear-gradient( 90deg, #4fd18b, #2c9e63 );
	color: #06170f;
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-weight: 800;
	font-size: 13px;
	text-decoration: none;
}

.cricket-blog-cta__btn--ghost {
	background: none;
	border: 1px solid var( --blog-border );
	color: var( --blog-ice );
}

/* -----------------------------------------------------------------------
 * Mobile
 * --------------------------------------------------------------------- */

@media ( max-width: 900px ) {
	.cricket-blog-layout {
		grid-template-columns: 1fr;
	}

	.cricket-blog-sidebar__card {
		position: static;
	}

	.cricket-blog-featured {
		grid-template-columns: 1fr;
	}

	.cricket-blog-featured__img {
		min-height: 200px;
	}

	.cricket-blog-grid {
		grid-template-columns: 1fr;
	}
}

@media ( max-width: 640px ) {
	.cricket-blog-card--wide {
		flex-direction: column;
	}

	.cricket-blog-card--wide .cricket-blog-card__img-wrap {
		width: auto;
		flex: none;
		height: 170px;
	}
}

@media ( max-width: 480px ) {
	.cricket-blog-hero__eyebrow::before,
	.cricket-blog-hero__eyebrow::after {
		width: 16px;
	}

	.cricket-blog-cta {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.cricket-blog-card[data-reveal] {
		opacity: 1;
		translate: 0 0;
		transition: none;
	}

	.cricket-blog-card::after {
		transition: none;
	}

	.cricket-blog-card:hover .cricket-blog-card__img {
		transform: none;
	}
}

/* =======================================================================
 * Category / tag archives + search results (2026-09-16) — same layout as
 * the Blog page, rendered through psp_cricket_blog_page() from archive.php
 * and search.php.
 * ===================================================================== */

.cricket-blog-sidebar {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

/* "Now browsing" context card — scrolls away normally; only the Refine
   Search card below it stays sticky, so the two never overlap. */
.cricket-blog-sidebar__card--now {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 4px;
	overflow: hidden;
	background:
		radial-gradient( circle at 100% 0%, rgba( 255, 176, 32, 0.24 ), transparent 55% ),
		linear-gradient( 135deg, #1c3f74 0%, #122c56 45%, #0a1830 100% );
	border-color: rgba( 255, 255, 255, 0.16 );
}

.cricket-blog-sidebar .cricket-blog-sidebar__card--now {
	position: relative;
	top: auto;
}

.cricket-blog-sidebar__now-label {
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --blog-accent );
}

.cricket-blog-sidebar__now-name {
	font-family: 'Outfit', 'PT Sans', sans-serif;
	font-size: 20px;
	font-weight: 800;
	line-height: 1.2;
	color: var( --blog-ice );
	overflow-wrap: anywhere;
}

.cricket-blog-sidebar__now-count {
	font-family: var( --blog-mono );
	font-size: 11px;
	color: var( --blog-ice-muted );
}

.cricket-blog-sidebar__now-clear,
.cricket-blog-sidebar__now-clear:visited {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	align-self: flex-start;
	margin-top: 10px;
	min-height: 34px;
	padding: 0 12px;
	border-radius: 999px;
	background: rgba( 255, 255, 255, 0.08 );
	border: 1px solid rgba( 255, 255, 255, 0.2 );
	font-size: 12.5px;
	font-weight: 700;
	color: var( --blog-ice );
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.cricket-blog-sidebar__now-clear:hover,
.cricket-blog-sidebar__now-clear:focus-visible {
	background: rgba( 255, 255, 255, 0.16 );
	border-color: rgba( 255, 176, 32, 0.5 );
	color: #ffffff;
}

/* Active tag in the cloud (the tag archive being viewed). */
.cricket-blog-sidebar__tags a.active,
.cricket-blog-sidebar__tags a.active:visited {
	color: #1a1200;
	background: var( --blog-accent );
	border-color: var( --blog-accent );
	font-weight: 700;
}

.cricket-blog-sidebar__list a:visited {
	color: var( --blog-ice-muted );
}

.cricket-blog-sidebar__list a.active,
.cricket-blog-sidebar__list a.active:visited {
	color: var( --blog-accent );
}

/* Hero — term chips + search field */
.cricket-blog-hero__hash {
	margin-right: 2px;
	-webkit-text-fill-color: rgba( 255, 176, 32, 0.55 ) !important;
	color: rgba( 255, 176, 32, 0.55 );
	background: none !important;
}

.cricket-blog-page--archive .cricket-blog-hero__title,
.cricket-blog-page--search .cricket-blog-hero__title {
	font-size: clamp( 32px, 4.8vw, 54px );
	text-wrap: balance;
	overflow-wrap: anywhere;
}

.cricket-blog-hero__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 20px;
}

.cricket-blog-hero__chip,
.cricket-blog-hero__chip:visited {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 0 14px;
	border-radius: 999px;
	font-family: var( --blog-mono );
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --blog-ice );
	background: rgba( 255, 255, 255, 0.06 );
	border: 1px solid var( --blog-border );
	text-decoration: none;
}

.cricket-blog-hero__chip--link:hover,
.cricket-blog-hero__chip--link:focus-visible {
	color: #1a1200;
	background: var( --blog-accent );
	border-color: var( --blog-accent );
}

.cricket-blog-hero__search {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 560px;
	margin: 22px auto 0;
	padding: 6px 6px 6px 20px;
	border-radius: 999px;
	background: rgba( 255, 255, 255, 0.06 );
	border: 1px solid rgba( 255, 255, 255, 0.18 );
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.cricket-blog-hero__search:focus-within {
	border-color: var( --blog-accent );
	box-shadow: 0 0 0 4px rgba( 255, 176, 32, 0.18 );
}

.cricket-blog-hero__search input {
	flex: 1;
	min-width: 0;
	border: 0;
	background: none;
	outline: none;
	color: var( --blog-ice );
	font-size: 16px;
	font-family: inherit;
}

.cricket-blog-hero__search input::placeholder {
	color: var( --blog-ice-muted );
}

.cricket-blog-hero__search button {
	flex: none;
	min-height: 44px;
	padding: 0 22px;
	border: 0;
	border-radius: 999px;
	background: linear-gradient( 90deg, #ffb020, #ff6b6b );
	color: #1a1200;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.cricket-blog-empty {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: 30px 24px;
	border-radius: 16px;
	border: 1px dashed var( --blog-border );
	background: rgba( 255, 255, 255, 0.02 );
}

.cricket-blog-empty p {
	margin: 0;
	font-size: 15px;
	color: var( --blog-ice-muted );
}

@media ( max-width: 900px ) {
	.cricket-blog-sidebar__card--now {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: baseline;
		column-gap: 12px;
	}

	.cricket-blog-sidebar__now-label {
		flex-basis: 100%;
	}

	.cricket-blog-sidebar__now-clear {
		margin-top: 6px;
		margin-left: auto;
	}
}

@media ( max-width: 480px ) {
	.cricket-blog-hero__search {
		padding-left: 16px;
	}

	.cricket-blog-hero__search button {
		padding: 0 16px;
	}
}

/* Category rows: the link spreads dot · name · count with space-between,
   which centred every category name between the dot and the count. Keep
   the name left-aligned next to its dot and push the count to the edge. */
.cricket-blog-sidebar__list a {
	justify-content: flex-start;
	gap: 8px;
	text-align: left;
}

.cricket-blog-sidebar__list a > span:last-child:not( .cricket-blog-sidebar__dot ) {
	margin-left: auto;
	padding-left: 8px;
}

/* Phones/tablets: stories first, filters after — someone who just tapped a
   category or tag shouldn't have to scroll past the whole filter list to
   reach the posts. The hero above already names what's being browsed. */
@media ( max-width: 900px ) {
	.cricket-blog-main {
		order: 1;
	}

	.cricket-blog-sidebar {
		order: 2;
	}
}

/* ---------------------------------------------------------------------
 * 2026-09-17 — search facets, result count, highlights, no-results
 * suggestions, author hero, load more.
 * ------------------------------------------------------------------- */

.cricket-blog-hero__sub--count {
	margin-top: 14px;
	font-family: var( --blog-mono );
	font-size: 12px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.cricket-blog-hero__sub--count strong {
	color: var( --blog-accent );
}

.cricket-search-facets {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	max-width: 820px;
	margin: 18px auto 0;
}

.cricket-search-facets__label {
	font-family: var( --blog-mono );
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --blog-ice-muted );
}

.cricket-search-facets__chip,
.cricket-search-facets__chip:visited {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 34px;
	padding: 0 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	color: var( --blog-ice ) !important;
	text-decoration: none !important;
	background: rgba( 255, 255, 255, 0.05 );
	border: 1px solid var( --blog-border );
	transition: background 0.18s ease, border-color 0.18s ease;
}

.cricket-search-facets__chip span {
	min-width: 20px;
	padding: 2px 6px;
	border-radius: 999px;
	font-family: var( --blog-mono );
	font-size: 10px;
	text-align: center;
	background: rgba( 255, 255, 255, 0.08 );
	color: var( --blog-ice-muted );
}

.cricket-search-facets__chip:hover,
.cricket-search-facets__chip:focus-visible {
	border-color: color-mix( in srgb, var( --tone, #ffb020 ) 60%, transparent );
	background: color-mix( in srgb, var( --tone, #ffb020 ) 16%, transparent );
}

.cricket-search-facets__chip.is-active,
.cricket-search-facets__chip.is-active:visited {
	color: #1a1200 !important;
	background: var( --blog-accent );
	border-color: var( --blog-accent );
}

.cricket-search-facets__chip.is-active span {
	background: rgba( 0, 0, 0, 0.14 );
	color: #1a1200;
}

.cricket-blog-card__title mark {
	padding: 0 2px;
	border-radius: 3px;
	color: inherit;
	background: rgba( 255, 176, 32, 0.28 );
	box-shadow: inset 0 -2px 0 var( --blog-accent );
}

.cricket-blog-hero__author {
	display: flex;
	justify-content: center;
	margin: 6px 0 10px;
}

.cricket-blog-hero__author .psp-avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	box-shadow: 0 0 0 3px rgba( 255, 176, 32, 0.6 ), 0 10px 30px rgba( 0, 0, 0, 0.35 );
}

/* No-results suggestions */
.cricket-search-suggest {
	display: grid;
	gap: 22px;
	margin-top: 22px;
}

.cricket-search-suggest__title {
	margin: 0 0 12px;
	font-family: var( --blog-mono );
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --blog-accent );
}

.cricket-search-suggest__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cricket-search-suggest__chips a,
.cricket-search-suggest__chips a:visited {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 0 14px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	color: var( --blog-ice ) !important;
	text-decoration: none !important;
	background: rgba( 255, 255, 255, 0.05 );
	border: 1px solid var( --blog-border );
}

.cricket-search-suggest__chips a:hover,
.cricket-search-suggest__chips a:focus-visible {
	color: #1a1200 !important;
	background: var( --blog-accent );
	border-color: var( --blog-accent );
}

.cricket-search-suggest__list {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 10px;
}

.cricket-search-suggest__item,
.cricket-search-suggest__item:visited {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	padding: 10px;
	border-radius: 14px;
	text-decoration: none !important;
	background: rgba( 255, 255, 255, 0.04 );
	border: 1px solid var( --blog-border );
	transition: border-color 0.18s ease, transform 0.25s ease;
}

.cricket-search-suggest__item:hover,
.cricket-search-suggest__item:focus-visible {
	border-color: rgba( 255, 176, 32, 0.5 );
	transform: translateY( -2px );
}

.cricket-search-suggest__img {
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 10px;
	background-size: cover;
	background-position: center;
}

.cricket-search-suggest__text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.cricket-search-suggest__name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var( --blog-ice );
}

.cricket-search-suggest__date {
	font-family: var( --blog-mono );
	font-size: 10px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --blog-ice-muted );
}

/* Load more */
.cricket-blog-loadmore {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin: 30px 0 6px;
}

.cricket-blog-loadmore[hidden] {
	display: none;
}

.cricket-blog-loadmore__btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 48px;
	min-width: 220px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 700;
	color: #1a1200;
	background: linear-gradient( 90deg, #ffb020, #ff6b6b );
	box-shadow: 0 10px 30px rgba( 255, 140, 40, 0.25 );
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.cricket-blog-loadmore__btn:hover {
	transform: translateY( -2px );
	box-shadow: 0 14px 34px rgba( 255, 140, 40, 0.35 );
}

.cricket-blog-loadmore__btn:focus-visible {
	outline: 2px solid var( --blog-ice );
	outline-offset: 3px;
}

.cricket-blog-loadmore__btn[disabled] {
	cursor: progress;
	opacity: 0.75;
	transform: none;
}

.cricket-blog-loadmore__spinner {
	display: none;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid rgba( 26, 18, 0, 0.3 );
	border-top-color: #1a1200;
	animation: cricket-blog-spin 0.7s linear infinite;
}

.cricket-blog-loadmore.is-loading .cricket-blog-loadmore__spinner {
	display: inline-block;
}

.cricket-blog-loadmore__status {
	font-family: var( --blog-mono );
	font-size: 11px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --blog-ice-muted );
}

.cricket-blog-loadmore.is-error .cricket-blog-loadmore__status {
	color: #ff8a8a;
}

@keyframes cricket-blog-spin {
	to { transform: rotate( 360deg ); }
}

/* With JS load-more active, numbered pagination stays as a quieter
   secondary control. */
.has-loadmore .cricket-blog-pagination {
	margin-top: 14px;
	opacity: 0.8;
}

@media ( max-width: 640px ) {
	.cricket-search-suggest__list {
		grid-template-columns: 1fr;
	}

	.cricket-search-facets {
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		padding: 2px 2px 6px;
		scrollbar-width: none;
	}

	.cricket-search-facets::-webkit-scrollbar {
		display: none;
	}

	.cricket-search-facets > * {
		flex: none;
		white-space: nowrap;
	}

	.cricket-blog-loadmore__btn {
		width: 100%;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.cricket-blog-loadmore__spinner {
		animation-duration: 2s;
	}

	.cricket-blog-loadmore__btn:hover,
	.cricket-search-suggest__item:hover {
		transform: none;
	}
}