/*
 * Topic Express — editorial design system
 *
 * Loaded after Newsmatic's dynamic customizer CSS, so plain selectors win.
 * Structure: tokens, typography, header, hero, cards, sidebar, article,
 * ad zones, footer, dark mode, responsive.
 */

/* ------------------------------------------------------------------ tokens */

body.newsmatic_main_body,
body.newsmatic_dark_mode {
	--te-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
	--te-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

	--te-paper: #fcfbf9;
	--te-surface: #ffffff;
	--te-surface-2: #f4f2ee;
	--te-ink: #11151b;
	--te-ink-2: #454e5c;
	--te-muted: #78818f;
	--te-rule: #e7e3dc;
	--te-rule-strong: #d5cfc5;
	--te-navy: #0b2a4a;
	--te-navy-ink: #0b2a4a;
	--te-crimson: #c8102e;
	--te-on-dark: #f2f6fb;
}

body.newsmatic_dark_mode {
	--te-paper: #0d1014;
	--te-surface: #141920;
	--te-surface-2: #1a2029;
	--te-ink: #f0f2f5;
	--te-ink-2: #b3bcc9;
	--te-muted: #8b95a4;
	--te-rule: #242b35;
	--te-rule-strong: #333c48;
	--te-navy: #0f2b47;
	--te-navy-ink: #9fc2e6;
	--te-crimson: #ff5566;
}

/* ------------------------------------------------- retune Newsmatic tokens */

/*
 * Newsmatic drives most of its chrome from CSS variables, so pointing those at
 * the palette above restyles components this file never selects directly
 * (green accents, block rules, toggles, back-to-top, breadcrumbs).
 */
body.newsmatic_main_body,
body.newsmatic_dark_mode {
	--theme-block-top-border-color: var(--te-navy-ink);
	--theme-block-top-border-height: 2px;
	--theme-color-red: var(--te-crimson);

	--menu-family: var(--te-sans);
	--submenu-family: var(--te-sans);
	--menu-color: var(--te-ink-2);
	--menu-color-hover: var(--te-crimson);
	--menu-color-active: var(--te-ink);
	--menu-border-top-color: var(--te-crimson);
	--menu-color-submenu: var(--te-ink-2);
	--menu-color-submenu-hover: var(--te-crimson);
	--menu-bk-color: transparent;
	--mobile-menu-bk-color: var(--te-surface);
	--mobile-menu-icon-color: var(--te-ink);

	--block-title-family: var(--te-sans);
	--block-title-color: var(--te-navy-ink);
	--post-title-family: var(--te-serif);
	--post-title-color: var(--te-ink);
	--single-title-family: var(--te-serif);
	--single-content-family: var(--te-serif);
	--content-family: var(--te-sans);
	--meta-family: var(--te-sans);
	--single-meta-family: var(--te-sans);
	--post-meta-font: var(--te-sans);
	--meta-text-color: var(--te-muted);
	--post-meta-color: var(--te-muted);
	--post-content-color: var(--te-ink-2);
	--main-content-text-color: var(--te-ink-2);
	--body-text-default-color: var(--te-ink);

	--border-line-color: var(--te-rule);
	--border-bottom-color: var(--te-rule);
	--submenu-border-btm-color: var(--te-rule);
	--noimg-bk-color: var(--te-surface-2);

	--site-bk-color: var(--te-paper);
	--main-bk-color: var(--te-paper);
	--header-bk-color: var(--te-surface);
	--theme-content-bk-color: transparent;
	--inner-container-bk: transparent;
	--single-content-bk-color: transparent;
	--archive-content-bk-color: transparent;
	--search-content-bk-color: transparent;
	--banner-content-bk-color: transparent;
	--404-error-content-bk-color: transparent;
	--full-width-section-bk-color: transparent;
	--full-width-content-bk-color: transparent;
	--full-width-bottom-section-bk-color: transparent;
	--full-width-bottom-content-bk-color: transparent;
	--leftc-rights-section-bk-color: transparent;
	--leftc-rights-content-bk-color: transparent;
	--lefts-rightc-section-bk-color: transparent;
	--lefts-rightc-content-bk-color: transparent;
	--ticker-outer-bk-color: transparent;
	--ticker-inner-bk-color: var(--te-surface);

	--top-header-bk-color: var(--te-navy);
	--top-header-dt-color: #d8e3ef;
	--top-header-menu-color: #d8e3ef;
	--top-header-menu-color-hover: #ffffff;
	--top-header-social-color: #d8e3ef;
	--top-header-social-color-hover: #ffffff;

	--breadcrumb-background-color: transparent;
	--breadcrumb-text-color: var(--te-muted);
	--breadcrumb-link-color: var(--te-muted);
	--breadcrumb-link-color-hover: var(--te-crimson);

	--mode-toggle-color: var(--te-ink-2);
	--mode-toggle-color-hover: var(--te-crimson);
	--mode-toggle-color-dark: var(--te-navy-ink);
	--mode-toggle-color-dark-hover: var(--te-crimson);
	--search-color: var(--te-ink-2);
	--search-color-hover: var(--te-crimson);
	--newsletter-color-hover: var(--te-crimson);
	--random-news-color-hover: var(--te-crimson);
	--sidebar-toggle-color: var(--te-ink-2);
	--sidebar-toggle-color-hover: var(--te-crimson);

	--move-to-top-background-color: var(--te-navy);
	--move-to-top-background-color-hover: var(--te-crimson);
	--move-to-top-border-color: var(--te-navy);
	--move-to-top-border-color-hover: var(--te-crimson);
	--move-to-top-color: #ffffff;
	--move-to-top-color-hover: #ffffff;
}

/* -------------------------------------------------------------- typography */

body.newsmatic_main_body,
body.newsmatic_dark_mode,
body.newsmatic_main_body button,
body.newsmatic_main_body input,
body.newsmatic_main_body select,
body.newsmatic_main_body textarea {
	font-family: var(--te-sans) !important;
	color: var(--te-ink);
	background-color: var(--te-paper);
	-webkit-font-smoothing: antialiased;
}

body .site,
body #theme-content,
body .site-main,
body #main-banner-section,
body #bottom-full-width-section {
	background-color: transparent;
}

body .post-title,
body .post-title a,
body .entry-title,
body .entry-title a,
body .newsmatic-block-title,
body .widget-title,
body .widget h2,
body .wp-block-heading,
body .slide-item .post-title a,
body .post-item .post-title a,
body .carousel-item .post-title a {
	font-family: var(--te-serif) !important;
	font-weight: 600;
	letter-spacing: -0.018em;
	color: var(--te-ink);
}

body .post-title a:hover,
body .entry-title a:hover {
	color: var(--te-crimson);
}

/* Category eyebrows: text kickers rather than filled chips. */
body ul.post-categories,
body .post-categories {
	gap: 12px;
}

body ul.post-categories li,
body .post-categories li {
	background: none !important;
	background-color: transparent !important;
	padding: 0 !important;
	margin: 0 14px 0 0 !important;
	border-radius: 0 !important;
	line-height: 1.4;
}

body ul.post-categories li a,
body .post-categories li a {
	background: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
	font-family: var(--te-sans) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-crimson) !important;
	line-height: 1.4;
}

body ul.post-categories li a:hover {
	color: var(--te-ink) !important;
}

/* Over a photo a plain kicker disappears, so those get a solid chip instead. */
body figure .post-categories li a {
	background: var(--te-crimson) !important;
	color: #ffffff !important;
	padding: 4px 8px !important;
}

