/*
Theme Name:     Investment Shastra 2025
Theme URI:      https://www.moneyworks4me.com/investmentshastra/
Description:    Modern block theme for Investment Shastra by MoneyWorks4Me. Child of Twenty Twenty-Five. An "investor's almanac" design system — editorial serif headlines (Vollkorn), humanist body (Manrope), system monospace for data labels, deep-evergreen + brass palette. Requires WordPress 6.7+ and the Twenty Twenty-Five parent theme.
Author:         MoneyWorks4Me
Template:       twentytwentyfive
Version:        3.18.1
Requires at least: 6.7
Requires PHP:   8.1
Text Domain:    is-2025
Tags:           blog, education, block-patterns, full-site-editing, block-styles
*/

/* =========================================================================
   Base
   ========================================================================= */
/* Accessibility text-size control — scales all rem/fluid sizing (default 100%). */
html {
	font-size: var(--is-fs, 100%);
}
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}

::selection {
	background: var(--wp--preset--color--accent-soft);
	color: var(--wp--preset--color--contrast);
}

:is(h1, h2, h3, h4, h5, h6) {
	text-wrap: balance;
}

p {
	text-wrap: pretty;
}

/* Tabular figures wherever numbers line up */
.is-tnum,
time,
.is-hub-card__title,
.wp-block-post-date,
.is-trust time {
	font-variant-numeric: tabular-nums;
}

/* Content links: animated underline reveal (only within reading content) */
.wp-block-post-content a:where(:not(.wp-element-button)),
.is-prose a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	background-image: linear-gradient(var(--wp--preset--color--primary-bright), var(--wp--preset--color--primary-bright));
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 100% 1px;
	transition: background-size 0.2s ease, color 0.2s ease;
}

.wp-block-post-content a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--primary-bright);
	background-size: 100% 2px;
}

/* Buttons: subtle lift */
.wp-element-button,
.wp-block-button__link {
	transition: transform 0.15s ease, background-color 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 1px 2px rgba(15, 90, 60, 0.12);
}

.wp-element-button:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(15, 90, 60, 0.18);
}

:where(a):focus-visible,
:where(button):focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
	border-radius: 2px;
}

/* =========================================================================
   Eyebrow — mono, uppercase label used above sections (analytical texture)
   ========================================================================= */
.is-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--wp--preset--color--accent);
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
}

.is-eyebrow::before {
	content: "";
	width: 1.6em;
	height: 2px;
	background: var(--wp--preset--color--accent);
	display: inline-block;
}

/* =========================================================================
   Header
   ========================================================================= */
/* Freeze the masthead, let the utility bar scroll away.
   The sticky MUST sit on the template-part wrapper, not on .is-site-header:
   the wrapper is exactly as tall as the header, and a sticky element can never
   escape its parent's box — so sticking the inner element gives it zero travel
   and it scrolls away immediately. The wrapper's own parent (.wp-site-blocks)
   is the full page height, which is the room sticky needs.

   Pulling `top` up by the utility bar's height lets that bar scroll out of
   view while the masthead below it pins to the top. --is-utility-h is measured
   in JS (it changes with the text-size control), with a sane static fallback. */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: calc(-1 * var(--is-utility-h, 33px));
	z-index: 100;
}
.is-site-header {
	border-bottom: 1px solid var(--wp--preset--color--border);
	backdrop-filter: saturate(1.1) blur(6px);
	background: color-mix(in srgb, var(--wp--preset--color--base) 88%, transparent);
}
/* backdrop-filter makes the header a containing block for position:fixed
   descendants, so the mobile nav overlay anchors to the header rather than the
   viewport — and inherits the header's negative sticky offset once scrolled,
   dragging the close button off the top of the screen. Drop the filter while
   the overlay is open so `fixed` resolves against the viewport again. */
.is-site-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
	backdrop-filter: none;
}
/* The header itself has no top padding — the utility bar sits flush against
   the viewport edge. The masthead row carries its own breathing room. */
.is-masthead {
	padding-top: 0.55rem;
}
/* Masthead wordmark. Built from live text rather than a logo image: the only
   Investment Shastra artwork that exists is 200x39 with no retina master, which
   would be soft on any HiDPI screen. Type stays sharp at every size, recolours
   itself for dark mode, and ships with the theme in git — uploads/ is
   gitignored, so an image would be a manual file copy on every deploy. */
.is-site-header .wp-block-site-title { white-space: nowrap; }
.is-site-header .wp-block-site-title a {
	display: inline-block;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	line-height: 1.05;
}
.is-site-header .wp-block-site-title a:hover { color: var(--wp--preset--color--primary); }

.is-site-header .wp-block-site-title a::after {
	content: "by MoneyWorks4Me";
	display: block;
	margin-top: 0.28em;
	font-family: var(--wp--preset--font-family--sans);
	/* Floor of ~9px: below that the letter-spaced caps stop being legible. */
	font-size: max(9px, 0.42em);
	font-weight: 700;
	letter-spacing: 0.17em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	text-indent: 0.06em;
}
.is-site-header .wp-block-site-title a:hover::after {
	color: var(--wp--preset--color--accent);
}
[data-theme="dark"] .is-site-header .wp-block-site-title a::after {
	color: var(--wp--preset--color--primary-bright);
}
@media (max-width: 380px) {
	.is-site-header .wp-block-site-title a::after { letter-spacing: 0.12em; }
}

.is-site-header .wp-block-navigation { flex-wrap: nowrap; font-size: 0.98rem; white-space: nowrap; }
.is-site-header .wp-block-navigation a,
.is-site-header .wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--contrast);
	font-weight: 500;
	text-decoration: none;
}
.is-site-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item > a:hover,
.is-site-header .wp-block-navigation button:hover { color: var(--wp--preset--color--primary); }

/* Dropdown submenu as a refined card */
.is-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 10px;
	box-shadow: 0 12px 34px rgba(22, 36, 29, .12);
	padding: 0.4rem;
	margin-top: 0.4rem;
	min-width: 250px;
}
.is-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item a {
	border-radius: 6px;
	padding: 0.5em 0.75em;
}
.is-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--primary);
}

/* =========================================================================
   Hero (homepage) — full-width band with editorial headline
   ========================================================================= */
.wp-block-group.alignfull.has-surface-background-color {
	position: relative;
	border-bottom: 1px solid var(--wp--preset--color--border);
	background:
		radial-gradient(120% 80% at 100% 0%, color-mix(in srgb, var(--wp--preset--color--accent-soft) 55%, transparent) 0%, transparent 55%),
		var(--wp--preset--color--surface);
}

.wp-block-group.alignfull.has-surface-background-color h1 {
	font-size: var(--wp--preset--font-size--huge);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.04;
}

/* Motion: gentle rise on load */
@media (prefers-reduced-motion: no-preference) {

	.wp-block-group.alignfull.has-surface-background-color > * {
		animation: is-rise 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both;
	}

	.wp-block-group.alignfull.has-surface-background-color > *:nth-child(2) {
		animation-delay: 0.06s;
	}

	.wp-block-group.alignfull.has-surface-background-color > *:nth-child(3) {
		animation-delay: 0.12s;
	}

	@keyframes is-rise {

		from {
			opacity: 0;
			transform: translateY(12px);
		}

		to {
			opacity: 1;
			transform: none;
		}
	}
}

