/*
 * Top Stories UG: brand CSS (build ladder rung 4).
 * Only what Blocksy settings can't do. Keep scoped and minimal.
 */

/* Tokens that have no Blocksy palette slot. */
:root {
	--tsug-red: #e30613;
	--tsug-deep-red: #c00511;
	--tsug-ink: #141414;
	--tsug-meta: #6b6b6b;
	--tsug-yellow: #fed724;
	--tsug-grey-bg: #f4f4f4;
	--tsug-border: #e2e2e2;
	--tsug-whatsapp: #25d366;
}

/* Header date line (Montserrat 400, 13px, meta grey). */
.tsug-date {
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

/* The logo PNG has an opaque white background: blend it into grey areas (footer, off-canvas). */
.tsug-logo-multiply img {
	mix-blend-mode: multiply;
}

/* Footer: full-width tricolour rule on top (design: 4px, black/yellow/red thirds). */
#footer::before {
	content: "";
	display: block;
	height: 4px;
	background: linear-gradient(90deg, var(--tsug-ink) 0 33.333%, var(--tsug-yellow) 33.333% 66.666%, var(--tsug-red) 66.666% 100%);
}

/* Footer logo at the design's 52px (the widget image otherwise renders at its natural size). */
.tsug-footer-brand img {
	height: 52px;
	width: auto;
	max-width: 100%;
}

/* WhatsApp buttons: #25D366 with an ink label (never white text on this green; SPEC §6.2). */
#offcanvas [data-id="button"] .ct-button,
.tsug-whatsapp-button .wp-block-button__link {
	background-color: var(--tsug-whatsapp);
	border-color: var(--tsug-whatsapp);
	color: var(--tsug-ink);
}

#offcanvas [data-id="button"] .ct-button:hover,
.tsug-whatsapp-button .wp-block-button__link:hover {
	background-color: #1ebe5a;
	border-color: #1ebe5a;
	color: var(--tsug-ink);
}

/* Footer column 1 description and the "Follow us" label (design: Source Serif 16/1.55; Montserrat caps 12). */
.tsug-footer-desc {
	font: 400 16px/1.55 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
	max-width: 420px;
	margin: 18px 0 0;
}

.tsug-footer-label {
	font: 600 12px/1 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--tsug-ink);
	margin: 0 0 12px;
}

/* Black-yellow-red tricolour rule (under section headings, 72×4, three equal segments). */
.tsug-rule {
	display: block;
	width: 72px;
	height: 4px;
	background: linear-gradient(90deg, var(--tsug-ink) 0 33.333%, var(--tsug-yellow) 33.333% 66.666%, var(--tsug-red) 66.666% 100%);
	border: 0;
	margin: 8px 0 0;
}

/* Red text on grey (#F4F4F4) uses deep red: brand red is only 4.4:1 there (SPEC §6.2). */
.tsug-on-grey {
	--theme-link-initial-color: var(--tsug-deep-red);
	--theme-link-hover-color: var(--tsug-ink);
}

.tsug-on-grey .entry-meta [data-type="pill"] a,
.tsug-on-grey .meta-categories a {
	color: var(--tsug-deep-red);
}

/* Card headlines: 3 lines max with an ellipsis; the article H1 always shows in full. */
:is(.entries, .ct-related-posts-items, .ct-query-template-default, .wp-block-blocksy-query) :is(.entry-title, .related-entry-title) {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ==========================================================================
   Breaking bar (SPEC §4.1): red strip above the header, folds into the sticky header
   ========================================================================== */

.tsug-breaking__bar {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 10px 16px;
	background: var(--tsug-red);
	color: #fff;
	text-decoration: none;
}

.tsug-breaking__bar:hover,
.tsug-breaking__bar:focus-visible {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: var(--tsug-yellow);
	text-decoration-thickness: 3px;
	text-underline-offset: 4px;
}

.tsug-breaking__label {
	flex-shrink: 0;
	margin-top: 1px;
	padding: 5px 6px 4px;
	background: #fff;
	color: var(--tsug-red);
	font: 700 11px/1 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.tsug-breaking__headline {
	font: 600 14px/1.35 'Montserrat', system-ui, sans-serif;
}

@media (min-width: 1000px) {
	.tsug-breaking__bar {
		align-items: center;
		gap: 16px;
		padding: 12px max(16px, calc((100% - 1200px) / 2));
	}

	.tsug-breaking__label {
		margin-top: 0;
		padding: 6px 8px 5px;
		font-size: 12px;
	}

	.tsug-breaking__headline {
		font-size: 16px;
		line-height: 1.3;
	}
}

/* Folded pill inside the sticky header: hidden until the strip scrolls away. */
.tsug-pill {
	display: none;
	align-items: center;
	gap: 8px;
	min-width: 0;
	color: var(--tsug-ink);
	text-decoration: none;
}

.tsug-breaking-folded .tsug-pill {
	display: flex;
	animation: tsug-fade-in 0.2s ease-out;
}

.tsug-pill__icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
}

.tsug-pill__text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.tsug-pill__label {
	color: var(--tsug-red);
	font: 700 10px/1 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.tsug-pill__headline {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font: 600 13px/1.2 'Montserrat', system-ui, sans-serif;
}

/* Mobile: the pill replaces the logo; the row keeps its 56px height and gets a red rule. */
.tsug-breaking-folded #header [data-device="mobile"] .tsug-pill-row .ct-container {
	grid-template-columns: auto minmax(0, 1fr) auto;
	box-shadow: inset 0 -3px 0 var(--tsug-red);
}

.tsug-breaking-folded #header [data-device="mobile"] .tsug-pill-row [data-column="middle"] {
	justify-content: flex-start;
	min-width: 0;
	padding: 0 6px;
}

.tsug-breaking-folded #header [data-device="mobile"] [data-column="middle"] .site-logo-container {
	display: none;
}

/* Too narrow for the headline: show the BREAKING pill only (still a link to the story). */
@media (max-width: 339px) {
	.tsug-pill--mobile .tsug-pill__headline {
		display: none;
	}
}

