/* =========================================================================
   CareerWire — main.css
   A premium editorial magazine design system.

   Palette: Ink (near-black navy) / Wire Navy (brand) / Signal Amber (accent)
            / Paper (cool near-white) / Mist (borders) / Slate (secondary text)
   Type:    Fraunces (display serif, headings only) + Public Sans (body/UI)
   Signature: the "wire ticker" under the header.

   Organized in sections — search for "== " to jump between them.
   ========================================================================= */

/* == 1. Design tokens ================================================== */
:root {
	/* Raw palette */
	--cw-ink: #14202E;
	--cw-navy: #1B3A63;
	--cw-navy-700: #16294A;
	--cw-amber: #D9931F;
	--cw-amber-600: #B9790F;
	--cw-amber-100: #FBEBD0;
	--cw-paper: #F7F8FA;
	--cw-white: #FFFFFF;
	--cw-mist: #E3E6EB;
	--cw-mist-200: #EFF1F4;
	--cw-slate: #4C5563;
	--cw-slate-300: #9AA3B2;
	--cw-red: #C0341F;
	--cw-green: #157F45;

	/* Semantic tokens — the rest of the file should consume these, not raw palette vars */
	--cw-color-bg: var(--cw-paper);
	--cw-color-surface: var(--cw-white);
	--cw-color-surface-tint: var(--cw-mist-200);
	--cw-color-text: var(--cw-ink);
	--cw-color-text-muted: var(--cw-slate);
	--cw-color-border: var(--cw-mist);
	--cw-color-primary: var(--cw-navy);
	--cw-color-primary-strong: var(--cw-navy-700);
	--cw-color-accent: var(--cw-amber);
	--cw-color-accent-strong: var(--cw-amber-600);
	--cw-color-on-primary: var(--cw-white);
	--cw-color-on-accent: var(--cw-ink);
	--cw-color-danger: var(--cw-red);
	--cw-color-success: var(--cw-green);
	--cw-color-shadow: 220deg 30% 10%;

	/* Typography */
	--cw-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--cw-font-body: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--cw-base-size: 17px;
	--cw-scale: 1;

	/* Layout */
	--cw-container: 1240px;
	--cw-container-narrow: 760px;
	--cw-gutter: clamp(1.25rem, 4vw, 2.5rem);
	--cw-radius-sm: 8px;
	--cw-radius: 14px;
	--cw-radius-lg: 20px;
	--cw-header-height: 68px;

	/* Motion */
	--cw-transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
	--cw-transition-slow: 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Dark mode: redefine the same semantic tokens so every component below
   automatically follows, without duplicating component rules. */
[data-theme="dark"] {
	--cw-color-bg: #0E1620;
	--cw-color-surface: #17222F;
	--cw-color-surface-tint: #1D2A3A;
	--cw-color-text: #EDF0F4;
	--cw-color-text-muted: #A7B0BE;
	--cw-color-border: #2A3646;
	--cw-color-primary: #4A79B8;
	--cw-color-primary-strong: #6B95CE;
	--cw-color-accent: var(--cw-amber);
	--cw-color-accent-strong: #EAAB4D;
	--cw-color-on-primary: #0E1620;
	--cw-color-shadow: 220deg 60% 2%;
}

@media (prefers-color-scheme: dark) {
	body.cw-dark-default:not([data-theme="light"]) {
		--cw-color-bg: #0E1620;
		--cw-color-surface: #17222F;
		--cw-color-surface-tint: #1D2A3A;
		--cw-color-text: #EDF0F4;
		--cw-color-text-muted: #A7B0BE;
		--cw-color-border: #2A3646;
		--cw-color-primary: #4A79B8;
		--cw-color-primary-strong: #6B95CE;
		--cw-color-on-primary: #0E1620;
	}
}

/* == 2. Reset ============================================================ */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--cw-color-bg);
	color: var(--cw-color-text);
	font-family: var(--cw-font-body);
	font-size: var(--cw-base-size);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	transition: background-color var(--cw-transition), color var(--cw-transition);
}

/* Broad, cheap safety net against mobile horizontal scroll: a long
   unbroken word/URL (job titles, exam names, pasted links in content)
   wraps instead of forcing the page wider. Deliberately NOT using
   overflow-x:hidden on html/body here — that's a common trap that can
   silently break position:sticky on descendants (this theme's sticky
   header, sidebar, TOC, and archive toolbar all rely on it), which would
   be a real regression, not an improvement. */
h1, h2, h3, h4, h5, h6, p, li, blockquote, figcaption, a {
	overflow-wrap: break-word;
	word-wrap: break-word;
}

img, svg, video, canvas { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; padding: 0; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; }
p { margin: 0 0 1em; }
table { border-collapse: collapse; width: 100%; }

:focus-visible {
	outline: 2.5px solid var(--cw-color-accent);
	outline-offset: 2px;
	border-radius: 4px;
}

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

/* == 3. Layout utilities ================================================= */
.container {
	max-width: var(--cw-container);
	margin-inline: auto;
	padding-inline: var(--cw-gutter);
}
.container--narrow { max-width: var(--cw-container-narrow); margin-inline: auto; }

#main-wrapper { min-height: 40vh; }

.cw-layout-with-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3rem;
	padding-block: 2.5rem 4rem;
}
.cw-layout-with-sidebar__main { min-width: 0; }

body.no-sidebar .cw-layout-with-sidebar { grid-template-columns: minmax(0, 1fr); }

@media (min-width: 1024px) {
	.cw-layout-with-sidebar { grid-template-columns: minmax(0, 1fr) 320px; }
}

.cw-section { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.cw-section--tinted { background: var(--cw-color-surface-tint); }
.cw-section__header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.75rem;
	flex-wrap: wrap;
}
.cw-section__viewall {
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--cw-color-primary);
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	white-space: nowrap;
}
.cw-section__viewall:hover { color: var(--cw-color-accent-strong); }

