/* Purpleflow Quiet — design tokens + components.
   Light is the default; dark applies via [data-theme="dark"] (set before paint by a head script),
   or via the system setting when JS is unavailable. .pf-scope-* force a mode for previews. */

:root,
[data-theme="light"],
.pf-scope-light {
	--pf-bg: #faf7f2;
	--pf-surface: #ffffff;
	--pf-surface-2: #f2ede4;
	--pf-ink: #1f1b26;
	--pf-muted: #5e5768;
	--pf-accent: #5b3fa0;
	--pf-accent-hover: #47307f;
	--pf-on-accent: #ffffff;
	--pf-accent-soft: #ece6f6;
	--pf-line: #e3dcd0;
	--pf-shadow: 0 1px 2px rgba(31, 27, 38, 0.04), 0 8px 24px rgba(31, 27, 38, 0.06);
	--pf-callout-bg: #2b2140;
	--pf-callout-ink: #f4effb;
	color-scheme: light;
}

[data-theme="dark"],
.pf-scope-dark {
	--pf-bg: #15111b;
	--pf-surface: #1d1825;
	--pf-surface-2: #262030;
	--pf-ink: #efeaf5;
	--pf-muted: #b4abc2;
	--pf-accent: #bba6ec;
	--pf-accent-hover: #d0c2f5;
	--pf-on-accent: #17111f;
	--pf-accent-soft: #2d2440;
	--pf-line: #322b3e;
	--pf-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 10px 30px rgba(0, 0, 0, 0.35);
	--pf-callout-bg: #2d2440;
	--pf-callout-ink: #efeaf5;
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme]) {
		--pf-bg: #15111b;
		--pf-surface: #1d1825;
		--pf-surface-2: #262030;
		--pf-ink: #efeaf5;
		--pf-muted: #b4abc2;
		--pf-accent: #bba6ec;
		--pf-accent-hover: #d0c2f5;
		--pf-on-accent: #17111f;
		--pf-accent-soft: #2d2440;
		--pf-line: #322b3e;
		--pf-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 10px 30px rgba(0, 0, 0, 0.35);
		--pf-callout-bg: #2d2440;
		--pf-callout-ink: #efeaf5;
		color-scheme: dark;
	}
}

/* ---------- Base ---------- */
body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { text-wrap: balance; }
p, li { text-wrap: pretty; }
::selection { background: var(--pf-accent-soft); color: var(--pf-ink); }
:focus-visible { outline: 2px solid var(--pf-accent); outline-offset: 3px; border-radius: 4px; }
img { height: auto; }

html.pf-transition,
html.pf-transition *,
html.pf-transition *::before,
html.pf-transition *::after {
	transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
@media (prefers-reduced-motion: reduce) {
	html.pf-transition, html.pf-transition * { transition: none !important; }
	* { scroll-behavior: auto !important; }
}

.pf-eyebrow {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--pf-accent);
	margin: 0;
}

/* ---------- Header / footer ---------- */
.pf-header { border-bottom: 1px solid var(--pf-line); }
.pf-header__bar { gap: 1.5rem; padding-block: 1.1rem; }
.pf-footer { border-top: 1px solid var(--pf-line); background: var(--pf-surface-2); margin-top: var(--wp--preset--spacing--70); }
.pf-footer a { color: var(--pf-muted); text-decoration: none; }
.pf-footer a:hover { color: var(--pf-ink); text-decoration: underline; }
.pf-footer h2, .pf-footer h3 { font-size: 0.8rem; font-family: var(--wp--preset--font-family--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--pf-muted); font-weight: 600; }
.pf-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.5rem; }
.pf-footer h3 { margin: 0 0 0.9rem; }
.pf-footer hr.wp-block-separator { width: 100%; max-width: 1200px; margin-inline: auto; border: 0; border-top: 1px solid var(--pf-line); background: none; }
.pf-legal { font-size: 0.85rem; color: var(--pf-muted); max-width: 1200px; margin-inline: auto; }

/* Brand: monogram tinted by the accent colour, so it reads in light and dark */
.pf-brand { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; color: var(--pf-ink); }
.pf-brand__mark { width: 1.9rem; height: 1.9rem; flex: none; background-color: var(--pf-accent); -webkit-mask: url("../img/pf-mark.png") center / contain no-repeat; mask: url("../img/pf-mark.png") center / contain no-repeat; transition: background-color 0.3s ease; }
.pf-brand__name { font-family: var(--wp--preset--font-family--serif); font-size: 1.6rem; line-height: 1; letter-spacing: -0.01em; font-weight: 400; }
.pf-brand:hover .pf-brand__mark { background-color: var(--pf-accent-hover); }
.pf-footer .pf-brand { color: var(--pf-ink); }
.pf-footer .pf-brand:hover { text-decoration: none; }

