/*
 * Mamer Topic Hub v1.0.3 — publication-state cleanup.
 * Public pages show only published destinations as links while planned topic
 * structure can remain useful, calm editorial content without "under construction" UI.
 */

.topic-hub {
	padding-bottom: 8px;
}

.topic-hub__breadcrumbs {
	color: #5f7077;
}

.topic-hub__breadcrumbs a {
	color: #4f6269;
}

.topic-hub__section {
	padding-top: 44px;
	padding-bottom: 44px;
}

.topic-hub__section--quick {
	padding-top: 38px;
}

.topic-hub__quick-grid:not(.topic-hub__quick-grid--v2):not(.topic-hub__quick-grid--illustrated) .topic-hub__quick-card small {
	color: #5e7077;
	font-size: 12px;
	line-height: 18px;
}

.topic-hub__featured-copy > strong {
	font-size: 29px;
	line-height: 35px;
}

.topic-hub__featured-copy > span:not(.topic-hub__label) {
	color: #52656c;
	font-size: 14px;
	line-height: 22px;
}

.topic-hub__featured-media {
	min-height: 320px;
}

.topic-hub__start-grid--feature-only,
.topic-hub__start-grid--list-only {
	grid-template-columns: minmax(0, 820px);
}

.topic-hub__start-grid--list-only .topic-hub__start-list {
	max-width: 720px;
}

.topic-hub__section--age {
	padding-top: 40px;
	padding-bottom: 40px;
}

/*
 * A general Topic Hub is not an Age Hub. Published and planned months therefore
 * share the same neutral resting state; only a real link reveals itself on
 * hover/focus. A selected state remains available for future age-scoped hubs.
 */
.topic-hub__month.is-available:not(.is-selected),
.topic-hub__month.is-unavailable {
	border-color: var(--mamer-border);
	background: #fff;
	color: #29434d;
	opacity: 1;
}

.topic-hub__month.is-unavailable {
	cursor: default;
}

.topic-hub__month.is-unavailable:hover {
	transform: none;
	border-color: var(--mamer-border);
	box-shadow: none;
}

/* Planned topic categories stay informative, but no longer imitate links. */
.topic-hub__group-card.is-static {
	cursor: default;
}

/*
 * Desktop editorial hierarchy: one visual anchor, five compact navigational
 * cards. This intentionally replaces the heavier image mosaic from v1.
 */
@media (min-width: 1024px) {
	.topic-hub__group-grid {
		grid-template-columns: minmax(0, 1.24fr) minmax(0, .88fr) minmax(0, .88fr);
		grid-template-areas:
			"a b c"
			"a d e"
			"a f f";
		gap: 12px;
		align-items: stretch;
	}

	.topic-hub__group-card.is-featured {
		min-height: 100%;
	}

	.topic-hub__group-card.is-featured img {
		height: 245px;
	}

	.topic-hub__group-card:not(.is-featured) {
		min-height: 126px;
		justify-content: center;
	}

	.topic-hub__group-card:not(.is-featured) img {
		display: none;
	}

	.topic-hub__group-card:not(.is-featured) > span {
		padding: 17px 42px 17px 17px;
	}

	.topic-hub__group-card:not(.is-featured) > span > strong {
		font-size: 19px;
		line-height: 24px;
	}

	.topic-hub__group-card:not(.is-featured) > span > small {
		font-size: 12.5px;
		line-height: 18px;
	}

	/* The final wide row deliberately closes the editorial grid. */
	.topic-hub__group-card:nth-child(6):not(.is-featured) {
		background: linear-gradient(90deg, #fff, rgba(238,245,241,.34));
	}

	.topic-hub__faq-wrap {
		max-width: 1100px;
	}
}

.topic-hub__article-row small {
	font-size: 9.5px;
	line-height: 14px;
}

.topic-hub__article-row em {
	color: #67777d;
	font-size: 11.5px;
	line-height: 16px;
}

.topic-hub__section--trust {
	padding-top: 36px;
	padding-bottom: 36px;
}

.topic-hub__section--related {
	padding-top: 22px;
	padding-bottom: 0;
}

@media (hover: hover) and (pointer: fine) {
	.topic-hub__group-card.is-static:hover {
		transform: none;
		border-color: var(--mamer-border);
		box-shadow: none;
	}

	.topic-hub__group-card.is-static:hover > span > strong {
		color: inherit;
	}
}

@media (max-width: 767px) {
	.topic-hub {
		padding-bottom: 4px;
	}

	.topic-hub__breadcrumbs {
		color: #5e6f76;
		font-size: 11px;
	}

	.topic-hub__section {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.topic-hub__section--quick {
		padding-top: 27px;
	}

	.topic-hub__quick-grid:not(.topic-hub__quick-grid--v2):not(.topic-hub__quick-grid--illustrated) .topic-hub__quick-card {
		min-height: 126px;
		padding: 14px 9px;
	}

	.topic-hub__quick-grid:not(.topic-hub__quick-grid--v2):not(.topic-hub__quick-grid--illustrated) .topic-hub__quick-card strong {
		font-size: 13.5px;
		line-height: 18px;
	}

	.topic-hub__quick-grid:not(.topic-hub__quick-grid--v2):not(.topic-hub__quick-grid--illustrated) .topic-hub__quick-card small {
		font-size: 12.5px;
		line-height: 18px;
	}

	.topic-hub__featured-copy > strong {
		font-size: 25px;
		line-height: 30px;
	}

	.topic-hub__featured-copy > span:not(.topic-hub__label) {
		font-size: 13.5px;
		line-height: 21px;
	}

	.topic-hub__start-grid--feature-only,
	.topic-hub__start-grid--list-only {
		display: block;
	}

	.topic-hub__section--age {
		padding-top: 29px;
		padding-bottom: 29px;
	}

	.topic-hub__age-panel .topic-hub__section-heading {
		margin-bottom: 19px;
	}

	.topic-hub__group-grid {
		gap: 8px;
	}

	.topic-hub__group-card.is-featured img {
		height: 188px;
	}

	.topic-hub__group-card:not(.is-featured) {
		min-height: 0;
	}

	.topic-hub__group-card:not(.is-featured) img {
		display: none;
	}

	.topic-hub__group-card:not(.is-featured) > span {
		padding: 14px 38px 14px 14px;
	}

	.topic-hub__group-card:not(.is-featured) > span > strong {
		margin-bottom: 3px;
		font-size: 17px;
		line-height: 22px;
	}

	.topic-hub__group-card:not(.is-featured) > span > small {
		font-size: 12.5px;
		line-height: 18px;
	}

	.topic-hub__article-row small {
		font-size: 9.5px;
		line-height: 13px;
	}

	.topic-hub__article-row strong {
		font-size: 13.5px;
		line-height: 18px;
	}

	.topic-hub__article-row em {
		font-size: 11.5px;
	}

	.topic-hub__trust p,
	.topic-hub__faq details > p {
		font-size: 13px;
		line-height: 20px;
	}

	.topic-hub__section--trust {
		padding-top: 27px;
		padding-bottom: 27px;
	}

	.topic-hub__section--related {
		padding-top: 20px;
		padding-bottom: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.topic-hub__quick-grid:not(.topic-hub__quick-grid--v2):not(.topic-hub__quick-grid--illustrated) .topic-hub__quick-card,
	.topic-hub__featured,
	.topic-hub__start-row,
	.topic-hub__group-card,
	.topic-hub__article-row,
	.topic-hub__month,
	.topic-hub__related a {
		transition: none !important;
	}
}