body figure .post-categories li a:hover {
	background: var(--te-navy) !important;
	color: #ffffff !important;
}

body figure .post-categories li {
	margin: 0 6px 6px 0 !important;
}

body .post-meta,
body .entry-meta,
body .post-meta a,
body .entry-meta a,
body .post-meta span,
body .read-time,
body .pvc_stats {
	font-family: var(--te-sans) !important;
	font-size: 12.5px !important;
	color: var(--te-muted) !important;
	letter-spacing: 0.01em;
}

body .post-meta a:hover,
body .entry-meta a:hover {
	color: var(--te-crimson) !important;
}

body .post-excerpt,
body .post-excerpt p {
	font-family: var(--te-serif) !important;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--te-ink-2) !important;
}

/* ------------------------------------------------------------------ header */

body .site-header .row-wrap.row-one.full-width {
	background: var(--te-navy) !important;
	border-bottom: none;
}

body .site-header .row-one,
body .site-header .row-one a,
body .site-header .row-one .top-date-time,
body .site-header .row-one .top-ticker-news a {
	color: #d8e3ef !important;
	font-size: 12.5px;
	letter-spacing: 0.02em;
}

body .site-header .row-one a:hover {
	color: #ffffff !important;
}

/*
 * Top-bar ticker arrows. Slick injects these as <button> elements, so they
 * take the UA default button colour instead of inheriting the light ink of
 * the navy strip — dark chevrons on dark navy were effectively invisible.
 * The parent also gives them a 3px/10px padding box (~14px tall), which is
 * far below a usable tap target, and draws a separator bar that reads as
 * visual noise once the buttons get a hover pill.
 */
body .site-header .top-ticker-news .slick-arrow {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 28px;
	padding: 0 !important;
	top: 50% !important;
	transform: translateY(-50%);
	font-size: 14px !important;
	line-height: 1;
	color: #dbe6f2 !important;
	border-radius: 999px;
	transition: color 0.2s ease, background-color 0.2s ease;
}

body .site-header .top-ticker-news .slick-arrow i {
	color: inherit !important;
	font-size: inherit;
	line-height: 1;
}

body .site-header .top-ticker-news .slick-prev.slick-arrow {
	right: 30px;
}

/* The parent's 2px separator bar sits between the two pills; drop it. */
body .site-header .top-ticker-news .slick-prev.slick-arrow:after {
	display: none !important;
}

body .site-header .top-ticker-news .slick-arrow:hover,
body .site-header .top-ticker-news .slick-arrow:focus-visible {
	color: #ffffff !important;
	background-color: rgba(255, 255, 255, 0.16) !important;
}

body .site-header .top-ticker-news .slick-arrow:active {
	background-color: var(--te-crimson) !important;
	color: #ffffff !important;
}

body .site-header .row-wrap.row-two.full-width {
	background: var(--te-surface) !important;
	border-bottom: 1px solid var(--te-rule);
	padding-top: 26px !important;
	padding-bottom: 24px !important;
}

body .site-header .row-two .bb-bldr-row:before,
body .site-header .row-three .bb-bldr-row:before {
	border: none !important;
}

body .site-branding .custom-logo-link {
	display: inline-block;
	line-height: 0;
}

body .site-branding .custom-logo-link .custom-logo {
	max-height: 74px;
	width: auto;
	height: auto;
}

body .site-branding .site-title,
body .site-branding .site-description {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/*
 * No backdrop-filter here: this row contains the slide-out panel, and any
 * filter on an ancestor makes position:fixed resolve against this bar instead
 * of the viewport, which left the panel hanging below the header.
 */
body .site-header .row-wrap.row-three.full-width {
	background: var(--te-paper) !important;
	border-bottom: 1px solid var(--te-rule);
	border-top: 1px solid var(--te-rule);
}

body .main-navigation ul#header-menu > li > a,
body .main-navigation .menu > li > a {
	font-family: var(--te-sans) !important;
	font-size: 12.5px !important;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--te-ink-2) !important;
	padding: 14px 15px !important;
	border-bottom: 2px solid transparent;
	transition: color 0.18s ease, border-color 0.18s ease;
}

body .main-navigation ul#header-menu > li > a:hover,
body .main-navigation .menu > li > a:hover {
	color: var(--te-ink) !important;
	border-bottom-color: var(--te-crimson);
}

body .main-navigation ul#header-menu > li.current-menu-item > a,
body .main-navigation ul#header-menu > li.current_page_item > a {
	color: var(--te-ink) !important;
	border-bottom-color: var(--te-navy-ink);
}

body .main-navigation ul ul {
	border-top: 2px solid var(--te-crimson);
}

body .main-navigation ul ul a {
	font-family: var(--te-sans) !important;
	font-size: 13px !important;
	letter-spacing: 0.02em;
	text-transform: none;
}

/* ------------------------------------------------------------------ ticker */

body .after-header .ticker-news-wrap .newsmatic-ticker-label {
	background: var(--te-crimson) !important;
	color: #fff !important;
	font-family: var(--te-sans) !important;
	font-size: 11px !important;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	border-radius: 0;
}

body .after-header .ticker-news-wrap .newsmatic-ticker-label .icon i {
	color: #fff !important;
}

/*
 * Dark mode lightens --te-crimson for body text contrast, which leaves white
 * label text sitting on a washed-out pink. Pin the chip to the print red.
 */
body.newsmatic_dark_mode .after-header .ticker-news-wrap .newsmatic-ticker-label,
body.newsmatic_dark_mode figure .post-categories li a,
body.newsmatic_dark_mode .post-thumb .post-categories li a {
	background: #c8102e !important;
	color: #ffffff !important;
}

body .after-header .ticker-news-wrap {
	border-bottom: 1px solid var(--te-rule);
	background: var(--te-surface);
}

body .after-header .newsmatic-ticker-box a {
	font-family: var(--te-sans) !important;
	font-size: 14.5px !important;
	font-weight: 500;
	color: var(--te-ink-2) !important;
}

body .after-header .newsmatic-ticker-box a:hover {
	color: var(--te-crimson) !important;
}

/* -------------------------------------------------------------------- hero */

body #main-banner-section {
	padding-top: 42px;
}

body #main-banner-section .slide-item .post-thumb,
body .main-banner-wrap figure.post-thumb {
	overflow: hidden;
	background: var(--te-surface-2);
}

/*
 * Thumbnails are centred with transform: translate(-50%, -50%), so the zoom
 * uses the independent `scale` property — overriding `transform` would drop the
 * centring and make the image jump and appear to shrink.
 */
body #main-banner-section figure img,
body .main-banner-block-posts figure img,
body .news-list-wrap figure img,
body .news-carousel figure img,
body .single-related-posts-section-wrap figure img,
body .widget figure img {
	transition: scale 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.5s ease;
	will-change: scale;
}

body #main-banner-section article:hover figure img,
body .news-list-wrap article:hover figure img,
body .news-carousel article:hover figure img,
body .single-related-posts-section-wrap article:hover figure img,
body .widget li:hover figure img {
	scale: 1.05;
}

body #main-banner-section .slide-item .post-title,
body .main-banner-wrap .post-title {
	margin-top: 16px;
}

body #main-banner-section .slide-item .post-title a {
	font-size: clamp(26px, 2.9vw, 40px) !important;
	line-height: 1.08 !important;
}

body #main-banner-section .main-banner-block-posts .post-item .post-title a {
	font-size: 18px !important;
	line-height: 1.24 !important;
}

