/*
 * tpl-predictions.css: ported from the child's predictions-hub.css (A-60). Theme font tokens, sentence-case labels
 * (no uppercase), accessible muted grey, no parent page-title overrides. Enqueued only where used.
 */
/*
 * Predictions hub page styles.
 * Loaded only on page-templates/predictions-hub.php.
 */

.pred-hub-kicker {
	font-family: var(--ba-font-body);
	font-size: 12px;
	font-weight: 700;
	color: var(--ba-accent-text);
}

.pred-hub-title {
	font-family: var(--ba-font-head);
	font-size: clamp(24px, 3.2vw, 34px);
	line-height: 1.2;
	font-weight: 800;
	color: #202020;
	margin: 8px 0 16px;
}

.pred-hub-copy {
	font-family: var(--ba-font-body);
	font-size: 16px;
	line-height: 1.75;
	color: #49515e;
}

.pred-hub-copy--small {
	font-size: 14px;
}

.pred-hub-prose p {
	font-family: var(--ba-font-body);
	font-size: 16px;
	line-height: 1.75;
	color: #49515e;
	margin: 0 0 16px;
}

.pred-hub-prose p:last-child {
	margin-bottom: 0;
}

.pred-hub-prose strong {
	color: #202020;
}

.pred-hub-prose em {
	font-style: italic;
}

.pred-hub-prose a {
	color: var(--ba-accent-text);
	font-weight: 600;
	text-decoration: underline;
}

.pred-hub-prose ul,
.pred-hub-prose ol {
	margin: 0 0 16px;
	padding-left: 20px;
}

.pred-hub-prose li {
	font-family: var(--ba-font-body);
	font-size: 16px;
	line-height: 1.7;
	color: #49515e;
	margin-bottom: 6px;
}

.pred-hub-hero {
	background: linear-gradient(135deg, #f87830 0%, #f8a018 50%, #e85090 100%);
	padding: 52px 0 42px;
}

.pred-hub-hero__title {
	font-family: var(--ba-font-head);
	font-size: clamp(36px, 5vw, 56px);
	line-height: 1.03;
	font-weight: 800;
	color: #fff;
	margin: 8px 0 12px;
}

.pred-hub-hero__summary {
	font-family: var(--ba-font-body);
	font-size: 18px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.92);
}

.pred-hub-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}

.pred-hub-chip {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 8px 14px;
	border-radius: 999px;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
	background: rgba(255, 255, 255, 0.18);
	border: 1px solid rgba(255, 255, 255, 0.26);
	color: #fff;
}

.pred-hub-chip:hover {
	text-decoration: none;
	background: #fff;
	color: var(--ba-accent-text);
}

.pred-hub-section {
	padding: 54px 0;
	background: #fff;
}

.pred-hub-section--alt {
	background: #f8f8f8;
}

.pred-hub-section--footer {
	border-top: 1px solid #ececec;
	padding: 30px 0;
}

.pred-hub-section--banner-slot {
	padding: 20px 0 10px;
	background: #fff;
}

.pred-hub-banner-slot {
	border: 0;
	background: transparent;
}

.pred-hub-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
}

.pred-hub-meta {
	font-size: 12px;
	color: #6f7783;
	margin: 0 0 8px;
}

.pred-hub-empty {
	border: 1px solid #eadce3;
	border-radius: 18px;
	background: #fcf8fb;
	padding: 18px 20px;
}

.pred-hub-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
	gap: 16px;
}

.pred-hub-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	border: 1px solid #e9e9e9;
	border-radius: 18px;
	padding: 18px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(32, 32, 32, 0.06);
}

.pred-hub-card__meta {
	font-size: 12px;
	color: #6a7280;
}

.pred-hub-card__teams {
	display: flex;
	align-items: center;
	gap: 10px;
}

.pred-hub-card__team {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 0;
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	color: #2b3340;
}

.pred-hub-card__team--away {
	justify-content: flex-end;
	flex-direction: row-reverse;
}

.pred-hub-card__team--away span {
	text-align: right;
}

.pred-hub-card__team span {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pred-hub-card__versus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 28px;
	border-radius: 999px;
	background: #f4f4f6;
	border: 1px solid #e2e3e8;
	font-size: 11px;
	font-weight: 800;
	color: #737a86;
	flex-shrink: 0;
}

.pred-hub-card__team img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.pred-hub-card__pick {
	font-family: var(--ba-font-head);
	font-size: 18px;
	line-height: 1.3;
	font-weight: 700;
	color: #202020;
	margin: 0;
}

.pred-hub-card__market {
	margin: 0;
	font-size: 11px;
	font-weight: 700;
	color: #7a808d;
}

.pred-hub-card__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pred-hub-badge {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	padding: 5px 10px;
	border-radius: 999px;
	background: #f8f8f8;
	border: 1px solid #e9e9e9;
	font-size: 11px;
	font-weight: 700;
	color: #57606d;
}

.pred-hub-badge--ev {
	background: rgba(28, 161, 96, 0.1);
	border-color: rgba(28, 161, 96, 0.28);
	color: #1f7c51;
}

.pred-hub-card__prob {
	font-size: 13px;
	color: #57606d;
	margin: 0;
}

.pred-hub-card__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 9px 14px;
	border-radius: 999px;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: var(--ba-accent);
}

.pred-hub-card__cta:hover {
	text-decoration: none;
	background: var(--ba-accent-hover);
	color: #fff;
}