/* =========================================================================
   Learning hub grid (is-2025/hub-grid block)
   ========================================================================= */
.is-hub-section__title {
	font-size: var(--wp--preset--font-size--x-large);
	margin-bottom: var(--wp--preset--spacing--30);
}

.is-hub-group {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--wp--preset--color--accent);
	margin: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--30);
	padding-bottom: 0.6rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	display: flex;
	align-items: center;
	gap: 0.6em;
}

.is-hub-group::before {
	content: "";
	width: 1.6em;
	height: 2px;
	background: var(--wp--preset--color--accent);
}

.is-hub-grid + .is-hub-group {
	margin-top: var(--wp--preset--spacing--50);
}

.is-hub-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
	gap: 1rem;
}

.is-hub-card {
	position: relative;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: 1.5rem 1.4rem 1.35rem;
	background: var(--wp--preset--color--base);
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.is-hub-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, var(--wp--preset--color--primary), var(--wp--preset--color--accent));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}

.is-hub-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 34px rgba(22, 36, 29, 0.1);
	border-color: color-mix(in srgb, var(--wp--preset--color--primary) 30%, var(--wp--preset--color--border));
}

.is-hub-card:hover::before {
	transform: scaleX(1);
}

.is-hub-card__title {
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 620;
	line-height: 1.15;
	margin: 0 0 0.4rem;
	letter-spacing: -0.01em;
}

.is-hub-card__title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.is-hub-card__title a::after {
	content: " →";
	color: var(--wp--preset--color--primary);
	opacity: 0;
	margin-left: -0.4em;
	transition: opacity 0.2s ease, margin 0.2s ease;
}

.is-hub-card:hover .is-hub-card__title a::after {
	opacity: 1;
	margin-left: 0.1em;
}

.is-hub-card:hover .is-hub-card__title a {
	color: var(--wp--preset--color--primary);
}

.is-hub-card__desc {
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
}

/* =========================================================================
   Breadcrumbs (is-2025/breadcrumbs block)
   ========================================================================= */
.is-breadcrumbs {
	margin-bottom: var(--wp--preset--spacing--30);
}

.is-breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.03em;
	color: var(--wp--preset--color--muted);
}

.is-breadcrumb__item + .is-breadcrumb__item::before {
	content: "/";
	margin-right: 0.5em;
	color: var(--wp--preset--color--border);
}

.is-breadcrumb__item a {
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.is-breadcrumb__item a:hover {
	color: var(--wp--preset--color--primary);
}

.is-breadcrumb__item[aria-current="page"] {
	color: var(--wp--preset--color--contrast);
}

/* =========================================================================
   Article trust box (is-2025/article-trust block)
   ========================================================================= */
.is-trust {
	margin: 0 0 var(--wp--preset--spacing--40);
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--wp--preset--color--border);
	border-left: 4px solid var(--wp--preset--color--primary);
	border-radius: 12px;
	background: var(--wp--preset--color--base);
	box-shadow: 0 4px 20px -2px rgba(15, 90, 60, 0.06);
	transition: box-shadow 0.2s ease;
}

.is-trust:hover {
	box-shadow: 0 8px 24px -2px rgba(15, 90, 60, 0.1);
}

.is-trust__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem 0.9rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--muted);
}

.is-trust__meta a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	font-weight: 600;
}

.is-trust__meta a:hover {
	text-decoration: underline;
	color: var(--wp--preset--color--primary-bright);
}

.is-trust__role {
	color: var(--wp--preset--color--muted);
	font-weight: 400;
}

.is-trust__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	padding: 0.2em 0.6em;
	border-radius: 999px;
	background: var(--wp--preset--color--primary-soft);
	color: var(--wp--preset--color--primary);
	font-size: 0.75rem;
	font-weight: 600;
}

.is-trust__sep::before {
	content: "•";
	color: var(--wp--preset--color--accent);
}

.is-trust__disclaimer {
	margin: 0.75rem 0 0;
	padding-top: 0.6rem;
	border-top: 1px dashed var(--wp--preset--color--border);
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	font-style: italic;
	line-height: 1.5;
}

/* Financial Takeaway / Key Insights Callout Box */
.is-takeaway-box {
	margin: 2rem 0;
	padding: 1.35rem 1.5rem;
	background: linear-gradient(135deg, color-mix(in srgb, var(--wp--preset--color--accent-soft) 40%, transparent) 0%, color-mix(in srgb, var(--wp--preset--color--primary-soft) 30%, transparent) 100%);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent) 35%, var(--wp--preset--color--border));
	border-radius: 12px;
	box-shadow: 0 4px 16px rgba(166, 119, 46, 0.06);
}

.is-takeaway-box__title {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--wp--preset--color--accent);
	margin: 0 0 0.5rem;
	display: flex;
	align-items: center;
	gap: 0.4em;
}

.is-takeaway-box p {
	margin: 0;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.6;
}


/* =========================================================================
   Reading content (single / pillar)
   ========================================================================= */
.wp-block-post-title {
	letter-spacing: -0.02em;
}
/* Two serif weights only: 700 for display (hero, site title, article title),
   620 for every other heading. The post-title block is shared by the article
   H1 and the card titles, so the display weight is scoped to the h1 form. */
h1.wp-block-post-title {
	font-weight: 700;
}

.wp-block-post-content {
	font-size: 1.09rem;
	line-height: 1.75;
}

.wp-block-post-content > * + * {
	margin-top: 1.4em;
}

.wp-block-post-content :is(h2, h3) {
	margin-top: 2em;
}

.wp-block-post-content h2 {
	font-size: var(--wp--preset--font-size--x-large);
}

.wp-block-post-content blockquote {
	border-left: 3px solid var(--wp--preset--color--accent);
	margin-left: 0;
	padding: 0.2rem 0 0.2rem 1.4rem;
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-size: 1.3rem;
	line-height: 1.4;
	color: var(--wp--preset--color--contrast);
}

/* Let images, tables and embeds break wider than the text column */
.wp-block-post-content > :is(figure, .wp-block-image, .wp-block-table, .wp-block-embed, img) {
	max-width: min(960px, 100%);
	margin-left: auto;
	margin-right: auto;
}

.wp-block-post-featured-image img {
	border-radius: 12px;
}

/* Doubled class: the parent theme ships `:root :where(.wp-block-post-terms)`
   at weight 600, which ties on specificity and wins on order. */
.wp-block-post-terms.wp-block-post-terms {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.wp-block-post-terms a {
	display: inline-block;
	padding: 0.25em 0.7em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	margin: 0 0.3em 0.3em 0;
	text-decoration: none;
	color: var(--wp--preset--color--muted);
}

.wp-block-post-terms a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

/* =========================================================================
   Author bio (is-2025/author-bio block)
   ========================================================================= */
.is-author-bio {
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
	padding: 1.5rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
}

.is-author-bio__avatar {
	border-radius: 50%;
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
}

.is-author-bio__body {
	min-width: 0;
}

.is-author-bio__eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin: 0 0 0.15rem;
}

.is-author-bio__name {
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 620;
	margin: 0 0 0.4rem;
	line-height: 1.2;
}

.is-author-bio__name a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.is-author-bio__name a:hover {
	color: var(--wp--preset--color--primary);
}

