/* components.css — kicker, byline, buttons, text-links, drop cap, stars, rules. */

/* Kicker label — UPPERCASE stone */
.hc-kicker {
	font-family: var(--f-body);
	font-weight: 600;
	font-size: var(--f-label);
	color: var(--c-stone);
	text-transform: uppercase;
	letter-spacing: 0.15em;
	margin: 0 0 1.2em;
}
.hc-kicker--accent { color: var(--c-accent); }

/* Byline */
.hc-byline {
	font-family: var(--f-body);
	font-weight: 500;
	font-size: var(--f-body-s);
	color: var(--c-ink-muted);
	letter-spacing: 0.02em;
	margin: .8em 0 0;
}
.hc-byline__sep { margin-inline: .4em; color: var(--c-stone); }

/* Drop cap — Playfair, racing green, 3-line drop */
.hc-prose--dropcap { font-size: var(--f-body-l); }
.hc-dropcap {
	font-family: var(--f-display);
	font-weight: 700;
	color: var(--c-accent);
	float: left;
	font-size: 4.5rem;
	line-height: .9;
	padding: 0.08em 0.12em 0 0;
	margin-right: 0.06em;
	letter-spacing: -0.02em;
}

/* Star rating */
.hc-rating {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	font-family: var(--f-mono);
	font-size: 1rem;
	letter-spacing: 0.04em;
}
.hc-star { font-size: 1.1em; line-height: 1; }
.hc-star--filled { color: var(--c-accent); }
.hc-star--empty { color: var(--c-stone); }
.hc-rating__value {
	font-family: var(--f-mono);
	font-size: var(--f-body-s);
	color: var(--c-ink-muted);
	margin-left: .3em;
	font-variant-numeric: tabular-nums;
}

/* Buttons — only for internal navigation (C7) */
.hc-btn {
	display: inline-block;
	background: var(--c-ink);
	color: var(--c-paper);
	padding: 12px 24px;
	border-radius: var(--r-sm);
	font-family: var(--f-body);
	font-weight: 500;
	font-size: .875rem;
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transition: background-color .2s ease, color .2s ease;
}
.hc-btn:hover { background: var(--c-accent); color: var(--c-paper); }
.hc-btn--outline { background: transparent; color: var(--c-ink); border: 1px solid var(--c-ink); }
.hc-btn--outline:hover { background: var(--c-ink); color: var(--c-paper); }

/* Text link — the default for ANY affiliate link (C7) */
.hc-textlink {
	font-family: var(--f-body);
	font-weight: 500;
	color: var(--c-ink);
	border-bottom: 1px solid var(--c-stone);
	padding-bottom: 1px;
	transition: color .15s ease, border-color .15s ease;
}
.hc-textlink:hover { color: var(--c-accent); border-bottom-color: var(--c-accent); }
.hc-textlink--accent { color: var(--c-accent); border-bottom-color: var(--c-accent); }
.hc-textlink--arrow::after { content: ' \2192'; }
.hc-textlink--readmore {
	font-size: var(--f-body-s);
	color: var(--c-accent);
	border-bottom-color: transparent;
}
.hc-textlink--readmore:hover {
	border-bottom-color: var(--c-accent);
}

/* Breadcrumb */
.hc-breadcrumbs {
	font-family: var(--f-body);
	font-size: var(--f-body-s);
	color: var(--c-stone);
	margin-bottom: var(--space-item);
}
.hc-breadcrumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5em; }
.hc-breadcrumbs li { margin: 0; }
.hc-breadcrumbs a { color: var(--c-ink-muted); border-bottom: 1px solid transparent; }
.hc-breadcrumbs a:hover { color: var(--c-accent); border-bottom-color: var(--c-accent); }
.hc-breadcrumbs__sep { color: var(--c-stone); margin-inline: .4em; }