/* Color-mode toggle */
.pf-toggle {
	display: inline-grid;
	place-items: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: 999px;
	border: 1px solid var(--pf-line);
	background: var(--pf-surface);
	color: var(--pf-ink);
	cursor: pointer;
	padding: 0;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.pf-toggle:hover { border-color: var(--pf-accent); transform: translateY(-1px); }
.pf-toggle svg { width: 1.15rem; height: 1.15rem; grid-area: 1 / 1; }
.pf-toggle .pf-icon-moon { display: none; }
[data-theme="dark"] .pf-toggle .pf-icon-sun { display: none; }
[data-theme="dark"] .pf-toggle .pf-icon-moon { display: block; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme]) .pf-toggle .pf-icon-sun { display: none; }
	:root:not([data-theme]) .pf-toggle .pf-icon-moon { display: block; }
}

/* ---------- Components ---------- */
.pf-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.85rem 1.75rem;
	border-radius: 999px;
	font: 500 1rem/1 var(--wp--preset--font-family--sans);
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.pf-btn--primary { background: var(--pf-accent); color: var(--pf-on-accent); }
.pf-btn--primary:hover { background: var(--pf-accent-hover); color: var(--pf-on-accent); transform: translateY(-1px); }
.pf-btn--ghost { background: transparent; color: var(--pf-ink); border-color: var(--pf-line); }
.pf-btn--ghost:hover { border-color: var(--pf-accent); color: var(--pf-accent); }

.pf-card {
	background: var(--pf-surface);
	border: 1px solid var(--pf-line);
	border-radius: 20px;
	overflow: hidden;
	box-shadow: var(--pf-shadow);
	transition: transform 0.25s ease, border-color 0.25s ease;
}
.pf-card:hover { transform: translateY(-3px); border-color: var(--pf-accent); }
.pf-card__body { padding: 1.4rem 1.5rem 1.6rem; display: grid; gap: 0.6rem; }
.pf-card__title { font-family: var(--wp--preset--font-family--serif); font-size: 1.4rem; line-height: 1.25; margin: 0; font-weight: 400; color: var(--pf-ink); }
.pf-card__meta { font-size: 0.85rem; color: var(--pf-muted); margin: 0; }
.pf-card__excerpt { margin: 0; color: var(--pf-muted); font-size: 1rem; line-height: 1.6; }
.pf-ph {
	aspect-ratio: 16 / 10;
	background:
		radial-gradient(120% 90% at 20% 10%, var(--pf-accent-soft), transparent 60%),
		linear-gradient(160deg, var(--pf-surface-2), var(--pf-accent-soft));
	display: grid;
	place-items: end start;
	padding: 1rem 1.25rem;
	font-size: 0.78rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--pf-muted);
}
.pf-chip {
	display: inline-block;
	padding: 0.3rem 0.8rem;
	border-radius: 999px;
	background: var(--pf-accent-soft);
	color: var(--pf-accent);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}
.pf-input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.85rem 1.1rem;
	border-radius: 14px;
	border: 1px solid var(--pf-line);
	background: var(--pf-surface);
	color: var(--pf-ink);
	font: 400 1rem/1.4 var(--wp--preset--font-family--sans);
}
.pf-input::placeholder { color: var(--pf-muted); }
.pf-input:focus { border-color: var(--pf-accent); outline: 2px solid var(--pf-accent-soft); }
.pf-byline { display: flex; align-items: center; gap: 0.75rem; font-size: 0.9rem; color: var(--pf-muted); }
.pf-avatar { width: 2.4rem; height: 2.4rem; border-radius: 999px; background: linear-gradient(135deg, var(--pf-accent), var(--pf-accent-soft)); flex: none; }
.pf-quote { font-family: var(--wp--preset--font-family--serif); font-size: 1.45rem; line-height: 1.35; margin: 0; padding-left: 1.25rem; border-left: 2px solid var(--pf-accent); }

/* ---------- Homepage ---------- */
.pf-section { padding-block: var(--wp--preset--spacing--60) 0; }
.pf-section__head { margin-bottom: 2rem; gap: 1rem; }
.pf-section__head h2 { margin: 0.4rem 0 0; }
.pf-link-arrow { color: var(--pf-ink); font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--pf-line); padding-bottom: 2px; transition: border-color 0.2s ease, color 0.2s ease; }
.pf-link-arrow:hover { color: var(--pf-accent); border-color: var(--pf-accent); }

.pf-hero { padding-top: clamp(2rem, 5vw, 4.5rem); }
.pf-hero__cols { gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.pf-hero__title { margin: 1rem 0 1.25rem; font-size: clamp(2.8rem, 6.4vw, 5.2rem) !important; line-height: 1.04; letter-spacing: -0.02em; }
.pf-hero__lede { max-width: 34rem; margin: 0 0 2rem; }
.pf-hero__cta { margin-bottom: 1.75rem; }
.pf-assure { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; font-size: 0.9rem; color: var(--pf-muted); }
.pf-assure li { display: inline-flex; align-items: center; gap: 0.5rem; }
.pf-assure li::before { content: ""; width: 0.45rem; height: 0.45rem; border-radius: 999px; background: var(--pf-accent); }
.pf-hero__figure, .pf-trust__figure, .pf-band__figure { margin: 0; }
.pf-hero__figure img { width: 100%; max-height: 640px; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 30%; border-radius: 28px; display: block; box-shadow: var(--pf-shadow); }
.pf-trust__figure img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 24px; display: block; }

