/* =========================================================================
   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);
}


/* == 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-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; }
}
/* HireLanz presentation layer */
:root{--hl-bg:#F7F9FC;--hl-surface:#FFFFFF;--hl-surface-soft:#F1F4F8;--hl-text:#172033;--hl-text-secondary:#64748B;--hl-border:#E2E8F0;--hl-primary:#1D4ED8;--hl-primary-hover:#1E40AF;--hl-success:#15803D;--hl-warning:#B45309;--hl-danger:#B91C1C;--cw-color-bg:var(--hl-bg);--cw-color-surface:var(--hl-surface);--cw-color-text:var(--hl-text);--cw-color-text-muted:var(--hl-text-secondary);--cw-color-border:var(--hl-border);--cw-color-primary:var(--hl-primary);--cw-color-primary-hover:var(--hl-primary-hover)}
html{background:var(--hl-bg)}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--hl-bg);color:var(--hl-text)}.container{width:min(1240px,calc(100% - 36px));margin-inline:auto}.site-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--hl-border);box-shadow:0 2px 10px rgba(23,32,51,.03);z-index:100}.site-header__inner{min-height:74px;gap:28px}.site-title{font-family:inherit;font-size:1.35rem;font-weight:800;letter-spacing:-.02em}.site-tagline{color:var(--hl-text-secondary)}.primary-menu{gap:4px}.primary-menu>li>a{font-size:.92rem;font-weight:650;border-radius:8px;padding:9px 10px}.primary-menu>li>a:hover{background:#f1f5f9;color:var(--hl-primary)}.cw-icon-btn{border-radius:9px}.site-main{min-height:60vh}.cw-card{background:#fff;border:1px solid var(--hl-border);border-radius:14px;box-shadow:0 5px 18px rgba(23,32,51,.045);overflow:hidden}.cw-card__media img{aspect-ratio:16/10;object-fit:cover}.cw-card__title{letter-spacing:-.02em}.cw-card__body{padding:18px}.cw-section-title{letter-spacing:-.025em}.cw-layout-with-sidebar__main{min-width:0}.widget-area .widget{background:#fff;border:1px solid var(--hl-border);border-radius:14px;padding:18px;box-shadow:0 5px 18px rgba(23,32,51,.04)}.widget-area .widget-title{font-size:1rem}.cw-table-wrap,.wp-block-table{overflow-x:auto}.cw-table-wrap table,.wp-block-table table{border-collapse:separate;border-spacing:0;width:100%;background:#fff;border:1px solid var(--hl-border);border-radius:12px;overflow:hidden}.cw-table-wrap th,.cw-table-wrap td,.wp-block-table th,.wp-block-table td{padding:12px 14px;border-bottom:1px solid var(--hl-border);text-align:left}.cw-table-wrap th,.wp-block-table th{background:#f8fafc;font-weight:750}.cw-table-wrap tr:last-child td,.wp-block-table tr:last-child td{border-bottom:0}.cw-page__body,.cw-single__content{font-size:18px;line-height:1.8}.cw-single__content h2,.cw-page__body h2{margin-top:2.2em;letter-spacing:-.02em}.cw-single__content h3,.cw-page__body h3{margin-top:1.8em}.cw-single__content img,.cw-page__body img{height:auto}.cw-single__content a,.cw-page__body a{color:var(--hl-primary)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(29,78,216,.2);outline-offset:2px}

/* ========================================================================
   HireLanz product homepage + refined global chrome
   ======================================================================== */
:root {
	--hl-bg: #f7f9fc;
	--hl-surface: #ffffff;
	--hl-surface-soft: #f1f5f9;
	--hl-text: #172033;
	--hl-muted: #64748b;
	--hl-border: #dfe6ef;
	--hl-primary: #1d4ed8;
	--hl-primary-dark: #1e3a8a;
	--hl-primary-soft: #eff6ff;
	--hl-accent: #f59e0b;
	--hl-radius: 18px;
	--hl-shadow-sm: 0 8px 24px rgba(23, 32, 51, .06);
	--hl-shadow: 0 18px 48px rgba(23, 32, 51, .09);
}

body {
	background: var(--hl-bg);
	color: var(--hl-text);
}

/* Header: transparent glass treatment, still restrained and readable. */
.hl-glass-header {
	background: rgba(255, 255, 255, .82);
	border-bottom: 1px solid rgba(203, 213, 225, .72);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .8);
	backdrop-filter: blur(16px) saturate(150%);
	-webkit-backdrop-filter: blur(16px) saturate(150%);
}
.hl-glass-header.is-scrolled {
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
}
.hl-glass-header .site-header__inner { min-height: 76px; }
.hl-glass-header .site-title {
	font-family: var(--cw-font-body);
	font-size: 1.28rem;
	font-weight: 850;
	letter-spacing: -.035em;
	color: var(--hl-text);
}
.hl-glass-header .site-title::after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-left: 5px;
	border-radius: 50%;
	background: var(--hl-primary);
	vertical-align: .05em;
}
.hl-glass-header .primary-menu > .menu-item > a { border-radius: 10px; }
.hl-glass-header .primary-menu > .menu-item > a:hover,
.hl-glass-header .primary-menu > .menu-item.current-menu-item > a {
	background: rgba(239, 246, 255, .9);
	color: var(--hl-primary);
}
.hl-glass-header .cw-icon-btn {
	border: 1px solid transparent;
	border-radius: 10px;
}
.hl-glass-header .cw-icon-btn:hover { background: rgba(241, 245, 249, .9); }

/* Homepage shell */
.hl-home { overflow: clip; }
.hl-home-hero {
	position: relative;
	padding: clamp(2.25rem, 5vw, 4.5rem) 0 1.25rem;
}
.hl-home-hero::before {
	content: '';
	position: absolute;
	inset: 0 0 auto;
	height: 620px;
	background:
		radial-gradient(circle at 78% 18%, rgba(59, 130, 246, .13), transparent 31%),
		radial-gradient(circle at 10% 12%, rgba(245, 158, 11, .08), transparent 28%),
		linear-gradient(180deg, #f7fbff 0%, #f7f9fc 100%);
	z-index: -1;
}
.hl-home-hero .container { position: relative; }
.hl-hero-panel {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 5rem);
	min-height: 540px;
	padding: clamp(2rem, 5vw, 4.75rem);
	border: 1px solid rgba(203, 213, 225, .82);
	border-radius: 28px;
	background: rgba(255,255,255,.86);
	box-shadow: 0 30px 90px rgba(30, 64, 175, .10);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}