.cw-section-title {
	font-family: var(--cw-font-display);
	font-weight: 700;
	font-size: calc(1.9rem * var(--cw-scale));
	line-height: 1.15;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.cw-section-title--hero { font-size: calc(2.3rem * var(--cw-scale)); }
.cw-section-title__icon { width: 22px; height: 22px; color: var(--cw-color-accent-strong); }

.screen-reader-text { /* re-declared here in case main.css loads without style.css in an edge case */
	border: 0; clip: rect(1px,1px,1px,1px); height: 1px; margin: -1px; overflow: hidden;
	padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* == 4. Typography ======================================================= */
.cw-article__body h2, .cw-article__body h3, .cw-article__body h4,
.cw-page__body h2, .cw-page__body h3, .cw-page__body h4,
.cw-section-title, .cw-hero__lead .cw-card__title, .cw-archive-header__title,
.cw-article__title, .cw-page__title, .cw-newsletter__title, .widget-title,
.cw-card__title, .cw-404__title {
	font-family: var(--cw-font-display);
	color: var(--cw-color-text);
}

.cw-article__title, .cw-page__title, .cw-archive-header__title {
	font-size: clamp(2rem, 4vw + 0.5rem, calc(3rem * var(--cw-scale)));
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.015em;
	margin-bottom: 0.5rem;
}

.cw-article__body {
	font-size: 1.08rem;
	line-height: 1.75;
	color: var(--cw-color-text);
}
.cw-article__body > * + * { margin-top: 1.3em; }
.cw-article__body h2 { font-size: 1.6rem; font-weight: 700; margin-top: 2em; scroll-margin-top: calc(var(--cw-header-height) + 1rem); }
.cw-article__body h3 { font-size: 1.3rem; font-weight: 600; margin-top: 1.75em; scroll-margin-top: calc(var(--cw-header-height) + 1rem); font-family: var(--cw-font-body); }
.cw-article__body h4 { font-size: 1.1rem; font-weight: 700; font-family: var(--cw-font-body); }
.cw-article__body a { color: var(--cw-color-primary); text-decoration: underline; text-decoration-color: var(--cw-color-border); text-underline-offset: 3px; }
.cw-article__body a:hover { text-decoration-color: currentColor; }
.cw-article__body ul, .cw-article__body ol { padding-left: 1.4em; }
.cw-article__body ul { list-style: disc; }
.cw-article__body ol { list-style: decimal; }
.cw-article__body li + li { margin-top: 0.4em; }
.cw-article__body img { border-radius: var(--cw-radius); }
.cw-article__body figure { margin: 0; }
.cw-article__body figcaption { font-size: 0.85rem; color: var(--cw-color-text-muted); text-align: center; margin-top: 0.6em; }

.cw-article__body blockquote {
	margin: 0;
	padding: 0.25em 0 0.25em 1.4em;
	border-left: 3px solid var(--cw-color-accent);
	font-family: var(--cw-font-display);
	font-style: italic;
	font-size: 1.25rem;
	color: var(--cw-color-text);
}

.cw-article__body code {
	font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
	font-size: 0.87em;
	background: var(--cw-color-surface-tint);
	padding: 0.15em 0.4em;
	border-radius: 5px;
}
.cw-article__body pre {
	background: var(--cw-ink);
	color: #E6EAF0;
	padding: 1.25em;
	border-radius: var(--cw-radius);
	overflow-x: auto;
}
.cw-article__body pre code { background: none; padding: 0; color: inherit; }

.cw-article__body table { font-size: 0.95rem; }
.cw-article__body th, .cw-article__body td { border: 1px solid var(--cw-color-border); padding: 0.6em 0.8em; text-align: left; }
.cw-article__body th { background: var(--cw-color-surface-tint); font-weight: 700; }
@media (max-width: 639.98px) {
	/* A wide table scrolls within itself on small screens rather than
	   widening the page — safer than a page-level overflow-x rule. */
	.cw-article__body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
}

.cw-article__body .wp-block-embed,
.cw-article__body .wp-block-video,
.cw-article__body iframe { max-width: 100%; border-radius: var(--cw-radius); }

/* == 5. Icons ============================================================= */
.cw-icon { width: 20px; height: 20px; flex-shrink: 0; }
.cw-icon--sm { width: 15px; height: 15px; }

/* == 6. Buttons =========================================================== */
.cw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.75em 1.5em;
	border-radius: 999px;
	font-weight: 600;
	font-size: 0.95rem;
	border: 1.5px solid transparent;
	transition: transform var(--cw-transition), background-color var(--cw-transition), color var(--cw-transition), border-color var(--cw-transition);
}
.cw-btn--accent { background: var(--cw-color-accent); color: var(--cw-color-on-accent); }
.cw-btn--accent:hover { background: var(--cw-color-accent-strong); transform: translateY(-1px); }
.cw-btn--outline { border-color: var(--cw-color-border); color: var(--cw-color-text); background: var(--cw-color-surface); }
.cw-btn--outline:hover { border-color: var(--cw-color-primary); color: var(--cw-color-primary); }

.cw-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--cw-color-text);
	transition: background-color var(--cw-transition);
	position: relative;
}
.cw-icon-btn:hover { background: var(--cw-color-surface-tint); }
@media (max-width: 1023.98px) {
	/* 44px is the standard minimum comfortable touch target size. */
	.cw-icon-btn { width: 44px; height: 44px; }
}

/* == 7. Badges ============================================================ */
.cw-badge {
	--cw-badge-color: var(--cw-color-primary);
	display: inline-flex;
	align-items: center;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--cw-badge-color);
	background: color-mix(in srgb, var(--cw-badge-color) 12%, transparent);
	padding: 0.35em 0.75em;
	border-radius: 999px;
	margin-bottom: 0.6em;
}
.cw-badge:hover { background: color-mix(in srgb, var(--cw-badge-color) 22%, transparent); }
.cw-badge--lg { font-size: 0.85rem; padding: 0.5em 1em; margin-bottom: 1rem; }