.pf-topics { margin-top: clamp(2.5rem, 6vw, 4.5rem); border-block: 1px solid var(--pf-line); }
.pf-topics__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pf-topics__list li + li { border-left: 1px solid var(--pf-line); }
.pf-topics__list a { display: grid; gap: 0.3rem; padding: 1.6rem 1.5rem; text-decoration: none; color: var(--pf-ink); transition: background-color 0.2s ease; height: 100%; box-sizing: border-box; }
.pf-topics__list a:hover { background: var(--pf-accent-soft); }
.pf-topics__n { font-size: 0.75rem; letter-spacing: 0.14em; color: var(--pf-accent); font-weight: 600; }
.pf-topics__t { font-family: var(--wp--preset--font-family--serif); font-size: 1.6rem; line-height: 1.1; }
.pf-topics__d { font-size: 0.92rem; color: var(--pf-muted); line-height: 1.45; }

.pf-feature-query { margin-bottom: 1.75rem; }
.pf-feature.pf-card { display: grid; grid-template-columns: 1.25fr 1fr; align-items: stretch; }
.pf-feature .pf-feature__img, .pf-feature .wp-block-post-featured-image { margin: 0; height: 100%; }
.pf-feature .wp-block-post-featured-image img { height: 100%; min-height: 320px; object-fit: cover; width: 100%; }
.pf-feature__body { align-content: center; padding: clamp(1.5rem, 3.5vw, 3rem); gap: 1rem; }
.pf-feature__title { font-size: clamp(1.7rem, 2.8vw, 2.4rem) !important; line-height: 1.15; }
.pf-feature__title a, .pf-card__title a { color: var(--pf-ink); text-decoration: none; }
.pf-feature__title a:hover, .pf-card__title a:hover { color: var(--pf-accent); }
.pf-grid-query .wp-block-post-template { gap: 1.75rem; }
.pf-card .wp-block-post-featured-image { margin: 0; }
.pf-card .wp-block-post-featured-image img { display: block; width: 100%; object-fit: cover; }
.pf-card .wp-block-post-excerpt__excerpt { margin: 0; }
.pf-card .wp-block-post-excerpt { margin: 0; }
.pf-chips { margin: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; font-size: 0.8rem; }
.pf-chips a { display: inline-block; padding: 0.28rem 0.75rem; border-radius: 999px; background: var(--pf-accent-soft); color: var(--pf-accent); font-weight: 600; letter-spacing: 0.03em; text-decoration: none; }
.pf-chips a:hover { background: var(--pf-accent); color: var(--pf-on-accent); }
.pf-chips .wp-block-post-terms__separator { display: none; }

.pf-trust__cols { gap: clamp(2rem, 5vw, 5rem); }
.pf-steps { list-style: none; margin: 1.75rem 0 2rem; padding: 0; display: grid; gap: 0; }
.pf-steps li { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.25rem 0; border-top: 1px solid var(--pf-line); }
.pf-steps li:last-child { border-bottom: 1px solid var(--pf-line); }
.pf-steps__n { font-size: 0.8rem; letter-spacing: 0.14em; font-weight: 600; color: var(--pf-accent); padding-top: 0.35rem; }
.pf-steps h3 { margin: 0 0 0.3rem; font-size: 1.35rem; }
.pf-steps p { margin: 0; color: var(--pf-muted); font-size: 1rem; line-height: 1.6; }

.pf-band { display: grid; grid-template-columns: 1.15fr 0.85fr; align-items: stretch; background: var(--pf-surface-2); border: 1px solid var(--pf-line); border-radius: 28px; overflow: hidden; }
.pf-band__text { padding: clamp(2rem, 5vw, 4.5rem); display: grid; gap: 1.1rem; align-content: center; }
.pf-band__text h2 { margin: 0; font-size: clamp(1.9rem, 3.4vw, 2.9rem); }
.pf-band__text p { margin: 0; color: var(--pf-muted); max-width: 30rem; }
.pf-band__text .pf-eyebrow { margin-bottom: 0; }
.pf-band__figure img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; display: block; }

/* Keep photography calm in dark mode */
[data-theme="dark"] .pf-hero__figure img, [data-theme="dark"] .pf-trust__figure img, [data-theme="dark"] .pf-band__figure img, [data-theme="dark"] .pf-card img { filter: brightness(0.86) contrast(1.03); }

@media (max-width: 900px) {
	.pf-topics__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pf-topics__list li:nth-child(3) { border-left: 0; }
	.pf-topics__list li:nth-child(n+3) { border-top: 1px solid var(--pf-line); }
	.pf-feature.pf-card { grid-template-columns: 1fr; }
	.pf-band { grid-template-columns: 1fr; }
	.pf-band__figure { order: -1; }
	.pf-band__figure img { min-height: 0; aspect-ratio: 16 / 10; }
}
@media (max-width: 781px) {
	.pf-hero__figure img { aspect-ratio: 1 / 1; max-height: 460px; object-position: center 88%; }
	.pf-trust__figure img { aspect-ratio: 4 / 3; }
}