/* Desktop: the pill sits before the search icon in the sticky nav row, without the icon. */
.tsug-pill--desktop {
	max-width: 420px;
	margin-inline-end: 16px;
}

.tsug-pill--desktop .tsug-pill__icon {
	display: none;
}

/* Blocksy's end column is a grid (items stack); lay the pill and search side by side. */
.tsug-breaking-folded #header [data-device="desktop"] [data-row*="bottom"] [data-column="end"] {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.tsug-breaking-folded #header [data-device="desktop"] [data-row*="bottom"] .ct-container {
	box-shadow: inset 0 -3px 0 var(--tsug-red);
}

@keyframes tsug-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* ==========================================================================
   Share buttons (Blocksy Share Box): WhatsApp first and green, the rest neutral
   ========================================================================== */

.single-post .ct-share-box > div {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
}

.single-post .ct-share-box a[data-network]:not([data-network="whatsapp"]) {
	flex: 0 0 44px;
}

/* Mobile: the WhatsApp button takes the spare width in both the top row and the bar. */
@media (max-width: 768px) {
	.single-post .ct-share-box a[data-network="whatsapp"] {
		max-width: none;
	}
}

.single-post .ct-share-box a[data-network] {
	--official-color: #fff;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--tsug-border);
	border-radius: 2px;
	background: #fff;
	color: var(--tsug-ink);
	--theme-icon-color: var(--tsug-ink);
	--theme-icon-hover-color: var(--tsug-ink);
}

.single-post .ct-share-box a[data-network] svg {
	fill: var(--tsug-ink);
}

/* Blocksy's type-2 box paints each icon on its official colour: neutralise it. */
.single-post .ct-share-box a[data-network] .ct-icon-container {
	width: auto;
	height: auto;
	background: none;
}

.single-post .ct-share-box a[data-network="whatsapp"] {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 240px;
	gap: 8px;
	border-color: var(--tsug-whatsapp);
	background: var(--tsug-whatsapp);
	color: var(--tsug-ink);
	font: 600 15px/1 'Montserrat', system-ui, sans-serif;
}

/* White WhatsApp mark (brand icon), ink label: never white text on this green. */
.single-post .ct-share-box a[data-network="whatsapp"] svg {
	fill: #fff;
}

.single-post .ct-share-box a[data-network="whatsapp"]::after {
	content: "Share";
}

/* ==========================================================================
   Mobile sticky share bar (SPEC §4.2): Blocksy's bottom Share Box, fixed at ≤768px
   ========================================================================== */

@media (max-width: 768px) {
	.single-post .ct-share-box[data-location="bottom"] {
		position: fixed;
		z-index: 40;
		left: 0;
		right: 0;
		bottom: 0;
		margin: 0;
		max-width: none;
		padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px));
		background: #fff;
		border-top: 1px solid var(--tsug-border);
		transform: translateY(0);
		transition: transform 0.2s ease-out;
	}

	.single-post .ct-share-box[data-location="bottom"] a[data-network="whatsapp"]::after {
		content: "WhatsApp";
	}

	/* The bar is 52px: WhatsApp, Facebook, X, copy link (Telegram stays in the top row). */
	.single-post .ct-share-box[data-location="bottom"] a[data-network="telegram"] {
		display: none;
	}

	.single-post .ct-share-box.tsug-share-hidden {
		transform: translateY(110%);
	}

	/* The bar never covers text. */
	.single-post #main-container {
		padding-bottom: calc(52px + env(safe-area-inset-bottom, 0px));
	}
}

/* Reduced motion: no fold fade, no bar slide. */
@media (prefers-reduced-motion: reduce) {
	.tsug-breaking-folded .tsug-pill {
		animation: none;
	}

	.single-post .ct-share-box[data-location="bottom"] {
		transition: none;
	}
}

/* ==========================================================================
   Homepage (Homepage.dc.html). Mobile first; desktop grid from 1000px (Blocksy "lg").
   Built from Blocksy Advanced Posts blocks with tsug-* named queries; one card
   template (.tsug-card) laid out per context below.
   ========================================================================== */

.tsug-home {
	--tsug-gap: 24px;
}

/* Blocks inside the homepage handle their own spacing. */
.tsug-home .is-layout-flow > *,
.tsug-home .wp-block-group > * {
	margin-block: 0;
}

.tsug-home-date {
	padding-top: 14px;
	font: 400 12px/1 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

.tsug-home-date p {
	margin: 0;
}

/* --- Card parts ----------------------------------------------------------- */

.tsug-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tsug-card__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.tsug-thumb {
	display: block;
	aspect-ratio: 16 / 9;
	background: #ececea;
	overflow: hidden;
}

.tsug-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tsug-kicker,
.tsug-kicker a {
	font: 600 12px/1.2 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--tsug-red);
	text-decoration: none;
}

.tsug-on-grey .tsug-kicker a {
	color: var(--tsug-deep-red);
}