.hl-hero-copy { position: relative; z-index: 2; }
.hl-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin-bottom: .8rem;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .105em;
	text-transform: uppercase;
	color: var(--hl-primary);
}
.hl-eyebrow::before {
	content: '';
	width: 18px;
	height: 2px;
	border-radius: 99px;
	background: var(--hl-primary);
}
.hl-hero-copy h1 {
	max-width: 760px;
	margin: 0;
	font-family: var(--cw-font-body);
	font-size: clamp(2.75rem, 5.2vw, 5rem);
	font-weight: 820;
	line-height: .99;
	letter-spacing: -.055em;
	color: #12203a;
}
.hl-hero-copy > p {
	max-width: 680px;
	margin: 1.35rem 0 0;
	font-size: clamp(1rem, 1.25vw, 1.18rem);
	line-height: 1.75;
	color: var(--hl-muted);
}
.hl-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.8rem; }
.hl-hero-actions .cw-btn { min-height: 50px; padding-inline: 1.15rem; border-radius: 12px; }
.hl-hero-actions .cw-btn .cw-icon { width: 17px; height: 17px; margin-left: .5rem; }
.hl-hero-trust {
	display: flex;
	flex-wrap: wrap;
	gap: .55rem 1rem;
	margin-top: 1.5rem;
	font-size: .82rem;
	font-weight: 650;
	color: #526176;
}
.hl-hero-trust span { display: inline-flex; align-items: center; gap: .35rem; }
.hl-hero-trust .cw-icon { width: 15px; height: 15px; color: #15803d; stroke-width: 2.5; }

/* Hero visual — deliberately a product preview, not a fake dashboard. */
.hl-hero-visual { position: relative; min-height: 400px; display: grid; place-items: center; }
.hl-hero-visual__glow {
	position: absolute;
	width: 78%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59,130,246,.19) 0%, rgba(59,130,246,.06) 43%, transparent 69%);
	filter: blur(2px);
}
.hl-tool-preview {
	position: relative;
	width: min(100%, 470px);
	padding: 1.2rem;
	border: 1px solid rgba(255,255,255,.92);
	border-radius: 22px;
	background: rgba(255,255,255,.72);
	box-shadow: 0 30px 70px rgba(30,64,175,.16), 0 2px 10px rgba(15,23,42,.06);
	backdrop-filter: blur(18px) saturate(150%);
	-webkit-backdrop-filter: blur(18px) saturate(150%);
	transform: rotate(1.2deg);
}
.hl-tool-preview::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(135deg, rgba(255,255,255,.55), transparent 55%);
	pointer-events: none;
}
.hl-tool-preview__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	padding: .45rem .35rem 1rem;
	border-bottom: 1px solid rgba(226,232,240,.85);
}
.hl-preview-kicker { display: block; margin-bottom: .28rem; font-size: .63rem; font-weight: 850; letter-spacing: .12em; color: #64748b; }
.hl-tool-preview__top strong { display: block; font-size: 1.02rem; letter-spacing: -.02em; }
.hl-preview-dot { width: 10px; height: 10px; margin-top: .25rem; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 5px rgba(34,197,94,.12); }
.hl-preview-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .7rem; padding-top: .8rem; }
.hl-preview-card {
	display: grid;
	grid-template-columns: 42px 1fr;
	grid-template-rows: auto auto;
	column-gap: .7rem;
	align-items: center;
	padding: .75rem;
	border: 1px solid #e6ebf2;
	border-radius: 14px;
	background: rgba(255,255,255,.78);
	transition: transform var(--cw-transition), border-color var(--cw-transition), box-shadow var(--cw-transition);
}
.hl-preview-card:hover { transform: translateY(-2px); border-color: #bfdbfe; box-shadow: 0 12px 26px rgba(30,64,175,.09); }
.hl-preview-card__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--hl-primary-soft); color: var(--hl-primary); }
.hl-preview-card__icon .cw-icon { width: 20px; height: 20px; }
.hl-preview-card strong { font-size: .88rem; line-height: 1.2; }
.hl-preview-card small { margin-top: .15rem; color: #718096; font-size: .72rem; }
.hl-preview-note { display: flex; align-items: flex-start; gap: .55rem; margin-top: .75rem; padding: .72rem .75rem; border-radius: 12px; background: #f8fafc; color: #64748b; font-size: .73rem; line-height: 1.5; }
.hl-preview-note .cw-icon { flex: 0 0 auto; width: 15px; height: 15px; color: #15803d; margin-top: .08rem; }

/* Topic shortcuts */
.hl-home-quick { padding: .85rem 0 2.3rem; }
.hl-quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--hl-border); border-radius: 18px; background: #fff; box-shadow: var(--hl-shadow-sm); overflow: hidden; }
.hl-quick-item { display: grid; grid-template-columns: 42px 1fr 18px; align-items: center; gap: .7rem; min-width: 0; padding: 1.05rem; border-right: 1px solid var(--hl-border); transition: background var(--cw-transition); }
.hl-quick-item:last-child { border-right: 0; }
.hl-quick-item:hover { background: #f8fbff; }
.hl-quick-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #f1f5f9; color: var(--hl-primary); }
.hl-quick-icon .cw-icon { width: 19px; height: 19px; }
.hl-quick-item strong, .hl-quick-item small { display: block; }
.hl-quick-item strong { font-size: .84rem; line-height: 1.25; }
.hl-quick-item small { margin-top: .2rem; color: #718096; font-size: .7rem; line-height: 1.35; }
.hl-quick-item > .cw-icon { width: 16px; height: 16px; color: #94a3b8; }

/* Homepage sections */
.hl-section { padding: clamp(4rem, 7vw, 6.4rem) 0; }
.hl-section--tools { background: #fff; border-top: 1px solid rgba(226,232,240,.75); border-bottom: 1px solid rgba(226,232,240,.75); }
.hl-section--soft { background: #f3f6fa; }
.hl-section--research { background: #fff; }
.hl-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.hl-section-head > div { max-width: 760px; }
.hl-section-head h2, .hl-method-head h2, .hl-cta-panel h2 {
	margin: 0;
	font-family: var(--cw-font-body);
	font-size: clamp(1.8rem, 3.2vw, 2.75rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.04em;
	color: #172033;
}
.hl-section-head p { max-width: 650px; margin: .75rem 0 0; color: var(--hl-muted); font-size: .98rem; line-height: 1.65; }
.hl-text-link { display: inline-flex; align-items: center; gap: .35rem; color: var(--hl-primary); font-weight: 750; font-size: .88rem; white-space: nowrap; }
.hl-text-link:hover { color: var(--hl-primary-dark); }
.hl-text-link .cw-icon { width: 15px; height: 15px; }

.hl-tool-grid--home { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.hl-tool-grid--home .hl-tool-card { height: 100%; padding: 1.35rem; border-radius: 16px; background: #fff; box-shadow: 0 7px 24px rgba(15,23,42,.045); }
.hl-tool-grid--home .hl-tool-card__icon { width: 44px; height: 44px; margin-bottom: 1rem; }
.hl-tool-grid--home .hl-tool-card h3 { font-size: 1.03rem; line-height: 1.3; }
.hl-tool-grid--home .hl-tool-card p { font-size: .84rem; line-height: 1.6; }

/* Three-step method section */
.hl-method-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.hl-method-head > div { max-width: 620px; }
.hl-method-head > p { max-width: 470px; margin: 0; color: var(--hl-muted); line-height: 1.7; }
.hl-method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.hl-method-card { position: relative; min-height: 230px; padding: 1.6rem; border: 1px solid var(--hl-border); border-radius: 18px; background: rgba(255,255,255,.86); box-shadow: 0 8px 26px rgba(15,23,42,.04); }
.hl-method-card > span { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-bottom: 1.15rem; border-radius: 10px; background: var(--hl-primary-soft); color: var(--hl-primary); font-size: .72rem; font-weight: 850; }
.hl-method-card h3 { margin: 0 0 .55rem; font-size: 1.08rem; letter-spacing: -.02em; }
.hl-method-card p { margin: 0 0 1rem; color: var(--hl-muted); font-size: .88rem; line-height: 1.65; }
.hl-method-card a { display: inline-flex; align-items: center; gap: .35rem; color: var(--hl-primary); font-size: .82rem; font-weight: 750; }
.hl-method-card a .cw-icon { width: 14px; height: 14px; }

/* Research cards */
.hl-research-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.hl-research-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--hl-border); border-radius: 18px; background: #fff; box-shadow: 0 8px 28px rgba(15,23,42,.045); }
.hl-research-card__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #eef2f7; }
.hl-research-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--cw-transition-slow); }
.hl-research-card:hover .hl-research-card__media img { transform: scale(1.035); }
.hl-research-card__placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: #94a3b8; background: linear-gradient(135deg, #f8fafc, #eef4fa); }
.hl-research-card__placeholder .cw-icon { width: 30px; height: 30px; }
.hl-research-card__body { display: flex; flex: 1; flex-direction: column; padding: 1.25rem; }
.hl-research-card__meta { margin-bottom: .55rem; color: #7b8798; font-size: .7rem; font-weight: 700; letter-spacing: .02em; }
.hl-research-card h3 { margin: 0 0 .55rem; font-size: 1.08rem; line-height: 1.35; letter-spacing: -.02em; }
.hl-research-card h3 a:hover { color: var(--hl-primary); }
.hl-research-card p { margin: 0 0 1rem; color: var(--hl-muted); font-size: .84rem; line-height: 1.62; }
.hl-research-card .hl-text-link { margin-top: auto; }

/* Closing CTA */
.hl-home-cta { padding: 3rem 0 5rem; background: #fff; }
.hl-cta-panel { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(1.7rem, 4vw, 2.8rem); border-radius: 24px; background: linear-gradient(135deg, #172f5f 0%, #1d4ed8 100%); color: #fff; box-shadow: 0 24px 60px rgba(30,64,175,.18); }
.hl-cta-panel .hl-eyebrow { color: #bfdbfe; }
.hl-cta-panel .hl-eyebrow::before { background: #93c5fd; }
.hl-cta-panel h2 { max-width: 720px; color: #fff; }
.hl-cta-panel p { max-width: 650px; margin: .7rem 0 0; color: rgba(255,255,255,.78); line-height: 1.65; }
.hl-cta-panel .cw-btn { flex: 0 0 auto; background: #fff; color: #173269; border-color: #fff; }
.hl-cta-panel .cw-btn:hover { background: #eff6ff; }

/* Footer: content-first, not dependent on widget configuration. */
.hl-site-footer { margin-top: 0; background: #101b2d; color: rgba(255,255,255,.78); }
.hl-footer-main { display: grid; grid-template-columns: minmax(240px, 1.55fr) repeat(3, minmax(150px, 1fr)); gap: 3rem; padding: 4.2rem 0 3.3rem; }
.hl-footer-brand__link { display: inline-flex; align-items: center; gap: .6rem; color: #fff; font-size: 1.18rem; font-weight: 850; letter-spacing: -.025em; }
.hl-footer-brand__mark { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; background: #2563eb; color: #fff; font-size: .78rem; }
.hl-footer-brand p { max-width: 310px; margin: 1rem 0 1.25rem; color: rgba(255,255,255,.58); font-size: .86rem; line-height: 1.7; }
.hl-footer-socials { display: flex; gap: .45rem; }
.hl-footer-socials .cw-social-icons__link { width: 34px; height: 34px; background: rgba(255,255,255,.08); color: #fff; }
.hl-footer-socials .cw-social-icons__link:hover { background: #2563eb; color: #fff; }
.hl-footer-column h2 { margin: .15rem 0 1rem; color: #fff; font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hl-footer-column ul { display: grid; gap: .55rem; }
.hl-footer-column li { font-size: .84rem; line-height: 1.45; }
.hl-footer-column a { color: rgba(255,255,255,.62); transition: color var(--cw-transition); }
.hl-footer-column a:hover { color: #fff; }
.hl-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 0 1.35rem; border-top: 1px solid rgba(255,255,255,.10); color: rgba(255,255,255,.46); font-size: .75rem; }
.hl-footer-bottom p { margin: 0; }
.hl-footer-bottom__links { display: flex; align-items: center; gap: .7rem; }
.hl-footer-bottom a { color: rgba(255,255,255,.58); }
.hl-footer-bottom a:hover { color: #fff; }

@media (max-width: 1080px) {
	.hl-hero-panel { grid-template-columns: minmax(0, 1fr) minmax(330px, .8fr); gap: 2rem; }
	.hl-tool-grid--home { grid-template-columns: repeat(2, 1fr); }
	.hl-footer-main { grid-template-columns: 1.4fr repeat(3, 1fr); gap: 2rem; }
}
@media (max-width: 900px) {
	.hl-hero-panel { grid-template-columns: 1fr; min-height: 0; }
	.hl-hero-visual { min-height: 350px; }
	.hl-quick-grid { grid-template-columns: repeat(2, 1fr); }
	.hl-quick-item:nth-child(2) { border-right: 0; }
	.hl-quick-item:nth-child(-n+2) { border-bottom: 1px solid var(--hl-border); }
	.hl-method-head { align-items: flex-start; flex-direction: column; }
	.hl-footer-main { grid-template-columns: 1.6fr 1fr 1fr; }
	.hl-footer-column:last-child { display: none; }
}
@media (max-width: 680px) {
	.hl-glass-header .site-header__inner { min-height: 66px; }
	.hl-home-hero { padding-top: 1.4rem; }
	.hl-hero-panel { padding: 1.5rem; border-radius: 22px; }
	.hl-hero-copy h1 { font-size: clamp(2.45rem, 12vw, 3.45rem); }
	.hl-hero-copy > p { font-size: .98rem; }
	.hl-hero-trust { display: grid; gap: .5rem; }
	.hl-hero-visual { min-height: 320px; }
	.hl-tool-preview { transform: none; }
	.hl-preview-grid { gap: .55rem; }
	.hl-preview-card { grid-template-columns: 34px 1fr; padding: .62rem; }
	.hl-preview-card__icon { width: 34px; height: 34px; border-radius: 9px; }
	.hl-quick-grid { grid-template-columns: 1fr; }
	.hl-quick-item { border-right: 0 !important; border-bottom: 1px solid var(--hl-border); }
	.hl-quick-item:last-child { border-bottom: 0; }
	.hl-section { padding: 3.3rem 0; }
	.hl-section-head { align-items: flex-start; flex-direction: column; gap: .85rem; }
	.hl-section-head h2, .hl-method-head h2, .hl-cta-panel h2 { font-size: 1.9rem; }
	.hl-tool-grid--home, .hl-method-grid, .hl-research-grid { grid-template-columns: 1fr; }
	.hl-method-card { min-height: 0; }
	.hl-cta-panel { align-items: flex-start; flex-direction: column; border-radius: 20px; }
	.hl-cta-panel .cw-btn { width: 100%; }
	.hl-footer-main { grid-template-columns: 1fr 1fr; gap: 2.2rem 1.5rem; padding: 3.2rem 0 2.4rem; }
	.hl-footer-brand { grid-column: 1 / -1; }
	.hl-footer-column:last-child { display: block; }
	.hl-footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 420px) {
	.hl-footer-main { grid-template-columns: 1fr; }
	.hl-footer-column:last-child { display: none; }
	.hl-hero-actions .cw-btn { width: 100%; }
}

/* ========================================================================
   HireLanz UI refinement pass — tighter viewport framing + product polish
   Inspired by documented design-system patterns: 4/8px spacing rhythm,
   12-column/1200–1320px content grids, generous section breathing room,
   restrained glass chrome, and single-surface cards.
   ======================================================================== */
:root {
	--hl-page-gutter: 24px;
	--hl-container-refined: 1320px;
	--hl-space-1: 4px;
	--hl-space-2: 8px;
	--hl-space-3: 12px;
	--hl-space-4: 16px;
	--hl-space-5: 24px;
	--hl-space-6: 32px;
	--hl-space-7: 48px;
	--hl-space-8: 64px;
	--hl-space-9: 80px;
}

.container,
.site-header__inner,
.cw-search-overlay__inner {
	width: min(var(--hl-container-refined), calc(100% - (2 * var(--hl-page-gutter))));
	max-width: var(--hl-container-refined);
}

/* A little more useful width without letting text become excessively long. */
.hl-section > .container,
.hl-home-quick > .container,
.hl-home-cta > .container,
.hl-home-hero > .container {
	width: min(var(--hl-container-refined), calc(100% - (2 * var(--hl-page-gutter))));
}

/* Glass chrome: visible but deliberately quieter than a floating app dashboard. */
.hl-glass-header {
	background: rgba(255, 255, 255, .78);
	border-bottom-color: rgba(203, 213, 225, .64);
	box-shadow: 0 1px 0 rgba(255,255,255,.9), 0 8px 28px rgba(15,23,42,.035);
	backdrop-filter: blur(20px) saturate(145%);
	-webkit-backdrop-filter: blur(20px) saturate(145%);
}
.hl-glass-header .site-header__inner { min-height: 72px; }
.hl-glass-header .primary-menu { gap: 2px; }
.hl-glass-header .primary-menu > .menu-item > a {
	padding: 9px 12px;
	border: 1px solid transparent;
}
.hl-glass-header .primary-menu > .menu-item > a:hover,
.hl-glass-header .primary-menu > .menu-item.current-menu-item > a {
	background: rgba(255,255,255,.82);
	border-color: rgba(203,213,225,.65);
	box-shadow: 0 2px 8px rgba(15,23,42,.035);
}
.hl-glass-header .cw-icon-btn {
	width: 40px;
	height: 40px;
	background: rgba(255,255,255,.42);
	border-color: rgba(203,213,225,.56);
}

/* Homepage: use the available viewport rather than leaving a narrow island in
   the middle of a wide desktop screen. */
.hl-home-hero {
	padding: clamp(2rem, 4vw, 3.5rem) 0 1.5rem;
}
.hl-home-hero::before {
	height: 680px;
	background:
		radial-gradient(circle at 78% 16%, rgba(59,130,246,.12), transparent 30%),
		radial-gradient(circle at 16% 4%, rgba(245,158,11,.07), transparent 24%),
		linear-gradient(180deg, #f8fbff 0%, #f7f9fc 78%, rgba(247,249,252,0) 100%);
}
.hl-hero-panel {
	grid-template-columns: minmax(0, 1.02fr) minmax(430px, .98fr);
	gap: clamp(2rem, 4vw, 4.5rem);
	min-height: 510px;
	padding: clamp(2rem, 4.4vw, 4rem);
	border-radius: 30px;
	border-color: rgba(203,213,225,.74);
	background: rgba(255,255,255,.82);
	box-shadow: 0 28px 80px rgba(30,64,175,.085), 0 2px 10px rgba(15,23,42,.035);
}
.hl-hero-panel::after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	width: 38%;
	height: 100%;
	border-radius: 0 30px 30px 0;
	background-image: radial-gradient(rgba(29,78,216,.12) 1px, transparent 1px);
	background-size: 18px 18px;
	mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.45) 40%, #000 100%);
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.45) 40%, #000 100%);
	pointer-events: none;
}
.hl-hero-copy h1 {
	max-width: 700px;
	font-size: clamp(2.8rem, 5vw, 4.7rem);
	line-height: 1.01;
}
.hl-hero-copy > p { max-width: 650px; }
.hl-hero-actions { margin-top: 1.55rem; }
.hl-hero-trust { margin-top: 1.25rem; }
.hl-hero-trust span {
	padding: 6px 9px;
	border: 1px solid rgba(226,232,240,.88);
	border-radius: 999px;
	background: rgba(255,255,255,.62);
}

.hl-hero-visual { min-height: 380px; z-index: 1; }
.hl-tool-preview {
	width: min(100%, 520px);
	padding: 1.05rem;
	border-radius: 24px;
	background: rgba(255,255,255,.88);
	box-shadow: 0 28px 60px rgba(30,64,175,.13), 0 2px 8px rgba(15,23,42,.045);
	transform: rotate(.7deg);
}
.hl-tool-preview__top { padding-inline: .5rem; }
.hl-preview-grid { gap: 10px; padding-top: 10px; }
.hl-preview-card {
	min-height: 76px;
	padding: .72rem;
	border-radius: 14px;
	background: #fff;
}
.hl-preview-card__icon {
	background: #f3f7ff;
	border: 1px solid #e0eaff;
}
.hl-preview-note {
	margin-top: 10px;
	border-radius: 12px;
	background: #f8fafc;
}

/* Topic rail becomes four equal product-entry points instead of a compressed
   strip. */
.hl-home-quick { padding: 1rem 0 3rem; }
.hl-quick-grid {
	grid-template-columns: repeat(4, minmax(0,1fr));
	border-radius: 20px;
	box-shadow: 0 10px 30px rgba(15,23,42,.045);
}
.hl-quick-item {
	min-height: 92px;
	padding: 1.15rem 1.25rem;
	grid-template-columns: 44px minmax(0,1fr) 18px;
}
.hl-quick-item strong { font-size: .88rem; }
.hl-quick-item small { font-size: .73rem; }
.hl-quick-icon {
	width: 44px;
	height: 44px;
	border: 1px solid #e5ebf4;
	background: #f8fafc;
}

/* Stronger section rhythm based on 64–80px major gaps. */
.hl-section { padding: clamp(4.5rem, 7vw, 6.8rem) 0; }
.hl-section-head { margin-bottom: 2.35rem; }
.hl-section-head h2,
.hl-method-head h2,
.hl-cta-panel h2 {
	font-size: clamp(1.95rem, 3vw, 2.7rem);
}

/* Featured tools: a clearer product shelf with a hero card and three compact
   supporting cards. No fake usage metrics or social proof. */
.hl-tool-grid--home {
	grid-template-columns: repeat(4, minmax(0,1fr));
	gap: 14px;
	align-items: stretch;
}
.hl-tool-grid--home .hl-tool-card {
	position: relative;
	padding: 1.5rem;
	border-radius: 18px;
	border-color: #e2e8f0;
	box-shadow: 0 7px 24px rgba(15,23,42,.04);
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.hl-tool-grid--home .hl-tool-card:hover {
	transform: translateY(-3px);
	border-color: #c7d7f4;
	box-shadow: 0 18px 38px rgba(30,64,175,.09);
}
.hl-tool-grid--home .hl-tool-card:first-child {
	grid-column: span 2;
	background: linear-gradient(145deg,#ffffff 0%,#f7fbff 100%);
	border-color: #d6e2f5;
}
.hl-tool-grid--home .hl-tool-card:first-child .hl-tool-card__icon {
	width: 50px;
	height: 50px;
}
.hl-tool-grid--home .hl-tool-card:first-child h3 { font-size: 1.28rem; }
.hl-tool-grid--home .hl-tool-card:first-child p { max-width: 560px; }
.hl-tool-grid--home .hl-tool-card__icon { border: 1px solid #e0eaff; }

/* The workflow section gets a more editorial, connected treatment. */
.hl-section--soft {
	background: #f3f6fa;
	border-top: 1px solid #e8edf4;
	border-bottom: 1px solid #e8edf4;
}
.hl-method-grid { gap: 14px; }
.hl-method-card {
	min-height: 250px;
	padding: 1.75rem;
	border-radius: 20px;
	box-shadow: 0 8px 26px rgba(15,23,42,.035);
}
.hl-method-card::after {
	content: '';
	position: absolute;
	left: 1.75rem;
	right: 1.75rem;
	bottom: 0;
	height: 3px;
	border-radius: 3px 3px 0 0;
	background: linear-gradient(90deg, #1d4ed8, #60a5fa);
	opacity: .65;
}

/* Research shelf: slightly more editorial and less like generic SaaS cards. */
.hl-research-grid { gap: 14px; }
.hl-research-card {
	border-radius: 20px;
	box-shadow: 0 8px 28px rgba(15,23,42,.04);
}
.hl-research-card__body { padding: 1.4rem; }

/* CTA should feel like a destination, not another oversized box. */
.hl-home-cta { padding: 4rem 0 5.5rem; }
.hl-cta-panel {
	min-height: 190px;
	padding: clamp(2rem, 4vw, 3rem);
	border-radius: 26px;
	background: linear-gradient(135deg, #172f5f 0%, #1d4ed8 72%, #2563eb 100%);
	box-shadow: 0 24px 60px rgba(30,64,175,.15);
}

/* Footer refinement: wider brand area, cleaner link columns, and a quieter
   legal bar so it doesn't look like a separate unrelated template. */
.hl-site-footer {
	border-top: 1px solid rgba(255,255,255,.08);
}
.hl-footer-main {
	grid-template-columns: minmax(300px,1.65fr) repeat(3,minmax(150px,1fr));
	gap: clamp(2rem,4vw,4rem);
	padding: 4.5rem 0 3.5rem;
}
.hl-footer-column ul { gap: .7rem; }
.hl-footer-column li { font-size: .85rem; }
.hl-footer-bottom { padding-top: 1.35rem; padding-bottom: 1.5rem; }

@media (max-width: 1180px) {
	.hl-hero-panel { grid-template-columns: minmax(0,1fr) minmax(360px,.86fr); }
	.hl-tool-grid--home .hl-tool-card:first-child { grid-column: span 2; }
}
@media (max-width: 900px) {
	:root { --hl-page-gutter: 20px; }
	.hl-hero-panel { grid-template-columns: 1fr; }
	.hl-hero-visual { min-height: 340px; }
	.hl-tool-grid--home { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.hl-tool-grid--home .hl-tool-card:first-child { grid-column: span 2; }
	.hl-footer-main { grid-template-columns: 1.5fr 1fr 1fr; }
}
@media (max-width: 680px) {
	:root { --hl-page-gutter: 16px; }
	.container,
	.site-header__inner,
	.cw-search-overlay__inner,
	.hl-section > .container,
	.hl-home-quick > .container,
	.hl-home-cta > .container,
	.hl-home-hero > .container {
		width: min(var(--hl-container-refined), calc(100% - (2 * var(--hl-page-gutter))));
	}
	.hl-home-hero { padding-top: 1.2rem; }
	.hl-hero-panel {
		padding: 1.4rem;
		border-radius: 22px;
	}
	.hl-hero-panel::after { width: 55%; border-radius: 0 22px 22px 0; opacity: .55; }
	.hl-hero-copy h1 { font-size: clamp(2.35rem, 12vw, 3.35rem); }
	.hl-hero-trust { gap: .45rem; }
	.hl-hero-trust span { font-size: .75rem; }
	.hl-hero-visual { min-height: 300px; }
	.hl-tool-preview { transform: none; }
	.hl-tool-grid--home,
	.hl-tool-grid--home .hl-tool-card:first-child { grid-template-columns: 1fr; grid-column: auto; }
	.hl-tool-grid--home .hl-tool-card:first-child { grid-column: auto; }
	.hl-section { padding: 3.7rem 0; }
	.hl-home-cta { padding: 3rem 0 4rem; }
	.hl-footer-main { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
	.hl-footer-main { grid-template-columns: 1fr; }
}

/* ========================================================================
   HireLanz 2.3 — final design-engineering pass
   Principles applied from UI Skills / TypeUI references:
   - consistent 4/8/12/16/24/32 rhythm
   - stronger visual hierarchy and grouping through spacing
   - disciplined content width and readable text measures
   - predictable responsive behavior
   - restrained borders/shadows and visible focus states
   ======================================================================== */
:root {
	--hl-page-gutter: clamp(18px, 2.4vw, 36px);
	--hl-container-final: 1360px;
	--hl-space-1: 4px;
	--hl-space-2: 8px;
	--hl-space-3: 12px;
	--hl-space-4: 16px;
	--hl-space-5: 24px;
	--hl-space-6: 32px;
	--hl-space-7: 48px;
	--hl-space-8: 64px;
	--hl-space-9: 80px;
	--hl-shadow-soft: 0 8px 28px rgba(15, 23, 42, .055);
	--hl-shadow-lift: 0 20px 50px rgba(30, 64, 175, .10);
}

html, body { max-width: 100%; }
body { min-width: 320px; }

/* One global container rule keeps every major template aligned to the same
   invisible vertical rails. */
.container,
.site-header__inner,
.cw-search-overlay__inner,
.cw-article__header,
.cw-article__layout,
.hl-section > .container,
.hl-home-hero > .container,
.hl-home-quick > .container,
.hl-home-cta > .container,
.hl-tool-page {
	width: min(var(--hl-container-final), calc(100% - (2 * var(--hl-page-gutter))));
	max-width: var(--hl-container-final);
	margin-inline: auto;
}

.container--narrow {
	width: min(820px, calc(100% - (2 * var(--hl-page-gutter))));
	max-width: 820px;
	margin-inline: auto;
}

/* Header alignment and glass treatment. */
.site-header__inner {
	min-height: 72px;
	padding-inline: 0;
}
.hl-glass-header {
	background: rgba(255,255,255,.76);
	border-bottom: 1px solid rgba(203,213,225,.62);
	box-shadow: 0 1px 0 rgba(255,255,255,.85), 0 8px 26px rgba(15,23,42,.035);
	backdrop-filter: blur(22px) saturate(150%);
	-webkit-backdrop-filter: blur(22px) saturate(150%);
}
.hl-glass-header.is-scrolled {
	background: rgba(255,255,255,.93);
	box-shadow: 0 12px 30px rgba(15,23,42,.08);
}
.hl-glass-header .primary-menu { gap: 4px; }
.hl-glass-header .primary-menu > .menu-item > a {
	padding: 9px 12px;
	border: 1px solid transparent;
	border-radius: 10px;
}
.hl-glass-header .primary-menu > .menu-item > a:hover,
.hl-glass-header .primary-menu > .menu-item.current-menu-item > a {
	background: rgba(239,246,255,.88);
	border-color: rgba(191,219,254,.65);
	color: var(--hl-primary);
}

/* ========================================================================
   New hero: asymmetric editorial/product composition instead of a generic
   two-column SaaS banner.
   ======================================================================== */
.hl-home-hero {
	position: relative;
	padding: clamp(32px, 5vw, 72px) 0 clamp(24px, 3vw, 40px);
	isolation: isolate;
}
.hl-home-hero::before {
	height: 760px;
	background:
		radial-gradient(circle at 82% 14%, rgba(37,99,235,.13), transparent 27%),
		radial-gradient(circle at 8% 4%, rgba(245,158,11,.075), transparent 22%),
		linear-gradient(180deg, #f8fbff 0%, #f7f9fc 72%, rgba(247,249,252,0) 100%);
}
.hl-hero-shell {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
	align-items: center;
	gap: clamp(36px, 6vw, 92px);
	min-height: 570px;
	padding: clamp(40px, 5vw, 76px);
	border: 1px solid rgba(203,213,225,.78);
	border-radius: 32px;
	background: rgba(255,255,255,.79);
	box-shadow: 0 32px 90px rgba(30,64,175,.09), 0 2px 10px rgba(15,23,42,.035);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	overflow: hidden;
}
.hl-hero-shell::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 42%;
	background: linear-gradient(90deg, rgba(239,246,255,.72), rgba(255,255,255,0));
	pointer-events: none;
}
.hl-hero-copy { position: relative; z-index: 2; min-width: 0; }
.hl-hero-kicker {
	display: flex;
	align-items: center;
	gap: 9px;
	margin-bottom: 20px;
	color: #475569;
	font-size: 12px;
	font-weight: 750;
	letter-spacing: .07em;
	text-transform: uppercase;
}
.hl-hero-kicker__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--hl-primary);
	box-shadow: 0 0 0 5px rgba(29,78,216,.09);
	flex: 0 0 auto;
}
.hl-hero-kicker__line { width: 34px; height: 1px; background: #cbd5e1; }
.hl-hero-copy h1 {
	max-width: 700px;
	font-family: var(--cw-font-body);
	font-size: clamp(44px, 5.4vw, 76px);
	font-weight: 780;
	line-height: .99;
	letter-spacing: -.055em;
	text-wrap: balance;
	color: #14213d;
}
.hl-hero-copy h1 span {
	color: var(--hl-primary);
}
.hl-hero-copy > p {
	max-width: 640px;
	margin: 24px 0 0;
	font-size: clamp(17px, 1.5vw, 20px);
	line-height: 1.65;
	color: #526174;
	text-wrap: pretty;
}
.hl-hero-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 28px;
}
.hl-hero-actions .cw-btn--primary {
	min-height: 52px;
	padding-inline: 20px;
	border-radius: 12px;
	box-shadow: 0 10px 24px rgba(29,78,216,.18);
}
.hl-hero-secondary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 4px;
	color: #334155;
	font-size: 14px;
	font-weight: 700;
}
.hl-hero-secondary .cw-icon { width: 16px; height: 16px; transition: transform .2s ease; }
.hl-hero-secondary:hover { color: var(--hl-primary); }
.hl-hero-secondary:hover .cw-icon { transform: translateX(3px); }
.hl-hero-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin-top: 26px;
	color: #64748b;
	font-size: 12px;
}
.hl-hero-meta span { display: inline-flex; align-items: center; gap: 6px; }
.hl-hero-meta .cw-icon { width: 14px; height: 14px; color: #15803d; stroke-width: 2.5; }

/* Hero workspace illustration. It is intentionally illustrative and contains
   no fabricated metrics or claims. */
.hl-hero-stage {
	position: relative;
	min-height: 470px;
	display: grid;
	place-items: center;
	z-index: 1;
}
.hl-hero-orbit {
	position: absolute;
	border: 1px solid rgba(147,197,253,.35);
	border-radius: 50%;
	pointer-events: none;
}
.hl-hero-orbit--one { width: 520px; height: 520px; }
.hl-hero-orbit--two { width: 410px; height: 410px; border-color: rgba(191,219,254,.48); }
.hl-decision-board {
	position: relative;
	width: min(100%, 600px);
	border: 1px solid #dbe5f2;
	border-radius: 22px;
	background: rgba(255,255,255,.96);
	box-shadow: 0 28px 70px rgba(30,64,175,.13), 0 3px 12px rgba(15,23,42,.05);
	transform: rotate(.4deg);
	overflow: hidden;
}
.hl-decision-board__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 11px 15px;
	border-bottom: 1px solid #edf1f6;
	color: #94a3b8;
	font-size: 10px;
	font-weight: 750;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.hl-decision-board__bar > div { display: flex; gap: 5px; }
.hl-window-dot { width: 6px; height: 6px; border-radius: 50%; background: #cbd5e1; }
.hl-decision-board__body { padding: 22px; }
.hl-decision-heading { display: grid; gap: 7px; margin-bottom: 18px; }
.hl-decision-heading strong { font-size: 19px; letter-spacing: -.025em; color: #172033; }
.hl-decision-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.hl-decision-card {
	position: relative;
	min-height: 118px;
	padding: 16px;
	border: 1px solid #e4eaf2;
	border-radius: 15px;
	background: #fff;
	box-shadow: 0 4px 14px rgba(15,23,42,.025);
}
.hl-decision-card--wide { grid-column: span 2; min-height: 100px; }
.hl-decision-card--soft { background: linear-gradient(135deg,#f8fbff,#f3f7ff); border-color: #d8e5fa; }
.hl-decision-label { display: block; margin-bottom: 8px; color: #1d4ed8; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hl-decision-card strong { display: block; max-width: 80%; color: #172033; font-size: 14px; letter-spacing: -.015em; }
.hl-decision-card small { display: block; margin-top: 5px; color: #64748b; font-size: 11px; line-height: 1.4; }
.hl-decision-arrow, .hl-decision-mini, .hl-decision-check { position: absolute; right: 14px; top: 15px; }
.hl-decision-arrow { color: #2563eb; font-size: 18px; }
.hl-decision-mini { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; background: #eff6ff; color: #2563eb; font-size: 10px; font-weight: 800; }
.hl-decision-check { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: #dcfce7; color: #15803d; }
.hl-decision-check .cw-icon { width: 15px; height: 15px; stroke-width: 2.5; }
.hl-decision-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 15px;
	padding-top: 13px;
	border-top: 1px solid #edf1f6;
	color: #7b8797;
	font-size: 10px;
}
.hl-decision-footer span { display: inline-flex; align-items: center; gap: 6px; }
.hl-decision-footer i { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; }
.hl-float-card {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 13px;
	border: 1px solid rgba(203,213,225,.82);
	border-radius: 13px;
	background: rgba(255,255,255,.94);
	box-shadow: 0 14px 35px rgba(15,23,42,.09);
	backdrop-filter: blur(10px);
}
.hl-float-card--top { top: 45px; right: -6px; }
.hl-float-card--bottom { bottom: 48px; left: -8px; }
.hl-float-card__icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #eff6ff; color: #2563eb; }
.hl-float-card__icon .cw-icon { width: 15px; height: 15px; }
.hl-float-card b, .hl-float-card small { display: block; }
.hl-float-card b { color: #172033; font-size: 11px; }
.hl-float-card small { margin-top: 2px; color: #7b8797; font-size: 9px; }

/* Home section rhythm and product shelves. */
.hl-home-quick { padding: 8px 0 48px; }
.hl-quick-grid { border-radius: 20px; box-shadow: var(--hl-shadow-soft); }
.hl-quick-item { min-height: 96px; padding: 18px 20px; }
.hl-section { padding: clamp(64px, 7vw, 96px) 0; }
.hl-section-head { gap: 32px; margin-bottom: 32px; }
.hl-section-head h2, .hl-method-head h2, .hl-cta-panel h2 { text-wrap: balance; }
.hl-section-head p { max-width: 680px; line-height: 1.7; }
.hl-tool-grid--home { gap: 16px; }
.hl-tool-grid--home .hl-tool-card { min-width: 0; }
.hl-method-grid, .hl-research-grid { gap: 16px; }
.hl-method-card, .hl-research-card { min-width: 0; }
.hl-home-cta { padding: 48px 0 80px; }

/* Global editorial pages: consistent rails, comfortable measures, and less
   accidental whitespace between header/content/sidebar/footer. */
.cw-archive-header { padding-block: 56px 36px; }
.cw-archive-header__title { text-wrap: balance; }
.cw-layout-with-sidebar { gap: 40px; padding-block: 0 72px; }
.cw-article__header { padding-top: 56px; }
.cw-article__featured { margin-top: 28px; }
.cw-article__layout { gap: 40px; padding-top: 40px; padding-bottom: 72px; }
.cw-page__header { padding-top: 56px; }
.cw-page__body { padding-bottom: 72px; }
.cw-card-grid { gap: 16px; }
.cw-toolbar { margin-block: 24px; }

/* Tool pages and archive use the same alignment rails as the homepage. */
.hl-tool-page { padding-top: 40px; padding-bottom: 80px; }
.hl-tool-header { margin-bottom: 28px; }
.hl-tool-workspace { gap: 24px; }
.hl-tool-main-card, .hl-tool-aside .hl-info-card { border-radius: 18px; }
.hl-related-tools { padding-top: 72px; }

/* Footer keeps the same horizontal rails and visual density as the body. */
.hl-footer-main { padding-top: 64px; padding-bottom: 48px; }
.hl-footer-bottom { min-height: 58px; }

/* Better touch targets / focus / reduced-motion safety. */
.hl-glass-header a, .hl-glass-header button { min-height: 40px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 3px solid rgba(29,78,216,.25);
	outline-offset: 3px;
}

@media (max-width: 1100px) {
	.hl-hero-shell { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 36px; padding: 44px; }
	.hl-hero-copy h1 { font-size: clamp(42px, 5.8vw, 62px); }
	.hl-float-card--top { right: 0; }
	.hl-float-card--bottom { left: 0; }
}

@media (max-width: 900px) {
	:root { --hl-page-gutter: 22px; }
	.hl-hero-shell { grid-template-columns: 1fr; gap: 28px; padding: 44px; }
	.hl-hero-stage { min-height: 450px; }
	.hl-hero-copy h1 { max-width: 760px; font-size: clamp(42px, 8vw, 64px); }
	.hl-hero-copy > p { max-width: 720px; }
	.hl-tool-grid--home { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.hl-tool-grid--home .hl-tool-card:first-child { grid-column: span 2; }
	.hl-footer-main { grid-template-columns: 1.4fr 1fr 1fr; }
}

@media (max-width: 680px) {
	:root { --hl-page-gutter: 16px; }
	.site-header__inner { min-height: 64px; }
	.hl-home-hero { padding-top: 20px; }
	.hl-hero-shell { padding: 28px 20px 24px; border-radius: 24px; }
	.hl-hero-kicker { font-size: 10px; letter-spacing: .055em; }
	.hl-hero-copy h1 { font-size: clamp(38px, 12vw, 52px); letter-spacing: -.045em; }
	.hl-hero-copy > p { margin-top: 18px; font-size: 16px; line-height: 1.6; }
	.hl-hero-actions { margin-top: 22px; gap: 10px; }
	.hl-hero-actions .cw-btn--primary { width: 100%; justify-content: center; }
	.hl-hero-secondary { justify-content: center; width: 100%; }
	.hl-hero-meta { margin-top: 20px; gap: 8px 14px; }
	.hl-hero-stage { min-height: 390px; margin-top: 2px; }
	.hl-hero-orbit--one { width: 350px; height: 350px; }
	.hl-hero-orbit--two { width: 280px; height: 280px; }
	.hl-decision-board { width: 100%; border-radius: 18px; transform: none; }
	.hl-decision-board__body { padding: 16px; }
	.hl-decision-grid { gap: 8px; }
	.hl-decision-card { min-height: 104px; padding: 13px; }
	.hl-decision-card--wide { min-height: 94px; }
	.hl-decision-footer { align-items: flex-start; flex-direction: column; }
	.hl-float-card--top { top: 12px; right: 2px; }
	.hl-float-card--bottom { bottom: 8px; left: 2px; }
	.hl-home-quick { padding-bottom: 32px; }
	.hl-section { padding: 52px 0; }
	.hl-section-head { margin-bottom: 24px; }
	.hl-section-head h2, .hl-method-head h2, .hl-cta-panel h2 { font-size: 30px; }
	.hl-tool-grid--home { grid-template-columns: 1fr; }
	.hl-tool-grid--home .hl-tool-card:first-child { grid-column: auto; }
	.cw-archive-header, .cw-article__header, .cw-page__header { padding-top: 40px; }
	.cw-layout-with-sidebar { gap: 24px; padding-bottom: 52px; }
	.cw-article__layout { padding-top: 28px; padding-bottom: 52px; }
	.cw-page__body { padding-bottom: 52px; }
	.hl-tool-page { padding-top: 28px; padding-bottom: 56px; }
	.hl-related-tools { padding-top: 52px; }
	.hl-footer-main { grid-template-columns: 1fr 1fr; gap: 32px 22px; padding: 48px 0 36px; }
	.hl-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
	.hl-decision-grid { grid-template-columns: 1fr; }
	.hl-decision-card--wide { grid-column: auto; }
	.hl-float-card { transform: scale(.92); transform-origin: center; }
	.hl-float-card--top { right: -6px; }
	.hl-float-card--bottom { left: -6px; }
	.hl-footer-main { grid-template-columns: 1fr; }
	.hl-footer-brand { grid-column: auto; }
}

/* ========================================================================
   HireLanz 2.4 — visual correction pass
   Fixes: WordPress admin-bar sticky offset, hero density/alignment, icon
   sizing, and a consistent desktop/mobile content rail.
   ======================================================================== */

/* Never let the sticky header sit underneath the WordPress admin bar. */
body.admin-bar .site-header--sticky { top: 32px; }
@media (max-width: 782px) {
	body.admin-bar .site-header--sticky { top: 46px; }
}

/* One clear horizontal rail. At desktop it uses almost the full viewport
   while retaining a deliberate minimum gutter. */
:root {
	--hl-page-gutter: clamp(20px, 2.6vw, 40px);
	--hl-container-final: 1400px;
}
.container,
.site-header__inner,
.cw-search-overlay__inner,
.hl-home-hero > .container,
.hl-home-quick > .container,
.hl-section > .container,
.hl-home-cta > .container {
	width: min(var(--hl-container-final), calc(100% - (2 * var(--hl-page-gutter))));
	max-width: var(--hl-container-final);
}

/* Hero: remove the heavy rounded SaaS box. The section itself carries the
   visual treatment, so the content can use the full available width. */
.hl-home-hero {
	padding: clamp(30px, 4vw, 58px) 0 clamp(26px, 3vw, 44px);
	background:
		radial-gradient(circle at 83% 22%, rgba(37,99,235,.10), transparent 28%),
		radial-gradient(circle at 12% 12%, rgba(245,158,11,.055), transparent 23%),
		linear-gradient(180deg, #f8fbff 0%, #f7f9fc 100%);
}
.hl-home-hero::before { display: none; }
.hl-hero-shell {
	grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
	gap: clamp(38px, 5vw, 72px);
	min-height: 520px;
	padding: clamp(26px, 3vw, 44px) 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	overflow: visible;
}
.hl-hero-shell::before {
	left: 48%;
	width: 52%;
	border-radius: 0;
	background: linear-gradient(90deg, rgba(239,246,255,0), rgba(239,246,255,.5));
}
.hl-hero-copy { padding-right: clamp(0px, 2vw, 24px); }
.hl-hero-copy h1 {
	max-width: 680px;
	font-size: clamp(46px, 5.1vw, 78px);
	line-height: .98;
}
.hl-hero-copy > p { max-width: 600px; }
.hl-hero-stage { min-height: 500px; }
.hl-decision-board {
	width: min(100%, 650px);
	transform: rotate(0deg);
	box-shadow: 0 24px 60px rgba(30,64,175,.12), 0 3px 12px rgba(15,23,42,.045);
}
.hl-decision-board__body { padding: 24px; }
.hl-decision-heading strong { font-size: 21px; }
.hl-decision-card { min-height: 126px; padding: 18px; }
.hl-decision-card--wide { min-height: 106px; }
.hl-decision-card strong { font-size: 16px; }
.hl-decision-card small { font-size: 13px; }
.hl-decision-label { font-size: 11px; }
.hl-decision-mini { width: 28px; height: 28px; font-size: 11px; }
.hl-decision-arrow { font-size: 20px; }
.hl-float-card { padding: 12px 15px; border-radius: 14px; }
.hl-float-card b { font-size: 13px; }
.hl-float-card small { font-size: 11px; }
.hl-float-card__icon { width: 34px; height: 34px; }

/* The topic rail should feel like four useful entry points, not four tiny
   links squeezed into a strip. */
.hl-home-quick { padding: 0 0 clamp(42px, 5vw, 64px); }
.hl-quick-grid { border-radius: 16px; }
.hl-quick-item { min-height: 104px; padding: 20px 22px; gap: 14px; }
.hl-quick-item strong { font-size: .98rem; line-height: 1.35; }
.hl-quick-item small { font-size: .78rem; line-height: 1.45; }
.hl-quick-icon { width: 48px; height: 48px; border-radius: 13px; }
.hl-quick-icon .cw-icon { width: 21px; height: 21px; }

/* Tool shelves: readable cards with a deliberate icon/title scale. */
.hl-tool-grid--home .hl-tool-card { padding: 22px; }
.hl-tool-grid--home .hl-tool-card__icon {
	width: 52px;
	height: 52px;
	margin-bottom: 18px;
	border-radius: 13px;
}
.hl-tool-grid--home .hl-tool-card__icon .cw-icon { width: 22px; height: 22px; }
.hl-tool-grid--home .hl-tool-card h3 { font-size: 1.16rem; }
.hl-tool-grid--home .hl-tool-card p { font-size: .94rem; line-height: 1.65; }

/* Front-end tool icons must be SVGs, never unstyled admin Dashicons. */
.hl-tool-card__icon .cw-icon,
.hl-tool-header__icon .cw-icon { width: 23px; height: 23px; }
.hl-tool-header__icon { display: grid; place-items: center; }

/* Consistent editorial page measures. */
.cw-single__content,
.cw-page__body { max-width: 780px; }
.cw-card-grid { align-items: stretch; }

@media (max-width: 1100px) {
	.hl-hero-shell { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 34px; }
	.hl-hero-copy h1 { font-size: clamp(42px, 5.8vw, 64px); }
}
@media (max-width: 900px) {
	.hl-hero-shell { grid-template-columns: 1fr; gap: 20px; padding: 28px 0 36px; }
	.hl-hero-copy { padding-right: 0; }
	.hl-hero-copy h1 { max-width: 760px; }
	.hl-hero-stage { min-height: 430px; }
}
@media (max-width: 680px) {
	:root { --hl-page-gutter: 16px; }
	body.admin-bar .site-header--sticky { top: 46px; }
	.hl-home-hero { padding-top: 18px; }
	.hl-hero-shell { padding: 22px 0 28px; }
	.hl-hero-copy h1 { font-size: clamp(38px, 12vw, 54px); }
	.hl-hero-stage { min-height: 380px; }
	.hl-decision-board__body { padding: 17px; }
	.hl-decision-card { min-height: 104px; padding: 14px; }
	.hl-decision-card strong { font-size: 15px; }
	.hl-decision-card small { font-size: 12px; }
	.hl-quick-item { min-height: 92px; padding: 17px; }
	.hl-quick-item strong { font-size: .94rem; }
}


/* ========================================================================
   HireLanz 2.5 — final interaction + visual polish
   ======================================================================== */
:root {
	--hl-bg: #f7f5ef;
	--hl-surface: #fffdf8;
	--hl-surface-soft: #f3f1e9;
	--hl-text: #172033;
	--hl-muted: #667085;
	--hl-border: #e2dfd5;
	--hl-primary: #1d4ed8;
	--hl-primary-hover: #1e40af;
	--hl-primary-soft: #eef4ff;
	--hl-cream: #fff9ec;
	--hl-page-gutter: clamp(16px, 3vw, 40px);
	--hl-container-final: 1400px;
}

html, body { background: var(--hl-bg); }
body { color: var(--hl-text); }
.container,
.site-header__inner,
.cw-search-overlay__inner,
.hl-home-hero > .container,
.hl-home-quick > .container,
.hl-section > .container,
.hl-home-cta > .container {
	width: min(var(--hl-container-final), calc(100% - (2 * var(--hl-page-gutter))));
	max-width: var(--hl-container-final);
}

/* Centered desktop navigation: brand | menu | actions. */
@media (min-width: 1024px) {
	.hl-glass-header .site-header__inner {
		display: grid;
		grid-template-columns: minmax(180px, 1fr) auto minmax(180px, 1fr);
		gap: 24px;
		min-height: 74px;
	}
	.hl-glass-header .site-branding { margin-right: 0; justify-self: start; }
	.hl-glass-header .primary-navigation { justify-self: center; }
	.hl-glass-header .site-header__actions { justify-self: end; }
}

.hl-glass-header {
	background: rgba(255,253,248,.88);
	border-bottom: 1px solid rgba(210,207,198,.72);
	box-shadow: 0 8px 30px rgba(42,38,28,.045);
	backdrop-filter: blur(20px) saturate(135%);
	-webkit-backdrop-filter: blur(20px) saturate(135%);
}
.hl-glass-header.is-scrolled { background: rgba(255,253,248,.96); box-shadow: 0 12px 32px rgba(42,38,28,.08); }
.hl-glass-header .primary-menu { gap: 4px; }
.hl-glass-header .primary-menu > .menu-item > a {
	position: relative;
	padding: 10px 12px;
	border: 1px solid transparent;
	border-radius: 10px;
	font-weight: 700;
	color: #334155;
}
.hl-glass-header .primary-menu > .menu-item > a::after {
	content: '';
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 5px;
	height: 2px;
	transform: scaleX(0);
	transform-origin: center;
	border-radius: 999px;
	background: var(--hl-primary);
	transition: transform .2s ease;
}
.hl-glass-header .primary-menu > .menu-item > a:hover,
.hl-glass-header .primary-menu > .menu-item.current-menu-item > a,
.hl-glass-header .primary-menu > .menu-item.current-menu-ancestor > a {
	background: rgba(255,255,255,.78);
	border-color: rgba(203,213,225,.7);
	color: var(--hl-primary);
	box-shadow: 0 4px 12px rgba(15,23,42,.045);
}
.hl-glass-header .primary-menu > .menu-item > a:hover::after,
.hl-glass-header .primary-menu > .menu-item.current-menu-item > a::after,
.hl-glass-header .primary-menu > .menu-item.current-menu-ancestor > a::after { transform: scaleX(1); }
.cwire-menu-chevron { display: inline-grid; place-items: center; margin-left: 2px; }
.cwire-menu-chevron .cw-icon { width: 13px; height: 13px; transition: transform .2s ease; }
.cwire-tools-menu:hover > a .cwire-menu-chevron .cw-icon,
.cwire-tools-menu.sub-menu-open > a .cwire-menu-chevron .cw-icon { transform: rotate(180deg); }

/* Tools mega dropdown: icon-led, compact, no dummy links. */
.primary-menu > .cwire-tools-menu > .cwire-tools-submenu {
	width: min(620px, calc(100vw - 48px));
	min-width: 0;
	left: 50%;
	right: auto;
	transform: translate(-50%, 8px);
	padding: 14px;
	background: rgba(255,253,248,.98);
	border-color: #ddd9ce;
	border-radius: 18px;
	box-shadow: 0 24px 70px rgba(42,38,28,.14), 0 2px 8px rgba(42,38,28,.06);
	grid-template-columns: repeat(2, minmax(0,1fr));
	gap: 6px;
}
.primary-menu > .cwire-tools-menu:hover > .cwire-tools-submenu,
.primary-menu > .cwire-tools-menu:focus-within > .cwire-tools-submenu,
.primary-menu > .cwire-tools-menu.sub-menu-open > .cwire-tools-submenu {
	transform: translate(-50%, 0);
}
.cwire-tool-menu-item > a {
	display: flex !important;
	align-items: center;
	gap: 11px;
	min-height: 66px;
	padding: 10px !important;
	border-radius: 12px !important;
	color: var(--hl-text) !important;
	background: transparent;
}
.cwire-tool-menu-item > a:hover { background: #f4f6fb !important; color: var(--hl-primary) !important; }
.cwire-tool-menu-icon {
	width: 38px;
	height: 38px;
	flex: 0 0 38px;
	display: grid;
	place-items: center;
	border: 1px solid #dbe4f5;
	border-radius: 11px;
	background: #f0f5ff;
	color: var(--hl-primary);
}
.cwire-tool-menu-icon .cw-icon { width: 19px; height: 19px; display: block; margin: 0 auto; }
.cwire-tool-menu-copy { min-width: 0; display: grid; gap: 3px; }
.cwire-tool-menu-copy strong { font-size: .88rem; line-height: 1.2; color: #1f2937; }
.cwire-tool-menu-copy small { font-size: .71rem; line-height: 1.2; color: #7a8495; }
.cwire-tools-menu-footer { grid-column: 1 / -1; border-top: 1px solid #e7e3d9; margin-top: 5px; padding-top: 8px; }
.cwire-tools-menu-footer > a { display:flex !important; align-items:center; justify-content:space-between; color: var(--hl-primary) !important; font-weight:800 !important; padding: 10px 12px !important; }
.cwire-tools-menu-footer .cw-icon { width: 15px; height: 15px; }

/* Tool cards/icons: exact centering and a more deliberate icon treatment. */
.hl-tool-card,
.hl-tool-grid.hl-tool-filter-grid .hl-tool-card {
	background: var(--hl-surface);
	border-color: var(--hl-border);
}
.hl-tool-card__icon,
.hl-tool-header__icon,
.hl-tool-grid.hl-tool-filter-grid .hl-tool-card__icon {
	display: grid !important;
	place-items: center !important;
	align-content: center !important;
	justify-content: center !important;
	text-align: center;
	line-height: 0;
	box-sizing: border-box;
}
.hl-tool-card__icon .cw-icon,
.hl-tool-header__icon .cw-icon,
.hl-tool-grid.hl-tool-filter-grid .hl-tool-card__icon .cw-icon {
	display: block !important;
	width: 23px !important;
	height: 23px !important;
	margin: 0 auto !important;
	flex: 0 0 auto;
}
.hl-tool-grid.hl-tool-filter-grid .hl-tool-card__icon {
	width: 56px;
	height: 56px;
	margin-bottom: 18px;
	border-radius: 15px;
	background: linear-gradient(145deg, #f2f6ff, #eaf1ff);
	border: 1px solid #d8e4fb;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.hl-tool-card:hover .hl-tool-card__icon { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(29,78,216,.10); }

/* Warm paper surfaces keep white cards visible without harsh contrast. */
.cw-card,
.widget-area .widget,
.hl-tool-main-card,
.hl-tool-why,
.hl-result-card,
.hl-analysis-card,
.hl-route-card,
.hl-offer-panel,
.hl-total-card,
.hl-checklist label,
.hl-roadmap-step,
.hl-funnel-step,
.hl-data-table,
.hl-tool-search input,
.hl-tool-form input,
.hl-tool-form select,
.hl-tool-form textarea { background: var(--hl-surface); }
.wp-block-table table,
.cw-table-wrap table { background: var(--hl-surface); border-color: var(--hl-border); }
.cw-table-wrap th,
.wp-block-table th { background: var(--hl-surface-soft); }

/* Search overlay: actual form submission + live suggestions. */
.cw-search-overlay {
	background: rgba(20,32,46,.36);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}
.cw-search-overlay__inner {
	background: var(--hl-surface);
	border: 1px solid #ded9ce;
	border-radius: 20px;
	padding: 18px;
	box-shadow: 0 30px 90px rgba(42,38,28,.18);
}
.cw-search-overlay__form {
	border: 1px solid #ddd9cf;
	border-bottom-width: 1px;
	border-radius: 13px;
	padding: 6px 6px 6px 13px;
	background: #fffefb;
	gap: 7px;
}
.cw-search-overlay__input { min-width: 0; font-size: 1rem; padding: 9px 2px; color: var(--hl-text); }
.cw-search-overlay__submit {
	width: 42px;
	height: 42px;
	border: 0;
	border-radius: 10px;
	display: grid;
	place-items: center;
	background: var(--hl-primary);
	color: #fff;
	cursor: pointer;
}
.cw-search-overlay__submit:hover { background: var(--hl-primary-hover); }
.cw-search-overlay__submit .cw-icon { width: 18px; height: 18px; }
.cw-search-result {
	align-items: center;
	gap: 12px;
	padding: 10px;
	border: 1px solid transparent;
	border-radius: 12px;
}
.cw-search-result__icon {
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	display: grid;
	place-items: center;
	border-radius: 11px;
	background: #f0f5ff;
	color: var(--hl-primary);
}
.cw-search-result__icon .cw-icon { width: 18px; height: 18px; }
.cw-search-result__copy { min-width: 0; display: grid; gap: 2px; }
.cw-search-result__type { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; color: #8791a1; }
.cw-search-result__title { font-size: .94rem; font-weight: 750; color: var(--hl-text); line-height: 1.35; }
.cw-search-empty,
.cw-search-hint { padding: 18px 10px; display: grid; gap: 4px; color: #697386; font-size: .9rem; }
.cw-search-empty strong { color: var(--hl-text); }
.cw-search-status { padding: 12px 10px; }

/* Mobile navigation is a polished drawer and stays below the WP admin bar. */
@media (max-width: 1023.98px) {
	.hl-glass-header .site-header__inner { min-height: 68px; }
	.hl-glass-header .primary-navigation {
		background: var(--hl-surface);
		border-left: 1px solid #ded9ce;
		box-shadow: -24px 0 70px rgba(42,38,28,.12);
		padding-top: 84px;
	}
	.hl-glass-header .primary-menu > .menu-item > a { padding: 13px 10px; font-size: 1rem; }
	.hl-glass-header .primary-menu > .menu-item > a::after { display: none; }
	.primary-menu > .cwire-tools-menu > .cwire-tools-submenu {
		width: auto;
		transform: none;
		padding: 4px 0 8px 10px;
		background: transparent;
		box-shadow: none;
		border: 0;
		grid-template-columns: 1fr;
	}
	.primary-menu > .cwire-tools-menu:hover > .cwire-tools-submenu,
	.primary-menu > .cwire-tools-menu:focus-within > .cwire-tools-submenu { transform: none; }
	.cwire-tool-menu-item > a { min-height: 54px; }
	.cwire-tool-menu-icon { width: 34px; height: 34px; flex-basis: 34px; }
	.cwire-tools-menu-footer { margin-top: 3px; }
}
body.admin-bar .hl-glass-header .primary-navigation { }
@media (max-width: 782px) {
	body.admin-bar .hl-glass-header .primary-navigation { top: 46px; }
}
@media (min-width: 783px) and (max-width: 1023.98px) {
	body.admin-bar .hl-glass-header .primary-navigation { top: 32px; }
}

@media (max-width: 680px) {
	:root { --hl-page-gutter: 16px; }
	.hl-glass-header .site-header__inner { min-height: 64px; }
	.hl-glass-header .site-header__actions { gap: 5px; }
	.hl-glass-header .cw-icon-btn { width: 40px; height: 40px; }
	.cw-search-overlay__inner { width: calc(100% - 24px); padding: 12px; border-radius: 16px; }
	.cw-search-overlay__form { padding-left: 11px; }
	.cw-search-overlay__submit { width: 40px; height: 40px; }
	.hl-tool-grid.hl-tool-filter-grid { gap: 12px !important; }
	.hl-tool-grid.hl-tool-filter-grid .hl-tool-card { padding: 20px !important; }
}

/* Remove accidental placeholder/admin UI from the public site. */
.cw-newsletter__admin-note { display: none !important; }

/* Editorial/AdSense-friendly defaults: content remains primary and empty ad zones stay collapsed. */
.cw-ad-slot:empty { display: none !important; }
.cw-ad-slot { min-height: 0; }

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

/* Keep the underlying editorial design tokens in sync with the HireLanz paper palette. */
:root {
	--cw-white: var(--hl-surface);
	--cw-paper: var(--hl-bg);
	--cw-mist: var(--hl-border);
	--cw-mist-200: var(--hl-surface-soft);
	--cw-color-bg: var(--hl-bg);
	--cw-color-surface: var(--hl-surface);
	--cw-color-surface-tint: var(--hl-surface-soft);
	--cw-color-border: var(--hl-border);
}


/* ========================================================================
   HireLanz 2.5.1 final mobile + surface correction layer
   This layer intentionally comes last so it wins over legacy desktop patches.
   ======================================================================== */
:root {
  --hl-bg: #f7f3eb;
  --hl-surface: #fffdf8;
  --hl-surface-soft: #f1ece3;
  --hl-border: #e2dbcf;
  --hl-text: #182238;
  --hl-text-secondary: #667085;
}

html, body { background: var(--hl-bg); }
body { min-width: 0; overflow-x: clip; }

/* The homepage should feel like one intentional paper canvas, not white
   blocks floating on a white page. */
.hl-home .hl-section--tools,
.hl-home .hl-section--research,
.hl-home .hl-home-quick,
.hl-home .hl-home-cta { background: var(--hl-bg); }
.hl-home .hl-section--soft { background: #f1ece3; }
.hl-home .hl-section--tools,
.hl-home .hl-section--research { border-color: #e2dbcf; }
.hl-home .hl-section--tools .hl-tool-card,
.hl-home .hl-section--research .hl-research-card,
.hl-home .hl-method-card,
.hl-home .hl-quick-item { background: var(--hl-surface); }

.cw-search-fallback { display:inline-flex; align-items:center; min-height:44px; color:var(--hl-primary); font-weight:800; text-decoration:none; }
.cw-search-fallback:hover { text-decoration:underline; }

/* Mobile: use a clean single-column composition and remove desktop-only
   sizing assumptions. 44px+ controls keep touch targets comfortable. */
@media (max-width: 767.98px) {
  :root { --hl-page-gutter: 14px; }
  .container,
  .site-header__inner,
  .hl-home-hero > .container,
  .hl-home-quick > .container,
  .hl-section > .container,
  .hl-home-cta > .container,
  .cw-search-overlay__inner { width: min(100%, calc(100% - 28px)); }

  body { font-size: 16px; }
  .site-header--sticky { top: 0; }
  body.admin-bar .site-header--sticky { top: 46px; }
  .site-header__inner,
  .hl-glass-header .site-header__inner { min-height: 62px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .site-branding { min-width:0; }
  .site-title { font-size:1.08rem; }
  .site-header__actions { margin-left:auto; display:flex; align-items:center; gap:6px; }
  .cw-icon-btn { width:44px; height:44px; min-width:44px; display:grid; place-items:center; border-radius:12px; }
  .cw-menu-toggle { display:grid; place-items:center; }

  /* Full-height mobile drawer, never squeezed into the page width. */
  .hl-glass-header .primary-navigation,
  .primary-navigation {
    position:fixed !important;
    top:62px !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(88vw, 360px) !important;
    max-width:360px;
    height:calc(100dvh - 62px);
    padding:18px 16px 32px !important;
    margin:0 !important;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:rgba(255,253,248,.985) !important;
    border-left:1px solid #ddd6c9 !important;
    box-shadow:-24px 0 70px rgba(35,31,24,.16) !important;
    transform:translateX(105%) !important;
    transition:transform .24s ease !important;
    z-index:205 !important;
  }
  body.admin-bar .hl-glass-header .primary-navigation,
  body.admin-bar .primary-navigation { top:62px !important; height:calc(100dvh - 62px); }
  body.cw-nav-open .hl-glass-header .primary-navigation,
  body.cw-nav-open .primary-navigation { transform:translateX(0) !important; }
  .primary-menu { display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:5px !important; }
  .primary-menu > .menu-item { width:100%; }
  .primary-menu > .menu-item > a {
    min-height:48px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100%;
    padding:12px 13px !important;
    border-radius:12px !important;
    border:1px solid transparent !important;
    font-size:1rem !important;
  }
  .primary-menu > .menu-item > a:hover,
  .primary-menu > .menu-item > a:focus-visible { background:#f1ece3 !important; border-color:#e0d8ca !important; }
  .primary-menu .sub-menu,
  .primary-menu > .cwire-tools-menu > .cwire-tools-submenu {
    position:static !important;
    display:none;
    width:100% !important;
    transform:none !important;
    padding:5px 0 8px 8px !important;
    margin:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    grid-template-columns:1fr !important;
  }
  .primary-menu .menu-item.sub-menu-open > .sub-menu,
  .primary-menu .cwire-tools-menu.sub-menu-open > .cwire-tools-submenu { display:grid !important; }
  .cwire-tool-menu-item > a { min-height:52px !important; padding:8px 9px !important; border-radius:11px !important; }
  .cwire-tool-menu-icon { width:36px !important; height:36px !important; flex-basis:36px !important; }
  .cwire-tool-menu-copy strong { font-size:.9rem !important; }
  .cwire-tool-menu-copy small { font-size:.75rem !important; }
  .cwire-tools-menu-footer { margin-top:4px !important; }

  .cw-nav-scrim { z-index:200 !important; background:rgba(24,34,56,.32) !important; }
  body.cw-nav-open { overflow:hidden; }

  /* Search is a real mobile sheet, not a desktop dialog squeezed into a phone. */
  .cw-search-overlay { padding:10px 0 0 !important; z-index:500 !important; }
  .cw-search-overlay__inner {
    width:calc(100% - 20px) !important;
    max-width:none !important;
    margin:0 auto;
    padding:10px !important;
    border-radius:18px !important;
    max-height:calc(100dvh - 20px);
    overflow:auto;
    background:#fffdf8 !important;
  }
  .cw-search-overlay__form { min-height:56px; gap:5px; padding:5px 5px 5px 11px !important; background:#f7f3eb !important; border-color:#ddd6c9 !important; }
  .cw-search-overlay__input { min-width:0; width:100%; font-size:16px !important; padding:9px 3px !important; }
  .cw-search-overlay__submit,
  #cw-search-close { width:44px !important; height:44px !important; min-width:44px; border-radius:11px !important; }
  .cw-search-overlay__results { max-height:calc(100dvh - 110px); }
  .cw-search-result { min-height:56px; padding:9px !important; }

  /* Hero: no desktop card proportions on mobile. */
  .hl-home-hero { padding:18px 0 28px !important; }
  .hl-home-hero > .container { width:100% !important; }
  .hl-hero-shell {
    width:calc(100% - 28px) !important;
    margin:0 auto !important;
    display:flex !important;
    flex-direction:column !important;
    gap:24px !important;
    padding:22px 0 0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .hl-hero-copy { width:100% !important; max-width:none !important; }
  .hl-hero-kicker { font-size:.68rem !important; letter-spacing:.075em; }
  .hl-home-hero h1,
  .hl-hero-copy h1 { font-size:clamp(2.25rem, 11vw, 3.25rem) !important; line-height:.98 !important; letter-spacing:-.055em !important; max-width:10ch !important; }
  .hl-hero-copy > p { max-width:100% !important; font-size:1rem !important; line-height:1.65 !important; margin-top:16px !important; }
  .hl-hero-actions { display:grid !important; grid-template-columns:1fr !important; gap:9px !important; width:100%; }
  .hl-hero-actions .cw-btn,
  .hl-hero-secondary { min-height:48px !important; width:100%; justify-content:center !important; }
  .hl-hero-meta { display:grid !important; grid-template-columns:1fr !important; gap:7px !important; margin-top:17px !important; }
  .hl-hero-stage { width:100% !important; min-height:0 !important; margin:0 !important; transform:none !important; }
  .hl-decision-board { width:100% !important; max-width:none !important; margin:0 !important; transform:none !important; border-radius:18px !important; }
  .hl-decision-board__body { padding:14px !important; }
  .hl-decision-grid { grid-template-columns:1fr !important; gap:8px !important; }
  .hl-decision-card--wide { grid-column:auto !important; }
  .hl-decision-card { min-height:86px !important; padding:13px !important; }
  .hl-decision-card strong { font-size:.94rem !important; }
  .hl-decision-card small { font-size:.76rem !important; }
  .hl-float-card { display:none !important; }
  .hl-hero-orbit { display:none !important; }
  .hl-decision-footer { display:grid !important; gap:6px !important; font-size:.72rem !important; }

  /* Home sections */
  .hl-home-quick { padding:0 0 26px !important; }
  .hl-quick-grid { grid-template-columns:1fr !important; gap:8px !important; }
  .hl-quick-item { min-height:72px !important; padding:13px !important; border-radius:15px !important; }
  .hl-quick-item strong { font-size:.94rem !important; }
  .hl-quick-item small { font-size:.76rem !important; }
  .hl-section { padding:40px 0 !important; }
  .hl-section-head,
  .hl-method-head { display:flex !important; flex-direction:column !important; gap:13px !important; align-items:flex-start !important; }
  .hl-section-head h2,
  .hl-method-head h2 { font-size:clamp(1.7rem, 8vw, 2.2rem) !important; line-height:1.08 !important; letter-spacing:-.04em !important; }
  .hl-section-head p,
  .hl-method-head p { font-size:.95rem !important; line-height:1.6 !important; }
  .hl-section-head .hl-text-link { align-self:flex-start; }
  .hl-tool-grid--home,
  .hl-research-grid,
  .hl-method-grid { grid-template-columns:1fr !important; gap:12px !important; }
  .hl-tool-card { min-width:0 !important; padding:20px !important; }
  .hl-tool-card__icon { width:52px !important; height:52px !important; margin-bottom:15px !important; }
  .hl-tool-card__title { font-size:1.08rem !important; }
  .hl-tool-card__excerpt { font-size:.9rem !important; line-height:1.55 !important; }
  .hl-method-card { padding:20px !important; border-radius:16px !important; }
  .hl-research-card { border-radius:16px !important; }
  .hl-research-card__body { padding:17px !important; }
  .hl-home-cta { padding:38px 0 52px !important; }
  .hl-cta-panel { display:flex !important; flex-direction:column !important; gap:18px !important; padding:24px !important; border-radius:18px !important; }
  .hl-cta-panel .cw-btn { width:100%; justify-content:center; min-height:48px; }

  /* Generic content/archive/tool pages: single column first, then expand. */
  .cw-layout-with-sidebar,
  .cw-archive-layout,
  .cw-single-layout { display:block !important; }
  .cw-layout-with-sidebar__main,
  .cw-layout-with-sidebar__sidebar { width:100% !important; min-width:0 !important; }
  .cw-card-grid { grid-template-columns:1fr !important; gap:12px !important; }
  .cw-card { border-radius:15px !important; }
  .cw-card__body { padding:17px !important; }
  .cw-page__body,
  .cw-single__content { font-size:17px !important; line-height:1.75 !important; }
  .cw-single__content img,
  .cw-page__body img { max-width:100% !important; height:auto !important; }
  .cw-table-wrap { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .cw-table-wrap table { min-width:620px; }

  /* Tool archive specifically: never stack giant cards with desktop spacing. */
  .hl-tool-grid.hl-tool-filter-grid { grid-template-columns:1fr !important; gap:12px !important; }
  .hl-tool-grid.hl-tool-filter-grid .hl-tool-card { min-height:0 !important; padding:18px !important; }
  .hl-tool-grid.hl-tool-filter-grid .hl-tool-card__icon { margin-bottom:13px !important; }
  .hl-tool-search { width:100% !important; }
  .hl-tool-search input { width:100% !important; min-height:48px !important; }
  .hl-tool-filters { overflow-x:auto; flex-wrap:nowrap !important; padding-bottom:4px; }
  .hl-tool-filters > * { flex:0 0 auto; min-height:44px; }

  /* Forms/results used by all 20 tools. */
  .hl-tool-form,
  .hl-tool-form-grid,
  .hl-result-grid,
  .hl-stats-grid { grid-template-columns:1fr !important; }
  .hl-tool-form input,
  .hl-tool-form select,
  .hl-tool-form textarea,
  .hl-tool-search input { min-height:48px !important; font-size:16px !important; }
  .hl-tool-form button,
  .hl-tool-actions button,
  .hl-tool-actions a { min-height:48px !important; }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
  .container,
  .site-header__inner,
  .hl-home-hero > .container,
  .hl-home-quick > .container,
  .hl-section > .container,
  .hl-home-cta > .container { width:calc(100% - 40px); }
  .hl-hero-shell { grid-template-columns:1fr !important; gap:30px !important; }
  .hl-hero-stage { max-width:760px; margin-inline:auto; }
  .hl-quick-grid { grid-template-columns:repeat(2,1fr) !important; }
  .hl-tool-grid--home,
  .hl-research-grid { grid-template-columns:repeat(2,1fr) !important; }
}


/* ========================================================================
   HireLanz 2.5.2 final visual calibration
   Intent: calm career-product UI; neutral surfaces, one blue accent,
   deliberate spacing, separate cards, no decorative cream wash.
   ======================================================================== */
:root {
  --hl-bg: #f6f8fb;
  --hl-surface: #ffffff;
  --hl-surface-soft: #f2f5f9;
  --hl-surface-tint: #eef4ff;
  --hl-text: #172033;
  --hl-muted: #667085;
  --hl-border: #e4e9f0;
  --hl-primary: #2457d6;
  --hl-primary-hover: #1946b8;
  --hl-shadow-sm: 0 8px 24px rgba(15, 23, 42, .045);
  --hl-shadow-md: 0 16px 40px rgba(15, 23, 42, .075);
}

html, body { background: var(--hl-bg); }
body { color: var(--hl-text); }

/* One consistent page rail. */
.container,
.site-header__inner,
.hl-home-hero > .container,
.hl-home-quick > .container,
.hl-section > .container,
.hl-home-cta > .container {
  width: min(1360px, calc(100% - 48px));
  max-width: 1360px;
  margin-inline: auto;
}

/* Header: quiet glass, crisp center alignment. */
.hl-glass-header {
  background: rgba(255, 255, 255, .88);
  border-bottom: 1px solid rgba(220, 226, 235, .88);
  box-shadow: 0 6px 24px rgba(15, 23, 42, .045);
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}
.hl-glass-header.is-scrolled { background: rgba(255,255,255,.96); }

/* Topic rail: four independent entry cards with real breathing room. */
.hl-home-quick { padding: 24px 0 56px !important; background: var(--hl-bg) !important; }
.hl-quick-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.hl-quick-item {
  min-height: 104px !important;
  padding: 18px !important;
  grid-template-columns: 44px minmax(0,1fr) 18px !important;
  gap: 14px !important;
  border: 1px solid var(--hl-border) !important;
  border-radius: 16px !important;
  background: var(--hl-surface) !important;
  box-shadow: var(--hl-shadow-sm) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.hl-quick-item:last-child { border-right: 1px solid var(--hl-border) !important; }
.hl-quick-item:hover {
  transform: translateY(-2px);
  border-color: #cbd8ee !important;
  background: #fff !important;
  box-shadow: var(--hl-shadow-md) !important;
}
.hl-quick-item strong { font-size: .95rem !important; color: var(--hl-text); }
.hl-quick-item small { margin-top: 5px !important; color: var(--hl-muted); font-size: .78rem !important; line-height: 1.45 !important; }
.hl-quick-icon { width: 44px !important; height: 44px !important; border: 1px solid #dbe5f6 !important; background: #f2f6ff !important; color: var(--hl-primary) !important; }

/* Sections: subtle cool neutrals instead of the previous cream wash. */
.hl-section--tools { background: #f4f7fb !important; border-top: 1px solid #e7ebf2 !important; border-bottom: 1px solid #e7ebf2 !important; }
.hl-section--research { background: #f8f9fb !important; border-top: 1px solid #e9edf3; border-bottom: 1px solid #e9edf3; }
.hl-section--soft { background: #f1f4f8 !important; }
.hl-home .hl-section--tools .hl-tool-card,
.hl-home .hl-section--research .hl-research-card,
.hl-home .hl-method-card { background: #fff !important; }

/* Practical tools: cards never touch; consistent 4px-based rhythm. */
.hl-tool-grid--home {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  align-items: stretch !important;
}
.hl-tool-grid--home .hl-tool-card {
  min-width: 0 !important;
  padding: 24px !important;
  border: 1px solid var(--hl-border) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: var(--hl-shadow-sm) !important;
}
.hl-tool-grid--home .hl-tool-card:first-child { grid-column: span 2; }
.hl-tool-grid--home .hl-tool-card__icon {
  width: 52px !important;
  height: 52px !important;
  margin-bottom: 18px !important;
  border-radius: 14px !important;
}

/* Research cards use space as the grouping mechanism. */
.hl-research-grid { gap: 20px !important; }
.hl-research-card { border-radius: 18px !important; box-shadow: var(--hl-shadow-sm) !important; }
.hl-research-card__body { padding: 22px !important; }

/* Search overlay: clearly interactive, never dependent on cream styling. */
.cw-search-overlay { z-index: 900 !important; }
.cw-search-overlay__inner {
  background: #fff !important;
  border: 1px solid var(--hl-border) !important;
  box-shadow: 0 24px 70px rgba(15,23,42,.14) !important;
}
.cw-search-overlay__form {
  background: #f7f9fc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  padding: 6px 6px 6px 14px !important;
}
.cw-search-overlay__input { color: var(--hl-text) !important; }
.cw-search-overlay__submit {
  background: var(--hl-primary) !important;
  color: #fff !important;
  border-radius: 10px !important;
  width: 44px !important;
  height: 44px !important;
}
.cw-search-overlay__submit:hover { background: var(--hl-primary-hover) !important; }
.cw-search-result { border-radius: 12px !important; }
.cw-search-result:hover, .cw-search-result.is-active { background: #f2f6ff !important; }

/* Prevent the mobile topic/tool shelves from collapsing into attached blocks. */
@media (max-width: 1023.98px) {
  .container,
  .site-header__inner,
  .hl-home-hero > .container,
  .hl-home-quick > .container,
  .hl-section > .container,
  .hl-home-cta > .container { width: min(100%, calc(100% - 40px)); }
  .hl-quick-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 14px !important; }
  .hl-tool-grid--home { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 16px !important; }
  .hl-tool-grid--home .hl-tool-card:first-child { grid-column: span 2; }
}

@media (max-width: 767.98px) {
  .container,
  .site-header__inner,
  .hl-home-hero > .container,
  .hl-home-quick > .container,
  .hl-section > .container,
  .hl-home-cta > .container { width: min(100%, calc(100% - 28px)); }
  .hl-home-quick { padding: 16px 0 40px !important; }
  .hl-quick-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .hl-quick-item { min-height: 82px !important; padding: 15px !important; }
  .hl-tool-grid--home { grid-template-columns: 1fr !important; gap: 14px !important; }
  .hl-tool-grid--home .hl-tool-card:first-child { grid-column: auto; }
  .hl-tool-grid--home .hl-tool-card { padding: 20px !important; }
  .hl-section--tools, .hl-section--research { padding-block: 48px !important; }
  .hl-research-grid { gap: 14px !important; }
}

/* ========================================================================
   HireLanz 2.5.3 — mobile navigation + search reliability polish
   ======================================================================== */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

/* Keep the header controls above the navigation scrim and give the drawer a
   predictable stacking context on every modern mobile browser. */
.site-header.hl-glass-header { z-index: 1100; }
.hl-glass-header .site-header__inner { position: relative; }
.cw-nav-scrim { z-index: 1050 !important; }
.hl-glass-header .primary-navigation { z-index: 1002 !important; }
.hl-glass-header .site-header__actions { position: relative; z-index: 1003; }

/* Search is a proper dialog surface on desktop: centered, compact, and easy
   to scan instead of filling the entire viewport with a giant white box. */
.cw-search-overlay {
  z-index: 1200 !important;
  display: block;
  padding: clamp(76px, 11vh, 128px) 20px 24px !important;
  background: rgba(15, 23, 42, .34) !important;
}
.cw-search-overlay[hidden] { display: none !important; }
.cw-search-overlay__inner {
  width: min(720px, 100%) !important;
  max-width: 720px !important;
  margin-inline: auto !important;
  padding: 14px !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  border: 1px solid #dbe3ee !important;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .20), 0 8px 24px rgba(15, 23, 42, .08) !important;
}
.cw-search-overlay__form {
  min-width: 0 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 58px !important;
  padding: 6px 6px 6px 14px !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.cw-search-overlay__form > .cw-icon { width: 20px; height: 20px; flex: 0 0 20px; }
.cw-search-overlay__input {
  min-width: 0 !important;
  width: 100% !important;
  height: 44px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
}
.cw-search-overlay__submit,
#cw-search-close {
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
}
.cw-search-overlay__submit { box-shadow: 0 5px 14px rgba(29,78,216,.18); }
.cw-search-overlay__results {
  width: 100% !important;
  max-height: min(52vh, 460px) !important;
  margin-top: 10px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}
.cw-search-result { min-width: 0; width: 100%; }
.cw-search-result__copy { min-width: 0; overflow: hidden; }
.cw-search-result__title { overflow-wrap: anywhere; }
.cw-search-overlay__form:focus-within { border-color: #b8c9e8 !important; box-shadow: 0 0 0 4px rgba(29,78,216,.08) !important; }

/* Mobile drawer: header height + WP admin-bar height are both accounted for.
   This prevents the drawer from starting underneath the header/admin toolbar. */
@media (max-width: 1023.98px) {
  .site-header.hl-glass-header { position: sticky; top: 0; }
  .hl-glass-header .primary-navigation {
    position: fixed !important;
    top: 68px !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: min(88vw, 380px) !important;
    max-width: 380px !important;
    height: calc(100dvh - 68px) !important;
    max-height: none !important;
    padding: 16px 16px 28px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    transform: translate3d(105%,0,0) !important;
    visibility: hidden;
    opacity: 0;
    transition: transform .24s cubic-bezier(.22,.61,.36,1), opacity .18s ease, visibility 0s linear .24s !important;
  }
  body.cw-nav-open .hl-glass-header .primary-navigation {
    transform: translate3d(0,0,0) !important;
    visibility: visible;
    opacity: 1;
    transition-delay: 0s !important;
  }
  body.admin-bar .hl-glass-header .primary-navigation {
    top: calc(68px + 46px) !important;
    height: calc(100dvh - 114px) !important;
  }
  .hl-glass-header .primary-menu { width: 100% !important; }
  .hl-glass-header .primary-menu > .menu-item > a { min-height: 50px !important; }
  .cw-nav-scrim { opacity: 0; pointer-events: none; }
  body.cw-nav-open .cw-nav-scrim { opacity: 1; pointer-events: auto; }
}

@media (max-width: 767.98px) {
  .hl-glass-header .site-header__inner { min-height: 62px !important; }
  .hl-glass-header .primary-navigation {
    top: 62px !important;
    width: min(90vw, 360px) !important;
  }
  body.admin-bar .hl-glass-header .primary-navigation {
    top: calc(62px + 46px) !important;
    height: calc(100dvh - 108px) !important;
  }

  /* Mobile search: edge-to-edge sheet with no horizontal overflow. */
  .cw-search-overlay {
    padding: 8px 10px 12px !important;
    overflow-y: auto !important;
  }
  .cw-search-overlay__inner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }
  .cw-search-overlay__form {
    grid-template-columns: auto minmax(0,1fr) auto !important;
    min-height: 56px !important;
    padding: 5px 5px 5px 12px !important;
  }
  .cw-search-overlay__form > .cw-icon { width: 18px; height: 18px; }
  .cw-search-overlay__input { height: 42px !important; font-size: 16px !important; }
  .cw-search-overlay__submit,
  #cw-search-close { width: 42px !important; min-width: 42px !important; height: 42px !important; }
  .cw-search-overlay__results { max-height: calc(100dvh - 105px) !important; }
  .cw-search-result { padding: 10px 8px !important; gap: 10px !important; }
  .cw-search-result__icon { width: 38px !important; height: 38px !important; flex-basis: 38px !important; }
  .cw-search-result__title { font-size: .92rem !important; }
}

@media (max-width: 380px) {
  .site-header__inner,
  .hl-glass-header .site-header__inner { gap: 6px !important; }
  .site-title { font-size: 1rem !important; }
  .hl-glass-header .cw-icon-btn { width: 40px !important; min-width: 40px !important; height: 40px !important; }
  .cw-search-overlay { padding-inline: 6px !important; }
  .cw-search-overlay__inner { padding: 8px !important; }
}


/* ========================================================================
   HireLanz 2.5.4 — final navigation + search polish
   ======================================================================== */
.hl-glass-header .primary-menu > .menu-item > a {
  white-space: nowrap;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.hl-glass-header .primary-menu > .menu-item > a:hover { transform: translateY(-1px); }

/* Transparent bridge prevents the Tools/Pages dropdown from flickering when
   the pointer moves from the trigger into the floating panel. */
.primary-menu > .cwire-tools-menu > .cwire-tools-submenu::before,
.primary-menu > .cwire-pages-menu > .sub-menu::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 14px;
  background: transparent;
}
.primary-menu > .cwire-tools-menu > .cwire-tools-submenu,
.primary-menu > .cwire-pages-menu > .sub-menu {
  transition: opacity .16s ease, visibility .16s ease, transform .18s cubic-bezier(.22,.61,.36,1) !important;
}
.primary-menu > .cwire-tools-menu:hover > .cwire-tools-submenu,
.primary-menu > .cwire-tools-menu:focus-within > .cwire-tools-submenu,
.primary-menu > .cwire-tools-menu.sub-menu-open > .cwire-tools-submenu,
.primary-menu > .cwire-tools-menu.is-hover-open > .cwire-tools-submenu {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0) !important;
}

/* Pages dropdown: compact and consistent with the Tools menu. */
.primary-menu > .cwire-pages-menu > .sub-menu {
  min-width: 190px;
  padding: 8px;
  background: rgba(255,253,248,.99);
  border: 1px solid #ddd9ce;
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(42,38,28,.12);
}
.primary-menu > .cwire-pages-menu > .sub-menu .menu-item > a {
  padding: 10px 11px;
  border-radius: 9px;
}
.primary-menu > .cwire-pages-menu > .sub-menu .menu-item > a:hover {
  background: #f1f5fb;
  color: var(--hl-primary);
}

/* Search action: always white icon on the blue action surface. */
.cw-search-overlay__submit,
.cw-search-overlay__submit:hover,
.cw-search-overlay__submit:focus-visible {
  background: var(--hl-primary) !important;
  color: #fff !important;
}
.cw-search-overlay__submit .cw-icon,
.cw-search-overlay__submit svg,
.cw-search-overlay__submit svg * {
  color: #fff !important;
  stroke: #fff !important;
}
.cw-search-overlay__submit:hover { background: var(--hl-primary-hover) !important; transform: translateY(-1px); }
.cw-search-overlay__submit:active { transform: translateY(0); }

/* Search remains completely inside the viewport on phones. */
@media (max-width: 767.98px) {
  .cw-search-overlay {
    inset: 0 !important;
    padding: 8px 8px 12px !important;
    display: block !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
  .cw-search-overlay__inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }
  .cw-search-overlay__form {
    grid-template-columns: 20px minmax(0,1fr) 44px 40px !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 5px !important;
    padding: 5px 5px 5px 10px !important;
  }
  .cw-search-overlay__form > .cw-icon { width: 18px !important; height: 18px !important; }
  .cw-search-overlay__input { min-width: 0 !important; max-width: 100% !important; }
  .cw-search-overlay__submit { width: 44px !important; min-width: 44px !important; height: 44px !important; }
  #cw-search-close { width: 40px !important; min-width: 40px !important; height: 40px !important; }
  .cw-search-overlay__results { max-height: calc(100dvh - 96px) !important; }
}
@media (max-width: 380px) {
  .cw-search-overlay { padding-inline: 5px !important; }
  .cw-search-overlay__inner { padding: 8px !important; }
  .cw-search-overlay__form { grid-template-columns: 18px minmax(0,1fr) 42px 38px !important; gap: 4px !important; padding-left: 8px !important; }
  .cw-search-overlay__submit { width: 42px !important; min-width: 42px !important; }
  #cw-search-close { width: 38px !important; min-width: 38px !important; }
}

@media (max-width: 1023.98px) {
  .primary-menu > .cwire-tools-menu > .cwire-tools-submenu::before,
  .primary-menu > .cwire-pages-menu > .sub-menu::before { display: none; }
  .primary-menu > .cwire-pages-menu > .sub-menu { min-width: 0; padding: 5px 0 8px 8px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
}

/* Final mobile admin-bar correction: the drawer starts below both the sticky
   header and WordPress's 46px admin toolbar when a user is logged in. */
@media (max-width: 767.98px) {
  body.admin-bar .hl-glass-header .primary-navigation,
  body.admin-bar .primary-navigation {
    top: 108px !important;
    height: calc(100dvh - 108px) !important;
  }
}


/* -------------------------------------------------------------------------
   Editable footer + homepage widget sections
   ------------------------------------------------------------------------- */
.hl-footer-main--cols-1 { grid-template-columns: minmax(240px, 1.45fr) minmax(180px, 1fr); }
.hl-footer-main--cols-2 { grid-template-columns: minmax(220px, 1.35fr) repeat(2, minmax(160px, 1fr)); }
.hl-footer-main--cols-3 { grid-template-columns: minmax(220px, 1.35fr) repeat(3, minmax(150px, 1fr)); }
.hl-footer-main--cols-4 { grid-template-columns: minmax(220px, 1.35fr) repeat(4, minmax(135px, 1fr)); }
.hl-footer-main .hl-footer-column--menu { min-width: 0; }
.hl-footer-main .hl-footer-menu { display: grid; gap: .55rem; list-style: none; margin: 0; padding: 0; }
.hl-footer-main .hl-footer-menu > li { margin: 0; padding: 0; }
.hl-footer-main .hl-footer-menu > li > a { display: inline-block; color: rgba(255,255,255,.62); font-size: .84rem; line-height: 1.45; text-decoration: none; transition: color .2s ease, transform .2s ease; }
.hl-footer-main .hl-footer-menu > li > a:hover { color: #fff; transform: translateX(2px); }
.hl-footer-main .hl-footer-menu > li.menu-item-has-children > a { color: #fff; font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .25rem; }
.hl-footer-main .hl-footer-menu .sub-menu { display: grid; gap: .45rem; list-style: none; margin: .15rem 0 0; padding: 0; }
.hl-footer-main .hl-footer-column--widget .widget { margin: 0 0 1.35rem; }
.hl-footer-main .hl-footer-column--widget .widget:last-child { margin-bottom: 0; }
.hl-footer-main .widget-title { margin: .15rem 0 1rem; color: #fff; font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hl-footer-main .widget ul { display: grid; gap: .55rem; list-style: none; margin: 0; padding: 0; }
.hl-footer-main .widget li { font-size: .84rem; line-height: 1.45; }
.hl-footer-main .widget a { color: rgba(255,255,255,.62); }
.hl-footer-main .widget a:hover { color: #fff; }
.hl-home-widget-section { padding: 4rem 0; }
.hl-home-widget-section--hero { padding-top: 1.25rem; }
.hl-home-widget-section--cta { padding-top: 2rem; padding-bottom: 5rem; }
.hl-home-widget-section .widget { margin: 0; }
.hl-home-widget-section .widget-title { margin: 0 0 1rem; }
.hl-home-widget-section .wp-block-group,
.hl-home-widget-section .wp-block-columns,
.hl-home-widget-section .wp-block-cover { margin-top: 0; margin-bottom: 0; }
@media (max-width: 980px) {
  .hl-footer-main--cols-4 { grid-template-columns: minmax(220px, 1.25fr) repeat(2, minmax(145px, 1fr)); }
  .hl-footer-main--cols-3 { grid-template-columns: minmax(220px, 1.25fr) repeat(2, minmax(145px, 1fr)); }
  .hl-footer-main--cols-2 { grid-template-columns: 1fr 1fr; }
  .hl-footer-main--cols-1 { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .hl-footer-main--cols-4,
  .hl-footer-main--cols-3,
  .hl-footer-main--cols-2 { grid-template-columns: 1fr; }
  .hl-home-widget-section { padding: 3rem 0; }
}


/* ========================================================================
   HireLanz 2.7.0 — editorial archive, full-image articles, mobile nav and
   editable footer polish.
   ======================================================================== */

/* Category archives: make the latest article a clean editorial feature
   instead of placing white text directly over a cropped photograph. */
.cw-archive-featured { margin: 30px 0 28px; }
.cw-card--category-lead {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .95fr);
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--hl-border, #e4e9f0);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(15,23,42,.07);
}
.cw-card--category-lead .cw-card__media {
  position: relative;
  inset: auto;
  aspect-ratio: 1200 / 628;
  min-height: 100%;
  border-radius: 0;
  background: #eef3f8;
}
.cw-card--category-lead .cw-card__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #eef3f8;
}
.cw-card--category-lead .cw-card__body {
  position: relative;
  inset: auto;
  align-self: center;
  padding: clamp(28px, 4vw, 48px);
  color: var(--hl-text, #172033);
  z-index: 1;
}
.cw-card--category-lead .cw-card__title {
  font-family: var(--cw-font-display);
  font-size: clamp(1.65rem, 2.5vw, 2.5rem);
  line-height: 1.1;
  color: var(--hl-text, #172033);
  margin-top: 12px;
}
.cw-card--category-lead .cw-card__title a::after { display: none; }
.cw-card--category-lead .cw-card__title a:hover { color: var(--hl-primary, #2457d6); }
.cw-card--category-lead .cw-card__subtitle,
.cw-card--category-lead .cw-card__excerpt { color: var(--hl-muted, #667085); font-size: 1rem; line-height: 1.7; }
.cw-card--category-lead .cw-post-meta { color: var(--hl-muted, #667085); margin-top: 16px; }
.cw-card--category-lead .cw-post-meta .cw-icon { color: var(--hl-muted, #667085); }
.cw-card--category-lead .cw-card__scrim { display: none; }

/* Single articles: never force a 16:9 crop on editorial feature images. */
.cw-article__featured {
  width: min(1200px, calc(100% - 2 * var(--hl-page-gutter, 24px)));
  max-width: 1200px;
  margin-inline: auto;
  margin-top: 30px;
}
.cw-article__featured img.cw-article__featured-image,
.cw-article__featured > img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
  border-radius: 20px;
  background: #eef3f8;
  box-shadow: 0 14px 38px rgba(15,23,42,.08);
}
.cw-article__caption { max-width: 900px; margin: 10px auto 0; color: var(--hl-muted, #667085); font-size: .82rem; }

/* Article navigation: two clear destination cards rather than the browser's
   default previous/next links. */
.cw-post-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--hl-border, #e4e9f0);
}
.cw-post-nav__item {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  min-height: 112px;
  padding: 18px 20px;
  border: 1px solid var(--hl-border, #e4e9f0);
  border-radius: 16px;
  background: #fff;
  color: var(--hl-text, #172033);
  box-shadow: 0 8px 24px rgba(15,23,42,.045);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.cw-post-nav__item:hover { transform: translateY(-2px); border-color: #cbd8ee; box-shadow: 0 16px 34px rgba(15,23,42,.08); }
.cw-post-nav__item--next { text-align: right; }
.cw-post-nav__direction { display: inline-flex; align-items: center; gap: 6px; color: var(--hl-primary, #2457d6); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.cw-post-nav__direction .cw-icon { width: 15px; height: 15px; }
.cw-post-nav__item strong { display: block; font-family: var(--cw-font-display); font-size: 1.02rem; line-height: 1.35; }

/* Tool editorial content entered in the normal WordPress editor is now
   rendered on the public tool page. */
.hl-tool-content {
  width: min(900px, 100%);
  margin: 32px auto 0;
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--hl-border, #e4e9f0);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15,23,42,.045);
}
.hl-tool-content h2 { margin-top: 0; }

/* Footer column headings are independent of the menu links and are editable
   from Appearance → Customize → Footer. */
.hl-footer-column__heading {
  margin: 0 0 14px;
  font-size: .78rem;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
  color: #4b5a70;
}

/* Mobile search: hard viewport containment prevents the search surface from
   creating a horizontal page overflow or triggering a desktop-width layout. */
html, body { overflow-x: clip; }
.cw-search-overlay { box-sizing: border-box; width: 100vw; max-width: 100vw; }
.cw-search-overlay__inner,
.cw-search-overlay__form { box-sizing: border-box; min-width: 0; }
@media (max-width: 767.98px) {
  .cw-search-overlay { left: 0 !important; right: 0 !important; width: 100vw !important; max-width: 100vw !important; padding-inline: 8px !important; }
  .cw-search-overlay__inner { width: 100% !important; max-width: 100% !important; overflow: hidden; }
  .cw-search-overlay__form { grid-template-columns: 18px minmax(0, 1fr) 42px 38px !important; }
  .cw-search-overlay__input { min-width: 0 !important; overflow: hidden; text-overflow: ellipsis; }
}

/* Mobile navigation: clean arrow controls with no duplicated Tools chevron. */
@media (max-width: 1023.98px) {
  .hl-glass-header .primary-menu > .menu-item { position: relative; }
  .hl-glass-header .primary-menu > .menu-item > a { padding-right: 52px !important; }
  .hl-glass-header .primary-menu > .menu-item > a .cwire-menu-chevron { margin-left: auto; }
  .cw-submenu-toggle {
    right: 8px !important;
    top: 5px !important;
    transform: none !important;
    width: 40px !important;
    height: 40px !important;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #607089;
    background: transparent;
    z-index: 4;
  }
  .cw-submenu-toggle:hover,
  .cw-submenu-toggle:focus-visible { background: #eef4ff; color: var(--hl-primary, #2457d6); }
  .cw-submenu-toggle .cw-icon { width: 17px; height: 17px; transition: transform .18s ease; }
  .menu-item.sub-menu-open > .cw-submenu-toggle .cw-icon { transform: rotate(180deg); }
  .hl-glass-header .primary-menu > .cwire-tools-menu > a { padding-right: 13px !important; }
  .hl-glass-header .primary-menu > .cwire-tools-menu > a .cwire-menu-chevron .cw-icon { transition: transform .18s ease; }
  .hl-glass-header .primary-menu > .cwire-tools-menu.sub-menu-open > a .cwire-menu-chevron .cw-icon { transform: rotate(180deg); }
}

@media (max-width: 760px) {
  .cw-card--category-lead { grid-template-columns: 1fr; }
  .cw-card--category-lead .cw-card__media { aspect-ratio: 1200 / 628; min-height: 0; }
  .cw-card--category-lead .cw-card__body { padding: 24px; }
  .cw-card--category-lead .cw-card__title { font-size: clamp(1.45rem, 7vw, 2rem); }
  .cw-post-nav { grid-template-columns: 1fr; }
  .cw-post-nav__item--next { text-align: left; }
  .cw-article__featured { width: calc(100% - 2 * var(--hl-page-gutter, 16px)); margin-top: 20px; }
  .cw-article__featured img.cw-article__featured-image,
  .cw-article__featured > img { border-radius: 14px; }
}