/* A scrim under the overlay text keeps headlines readable on bright photos. */
body #main-banner-section .slide-item,
body #main-banner-section .main-banner-block-posts .post-item {
	position: relative;
	isolation: isolate;
}

body #main-banner-section .slide-item::after,
body #main-banner-section .main-banner-block-posts .post-item::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(8, 12, 18, 0) 38%, rgba(8, 12, 18, 0.72) 100%);
	pointer-events: none;
	z-index: 1;
}

body #main-banner-section .post-element {
	z-index: 2;
}

/* Banner cards lay their text over the photo, so everything inside goes light. */
body #main-banner-section .post-element .post-title a,
body #main-banner-section .post-element .post-title a:hover {
	color: #ffffff !important;
	text-shadow: 0 1px 18px rgba(6, 10, 16, 0.45);
}

body #main-banner-section .post-element .post-title a:hover {
	opacity: 0.82;
}

body #main-banner-section .post-element .post-excerpt,
body #main-banner-section .post-element .post-excerpt p {
	color: rgba(255, 255, 255, 0.85) !important;
}

body #main-banner-section .post-element .post-meta,
body #main-banner-section .post-element .post-meta a,
body #main-banner-section .post-element .post-meta span,
body #main-banner-section .post-element .read-time {
	color: rgba(255, 255, 255, 0.78) !important;
}

body #main-banner-section .post-element .post-categories li a {
	color: #ffffff !important;
	border-bottom: 2px solid var(--te-crimson);
	padding-bottom: 2px !important;
}

body #main-banner-section .post-element .post-categories li a:hover {
	color: var(--te-crimson) !important;
}

body #main-banner-section .post-element .pvc_stats,
body #main-banner-section .post-element .pvc-stats-icon {
	display: none !important;
}

body .newsmatic-ticker-controls button,
body .newsmatic-ticker-controls .newsmatic-ticker-pause {
	background: var(--te-navy) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 0 !important;
}

/* ------------------------------------------------------------ slider arrows */

/*
 * Slick arrows ship transparent with dark ink, so on the hero photo they were
 * invisible in light mode and only showed once dark mode inverted the colour.
 * Give them a solid chip that reads against any image.
 */
body .main-banner-wrap .slick-arrow,
body .news-carousel .slick-arrow,
body .single-related-posts-section-wrap .slick-arrow {
	width: 42px !important;
	height: 42px !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.95) !important;
	color: var(--te-navy-ink) !important;
	border: 1px solid rgba(11, 21, 34, 0.12) !important;
	border-radius: 999px !important;
	box-shadow: 0 6px 20px rgba(11, 21, 34, 0.22);
	/* The theme only reveals these on slider hover, which leaves touch readers
	 * with no visible control at all. */
	visibility: visible !important;
	opacity: 1 !important;
	z-index: 6;
	transition: background-color 0.22s ease, color 0.22s ease, box-shadow 0.22s ease, scale 0.22s ease;
}

body .main-banner-wrap .slick-arrow i,
body .news-carousel .slick-arrow i,
body .single-related-posts-section-wrap .slick-arrow i {
	font-size: 14px;
	line-height: 1;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	color: inherit !important;
}

body .main-banner-wrap .slick-arrow:hover,
body .news-carousel .slick-arrow:hover,
body .single-related-posts-section-wrap .slick-arrow:hover,
body .main-banner-wrap .slick-arrow:focus-visible,
body .news-carousel .slick-arrow:focus-visible {
	background: var(--te-crimson) !important;
	color: #ffffff !important;
	border-color: var(--te-crimson) !important;
	box-shadow: 0 8px 24px rgba(200, 16, 46, 0.32);
	scale: 1.06;
}

/* The headline block covers the bottom ~60% of the banner, so a mid-height
 * arrow lands on top of the category row. Sit them above that block. */
body .main-banner-wrap .slick-arrow {
	top: 24% !important;
}

body .main-banner-wrap .slick-prev.slick-arrow {
	left: 18px !important;
	right: auto !important;
}

body .main-banner-wrap .slick-next.slick-arrow {
	right: 18px !important;
	left: auto !important;
}

/* --te-navy-ink flips to a pale blue in dark mode, which would wash out on the
 * white chip, so the dark palette gets its own pairing. */
body.newsmatic_dark_mode .main-banner-wrap .slick-arrow,
body.newsmatic_dark_mode .news-carousel .slick-arrow,
body.newsmatic_dark_mode .single-related-posts-section-wrap .slick-arrow {
	background: rgba(20, 25, 32, 0.92) !important;
	color: #f0f2f5 !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}

body.newsmatic_dark_mode .main-banner-wrap .slick-arrow:hover,
body.newsmatic_dark_mode .news-carousel .slick-arrow:hover,
body.newsmatic_dark_mode .single-related-posts-section-wrap .slick-arrow:hover {
	background: var(--te-crimson) !important;
	color: #12161c !important;
	border-color: var(--te-crimson) !important;
}

/* The vertical ticker arrows sit on a light strip, so they only need contrast. */
body .after-header .ticker-item-wrap .slick-arrow {
	background: transparent !important;
	color: var(--te-navy-ink) !important;
	opacity: 1 !important;
}

body .after-header .ticker-item-wrap .slick-arrow:hover {
	color: var(--te-crimson) !important;
}

body.newsmatic_dark_mode .after-header .ticker-item-wrap .slick-arrow {
	color: #dbe3ee !important;
}

/* ------------------------------------------------- slide-out section panel */

/*
 * The panel markup lives inside #masthead, and the theme parks the sticky
 * header off-screen while you scroll down with
 * `.header-sticky--enabled.fixed--off { transform: translateY(-1000px) }`.
 * A transform makes that header the containing block for the panel's
 * position: fixed, so opening the menu part-way down the page showed the
 * dark overlay with no panel at all. Drop the transform while the panel is
 * open; the header rows carry their own solid backgrounds, so the bar simply
 * slides back into view alongside the panel.
 */
body.body_show_sidetoggle .site-header.header-sticky--enabled.fixed--off {
	transform: none !important;
	transition: transform 0.3s ease-out;
}

body .newsmatic_ovelay_div {
	background-color: rgba(8, 15, 25, 0.55) !important;
	backdrop-filter: saturate(120%) blur(2px);
}

body .sidebar-toggle {
	width: min(380px, 88vw) !important;
	max-width: min(380px, 88vw) !important;
}

body .sidebar-toggle .newsmatic-container {
	background-color: var(--te-paper) !important;
	padding: 0 0 32px !important;
	box-shadow: 26px 0 70px rgba(8, 15, 25, 0.24) !important;
	border-right: 1px solid var(--te-rule);
	overscroll-behavior: contain;
}

body .sidebar-toggle .newsmatic-container::-webkit-scrollbar-thumb {
	background-color: var(--te-rule-strong);
}

/* Close control: a real button pinned to the top of the panel. */
body .sidebar-toggle .sidebar-toggle-close {
	position: sticky;
	top: 0;
	z-index: 3;
	float: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 16px 22px 14px !important;
	background: var(--te-paper) !important;
	border-bottom: 1px solid var(--te-rule);
	box-shadow: none !important;
	text-align: left !important;
}

body .sidebar-toggle .sidebar-toggle-close::before {
	content: "Browse Topic Express";
	font-family: var(--te-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--te-muted);
}

body .sidebar-toggle .sidebar-toggle-close i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	font-size: 13px;
	color: var(--te-ink-2);
	background: var(--te-surface-2);
	border: 1px solid var(--te-rule);
	border-radius: 999px;
	transition: background-color 0.2s ease, color 0.2s ease, rotate 0.3s ease;
}

