/*
Theme Name: Wazo Africa
Theme URI: https://wazo.co.ke
Author: Wazo Africa LLP
Description: Editorial theme for Wazo Africa — policy advocacy, legislative drafting and business development. Serif typography, quiet palette, built for briefs and working papers.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wazo
*/

/* ============================================================
   Tokens
   ============================================================ */
:root {
	--bg: #F7F6F2;
	--surface: #FFFFFF;
	--sunk: #EEEBE3;
	--ink: #211D17;
	--ink-2: #5C554B;
	--ink-3: #8A8173;
	--rule: #E2DDD2;
	--rule-strong: #C9C0B1;
	--accent: #8A2B22;
	--accent-ink: #7A2117;
	--accent-soft: #F1E5E1;
	--ok: #2F6F4F;
	--warn: #9A6B1E;
	--shadow: 0 1px 2px rgba(33, 29, 23, .04), 0 8px 28px -12px rgba(33, 29, 23, .12);
	--shadow-lift: 0 2px 6px rgba(33, 29, 23, .06), 0 18px 44px -16px rgba(33, 29, 23, .22);
	--maxw: 74rem;
	--measure: 40rem;
	--serif: "Spectral", Georgia, "Times New Roman", serif;
	--mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
	--pad: clamp(1.15rem, 4vw, 2.5rem);
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bg: #15130F;
		--surface: #1D1A14;
		--sunk: #242018;
		--ink: #ECE6DA;
		--ink-2: #A79D8D;
		--ink-3: #7B7263;
		--rule: #322D24;
		--rule-strong: #453E31;
		--accent: #E08A75;
		--accent-ink: #EBA491;
		--accent-soft: #2C201B;
		--ok: #7FB79A;
		--warn: #D6A860;
		--shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 34px -14px rgba(0, 0, 0, .6);
		--shadow-lift: 0 2px 6px rgba(0, 0, 0, .35), 0 22px 50px -18px rgba(0, 0, 0, .7);
	}
}
:root[data-theme="dark"] {
	--bg: #15130F; --surface: #1D1A14; --sunk: #242018; --ink: #ECE6DA;
	--ink-2: #A79D8D; --ink-3: #7B7263; --rule: #322D24; --rule-strong: #453E31;
	--accent: #E08A75; --accent-ink: #EBA491; --accent-soft: #2C201B;
	--ok: #7FB79A; --warn: #D6A860;
	--shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 34px -14px rgba(0,0,0,.6);
	--shadow-lift: 0 2px 6px rgba(0,0,0,.35), 0 22px 50px -18px rgba(0,0,0,.7);
}

/* ============================================================
   Reset / base
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font-family: var(--serif);
	font-size: 1.0625rem;
	line-height: 1.72;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--accent-ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ink); }
::selection { background: var(--accent-soft); color: var(--accent-ink); }
h1, h2, h3, h4 { font-weight: 500; line-height: 1.18; letter-spacing: -.012em; margin: 0 0 .6em; color: var(--ink); }
h1 { font-size: clamp(2rem, 5.2vw, 3.1rem); }
h2 { font-size: clamp(1.5rem, 3.4vw, 2.1rem); }
h3 { font-size: 1.28rem; }
p { margin: 0 0 1.1em; }
hr { border: 0; border-top: 1px solid var(--rule); margin: 2.5rem 0; }
blockquote {
	margin: 1.6rem 0; padding: .2rem 0 .2rem 1.4rem;
	border-left: 2px solid var(--accent); color: var(--ink-2); font-style: italic;
}
code, kbd, samp { font-family: var(--mono); font-size: .9em; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }

.mono { font-family: var(--mono); }
.eyebrow {
	font-family: var(--mono); font-size: .68rem; font-weight: 500;
	letter-spacing: .16em; text-transform: uppercase; color: var(--accent-ink);
	margin: 0 0 1rem;
}
.skip-link {
	position: absolute; left: -9999px; top: 0; background: var(--ink); color: var(--bg);
	padding: .6rem 1rem; z-index: 100;
}
.skip-link:focus { left: .5rem; top: .5rem; }

/* ============================================================
   Layout
   ============================================================ */