.is-author-bio__role {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--wp--preset--color--muted);
}

.is-author-bio__desc {
	margin: 0 0 0.6rem;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.is-author-bio__expertise {
	list-style: none;
	margin: 0 0 0.6rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.is-author-bio__expertise li {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	padding: 0.2em 0.7em;
	color: var(--wp--preset--color--muted);
}

.is-author-bio__links {
	margin: 0;
	display: flex;
	gap: 1rem;
	font-size: var(--wp--preset--font-size--small);
}

.is-author-bio__links a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.is-author-bio__links a:hover {
	text-decoration: underline;
}

/* =========================================================================
   Related posts (is-2025/related-posts block)
   ========================================================================= */
.is-related__heading {
	font-size: var(--wp--preset--font-size--x-large);
	margin: 0 0 var(--wp--preset--spacing--40);
}

.is-related__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	gap: 1.25rem;
}

.is-related__card {
	display: flex;
	flex-direction: column;
	text-decoration: none;
}

.is-related__img {
	border-radius: 10px;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
	margin-bottom: 0.7rem;
}

.is-related__title {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.2;
	color: var(--wp--preset--color--contrast);
}

.is-related__card:hover .is-related__title {
	color: var(--wp--preset--color--primary);
}

/* Empty state (query-no-results on hubs with no content yet) */
.is-empty-state {
	border: 1px dashed var(--wp--preset--color--border);
	border-radius: 14px;
	background: var(--wp--preset--color--surface);
}

/* =========================================================================
   Post cards (category / archive / latest insights grids)
   ========================================================================= */
.wp-block-query .wp-block-post-template.is-layout-grid {
	gap: 1.6rem;
}

.wp-block-query li.wp-block-post {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.wp-block-query li.wp-block-post:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 34px rgba(22, 36, 29, 0.1);
	border-color: color-mix(in srgb, var(--wp--preset--color--primary) 30%, var(--wp--preset--color--border));
}

.wp-block-query li.wp-block-post .wp-block-post-featured-image {
	margin: 0;
}

.wp-block-query li.wp-block-post .wp-block-post-featured-image img {
	border-radius: 0;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
}

.wp-block-query li.wp-block-post > :not(.wp-block-post-featured-image) {
	margin-left: 1.2rem;
	margin-right: 1.2rem;
}

.wp-block-query li.wp-block-post > .wp-block-post-title {
	margin-top: 1.1rem;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.18;
}

.wp-block-query li.wp-block-post > .wp-block-post-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.wp-block-query li.wp-block-post:hover > .wp-block-post-title a {
	color: var(--wp--preset--color--primary);
}

.wp-block-query li.wp-block-post > .wp-block-post-excerpt {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	margin-bottom: 1.3rem;
}

/* Card meta row: publish date + primary category (mono, quiet) */
.is-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4em 0.75em;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.04em;
	font-weight: 500;
	color: var(--wp--preset--color--muted);
}
.is-card-meta .wp-block-post-date {
	margin: 0;
	color: var(--wp--preset--color--muted);
}
.is-card-meta .is-card-cat {
	margin: 0;
	overflow: hidden;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.is-card-meta .is-card-cat a {
	color: var(--is-label-accent, var(--wp--preset--color--accent));
	text-decoration: none;
}
.is-card-meta .is-card-cat a:hover {
	color: var(--wp--preset--color--primary);
}
/* Show only the primary (first) category so multi-category legacy posts stay tidy */
.is-card-meta .is-card-cat a:not(:first-child),
.is-card-meta .is-card-cat .wp-block-post-terms__separator {
	display: none;
}

/* In a grid card the meta leads the text column; keep the title tight beneath it */
.wp-block-query li.wp-block-post > .is-card-meta {
	margin-top: 1.1rem;
}
.wp-block-query li.wp-block-post > .is-card-meta + .wp-block-post-title {
	margin-top: 0.35rem;
}

/* Image-less legacy posts: a token-tinted band keeps grid cards even instead of
   collapsing to text-only. Scoped to grid layouts so search-result lists are
   unaffected. */
.wp-block-post-template.is-layout-grid li.wp-block-post:not(:has(.wp-block-post-featured-image))::before {
	content: "";
	display: block;
	aspect-ratio: 16 / 6;
	background:
		linear-gradient(135deg,
			color-mix(in srgb, var(--wp--preset--color--primary) 10%, var(--wp--preset--color--surface)),
			color-mix(in srgb, var(--wp--preset--color--accent) 14%, var(--wp--preset--color--surface)));
	border-bottom: 1px solid var(--wp--preset--color--border);
}

/* Archive / search title + query pagination */
.wp-block-query-title {
	letter-spacing: -0.015em;
}

.wp-block-query-pagination {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
}

.wp-block-query-pagination a {
	text-decoration: none;
}

.wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers {
	padding: 0.2em 0.6em;
	border-radius: 6px;
}

.wp-block-query-pagination .page-numbers.current {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

/* Search form */
.wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
}

.wp-block-search__input {
	border: 0;
	background: transparent;
	padding: 0.7em 1.1em;
}

.wp-block-search__button {
	margin: 0.25rem;
	border-radius: 999px;
}

/* =========================================================================
   Footer
   ========================================================================= */
.is-site-footer {
	margin-top: 0;
	/* The footer is a dark panel in both colour schemes, so the light-mode brass
	   (#a6772e) sits on ink at only 4.08:1 — an audit failure at this size.
	   Lifting it toward white brings the column headings to ~6.1:1. */
	--is-label-accent: color-mix(in srgb, var(--wp--preset--color--accent) 75%, #fff);
}

.is-footer-brand {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 700;
	font-size: 1.35rem;
	letter-spacing: -0.02em;
	margin: 0;
}

.is-site-footer p {
	color: color-mix(in srgb, var(--wp--preset--color--base) 78%, transparent);
}

.is-footer-head {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--is-label-accent, var(--wp--preset--color--accent)) !important;
	margin: 0 0 0.4rem;
}

.is-footer-col {
	align-self: flex-start;
}

.is-site-footer a {
	color: color-mix(in srgb, var(--wp--preset--color--base) 82%, transparent);
	text-decoration: none;
}

.is-site-footer a:hover {
	color: var(--wp--preset--color--base);
	text-decoration: underline;
}

.is-footer-bar {
	border-color: color-mix(in srgb, var(--wp--preset--color--base) 16%, transparent) !important;
}

.is-footer-bar p {
	color: color-mix(in srgb, var(--wp--preset--color--base) 60%, transparent);
	max-width: 70ch;
}

/* Header search — quiet filled pill; the border only appears on focus so the
   field reads as one soft shape rather than an outlined box. */
.is-header-search {
	flex-shrink: 0;
}
.is-header-search .wp-block-search__inside-wrapper {
	display: flex;
	align-items: center;
	width: 200px;
	max-width: 200px;
	/* Fixed height keeps the field in proportion with the nav links; without it
	   the button plus the input's own line box push it well past 40px. */
	height: 38px;
	box-sizing: border-box;
	border: 1px solid var(--wp--preset--color--border);
	background: transparent;
	border-radius: 999px;
	padding: 0 3px 0 0;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.is-header-search .wp-block-search__inside-wrapper:hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
}
.is-header-search .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--primary) 12%, transparent);
}
.is-header-search .wp-block-search__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	line-height: 1;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.82rem;
	color: var(--wp--preset--color--contrast);
	border: none;
	background: transparent;
	padding: 0 0.5rem 0 0.9rem;
}
.is-header-search .wp-block-search__input::placeholder {
	color: color-mix(in srgb, var(--wp--preset--color--muted) 80%, transparent);
}
.is-header-search .wp-block-search__input:focus {
	outline: none;
}
.is-header-search .wp-block-search__button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	border-radius: 999px;
	width: 30px;
	height: 30px;
	min-width: 30px;
	padding: 0;
	border: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	flex-shrink: 0;
	transition: background-color 0.2s ease;
}
.is-header-search .wp-block-search__button:hover {
	background: var(--wp--preset--color--primary-bright);
}
.is-header-search .wp-block-search__button svg {
	fill: currentcolor;
	width: 14px;
	height: 14px;
}