body .sidebar-toggle .sidebar-toggle-close:hover i {
	background: var(--te-crimson);
	border-color: var(--te-crimson);
	color: #ffffff;
	rotate: 90deg;
}

/* The theme's block chrome (2px rule, offsets, shadows) fights this panel. */
body .sidebar-toggle .widget {
	margin: 0 !important;
	padding: 24px 22px 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

body .sidebar-toggle .widget::before {
	display: none !important;
}

body .sidebar-toggle .mzb-post-heading {
	margin-bottom: 14px;
	padding: 0;
	border: 0;
}

body .sidebar-toggle .mzb-heading-text {
	position: relative;
	font-family: var(--te-serif) !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: -0.01em;
	color: var(--te-ink) !important;
	margin: 0 0 12px !important;
	padding: 0 0 10px !important;
	border-bottom: 1px solid var(--te-rule);
}

body .sidebar-toggle .mzb-heading-text::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 44px;
	height: 2px;
	background: var(--te-crimson);
}

/* Section tiles: one full-bleed image row per category. */
body .sidebar-toggle .mzb-posts {
	display: grid;
	gap: 10px;
}

body .sidebar-toggle .mzb-post {
	position: relative;
	display: flex;
	align-items: center;
	height: 66px !important;
	margin: 0 !important;
	border-radius: 12px;
	overflow: hidden;
	background: var(--te-navy);
	box-shadow: none !important;
	transition: transform 0.28s cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 0.28s ease;
}

body .sidebar-toggle .mzb-post:hover {
	transform: translateX(4px);
	box-shadow: 0 10px 26px rgba(8, 15, 25, 0.22);
}

/* Stretch the artwork across the whole row and drop the plugin's purple. */
body .sidebar-toggle .mzb-title-wrapper {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	display: flex;
	align-items: center;
	padding: 0 18px !important;
	margin: 0 !important;
	background-color: var(--te-navy) !important;
	background-size: cover !important;
	background-position: center !important;
	border-radius: 0 !important;
}

body .sidebar-toggle .mzb-title-wrapper::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(9, 24, 42, 0.9) 0%, rgba(9, 24, 42, 0.72) 55%, rgba(9, 24, 42, 0.55) 100%);
	transition: background 0.28s ease;
}

body .sidebar-toggle .mzb-post:hover .mzb-title-wrapper::after {
	background: linear-gradient(90deg, rgba(160, 12, 33, 0.9) 0%, rgba(9, 24, 42, 0.7) 60%, rgba(9, 24, 42, 0.5) 100%);
}

body .sidebar-toggle .mzb-post-categories {
	position: relative;
	z-index: 2;
	margin: 0;
	padding: 0;
}

body .sidebar-toggle .mzb-post-categories a {
	font-family: var(--te-sans) !important;
	font-size: 14.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em;
	line-height: 1.25;
	color: #ffffff !important;
	background: none !important;
	padding: 0 !important;
	text-decoration: none;
}

body .sidebar-toggle .mzb-post-count-wrapper {
	position: relative;
	z-index: 2;
	margin-left: auto;
	padding-right: 14px;
	background: transparent !important;
	width: auto !important;
}

body .sidebar-toggle .mzb-post-count,
body .sidebar-toggle .mzb-post-count a {
	background: rgba(255, 255, 255, 0.16) !important;
	color: #ffffff !important;
	width: auto !important;
	border-radius: 999px;
	font-family: var(--te-sans) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	text-decoration: none;
}

body .sidebar-toggle .mzb-post-count {
	padding: 0 !important;
	overflow: hidden;
}

body .sidebar-toggle .mzb-post-count a {
	display: inline-block;
	padding: 5px 11px !important;
	background: transparent !important;
}

/* Quick links block under the sections. */
body .te-panel-links {
	margin-top: 26px;
	padding-top: 20px;
	border-top: 1px solid var(--te-rule);
}

body .te-panel-links__title {
	font-family: var(--te-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--te-muted);
	margin: 0 0 10px;
}

body .te-panel-links ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 2px;
}

body .te-panel-links li {
	margin: 0;
	padding: 0;
	list-style: none;
}

body .te-panel-links a {
	display: block;
	font-family: var(--te-sans);
	font-size: 14px;
	font-weight: 500;
	color: var(--te-ink-2);
	text-decoration: none;
	padding: 7px 0;
	border-bottom: 1px solid transparent;
	transition: color 0.2s ease, padding-left 0.2s ease;
}

body .te-panel-links a:hover {
	color: var(--te-crimson);
	padding-left: 5px;
}

/* --------------------------------------------------------- list + carousel */

body .news-list-wrap article.post {
	border-bottom: 1px solid var(--te-rule);
	padding-bottom: 30px;
	margin-bottom: 30px;
	background: transparent;
	box-shadow: none;
	border-radius: 0;
}

body .news-list-wrap article.post:last-child {
	border-bottom: none;
}

body .news-list-wrap article.post figure.post-thumb-wrap {
	overflow: hidden;
	background: var(--te-surface-2);
	border-radius: 0;
}

body .news-list-wrap .post-title a {
	font-size: 25px !important;
	line-height: 1.18 !important;
}

body .news-list-wrap .post-element .post-meta {
	margin-top: 10px;
}

body .post-link-button {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 14px;
	font-family: var(--te-sans) !important;
	font-size: 12px !important;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--te-crimson) !important;
	background: none !important;
	border: none !important;
	padding: 0 !important;
	width: auto !important;
	height: auto !important;
	border-radius: 0 !important;
}

body .post-link-button:hover {
	color: var(--te-ink) !important;
}

/*
 * Media captions are attached to every thumbnail, which in a 104px card slot
 * wraps into a wall of text. Credits stay on the article's own lead image.
 */
body .thumb-caption {
	display: none !important;
}

body.single-post .entry-header .post-thumbnail .thumb-caption {
	display: block !important;
	font-family: var(--te-sans) !important;
	font-size: 12.5px !important;
	color: var(--te-muted) !important;
	margin-top: 10px;
}

/* The view counter injects itself into excerpts; it belongs in the meta row only. */
body .post-excerpt .pvc_stats,
body .post-excerpt .pvc_clear,
body .post-excerpt .pvc-stats-icon {
	display: none !important;
}

body .newsmatic-block-title,
body .widget-area .widget > h2,
body .widget-area .widget .widget-title,
body .wp-block-group h2 {
	font-family: var(--te-sans) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--te-navy-ink) !important;
	border-top: 2px solid var(--te-navy-ink);
	border-bottom: none !important;
	padding-top: 12px;
	padding-bottom: 0;
	margin-bottom: 20px;
	background: none !important;
}

body .newsmatic-block-title:before,
body .newsmatic-block-title:after,
body .widget-title:before,
body .widget-title:after {
	display: none !important;
}

body .news-carousel .carousel-item .post-title a {
	font-size: 18px !important;
	line-height: 1.24 !important;
}

/* ----------------------------------------------------------------- sidebar */

/* The theme draws its own rule above each widget; the heading border replaces it. */
body .widget-area .widget:before,
body .widget-area .widget:after {
	display: none !important;
}

body .widget-area .widget {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin-bottom: 40px;
}

/*
 * The theme pins a Font Awesome bullet at the left edge of every widget list
 * item, so the text needs to keep clear of it.
 */