/* Wide banner images: show whole */
.pf-wide-box { background: var(--pf-accent-soft); aspect-ratio: auto !important; }
.pf-card .pf-wide-box img.pf-wide, .pf-card img.pf-wide { aspect-ratio: auto !important; height: auto !important; min-height: 0 !important; object-fit: contain !important; }
.pf-article__img.pf-wide-box { aspect-ratio: auto !important; }
.pf-article__img img.pf-wide { aspect-ratio: auto !important; height: auto !important; object-fit: contain !important; }
.pf-feature--wide.pf-card { grid-template-columns: 1fr; }
.pf-feature--wide .wp-block-post-featured-image img { min-height: 0 !important; height: auto !important; }

/* ---------- Article ---------- */
.pf-progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 100; background: transparent; pointer-events: none; }
.pf-progress span { display: block; height: 100%; width: 0; background: var(--pf-accent); transition: width 0.1s linear; }
.pf-article__head { padding-top: clamp(2.5rem, 6vw, 5rem); }
.pf-article__head > * { margin-block: 0; }
.pf-article__head > * + * { margin-top: 1.1rem; }
.pf-article__head > .pf-chips { margin-bottom: 0.4rem; }
.pf-article__title { font-size: clamp(2.2rem, 5vw, 3.8rem) !important; line-height: 1.08; letter-spacing: -0.02em; }
.pf-article__dek { font-size: clamp(1.15rem, 1.8vw, 1.35rem); color: var(--pf-muted); line-height: 1.55; }
.pf-article__dek p { margin: 0; }
.pf-article__byline { gap: 1rem 1.25rem; padding-top: 1rem; margin-top: 1.5rem; border-top: 1px solid var(--pf-line); }
.pf-article__byline .wp-block-post-author { display: flex; align-items: center; gap: 0.75rem; }
.pf-article__byline .wp-block-post-author__avatar { margin: 0; }
.pf-article__byline .wp-block-post-author__avatar img, .pf-authorbox .wp-block-post-author__avatar img { border-radius: 999px; object-fit: cover; display: block; }
.pf-article__byline .wp-block-post-author__name { font-weight: 600; font-size: 1rem; }
.pf-article__byline .wp-block-post-author__name a, .pf-authorbox .wp-block-post-author__name a { color: var(--pf-ink); text-decoration: none; }
.pf-article__byline .wp-block-post-author__byline { color: var(--pf-muted); font-size: 0.85rem; margin: 0; }
.pf-article__hero { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.pf-article__hero > * { max-width: 1100px; margin-inline: auto; }
.pf-article__img { margin: 0; }
.pf-article__img img { width: 100%; border-radius: 24px; display: block; box-shadow: var(--pf-shadow); }
.pf-article__body { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* Author portraits: win over the Author Portraits plugin's own avatar shape */
.pf-article__byline .wp-block-post-author__avatar img.avatar, .pf-authorbox .wp-block-post-author__avatar img.avatar { border-radius: 999px !important; object-fit: cover !important; object-position: center 25% !important; aspect-ratio: 1 / 1 !important; padding: 0 !important; border: 0 !important; background: var(--pf-accent-soft); }
.pf-article__byline .wp-block-post-author__avatar img.avatar { width: 48px !important; height: 48px !important; }
.pf-authorbox .wp-block-post-author__avatar img.avatar { width: 96px !important; height: 96px !important; }

/* Breadcrumbs (Yoast output or the built-in fallback) */
.pf-breadcrumbs { font-size: 0.85rem; color: var(--pf-muted); line-height: 1.5; margin-bottom: 0.6rem; }
.pf-breadcrumbs a { color: var(--pf-muted); text-decoration: none; }
.pf-breadcrumbs a:hover { color: var(--pf-accent); text-decoration: underline; }
.pf-breadcrumbs p, .pf-breadcrumbs span { margin: 0; }
.pf-breadcrumbs .pf-breadcrumbs__sep { margin-inline: 0.55rem; opacity: 0.6; }
.pf-breadcrumbs .breadcrumb_last, .pf-breadcrumbs [aria-current] { color: var(--pf-ink); }

/* Reading typography */
.pf-prose { font-size: 1.15rem; line-height: 1.78; }
.pf-prose > * { margin-block: 0 1.35em; }
.pf-prose h2 { font-size: clamp(1.7rem, 3vw, 2.15rem); margin-top: 2.4em; margin-bottom: 0.6em; scroll-margin-top: 5rem; }
.pf-prose h3 { font-size: clamp(1.3rem, 2.2vw, 1.55rem); margin-top: 2em; margin-bottom: 0.5em; scroll-margin-top: 5rem; }
.pf-prose ul, .pf-prose ol { padding-left: 1.3em; }
.pf-prose li { margin-block: 0.4em; }
.pf-prose li::marker { color: var(--pf-accent); }
.pf-prose a { text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pf-prose strong { color: var(--pf-ink); font-weight: 650; }
.pf-prose figure { margin-block: 2.2em; }
.pf-prose img { border-radius: 18px; max-width: 100%; height: auto; }
.pf-prose figcaption { color: var(--pf-muted); font-size: 0.88rem; text-align: center; margin-top: 0.75rem; }
.pf-prose blockquote { font-family: var(--wp--preset--font-family--serif); font-size: 1.45rem; line-height: 1.4; margin-block: 2em; padding: 0.25rem 0 0.25rem 1.5rem; border-left: 2px solid var(--pf-accent); color: var(--pf-ink); }
.pf-prose blockquote p { margin: 0; }
.pf-prose hr { border: 0; border-top: 1px solid var(--pf-line); margin-block: 2.5em; }
.pf-prose table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.pf-prose th, .pf-prose td { text-align: left; padding: 0.7rem 0.9rem; border-bottom: 1px solid var(--pf-line); }
.pf-prose th { font-weight: 600; color: var(--pf-ink); background: var(--pf-surface-2); }
.pf-prose .wp-block-table { overflow-x: auto; }

/* Generated "In this article" outline */
.pf-toc { background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: 18px; padding: 0.25rem 1.4rem; margin-bottom: 2.2em !important; font-size: 1rem; line-height: 1.5; }
.pf-toc summary { cursor: pointer; list-style: none; padding: 1rem 0; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: var(--pf-muted); display: flex; justify-content: space-between; align-items: center; }
.pf-toc summary::-webkit-details-marker { display: none; }
.pf-toc summary::after { content: "+"; font-size: 1.2rem; color: var(--pf-accent); letter-spacing: 0; }
.pf-toc[open] summary::after { content: "–"; }
.pf-toc ol { list-style: none; margin: 0 0 1rem; padding: 0; counter-reset: toc; display: grid; gap: 0.1rem; }
.pf-toc li { counter-increment: toc; margin: 0; }
.pf-toc li::marker { content: none; }
.pf-toc a { display: grid; grid-template-columns: 2rem 1fr; padding: 0.45rem 0; color: var(--pf-ink); text-decoration: none; border-top: 1px solid var(--pf-line); }
.pf-toc a::before { content: counter(toc, decimal-leading-zero); font-size: 0.75rem; letter-spacing: 0.1em; color: var(--pf-accent); font-weight: 600; padding-top: 0.2rem; }
.pf-toc a:hover { color: var(--pf-accent); }

.pf-note { font-size: 0.9rem; color: var(--pf-muted); border-top: 1px solid var(--pf-line); padding-top: 1.25rem; margin: 3rem 0 1.5rem; }
.pf-share { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; padding-block: 1.25rem; border-block: 1px solid var(--pf-line); margin-bottom: 2.5rem; }
.pf-share__label { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: var(--pf-muted); }
.pf-share__links { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pf-share__link { font: 500 0.9rem/1 var(--wp--preset--font-family--sans); padding: 0.6rem 1.05rem; border-radius: 999px; border: 1px solid var(--pf-line); background: var(--pf-surface); color: var(--pf-ink); text-decoration: none; cursor: pointer; transition: border-color 0.2s ease, color 0.2s ease; }
.pf-share__link:hover { border-color: var(--pf-accent); color: var(--pf-accent); }

.pf-authorbox { background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: 24px; padding: clamp(1.25rem, 3vw, 2rem); }
.pf-authorbox .wp-block-post-author { display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 1.5rem; align-items: start; }
.pf-authorbox .wp-block-post-author__avatar { grid-row: 1 / span 3; margin: 0; }
.pf-authorbox .wp-block-post-author__avatar img { width: 96px; height: 96px; }
.pf-authorbox .wp-block-post-author__content { display: grid; gap: 0.35rem; }
.pf-authorbox .wp-block-post-author__byline { margin: 0; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--pf-muted); font-weight: 600; }
.pf-authorbox .wp-block-post-author__name { font-family: var(--wp--preset--font-family--serif); font-size: 1.6rem; margin: 0; }
.pf-authorbox .wp-block-post-author__bio { margin: 0; color: var(--pf-muted); font-size: 1rem; line-height: 1.65; }

.pf-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; }
.pf-card__img { display: block; }
.pf-card__img img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.pf-cards .pf-chips { margin: 0; }
.pf-cards .pf-card__title { margin: 0; }
[data-theme="dark"] .pf-article__img img, [data-theme="dark"] .pf-prose img { filter: brightness(0.88) contrast(1.03); }

@media (max-width: 900px) {
	.pf-cards { grid-template-columns: 1fr; }
	.pf-authorbox .wp-block-post-author { grid-template-columns: 1fr; }
	.pf-authorbox .wp-block-post-author__avatar { grid-row: auto; }
	.pf-article__img img { border-radius: 16px; }
}


/* ---------- Pages, listings, archives ---------- */
.pf-page__head, .pf-listing__head { padding-top: clamp(2.5rem, 6vw, 5rem); padding-bottom: clamp(1rem, 2vw, 1.5rem); text-align: center; }
.pf-page__head > *, .pf-listing__head > * { margin-block: 0; }
.pf-listing__head > * + * { margin-top: 1rem; }
.pf-page__title, .pf-listing__title { font-size: clamp(2.4rem, 5.5vw, 4rem) !important; line-height: 1.06; letter-spacing: -0.02em; text-align: center; }
.pf-listing__head .wp-block-term-description p { margin: 0; }
.pf-listing__body { padding-top: clamp(1.5rem, 3vw, 2.5rem); }
.pf-page__body { padding-top: clamp(1rem, 2vw, 2rem); }
.pf-page .pf-prose { font-size: 1.1rem; }

.pf-pagination { margin-top: 3rem; gap: 0.4rem; font-size: 0.95rem; align-items: center; }
.pf-pagination a, .pf-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; padding: 0 0.9rem; border-radius: 999px; border: 1px solid var(--pf-line); background: var(--pf-surface); color: var(--pf-ink); text-decoration: none; box-sizing: border-box; }
.pf-pagination a:hover { border-color: var(--pf-accent); color: var(--pf-accent); }
.pf-pagination .page-numbers.current { background: var(--pf-accent); border-color: var(--pf-accent); color: var(--pf-on-accent); }

.pf-search { max-width: 34rem; margin-inline: auto; }
.pf-search .wp-block-search__inside-wrapper { display: flex; gap: 0.5rem; border: 0; padding: 0; }
.pf-search .wp-block-search__input { flex: 1; padding: 0.9rem 1.25rem; border-radius: 999px; border: 1px solid var(--pf-line); background: var(--pf-surface); color: var(--pf-ink); font: 400 1rem/1.4 var(--wp--preset--font-family--sans); }
.pf-search .wp-block-search__input:focus { border-color: var(--pf-accent); outline: 2px solid var(--pf-accent-soft); }
.pf-search .wp-block-search__button { border: 0; border-radius: 999px; padding: 0 1.6rem; background: var(--pf-accent); color: var(--pf-on-accent); font: 500 1rem/1 var(--wp--preset--font-family--sans); cursor: pointer; margin: 0; }
.pf-search .wp-block-search__button:hover { background: var(--pf-accent-hover); }

/* Author archive header */
.pf-listing__head--author { text-align: left; }
.pf-author-head { display: grid; grid-template-columns: auto 1fr; gap: clamp(1.25rem, 4vw, 3rem); align-items: center; }
body .pf-author-head img.avatar.pf-author-head__img, .pf-author-head__img { width: clamp(110px, 16vw, 160px) !important; height: clamp(110px, 16vw, 160px) !important; border-radius: 999px !important; object-fit: cover !important; object-position: center 25% !important; aspect-ratio: 1 / 1 !important; padding: 0 !important; border: 0 !important; background: var(--pf-accent-soft); box-shadow: var(--pf-shadow); display: block; }
.pf-author-head__text > * { margin: 0; }
.pf-author-head__text > * + * { margin-top: 0.7rem; }
.pf-author-head__name { font-family: var(--wp--preset--font-family--serif); font-weight: 400; font-size: clamp(2.2rem, 4.5vw, 3.4rem); line-height: 1.08; letter-spacing: -0.02em; }
.pf-author-head__bio { color: var(--pf-muted); font-size: 1.1rem; line-height: 1.65; max-width: 40rem; }
.pf-author-head__count { font-size: 0.85rem; color: var(--pf-muted); letter-spacing: 0.04em; }
@media (max-width: 700px) { .pf-author-head { grid-template-columns: 1fr; } }

/* ---------- Legacy page content normaliser ----------
   Older pages carry hard-coded colours in inline styles (light only). Map the known set onto tokens
   so the same content follows light and dark mode without editing the page text. */
.pf-legacy [style*="background-color:#faf7ff" i], .pf-legacy [style*="background-color:#f5f2ff" i], .pf-legacy [style*="background-color:#f7f4ff" i], .pf-legacy [style*="background-color:#ffffff" i] { background-color: var(--pf-surface) !important; border: 1px solid var(--pf-line); border-radius: 20px !important; }
.pf-legacy [style*="background-color:#fafafa" i], .pf-legacy [style*="background-color:#f8f8f8" i] { background-color: var(--pf-surface) !important; border: 1px solid var(--pf-line); border-radius: 20px !important; }
.pf-legacy [style*="background-color:#2d174d" i] { background-color: var(--pf-callout-bg) !important; border-radius: 24px !important; color: var(--pf-callout-ink) !important; }
.pf-legacy [style*="background-color:#2d174d" i] :is(h1, h2, h3, h4, p, li, span, strong, em, div, a):not(.wp-element-button) { color: var(--pf-callout-ink) !important; }
.pf-legacy [style*="background-color:#2d174d" i] a:not(.wp-element-button) { text-decoration-color: currentColor; }
.pf-legacy [style*="color:#6b46c1" i] { color: var(--pf-accent) !important; }
.pf-legacy [style*="color:#555" i], .pf-legacy [style*="color:#666666" i], .pf-legacy [style*="color:#666" i] { color: var(--pf-muted) !important; }
.pf-legacy [style*="border-color:#eadfff" i], .pf-legacy [style*="border-color:#ece7fb" i] { border-color: var(--pf-line) !important; }
.pf-legacy [style*="font-size:11px" i], .pf-legacy [style*="font-size:12px" i], .pf-legacy [style*="font-size:13px" i] { font-size: 0.78rem !important; letter-spacing: 0.14em !important; font-weight: 600; }
.pf-legacy h2[style*="font-size:42px" i], .pf-legacy h2[style*="font-size:34px" i] { font-size: clamp(1.8rem, 3.4vw, 2.4rem) !important; line-height: 1.12 !important; }
.pf-legacy .has-large-font-size { font-size: 1.3rem !important; line-height: 1.6; color: var(--pf-muted); }
.pf-legacy .has-background > .wp-block-group__inner-container > :first-child, .pf-legacy .has-background > :first-child { margin-top: 0; }
.pf-legacy .has-background :is(h2, h3) { margin-top: 0; font-size: 1.5rem; margin-bottom: 0.6em; }
.pf-legacy .has-background p:last-child, .pf-legacy .has-background ul:last-child { margin-bottom: 0; }
.pf-legacy .wp-block-columns { gap: 1.5rem; align-items: stretch; }
.pf-legacy .wp-block-column > .wp-block-group { height: 100%; box-sizing: border-box; }
.pf-legacy .wp-block-spacer { height: 1.25rem !important; }
.pf-legacy .wp-block-buttons { gap: 0.75rem; }
.pf-legacy .wp-block-button__link { border-radius: 999px !important; text-decoration: none; padding: 0.8rem 1.6rem !important; font-weight: 500; }
.pf-legacy .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--pf-accent) !important; color: var(--pf-on-accent) !important; border: 1px solid transparent; }
.pf-legacy .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: var(--pf-accent-hover) !important; }
.pf-legacy .wp-block-button.is-style-outline .wp-block-button__link { background: transparent !important; color: var(--pf-ink) !important; border: 1px solid var(--pf-line) !important; }
.pf-legacy .wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--pf-accent) !important; color: var(--pf-accent) !important; }
.pf-legacy .wp-block-details { background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: 16px; padding: 1rem 1.25rem; margin-block: 0.75rem; }
.pf-legacy .wp-block-details summary { cursor: pointer; font-weight: 600; color: var(--pf-ink); }
.pf-legacy .wp-block-details summary::marker { color: var(--pf-accent); }
.pf-legacy .wp-block-details[open] summary { margin-bottom: 0.6rem; }
.pf-legacy img { border-radius: 16px; }
.pf-legacy .wp-block-group img[style*="border-radius:50%" i], .pf-legacy img[style*="border-radius:999px" i] { object-fit: cover; }
[data-theme="dark"] .pf-legacy img { filter: brightness(0.9); }