.wrap { max-width: var(--maxw); margin-inline: auto; padding-inline: var(--pad); }
.wrap--narrow { max-width: 48rem; }
.section { padding-block: clamp(3rem, 8vw, 6rem); }
.section + .section { border-top: 1px solid var(--rule); }
.lede { font-size: clamp(1.12rem, 2.2vw, 1.35rem); color: var(--ink-2); max-width: var(--measure); }
.prose { max-width: var(--measure); }
.prose > * + * { margin-top: 1.1em; }
.prose h2 { margin-top: 2.2em; }
.prose h3 { margin-top: 1.8em; }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose li + li { margin-top: .35em; }
.prose table { width: 100%; border-collapse: collapse; font-size: .95rem; margin: 1.4rem 0; }
.prose th, .prose td { text-align: left; padding: .55rem .7rem; border-bottom: 1px solid var(--rule); vertical-align: top; }
.prose thead th { border-bottom: 1.5px solid var(--rule-strong); font-family: var(--mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.overflow-x { overflow-x: auto; }

/* ============================================================
   Buttons
   ============================================================ */
.btn {
	display: inline-flex; align-items: center; gap: .5rem;
	font-family: var(--mono); font-size: .78rem; font-weight: 500;
	letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
	padding: .8rem 1.25rem; border-radius: 3px; border: 1px solid var(--ink);
	background: var(--ink); color: var(--bg); cursor: pointer; transition: transform .15s ease, background .15s ease;
}
.btn:hover { color: var(--bg); transform: translateY(-1px); background: var(--accent-ink); border-color: var(--accent-ink); }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: var(--bg); }
.btn--sm { padding: .55rem .9rem; font-size: .72rem; }

/* ============================================================
   Header / nav
   ============================================================ */
.site-header {
	position: sticky; top: 0; z-index: 40;
	background: color-mix(in srgb, var(--bg) 88%, transparent);
	backdrop-filter: saturate(1.2) blur(8px);
	border-bottom: 1px solid var(--rule);
}
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.25rem; }
.brand { display: flex; flex-direction: column; text-decoration: none; color: var(--ink); line-height: 1.05; }
.brand__name { font-size: 1.28rem; font-weight: 600; letter-spacing: -.015em; }
.brand__kicker { font-family: var(--mono); font-size: .58rem; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-3); margin-top: .18rem; }
.nav { display: flex; align-items: center; gap: 1.6rem; }
.nav a {
	font-family: var(--mono); font-size: .74rem; font-weight: 500; letter-spacing: .07em;
	text-transform: uppercase; text-decoration: none; color: var(--ink-2);
}
.nav a:hover, .nav a[aria-current] { color: var(--accent-ink); }
.nav .current-menu-item > a, .nav .current_page_item > a { color: var(--ink); }
.nav-toggle { display: none; background: none; border: 1px solid var(--rule-strong); border-radius: 3px; padding: .5rem .6rem; cursor: pointer; color: var(--ink); }
.nav-toggle svg { width: 1.1rem; height: 1.1rem; }

@media (max-width: 860px) {
	.nav-toggle { display: inline-flex; }
	.nav {
		position: fixed; inset: 4.25rem 0 auto 0; flex-direction: column; align-items: stretch;
		gap: 0; background: var(--surface); border-bottom: 1px solid var(--rule);
		padding: .5rem var(--pad) 1.25rem; box-shadow: var(--shadow);
		transform: translateY(-120%); transition: transform .22s ease; max-height: calc(100vh - 4.25rem); overflow-y: auto;
	}
	.nav[data-open="true"] { transform: translateY(0); }
	.nav a { padding: .85rem 0; border-bottom: 1px solid var(--rule); font-size: .82rem; }
	.nav .btn { margin-top: .9rem; justify-content: center; }
}

/* ============================================================
   Hero
   ============================================================ */