.tsug-title {
	font: 700 18px/1.28 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tsug-title a {
	color: inherit;
	text-decoration: none;
}

.tsug-title a:hover {
	text-decoration: underline;
	text-decoration-color: var(--tsug-yellow);
	text-decoration-thickness: 3px;
	text-underline-offset: 4px;
}

.tsug-excerpt {
	font: 400 15px/1.5 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tsug-meta {
	gap: 4px !important;
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

.tsug-meta a {
	color: inherit;
}

/* Small card: thumbnail left (120px), text right; no excerpt, no byline. */
.tsug-list-small .tsug-card,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-card {
	flex-direction: row;
	align-items: flex-start;
	gap: 12px;
}

.tsug-list-small .tsug-thumb,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-thumb {
	flex: 0 0 120px;
}

.tsug-list-small :is(.tsug-excerpt, .tsug-author),
.tsug-list-section .wp-block-post:not(:first-child) :is(.tsug-excerpt, .tsug-author) {
	display: none;
}

.tsug-list-small .tsug-title,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-title {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
}

.tsug-list-small .tsug-time time::before,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-time time::before {
	content: "";
}

/* The "· " separator only makes sense after the byline. */
.tsug-list-small .tsug-time,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-time {
	font-size: 0;
}

.tsug-list-small .tsug-time time,
.tsug-list-section .wp-block-post:not(:first-child) .tsug-time time {
	font-size: 13px;
}

/* --- Lead block ----------------------------------------------------------- */

.tsug-lead-block {
	display: grid;
	gap: 20px;
	padding-top: 14px;
}

.tsug-list-lead .tsug-title {
	font-size: 26px;
	line-height: 1.18;
	-webkit-line-clamp: unset;
}

.tsug-list-lead .tsug-excerpt {
	font-size: 17px;
	line-height: 1.5;
	-webkit-line-clamp: 3;
}

.tsug-list-small .ct-query-template-default,
.tsug-list-section .ct-query-template-default,
.tsug-list-latest .ct-query-template-grid {
	display: grid;
	gap: 16px;
}

.tsug-list-small .wp-block-post + .wp-block-post {
	padding-top: 16px;
	border-top: 1px solid var(--tsug-border);
}

/* --- Sections ------------------------------------------------------------- */

.tsug-section {
	margin-top: 40px !important;
}

.tsug-section__head {
	align-items: baseline;
}

.tsug-section__title {
	margin: 0;
	font: 700 22px/1.2 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

.tsug-more {
	margin: 0;
	white-space: nowrap;
}

.tsug-more a {
	font: 600 14px/1 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-red);
	text-decoration: none;
}

.tsug-on-grey .tsug-more a {
	color: var(--tsug-deep-red);
}

:is(.tsug-home, .ct-sidebar) hr.tsug-rule {
	width: 72px;
	max-width: 72px;
	height: 4px;
	margin: 10px 0 20px !important;
	opacity: 1;
	border: 0;
}

.tsug-section--grey {
	padding: 24px 16px;
	margin-inline: -16px;
	background: var(--tsug-grey-bg);
}

.tsug-list-section .wp-block-post:first-child .tsug-title {
	font-size: 20px;
	line-height: 1.25;
}

.tsug-list-latest .ct-query-template-grid {
	grid-template-columns: minmax(0, 1fr) !important;
}

/* Latest News on mobile/tablet: the same row layout as small cards. */
@media (max-width: 999.98px) {
	.tsug-list-latest .tsug-card {
		flex-direction: row;
		align-items: flex-start;
		gap: 12px;
	}

	.tsug-list-latest .tsug-thumb {
		flex: 0 0 120px;
	}

	.tsug-list-latest :is(.tsug-excerpt, .tsug-author) {
		display: none;
	}

	.tsug-list-latest .tsug-title {
		font-size: 16px;
		font-weight: 600;
		line-height: 1.3;
	}

	.tsug-list-latest .tsug-time {
		font-size: 0;
	}

	.tsug-list-latest .tsug-time time {
		font-size: 13px;
	}

	.tsug-list-latest .wp-block-post + .wp-block-post,
	.tsug-list-section .wp-block-post + .wp-block-post {
		padding-top: 16px;
		border-top: 1px solid var(--tsug-border);
	}

	.tsug-section--grey .wp-block-post + .wp-block-post {
		border-top-color: #dcdcdc;
	}
}

/* --- Boxes: Trending, Morning Briefing, WhatsApp --------------------------- */

.tsug-box {
	margin-top: 40px !important;
}

.tsug-list-trending .ct-query-template-default {
	counter-reset: tsug-trend;
	display: grid;
	gap: 16px;
}

.tsug-list-trending .wp-block-post {
	counter-increment: tsug-trend;
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr);
	align-items: start;
}

.tsug-list-trending .wp-block-post::before {
	content: counter(tsug-trend);
	font: 700 28px/1 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-red);
}

.tsug-list-trending .tsug-trending__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.tsug-list-trending .tsug-title {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
}

.tsug-trending__cat a {
	color: inherit;
	text-decoration: none;
}

.tsug-newsletter {
	padding: 24px;
	background: var(--tsug-grey-bg);
}

.tsug-newsletter hr.tsug-rule {
	width: 40px;
	margin: 0 0 16px !important;
}

.tsug-box__title {
	margin: 0 0 8px !important;
	font: 700 20px/1.25 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

.tsug-box__text {
	margin: 0 0 16px !important;
	font: 400 15px/1.5 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
}

.tsug-box__small {
	margin: 12px 0 0 !important;
	font: 400 12px/1.5 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

.tsug-whatsapp-box {
	padding: 24px;
	border: 1px solid var(--tsug-border);
}

.tsug-whatsapp-button .wp-block-button__link {
	min-height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 2px;
	font: 600 15px/1 'Montserrat', system-ui, sans-serif;
}

.tsug-mobile-boxes {
	display: grid;
	gap: 24px;
	margin-top: 40px !important;
}

.tsug-mobile-boxes .tsug-box {
	margin-top: 0 !important;
}

/* --- Desktop: 792 main + 360 sidebar, lead 2/3 + 4 stacked --------------- */

@media (min-width: 1000px) {
	.tsug-lead-block,
	.tsug-home-body {
		grid-template-columns: minmax(0, 792fr) minmax(0, 360fr);
		column-gap: 48px;
	}

	.tsug-lead-block {
		padding-top: 32px;
	}

	.tsug-home-body {
		display: grid;
		align-items: start;
	}

	.tsug-list-lead .tsug-title {
		font-size: 36px;
		line-height: 1.15;
	}

	.tsug-list-lead .tsug-excerpt {
		font-size: 18px;
	}

	.tsug-list-small .tsug-thumb {
		flex-basis: 140px;
	}

	.tsug-list-small .tsug-title {
		font-size: 17px;
	}

	.tsug-section,
	.tsug-home-sidebar .tsug-box {
		margin-top: 48px !important;
	}

	.tsug-home-sidebar > .tsug-box:first-child {
		margin-top: 48px !important;
	}

	.tsug-section__title {
		font-size: 28px;
	}

	.tsug-list-latest .ct-query-template-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		row-gap: 32px;
		column-gap: 24px;
	}

	.tsug-list-section .ct-query-template-default {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 32px;
		row-gap: 20px;
	}

	.tsug-list-section .wp-block-post:first-child {
		grid-row: span 3;
	}

	.tsug-list-section .wp-block-post:first-child .tsug-title {
		font-size: 22px;
	}

	.tsug-section--grey {
		padding: 32px;
		margin-inline: 0;
	}

	.tsug-home-sidebar {
		display: grid;
		gap: 0;
	}
}

/* ==========================================================================
   Article page (Article.dc.html)
   ========================================================================== */

/* Body: Source Serif 4, 18px mobile / 19px desktop, ~68ch measure (SPEC §4.2). */
.single-post article .entry-content {
	font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
	font-size: 18px;
	line-height: 1.65;
	color: var(--tsug-ink);
}

.single-post article .entry-content > :where(p, ul, ol, h2, h3, h4, blockquote, figure:not(.alignwide):not(.alignfull)) {
	max-width: 68ch;
}

.single-post article .entry-content :where(h2, h3, h4) {
	font-family: 'Montserrat', system-ui, sans-serif;
	font-weight: 700;
	line-height: 1.25;
	margin-top: 1.6em;
}

.single-post article .entry-content h2 {
	font-size: 22px;
}

@media (min-width: 1000px) {
	.single-post article .entry-content {
		font-size: 19px;
	}

	.single-post article .entry-content h2 {
		font-size: 26px;
	}
}

/* Pull quote: short tricolour rule above, serif italic, small attribution. */
.single-post .entry-content .wp-block-pullquote {
	margin: 2em 0;
	padding: 0;
	border: 0;
	text-align: left;
}

.single-post .entry-content .wp-block-pullquote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.single-post .entry-content .wp-block-pullquote blockquote::before {
	content: "";
	position: static;
	display: block;
	opacity: 1;
	transform: none;
	width: 40px;
	height: 4px;
	margin-bottom: 16px;
	background: linear-gradient(90deg, var(--tsug-ink) 0 33.333%, var(--tsug-yellow) 33.333% 66.666%, var(--tsug-red) 66.666% 100%);
}

.single-post .entry-content .wp-block-pullquote p {
	font: italic 400 22px/1.4 'Source Serif 4', Georgia, serif;
	color: var(--tsug-ink);
}

.single-post .entry-content .wp-block-pullquote cite {
	display: block;
	margin-top: 8px;
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	font-style: normal;
	color: var(--tsug-meta);
	text-transform: none;
}

@media (min-width: 1000px) {
	.single-post .entry-content .wp-block-pullquote p {
		font-size: 26px;
	}
}

/* Featured image caption + credit. */
.single-post .ct-featured-image figcaption {
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
	text-align: left;
}


/* Tags: bordered pills, 44px tap targets. */
.single-post .entry-tags-items {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.single-post .entry-tags-items a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--tsug-border);
	border-radius: 2px;
	background: #fff;
	color: var(--tsug-ink);
	font: 500 14px/1 'Montserrat', system-ui, sans-serif;
	text-decoration: none;
}

.single-post .entry-tags-items a:hover {
	border-color: var(--tsug-ink);
}

.single-post .entry-tags-items a span {
	display: none; /* Blocksy's "#" prefix */
}

/* Desktop: the bottom Share Box is only the mobile sticky bar; the top row is enough. */
@media (min-width: 769px) {
	.single-post .ct-share-box[data-location="bottom"] {
		display: none;
	}
}

/* After-article box: newsletter + WhatsApp (synced pattern). */
.tsug-article-cta {
	display: grid;
	gap: 24px;
	margin-top: 40px;
	padding: 24px;
	background: var(--tsug-grey-bg);
}

.tsug-article-cta > * {
	margin: 0 !important;
}

@media (min-width: 690px) {
	.tsug-article-cta {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 32px;
		padding: 28px 32px;
	}

	.tsug-article-cta__whatsapp {
		padding-left: 32px;
		border-left: 1px solid #dcdcdc;
	}
}

/* More from {Section}: headline list with dates on the right. */
.tsug-more-from {
	margin-top: 48px;
}

.tsug-more-from__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
}