body .widget-area .widget ul li {
	position: relative;
	padding-left: 22px !important;
}

body .widget-area .widget ul li::before {
	top: 14px !important;
	color: var(--te-crimson) !important;
}

body .widget-area .widget ul li:first-child::before {
	top: 1px !important;
}

body .widget-area .wp-block-latest-posts li,
body .widget-area .wp-block-latest-posts__list li,
body .widget-area .wp-block-categories li,
body .widget-area .wp-block-archives li,
body .widget-area .wp-block-page-list li {
	border-top: 1px solid var(--te-rule);
	padding-top: 13px !important;
	padding-bottom: 13px !important;
}

body .widget-area .widget ul li:first-child {
	border-top: none;
	padding-top: 0 !important;
}

body .widget-area .wp-block-latest-posts a {
	font-family: var(--te-serif) !important;
	font-size: 16px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--te-ink) !important;
}

body .widget-area .wp-block-latest-posts a:hover {
	color: var(--te-crimson) !important;
}

body .widget-area .wp-block-search__input,
body .search-form input[type="search"] {
	border: 1px solid var(--te-rule-strong);
	border-radius: 0;
	background: var(--te-surface);
	font-family: var(--te-sans);
	padding: 12px 14px;
}

body .widget-area .wp-block-search__button,
body .search-form button,
body .search-form input[type="submit"] {
	background: var(--te-navy);
	border: none;
	border-radius: 0;
	color: #fff;
	font-family: var(--te-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 12px 20px;
}

body .widget-area .wp-block-search__button:hover,
body .search-form button:hover {
	background: var(--te-crimson);
}

/* -------------------------------------------------------------- pagination */

/* The markup is div.pagination > ul.page-numbers > li > a.page-numbers, so
 * every rule has to name the element — a bare .page-numbers also hits the ul
 * and paints the whole bar on hover. */
body .pagination ul.page-numbers {
	background: transparent !important;
	border: 0 !important;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

body .pagination ul.page-numbers > li {
	margin: 0;
	padding: 0;
	list-style: none;
	background: transparent !important;
}

body .pagination a.page-numbers,
body .pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 0 !important;
	border: 1px solid var(--te-rule-strong) !important;
	background: transparent !important;
	color: var(--te-ink-2) !important;
	font-family: var(--te-sans);
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body .pagination span.page-numbers.current,
body .pagination a.page-numbers:hover,
body .pagination a.page-numbers:focus-visible {
	background: var(--te-navy) !important;
	border-color: var(--te-navy) !important;
	color: #fff !important;
}

body .pagination a.page-numbers:hover {
	background: var(--te-crimson) !important;
	border-color: var(--te-crimson) !important;
}

/* ----------------------------------------------------------- single: shell */

body .newsmatic-breadcrumb-wrap {
	padding-top: 22px;
}

body .breadcrumb-trail ul.trail-items,
body .breadcrumb-trail li,
body .breadcrumb-trail a {
	font-family: var(--te-sans) !important;
	font-size: 12.5px !important;
	color: var(--te-muted) !important;
	letter-spacing: 0.01em;
	background: none !important;
}

body .breadcrumb-trail a:hover {
	color: var(--te-crimson) !important;
}

body.single-post .entry-header {
	max-width: 74ch;
}

body.single-post .entry-header .post-categories li a {
	font-size: 11.5px !important;
}

body.single-post h1.entry-title,
body.single-post .entry-title {
	font-size: clamp(30px, 3.5vw, 48px) !important;
	line-height: 1.07 !important;
	letter-spacing: -0.022em;
	margin: 14px 0 0;
	padding-bottom: 0;
	border-bottom: none;
	color: var(--te-ink);
}

body.single-post .entry-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin-top: 22px;
	padding: 14px 0;
	border-top: 1px solid var(--te-rule);
	border-bottom: 1px solid var(--te-rule);
}

body.single-post .post-thumbnail,
body.single-post figure.post-thumbnail {
	margin: 30px 0 0;
}

body.single-post .post-thumbnail img {
	width: 100%;
	background: var(--te-surface-2);
}

/* ---------------------------------------------------------- single: article */

body.single-post .entry-content {
	max-width: 72ch;
	font-family: var(--te-serif) !important;
	font-size: 18.5px;
	line-height: 1.72;
	color: var(--te-ink);
	margin-top: 34px;
}

body.single-post .entry-content p,
body.single-post .entry-content li {
	font-family: var(--te-serif) !important;
	font-size: 18.5px;
	line-height: 1.72;
	color: var(--te-ink);
}

body.single-post .entry-content > p {
	margin: 0 0 24px;
}

body.single-post .entry-content > p:first-of-type::first-letter {
	float: left;
	font-size: 62px;
	line-height: 0.82;
	font-weight: 600;
	padding: 6px 10px 0 0;
	color: var(--te-navy-ink);
}

body.single-post .entry-content h2 {
	font-family: var(--te-serif) !important;
	font-size: clamp(23px, 2.1vw, 28px) !important;
	line-height: 1.2;
	font-weight: 600;
	color: var(--te-ink) !important;
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 44px 0 14px;
}

body.single-post .entry-content h3 {
	font-family: var(--te-serif) !important;
	font-size: 21px !important;
	line-height: 1.25;
	font-weight: 600;
	color: var(--te-ink) !important;
	border: none !important;
	padding: 0 !important;
	margin: 32px 0 10px;
}

body.single-post .entry-content a {
	color: var(--te-crimson) !important;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

body.single-post .entry-content a:hover {
	background: color-mix(in srgb, var(--te-crimson) 12%, transparent);
}

body.single-post .entry-content strong {
	font-weight: 700;
	color: var(--te-ink);
	background: none;
	padding: 0;
}

body.single-post .entry-content ul,
body.single-post .entry-content ol {
	margin: 0 0 24px;
	padding-left: 22px;
}

body.single-post .entry-content li {
	margin-bottom: 9px;
}

body.single-post .entry-content blockquote {
	margin: 34px 0;
	padding: 0 0 0 24px;
	border-left: 3px solid var(--te-crimson);
	background: none;
	font-size: 21px;
	line-height: 1.42;
	color: var(--te-ink);
}

body.single-post .entry-content figure {
	margin: 32px 0;
}

body.single-post .entry-content figcaption {
	font-family: var(--te-sans) !important;
	font-size: 12.5px;
	color: var(--te-muted);
	margin-top: 9px;
}

/* --------------------------------------------------- single: added modules */

.te-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: transparent;
	z-index: 9999;
	pointer-events: none;
}

.te-progress span {
	display: block;
	height: 100%;
	width: 0;
	background: var(--te-crimson);
}

.admin-bar .te-progress {
	top: 32px;
}

.te-toc {
	margin: 0 0 32px;
	padding: 20px 24px;
	background: var(--te-surface);
	border: 1px solid var(--te-rule);
	border-left: 3px solid var(--te-crimson);
}

/* Specific enough to beat the .entry-content heading rules above. */
body.single-post .entry-content .te-toc .te-toc__title {
	font-family: var(--te-sans) !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--te-navy-ink) !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
}

.te-toc ul {
	margin: 0 !important;
	padding: 0 0 0 18px !important;
	list-style: decimal;
}

.te-toc li {
	margin-bottom: 8px !important;
	font-size: 16px !important;
	line-height: 1.45 !important;
}

body.single-post .entry-content .te-toc a {
	color: var(--te-ink-2) !important;
	text-decoration: none !important;
	background: none !important;
}