/* =========================================================================
   Table of contents (is-2025/toc block)
   ========================================================================= */
.is-toc {
	margin: var(--wp--preset--spacing--40) 0;
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 10px;
	background: var(--wp--preset--color--surface);
}

.is-toc__title {
	margin: 0 0 0.75rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

.is-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: is-toc;
}

.is-toc__item {
	margin: 0;
	padding: 0.22rem 0;
	line-height: 1.45;
}

.is-toc__item a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.is-toc__item a:hover {
	color: var(--wp--preset--color--primary);
	border-bottom-color: currentcolor;
}

.is-toc__item--h2 {
	font-weight: 500;
}

.is-toc__item--h2::before {
	content: counter(is-toc, decimal-leading-zero);
	counter-increment: is-toc;
	margin-right: 0.7em;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78em;
	color: var(--wp--preset--color--accent);
}

.is-toc__item--h3 {
	padding-left: 2.6em;
	font-size: var(--wp--preset--font-size--small);
}

.is-toc__item--h3 a {
	color: var(--wp--preset--color--muted);
}

/* Offset anchor targets so the sticky header never covers a heading. */
.wp-block-post-content :is(h2, h3)[id] {
	scroll-margin-top: 5.5rem;
}

/* =========================================================================
   Legacy content guards
   -------------------------------------------------------------------------
   Imported articles carry KaTeX formulas, wide data tables and code blocks
   that are wider than a phone. Each scrolls inside its own box so it can never
   force the whole page sideways.
   ========================================================================= */
.wp-block-post-content .katex,
.wp-block-post-content .katex-display {
	display: inline-block;
	max-width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	vertical-align: middle;
}

.wp-block-post-content :is(figure.wp-block-table, .wp-block-table) {
	max-width: 100%;
	overflow-x: auto;
}

.wp-block-post-content table {
	display: block;
	width: max-content;
	max-width: 100%;
	overflow-x: auto;
}

.wp-block-post-content pre {
	max-width: 100%;
	overflow-x: auto;
}

.wp-block-post-content :is(img, iframe, video, embed, object) {
	max-width: 100%;
	height: auto;
}

/* Imported copy is often fully justified, which opens rivers of white space on
   a narrow measure. Read left-aligned like the rest of the editorial system. */
.wp-block-post-content :is(p, li, div)[style*="justify"] {
	text-align: left !important;
}

/* Legacy inline data tables arrive with no borders/padding; give them the
   almanac's quiet grid so rows stay readable without touching the content. */
.wp-block-post-content table:not(.is-unstyled) {
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}
.wp-block-post-content table:not(.is-unstyled) :is(th, td) {
	border: 1px solid var(--wp--preset--color--border);
	padding: 0.5em 0.7em;
	text-align: left;
	vertical-align: top;
}
.wp-block-post-content table:not(.is-unstyled) th {
	background: var(--wp--preset--color--surface);
	font-weight: 600;
}
.wp-block-post-content table:not(.is-unstyled) tr:nth-child(even) td {
	background: color-mix(in srgb, var(--wp--preset--color--surface) 55%, transparent);
}

/* =========================================================================
   FAQ section (patterns/faq-section)
   ========================================================================= */
.is-faq :is(h3) {
	margin-top: 1.75em;
}

.is-faq :is(h3) + p {
	margin-top: 0.5em;
	color: var(--wp--preset--color--muted);
}

/* =========================================================================
   Contextual CTA (is-2025/cta block)
   ========================================================================= */
.is-cta {
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	border-radius: 10px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	text-align: center;
}

.is-cta__heading {
	margin: 0 0 1rem;
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--x-large);
}

.is-cta__actions {
	margin: 0;
}

.is-cta__button {
	display: inline-block;
	padding: 0.75em 1.6em;
	border-radius: 6px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.is-cta__button:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.is-cta__button:focus-visible {
	outline: 2px solid var(--wp--preset--color--base);
	outline-offset: 3px;
}

/* Auto-linked concepts read as ordinary content links, not as a special device. */
.wp-block-post-content a.is-glossary-link {
	text-decoration: none;
}

/* =========================================================================
   Sources & method (is-2025/sources block)
   ========================================================================= */
.is-sources {
	padding: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 10px;
	background: var(--wp--preset--color--surface);
	font-size: var(--wp--preset--font-size--small);
}

.is-sources__title {
	margin: 0 0 1rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

.is-sources__cutoff {
	margin: 0 0 1rem;
	padding-bottom: 0.8rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	font-variant-numeric: tabular-nums;
	color: var(--wp--preset--color--muted);
}

.is-sources__field + .is-sources__field {
	margin-top: 1.1rem;
}

.is-sources__label {
	margin: 0 0 0.35rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.is-sources__field p {
	margin: 0 0 0.5em;
	color: var(--wp--preset--color--muted);
	line-height: 1.6;
}

.is-sources__list {
	margin: 0;
	padding-left: 1.3em;
}

.is-sources__list li {
	margin: 0.3em 0;
	color: var(--wp--preset--color--muted);
}

.is-sources__list a {
	color: var(--wp--preset--color--primary);
}

/* =========================================================================
   Corrections (is-2025/corrections block)
   ========================================================================= */
.is-corrections {
	padding: 1.1rem 1.4rem;
	border: 1px solid var(--wp--preset--color--border);
	border-left: 3px solid var(--wp--preset--color--accent);
	border-radius: 10px;
	background: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--small);
}

.is-corrections__title {
	margin: 0 0 0.6rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}

.is-corrections__list {
	margin: 0;
	padding-left: 1.2em;
}

.is-corrections__list li {
	margin: 0.35em 0;
	color: var(--wp--preset--color--muted);
	line-height: 1.6;
}

.is-corrections__date {
	font-family: var(--wp--preset--font-family--mono);
	font-variant-numeric: tabular-nums;
	color: var(--wp--preset--color--contrast);
}

.is-corrections__date::after {
	content: " —";
}

/* =========================================================================
   Newsletter (is-2025/newsletter block)
   ========================================================================= */
.is-newsletter {
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
	background-image: radial-gradient(ellipse at top left, color-mix(in srgb, var(--wp--preset--color--primary) 7%, transparent), transparent 65%);
}

.is-newsletter__title {
	margin: 0 0 0.4rem;
	font-size: var(--wp--preset--font-size--x-large);
}

.is-newsletter__blurb {
	margin: 0 0 1.1rem;
	color: var(--wp--preset--color--muted);
	max-width: 58ch;
}

.is-newsletter__eyebrow,
.is-newsletter__note {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--muted);
}

.is-newsletter__eyebrow {
	text-transform: uppercase;
	margin: 0 0 0.3rem;
}

.is-newsletter__note {
	margin: 0.5rem 0 0;
}

.is-newsletter__form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
}