.tsug-more-from__all {
	font: 600 14px/1 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-red);
	text-decoration: none;
	white-space: nowrap;
}

.tsug-more-from hr.tsug-rule {
	margin: 10px 0 8px;
	opacity: 1;
}

.tsug-more-from__list {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: 720px;
}

.tsug-more-from__list li {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 4px 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--tsug-border);
}

.tsug-more-from__list a {
	flex: 1 1 280px;
	font: 600 16px/1.35 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
	text-decoration: none;
}

.tsug-more-from__list a:hover {
	text-decoration: underline;
	text-decoration-color: var(--tsug-yellow);
	text-decoration-thickness: 3px;
}

.tsug-more-from__list time {
	font: 400 13px/1.35 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
	white-space: nowrap;
}

/* Sidebar boxes (Main Sidebar widgets on posts and archives). */
.ct-sidebar .tsug-sidebar-box {
	margin-top: 0 !important;
	margin-bottom: 40px;
}

.ct-sidebar .tsug-sidebar-box hr.tsug-rule {
	width: 72px;
	height: 4px;
	margin: 10px 0 20px;
	opacity: 1;
	border: 0;
}

.ct-sidebar .tsug-newsletter hr.tsug-rule {
	width: 40px;
	margin: 0 0 16px;
}

.ct-sidebar .tsug-sidebar-box .wp-block-group > * {
	margin-block: 0;
}