/* == 8. Top bar =========================================================== */
.cw-topbar { background: var(--cw-ink); color: #fff; font-size: 0.85rem; }
.cw-topbar__inner { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 0.5em 0; position: relative; }
.cw-topbar__text a { text-decoration: underline; text-underline-offset: 2px; }
.cw-topbar__dismiss { position: absolute; right: var(--cw-gutter); color: #fff; opacity: 0.7; width: 22px; height: 22px; }
.cw-topbar__dismiss:hover { opacity: 1; }
.cw-topbar__dismiss .cw-icon { width: 14px; height: 14px; }

/* == 9. Header ============================================================ */
/* z-index must stay ABOVE .cw-nav-scrim's (150, see section 10). .site-header
   establishes its own stacking context (position + z-index), so its children
   — including the mobile nav drawer, which is nested inside this <header> —
   are painted as one atomic unit at THIS z-index when compared against the
   scrim. The drawer's own z-index:200 only orders it among its header
   siblings; it can never let it escape above the scrim on its own. Keeping
   this above 150 is what makes the open drawer (and its links) clickable
   instead of sitting underneath the dimmed overlay. */
.site-header { background: var(--cw-color-surface); border-bottom: 1px solid var(--cw-color-border); z-index: 160; position: relative; }
.site-header--sticky { position: sticky; top: 0; }
.site-header--sticky.is-scrolled { box-shadow: 0 8px 24px -12px hsl(var(--cw-color-shadow) / 0.25); }

.site-header__inner {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-height: var(--cw-header-height);
}

.site-branding { margin-right: auto; min-width: 0; overflow: hidden; }
.custom-logo-link img { max-height: 44px; width: auto; }
.site-title-link { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.site-title { font-family: var(--cw-font-display); font-weight: 800; font-size: 1.4rem; color: var(--cw-color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.site-tagline { font-size: 0.72rem; color: var(--cw-color-text-muted); letter-spacing: 0.03em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 379.98px) {
	.site-tagline { display: none; } /* Reclaim vertical/visual space on the narrowest phones. */
}

.primary-navigation { display: none; }
.primary-menu { display: flex; align-items: center; gap: 0.25rem; }
.primary-menu > .menu-item { position: relative; }
.primary-menu > .menu-item > a {
	display: flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.85em 0.9em;
	font-weight: 600;
	font-size: 0.94rem;
	border-radius: var(--cw-radius-sm);
	transition: color var(--cw-transition), background-color var(--cw-transition);
}
.primary-menu > .menu-item > a:hover,
.primary-menu > .menu-item.current-menu-item > a { color: var(--cw-color-primary); background: var(--cw-color-surface-tint); }

/* Dropdown (non-mega) submenus */
.primary-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 240px;
	background: var(--cw-color-surface);
	border: 1px solid var(--cw-color-border);
	border-radius: var(--cw-radius);
	box-shadow: 0 16px 40px -12px hsl(var(--cw-color-shadow) / 0.25);
	padding: 0.5rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--cw-transition), transform var(--cw-transition), visibility var(--cw-transition);
	z-index: 20;
}
.primary-menu .sub-menu .sub-menu { top: 0; left: 100%; }
.primary-menu .sub-menu .menu-item > a { display: block; padding: 0.6em 0.75em; border-radius: 8px; font-size: 0.92rem; }
.primary-menu .sub-menu .menu-item > a:hover { background: var(--cw-color-surface-tint); color: var(--cw-color-primary); }

@media (hover: hover) {
	.primary-menu > .menu-item:hover > .sub-menu,
	.primary-menu > .menu-item.sub-menu-open > .sub-menu {
		opacity: 1; visibility: visible; transform: translateY(0);
	}
	.primary-menu .menu-item:hover > .sub-menu.sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
}
.primary-menu .menu-item.sub-menu-open > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }

/* Keyboard accessibility: reveal submenus on focus, not just hover/click */
@media (min-width: 1024px) {
	.primary-menu > .menu-item:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
}

/* Mega menu: any top-level item with the "mega-menu" CSS class (added via
   Appearance > Menus > Screen Options > CSS Classes) gets its .sub-menu
   rendered as a full-width grid panel instead of a narrow dropdown. */
.primary-menu > .menu-item.mega-menu { position: static; }
.primary-menu > .menu-item.mega-menu > .sub-menu {
	left: 0;
	right: 0;
	width: min(var(--cw-container), calc(100vw - 2 * var(--cw-gutter)));
	margin-inline: auto;
	inset-inline: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.5rem 1.5rem;
	padding: 1.5rem;
}
.primary-menu > .menu-item.mega-menu > .sub-menu > .menu-item > a {
	font-weight: 700;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--cw-color-text-muted);
	pointer-events: none;
	padding-bottom: 0.3em;
}
.primary-menu > .menu-item.mega-menu > .sub-menu > .menu-item > .sub-menu {
	position: static;
	display: block;
	opacity: 1;
	visibility: visible;
	transform: none;
	border: none;
	box-shadow: none;
	padding: 0;
	background: none;
}

.site-header__actions { display: flex; align-items: center; gap: 0.25rem; }

.cw-theme-toggle__moon { display: none; }
[data-theme="dark"] .cw-theme-toggle__sun { display: none; }
[data-theme="dark"] .cw-theme-toggle__moon { display: block; }

.cw-menu-toggle__close { display: none; }
.cw-menu-toggle.is-open .cw-menu-toggle__open { display: none; }
.cw-menu-toggle.is-open .cw-menu-toggle__close { display: block; }

/* == 10. Mobile nav drawer ================================================ */
@media (max-width: 1023.98px) {
	.primary-navigation {
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		width: min(320px, 84vw);
		background: var(--cw-color-surface);
		padding: calc(var(--cw-header-height) + 1rem) 1.5rem 2rem;
		overflow-y: auto;
		transform: translateX(100%);
		transition: transform var(--cw-transition-slow);
		z-index: 200;
	}
	body.cw-nav-open .primary-navigation { transform: translateX(0); }
	.primary-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.primary-menu > .menu-item > a { padding: 0.9em 0.25em; border-radius: 0; border-bottom: 1px solid var(--cw-color-border); }
	.primary-menu .sub-menu,
	.primary-menu > .menu-item.mega-menu > .sub-menu {
		position: static;
		display: none;
		opacity: 1; visibility: visible; transform: none;
		width: auto; grid-template-columns: 1fr;
		border: none; box-shadow: none; padding: 0 0 0 1rem;
	}
	.primary-menu .menu-item.sub-menu-open > .sub-menu { display: block; }
	.primary-menu > .menu-item.mega-menu > .sub-menu > .menu-item > a { pointer-events: auto; color: var(--cw-color-text); font-size: 0.94rem; text-transform: none; font-weight: 600; padding: 0.6em 0.25em; }
}

@media (min-width: 1024px) {
	.cw-menu-toggle, .cw-nav-scrim { display: none; }
	.primary-navigation { display: block; }
}

.cw-nav-scrim {
	/* Must stay BELOW .site-header's z-index (section 9) or it will paint
	   over the mobile nav drawer and swallow taps meant for its links. */
	position: fixed; inset: 0; background: hsl(var(--cw-color-shadow) / 0.45);
	z-index: 150; opacity: 0; transition: opacity var(--cw-transition-slow);
}
body.cw-nav-open .cw-nav-scrim { opacity: 1; }
.cw-nav-scrim[hidden] { display: none; }

/* Submenu expand toggle button injected by JS for touch/keyboard users */
.cw-submenu-toggle {
	position: absolute; top: 50%; right: 0.15em; transform: translateY(-50%); width: 40px; height: 40px;
	display: flex; align-items: center; justify-content: center; color: var(--cw-color-text-muted);
}
@media (min-width: 1024px) { .cw-submenu-toggle { display: none; } }

/* == 11. Wire ticker (signature element) ================================= */
.cw-ticker { background: var(--cw-ink); color: #fff; overflow: hidden; }
.cw-ticker__inner { display: flex; align-items: center; gap: 1rem; padding-block: 0.55em; }
.cw-ticker__badge {
	display: flex; align-items: center; gap: 0.4em; flex-shrink: 0;
	font-family: var(--cw-font-display); font-weight: 700; font-style: italic;
	font-size: 0.85rem; color: var(--cw-color-accent);
	border-right: 1px solid rgba(255,255,255,0.2); padding-right: 1rem;
}
.cw-ticker__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--cw-color-accent); animation: cw-pulse 1.8s ease-in-out infinite; }
@keyframes cw-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.cw-ticker__viewport { overflow: hidden; flex: 1; min-width: 0; }
.cw-ticker__track {
	display: flex; gap: 3rem; white-space: nowrap; width: max-content;
	animation: cw-ticker-scroll 38s linear infinite;
	font-variant-numeric: tabular-nums;
	font-size: 0.88rem;
}
.cw-ticker:hover .cw-ticker__track,
.cw-ticker__track:focus-within { animation-play-state: paused; }
.cw-ticker__track li a:hover { text-decoration: underline; }
@keyframes cw-ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

@media (max-width: 479.98px) {
	.cw-ticker__inner { gap: 0.6rem; }
	.cw-ticker__badge { padding-right: 0.6rem; font-size: 0.78rem; }
	.cw-ticker__track { gap: 2rem; font-size: 0.82rem; }
}

@media (prefers-reduced-motion: reduce) {
	.cw-ticker__track { animation: none; overflow-x: auto; }
	.cw-ticker__dot { animation: none; }
}

/* == 12. Search overlay ==================================================== */
.cw-search-overlay {
	position: fixed; inset: 0; z-index: 300; background: hsl(var(--cw-color-shadow) / 0.5);
	padding-top: 10vh;
}
.cw-search-overlay[hidden] { display: none; }
.cw-search-overlay__inner { background: var(--cw-color-surface); border-radius: var(--cw-radius-lg); padding: 1.5rem; max-width: 640px; box-shadow: 0 30px 80px -20px hsl(var(--cw-color-shadow) / 0.4); }
.cw-search-overlay__form { display: flex; align-items: center; gap: 0.75rem; border-bottom: 2px solid var(--cw-color-border); padding-bottom: 1rem; }
.cw-search-overlay__form .cw-icon { color: var(--cw-color-text-muted); }
.cw-search-overlay__input { flex: 1; border: none; background: none; font-size: 1.15rem; outline: none; }
.cw-search-overlay__results { max-height: 55vh; overflow-y: auto; margin-top: 1rem; }
.cw-search-overlay__results:empty { margin: 0; }