.is-newsletter__input {
	flex: 1 1 16rem;
	padding: 0.7em 0.9em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 8px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: inherit;
	font-size: 1rem;
}

.is-newsletter__input:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}

.is-newsletter__submit {
	padding: 0.7em 1.5em;
	border: 0;
	border-radius: 8px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.18s ease;
}

.is-newsletter__submit:hover {
	background: var(--wp--preset--color--contrast);
}

/* =========================================================================
   Mobile navigation overlay (overlayMenu: mobile)
   -------------------------------------------------------------------------
   The sticky header uses backdrop-filter, which makes it the containing block
   for the fixed overlay — so the open menu collapsed to the header's box
   (~294px) instead of the viewport. Force viewport sizing (vw/dvh) so the
   overlay always fills the screen, then stack the items as a readable,
   tappable list.
   ========================================================================= */
html:has(.wp-block-navigation__responsive-container.is-menu-open) { overflow: hidden; }

.wp-block-navigation__responsive-container.is-menu-open {
	/* Anchor to all four viewport edges rather than sizing with 100vw/100dvh:
	   100vw counts the scrollbar gutter, which made the overlay wider than the
	   viewport and pushed the close button past the right edge. */
	width: auto !important;
	max-width: none !important;
	height: auto !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	/* Tighter gutters than the page's root padding: 48px each side wastes most
	   of a phone's width and pushes long labels into an ugly wrap. */
	padding: 0.75rem 1.15rem 2rem !important;
	background: var(--wp--preset--color--base);
	overflow-y: auto;
	overscroll-behavior: contain;
}
/* Keep the focus ring inside the overlay — a full-bleed outline on a
   full-width row reads as a stray black box hanging off the screen edge. */
.wp-block-navigation__responsive-container.is-menu-open :is(a, button):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: -2px;
	border-radius: 6px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	padding-top: var(--wp--preset--spacing--40);
	align-items: stretch;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	width: 100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid var(--wp--preset--color--border);
}
/* WP nav lists/items are flex rows by default; inside the overlay that pushes
   submenu links off to the side and overflows the screen. Force every list and
   item in the open overlay into a single full-width vertical column. */
.wp-block-navigation__responsive-container.is-menu-open :is(
	.wp-block-navigation__container,
	.wp-block-navigation-item,
	.wp-block-navigation-submenu,
	.wp-block-navigation__submenu-container
) {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	max-width: 100% !important;
	min-width: 0 !important;
	/* WP applies the global block-gap to these flex lists, which opens huge
	   vertical holes between stacked links. The overlay sets its own rhythm. */
	gap: 0 !important;
}
/* Long labels wrap rather than push the overlay sideways. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	white-space: normal;
	overflow-wrap: anywhere;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
	display: flex;
	align-items: center;
	min-height: 44px;
	width: 100%;
	padding: 0.55rem 0.25rem;
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.2rem;
	font-weight: 620;
	color: var(--wp--preset--color--contrast);
}
/* Neutralise the desktop dropdown-card styling inside the overlay and stack
   the submenu links vertically under their parent when it is expanded.
   (No display/visibility overrides here, so the open-on-click toggle keeps
   working.) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	position: static;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	border: 0;
	box-shadow: none;
	border-radius: 0;
	/* Core indents submenus by 2rem, which on a phone pushes the links into a
	   narrow ragged column. Replace the indent with a hairline rail. */
	padding: 0 0 0 0.85rem !important;
	margin: 0.1rem 0 0.5rem 0.25rem;
	border-left: 1px solid var(--wp--preset--color--border);
	min-width: 0;
	background: transparent;
	width: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 0;
	margin: 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	/* Core's own 8px/16px padding wins without !important, which stretched each
	   row to 58px and left the list feeling airy and hard to scan. */
	min-height: 38px !important;
	padding: 0.15rem 0.5rem !important;
	border-radius: 6px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1rem;
	font-weight: 500;
	color: var(--wp--preset--color--muted);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--primary);
}
/* Close button: pinned inside the overlay's own padding box so it can never
   sit off-screen, and given a full tap target. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: absolute !important;
	top: 0.5rem !important;
	right: 0.75rem !important;
	left: auto !important;
	width: 44px;
	height: 44px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	color: var(--wp--preset--color--contrast);
	z-index: 2;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:hover {
	background: var(--wp--preset--color--surface);
}
/* Room for the close button above the first menu row. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 3.25rem;
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 781px) {

	.wp-block-group.alignfull.has-surface-background-color {
		text-align: left;
	}

	.is-hub-grid {
		grid-template-columns: 1fr;
	}

	.wp-block-post-content {
		font-size: 1.05rem;
	}

	.is-toc {
		padding: 1rem 1.1rem;
	}

	.is-toc__item--h3 {
		padding-left: 1.6em;
	}

	.is-newsletter__form {
		flex-direction: column;
	}

	.is-newsletter__submit {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {

	.is-toc__item a {
		transition: none;
	}

	.is-newsletter__submit {
		transition: none;
	}
}

/* =========================================================================
   Accessibility — label contrast (WCAG 2.2 AA)
   -------------------------------------------------------------------------
   Brass (#a6772e) as small label text on the paper/surface backgrounds was
   ~3.5:1 — below the 4.5:1 AA threshold. Derive a darker brass from the same
   token for label *text* on light surfaces, while the decorative brass rules,
   bars and fills keep the brighter accent. Footer labels sit on the dark
   evergreen panel and keep the bright accent (higher contrast there).
   ========================================================================= */