/* Comment policy line. */
.tsug-comment-policy {
	font: 400 14px/1.5 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

/* Article header (Blocksy hero type-1). Blocksy has one meta font for both meta rows,
   so the category row and the byline row are told apart here. */
.single-post .hero-section .entry-meta:first-of-type .meta-categories a,
.single-post .hero-section .entry-meta:first-of-type {
	color: var(--tsug-red);
	font: 600 12px/1.2 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
}

.single-post .hero-section .page-description {
	font: 400 19px/1.5 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
	max-width: 68ch;
}

@media (min-width: 1000px) {
	.single-post .hero-section .page-description {
		font-size: 22px;
		line-height: 1.45;
	}
}

/* Byline: "By {author}" on its own line, then "date · Updated date". */
.single-post .hero-section .entry-meta:last-of-type {
	display: flex;
	flex-wrap: wrap;
	column-gap: 0;
	font: 400 13px/1.5 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0;
	text-transform: none;
	color: var(--tsug-meta);
}

.single-post .hero-section .entry-meta:last-of-type li {
	margin: 0;
}

.single-post .hero-section .entry-meta:last-of-type li::after {
	display: none;
}

.single-post .hero-section .entry-meta:last-of-type .meta-author {
	flex-basis: 100%;
	font-weight: 600;
	color: var(--tsug-ink);
}

.single-post .hero-section .entry-meta:last-of-type .meta-author::before {
	content: "By ";
	font-weight: 400;
	color: var(--tsug-meta);
}

.single-post .hero-section .entry-meta:last-of-type .meta-author a {
	color: inherit;
}

.single-post .hero-section .meta-updated-date::before {
	content: "\00a0· Updated ";
}

/* Related Stories cards: square images, red caps category row, "·" meta separator. */
.ct-related-posts .ct-media-container,
.ct-related-posts .ct-media-container img {
	border-radius: 0;
}

.ct-related-posts .entry-meta .meta-categories a,
.ct-related-posts .entry-meta:has(.meta-categories:only-child) {
	color: var(--tsug-red);
	font: 600 12px/1.2 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
}

.ct-related-posts .entry-meta[data-type*="slash"] li:not(:last-of-type)::after {
	content: "·";
	transform: none;
	opacity: 1;
}

/* ==========================================================================
   Listings: category, tag, search (Listings.dc.html). Blocksy archive cards:
   a.ct-media-container, ul.entry-meta[meta_1] (category), h2.entry-title,
   .entry-excerpt, ul.entry-meta[meta_2] (author + date).
   ========================================================================== */

/* Archive header: title + tricolour rule + serif intro. */
:is(.category, .tag) .hero-section .page-title {
	font: 700 32px/1.15 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

:is(.category, .tag) .hero-section .page-title::after {
	content: "";
	display: block;
	width: 72px;
	height: 4px;
	margin-top: 12px;
	background: linear-gradient(90deg, var(--tsug-ink) 0 33.333%, var(--tsug-yellow) 33.333% 66.666%, var(--tsug-red) 66.666% 100%);
}

.category .hero-section .page-description {
	font: 400 17px/1.55 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
	max-width: 68ch;
}

/* "Category" prefix off; on tag pages it becomes a small "TAG" label above a smaller title. */
.category .page-title .ct-title-label {
	display: none;
}

.tag .page-title .ct-title-label {
	display: block;
	margin-bottom: 6px;
	font: 600 12px/1 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--tsug-meta);
}

.tag .hero-section .page-title {
	font-size: 26px;
}

.tag .hero-section .page-title::after {
	display: none;
}

.tsug-tag-count {
	margin: 0;
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

@media (min-width: 1000px) {
	.category .hero-section .page-title {
		font-size: 40px;
	}

	.tag .hero-section .page-title {
		font-size: 32px;
	}

	.category .hero-section .page-description {
		font-size: 19px;
	}
}

/* Card parts. */
:is(.archive, .search) .entries .entry-card {
	gap: 10px;
}

/* Blocksy stacks 15–30px bottom margins on each card part; the card gap handles spacing. */
:is(.archive, .search) .entries .entry-card > * {
	margin-bottom: 0;
}

:is(.archive, .search) .entries .entry-card > .ct-media-container {
	min-width: 0;
	width: 100%;
	margin-bottom: 4px;
}

:is(.archive, .search) .entries .ct-media-container {
	aspect-ratio: 16 / 9;
	border-radius: 0;
	background: #ececea;
}

:is(.archive, .search) .entries .entry-meta[data-id="meta_1"] a {
	color: var(--tsug-red);
	font: 600 12px/1.2 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
}

:is(.archive, .search) .entries .entry-title {
	font: 700 18px/1.28 'Montserrat', system-ui, sans-serif;
}

:is(.archive, .search) .entries .entry-title a {
	color: var(--tsug-ink);
	text-decoration: none;
}

:is(.archive, .search) .entries .entry-excerpt {
	font: 400 15px/1.5 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

:is(.archive, .search) .entries .entry-meta[data-id="meta_2"] {
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	text-transform: none;
	letter-spacing: 0;
	color: var(--tsug-meta);
}

:is(.archive, .search) .entries .entry-meta[data-id="meta_2"] a {
	color: inherit;
	font: inherit;
	text-transform: none;
}

:is(.archive, .search) .entries .entry-meta[data-id="meta_2"] .meta-author::before {
	content: "By ";
}

:is(.archive, .search) .entries .entry-meta[data-id="meta_2"] li:not(:last-of-type)::after {
	content: "·";
	opacity: 1;
	transform: none;
}

/* Mobile/tablet: lead card stacked, the rest as thumbnail rows with dividers. */
@media (max-width: 999.98px) {
	:is(.archive, .search) .entries {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 16px !important;
	}

	:is(.archive, .search) .entries .entry-card:not(:is(.category, .tag):not(.paged) .entries > .entry-card:first-child) {
		display: grid;
		grid-template-columns: 120px minmax(0, 1fr);
		column-gap: 12px;
		row-gap: 4px;
		align-content: start;
		padding-top: 16px;
		border-top: 1px solid var(--tsug-border);
	}

	:is(.archive, .search) .entries .entry-card:not(:is(.category, .tag):not(.paged) .entries > .entry-card:first-child) > .ct-media-container {
		grid-row: 1 / span 4;
		margin: 0;
	}

	:is(.archive, .search) .entries .entry-card:not(:is(.category, .tag):not(.paged) .entries > .entry-card:first-child) > :not(.ct-media-container) {
		grid-column: 2;
		margin: 0;
	}

	:is(.archive, .search) .entries .entry-card:not(:is(.category, .tag):not(.paged) .entries > .entry-card:first-child) .entry-title {
		font-size: 16px;
		font-weight: 600;
		line-height: 1.3;
	}

	:is(.archive, .search) .entries .entry-card:not(:is(.category, .tag):not(.paged) .entries > .entry-card:first-child) :is(.entry-excerpt, .meta-author) {
		display: none;
	}

	:is(.category, .tag):not(.paged) .entries > .entry-card:first-child .entry-title {
		font-size: 22px;
		line-height: 1.2;
	}
}

/* Desktop category/tag: lead card across both columns, photo left, text right. */
@media (min-width: 1000px) {
	:is(.category, .tag) .entries {
		column-gap: 24px !important;
		row-gap: 40px !important;
	}

	:is(.category, .tag):not(.paged) .entries > .entry-card:first-child {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 24px;
		row-gap: 8px;
		align-content: start;
		padding-bottom: 24px;
		border-bottom: 1px solid var(--tsug-border);
	}

	:is(.category, .tag):not(.paged) .entries > .entry-card:first-child > .ct-media-container {
		grid-row: 1 / span 5;
		margin: 0;
	}

	:is(.category, .tag):not(.paged) .entries > .entry-card:first-child > :not(.ct-media-container) {
		grid-column: 2;
		margin: 0;
	}

	:is(.category, .tag):not(.paged) .entries > .entry-card:first-child .entry-title {
		font-size: 24px;
		line-height: 1.2;
	}

	/* Search on desktop: one column of wide rows, 200px photo left. */
	.search .entries {
		grid-template-columns: minmax(0, 1fr) !important;
		row-gap: 0 !important;
	}

	.search .entries .entry-card {
		display: grid;
		grid-template-columns: 200px minmax(0, 1fr);
		column-gap: 20px;
		row-gap: 6px;
		align-content: start;
		padding: 20px 0;
		border-top: 1px solid var(--tsug-border);
	}

	.search .entries .entry-card > .ct-media-container {
		grid-row: 1 / span 5;
		margin: 0;
	}

	.search .entries .entry-card > :not(.ct-media-container) {
		grid-column: 2;
		margin: 0;
	}

	.search .entries .entry-card .meta-author {
		display: none;
	}
}

/* Search header. */
.tsug-search-head {
	margin-bottom: 24px;
}

.tsug-search-head__title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 16px;
	margin-top: 20px;
}

.tsug-search-head__h1 {
	margin: 0;
	font: 700 24px/1.2 'Montserrat', system-ui, sans-serif;
}

.tsug-search-head__sort {
	font: 400 13px/1 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

@media (min-width: 1000px) {
	.tsug-search-head__h1 {
		font-size: 30px;
	}
}

/* Search box (core Search block): grey-bordered field, red "Search" button. */
.tsug-search .wp-block-search__inside-wrapper {
	max-width: 640px;
	border: 0;
	padding: 0;
}

.tsug-search .wp-block-search__input {
	min-height: 52px;
	padding: 0 16px;
	border: 1px solid #8a8a8a;
	border-right: 0;
	border-radius: 2px 0 0 2px;
	font: 400 17px/1 'Montserrat', system-ui, sans-serif;
}

.tsug-search .wp-block-search__button {
	margin: 0;
	min-height: 52px;
	padding: 0 24px;
	border: 0;
	border-radius: 0 2px 2px 0;
	background: var(--tsug-red);
	color: #fff;
	font: 600 15px/1 'Montserrat', system-ui, sans-serif;
}

.tsug-search .wp-block-search__button:hover {
	background: var(--tsug-deep-red);
}

/* Empty states: no results + 404 (no sidebar, full width). */
.tsug-empty-wrap {
	padding-block: 32px 48px;
}

.tsug-empty > *,
.tsug-empty .wp-block-group > * {
	margin-block: 0;
}

.tsug-empty__title {
	margin: 0 0 16px;
	max-width: 760px;
	font: 700 30px/1.15 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

.tsug-empty__text {
	margin: 0 0 24px !important;
	max-width: 68ch;
	font: 400 18px/1.55 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
}

.tsug-label {
	margin: 32px 0 12px !important;
	font: 600 12px/1 'Montserrat', system-ui, sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--tsug-meta);
}

.tsug-empty--404 > .tsug-label:first-child {
	margin-top: 0 !important;
}

.tsug-section-links {
	gap: 8px;
}

.tsug-section-links .wp-block-button.is-style-outline > .wp-block-button__link,
.tsug-section-links .wp-block-button__link {
	min-height: 44px;
	padding: 12px 18px;
	border: 1px solid var(--tsug-ink);
	border-radius: 2px;
	background: #fff;
	color: var(--tsug-ink);
	font: 600 15px/1.2 'Montserrat', system-ui, sans-serif;
}

.tsug-section-links .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.tsug-section-links .wp-block-button__link:hover {
	background: var(--tsug-ink);
	color: #fff;
}

.tsug-latest-grid {
	margin-top: 48px !important;
}

.tsug-latest-grid .tsug-section__title {
	margin: 0;
	font: 700 26px/1.2 'Montserrat', system-ui, sans-serif;
}

.tsug-latest-grid hr.tsug-rule {
	width: 72px;
	max-width: 72px;
	height: 4px;
	margin: 10px 0 24px;
	opacity: 1;
	border: 0;
}

.tsug-list-grid .ct-query-template-grid {
	display: grid;
	gap: 32px 24px;
	grid-template-columns: minmax(0, 1fr) !important;
}

@media (min-width: 690px) {
	.tsug-list-grid .ct-query-template-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (min-width: 1000px) {
	.tsug-empty__title {
		font-size: 44px;
	}

	.tsug-list-grid-3 .ct-query-template-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}

	.tsug-list-grid-4 .ct-query-template-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}
}

/* ==========================================================================
   Static pages (Static Pages.dc.html): 720px column flush left on the 1200 grid.
   ========================================================================== */

/* Blocksy centres each 720px block ([data-content="narrow"]); the design puts the column
   flush left on the 1200px grid, so align it with the site container's left edge. */
@media (min-width: 1000px) {
	.page:not(.home) main [data-content="narrow"] :is(.hero-section, .entry-content > *) {
		margin-left: max(5%, calc((100% - 1200px) / 2)) !important;
		margin-right: auto !important;
	}
}

.page:not(.home) .hero-section .page-title {
	font: 700 32px/1.15 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

.page:not(.home) .hero-section .page-title::after {
	content: "";
	display: block;
	width: 72px;
	height: 4px;
	margin-top: 14px;
	background: linear-gradient(90deg, var(--tsug-ink) 0 33.333%, var(--tsug-yellow) 33.333% 66.666%, var(--tsug-red) 66.666% 100%);
}

.tsug-page {
	font: 400 18px/1.65 'Source Serif 4', Georgia, serif;
	color: var(--tsug-ink);
}

.tsug-page > * + * {
	margin-top: 1em;
}

.tsug-page h2 {
	margin-top: 1.8em !important;
	font: 700 22px/1.25 'Montserrat', system-ui, sans-serif;
}

.tsug-page h3 {
	font: 700 19px/1.3 'Montserrat', system-ui, sans-serif;
}

.tsug-page ul:not(.tsug-cover-list, .tsug-reach__list, .wp-block-social-links) {
	padding-left: 1.2em;
}

.tsug-page li + li {
	margin-top: 0.4em;
}

.tsug-standfirst {
	margin: 0 0 1.5em !important;
	font: 400 19px/1.5 'Source Serif 4', Georgia, serif;
	color: #3a3a3a;
}

.tsug-updated {
	margin: -8px 0 12px !important;
	font: 400 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-meta);
}

@media (min-width: 1000px) {
	.page:not(.home) .hero-section .page-title {
		font-size: 44px;
	}

	.tsug-page {
		font-size: 19px;
	}

	.tsug-page h2 {
		font-size: 26px;
	}

	.tsug-standfirst {
		font-size: 22px;
		line-height: 1.45;
	}
}

/* "On this page" jump menu: 2 columns, red 01–06. */
.tsug-toc {
	margin: 1.5em 0 2em !important;
	padding: 14px 0 16px;
	border-top: 1px solid var(--tsug-ink);
	border-bottom: 1px solid var(--tsug-border);
}

.tsug-toc .tsug-label {
	margin: 0 0 10px !important;
}

.tsug-toc ol {
	counter-reset: tsug-toc;
	display: grid;
	gap: 6px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 690px) {
	.tsug-toc ol {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.tsug-toc li {
	counter-increment: tsug-toc;
	margin: 0 !important;
	font: 500 15px/1.4 'Montserrat', system-ui, sans-serif;
}

.tsug-toc li::before {
	content: counter(tsug-toc, decimal-leading-zero);
	display: inline-block;
	width: 28px;
	color: var(--tsug-red);
	font-weight: 700;
	font-size: 12px;
}

.tsug-page .tsug-toc a {
	color: var(--tsug-ink);
	text-decoration: none;
}

.tsug-toc a:hover {
	text-decoration: underline;
	text-decoration-color: var(--tsug-yellow);
	text-decoration-thickness: 3px;
}

/* Numbered section headings (01 Original reporting …). */
.tsug-numbered {
	counter-reset: tsug-h;
}

.tsug-numbered > * + * {
	margin-top: 1em;
}

.tsug-numbered h2 {
	counter-increment: tsug-h;
	scroll-margin-top: 80px;
}

.tsug-numbered h2::before {
	content: counter(tsug-h, decimal-leading-zero);
	margin-right: 10px;
	color: var(--tsug-red);
	font-size: 14px;
	vertical-align: middle;
}

.tsug-page a:not(.wp-block-button__link) {
	color: var(--tsug-red);
}

/* Outline link button (Request a correction →). */
.tsug-link-button .wp-block-button.is-style-outline > .wp-block-button__link {
	min-height: 44px;
	padding: 12px 20px;
	border: 1px solid var(--tsug-ink);
	border-radius: 2px;
	background: #fff;
	color: var(--tsug-ink);
	font: 600 15px/1.2 'Montserrat', system-ui, sans-serif;
}

.tsug-link-button .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--tsug-ink);
	color: #fff;
}

/* About: "What we cover" rows and the editor card. */
.tsug-cover-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsug-cover-list li {
	display: grid;
	gap: 4px 20px;
	margin: 0 !important;
	padding: 14px 0;
	border-top: 1px solid var(--tsug-border);
	font-size: 17px;
	line-height: 1.5;
}

.tsug-cover-list strong {
	font: 700 16px/1.4 'Montserrat', system-ui, sans-serif;
}

@media (min-width: 690px) {
	.tsug-cover-list li {
		grid-template-columns: 160px minmax(0, 1fr);
	}
}

.tsug-bio-card {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 2.5em !important;
	padding: 24px;
	border: 1px solid var(--tsug-border);
}

.tsug-bio-card__photo {
	flex: 0 0 96px;
	height: 96px;
	margin: 0 !important;
	border-radius: 50%;
	background: repeating-linear-gradient(135deg, #ececea 0 10px, #e2e2e0 10px 20px);
	display: flex;
	align-items: center;
	justify-content: center;
	font: 400 12px/1 ui-monospace, Menlo, monospace;
	color: var(--tsug-meta);
}

.tsug-bio-card__body {
	flex: 1 1 260px;
	min-width: 0;
}

.tsug-bio-card__body > * {
	margin-block: 0 8px !important;
}

.tsug-bio-card .tsug-label {
	margin: 0 0 4px !important;
	color: var(--tsug-red);
}

.tsug-bio-card__name {
	font: 700 20px/1.25 'Montserrat', system-ui, sans-serif !important;
}

.tsug-bio-card__body p {
	font-size: 16px;
	line-height: 1.5;
	color: #3a3a3a;
}

.tsug-bio-card__social {
	gap: 8px;
}

.tsug-bio-card__social .wp-social-link {
	color: var(--tsug-ink);
}

.tsug-bio-card__social .wp-social-link a {
	padding: 10px;
}

/* Contact: jump link, form intros, "Other ways to reach us". */
.tsug-jump__links a {
	font: 600 15px/1.4 'Montserrat', system-ui, sans-serif;
	text-decoration: none;
}

.tsug-form-intro {
	font-size: 16px;
	color: #3a3a3a;
}

.tsug-page h2#advertising-enquiry {
	padding-top: 32px;
	border-top: 1px solid var(--tsug-border);
}

.tsug-reach {
	margin-top: 40px !important;
	padding-top: 32px;
	border-top: 1px solid var(--tsug-border);
}

.tsug-reach__list {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
	font: 500 16px/1.5 'Montserrat', system-ui, sans-serif;
}

.tsug-reach__list li {
	margin: 0 0 12px !important;
}

/* ==========================================================================
   Formidable forms (.tsug-form): labels, 48px fields, red focus/errors, red submit.
   Styled here rather than in Formidable › Styles so brand values stay in one place.
   ========================================================================== */

.frm_forms .tsug-form {
	--tsug-field-border: #8a8a8a;
	max-width: 720px;
	font-family: 'Montserrat', system-ui, sans-serif;
}

.frm_forms .tsug-form .frm_form_field {
	margin-bottom: 18px;
}

.frm_forms .tsug-form label.frm_primary_label {
	margin-bottom: 8px;
	padding: 0;
	font: 600 14px/1.2 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

.frm_forms .tsug-form .frm_required {
	color: var(--tsug-red);
}

.frm_forms .tsug-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--tsug-field-border);
	border-radius: 2px;
	background: #fff;
	color: var(--tsug-ink);
	font: 400 16px/1.4 'Montserrat', system-ui, sans-serif;
	box-shadow: none;
}

.frm_forms .tsug-form textarea {
	min-height: 128px;
}

.frm_forms .tsug-form :is(input, select, textarea):focus {
	border-color: var(--tsug-ink) !important;
	outline: 3px solid var(--tsug-ink);
	outline-offset: 1px;
	box-shadow: none;
}

.frm_forms .tsug-form ::placeholder {
	color: #8a8a8a;
}

/* Errors: 2px red border + a message under the field. */
.frm_forms .tsug-form .frm_blank_field :is(input, select, textarea),
.frm_forms .tsug-form .frm_blank_field :is(input, select, textarea):focus {
	border: 2px solid var(--tsug-red) !important;
	outline-color: var(--tsug-red);
}

.frm_forms .tsug-form .frm_error {
	margin-top: 6px;
	padding: 0;
	font: 500 13px/1.4 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-red);
}