.cw-search-result {
	display: flex; align-items: center; gap: 0.85rem; padding: 0.6rem;
	border-radius: var(--cw-radius-sm);
}
.cw-search-result:hover, .cw-search-result.is-active { background: var(--cw-color-surface-tint); }
.cw-search-result img { width: 52px; height: 52px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.cw-search-result__title { font-weight: 600; font-size: 0.95rem; line-height: 1.3; }
.cw-search-result mark { background: var(--cw-amber-100); color: inherit; border-radius: 3px; }
.cw-search-status { padding: 0.75rem 0.5rem; color: var(--cw-color-text-muted); font-size: 0.9rem; }

/* == 13. Cards & grids ===================================================== */
.cw-card-grid { display: grid; gap: 1.35rem; grid-template-columns: repeat(1, 1fr); }
@media (min-width: 480px) { .cw-card-grid { gap: 1.75rem; } }
@media (min-width: 640px) { .cw-card-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
	.cw-card-grid--3 { grid-template-columns: repeat(3, 1fr); }
	.cw-card-grid--4 { grid-template-columns: repeat(4, 1fr); }
	.cw-card-grid--5 { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1280px) {
	.cw-card-grid--5 { grid-template-columns: repeat(5, 1fr); }
}

.cw-card {
	position: relative;
	display: flex; flex-direction: column;
	background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius-lg);
	padding: 0.65rem 0.65rem 1.1rem;
	transition: transform var(--cw-transition), box-shadow var(--cw-transition), border-color var(--cw-transition);
}
.cw-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -18px hsl(var(--cw-color-shadow) / 0.28); border-color: transparent; }
.cw-card:active { transform: translateY(-1px) scale(0.995); }
.cw-card__media {
	position: relative; display: block; border-radius: calc(var(--cw-radius-lg) - 6px); overflow: hidden;
	aspect-ratio: 8 / 5; background: var(--cw-color-surface-tint);
}
.cw-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--cw-transition-slow); }
.cw-card:hover .cw-card__media img { transform: scale(1.06); }
.cw-card__body { padding: 0.9rem 0.35rem 0; }
.cw-card__title { font-size: 1.05rem; font-weight: 700; line-height: 1.35; margin-bottom: 0.35em; }
.cw-card__title a { transition: color var(--cw-transition); }
/* Whole card is one click target — image, whitespace, and title all open
   the article. The category badge stays clickable on its own by sitting
   above this overlay. */
.cw-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.cw-card .cw-badge { position: relative; z-index: 2; }
.cw-card:hover .cw-card__title a { color: var(--cw-color-primary); }
.cw-card__subtitle, .cw-card__excerpt { font-size: 0.92rem; color: var(--cw-color-text-muted); margin-bottom: 0.6em; }

.cw-card--compact { padding: 0.5rem 0.5rem 0.9rem; }
.cw-card--compact .cw-card__title { font-size: 0.98rem; }
.cw-card--compact .cw-card__body { padding-top: 0.7rem; }

.cw-card--lead {
	position: relative; height: 100%; min-height: 320px; border-radius: var(--cw-radius-lg); overflow: hidden;
	padding: 0; border: none;
}
@media (min-width: 480px) {
	.cw-card--lead { min-height: 420px; }
}
.cw-card--lead:hover { box-shadow: 0 24px 48px -18px hsl(var(--cw-color-shadow) / 0.4); }
.cw-card--lead .cw-card__media { position: absolute; inset: 0; border-radius: 0; aspect-ratio: auto; }
.cw-card--lead .cw-card__scrim {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, transparent 32%, hsl(var(--cw-color-shadow) / 0.9) 100%);
}
.cw-card--lead .cw-card__body { position: absolute; inset: auto 0 0 0; padding: 1.85rem; color: #fff; z-index: 1; }
.cw-card--lead .cw-card__title { font-family: var(--cw-font-display); font-size: clamp(1.5rem, 2.2vw + 1rem, 2.1rem); color: #fff; }
.cw-card--lead .cw-card__subtitle { color: rgba(255,255,255,0.82); }
.cw-card--lead .cw-post-meta { color: rgba(255,255,255,0.75); }
.cw-card--lead .cw-post-meta .cw-icon { color: rgba(255,255,255,0.75); }

.cw-post-meta { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: 0.82rem; color: var(--cw-color-text-muted); }
.cw-post-meta__item { display: inline-flex; align-items: center; gap: 0.3em; }
.cw-post-meta .cw-icon { color: var(--cw-color-text-muted); }

.cw-row-card {
	display: flex; gap: 0.85rem; align-items: flex-start;
	border-radius: var(--cw-radius); padding: 0.5rem; margin-inline: -0.5rem;
	transition: background-color var(--cw-transition);
}
.cw-row-card:hover, .cw-row-card:focus-within { background: var(--cw-color-surface-tint); }
.cw-row-card:active { background: var(--cw-color-border); }
.cw-row-card + .cw-row-card { margin-top: 0.35rem; }
.cw-row-card__media { width: 64px; height: 64px; border-radius: 10px; overflow: hidden; flex-shrink: 0; }
.cw-row-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--cw-transition-slow); }
.cw-row-card:hover .cw-row-card__media img { transform: scale(1.08); }
.cw-row-card__title { font-size: 0.92rem; font-weight: 600; line-height: 1.35; margin-bottom: 0.3em; }
.cw-row-card__title a::after { content: ""; position: absolute; inset: 0; } /* full-row click target */
.cw-row-card { position: relative; }
.cw-row-card:hover .cw-row-card__title a { color: var(--cw-color-primary); }

.cw-empty-state { text-align: center; padding: 4rem 1.5rem; }
.cw-empty-state__icon { width: 42px; height: 42px; margin-inline: auto; color: var(--cw-color-text-muted); margin-bottom: 1rem; }
.cw-empty-state h3 { font-family: var(--cw-font-display); font-size: 1.4rem; margin-bottom: 0.5rem; }
.cw-empty-state p { color: var(--cw-color-text-muted); max-width: 42ch; margin-inline: auto; margin-bottom: 1.5rem; }

/* == 14. Hero (Featured Posts) ============================================ */
.cw-hero__grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
.cw-hero__lead { border-radius: var(--cw-radius-lg); overflow: hidden; }
.cw-hero__lead .cw-card__media { border-radius: 0; }
.cw-hero__list {
	display: flex; flex-direction: column;
	background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius-lg);
	padding: 0.5rem 1rem;
}
@media (min-width: 1024px) {
	.cw-hero__grid { grid-template-columns: 1.6fr 1fr; align-items: stretch; }
	.cw-card--lead { min-height: 480px; }
}

/* Hero slider. Reuses .cw-card--lead's own markup and look for every slide
   (see get_template_part() calls in section-hero.php) — this only adds
   positioning, the crossfade, and the controls. Sized to match
   .cw-card--lead's own min-height breakpoints above so the hero is the
   same height whether it's showing one post or many. */
.cw-hero-slider { position: relative; height: 100%; min-height: 320px; }
@media (min-width: 480px)  { .cw-hero-slider { min-height: 420px; } }
@media (min-width: 1024px) { .cw-hero-slider { min-height: 480px; } }