.pred-hub-link-cloud {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.pred-hub-cloud-link {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid #eadde4;
	background: #fff;
	color: var(--ba-accent-text);
	text-decoration: none;
	font-weight: 700;
	font-size: 14px;
}

.pred-hub-cloud-link:hover {
	text-decoration: none;
	background: #fff4eb;
	color: var(--ba-accent-text);
}

.pred-hub-list {
	margin: 0;
	padding-left: 18px;
}

.pred-hub-list li {
	margin-bottom: 8px;
}

.pred-hub-list a {
	color: var(--ba-accent-text);
	font-weight: 600;
}

.pred-hub-list a:hover {
	color: #f87830;
}

.pred-hub-faq {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pred-hub-faq__item {
	background: #fff;
	border: 1px solid #eadfe6;
	border-radius: 14px;
	padding: 14px 16px;
}

.pred-hub-faq__item summary {
	cursor: pointer;
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 700;
	color: #2a303a;
}

.pred-hub-faq__item p {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: #505968;
}

/* ─── Card: competition label & kickoff ─────────────────────────────── */

.pred-hub-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.pred-hub-card__competition {
	font-size: 11px;
	font-weight: 700;
	color: var(--ba-accent-text);
	background: rgba(15, 124, 133, 0.08);
	border-radius: 999px;
	padding: 3px 8px;
}

.pred-hub-card__kickoff {
	font-size: 12px;
	color: #6a7280;
}

/* ─── Card: market label (plain English, no ALL-CAPS) ───────────────── */

.pred-hub-card__market {
	margin: 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: #7a808d;
	text-transform: none;
}

/* ─── Card: preview badge (coming soon) ────────────────────────────── */

.pred-hub-badge--preview {
	background: #f7f3e8;
	border-color: #e8d9aa;
	color: #7a6430;
}

/* ─── Card: win probability line ───────────────────────────────────── */

.pred-hub-card__prob {
	font-size: 12px;
	color: #57606d;
	margin: 0;
	font-style: italic;
}

/* ─── Hero: live stats bar ──────────────────────────────────────────── */

.pred-hub-hero__stats {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-top: 16px;
}

.pred-hub-hero__stat {
	font-size: 14px;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.9);
}

.pred-hub-hero__stat strong {
	font-weight: 800;
	color: #fff;
}

.pred-hub-hero__stat-sep {
	color: rgba(255, 255, 255, 0.5);
	font-size: 14px;
}

/* ─── Competition filter tabs ───────────────────────────────────────── */

.pred-hub-filter-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}

.pred-hub-filter-tab {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 36px;
	padding: 6px 14px;
	border-radius: 999px;
	border: 1px solid #e2e3e8;
	background: #fff;
	font-family: var(--ba-font-body);
	font-size: 13px;
	font-weight: 600;
	color: #49515e;
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.pred-hub-filter-tab:hover {
	border-color: var(--ba-accent-text);
	color: var(--ba-accent-text);
}

.pred-hub-filter-tab.is-active {
	background: var(--ba-accent);
	border-color: var(--ba-accent-text);
	color: #fff;
}

.pred-hub-filter-tab__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.25);
	font-size: 11px;
	font-weight: 700;
	padding: 0 4px;
}

.pred-hub-filter-tab.is-active .pred-hub-filter-tab__count {
	background: rgba(255, 255, 255, 0.25);
}

/* ─── Featured Tip section (compact strip) ──────────────────────────── */