body.single-post .entry-content .te-toc a:hover {
	color: var(--te-crimson) !important;
	text-decoration: underline !important;
}

.te-sources {
	margin: 40px 0 0;
	padding: 22px 26px;
	background: var(--te-surface);
	border: 1px solid var(--te-rule);
}

body.single-post .entry-content .te-sources h2,
body.single-post .entry-content .te-sources h3 {
	font-family: var(--te-sans) !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--te-navy-ink) !important;
	margin: 0 0 14px !important;
}

.te-sources ul,
.te-sources ol {
	margin: 0 !important;
	padding-left: 20px !important;
}

.te-sources li {
	font-size: 15.5px !important;
	line-height: 1.55 !important;
	margin-bottom: 9px !important;
}

.te-author {
	display: grid;
	grid-template-columns: 62px 1fr;
	gap: 20px;
	align-items: start;
	margin: 44px 0 0;
	padding-top: 26px;
	border-top: 2px solid var(--te-navy-ink);
}

.te-author__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: var(--te-navy);
	color: #ffffff;
	font-family: var(--te-serif);
	font-size: 23px;
	font-weight: 600;
	letter-spacing: 0.02em;
}

body.newsmatic_dark_mode .te-author__mark {
	background: var(--te-crimson);
}

.te-author__eyebrow {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-crimson);
	margin: 0 0 6px;
}

.te-author__name {
	font-family: var(--te-serif) !important;
	font-size: 20px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
}

.te-author__name a {
	color: var(--te-ink) !important;
	text-decoration: none !important;
}

.te-author__bio {
	font-family: var(--te-serif);
	font-size: 15px;
	line-height: 1.6;
	color: var(--te-ink-2);
	margin: 8px 0 0;
	max-width: 62ch;
}

.te-author__meta {
	font-size: 12.5px;
	color: var(--te-muted);
	margin: 10px 0 0;
}

.te-author__links {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin: 10px 0 0;
	font-size: 12.5px;
	font-weight: 500;
}

.te-author__links a {
	color: var(--te-crimson);
}

body.single-post .post-navigation {
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid var(--te-rule);
}

body.single-post .post-navigation .nav-title {
	font-family: var(--te-serif) !important;
	font-size: 17px;
	line-height: 1.28;
	color: var(--te-ink);
}

body.single-post .post-navigation .nav-subtitle {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-crimson);
}

body .entry-footer .tags-links a,
body .tags-links a {
	display: inline-block;
	font-family: var(--te-sans) !important;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--te-ink-2) !important;
	border: 1px solid var(--te-rule-strong);
	border-radius: 0;
	padding: 5px 11px;
	margin: 0 6px 6px 0;
	background: none !important;
}

body .entry-footer .tags-links a:hover {
	border-color: var(--te-navy-ink);
	color: var(--te-ink) !important;
}

/* ------------------------------------------------- archive + search header */

/*
 * The theme gives the archive <h1> the small section-label class, so it
 * rendered as a 12px inline-block with a stubby 2px rule floating above it —
 * the stray broken line. Treat it as the page heading it actually is.
 */
body .page-header .page-title,
body .page-header .page-title.newsmatic-block-title {
	display: block !important;
	width: auto !important;
	font-family: var(--te-serif) !important;
	font-size: clamp(27px, 3.2vw, 38px) !important;
	font-weight: 700 !important;
	line-height: 1.15 !important;
	letter-spacing: -0.018em !important;
	text-transform: none !important;
	color: var(--te-ink) !important;
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 0 12px !important;
}

body .page-header .page-title::before,
body .page-header .page-title::after {
	display: none !important;
	content: none !important;
}

body .page-header {
	margin-bottom: 28px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--te-rule);
}

body .page-header .archive-description,
body .page-header .archive-description p {
	font-family: var(--te-sans) !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
	color: var(--te-ink-2) !important;
	max-width: 62ch;
	margin: 0 !important;
}

/* --------------------------------------------------------------- ad zones */

.te-ad {
	display: block;
	margin: 34px auto;
	text-align: center;
}

.te-ad__label {
	display: block;
	font-family: var(--te-sans);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--te-muted);
	margin-bottom: 8px;
}

.te-ad__inner {
	display: flex;
	justify-content: center;
}

.te-ad--leaderboard {
	max-width: 970px;
	min-height: 100px;
}

.te-ad--in-article {
	min-height: 250px;
}

.te-ad--sidebar {
	position: sticky;
	top: 90px;
}

/*
 * Articles run long and the sidebar is short, so letting it travel with the
 * reader keeps the rail (and anything placed in it) in view.
 */
@media (min-width: 1025px) {
	body.single-post .secondary-sidebar,
	body.home .secondary-sidebar,
	body.blog .secondary-sidebar,
	body.archive .secondary-sidebar,
	body.search .secondary-sidebar {
		position: sticky;
		top: 84px;
		align-self: flex-start;
	}
}

/* ------------------------------------------------------------------ footer */

body .site-footer .widget-title,
body .site-footer .widget h2 {
	font-family: var(--te-sans) !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	border-top: none;
	padding-top: 0;
}

body .site-footer a {
	font-family: var(--te-sans);
	font-size: 14.5px;
}

body .bottom-footer,
body .bottom-footer a,
body .bottom-footer p {
	font-family: var(--te-sans) !important;
	font-size: 13px !important;
}

/* --------------------------------------------------------------- dark mode */

body.newsmatic_dark_mode .site-header .row-wrap.row-two.full-width,
body.newsmatic_dark_mode .site-header .row-wrap.row-three.full-width,
body.newsmatic_dark_mode .after-header .ticker-news-wrap {
	background: var(--te-surface) !important;
}

body.newsmatic_dark_mode .site-branding .custom-logo {
	content: url("logo-inverse.png");
}

body.newsmatic_dark_mode .te-toc,
body.newsmatic_dark_mode .te-sources {
	background: var(--te-surface-2);
}

body.newsmatic_dark_mode .widget-area .wp-block-search__input {
	background: var(--te-surface-2);
	color: var(--te-ink);
}

/* --------------------------------------------------------- author archive */

body .newsmatic-author-section .author-name {
	font-family: var(--te-serif);
	font-size: clamp(26px, 3.2vw, 36px);
	font-weight: 700;
	letter-spacing: -0.015em;
	color: var(--te-navy-ink);
	margin: 0 0 8px;
}

body .newsmatic-author-section .author-count {
	font-family: var(--te-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--te-muted);
	margin: 10px 0 0;
}

/* ---------------------------------------------------------- sidebar card */

body .widget-area .widget.te-rail {
	background: var(--te-surface);
	border: 1px solid var(--te-rule);
	border-top: 2px solid var(--te-navy-ink);
	padding: 22px 20px 24px !important;
}

body .widget-area .widget.te-rail .widget-title {
	margin-bottom: 12px !important;
}

body .te-rail__text {
	font-family: var(--te-sans);
	font-size: 14px;
	line-height: 1.65;
	color: var(--te-ink-2);
	margin: 0 0 14px;
}

body .te-rail__links {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0 0 20px;
}

body .te-rail__links a {
	font-family: var(--te-sans);
	font-size: 13px;
	font-weight: 600;
	color: var(--te-crimson);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}

body .te-rail__subtitle {
	font-family: var(--te-sans) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-muted) !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
	border: 0 !important;
}

body .te-rail__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}