.hero { padding-block: clamp(3.5rem, 10vw, 7rem); }
.hero h1 { max-width: 20ch; }
.hero .lede { margin-top: 1.2rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.hero__meta { margin-top: 3rem; display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; font-family: var(--mono); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.hero__meta strong { display: block; font-family: var(--serif); font-size: 1.55rem; letter-spacing: -.02em; text-transform: none; color: var(--ink); font-weight: 500; margin-top: .25rem; }

/* ============================================================
   Cards & grids
   ============================================================ */
.grid { display: grid; gap: 1.5rem; }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 900px) { .grid--3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .grid--3, .grid--2 { grid-template-columns: 1fr; } }

.card {
	background: var(--surface); border: 1px solid var(--rule); border-radius: 5px;
	padding: 1.6rem; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .6rem;
	transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
a.card:hover, .card--link:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); border-color: var(--rule-strong); }
.card__eyebrow { font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-ink); }
.card h3 { margin: 0; }
.card p { margin: 0; color: var(--ink-2); font-size: .98rem; }
.card__meta { margin-top: auto; padding-top: .8rem; font-family: var(--mono); font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.card--feature { padding: 2rem; }
.card--feature h3 { font-size: 1.5rem; }

/* Service list */
.service { border-top: 1px solid var(--rule-strong); padding-top: 1.4rem; }
.service h3 { display: flex; align-items: baseline; gap: .7rem; }
.service h3 .num { font-family: var(--mono); font-size: .8rem; color: var(--ink-3); }

/* Featured / highlight block */
.highlight { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.highlight--flip { grid-template-columns: 1fr 1.1fr; }
.highlight--flip .highlight__media { order: 2; }
@media (max-width: 800px) { .highlight, .highlight--flip { grid-template-columns: 1fr; } .highlight--flip .highlight__media { order: 0; } }
.highlight__media img { border-radius: 5px; border: 1px solid var(--rule); box-shadow: var(--shadow); width: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.highlight__media--paper {
	aspect-ratio: 4 / 3; border-radius: 5px; border: 1px solid var(--rule); box-shadow: var(--shadow);
	background: var(--surface); display: flex; flex-direction: column; justify-content: center; padding: 2rem;
}
.highlight__media--paper .eyebrow { margin-bottom: .6rem; }
.highlight__media--paper .t { font-size: 1.3rem; font-weight: 500; }

/* ============================================================
   Work list / filter
   ============================================================ */
.filter { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
.filter a {
	font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase;
	text-decoration: none; color: var(--ink-2); border: 1px solid var(--rule-strong);
	padding: .45rem .85rem; border-radius: 999px;
}
.filter a[aria-current="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }

.work-row { border-bottom: 1px solid var(--rule); padding: 1.5rem 0; display: grid; grid-template-columns: 1fr auto; gap: .4rem 1.5rem; }
.work-row h3 { margin: 0; font-size: 1.2rem; }
.work-row h3 a { text-decoration: none; color: var(--ink); }
.work-row h3 a:hover { color: var(--accent-ink); }
.work-row p { margin: 0; color: var(--ink-2); font-size: .97rem; grid-column: 1 / -1; max-width: var(--measure); }
.work-row__meta { font-family: var(--mono); font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); text-align: right; white-space: nowrap; }
.tag {
	display: inline-block; font-family: var(--mono); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase;
	padding: .2rem .5rem; border-radius: 3px; border: 1px solid var(--rule-strong); color: var(--ink-2);
}
.tag--draft { color: var(--warn); border-color: var(--warn); }
.tag--final, .tag--enacted, .tag--published { color: var(--ok); border-color: var(--ok); }

/* ============================================================
   DRAFT notice
   ============================================================ */
.wazo-draft-notice {
	border: 1px solid var(--warn); border-radius: 5px; background: var(--surface);
	padding: 1.1rem 1.3rem; margin: 0 0 2rem; display: flex; gap: 1rem; align-items: flex-start;
	max-width: var(--measure);
}
.wazo-draft-notice__tag {
	font-family: var(--mono); font-size: .64rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
	color: var(--warn); border: 1px solid var(--warn); border-radius: 3px; padding: .25rem .5rem; flex: none; margin-top: .15rem;
}
.wazo-draft-notice p { margin: 0; font-size: .92rem; color: var(--ink-2); }

/* ============================================================
   Paper (policy issue single) — editorial layout
   ============================================================ */
.paper { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.paper__back { margin-bottom: 2rem; }
.paper__back a { font-family: var(--mono); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; color: var(--ink-3); }
.paper__back a:hover { color: var(--accent-ink); }

.paper__masthead { max-width: 46rem; margin-inline: auto; border-bottom: 1.5px solid var(--rule-strong); padding-bottom: 2.4rem; margin-bottom: 3rem; }
.paper__kicker { display: flex; flex-wrap: wrap; gap: .55rem; align-items: baseline; font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-ink); margin: 0 0 1.4rem; }
.paper__kicker .dot { color: var(--ink-3); }
.paper__title { font-size: clamp(2rem, 5vw, 3rem); line-height: 1.12; margin: 0 0 .5rem; }
.paper__subtitle { font-size: clamp(1.1rem, 2.4vw, 1.4rem); font-style: italic; color: var(--ink-2); margin: 0 0 1.6rem; }
.paper__rule { width: 3.5rem; height: 2px; background: var(--accent); margin: 0 0 1.6rem; }
.paper__meta { display: grid; gap: .9rem; margin: 0 0 1.6rem; }
.paper__meta dt { font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: .15rem; }
.paper__meta dd { margin: 0; font-size: .96rem; color: var(--ink); }
.paper__meta dd.mono { font-family: var(--mono); font-size: .82rem; color: var(--ink-2); }
.paper__status { font-size: .9rem; color: var(--ink-2); border: 1px solid var(--rule-strong); border-radius: 4px; padding: .8rem 1rem; margin: 0 0 1.6rem; }
.paper__caption { font-size: .88rem; font-style: italic; color: var(--ink-3); margin: -.6rem 0 1.6rem; }
.paper__caption a { color: var(--accent-ink); font-style: normal; }
.paper__actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.paper__filesize, .paper__actions .paper__filesize { opacity: .7; text-transform: none; letter-spacing: 0; }

.paper__layout { display: grid; grid-template-columns: 15rem minmax(0, 46rem); gap: clamp(2rem, 5vw, 4rem); justify-content: center; align-items: start; }
@media (max-width: 1040px) { .paper__layout { grid-template-columns: minmax(0, 46rem); } }

.paper__toc { position: sticky; top: 5.5rem; font-family: var(--mono); }
@media (max-width: 1040px) {
	.paper__toc { position: static; border: 1px solid var(--rule); border-radius: 5px; padding: 1.2rem 1.4rem; background: var(--surface); margin-bottom: 2.5rem; }
}
.paper__toc h2 { font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 1rem; border: 0; padding: 0; }
.paper__toc ol { list-style: none; margin: 0 0 .9rem; padding: 0; }
.paper__toc li { margin: 0 0 .5rem; line-height: 1.4; }
.paper__toc a { display: block; font-size: .74rem; letter-spacing: .01em; text-decoration: none; color: var(--ink-2); }
.paper__toc a:hover { color: var(--accent-ink); }
.paper__toc-grp { margin: 1rem 0 .55rem; }
.paper__toc-grp a { font-size: .64rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); text-decoration: none; }
.paper__toc-grp a:hover { color: var(--accent-ink); }
.paper__toc-grp + ol li a { padding-left: .9rem; }
.paper__toc-dl { display: block; margin-top: 1.2rem; padding-top: 1.1rem; border-top: 1px solid var(--rule); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; color: var(--accent-ink); }

.paper__abstract { background: var(--sunk); border-radius: 5px; padding: 1.6rem 1.8rem; margin: 0 0 2.5rem; }
.paper__abstract .eyebrow { margin-bottom: .6rem; }
.paper__abstract p { font-size: .98rem; }
.paper__abstract p:last-child { margin-bottom: 0; }
.paper__keywords { font-family: var(--mono); font-size: .74rem; line-height: 1.6; color: var(--ink-2); margin-top: 1rem !important; }

/* Prose tuned for a long legal paper */
.prose--paper { font-size: 1.075rem; line-height: 1.76; hanging-punctuation: first; }
.prose--paper > h2 {
	font-size: 1.55rem; margin-top: 3em; padding-top: 1.1em; border-top: 1.5px solid var(--rule-strong);
	letter-spacing: -.015em;
}
.prose--paper > h2:first-of-type { margin-top: .5em; padding-top: 0; border-top: 0; }
.prose--paper > h3 { font-size: 1.2rem; margin-top: 2.4em; }
.prose--paper > h4 { font-size: 1rem; margin-top: 1.8em; font-style: italic; color: var(--ink-2); font-weight: 500; }

/* Numbered section headings: the number hangs in the left margin */
.prose--paper h3.numbered, .prose--paper h4.numbered { position: relative; }
.prose--paper .secnum {
	font-family: var(--mono); font-weight: 500; color: var(--accent-ink);
	font-size: .7em; margin-right: .7rem; letter-spacing: .02em;
}
@media (min-width: 900px) {
	.prose--paper h3.numbered { padding-left: 3.2rem; }
	.prose--paper h3.numbered .secnum { position: absolute; left: 0; top: .18em; margin: 0; font-size: .82em; }
	.prose--paper h4.numbered .secnum { color: var(--ink-3); }
}

/* Drop cap on the opening paragraph */
.prose--paper .lead-para::first-letter {
	font-size: 3.1em; float: left; line-height: .82; padding: .04em .09em 0 0; color: var(--accent-ink);
	font-weight: 500;
}

.prose--paper blockquote {
	font-style: normal; font-size: .98rem; background: var(--surface); border: 1px solid var(--rule);
	border-left: 2px solid var(--accent); border-radius: 0 4px 4px 0; padding: 1rem 1.2rem; margin: 1.7rem 0;
}
.prose--paper blockquote p { margin: 0; color: var(--ink-2); }
.prose--paper ol > li, .prose--paper ul > li { margin-bottom: .5em; }
.prose--paper table { font-size: .9rem; }
.prose--paper table td:first-child { color: var(--ink); }

/* The three end lists (Table of Cases / Legislation / References) read as dense reference matter */
.prose--paper h2[id="table-of-cases"] ~ ul,
.prose--paper h2[id="table-of-cases"] ~ ul li,
.prose--paper h2[id*="legislation"] ~ ul li { font-size: .95rem; color: var(--ink-2); margin-bottom: .4em; }
.prose--paper h2[id*="references"] ~ p {
	padding-left: 1.6rem; text-indent: -1.6rem; font-size: .95rem; color: var(--ink-2); margin-bottom: .55em;
}

.paper__pdf { margin-top: 3.5rem; padding-top: 2.5rem; border-top: 1px solid var(--rule-strong); }
.paper__pdf h2 { font-size: 1.3rem; }
.doc-embed { width: 100%; aspect-ratio: 8.5 / 11; border: 1px solid var(--rule); border-radius: 5px; background: var(--sunk); margin: 1.5rem 0 0; }
@media (max-width: 700px) { .doc-embed { aspect-ratio: 3 / 4; } }

/* keep the generic .abstract for any other use */
.abstract { background: var(--sunk); border-radius: 5px; padding: 1.5rem 1.7rem; margin: 2rem 0; max-width: var(--measure); }
.abstract .eyebrow { margin-bottom: .5rem; }
.abstract p:last-child { margin-bottom: 0; }

/* ============================================================
   Comments
   ============================================================ */
.comments { border-top: 1px solid var(--rule-strong); margin-top: 3.5rem; padding-top: 2.5rem; max-width: var(--measure); }
.comments h2 { font-size: 1.4rem; }
.comment-list { list-style: none; margin: 2rem 0; padding: 0; }
.comment-list ul { list-style: none; padding-left: 1.4rem; border-left: 1px solid var(--rule); }
.comment-body { padding: 1.1rem 0; border-bottom: 1px solid var(--rule); }
.comment-author { font-weight: 600; font-size: .98rem; }
.comment-metadata { font-family: var(--mono); font-size: .66rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); margin-bottom: .5rem; }
.comment-awaiting-moderation { color: var(--warn); font-family: var(--mono); font-size: .7rem; }
.comment-notice {
	background: var(--sunk); border-radius: 5px; padding: 1rem 1.2rem; font-size: .9rem; color: var(--ink-2);
	margin-bottom: 1.5rem;
}
.comment-form { display: grid; gap: 1rem; }
.comment-form p { margin: 0; display: grid; gap: .35rem; }
.comment-form label { font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
	width: 100%; font: inherit; font-size: .98rem; padding: .7rem .8rem;
	background: var(--surface); border: 1px solid var(--rule-strong); border-radius: 3px; color: var(--ink);
}
.comment-form textarea { min-height: 8rem; resize: vertical; }
.comment-form .comment-form-cookies-consent { grid-template-columns: auto 1fr; align-items: start; }
.comment-form .comment-form-cookies-consent label { text-transform: none; letter-spacing: 0; font-family: var(--serif); font-size: .9rem; color: var(--ink-2); }

/* ============================================================
   Forms (Fluent Forms + generic)
   ============================================================ */
.ff-el-input--label label, .frm-label { font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.fluentform .ff-el-group { margin-bottom: 1.1rem; }
.fluentform input[type="text"], .fluentform input[type="email"], .fluentform textarea, .fluentform select {
	background: var(--surface) !important; border: 1px solid var(--rule-strong) !important; border-radius: 3px !important;
	color: var(--ink) !important; font-family: var(--serif) !important;
}
.fluentform .ff-btn-submit { background: var(--ink) !important; border-radius: 3px !important; font-family: var(--mono) !important; text-transform: uppercase; letter-spacing: .06em; font-size: .78rem !important; }

.embed-frame { width: 100%; min-height: 900px; border: 1px solid var(--rule); border-radius: 5px; background: var(--surface); }

/* Hand-built forms */
.wazo-form-wrap { max-width: 40rem; }
.wazo-form { display: grid; gap: 1.15rem; margin-top: 1.5rem; }
.wazo-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; }
@media (max-width: 560px) { .wazo-form-row { grid-template-columns: 1fr; } }
.wazo-form p { margin: 0; display: grid; gap: .35rem; }
.wazo-form label { font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.wazo-form input[type="text"], .wazo-form input[type="email"], .wazo-form textarea {
	width: 100%; font: inherit; font-size: 1rem; padding: .7rem .8rem; color: var(--ink);
	background: var(--surface); border: 1px solid var(--rule-strong); border-radius: 3px;
}
.wazo-form input:focus, .wazo-form textarea:focus { border-color: var(--accent); outline: 2px solid var(--accent-soft); }
.wazo-form textarea { min-height: 9rem; resize: vertical; }
.wazo-form label span[aria-hidden] { color: var(--accent); }
.wazo-hp { position: absolute !important; left: -9999px !important; }
.wazo-form-consent label { display: grid; grid-template-columns: auto 1fr; gap: .6rem; align-items: start;
	font-family: var(--serif); text-transform: none; letter-spacing: 0; font-size: .9rem; color: var(--ink-2); }
.wazo-form-consent input { margin-top: .25rem; }
.wazo-form-ok { border: 1px solid var(--ok); background: var(--surface); border-radius: 5px; padding: 1.2rem 1.4rem; }
.wazo-form-ok p:last-child { margin-bottom: 0; color: var(--ink-2); }
.wazo-form-error { border: 1px solid var(--accent); background: var(--accent-soft); border-radius: 5px; padding: .9rem 1.2rem; margin-bottom: 1.2rem; }
.wazo-form-error p { margin: 0; color: var(--accent-ink); font-size: .95rem; }

/* Google Form embed */
.wazo-gform { width: 100%; min-height: 1100px; border: 1px solid var(--rule); border-radius: 5px; background: var(--surface); }
.wazo-gform-fallback { font-size: .9rem; color: var(--ink-3); margin-top: .6rem; }

/* Author / candidacy note */
.author-note {
	display: grid; grid-template-columns: 5.5rem 1fr; gap: 1.4rem; align-items: start;
	background: var(--sunk); border-radius: 6px; padding: 1.5rem 1.7rem; margin: 3rem 0 0; max-width: var(--measure);
}
@media (max-width: 560px) { .author-note { grid-template-columns: 1fr; gap: .9rem; } }
.author-note__photo { width: 5.5rem; height: 5.5rem; border-radius: 50%; object-fit: cover; border: 1px solid var(--rule-strong); }
.author-note__photo--ph { display: flex; align-items: center; justify-content: center; background: var(--surface);
	font-family: var(--mono); font-size: 1.4rem; color: var(--ink-3); }
.author-note h3 { font-size: 1.05rem; margin: 0 0 .3rem; }
.author-note p { font-size: .92rem; color: var(--ink-2); margin: 0 0 .5rem; }
.author-note p:last-child { margin-bottom: 0; }
.author-note a { color: var(--accent-ink); }

/* About portrait */
.about-portrait { float: right; width: min(15rem, 40%); margin: .3rem 0 1.2rem 1.6rem; border-radius: 6px;
	border: 1px solid var(--rule); box-shadow: var(--shadow); }
@media (max-width: 560px) { .about-portrait { float: none; width: 60%; margin: 0 0 1.4rem; } }

/* Full-bleed atmospheric image band — colour-blended to the palette */
.image-band {
	position: relative; width: 100%; overflow: hidden; isolation: isolate;
	background: var(--sunk); border-block: 1px solid var(--rule);
	--band-shade: linear-gradient(172deg, rgba(33,29,23,.14) 0%, rgba(122,33,23,.24) 52%, rgba(33,29,23,.5) 100%);
	--band-lift: radial-gradient(130% 80% at 50% -10%, rgba(247,246,242,.22), rgba(247,246,242,0) 62%);
}
.image-band img {
	width: 100%; height: clamp(240px, 40vh, 460px); object-fit: cover; display: block;
	filter: grayscale(.28) saturate(.82) contrast(1.04) brightness(.96);
}
.image-band::before {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: var(--band-shade); mix-blend-mode: multiply;
}
.image-band::after {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
	background: var(--band-lift); mix-blend-mode: screen;
}
.image-band--tall img { height: clamp(300px, 52vh, 560px); }
.image-band__caption {
	position: absolute; right: .9rem; bottom: .7rem; z-index: 3;
	font-family: var(--mono); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase;
	color: #F7F6F2; opacity: .75; text-shadow: 0 1px 4px rgba(0,0,0,.55);
}
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .image-band {
		--band-shade: linear-gradient(172deg, rgba(10,9,7,.4) 0%, rgba(122,33,23,.3) 50%, rgba(10,9,7,.7) 100%);
		--band-lift: radial-gradient(130% 80% at 50% -10%, rgba(224,138,117,.14), rgba(224,138,117,0) 60%);
	}
	:root:not([data-theme="light"]) .image-band img { filter: grayscale(.34) saturate(.78) contrast(1.05) brightness(.82); }
}
:root[data-theme="dark"] .image-band {
	--band-shade: linear-gradient(172deg, rgba(10,9,7,.4) 0%, rgba(122,33,23,.3) 50%, rgba(10,9,7,.7) 100%);
	--band-lift: radial-gradient(130% 80% at 50% -10%, rgba(224,138,117,.14), rgba(224,138,117,0) 60%);
}
:root[data-theme="dark"] .image-band img { filter: grayscale(.34) saturate(.78) contrast(1.05) brightness(.82); }

/* Inline supporting image (About etc.) — same blend, framed */
.figure-inline { margin: 2.2rem 0; position: relative; isolation: isolate; border-radius: 6px; overflow: hidden;
	border: 1px solid var(--rule); box-shadow: var(--shadow);
	--band-shade: linear-gradient(172deg, rgba(33,29,23,.1) 0%, rgba(122,33,23,.18) 55%, rgba(33,29,23,.34) 100%); }
.figure-inline img { width: 100%; display: block; filter: grayscale(.24) saturate(.85) contrast(1.03); }
.figure-inline::before { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background: var(--band-shade); mix-blend-mode: multiply; }
.figure-inline figcaption { margin-top: .5rem; }

/* ============================================================
   Footer
   ============================================================ */
.site-footer { border-top: 1px solid var(--rule-strong); background: var(--surface); padding-block: clamp(2.5rem, 6vw, 4rem); margin-top: 4rem; }
.site-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2rem; }
@media (max-width: 720px) { .site-footer__grid { grid-template-columns: 1fr; gap: 1.6rem; } }
.site-footer h4 { font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: .9rem; }
.site-footer a { color: var(--ink-2); text-decoration: none; display: block; padding: .25rem 0; font-size: .92rem; }
.site-footer a:hover { color: var(--accent-ink); }
.site-footer__bottom { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); font-family: var(--mono); font-size: .68rem; letter-spacing: .04em; color: var(--ink-3); display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; justify-content: space-between; }

/* ============================================================
   Utilities
   ============================================================ */
.stack > * + * { margin-top: 1.1rem; }
.stack-lg > * + * { margin-top: 2rem; }
.muted { color: var(--ink-3); }
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.pill-note { font-family: var(--mono); font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }

/* WP core bits */
.wp-caption-text, figcaption { font-size: .82rem; color: var(--ink-3); font-style: italic; margin-top: .4rem; }
.alignleft { float: left; margin: .3rem 1.5rem 1rem 0; }
.alignright { float: right; margin: .3rem 0 1rem 1.5rem; }
.aligncenter { margin-inline: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
.wazo-pagination { display: flex; gap: .5rem; margin-top: 2.5rem; font-family: var(--mono); font-size: .8rem; }
.wazo-pagination .page-numbers { padding: .4rem .7rem; border: 1px solid var(--rule-strong); border-radius: 3px; text-decoration: none; color: var(--ink-2); }
.wazo-pagination .current { background: var(--ink); color: var(--bg); border-color: var(--ink); }