.pred-hub-section--featured {
	background: linear-gradient(90deg, #fdf2f7 0%, #fff7f0 100%);
	border-bottom: 1px solid #f0dfe8;
	padding: 14px 0;
}

.pred-hub-featured-strip {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	min-height: 52px;
}

.pred-hub-featured-strip__label {
	flex-shrink: 0;
}

.pred-hub-featured-strip__eyebrow {
	font-size: 10px;
	font-weight: 800;
	color: var(--ba-accent-text);
	white-space: nowrap;
}

.pred-hub-featured-strip__teams {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.pred-hub-featured-strip__logo {
	width: 22px;
	height: 22px;
	object-fit: contain;
}

.pred-hub-featured-strip__matchup {
	font-family: var(--ba-font-head);
	font-size: 14px;
	font-weight: 800;
	color: #202020;
	white-space: nowrap;
}

.pred-hub-featured-strip__vs {
	font-size: 11px;
	font-weight: 700;
	color: #9aa0ac;
	margin: 0 3px;
}

.pred-hub-featured-strip__kickoff {
	font-size: 12px;
	color: #6a7280;
	white-space: nowrap;
	padding-left: 4px;
}

.pred-hub-featured-strip__pick {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 auto;
	border-left: 3px solid var(--ba-accent);
	padding-left: 14px;
	min-width: 0;
}

.pred-hub-featured-strip__pick-tip {
	font-family: var(--ba-font-head);
	font-size: 15px;
	font-weight: 800;
	color: #202020;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.pred-hub-featured-strip__pick-market {
	font-size: 12px;
	color: #7a808d;
	white-space: nowrap;
}

.pred-hub-featured-strip__badges {
	display: flex;
	gap: 6px;
	flex-shrink: 0;
}

.pred-hub-featured-strip__cta {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 16px;
	border-radius: 999px;
	background: var(--ba-accent);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
}

.pred-hub-featured-strip__cta:hover {
	background: var(--ba-accent-hover);
	color: #fff;
	text-decoration: none;
}

@media (max-width: 640px) {
	.pred-hub-featured-strip {
		gap: 10px;
	}

	.pred-hub-featured-strip__pick {
		border-left: none;
		padding-left: 0;
		flex-basis: 100%;
	}

	.pred-hub-featured-strip__pick-tip {
		font-size: 14px;
	}
}

/* ─── Competition pathway tiles ─────────────────────────────────────── */

.pred-hub-pathway-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 12px;
	margin-top: 24px;
}

.pred-hub-pathway-tile {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 18px;
	border-radius: 14px;
	border: 1px solid #eadde6;
	background: #fff;
	text-decoration: none;
	transition: border-color 0.15s, box-shadow 0.15s, transform 0.1s;
}

.pred-hub-pathway-tile:hover {
	text-decoration: none;
	border-color: #c47093;
	box-shadow: 0 4px 16px rgba(15, 124, 133, 0.1);
	transform: translateY(-1px);
}

.pred-hub-pathway-tile__emoji {
	font-size: 22px;
	line-height: 1;
	flex-shrink: 0;
}

.pred-hub-pathway-tile__label {
	flex: 1 1 0;
	font-size: 14px;
	font-weight: 700;
	color: #2a303a;
}

.pred-hub-pathway-tile:hover .pred-hub-pathway-tile__label {
	color: var(--ba-accent-text);
}

.pred-hub-pathway-tile__arrow {
	font-size: 16px;
	color: #b0b8c4;
	flex-shrink: 0;
}

/* ─── Methodology: how we pick list ────────────────────────────────── */

.pred-hub-how-we-pick {
	margin-top: 24px;
	padding: 20px 24px;
	border-radius: 16px;
	background: #f8f4f6;
	border: 1px solid #eddde6;
}

.pred-hub-how-we-pick__title {
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 800;
	color: #202020;
	margin: 0 0 12px;
}

.pred-hub-how-we-pick__list {
	margin: 0;
	padding-left: 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.pred-hub-how-we-pick__list li {
	font-size: 14px;
	color: #49515e;
	line-height: 1.5;
}

/* ─── Insights: numbered steps ──────────────────────────────────────── */

.pred-hub-steps {
	list-style: none;
	margin: 0 0 32px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.pred-hub-steps__item {
	display: flex;
	gap: 18px;
	align-items: flex-start;
}

.pred-hub-steps__num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ba-accent);
	color: #fff;
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 800;
	flex-shrink: 0;
}

.pred-hub-steps__body {
	flex: 1 1 0;
}

.pred-hub-steps__body strong {
	display: block;
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 800;
	color: #202020;
	margin-bottom: 4px;
}

.pred-hub-steps__body p {
	font-size: 14px;
	line-height: 1.7;
	color: #49515e;
	margin: 0;
}

/* ─── Insights: bet types grid ──────────────────────────────────────── */

.pred-hub-bet-types {
}

.pred-hub-bet-types__title {
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 800;
	color: #202020;
	margin: 0 0 14px;
}

.pred-hub-bet-types__grid {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pred-hub-bet-type {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 14px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #e0d4dc;
	font-size: 13px;
	font-weight: 600;
	color: var(--ba-accent-text);
}

/* ─── Popular predictions: tile grid ────────────────────────────────── */

/* Popular pairs: compact crest tiles, two per row from 700px (Daniel, 17 Oct 2026). */
.pred-hub-section--popular { padding: 44px 0; }
.pred-hub-popular-grid {
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px;
}
@media (min-width: 700px) {
	.pred-hub-popular-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
	.pred-hub-popular-tile { min-height: 58px; padding: 10px 16px 10px 12px; }
}
.pred-hub-popular-tile {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 54px;
	padding: 8px 14px 8px 10px;
	border: 1px solid #e9e9e9;
	border-radius: 14px;
	background: #fff;
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pred-hub-popular-tile:hover { text-decoration: none; border-color: var(--ba-accent); box-shadow: 0 6px 18px rgba(32, 32, 32, 0.08); }
.pred-hub-popular-tile:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 2px; }
.pred-hub-popular-tile:active { box-shadow: none; background: #f8f8f8; }
.pred-hub-popular-tile__crests { position: relative; flex: none; width: 48px; height: 38px; }
.pred-hub-popular-tile__crests img { position: absolute; width: 28px; height: 28px; padding: 2px; object-fit: contain; background: #fff; border: 1px solid #e9e9e9; border-radius: 50%; }
.pred-hub-popular-tile__crests img:first-child { left: 0; top: 0; }
.pred-hub-popular-tile__crests img:last-child { left: 18px; top: 10px; }
.pred-hub-popular-tile__text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.pred-hub-popular-tile__label { font: 700 15px/1.3 var(--ba-font-body); color: #202020; }
.pred-hub-popular-tile:hover .pred-hub-popular-tile__label { color: var(--ba-accent-text); }
.pred-hub-popular-tile__meta { font: 400 12px/1.35 var(--ba-font-body); color: #6f7783; }
.pred-hub-popular-tile__arrow { flex: none; font-size: 16px; color: #b0b8c4; transition: color 0.15s ease; }
.pred-hub-popular-tile:hover .pred-hub-popular-tile__arrow { color: var(--ba-accent); }

/* ─── FAQ: question / answer styling ────────────────────────────────── */

.pred-hub-faq__question {
	cursor: pointer;
	font-family: var(--ba-font-head);
	font-size: 16px;
	font-weight: 700;
	color: #2a303a;
}

.pred-hub-faq__answer {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: #505968;
}

/* ─── Offers section ────────────────────────────────────────────────── */

.pred-hub-section--offers {
	background: #1a1a2e;
}

.pred-hub-section--offers .pred-hub-kicker {
	color: #e08ca0;
}

.pred-hub-section--offers .pred-hub-title {
	color: #fff;
}

.pred-hub-section--offers .pred-hub-copy,
.pred-hub-section--offers .pred-hub-copy--small {
	color: rgba(255, 255, 255, 0.72);
}

.pred-hub-offers-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin-top: 24px;
}

.pred-hub-offer-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 18px;
	padding: 22px;
}

.pred-hub-offer-card__header {
	min-height: 36px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.pred-hub-offer-card__tag {
	flex-shrink: 0;
	padding: 4px 10px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	font-size: 12px;
	color: rgba(255, 255, 255, 0.75);
}

.pred-hub-offer-card__logo {
	max-height: 32px;
	width: auto;
	object-fit: contain;
	filter: brightness(0) invert(1);
	opacity: 0.9;
}

.pred-hub-offer-card__name {
	font-family: var(--ba-font-head);
	font-size: 18px;
	font-weight: 800;
	color: #fff;
}

.pred-hub-offer-card__headline {
	font-family: var(--ba-font-head);
	font-size: 20px;
	font-weight: 800;
	color: #fff;
	line-height: 1.2;
	margin: 0;
}

/* Scrollable T&Cs, as on the app listings. predictions.js sets the height to bet365's terms
   plus half a line; the fallback (10.5 lines) fits bet365 at every width from 320px up. */
.pred-hub-offer-card__terms {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
	line-height: 1.55;
	max-height: var(--pred-offer-terms-h, 16.3em);
	overflow-y: auto;
	padding-right: 6px;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.35) transparent;
}

.pred-hub-offer-card__terms:focus-visible {
	outline: 2px solid var(--ba-accent-ondark, #5FD0D8);
	outline-offset: 2px;
	border-radius: 4px;
}

.pred-hub-offer-card__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 16px;
	border-radius: 999px;
	background: var(--ba-cta-gradient, linear-gradient(135deg, #F87830 0%, #E85090 100%));
	box-shadow: 0 8px 20px rgba(232, 80, 144, 0.28);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: filter 0.15s ease, box-shadow 0.15s ease;
}

.pred-hub-offer-card__cta:hover {
	filter: brightness(1.06);
	box-shadow: 0 10px 24px rgba(232, 80, 144, 0.38);
	color: #fff;
	text-decoration: none;
}

.pred-hub-offer-card__cta:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
	color: #fff;
}

.pred-hub-offer-card__cta:active {
	filter: brightness(0.96);
	color: #fff;
}

.pred-hub-offers-disclaimer {
	margin-top: 20px;
	font-size: 11px;
	color: rgba(255, 255, 255, 0.4);
	line-height: 1.5;
}

.pred-hub-offers-coming-soon {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 20px;
	padding: 20px 24px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.1);
}

.pred-hub-offers-coming-soon__icon {
	font-size: 20px;
	line-height: 1;
	flex-shrink: 0;
	margin: 0;
}

.pred-hub-offers-coming-soon__text {
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
}

/* ─── Responsive ────────────────────────────────────────────────────── */

@media (max-width: 767px) {
	.pred-hub-section {
		padding: 42px 0;
	}

	.pred-hub-hero {
		padding: 40px 0 34px;
	}

	.pred-hub-hero__summary {
		font-size: 16px;
	}

	.pred-hub-filter-tabs {
		gap: 6px;
	}

	.pred-hub-filter-tab {
		font-size: 12px;
		padding: 5px 12px;
	}

	.pred-hub-steps__num {
		width: 30px;
		height: 30px;
		font-size: 14px;
	}
}

/* -- Previous predictions (finished fixtures) -------------------- */
.pred-hub-section--previous {
	background: #f8f8f8;
	border-top: 1px solid #ececec;
}

.pred-hub-card--past {
	background: #fcfcfc;
	border-color: #e4e4e4;
	box-shadow: none;
}

.pred-hub-card--past .pred-hub-card__competition,
.pred-hub-card--past .pred-hub-card__kickoff {
	color: #8a9098;
}

.pred-hub-card--past .pred-hub-card__cta {
	background: #6a7280;
}

.pred-hub-card--past .pred-hub-card__cta:hover {
	background: #565d66;
}

/* The page ends on a full-bleed band: no white strip above the footer. */
.ba-footer{margin-top:0;}

/* Breadcrumbs sit in the gradient hero (the parent theme's band used to carry them). */
.pred-hub-hero .ba-breadcrumbs { margin-bottom: 14px; }
.pred-hub-hero .ba-breadcrumbs, .pred-hub-hero .ba-breadcrumbs a { color: rgba(255, 255, 255, .88); }
.pred-hub-hero .ba-breadcrumbs a:hover, .pred-hub-hero .ba-breadcrumbs a:focus-visible { color: #ffffff; }
.pred-hub-hero .ba-breadcrumbs .current-item, .pred-hub-hero .ba-breadcrumbs > span:last-child { color: #ffffff; }

/* ─── Card: value line + most-likely-result line (bapps 0110, 14 Oct 2026) ── */

.pred-hub-card__value {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #202020;
}

.pred-hub-card__result {
	margin: 0;
	font-size: 12px;
	color: #57606d;
}

/* ─── A-77 hub card: tip label, UK price, likelihood, teal outline button ─── */
.pred-hub-card__tiplabel { margin: 0 0 -6px; font: 600 12px/1.3 var(--ba-font-body, Inter, system-ui, sans-serif); color: #0B6A72; }
.pred-hub-card__price { margin: 0; font-size: 14px; font-weight: 600; color: #202020; }
.pred-hub-card__result strong { color: #202020; }
.pred-hub-card:not(.pred-hub-card--past) .pred-hub-card__cta { background: transparent; color: #0B6A72; border: 2px solid var(--ba-accent); min-height: 44px; }
.pred-hub-card:not(.pred-hub-card--past) .pred-hub-card__cta:hover { background: var(--ba-accent); color: #fff; }
.pred-hub-card__cta:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 3px; }

/* A-85: the tip kind under "Today's top tip". */
.pred-hub-featured-strip__kind { display: block; margin-top: 3px; font: 600 12px/1.2 var(--ba-font-body, Inter, system-ui, sans-serif); color: var(--ba-charcoal, #202020); white-space: nowrap; }
/* ---------------------------------------------------------------------------------------------
 * A-87: Gameweek accas, v2 betslip design (template-parts/predictions-hub/accas.php; mockup
 * testing/pages/gameweek-accas-v2.html, approved by Daniel 17 Oct 2026). Mobile first; from 900px
 * three cards side by side on a subgrid so the legs, totals and buttons line up across cards.
 * Gradient only in each card's top bar and the book-priced card's CTA; teal for information.
 * ------------------------------------------------------------------------------------------- */
.pred-hub-section--accas { background: #f8f8f8; }
.pred-hub-acca-head { max-width: 780px; }
.pred-hub-acca-head .pred-hub-title { margin-bottom: 0; letter-spacing: -0.02em; }
.pred-hub-acca-intro { margin: 14px 0 0; font: 400 17px/1.65 var(--ba-font-body); color: #3a4049; }
.pred-hub-acca-trust { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: 10px 0 0; font: 400 13px/1.4 var(--ba-font-body); color: #57606d; }
.pred-hub-acca-trust a { color: var(--ba-accent-text); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; border-radius: 4px; }
.pred-hub-acca-trust a:hover { color: var(--ba-accent-hover); text-decoration-thickness: 2px; }
.pred-hub-acca-trust a:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 2px; }
.pred-hub-acca-trust a:active { color: var(--ba-accent-hover); }

.pred-hub-acca-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 26px; }

.pred-hub-acca { display: flex; flex-direction: column; min-width: 0; padding-top: 5px; background: #fff linear-gradient(90deg, #F87830, #F8A018, #E85090) top / 100% 5px no-repeat; border: 1px solid #e9e9e9; border-radius: 18px; box-shadow: 0 8px 24px rgba(32, 32, 32, 0.08); overflow: hidden; }
.pred-hub-acca.is-settled { background-image: linear-gradient(90deg, #d9dbe0, #d9dbe0); }
.pred-hub-acca--empty { justify-content: center; gap: 6px; padding: 24px 20px; background: transparent; border-style: dashed; box-shadow: none; }
.pred-hub-acca--empty .pred-hub-acca__title { padding: 0; }
.pred-hub-acca--empty .pred-hub-acca__small { text-align: left; }

.pred-hub-acca__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 18px 20px 12px; }
.pred-hub-acca__eyebrow,
.pred-hub-acca__fold,
.pred-hub-acca__status { display: inline-flex; align-items: center; border-radius: 999px; font: 700 12px/1 var(--ba-font-body); white-space: nowrap; }
.pred-hub-acca__eyebrow { padding: 5px 10px; background: rgba(15, 124, 133, 0.10); border: 1px solid rgba(15, 124, 133, 0.28); color: var(--ba-accent-text); }
.pred-hub-acca__fold { margin-left: auto; padding: 6px 10px; background: #f8f8f8; border: 1px solid #e9e9e9; color: #57606d; font-weight: 600; }
.pred-hub-acca__status { margin-left: auto; padding: 6px 10px; background: #f8f8f8; border: 1px solid #e9e9e9; color: #49515e; }
.pred-hub-acca__status--live { background: #fff4e5; border-color: #f5d9a8; color: #9a5b00; }
.pred-hub-acca__status--won { background: #e3f4ea; border-color: #b9e2c9; color: #1f7c51; }
.pred-hub-acca__status--lost { background: #fdeaea; border-color: #f3c2c2; color: #b42318; }

.pred-hub-acca__title { margin: 0; padding: 0 20px 6px; font: 700 22px/1.2 var(--ba-font-head); color: #202020; }
.pred-hub-acca__sub { margin: 0; padding: 0 20px 14px; font: 400 13px/1.5 var(--ba-font-body); color: #57606d; }
.pred-hub-acca__sub:empty { padding-bottom: 8px; }

.pred-hub-acca__legs { flex: 1; list-style: none; margin: 0; padding: 0 20px; }
.pred-hub-acca__leg { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid #e9e9e9; }
.pred-hub-acca__leg:first-child { border-top: 0; }
.pred-hub-acca__crests { position: relative; width: 44px; height: 36px; }
.pred-hub-acca__crests img { position: absolute; width: 26px; height: 26px; padding: 2px; object-fit: contain; background: #fff; border: 1px solid #e9e9e9; border-radius: 50%; }
.pred-hub-acca__crests img:first-child { left: 0; top: 0; }
.pred-hub-acca__crests img:last-child { left: 16px; top: 10px; }
.pred-hub-acca__mark { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; font: 700 12px/1 var(--ba-font-body); }
.pred-hub-acca__mark--won { background: #e3f4ea; color: #1f7c51; }
.pred-hub-acca__mark--lost { background: #fdeaea; color: #b42318; }
.pred-hub-acca__mark--void,
.pred-hub-acca__mark--pending { background: #f8f8f8; color: #57606d; border: 1px solid #e9e9e9; }
.pred-hub-acca__pick { margin: 0; font: 700 16px/1.25 var(--ba-font-body); color: #202020; }
.pred-hub-acca__match { margin: 2px 0 0; font: 400 13px/1.4 var(--ba-font-body); color: #57606d; }
.pred-hub-acca__match > *:not(:last-child)::after { content: " \00B7 "; color: #57606d; white-space: pre; }
.pred-hub-acca__match a { color: var(--ba-accent-text); font-weight: 500; text-decoration: none; border-radius: 4px; }
.pred-hub-acca__match a:hover { color: var(--ba-accent-hover); text-decoration: underline; text-underline-offset: 3px; }
.pred-hub-acca__match a:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 2px; }
.pred-hub-acca__match a:active { color: var(--ba-accent-hover); }
.pred-hub-acca__odds { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.pred-hub-acca__box { min-width: 58px; padding: 7px 9px; border: 2px solid rgba(15, 124, 133, 0.28); border-radius: 10px; background: #fff; color: #202020; font: 700 15px/1 var(--ba-font-body); text-align: center; font-variant-numeric: tabular-nums; }
.pred-hub-acca__box--book { border-color: var(--ba-accent); background: rgba(15, 124, 133, 0.10); }
.pred-hub-acca__book { font: 500 11px/1.2 var(--ba-font-body); color: #57606d; white-space: nowrap; }

.pred-hub-acca__total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; margin: 8px 20px 0; padding: 14px 16px; background: #f8f8f8; border: 1px solid #e9e9e9; border-radius: 14px; }
.pred-hub-acca__total-odds { font: 800 30px/1 var(--ba-font-head); letter-spacing: -0.02em; color: #202020; font-variant-numeric: tabular-nums; }
.pred-hub-acca__total-odds small { margin-left: 6px; font: 600 14px/1 var(--ba-font-body); letter-spacing: 0; color: #57606d; }
.pred-hub-acca__ret { font: 600 14px/1.3 var(--ba-font-body); color: var(--ba-accent-text); }
.pred-hub-acca__ret b { font-weight: 700; color: #202020; }

.pred-hub-acca__view { padding: 14px 20px 0; font: 400 14px/1.5 var(--ba-font-body); color: #3a4049; }
.pred-hub-acca__view:empty { padding: 0; }
.pred-hub-acca__view p { margin: 0; }
.pred-hub-acca__meter { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font: 600 13px/1 var(--ba-font-body); color: #57606d; }
.pred-hub-acca__meter b { min-width: 84px; font-weight: 700; color: #202020; white-space: nowrap; }
.pred-hub-acca__meter-bar { flex: 1; height: 6px; overflow: hidden; border-radius: 999px; background: #e9e9e9; }
.pred-hub-acca__meter-fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #0F7C85, #5FD0D8); }

.pred-hub-acca__foot { margin-top: auto; padding: 16px 20px 20px; }
.pred-hub-acca__cta { width: 100%; white-space: nowrap; }
.pred-hub-acca__cta:focus-visible { outline: 3px solid var(--ba-accent); outline-offset: 3px; }
.pred-hub-acca__cta.ba-btn--outline { padding: 12px 22px; }
.pred-hub-acca__cta.ba-btn--outline:hover,
.pred-hub-acca__cta.ba-btn--outline:focus-visible { color: #fff; }
.pred-hub-acca__small { margin: 8px 0 0; font: 400 12px/1.45 var(--ba-font-body); color: #57606d; text-align: center; }
.pred-hub-acca__foot > .pred-hub-acca__small:first-child { margin-top: 0; }

@media (max-width: 420px) {
	.pred-hub-acca__cta { padding-left: 16px; padding-right: 16px; font-size: 15px; }
}

@supports (grid-template-rows: subgrid) {
	@media (min-width: 900px) {
		.pred-hub-acca-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(7, auto); row-gap: 0; }
		.pred-hub-acca { display: grid; grid-row: span 7; grid-template-rows: subgrid; row-gap: 0; }
		.pred-hub-acca__legs { align-self: start; }
		.pred-hub-acca__foot { align-self: end; }
		.pred-hub-acca--empty { display: flex; }
	}
}
@supports not (grid-template-rows: subgrid) {
	@media (min-width: 900px) {
		.pred-hub-acca-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	}
}

.pred-hub-acca-foot { max-width: 760px; margin-top: 26px; font: 400 15px/1.65 var(--ba-font-body); color: #3a4049; }
.pred-hub-acca-foot > p { margin: 0 0 10px; }
.pred-hub-acca-copy { margin: 0 0 10px; }
.pred-hub-acca-record { font-size: 13px; color: #57606d; }
.pred-hub-acca-foot.is-collapsed { margin-top: 18px; }

/* ---------------------------------------------------------------------------------------------
 * Hub restructure (docs/plans/2026-10-predictions-hub-restructure.md, 17 Oct 2026): compact hero
 * with stamp line and fixture chips, bet-type sections (pred-hub-mkt, pred-hub-bb) and the record
 * band. Mobile first. Gradient only in the hero band (as before); teal for information.
 * ------------------------------------------------------------------------------------------- */
.pred-hub-hero--compact { padding: 34px 0 28px; }
.pred-hub-hero--compact .pred-hub-hero__title { font-size: clamp(32px, 4.4vw, 48px); line-height: 1.08; letter-spacing: -0.02em; margin: 6px 0 10px; }
.pred-hub-hero__stamp { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; font: 500 14px/1.5 var(--ba-font-body); color: rgba(255, 255, 255, 0.94); }
.pred-hub-hero__stamp > span:not(:last-child)::after { content: "\00B7"; margin: 0 8px; color: rgba(255, 255, 255, 0.7); }
.pred-hub-hero__stamp a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; border-radius: 4px; }
.pred-hub-hero__stamp a:hover { text-decoration-thickness: 2px; color: #fff; }
.pred-hub-hero__stamp a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.pred-hub-hero__stamp a:active { color: #fff; opacity: 0.85; }

.pred-hub-when { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.pred-hub-when[hidden] { display: none; }
.pred-hub-when__chip { min-height: 36px; padding: 7px 14px; border: 1px solid rgba(255, 255, 255, 0.7); border-radius: 999px; background: rgba(255, 255, 255, 0.14); color: #fff; font: 600 14px/1 var(--ba-font-body); cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.pred-hub-when__chip:hover { background: rgba(255, 255, 255, 0.28); }
.pred-hub-when__chip:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.pred-hub-when__chip:active { background: rgba(255, 255, 255, 0.38); }
.pred-hub-when__chip.is-active { background: #fff; border-color: #fff; color: #202020; }
.pred-hub-when__chip[hidden] { display: none; }
.pred-hub-card.is-when-hidden { display: none !important; }

/* Bet-type lists: one row per match. */
.pred-hub-mkt-intro { max-width: 760px; margin: 0 0 18px; }
.pred-hub-mkt { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid #e9e9e9; border-radius: 18px; box-shadow: 0 8px 24px rgba(32, 32, 32, 0.08); overflow: hidden; }
.pred-hub-mkt__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "match odds" "sel odds"; align-items: center; gap: 4px 14px; padding: 12px 16px; border-top: 1px solid #efefef; }
.pred-hub-mkt__row:first-child { border-top: 0; }
.pred-hub-mkt__crests { display: none; }
.pred-hub-mkt__match { grid-area: match; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font: 500 13px/1.4 var(--ba-font-body); color: #57606d; }
.pred-hub-mkt__match a { color: var(--ba-accent-text); font-weight: 600; text-decoration: none; border-radius: 4px; }
.pred-hub-mkt__match a:hover { color: var(--ba-accent-hover); text-decoration: underline; text-underline-offset: 3px; }
.pred-hub-mkt__match a:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 2px; }
.pred-hub-mkt__match a:active { color: var(--ba-accent-hover); }
.pred-hub-mkt__match small { font-size: 12px; color: #6f7783; }
.pred-hub-mkt__sel { grid-area: sel; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pred-hub-mkt__sel strong { font: 700 16px/1.3 var(--ba-font-body); color: #202020; }
.pred-hub-mkt__sel small { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 500 13px/1.4 var(--ba-font-body); color: #57606d; }
.pred-hub-mkt__tag { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; background: rgba(15, 124, 133, 0.10); border: 1px solid rgba(15, 124, 133, 0.28); color: var(--ba-accent-text); font: 700 11px/1 var(--ba-font-body); }
.pred-hub-mkt__odds { grid-area: odds; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.pred-hub-mkt__box { min-width: 58px; padding: 7px 9px; border: 2px solid rgba(15, 124, 133, 0.28); border-radius: 10px; background: #fff; color: #202020; font: 700 15px/1 var(--ba-font-body); text-align: center; font-variant-numeric: tabular-nums; }
.pred-hub-mkt__row.is-pick .pred-hub-mkt__box { border-color: var(--ba-accent); background: rgba(15, 124, 133, 0.10); }
.pred-hub-mkt__box--pct { border-color: #e9e9e9; background: #f8f8f8; }
.pred-hub-mkt__book { font: 500 11px/1.2 var(--ba-font-body); color: #57606d; white-space: nowrap; }
.pred-hub-mkt-h3 { margin: 28px 0 14px; font: 700 22px/1.2 var(--ba-font-head); color: #202020; }
.pred-hub-mkt-note { margin: 12px 0 0; font: 400 13px/1.5 var(--ba-font-body); color: #57606d; }
@media (min-width: 700px) {
	.pred-hub-mkt__row { grid-template-columns: 44px minmax(0, 1.1fr) minmax(0, 1fr) auto; grid-template-areas: "crests match sel odds"; padding: 12px 20px; }
	.pred-hub-mkt__crests { grid-area: crests; display: block; position: relative; width: 44px; height: 34px; }
	.pred-hub-mkt__crests img { position: absolute; width: 24px; height: 24px; padding: 2px; object-fit: contain; background: #fff; border: 1px solid #e9e9e9; border-radius: 50%; }
	.pred-hub-mkt__crests img:first-child { left: 0; top: 0; }
	.pred-hub-mkt__crests img:last-child { left: 16px; top: 9px; }
	.pred-hub-mkt__match { flex-direction: column; gap: 0; font-size: 14px; }
}

/* Bet builder slips. */
.pred-hub-bb-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 900px) { .pred-hub-bb-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.pred-hub-bb { display: flex; flex-direction: column; gap: 12px; padding: 20px; background: #fff; border: 1px solid #e9e9e9; border-radius: 18px; box-shadow: 0 8px 24px rgba(32, 32, 32, 0.08); }
.pred-hub-bb__match { display: flex; align-items: center; gap: 10px; margin: 0; }
.pred-hub-bb__match .pred-hub-mkt__crests { display: block; position: relative; width: 44px; height: 34px; flex: none; }
.pred-hub-bb__match .pred-hub-mkt__crests img { position: absolute; width: 24px; height: 24px; padding: 2px; object-fit: contain; background: #fff; border: 1px solid #e9e9e9; border-radius: 50%; }
.pred-hub-bb__match .pred-hub-mkt__crests img:first-child { left: 0; top: 0; }
.pred-hub-bb__match .pred-hub-mkt__crests img:last-child { left: 16px; top: 9px; }
.pred-hub-bb__match .pred-hub-mkt__match { flex-direction: column; gap: 0; font-size: 15px; }
.pred-hub-bb__legs { list-style: none; margin: 0; padding: 0; }
.pred-hub-bb__legs li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid #efefef; font: 600 15px/1.35 var(--ba-font-body); color: #202020; }
.pred-hub-bb__legs li:first-child { border-top: 0; padding-top: 0; }
.pred-hub-bb__leg-odds { flex: none; font-weight: 700; color: #57606d; font-variant-numeric: tabular-nums; }
.pred-hub-bb__total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 12px; padding: 12px 14px; background: #f8f8f8; border: 1px solid #e9e9e9; border-radius: 14px; }
.pred-hub-bb__odds { font: 800 26px/1 var(--ba-font-head); letter-spacing: -0.02em; color: #202020; }
.pred-hub-bb__odds small { margin-left: 6px; font: 600 13px/1 var(--ba-font-body); letter-spacing: 0; color: #57606d; }
.pred-hub-bb__ret { font: 600 14px/1.3 var(--ba-font-body); color: var(--ba-accent-text); }
.pred-hub-bb__ret b { color: #202020; }
.pred-hub-bb__meta { margin: 0; font: 400 13px/1.45 var(--ba-font-body); color: #57606d; }
.pred-hub-bb__link { margin-top: auto; align-self: flex-start; color: var(--ba-accent-text); font: 600 14px/1.3 var(--ba-font-body); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; border-radius: 4px; }
.pred-hub-bb__link:hover { color: var(--ba-accent-hover); text-decoration-thickness: 2px; }
.pred-hub-bb__link:focus-visible { outline: 2px solid var(--ba-accent); outline-offset: 2px; }
.pred-hub-bb__link:active { color: var(--ba-accent-hover); }

/* Record band. */
.pred-hub-section--record { background: #f8f8f8; }
.pred-hub-record-intro { max-width: 760px; margin: 0 0 20px; }
.pred-hub-record-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
@media (min-width: 760px) { .pred-hub-record-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.pred-hub-record-stat { display: flex; flex-direction: column; gap: 6px; padding: 20px; background: #fff; border: 1px solid #e9e9e9; border-radius: 18px; box-shadow: 0 8px 24px rgba(32, 32, 32, 0.08); }
.pred-hub-record-stat__num { font: 800 36px/1 var(--ba-font-head); letter-spacing: -0.02em; color: #202020; font-variant-numeric: tabular-nums; }
.pred-hub-record-stat__label { font: 500 14px/1.45 var(--ba-font-body); color: #49515e; }
.pred-hub-record-note { max-width: 760px; margin: 14px 0 0; }
.pred-hub-record-method { max-width: 760px; margin-top: 28px; }
.pred-hub-record-method__title { margin: 0 0 10px; font: 700 22px/1.2 var(--ba-font-head); color: #202020; }
.pred-hub-record-method .pred-hub-how-we-pick__list { margin: 14px 0 16px; padding-left: 20px; }
.pred-hub-record-method .pred-hub-how-we-pick__list li { margin: 0 0 6px; font: 400 15px/1.55 var(--ba-font-body); color: #3a4049; }
.pred-hub-record-soon { max-width: 760px; padding: 18px 20px; background: #fff; border: 1px solid #e9e9e9; border-left: 4px solid var(--ba-accent); border-radius: 14px; box-shadow: 0 8px 24px rgba(32, 32, 32, 0.06); }
.pred-hub-record-soon__title { margin: 0 0 4px; font: 700 17px/1.3 var(--ba-font-head); color: #202020; }
.pred-hub-record-soon__text { margin: 0; font: 400 15px/1.6 var(--ba-font-body); color: #3a4049; }