body .te-rail__chips a {
	font-family: var(--te-sans);
	font-size: 12px;
	font-weight: 600;
	color: var(--te-navy-ink);
	background: var(--te-surface-2);
	border: 1px solid var(--te-rule);
	border-radius: 999px;
	padding: 6px 12px;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body .te-rail__chips a:hover {
	background: var(--te-crimson);
	border-color: var(--te-crimson);
	color: #ffffff;
}

/* ------------------------------------------------------------ site footer */

body .te-footer {
	background: var(--te-navy);
	color: #d8e3ef;
	padding: clamp(38px, 5vw, 62px) 0 clamp(30px, 4vw, 46px);
	border-top: 3px solid var(--te-crimson);
}

body.newsmatic_dark_mode .te-footer {
	background: #0a0e13;
	border-top-color: var(--te-crimson);
}

body .te-footer__grid {
	display: grid;
	grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(140px, 1fr));
	gap: clamp(24px, 3vw, 52px);
	align-items: start;
}

body .te-footer__logolink {
	display: inline-block;
	margin-bottom: 16px;
}

body .te-footer__logo {
	max-width: 210px;
	height: auto;
	/* The navy wordmark needs the light variant against a navy footer. */
	content: url("logo-inverse.png");
}

body .te-footer__wordmark {
	font-family: var(--te-serif);
	font-size: 26px;
	font-weight: 700;
	color: #ffffff;
	text-decoration: none;
}

body .te-footer__blurb {
	font-family: var(--te-sans);
	font-size: 14px;
	line-height: 1.7;
	color: #b9cbdd;
	max-width: 42ch;
	margin: 0 0 14px;
}

body .te-footer__contact a {
	font-family: var(--te-sans);
	font-size: 13.5px;
	color: #ffffff;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	padding-bottom: 2px;
}

body .te-footer__contact a:hover {
	border-bottom-color: var(--te-crimson);
	color: #ffffff;
}

body .te-footer__title {
	font-family: var(--te-sans) !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #ffffff !important;
	margin: 0 0 16px !important;
	padding: 0 0 10px !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

body .te-footer__col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

body .te-footer__col li {
	margin: 0 0 9px;
	padding: 0;
	list-style: none;
}

body .te-footer__col li::before {
	display: none !important;
}

body .te-footer__col a {
	font-family: var(--te-sans);
	font-size: 14px;
	color: #c3d3e4;
	text-decoration: none;
	transition: color 0.2s ease, padding-left 0.2s ease;
}

body .te-footer__col a:hover {
	color: #ffffff;
	padding-left: 4px;
}

body .site-footer .site-info,
body .site-footer .site-info a {
	font-family: var(--te-sans);
	font-size: 13px;
	color: #9fb2c6;
}

/* ------------------------------------------------------- footer legal strip */

/*
 * Copyright and policy links share one bar: the copyright holds the left, the
 * menu sits to its right on a single line and only wraps on narrow screens.
 */
/* The builder splits this bar into two equal columns, which is not enough room
 * for six links; give the copyright only the width it needs. */
body #colophon .bb-bldr-row.column-2 {
	grid-template-columns: auto minmax(0, 1fr) !important;
	align-items: center;
	gap: 8px 30px;
}

body #colophon .bb-bldr-column.alignment-right {
	justify-content: flex-end;
}

body #colophon .bottom-menu {
	display: block !important;
	margin: 0;
	flex: 0 1 auto;
}

body #colophon .bottom-menu ul.menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 6px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body #colophon .bottom-menu ul.menu li {
	margin: 0;
	padding: 0;
	list-style: none;
	border: 0;
	white-space: nowrap;
}

body #colophon .bottom-menu ul.menu li a {
	font-family: var(--te-sans);
	font-size: 12.5px;
	font-weight: 500;
	line-height: 1.4;
	color: #9fb2c6;
	text-decoration: none;
	padding: 0;
	transition: color 0.2s ease;
}

body #colophon .bottom-menu ul.menu li a:hover,
body #colophon .bottom-menu ul.menu li a:focus-visible {
	color: #ffffff;
}

/* ----------------------------------------------------------------- 404 page */

/* The parent centres and shrinks every paragraph inside .error-404. */
body .error-404,
body .error-404 p,
body .error-404 .page-content,
body .error-404 .page-footer {
	text-align: left !important;
}

body .error-404 .te-404__code {
	font-family: var(--te-serif) !important;
	font-size: clamp(64px, 11vw, 116px) !important;
	line-height: 0.9 !important;
	font-weight: 700 !important;
	color: var(--te-rule-strong) !important;
	margin: 0 0 6px !important;
	letter-spacing: -0.02em;
}

body .error-404 .page-header {
	border: 0;
	padding: 0;
	margin-bottom: 22px;
}

body .error-404 .page-title {
	font-family: var(--te-serif) !important;
	font-size: clamp(28px, 3.4vw, 40px) !important;
	line-height: 1.15 !important;
	color: var(--te-ink) !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 0 10px !important;
	border: 0 !important;
	text-transform: none !important;
	letter-spacing: -0.01em;
}

body .error-404 .page-title::before,
body .error-404 .page-title::after {
	display: none !important;
}

body .error-404 .te-404__lead {
	font-family: var(--te-sans) !important;
	font-size: 16px !important;
	line-height: 1.65 !important;
	color: var(--te-ink-2) !important;
	max-width: 56ch;
	margin-bottom: 26px !important;
}

body .error-404 .te-404__search {
	max-width: 460px;
	margin: 0 0 34px;
}

body .te-404 {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: clamp(24px, 4vw, 48px);
	padding-top: 8px;
	border-top: 1px solid var(--te-rule);
	margin-top: 8px;
}

body .te-404__title {
	font-family: var(--te-sans) !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-crimson) !important;
	margin: 22px 0 14px !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
}

body .te-404__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

body .te-404__list li {
	padding: 0 0 12px;
	margin: 0 0 12px;
	border-bottom: 1px solid var(--te-rule);
	list-style: none;
}

body .te-404__list li::before {
	display: none !important;
}

body .te-404__list a {
	display: block;
	font-family: var(--te-serif);
	font-size: 17px;
	line-height: 1.35;
	color: var(--te-ink);
	text-decoration: none;
}

body .te-404__list a:hover {
	color: var(--te-crimson);
}

body .te-404__list span {
	display: block;
	margin-top: 4px;
	font-family: var(--te-sans);
	font-size: 12px;
	color: var(--te-muted);
}

body .te-404__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

body .te-404__chips a {
	font-family: var(--te-sans);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--te-navy-ink);
	background: var(--te-surface-2);
	border: 1px solid var(--te-rule);
	padding: 8px 13px;
	border-radius: 999px;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body .te-404__chips a:hover {
	background: var(--te-crimson);
	border-color: var(--te-crimson);
	color: #ffffff;
}

body .error-404 .button-404 {
	background: var(--te-navy) !important;
	border: 1px solid var(--te-navy) !important;
	border-radius: 2px !important;
	font-family: var(--te-sans) !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 13px 22px !important;
	transition: background-color 0.22s ease, border-color 0.22s ease;
}

body .error-404 .button-404:hover {
	background: var(--te-crimson) !important;
	border-color: var(--te-crimson) !important;
}

/* --------------------------------------------------- view counter clean-up */

/*
 * The counter plugin injects an SVG and an AJAX spinner into excerpts and the
 * end of articles. Low counts on a young site read as a negative signal.
 */
body .pvc_stats,
body .pvc_clear,
body .pvc-stats-icon {
	display: none !important;
}