.cw-hero-slider__viewport { position: relative; height: 100%; border-radius: var(--cw-radius-lg); overflow: hidden; }

.cw-hero-slide { height: 100%; }
.cw-hero-slide:not(.is-active) { display: none; }

/* Once JS confirms it's running, every slide gets stacked on top of each
   other so they can crossfade; without JS, the block above just shows the
   first slide as a plain static hero, same as this section always did. */
.cw-hero-slider.is-initialized .cw-hero-slide {
	display: block; position: absolute; inset: 0; z-index: 1;
	opacity: 0;
	transition: opacity var(--cw-transition-slow);
}
.cw-hero-slider.is-initialized .cw-hero-slide.is-active { opacity: 1; z-index: 2; }

/* Slow, subtle drift on the active slide's image only — understated, and
   neutralized globally by the prefers-reduced-motion block in section 2. */
.cw-hero-slider.is-initialized .cw-hero-slide .cw-card__media img { transition: transform 7s ease-out, opacity var(--cw-transition-slow); }
.cw-hero-slider.is-initialized .cw-hero-slide.is-active .cw-card__media img { transform: scale(1.05); }

.cw-hero-slider__arrow {
	display: none; /* revealed once JS confirms the slider initialized */
	position: absolute; top: 50%; margin-top: -20px; z-index: 3;
	width: 40px; height: 40px; border-radius: 50%;
	align-items: center; justify-content: center;
	background: hsl(var(--cw-color-shadow) / 0.35); color: #fff;
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	box-shadow: 0 6px 16px -6px hsl(var(--cw-color-shadow) / 0.4);
	transition: background-color var(--cw-transition), transform var(--cw-transition);
}
.cw-hero-slider__arrow:hover { background: hsl(var(--cw-color-shadow) / 0.5); }
.cw-hero-slider__arrow:active { transform: translateY(1px); }
.cw-hero-slider__arrow--prev { inset-inline-start: 0.85rem; }
.cw-hero-slider__arrow--next { inset-inline-end: 0.85rem; }
.cw-hero-slider.is-initialized .cw-hero-slider__arrow { display: flex; }

.cw-hero-slider__footer {
	display: none; /* revealed once JS confirms the slider initialized */
	position: absolute; inset-inline: 0; bottom: 0; z-index: 3;
	align-items: center; justify-content: center; gap: 0.75rem;
	padding: 1.1rem 1.25rem;
}
.cw-hero-slider.is-initialized .cw-hero-slider__footer { display: flex; }

.cw-hero-slider__dots { display: flex; align-items: center; gap: 0.4rem; }
.cw-hero-slider__dot {
	width: 8px; height: 8px; padding: 0; border-radius: 999px; flex-shrink: 0;
	background: hsl(0deg 0% 100% / 0.45);
	transition: background-color var(--cw-transition), width var(--cw-transition);
}
.cw-hero-slider__dot:hover { background: hsl(0deg 0% 100% / 0.7); }
.cw-hero-slider__dot.is-active { width: 22px; background: var(--cw-color-accent); }

.cw-hero-slider__pause {
	width: 30px; height: 30px; padding: 0; border-radius: 50%; color: #fff;
	background: hsl(var(--cw-color-shadow) / 0.35);
	display: inline-flex; align-items: center; justify-content: center;
	margin-inline-start: 0.4rem;
	transition: background-color var(--cw-transition);
}
.cw-hero-slider__pause:hover { background: hsl(var(--cw-color-shadow) / 0.5); }
.cw-hero-slider__pause .cw-hero-slider__play-icon { display: none; }
.cw-hero-slider__pause.is-paused .cw-hero-slider__pause-icon { display: none; }
.cw-hero-slider__pause.is-paused .cw-hero-slider__play-icon { display: block; }

.cw-hero-slider__arrow .cw-icon, .cw-hero-slider__pause .cw-icon { width: 18px; height: 18px; }

/* Reserve room at the bottom of each slide's text overlay so the title/meta
   never sits underneath the dots + pause row. Only applies inside a slide
   (i.e. only when that footer actually exists) — the single-post fallback
   is untouched. */
.cw-hero-slide .cw-card--lead .cw-card__body { padding-bottom: 4.75rem; }

@media (max-width: 479.98px) {
	.cw-hero-slider__arrow { width: 34px; height: 34px; margin-top: -17px; }
}

/* == 15. Category grid & author grid ====================================== */
.cw-cat-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .cw-cat-grid { grid-template-columns: repeat(4, 1fr); } }
.cw-cat-tile {
	--cw-badge-color: var(--cw-color-primary);
	display: flex; flex-direction: column; gap: 0.35rem;
	padding: 1.5rem 1.25rem;
	border-radius: var(--cw-radius);
	background: color-mix(in srgb, var(--cw-badge-color) 8%, var(--cw-color-surface));
	border: 1px solid color-mix(in srgb, var(--cw-badge-color) 20%, transparent);
	transition: transform var(--cw-transition), box-shadow var(--cw-transition);
}
.cw-cat-tile:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -14px hsl(var(--cw-color-shadow) / 0.3); }
.cw-cat-tile__name { font-weight: 700; color: var(--cw-badge-color); font-family: var(--cw-font-display); font-size: 1.05rem; }
.cw-cat-tile__count { font-size: 0.8rem; color: var(--cw-color-text-muted); }

.cw-author-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .cw-author-grid { grid-template-columns: repeat(4, 1fr); } }
.cw-author-tile { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.5rem; padding: 1.5rem 1rem; background: var(--cw-color-surface); border-radius: var(--cw-radius); transition: transform var(--cw-transition); }
.cw-author-tile:hover { transform: translateY(-3px); }
.cw-author-tile img { border-radius: 50%; }
.cw-author-tile__name { font-weight: 700; font-size: 0.95rem; }
.cw-author-tile__count { font-size: 0.78rem; color: var(--cw-color-text-muted); }

/* == 16. Newsletter ======================================================== */
.cw-newsletter { background: var(--cw-color-primary-strong); color: #fff; position: relative; overflow: hidden; }
.cw-newsletter::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--cw-color-accent); }
.cw-newsletter__inner { display: flex; flex-direction: column; gap: 1.5rem; align-items: center; text-align: center; }
.cw-newsletter__title { font-size: clamp(1.6rem, 3vw, 2.1rem); margin-bottom: 0.4em; }
.cw-newsletter__text { color: rgba(255,255,255,0.82); max-width: 48ch; }
.cw-newsletter__form { display: flex; gap: 0.6rem; width: 100%; max-width: 440px; flex-wrap: wrap; justify-content: center; }
.cw-newsletter__input { flex: 1; min-width: 220px; padding: 0.85em 1.1em; border-radius: 999px; border: none; background: rgba(255,255,255,0.12); color: #fff; }
.cw-newsletter__input::placeholder { color: rgba(255,255,255,0.6); }
.cw-newsletter__admin-note { font-size: 0.82rem; color: rgba(255,255,255,0.7); border: 1px dashed rgba(255,255,255,0.35); border-radius: var(--cw-radius-sm); padding: 0.75em 1em; }

.cw-newsletter--compact { background: none; color: inherit; padding: 0; }
.cw-newsletter--compact::before { display: none; }
.cw-newsletter--compact .cw-newsletter__inner { align-items: stretch; text-align: left; gap: 0.75rem; }
.cw-newsletter--compact .cw-newsletter__text { color: var(--cw-color-text-muted); font-size: 0.88rem; }
.cw-newsletter--compact .cw-newsletter__form { max-width: none; }
.cw-newsletter--compact .cw-newsletter__input { background: var(--cw-color-surface-tint); color: var(--cw-color-text); min-width: 0; }
.cw-newsletter--compact .cw-newsletter__input::placeholder { color: var(--cw-color-text-muted); }
.cw-newsletter--compact .cw-newsletter__admin-note { color: var(--cw-color-text-muted); border-color: var(--cw-color-border); }

/* == 17. FAQ =============================================================== */
.cw-faq__inner { max-width: var(--cw-container-narrow); }
.cw-faq__list { display: flex; flex-direction: column; gap: 0.75rem; }
.cw-faq__item { background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius); padding: 0.25rem 1.25rem; }
.cw-faq__question { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; font-weight: 700; cursor: pointer; list-style: none; }
.cw-faq__question::-webkit-details-marker { display: none; }
.cw-faq__chevron { transition: transform var(--cw-transition); flex-shrink: 0; }
.cw-faq__item[open] .cw-faq__chevron { transform: rotate(180deg); }
.cw-faq__answer { padding-bottom: 1.1rem; color: var(--cw-color-text-muted); line-height: 1.65; }

