/**
 * Single Post: Tags + Related Stories
 *
 * .single-post-tags — wrapper for the tag pill row.
 * .wom.related-stories — overrides for the related stories slider section
 *   (card/slider styles come from whats_on_module.css, enqueued on single posts).
 *
 * Breakpoints: 768px, 480px
 */

/* -----------------------------------------------------------------------
   Post Tags — pill row below page-builder content
----------------------------------------------------------------------- */
.single-post-tags {
	padding: 48px 40px 30px;
}

.single-post-tags__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Tags link to their archive — keep them readable without hover underline. */
.single-post-tags__tag {
	text-decoration: none;
}

.single-post-tags__tag:hover,
.single-post-tags__tag:focus-visible {
	background-color: var(--yellow);
	border-color: var(--yellow);
}

/* -----------------------------------------------------------------------
   Related Stories — overrides on top of .wom base styles
----------------------------------------------------------------------- */

.wom.related-stories {
	padding-top:15px
}

.related-stories__inner {
	border-top: 1px solid #111111;
	padding-top: 0px;
}

.related-stories__inner .introduction-module__heading {
  font-size: clamp(36px, 4.5vw, 38px);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.8px;
  text-transform: uppercase;
  color: var(--black);
}

/* -----------------------------------------------------------------------
   Responsive
----------------------------------------------------------------------- */
@media (max-width: 992px) {
	.wom.related-stories .wom__header-right {
		display: none;
	}
}

@media (max-width: 768px) {
	.single-post-tags {
		padding: 40px 24px 0;
	}
}

@media (max-width: 480px) {
	.single-post-tags {
		padding: 32px 20px 0;
	}
}