:root {
	--is-label-accent: color-mix(in srgb, var(--wp--preset--color--accent) 68%, #000);
}
.is-eyebrow,
.is-hub-group,
.is-author-bio__eyebrow,
.is-corrections__title {
	color: var(--is-label-accent);
}
/* Keep the bright brass on the decorative lead-in bars for visual pop. */
.is-eyebrow::before,
.is-hub-group::before {
	background: var(--wp--preset--color--accent);
}

/* =========================================================================
   Dark mode
   -------------------------------------------------------------------------
   A no-flash inline script sets data-theme on <html> before first paint, so
   everything here keys off [data-theme="dark"]. The palette is remapped at the
   token level (:root[data-theme] beats the theme.json :root, regardless of
   source order), so every component that references a preset colour follows
   automatically. Only genuinely inverted spots (the footer, which is forced to
   the "contrast" background) need explicit handling.
   ========================================================================= */
:root[data-theme="dark"] {
	--wp--preset--color--base: #0e1512;
	--wp--preset--color--surface: #161e19;
	--wp--preset--color--surface-2: #1e2822;
	--wp--preset--color--surface-card: #141c17;
	--wp--preset--color--border: #2b3730;
	--wp--preset--color--contrast: #eef2ee;
	--wp--preset--color--muted: #a4b3a9;
	--wp--preset--color--primary: #37b07c;
	--wp--preset--color--primary-bright: #55c893;
	--wp--preset--color--primary-soft: #17271f;
	--wp--preset--color--accent: #d1a75f;
	--wp--preset--color--accent-soft: #2a2317;
	/* Bright brass reads well on the dark ground — undo the light-mode darken. */
	--is-label-accent: color-mix(in srgb, var(--wp--preset--color--accent) 90%, #fff);
	color-scheme: dark;
}

/* Footer is forced to the "contrast" background + "base" text in markup; those
   presets invert in dark mode, so re-point them to a cohesive dark panel. */
[data-theme="dark"] .is-site-footer.has-contrast-background-color {
	background-color: var(--wp--preset--color--surface-2) !important;
}
[data-theme="dark"] .is-site-footer.has-base-color {
	color: var(--wp--preset--color--contrast) !important;
}
[data-theme="dark"] .is-site-footer p {
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 74%, transparent);
}
[data-theme="dark"] .is-site-footer a {
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 82%, transparent);
}
[data-theme="dark"] .is-site-footer a:hover {
	color: var(--wp--preset--color--contrast);
}
[data-theme="dark"] .is-footer-bar p {
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 58%, transparent);
}
[data-theme="dark"] .is-footer-bar {
	border-color: color-mix(in srgb, var(--wp--preset--color--contrast) 16%, transparent) !important;
}

/* =========================================================================
   Header — theme toggle
   ========================================================================= */
/* Colour-scheme toggle — sits in the utility bar, sized to match the text-size
   glyphs (still above the 24px minimum target size). */
.is-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 24px;
	flex-shrink: 0;
	padding: 0;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: var(--wp--preset--color--muted);
	cursor: pointer;
	transition: color 0.15s ease, background 0.15s ease;
}
.is-theme-toggle:hover {
	background: color-mix(in srgb, var(--wp--preset--color--contrast) 7%, transparent);
	color: var(--wp--preset--color--primary);
}
.is-theme-toggle__icon {
	display: block;
}
.is-theme-toggle__sun {
	display: none;
}
[data-theme="dark"] .is-theme-toggle__moon {
	display: none;
}
[data-theme="dark"] .is-theme-toggle__sun {
	display: block;
}

/* =========================================================================
   Reading progress bar (single posts)
   ========================================================================= */
.is-read-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	transform: scaleX(0);
	transform-origin: left center;
	background: linear-gradient(90deg, var(--wp--preset--color--primary), var(--wp--preset--color--accent));
	z-index: 200;
	pointer-events: none;
	will-change: transform;
}

/* =========================================================================
   Article layout — sticky TOC rail on wide screens
   ========================================================================= */
/* Keep the TOC at reading width until there is room for a side rail. */
.is-article-layout > .is-toc {
	max-width: 780px;
	margin-left: auto;
	margin-right: auto;
}

@media (min-width: 1360px) {
	.is-article-layout {
		display: grid;
		grid-template-columns: 1fr min(780px, 100%) 1fr;
		align-items: start;
	}
	.is-article-layout > .is-toc {
		grid-column: 1;
		justify-self: end;
		width: 220px;
		max-width: 220px;
		margin: 0 40px 0 0;
		position: sticky;
		top: 90px;
		max-height: calc(100vh - 120px);
		overflow-y: auto;
	}
	.is-article-layout > .wp-block-post-content {
		grid-column: 2;
	}
}

/* Active section highlight (scroll-spy). */
.is-toc__item a.is-active {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	border-bottom-color: transparent;
}

/* Collapse control — the JS wraps the title in a button; it only does anything
   on small screens, where the list is worth hiding by default. */
.is-toc__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	width: 100%;
	margin: 0;
	padding: 0;
	font: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	color: inherit;
	background: none;
	border: 0;
	cursor: pointer;
	text-align: left;
}
.is-toc__toggle::after {
	content: "";
	display: none;
	width: 0.5rem;
	height: 0.5rem;
	border-right: 2px solid currentcolor;
	border-bottom: 2px solid currentcolor;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}
.is-toc.is-collapsed .is-toc__toggle::after {
	transform: rotate(-45deg);
}
.is-toc.is-collapsed .is-toc__list {
	display: none;
}

@media (min-width: 720px) {
	/* On desktop the TOC is always open; neutralise the toggle. */
	.is-toc__toggle {
		pointer-events: none;
		cursor: default;
	}
}
@media (max-width: 719px) {
	.is-toc__toggle::after {
		display: block;
	}
}

/* =========================================================================
   Copy affordances — heading anchors + code blocks
   ========================================================================= */
.wp-block-post-content :is(h2, h3) {
	position: relative;
}
.is-anchor-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.4em;
	height: 1.4em;
	margin-left: 0.35em;
	padding: 0;
	font-size: 0.7em;
	line-height: 1;
	color: var(--wp--preset--color--muted);
	background: none;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	opacity: 0;
	transform: translateY(-0.1em);
	transition: opacity 0.15s ease, color 0.15s ease, background 0.15s ease;
	vertical-align: middle;
}
:is(h2, h3):hover > .is-anchor-link,
.is-anchor-link:focus-visible {
	opacity: 1;
}
.is-anchor-link:hover {
	color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--surface);
}
.is-anchor-link.is-copied {
	opacity: 1;
	color: var(--wp--preset--color--primary);
}
.is-anchor-link.is-copied::after {
	content: "Link copied";
	position: absolute;
	left: 100%;
	margin-left: 0.4em;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.62em;
	white-space: nowrap;
	color: var(--wp--preset--color--primary);
}

.wp-block-post-content pre {
	position: relative;
}
/* JS wraps bare/legacy tables so the copy button has a positioning context. */
.wp-block-post-content .is-table-wrap {
	position: relative;
}
.is-copy-code,
.is-copy-table {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 1;
	/* Meets the 24px WCAG 2.5.8 target floor without growing the visual pill. */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	min-height: 24px;
	padding: 0.25em 0.6em;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.72rem;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 6px;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.15s ease, color 0.15s ease;
}
.wp-block-post-content pre:hover .is-copy-code,
.wp-block-post-content .is-table-wrap:hover .is-copy-table,
.is-copy-code:focus-visible,
.is-copy-table:focus-visible {
	opacity: 1;
}
.is-copy-code.is-copied,
.is-copy-table.is-copied {
	opacity: 1;
	color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
}

/* =========================================================================
   Smooth anchored scrolling (respecting reduced-motion)
   ========================================================================= */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* =========================================================================
   Header tools — tap targets, font-size control, responsive header
   ========================================================================= */
.is-header-tools {
	align-items: center;
}

/* Accessible tap targets for the touch controls (WCAG 2.5.x). Applied to the
   hamburger/close at every width, and to the search button only where it is a
   standalone tap icon — on desktop it is part of the pill and stays sleek. */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	min-width: 44px;
	min-height: 44px;
}
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* =========================================================================
   Utility bar — slim strip above the masthead: trust line on the left,
   text-size control on the right. Deliberately quiet: it should read as
   chrome, never compete with the nav.
   ========================================================================= */
.is-utility-bar {
	background: color-mix(in srgb, var(--wp--preset--color--surface) 55%, transparent);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--border) 55%, transparent);
}
/* The band spans the viewport; its contents line up with the masthead. */
.is-utility-bar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 32px;
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-right, var(--wp--preset--spacing--40));
}
.is-utility-bar__left {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	min-width: 0;
}