/* == 18. Reading progress bar ============================================= */
.cw-progress-bar { position: sticky; top: 0; height: 3px; z-index: 90; background: transparent; }
.cw-progress-bar__fill { height: 100%; width: 0%; background: var(--cw-color-accent); transition: width 80ms linear; }

/* == 19. Breadcrumbs ======================================================= */
.cw-breadcrumbs { margin-block: 1.25rem 0.5rem; font-size: 0.82rem; color: var(--cw-color-text-muted); }
.cw-breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; }
.cw-breadcrumbs li { display: inline-flex; align-items: center; gap: 0.35rem; }
.cw-breadcrumbs a:hover { color: var(--cw-color-primary); }
.cw-breadcrumbs__sep { width: 13px; height: 13px; }

/* == 20. Article page ====================================================== */
.cw-article__header { padding-block: 1.5rem 1rem; text-align: left; }
.cw-article__subtitle { font-size: 1.2rem; color: var(--cw-color-text-muted); font-family: var(--cw-font-display); font-style: italic; margin-bottom: 1.25rem; }
.cw-article__byline { display: flex; align-items: center; gap: 0.75rem; }
.cw-article__byline img { border-radius: 50%; }
.cw-article__byline-text { display: flex; flex-direction: column; gap: 0.25rem; }
.cw-article__author { font-weight: 700; font-size: 0.92rem; }
.cw-article__author:hover { color: var(--cw-color-primary); }

.cw-article__featured { margin-block: 1.5rem; }
.cw-article__featured img { width: 100%; border-radius: var(--cw-radius-lg); aspect-ratio: 16/9; object-fit: cover; }
.cw-article__caption { font-size: 0.85rem; color: var(--cw-color-text-muted); text-align: center; margin-top: 0.75em; }

.cw-article__layout {
	padding-bottom: 3rem;
}
.cw-article__share-rail { display: none; }
.cw-article__content-col { min-width: 0; max-width: var(--cw-container-narrow); margin-inline: auto; }
.cw-article__toc-col { max-width: var(--cw-container-narrow); margin: 2rem auto 0; }

@media (min-width: 1024px) {
	.cw-article__layout {
		display: grid;
		grid-template-columns: 64px minmax(0, 1fr) 260px;
		grid-template-areas: "share content toc";
		gap: 2rem;
		align-items: start;
	}
	.cw-article__share-rail { display: block; grid-area: share; position: sticky; top: calc(var(--cw-header-height) + 1.5rem); }
	.cw-article__content-col { grid-area: content; margin-inline: 0; max-width: none; }
	.cw-article__toc-col { grid-area: toc; margin: 0; max-width: none; position: sticky; top: calc(var(--cw-header-height) + 1.5rem); }
}

.cw-article__tags { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; margin-top: 2rem; color: var(--cw-color-text-muted); }
.cw-article__tags a { font-size: 0.82rem; background: var(--cw-color-surface-tint); padding: 0.4em 0.9em; border-radius: 999px; }
.cw-article__tags a:hover { color: var(--cw-color-primary); }

.post-navigation { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-top: 2.5rem; }
@media (min-width: 560px) { .post-navigation { grid-template-columns: 1fr 1fr; } }
.post-navigation .nav-next { text-align: right; }
@media (min-width: 560px) { .post-navigation .nav-next { grid-column: 2; } }
.post-navigation a { display: block; padding: 1rem; border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius); }
.post-navigation a:hover { border-color: var(--cw-color-primary); }
.cw-post-nav__label { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--cw-color-text-muted); margin-bottom: 0.3em; }
.cw-post-nav__title { font-weight: 700; font-family: var(--cw-font-display); }

/* == 21. Table of contents ================================================= */
.cw-toc { background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius); padding: 1.1rem 1.25rem; }
.cw-toc__toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; font-weight: 700; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; }
.cw-toc__chevron { transition: transform var(--cw-transition); }
.cw-toc[data-collapsed="true"] .cw-toc__chevron { transform: rotate(-90deg); }
.cw-toc[data-collapsed="true"] .cw-toc__list { display: none; }
.cw-toc__list { margin-top: 0.85rem; display: flex; flex-direction: column; gap: 0.55rem; border-left: 2px solid var(--cw-color-border); }
.cw-toc__item a { display: block; padding-left: 0.9rem; font-size: 0.87rem; color: var(--cw-color-text-muted); border-left: 2px solid transparent; margin-left: -2px; transition: color var(--cw-transition), border-color var(--cw-transition); }
.cw-toc__item--h3 a { padding-left: 1.6rem; font-size: 0.83rem; }
.cw-toc__item a:hover { color: var(--cw-color-text); }
.cw-toc__item.is-active a { color: var(--cw-color-primary); border-left-color: var(--cw-color-primary); font-weight: 600; }

/* == 22. Share buttons ====================================================== */
.cw-share { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.cw-share--sticky { flex-direction: column; align-items: center; }
.cw-share__label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--cw-color-text-muted); }
.cw-share--sticky .cw-share__label { writing-mode: vertical-rl; }
.cw-share__btn {
	width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: var(--cw-color-surface-tint); color: var(--cw-color-text); transition: background-color var(--cw-transition), color var(--cw-transition), transform var(--cw-transition);
}
.cw-share__btn:hover { background: var(--cw-color-primary); color: #fff; transform: translateY(-2px); }
.cw-share__btn.is-copied { background: var(--cw-color-success); color: #fff; }
.cw-share__btn .cw-icon { width: 17px; height: 17px; }
.cw-share:not(.cw-share--sticky) { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--cw-color-border); }

/* == 23. Author box ========================================================= */
.cw-author-box { display: flex; gap: 1.1rem; padding: 1.5rem; background: var(--cw-color-surface-tint); border-radius: var(--cw-radius); margin-top: 2rem; }
.cw-author-box__avatar img { border-radius: 50%; }
.cw-author-box__eyebrow { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--cw-color-text-muted); margin-bottom: 0.2em; }
.cw-author-box__name { font-weight: 700; font-family: var(--cw-font-display); font-size: 1.1rem; }
.cw-author-box__bio { font-size: 0.9rem; color: var(--cw-color-text-muted); margin-block: 0.5em; }
.cw-author-box__link { font-size: 0.85rem; font-weight: 600; color: var(--cw-color-primary); display: inline-flex; align-items: center; gap: 0.3em; }