.frm_forms .tsug-form .frm_error_style,
.tsug-page .frm_forms .frm_error_style {
	margin-bottom: 16px;
	padding: 12px 14px;
	border: 0;
	border-left: 4px solid var(--tsug-red);
	border-radius: 0;
	background: #fff5f5;
	color: var(--tsug-ink);
	font: 600 14px/1.4 'Montserrat', system-ui, sans-serif;
}

.frm_forms .tsug-form .frm_submit button,
.frm_forms .tsug-form .frm_submit input[type="submit"] {
	min-height: 48px;
	padding: 0 28px;
	border: 0;
	border-radius: 2px;
	background: var(--tsug-red);
	color: #fff;
	font: 600 15px/1 'Montserrat', system-ui, sans-serif;
	box-shadow: none;
}

.frm_forms .tsug-form .frm_submit button:hover {
	background: var(--tsug-deep-red);
}

@media (max-width: 689.98px) {
	.frm_forms .tsug-form .frm_submit button {
		width: 100%;
	}
}

/* Success: grey confirmation box with a tick. */
.tsug-page .frm_forms .frm_message {
	position: relative;
	margin: 0 0 16px;
	padding: 24px 24px 24px 64px;
	border: 0;
	border-radius: 0;
	background: var(--tsug-grey-bg);
	color: #3a3a3a;
	font: 400 16px/1.5 'Source Serif 4', Georgia, serif;
}