/* Webpushr opt-in covers the page on first visit — AdSense interstitial risk. */
#webpushr-prompt,
#webpushr-optin,
.webpushr-prompt,
.webpushr-bell-optin,
iframe[src*="webpushr"],
[id^="webpushr-"],
[class*="webpushr-"] {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
	opacity: 0 !important;
	max-height: 0 !important;
	overflow: hidden !important;
}

/* ------------------------------------------------------- motion and polish */

/* Scroll reveal. The hidden state is only applied once JS confirms support,
   so content is never trapped invisible. */
.te-reveal {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 0.65s ease, transform 0.65s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.te-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Cards lift slightly toward the reader on hover. */
body .news-list-wrap article.post,
body .single-related-posts-section-wrap article,
body .news-carousel .carousel-item {
	transition: transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1);
}

body .news-list-wrap article.post:hover,
body .single-related-posts-section-wrap article:hover,
body .news-carousel .carousel-item:hover {
	transform: translateY(-3px);
}

body .post-title a {
	transition: color 0.22s ease;
}

/* Nav underline grows from the centre instead of snapping in. */
body .main-navigation ul#header-menu > li > a {
	position: relative;
	border-bottom-color: transparent !important;
}

body .main-navigation ul#header-menu > li > a::after {
	content: "";
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: 6px;
	height: 2px;
	background: var(--te-crimson);
	transition: left 0.28s ease, right 0.28s ease;
}

body .main-navigation ul#header-menu > li > a:hover::after,
body .main-navigation ul#header-menu > li.current-menu-item > a::after,
body .main-navigation ul#header-menu > li.current_page_item > a::after {
	left: 15px;
	right: 15px;
}

body .main-navigation ul#header-menu > li.current-menu-item > a::after,
body .main-navigation ul#header-menu > li.current_page_item > a::after {
	background: var(--te-navy-ink);
}

/* The sticky bar lifts off the page once the reader scrolls. */
body .site-header .row-wrap.row-three.row-sticky {
	transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

body.te-scrolled .site-header .row-wrap.row-three.row-sticky {
	box-shadow: 0 6px 24px rgba(11, 21, 34, 0.09);
}

body.newsmatic_dark_mode.te-scrolled .site-header .row-wrap.row-three.row-sticky {
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
}

/* Breaking-news label gets a slow pulse so the eye catches it once. */
body .after-header .ticker-news-wrap .newsmatic-ticker-label .icon i {
	animation: te-pulse 2.6s ease-in-out infinite;
}

@keyframes te-pulse {
	0%, 70%, 100% { opacity: 1; }
	85% { opacity: 0.35; }
}

/* Numbered rail for recent-post lists, replacing the icon bullet. */
body .widget-area .wp-block-latest-posts,
body .widget-area .wp-block-latest-posts__list {
	counter-reset: te-list;
}

body .widget-area .wp-block-latest-posts li,
body .widget-area .wp-block-latest-posts__list li {
	counter-increment: te-list;
	padding-left: 34px !important;
}

body .widget-area .wp-block-latest-posts li::before,
body .widget-area .wp-block-latest-posts__list li::before {
	content: counter(te-list, decimal-leading-zero) !important;
	font-family: var(--te-sans) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em;
	color: var(--te-crimson) !important;
	top: 15px !important;
}

body .widget-area .wp-block-latest-posts li:first-child::before,
body .widget-area .wp-block-latest-posts__list li:first-child::before {
	top: 2px !important;
}

/* Focus and selection states. */
body ::selection {
	background: color-mix(in srgb, var(--te-crimson) 22%, transparent);
	color: var(--te-ink);
}

/*
 * --te-ink is near-black, so the default highlight made text disappear wherever
 * the surface is dark: the footer, the banner overlays and the dark header.
 * Those areas get an inverted pairing instead.
 */
body .te-footer ::selection,
body .te-footer::selection,
body #colophon ::selection,
body .site-footer.dark_bk ::selection,
body #main-banner-section ::selection,
body .main-banner-block-posts ::selection,
body .site-header .row-one ::selection {
	background: rgba(255, 255, 255, 0.3);
	color: #ffffff;
}

body.newsmatic_dark_mode ::selection {
	background: color-mix(in srgb, var(--te-crimson) 34%, transparent);
	color: #ffffff;
}

body a:focus-visible,
body button:focus-visible,
body input:focus-visible,
body select:focus-visible,
body textarea:focus-visible {
	outline: 2px solid var(--te-crimson);
	outline-offset: 2px;
	border-radius: 1px;
}

body input[type="search"]:focus,
body input[type="text"]:focus,
body input[type="email"]:focus,
body textarea:focus {
	border-color: var(--te-navy-ink) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--te-navy-ink) 12%, transparent);
	outline: none;
}

body #newsmatic-scroll-to-top {
	border-radius: 999px !important;
	transition: transform 0.25s ease, background-color 0.25s ease;
}

body #newsmatic-scroll-to-top:hover {
	transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
	body *,
	body *::before,
	body *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	.te-reveal {
		opacity: 1;
		transform: none;
	}
}

/* -------------------------------------------------------------- responsive */

@media (max-width: 1024px) {
	body .news-list-wrap .post-title a {
		font-size: 21px !important;
	}

	body.single-post .entry-content {
		max-width: none;
	}
}

@media (max-width: 768px) {
	body .site-branding .custom-logo-link .custom-logo {
		max-height: 46px;
	}

	body .site-header .row-wrap.row-two.full-width {
		padding-top: 16px !important;
		padding-bottom: 16px !important;
	}

	body #main-banner-section .slide-item .post-title a {
		font-size: 24px !important;
	}

	body.single-post .entry-content,
	body.single-post .entry-content p,
	body.single-post .entry-content li {
		font-size: 17.5px;
	}

	body.single-post .entry-content > p:first-of-type::first-letter {
		font-size: 52px;
	}

	.te-author {
		grid-template-columns: 1fr;
	}

	/* The hero meta used to wrap onto the category row and collide with it. */
	body #main-banner-section .post-meta,
	body .main-banner-block-posts .post-meta {
		display: flex;
		flex-wrap: wrap;
		row-gap: 2px;
		column-gap: 12px;
		margin-top: 6px !important;
	}

	body #main-banner-section .post-categories,
	body .main-banner-block-posts .post-categories {
		margin-bottom: 4px !important;
	}

	body .te-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .te-footer__brand {
		grid-column: 1 / -1;
	}

	body .te-404 {
		grid-template-columns: 1fr;
	}

	/* Stack the legal strip and centre both halves. */
	body #colophon .bb-bldr-row.column-2 {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 12px;
		text-align: center;
	}

	body #colophon .bb-bldr-column.alignment-right {
		justify-content: center;
	}

	body #colophon .bottom-menu ul.menu {
		justify-content: center;
		gap: 6px 16px;
	}

	/* Smaller banner, taller headline block: pull the arrows further up and in. */
	body .main-banner-wrap .slick-arrow {
		top: 14% !important;
		width: 36px !important;
		height: 36px !important;
	}

	body .main-banner-wrap .slick-prev.slick-arrow {
		left: 12px !important;
	}

	body .main-banner-wrap .slick-next.slick-arrow {
		right: 12px !important;
	}
}

@media (max-width: 560px) {
	body .te-footer__grid {
		grid-template-columns: 1fr;
	}

	body .error-404 .te-404__code {
		font-size: 62px;
	}
}