/* Outline buttons that sit inside the dark callout */
.pf-legacy [style*="background-color:#2d174d" i] .wp-block-button.is-style-outline .wp-block-button__link { color: var(--pf-callout-ink) !important; border-color: rgba(255, 255, 255, 0.45) !important; }
.pf-legacy [style*="background-color:#2d174d" i] .wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--pf-callout-ink) !important; color: var(--pf-callout-ink) !important; }
.pf-legacy [style*="background-color:#2d174d" i] .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--pf-callout-ink) !important; color: var(--pf-callout-bg) !important; }

/* First block of an old page often carries its own top padding */
.pf-page .pf-legacy > .wp-block-group:first-child { padding-top: 0 !important; }

/* Free Tools plugin page: the plugin supplies its own hero and H1 */
body.purpleflow-toolkit-page .pf-page__head { display: none; }
body.purpleflow-toolkit-page .pf-page__body { padding-top: 0; }
body.purpleflow-toolkit-page .pf-page__body, body.purpleflow-toolkit-page .pf-page .pf-prose { max-width: none; }

/* ---------- WPForms (contact page) ---------- */
.pf-legacy .wpforms-container { margin: 0; }
.pf-legacy .wpforms-container .wpforms-field { padding: 0.6rem 0; }
.pf-legacy .wpforms-container .wpforms-field-label, .pf-legacy .wpforms-container label.wpforms-field-label { color: var(--pf-ink); font-weight: 600; font-size: 0.95rem; margin-bottom: 0.4rem; }
.pf-legacy .wpforms-container .wpforms-field-sublabel, .pf-legacy .wpforms-container .wpforms-field-description { color: var(--pf-muted); font-size: 0.85rem; }
.pf-legacy .wpforms-container .wpforms-required-label { color: var(--pf-accent); }
.pf-legacy .wpforms-container input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), .pf-legacy .wpforms-container select, .pf-legacy .wpforms-container textarea { width: 100%; max-width: 100% !important; box-sizing: border-box; padding: 0.85rem 1.1rem; border-radius: 14px; border: 1px solid var(--pf-line); background: var(--pf-surface); color: var(--pf-ink); font: 400 1rem/1.4 var(--wp--preset--font-family--sans); }
.pf-legacy .wpforms-container input:focus, .pf-legacy .wpforms-container select:focus, .pf-legacy .wpforms-container textarea:focus { border-color: var(--pf-accent); outline: 2px solid var(--pf-accent-soft); box-shadow: none; }
.pf-legacy .wpforms-container button.wpforms-submit, .pf-legacy .wpforms-container input[type="submit"] { background: var(--pf-accent) !important; color: var(--pf-on-accent) !important; border: 0 !important; border-radius: 999px !important; padding: 0.9rem 2rem !important; font: 500 1rem/1 var(--wp--preset--font-family--sans) !important; cursor: pointer; }
.pf-legacy .wpforms-container button.wpforms-submit:hover { background: var(--pf-accent-hover) !important; }
.pf-legacy .wpforms-container .wpforms-error, .pf-legacy .wpforms-container label.wpforms-error { color: #c2410c; font-size: 0.85rem; }
[data-theme="dark"] .pf-legacy .wpforms-container .wpforms-error { color: #fdba74; }

/* ---------- Error pages drawn by the Security Hardening plugin ---------- */
.pf-classic-main { display: block; }
body .pf-error-shell { color: var(--pf-ink); }
body .pf-error-panel, body .pf-error-section, body .pf-error-search { background: var(--pf-surface) !important; border: 1px solid var(--pf-line) !important; box-shadow: var(--pf-shadow) !important; }
body .pf-error-mascot { background: linear-gradient(180deg, var(--pf-accent-soft) 0%, var(--pf-surface) 100%) !important; border: 1px solid var(--pf-line) !important; box-shadow: var(--pf-shadow) !important; }
body .pf-error-title, body .pf-error-section__title, body .pf-error-link-card h3, body .pf-error-post-card__title, body .pf-error-post-card__title a, body .pf-error-summary__title { color: var(--pf-ink) !important; font-family: var(--wp--preset--font-family--serif); font-weight: 400; }
body .pf-error-description, body .pf-error-note, body .pf-error-summary ul, body .pf-error-link-card p, body .pf-error-post-card__excerpt, body .pf-error-mascot__caption, body .pf-error-requested { color: var(--pf-muted) !important; }
body .pf-error-eyebrow, body .pf-error-kicker, body .pf-error-post-card__meta { color: var(--pf-accent) !important; }
body .pf-error-summary, body .pf-error-link-card, body .pf-error-post-card { background: var(--pf-surface-2) !important; border: 1px solid var(--pf-line) !important; }
body .pf-error-requested code { background: var(--pf-surface) !important; border-color: var(--pf-line) !important; color: var(--pf-ink) !important; }
body .pf-error-btn--primary, body .pf-error-search .search-form input[type="submit"], body .pf-error-search .search-submit { background: var(--pf-accent) !important; color: var(--pf-on-accent) !important; box-shadow: none !important; }
body .pf-error-btn--secondary { background: var(--pf-accent-soft) !important; color: var(--pf-accent) !important; }
body .pf-error-post-card__link, body .pf-error-links a { color: var(--pf-accent) !important; background: transparent !important; }
body .pf-error-mascot__badge { background: var(--pf-accent-soft) !important; color: var(--pf-accent) !important; }
body .pf-error-search .search-field { background: var(--pf-surface) !important; color: var(--pf-ink) !important; border-color: var(--pf-line) !important; }

/* ---------- Style guide preview panels ---------- */
.pf-guide-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pf-panel {
	background: var(--pf-bg);
	color: var(--pf-ink);
	border: 1px solid var(--pf-line);
	border-radius: 24px;
	padding: clamp(1.25rem, 3vw, 2.25rem);
	display: grid;
	gap: 1.4rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1.05rem;
	line-height: 1.65;
}
.pf-panel h2, .pf-panel h3 { margin: 0; font-family: var(--wp--preset--font-family--serif); font-weight: 400; color: var(--pf-ink); letter-spacing: -0.01em; }
.pf-panel h2 { font-size: clamp(1.9rem, 3vw, 2.5rem); line-height: 1.12; }
.pf-panel p { margin: 0; }
.pf-panel a:not(.pf-btn) { color: var(--pf-accent); }
.pf-panel__label { font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--pf-muted); font-weight: 600; }
.pf-row { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.pf-swatches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.pf-swatch { border-radius: 14px; border: 1px solid var(--pf-line); overflow: hidden; background: var(--pf-surface); font-size: 0.72rem; color: var(--pf-muted); }
.pf-swatch i { display: block; height: 3.2rem; }
.pf-swatch span { display: block; padding: 0.4rem 0.6rem; line-height: 1.35; }
.pf-type-row { display: grid; gap: 0.25rem; padding-block: 1rem; border-top: 1px solid var(--pf-line); }
.pf-type-row small { color: var(--pf-muted); font-size: 0.8rem; letter-spacing: 0.04em; }

@media (max-width: 860px) {
	.pf-guide-grid { grid-template-columns: 1fr; }
	.pf-swatches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}