/* Thought-leadership archive and article chrome.
   The articles themselves carry their own inline styles; we only restyle the
   tokens around them so the page reads as part of the 2027 site. */

.hm-tl-crumb {
	background: #070b1f;
	color: var(--hm-ink-300);
	padding: 18px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.hm-tl-crumb__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	font: var(--type-small);
}

.hm-tl-crumb a {
	color: var(--hm-ink-300);
	text-decoration: none;
}

.hm-tl-crumb a:hover {
	color: var(--hm-white);
	text-decoration: underline;
}

.hm-tl-crumb time {
	color: var(--hm-ink-400);
}

.hm-tl-article {
	background: #070b1f;
	color: var(--hm-white);
}

.hm-tl-article img {
	max-width: 100%;
	height: auto;
}

.hm-tl-article a {
	color: var(--hm-blue-400);
}

.hm-tl-back {
	background: #070b1f;
	padding: 0 24px 96px;
}

.hm-tl-back__inner {
	max-width: 1000px;
	margin: 0 auto;
}

.hm-tl-back a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	border-radius: var(--radius-pill);
	border: 1.5px solid rgba(255, 255, 255, 0.28);
	color: var(--hm-white);
	text-decoration: none;
	font: 600 15px/1 var(--font-sans);
	transition: background var(--duration-base) var(--ease-standard);
}

.hm-tl-back a:hover {
	background: rgba(255, 255, 255, 0.08);
}

@media (max-width: 700px) {
	.hm-tl-back {
		padding-bottom: 64px;
	}
}