/* == 24. Related posts ====================================================== */
.cw-related { margin-top: 3rem; padding-top: 2.5rem; border-top: 1px solid var(--cw-color-border); }

/* == 25. Comments =========================================================== */
.cw-comments-wrap { margin-top: 3rem; padding-top: 2.5rem; border-top: 1px solid var(--cw-color-border); max-width: var(--cw-container-narrow); }
.cw-comment-list { display: flex; flex-direction: column; gap: 1.5rem; margin-top: 1.5rem; }
.cw-comment .children { margin-top: 1.5rem; margin-left: 2.25rem; display: flex; flex-direction: column; gap: 1.5rem; }
.cw-comment__body { display: flex; gap: 1rem; }
.cw-comment__avatar img { border-radius: 50%; }
.cw-comment__content { flex: 1; }
.cw-comment__meta { display: flex; align-items: center; gap: 0.6rem; font-size: 0.85rem; margin-bottom: 0.4em; flex-wrap: wrap; }
.cw-comment__author { font-weight: 700; }
.cw-comment__date a { color: var(--cw-color-text-muted); }
.cw-comment__pending { font-size: 0.75rem; background: var(--cw-amber-100); color: var(--cw-amber-600); padding: 0.15em 0.6em; border-radius: 999px; }
.cw-comment__text p:last-child { margin-bottom: 0; }
.comment-reply-link { font-size: 0.82rem; font-weight: 700; color: var(--cw-color-primary); margin-top: 0.5em; display: inline-block; }
.cw-comments-closed { margin-top: 2rem; color: var(--cw-color-text-muted); }

.cw-comment-form { margin-top: 2rem; }
.cw-comment-form p { margin-bottom: 1rem; }
.comment-form-comment textarea,
.comment-form-author input, .comment-form-email input, .comment-form-url input,
.cw-search-form__input, .cw-newsletter__input, .cw-toolbar__select, .cw-search-overlay__input {
	width: 100%;
}
.comment-form-comment textarea,
.comment-form-author input, .comment-form-email input, .comment-form-url input {
	padding: 0.85em 1em; border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius-sm); background: var(--cw-color-surface);
}
.comment-form-comment textarea:focus, .comment-form-author input:focus, .comment-form-email input:focus, .comment-form-url input:focus {
	border-color: var(--cw-color-primary);
}
.comment-notes, .comment-form-cookies-consent { font-size: 0.82rem; color: var(--cw-color-text-muted); }
.form-submit .cw-comment-form { display: none; }
#submit, .cw-comment-form [type="submit"] {
	background: var(--cw-color-primary); color: #fff; padding: 0.8em 1.75em; border-radius: 999px; font-weight: 700;
}
#submit:hover { background: var(--cw-color-primary-strong); }