/* Regulatory / trust line. */
.is-utility__trust {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Adviser call to action. */
.is-utility__cta {
	display: inline-flex;
	align-items: center;
	/* 24px is the WCAG 2.5.8 target floor; the text alone measured 21px tall. */
	min-height: 24px;
	gap: 0.3em;
	/* 0.72rem rendered at ~11.5px — under the comfortable floor for a link. */
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.15s ease;
}
.is-utility__cta:hover {
	color: var(--wp--preset--color--primary-bright);
}
.is-utility__arrow {
	transition: transform 0.18s ease;
}
.is-utility__cta:hover .is-utility__arrow {
	transform: translateX(2px);
}

/* Right-hand control cluster: text size + colour scheme. */
.is-utility-bar__tools {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	flex-shrink: 0;
}
.is-utility-bar__sep {
	width: 1px;
	height: 14px;
	background: color-mix(in srgb, var(--wp--preset--color--border) 90%, transparent);
}

/* Text-size control — borderless glyph group (no boxy segmented pill). */
.is-fontsize {
	display: inline-flex;
	align-items: center;
	gap: 1px;
	flex-shrink: 0;
}
.is-fontsize__btn {
	display: inline-flex;
	align-items: baseline;
	justify-content: center;
	min-width: 26px;
	height: 24px;
	padding: 0 0.3em;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: var(--wp--preset--color--muted);
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.is-fontsize__btn:hover {
	background: color-mix(in srgb, var(--wp--preset--color--contrast) 7%, transparent);
	color: var(--wp--preset--color--primary);
}
.is-fontsize__down {
	font-size: 0.68rem;
}
.is-fontsize__reset {
	font-size: 0.8rem;
}
.is-fontsize__up {
	font-size: 0.95rem;
}
.is-fontsize__sign {
	font-size: 0.62em;
	margin-left: 1px;
}

/* =========================================================================
   Responsive header: hamburger + icon rail up to 900px so the inline
   header never cramps; full inline layout above it.
   ========================================================================= */
@media (max-width: 900px) {
	/* Force the nav into its overlay (hamburger) up to 900px. */
	.is-site-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: inline-flex;
	}
	.is-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none;
	}

	/* Search collapses to just its icon button. The desktop pill's fixed 38px
	   height must be released here — the wrapper clips its overflow, so a 40px
	   button inside a 38px box loses a pixel off the top and bottom of the
	   circle. */
	.is-header-search .wp-block-search__inside-wrapper {
		width: auto;
		max-width: none;
		height: auto;
		border: none;
		background: transparent;
		padding: 0;
		overflow: visible;
	}
	.is-header-search .wp-block-search__input {
		display: none;
	}
	.is-header-search .wp-block-search__button {
		width: 40px;
		height: 40px;
		min-width: 40px;
	}
	.is-header-search .wp-block-search__button svg {
		width: 16px;
		height: 16px;
	}

	/* Tap the icon → full-width search bar drops under the frozen header. */
	.is-site-header.is-search-open .is-header-search {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		margin: 0;
		padding: 0.6rem var(--wp--preset--spacing--40);
		background: var(--wp--preset--color--base);
		border-bottom: 1px solid var(--wp--preset--color--border);
		box-shadow: 0 10px 24px rgba(22, 36, 29, 0.1);
		z-index: 95;
	}
	.is-site-header.is-search-open .wp-block-search__inside-wrapper {
		width: 100%;
		display: flex;
		border: 1px solid var(--wp--preset--color--primary);
		background: var(--wp--preset--color--base);
		border-radius: 999px;
		padding: 2px 2px 2px 6px;
	}
	.is-site-header.is-search-open .wp-block-search__input {
		display: block;
		flex: 1 1 auto;
		min-width: 0;
		font-size: 1rem;
		color: var(--wp--preset--color--contrast);
		background: transparent;
		border: none;
		padding: 0.55em 0.6em;
	}

	/* Keep the utility row tight on phones; the trust line truncates first. */
	.is-utility-bar__inner {
		min-height: 28px;
		gap: 0.6rem;
	}
	.is-utility-bar__left {
		gap: 0.6rem;
	}
	.is-utility__trust {
		font-size: 0.62rem;
	}
}
@media (max-width: 480px) {
	/* Below phone width the registration string cannot truncate gracefully
	   alongside the CTA — keep the actionable link and drop the long text. */
	.is-utility__trust {
		display: none;
	}
}

/* =========================================================================
   Load more (query loop)
   -------------------------------------------------------------------------
   The control is a real pagination link, upgraded by JS into a button. Styled
   as a button either way so the no-JS experience looks deliberate.
   ========================================================================= */