/* Offer box — stone border, paper-alt bg, mid-article */
.hc-offer-box {
	max-width: 420px;
	margin: var(--space-block) auto;
	padding: 24px;
	background: var(--c-paper-alt);
	border: 1px solid var(--c-stone);
	border-radius: var(--r-none);
	text-align: left;
}
.hc-offer-box__kicker {
	font-family: var(--f-body);
	font-weight: 600;
	font-size: var(--f-label);
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--c-ink-muted);
	margin: 0 0 .8em;
}
.hc-offer-box__headline {
	font-family: var(--f-display);
	font-weight: 500;
	font-size: 1.125rem;
	line-height: 1.3;
	margin: 0 0 .5em;
	color: var(--c-ink);
}
.hc-offer-box__details {
	font-family: var(--f-body);
	font-size: var(--f-body-s);
	line-height: 1.55;
	color: var(--c-ink);
	margin: 0 0 1em;
}
.hc-offer-box__cta {
	display: inline-block;
	font-family: var(--f-body);
	font-weight: 500;
	color: var(--c-accent);
	border-bottom: 1px solid var(--c-accent);
	padding-bottom: 1px;
}
.hc-offer-box__cta:hover { color: var(--c-accent-deep); border-bottom-color: var(--c-accent-deep); }

/* Compact offer box (list views on sport hub) */
.hc-offer-inline {
	margin: var(--space-item) 0;
	padding: 16px 20px;
	background: var(--c-paper-alt);
	border: 1px solid var(--c-stone);
}
.hc-offer-inline p { margin-bottom: .3em; font-size: var(--f-body-s); }

/* Compliance T&C footnote */
.hc-tc {
	font-family: var(--f-mono);
	font-size: .75rem;
	color: var(--c-warn-amber);
	margin: .8em 0 0;
	line-height: 1.5;
}
.hc-tc a { color: var(--c-warn-amber); border-bottom: 1px solid currentColor; }
.hc-tc a:hover { color: var(--c-accent-deep); border-bottom-color: var(--c-accent-deep); }

/* Responsible gambling block — amber stroke */
.hc-rg-block {
	max-width: var(--prose);
	margin: var(--space-block) auto;
	padding: 20px 24px;
	border: 1px solid var(--c-warn-amber);
	background: var(--c-paper);
	font-family: var(--f-body);
	font-size: var(--f-body-s);
	line-height: 1.6;
	color: var(--c-ink);
}
.hc-rg-block__title {
	font-family: var(--f-body);
	font-weight: 600;
	font-size: var(--f-label);
	text-transform: uppercase;
	letter-spacing: 0.15em;
	color: var(--c-warn-amber);
	margin: 0 0 .6em;
}
.hc-rg-block a { color: var(--c-accent); border-bottom: 1px solid var(--c-accent); }
.hc-rg-block a:hover { color: var(--c-accent-deep); border-bottom-color: var(--c-accent-deep); }

/* Pull quote */
.hc-pullquote {
	font-family: var(--f-display);
	font-style: italic;
	font-size: 1.5rem;
	line-height: 1.35;
	max-width: var(--prose);
	margin: var(--space-block) auto;
	padding-left: 1em;
	border-left: 2px solid var(--c-accent);
	color: var(--c-ink);
}

/* Italic accent — editorial emphasis */
.hc-italic-accent {
	font-family: var(--f-display);
	font-style: italic;
	color: var(--c-ink);
}
.hc-italic-accent-underline { box-shadow: inset 0 -3px 0 var(--c-accent); }

/* Affiliate disclosure footnote (persistent quiet footer) */
.hc-disclosure-note {
	font-family: var(--f-display);
	font-style: italic;
	color: var(--c-stone);
	max-width: 52rem;
	margin: var(--space-block) auto;
	text-align: center;
	line-height: 1.5;
	font-size: var(--f-body-s);
}

/* Scorecard stars row */
.hc-scorerow {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	column-gap: 1em;
	font-family: var(--f-mono);
	font-size: var(--f-mono);
	padding: .5em 0;
	border-top: 1px solid var(--c-stone);
}
.hc-scorerow:first-child { border-top: 0; }
.hc-scorerow__name { color: var(--c-ink); }

/* Kicker + link anchor row (sport list) */
.hc-sportlist {
	list-style: none;
	padding: 0;
	margin: 0;
}
.hc-sportlist li {
	padding: 20px 0;
	border-top: 1px solid var(--c-stone);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1em;
}
.hc-sportlist li:last-child { border-bottom: 1px solid var(--c-stone); }
.hc-sportlist a {
	font-family: var(--f-display);
	font-weight: 500;
	font-size: 1.375rem;
	color: var(--c-ink);
}
.hc-sportlist a:hover { color: var(--c-accent); }
.hc-sportlist .hc-sportlist__meta {
	font-family: var(--f-body);
	font-size: var(--f-body-s);
	color: var(--c-stone);
}