/* == 26. Sidebar & widgets ================================================== */
#secondary { min-width: 0; }
.widget-area__sticky { position: sticky; top: calc(var(--cw-header-height) + 1.5rem); display: flex; flex-direction: column; gap: 2rem; }
.widget { background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: var(--cw-radius); padding: 1.5rem; }
.widget-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 1.1rem; }
.widget ul { display: flex; flex-direction: column; }
.widget select { width: 100%; padding: 0.6em; border: 1px solid var(--cw-color-border); border-radius: 8px; }
.widget_categories li, .widget_archive li, .widget_meta li, .widget_pages li, .widget_recent_comments li, .widget_recent_entries li {
	padding: 0.55em 0; border-bottom: 1px solid var(--cw-color-border); display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.92rem;
}
.widget_tag_cloud .tagcloud { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.widget_tag_cloud .tagcloud a { font-size: 0.8rem !important; background: var(--cw-color-surface-tint); padding: 0.4em 0.9em; border-radius: 999px; }
.cw-widget-list { display: flex; flex-direction: column; }

.cw-social-icons { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.cw-social-icons__link { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--cw-color-surface-tint); transition: background-color var(--cw-transition), color var(--cw-transition); }
.cw-social-icons__link:hover { background: var(--cw-color-primary); color: #fff; }
.cw-social-icons__link .cw-icon { width: 17px; height: 17px; }

/* == 27. Ad slots =========================================================== */
.cw-ad-slot { margin-block: 1.75rem; text-align: center; }
.cw-ad-slot:empty { display: none; }
.cw-ad-slot--header, .cw-ad-slot--footer, .cw-ad-slot--archive-top { margin-block: 0 1.75rem; }

/* == 28. Archive / category header & toolbar ================================ */
.cw-archive-header { background: var(--cw-color-surface-tint); padding-block: 2rem 2.5rem; margin-bottom: 0; }
.cw-archive-header__title { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-bottom: 0.4em; }
.cw-archive-header__description { color: var(--cw-color-text-muted); max-width: 65ch; }
.cw-archive-header .cw-breadcrumbs { margin-top: 0; }

.cw-archive-featured { margin-bottom: 2.5rem; }
.cw-archive-featured .cw-card--lead { min-height: 340px; }

.cw-toolbar {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
	padding-block: 1rem; margin-bottom: 1.75rem; border-block: 1px solid var(--cw-color-border);
	position: sticky; top: var(--cw-header-height); background: var(--cw-color-bg); z-index: 10;
}
.cw-toolbar__select { padding: 0.5em 0.75em; border: 1px solid var(--cw-color-border); border-radius: 8px; background: var(--cw-color-surface); font-size: 0.88rem; }
.cw-toolbar__view { display: flex; gap: 0.25rem; background: var(--cw-color-surface-tint); border-radius: 999px; padding: 0.25rem; }
.cw-toolbar__view-btn { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--cw-color-text-muted); }
.cw-toolbar__view-btn.is-active { background: var(--cw-color-surface); color: var(--cw-color-primary); box-shadow: 0 2px 6px hsl(var(--cw-color-shadow) / 0.15); }
.cw-toolbar__view-btn .cw-icon { width: 16px; height: 16px; }
@media (max-width: 1023.98px) {
	.cw-toolbar__view-btn { width: 40px; height: 40px; }
}

.cw-results.is-list-view { grid-template-columns: 1fr !important; }
.cw-results.is-list-view .cw-card { flex-direction: row; gap: 1.25rem; }
.cw-results.is-list-view .cw-card__media { width: 240px; flex-shrink: 0; aspect-ratio: 3/2; }
.cw-results.is-list-view .cw-card__body { padding-top: 0; }
@media (max-width: 639.98px) {
	.cw-results.is-list-view .cw-card { flex-direction: column; }
	.cw-results.is-list-view .cw-card__media { width: 100%; }
}

.cw-load-more { text-align: center; margin-top: 2.5rem; }
.cw-load-more.is-loading .cw-btn { opacity: 0.6; pointer-events: none; }

.cw-pagination ul { display: flex; justify-content: center; gap: 0.4rem; margin-top: 2.5rem; flex-wrap: wrap; }
.cw-pagination a, .cw-pagination span { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding-inline: 0.5rem; border-radius: 10px; font-size: 0.9rem; font-weight: 600; }
.cw-pagination a:hover { background: var(--cw-color-surface-tint); }
.cw-pagination .current { background: var(--cw-color-primary); color: #fff; }
.cw-pagination .cw-icon { width: 16px; height: 16px; }

.cw-search-count { color: var(--cw-color-text-muted); margin-bottom: 1.5rem; font-size: 0.9rem; }
.cw-archive-header__title span { color: var(--cw-color-primary); }

/* == 29. Search form ========================================================= */
.cw-search-form { display: flex; align-items: center; gap: 0.5rem; background: var(--cw-color-surface); border: 1px solid var(--cw-color-border); border-radius: 999px; padding: 0.35rem 0.35rem 0.35rem 1.1rem; margin-top: 1.25rem; }
.cw-search-form__input { border: none; background: none; outline: none; flex: 1; padding-block: 0.5em; }
.cw-search-form__submit { width: 40px; height: 40px; border-radius: 50%; background: var(--cw-color-primary); color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cw-search-form__submit .cw-icon { width: 16px; height: 16px; }

/* == 30. 404 ================================================================= */
.cw-404 { text-align: center; padding-block: 5rem; }
.cw-404__eyebrow { font-family: var(--cw-font-display); font-size: 5rem; font-weight: 800; color: var(--cw-color-surface-tint); line-height: 1; margin-bottom: 0.5rem; -webkit-text-stroke: 2px var(--cw-color-border); }
.cw-404__title { font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom: 0.75rem; }
.cw-404__text { color: var(--cw-color-text-muted); max-width: 52ch; margin-inline: auto; margin-bottom: 2rem; }
.cw-404__search { max-width: 460px; margin-inline: auto 2.5rem; }
.cw-404__categories { margin-bottom: 2.5rem; }
.cw-404__categories-label { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--cw-color-text-muted); margin-bottom: 0.85rem; }
.cw-404__category-list { display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: center; }

/* == 31. Pages ================================================================ */
.cw-page { padding-block: 2rem 4rem; }
.cw-page__header { margin-bottom: 1.5rem; }
.cw-page__title { font-size: clamp(1.9rem, 3.5vw, 2.6rem); }
.cw-page__featured img { width: 100%; border-radius: var(--cw-radius-lg); margin-bottom: 1.75rem; aspect-ratio: 16/7; object-fit: cover; }
.cw-page__body { font-size: 1.05rem; line-height: 1.75; }
.cw-page__body > * + * { margin-top: 1.2em; }
.cw-page__body--wide { max-width: none; }

/* == 32. Footer =============================================================== */
.site-footer { background: var(--cw-ink); color: rgba(255,255,255,0.85); margin-top: 3rem; }
.cw-footer__top { display: grid; gap: 3rem; padding-block: 4rem 3rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .cw-footer__top { grid-template-columns: 280px 1fr; } }

.cw-footer__logo img, .cw-footer__logo .custom-logo { max-height: 40px; filter: brightness(0) invert(1); }
.cw-footer__wordmark { display: flex; align-items: center; gap: 0.5rem; font-family: var(--cw-font-display); font-weight: 800; font-size: 1.3rem; color: #fff; }
.cw-footer__wordmark-icon { color: var(--cw-color-accent); }
.cw-footer__tagline { font-size: 0.9rem; color: rgba(255,255,255,0.6); margin-block: 0.85rem 1.25rem; max-width: 32ch; }
.site-footer .cw-social-icons__link { background: rgba(255,255,255,0.08); color: #fff; }
.site-footer .cw-social-icons__link:hover { background: var(--cw-color-accent); color: var(--cw-ink); }

.cw-footer__widgets { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 480px) { .cw-footer__widgets { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 640px) {
	.cw-footer__widgets--cols-3 { grid-template-columns: repeat(3, 1fr); }
	.cw-footer__widgets--cols-4 { grid-template-columns: repeat(4, 1fr); }
}
.cw-footer__col .widget { background: none; border: none; padding: 0; }
.cw-footer__col .widget-title { color: #fff; font-size: 0.95rem; }
.cw-footer__col a { color: rgba(255,255,255,0.7); }
.cw-footer__col a:hover { color: var(--cw-color-accent); }
.cw-footer__col .cw-row-card + .cw-row-card { border-top-color: rgba(255,255,255,0.12); }
.cw-footer__col .widget_categories li, .cw-footer__col .widget_archive li, .cw-footer__col .widget_recent_entries li { border-bottom-color: rgba(255,255,255,0.12); }

.cw-footer__bottom { border-top: 1px solid rgba(255,255,255,0.12); }
.cw-footer__bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem 1.5rem; flex-wrap: wrap; padding-block: 1.5rem; font-size: 0.85rem; color: rgba(255,255,255,0.6); }
.cw-footer__nav-list { display: flex; gap: 0.25rem 0.5rem; flex-wrap: wrap; }
.cw-footer__nav-list a { display: inline-block; padding: 0.5em 0.6em; margin: -0.5em -0.6em; border-radius: 6px; transition: color var(--cw-transition), background-color var(--cw-transition); }
.cw-footer__nav-list a:hover { color: var(--cw-color-accent); background: rgba(255,255,255,0.06); }
@media (max-width: 639.98px) {
	.cw-footer__bottom-inner { flex-direction: column; text-align: center; justify-content: center; }
	.cw-footer__nav-list { justify-content: center; }
}

/* == 33. Back to top & sticky mobile ad ======================================= */
.cw-back-to-top {
	position: fixed; bottom: calc(1.5rem + var(--cw-bottom-stack-offset, 0px)); right: 1.5rem; width: 46px; height: 46px; border-radius: 50%;
	background: var(--cw-color-primary); color: #fff; display: flex; align-items: center; justify-content: center;
	box-shadow: 0 10px 30px -10px hsl(var(--cw-color-shadow) / 0.4); z-index: 60;
	opacity: 0; transform: translateY(10px); transition: opacity var(--cw-transition), transform var(--cw-transition), bottom var(--cw-transition);
	pointer-events: none;
}
.cw-back-to-top.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.cw-back-to-top[hidden] { display: none; }
.cw-back-to-top:hover { background: var(--cw-color-primary-strong); }

.cw-sticky-ad { position: fixed; bottom: 0; left: 0; right: 0; background: var(--cw-color-surface); border-top: 1px solid var(--cw-color-border); z-index: 70; padding: 0.6rem 2.5rem 0.6rem 0.85rem; box-shadow: 0 -10px 25px -15px hsl(var(--cw-color-shadow) / 0.3); }
.cw-sticky-ad__close { position: absolute; top: 0.4rem; right: 0.5rem; width: 26px; height: 26px; background: var(--cw-color-surface-tint); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.cw-sticky-ad__close .cw-icon { width: 13px; height: 13px; }
@media (min-width: 1024px) { .cw-sticky-ad { display: none; } }
.cw-sticky-ad[hidden] { display: none; }

/* == 34. Print ================================================================== */
@media print {
	.site-header, .cw-topbar, .cw-ticker, .site-footer, .cw-share, .cw-back-to-top,
	.cw-sticky-ad, .cw-ad-slot, .cw-progress-bar, .cw-load-more, .widget-area,
	.cw-toolbar, .cw-nav-scrim, #cw-search-overlay { display: none !important; }
	.cw-article__layout { grid-template-columns: 1fr !important; }
	body { background: #fff; color: #000; }
}