.is-loadmore {
	margin-top: var(--wp--preset--spacing--50);
}
.is-loadmore .wp-block-query-pagination-next,
.is-loadmore__all {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.7em 1.8em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	background: transparent;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.is-loadmore .wp-block-query-pagination-next:hover,
.is-loadmore__all:hover {
	background: var(--wp--preset--color--surface);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}
.is-loadmore .wp-block-query-pagination-next.is-loading {
	opacity: 0.6;
	pointer-events: none;
}
/* The archive hand-off reads as the primary next step. */
.is-loadmore__all {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}
.is-loadmore__all:hover {
	background: var(--wp--preset--color--primary-bright);
	border-color: var(--wp--preset--color--primary-bright);
	color: var(--wp--preset--color--base);
}

/* Newly appended cards fade in rather than snapping into place. */
@media (prefers-reduced-motion: no-preference) {
	.wp-block-post-template .is-loaded-in {
		animation: is-fade-in 0.35s ease both;
	}
	@keyframes is-fade-in {
		from { opacity: 0; transform: translateY(6px); }
		to   { opacity: 1; transform: none; }
	}
}

/* =========================================================================
   Legacy inline-style normalisation (B2)
   -------------------------------------------------------------------------
   ~77% of the imported archive carries CKEditor inline styling. Handled in
   CSS rather than by filtering content: the stored posts stay untouched, and
   every rule here is reversible by deleting it.

   Deliberately NOT a blanket colour strip — 3,063 white-text spans sit on
   coloured table backgrounds and are correct. Only the cases that are
   genuinely broken are neutralised.
   ========================================================================= */

/* 1. Hardcoded px/pt font sizes (713 posts) override the rem scale, which
      means the A-/A/A+ text-size control does nothing on most of the archive.
      Let the theme's typography win so the accessibility control works. */
.wp-block-post-content [style*="font-size"] {
	font-size: inherit !important;
}
.wp-block-post-content [style*="font-family"] {
	font-family: inherit !important;
}
/* Line-height set in px against a now-different font size reads as cramped. */
.wp-block-post-content [style*="line-height"] {
	line-height: inherit !important;
}

/* 2. Orphan white text (333 occurrences): white with no background on the
      same element is invisible on the paper background. Anything that DOES
      carry a background is left alone — that is the legitimate case. */
.wp-block-post-content [style*="color:#ffffff"]:not([style*="background"]),
.wp-block-post-content [style*="color: #ffffff"]:not([style*="background"]),
.wp-block-post-content [style*="color:#fff"]:not([style*="background"]),
.wp-block-post-content [style*="color: #fff"]:not([style*="background"]),
.wp-block-post-content [style*="color:white"]:not([style*="background"]),
.wp-block-post-content [style*="color: white"]:not([style*="background"]) {
	/* Not `inherit`: a nested span would inherit the parent's inline white. */
	color: var(--wp--preset--color--contrast) !important;
}

/* 3. Dark mode: every inline colour was authored against a white page, so a
      hardcoded #000 is invisible here. Neutralise inline text colour unless
      the element carries its own background (where the pairing still holds). */
[data-theme="dark"] .wp-block-post-content [style*="color"]:not([style*="background"]) {
	color: var(--wp--preset--color--contrast) !important;
}
/* Links carry their own inline colour too. Give them the link colour rather
   than body ink, so a link still reads as a link. */
[data-theme="dark"] .wp-block-post-content a[style*="color"]:not([style*="background"]) {
	color: var(--wp--preset--color--primary-bright) !important;
}

/* 4. Legacy width/height attributes on tables (122 posts) overflow the
      reading column on phones. */
.wp-block-post-content :is(table, td, th, img)[width],
.wp-block-post-content :is(table, td, th, img)[height] {
	max-width: 100%;
	height: auto;
}

/* 5. Legacy shortcode buttons (`.fasc-button`, from Easy Custom Buttons) carry
      their colours inline but the plugin is deactivated, so they render as bare
      coloured links: zero padding, ~23px tall, under the WCAG 2.5.8 floor.
      inline-block, not flex — these wrap mid-sentence. */
.wp-block-post-content :is(a, button)[class*="fasc-button"] {
	display: inline-block;
	min-height: 24px;
	/* These appear in runs separated by &nbsp;. Padding on an inline-block does
	   not grow the line box, so wrapped rows sat 41px apart for a 41px button —
	   touching, and reading as one green slab with white slits through it.
	   Vertical margin does count toward the line box, so it restores the rhythm.
	   vertical-align keeps each pill centred against the &nbsp; between them. */
	margin: 0.28em 0.12em;
	vertical-align: middle;
	padding: 0.5em 1.1em;
	border-radius: 6px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	background-image: none;
}
.wp-block-post-content [class*="fasc-rounded-large"] { border-radius: 999px; }
.wp-block-post-content [class*="fasc-size-small"] { padding: 0.35em 0.85em; font-size: 0.9em; }
.wp-block-post-content [class*="fasc-size-large"] { padding: 0.7em 1.5em; font-size: 1.05em; }

/* Fallback card thumbnail lifted from post content (B3) — match the real
   featured image's framing so cards stay uniform. */
.wp-block-post-featured-image.is-has-fallback img.is-fallback-thumb {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 8px;
}

/* =========================================================================
   Automatic key takeaways (extractive)
   ========================================================================= */
.is-summary {
	margin: var(--wp--preset--spacing--40) auto;
	max-width: var(--wp--style--global--content-size);
	padding: 1.25rem 1.4rem 1rem;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-left: 3px solid var(--wp--preset--color--accent);
	border-radius: 8px;
}
.is-summary__title {
	margin: 0 0 0.7rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--is-label-accent, var(--wp--preset--color--accent));
}
.is-summary__list { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.55rem; }
.is-summary__list li {
	font-size: 0.97rem;
	line-height: 1.6;
	color: var(--wp--preset--color--contrast);
}
.is-summary__list li::marker { color: var(--wp--preset--color--accent); }
.is-summary__note {
	margin: 0.9rem 0 0;
	padding-top: 0.7rem;
	border-top: 1px solid var(--wp--preset--color--border);
	font-size: 0.76rem;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}
@media (max-width: 600px) {
	.is-summary { padding: 1rem 1.1rem 0.85rem; }
	.is-summary__list li { font-size: 0.93rem; }
}

/* Optional phone on the newsletter block — stacks under the email on narrow
   widths, sits beside it when there is room. */
.is-newsletter__input--phone { flex: 1 1 12ch; }
.is-newsletter__note {
	margin: 0.55rem 0 0;
	font-size: 0.78rem;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

/* Inline result for the newsletter form — the reader is answered where they
   are rather than being thrown onto the plugin's own confirmation page. */
.is-newsletter__status {
	margin: 0.75rem 0 0;
	font-size: 0.92rem;
	line-height: 1.5;
	min-height: 0;
}
.is-newsletter__status:empty { display: none; }
.is-newsletter__status--ok {
	font-weight: 600;
	color: var(--wp--preset--color--primary);
}
[data-theme="dark"] .is-newsletter__status--ok { color: var(--wp--preset--color--primary-bright); }
.is-newsletter__status--error { color: var(--wp--preset--color--accent); }

/* =========================================================================
   Newsletter form injected by the Newsletter plugin (end of every article)
   -------------------------------------------------------------------------
   The plugin renders its own markup with no theme awareness: stacked labels,
   full-width grey inputs and a dark button, so the end of every article looked
   like a different website. This restyles it to match the homepage block
   (.is-newsletter) — same card, same field and button treatment — without
   touching the plugin, so an update cannot undo it.
   ========================================================================= */
.wp-block-post-content .tnp-subscription-posts {
	margin: var(--wp--preset--spacing--50) 0 0;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
	background-image: radial-gradient(ellipse at top left, color-mix(in srgb, var(--wp--preset--color--primary) 7%, transparent), transparent 65%);
}
.wp-block-post-content .tnp-subscription-posts > h2 {
	margin: 0 0 0.4rem;
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--contrast);
}
.wp-block-post-content .tnp-subscription-posts > p {
	margin: 0 0 1.1rem;
	max-width: 58ch;
	color: var(--wp--preset--color--muted);
}
.wp-block-post-content .tnp-subscription { max-width: none; }

/* Lay the plugin's stacked fields out like the theme's inline form. */
.wp-block-post-content .tnp-subscription form {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.6rem;
}
.wp-block-post-content .tnp-subscription .tnp-field {
	flex: 1 1 16rem;
	margin: 0;
}
.wp-block-post-content .tnp-subscription .tnp-field-button { flex: 0 0 auto; }

/* The plugin prints a visible <label> above each field and leaves the
   placeholder empty, which stacks the form and reads nothing like the homepage
   block. Hide the labels visually — theme.js copies their text into the
   placeholder first, so the field stays labelled on screen and to assistive
   tech (the label keeps its `for`, so it is still announced). */
.wp-block-post-content .tnp-subscription .tnp-field label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
.wp-block-post-content .tnp-subscription input[type="email"],
.wp-block-post-content .tnp-subscription input[type="text"],
.wp-block-post-content .tnp-subscription input[type="tel"] {
	width: 100%;
	padding: 0.7em 0.9em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 8px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: inherit;
	font-size: 1rem;
}
.wp-block-post-content .tnp-subscription input:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}
.wp-block-post-content .tnp-subscription input[type="submit"] {
	padding: 0.7em 1.5em;
	border: 0;
	border-radius: 8px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.4;
	cursor: pointer;
	transition: background 0.18s ease;
	-webkit-appearance: none;
	appearance: none;
}
.wp-block-post-content .tnp-subscription input[type="submit"]:hover {
	background: var(--wp--preset--color--contrast);
}