.tsug-page .frm_forms .frm_message::before {
	content: "✓";
	position: absolute;
	left: 24px;
	top: 24px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--tsug-ink);
	color: #fff;
	font: 700 14px/26px 'Montserrat', system-ui, sans-serif;
	text-align: center;
}

.tsug-form-done__title {
	display: block;
	margin-bottom: 4px;
	font: 700 18px/1.3 'Montserrat', system-ui, sans-serif;
	color: var(--tsug-ink);
}

/* No MailPoet form yet (Phase 10 decision): hide the Morning Briefing boxes; the
   after-article box becomes WhatsApp only. See includes/newsletter.php. */
.tsug-no-newsletter :is(.tsug-newsletter, .tsug-article-cta__newsletter) {
	display: none !important;
}

.tsug-no-newsletter .tsug-article-cta {
	grid-template-columns: minmax(0, 1fr);
}

.tsug-no-newsletter .tsug-article-cta__whatsapp {
	padding-left: 0;
	border-left: 0;
}

@media (min-width: 690px) {
	.tsug-no-newsletter .tsug-article-cta__whatsapp {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		column-gap: 32px;
		align-items: center;
	}

	.tsug-no-newsletter .tsug-article-cta__whatsapp .tsug-whatsapp-button {
		grid-column: 2;
		grid-row: 1 / span 2;
		min-width: 240px;
	}
}

/* Footer copyright link: underlined, not told apart by colour alone (WCAG 1.4.1). */
#footer .ct-footer-copyright a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ==========================================================================
   Tap targets ≥ 44px (SPEC §6.3). Hit areas grow; negative margins keep the layout.
   ========================================================================== */

#header :is(.ct-header-trigger, .ct-header-search) {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

#header .site-logo-container {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

:is(.tsug-kicker, .meta-categories, .tsug-trending__cat) a,
.tsug-more a,
.tsug-more-from__all,
.tsug-jump__links a {
	display: inline-block;
	padding-block: 15px;
	margin-block: -15px;
}

/* Headline links: full-height hit area even for two-line titles. */
:is(.tsug-title, .entry-title, .related-entry-title) a {
	display: inline-block;
	padding-block: 3px;
	margin-block: -3px;
}

:is(#footer, #offcanvas) .ct-social-box a {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.ct-pagination :is(a, span) {
	min-width: 44px;
	min-height: 44px;
}