/* KlenWriter header — responsive 3-zone architecture */

/*
 * Gutenberg block gap applies margin-block-start to group children site-wide.
 * Reset only inside header layout zones — content spacing elsewhere stays intact.
 */
.wp-site-blocks > header :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-flow > *,
.wp-site-blocks > header :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-constrained > *,
.wp-site-blocks > header :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-flex > *,
header.wp-block-template-part :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-flow > *,
header.wp-block-template-part :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-constrained > *,
header.wp-block-template-part :where(.kwt-site-header__inner, .kwt-site-brand, .kwt-header-actions).wp-block-group-is-layout-flex > *,
.wp-site-blocks > header .kwt-site-header__inner > *,
header.wp-block-template-part .kwt-site-header__inner > *,
.wp-site-blocks > header :where(.kwt-site-brand, .kwt-header-actions, .kwt-header-nav) > *,
header.wp-block-template-part :where(.kwt-site-brand, .kwt-header-actions, .kwt-header-nav) > *,
.wp-site-blocks > header .kwt-header-nav,
header.wp-block-template-part .kwt-header-nav,
.wp-site-blocks > header :where(.wp-block-navigation, .wp-block-navigation__container, .wp-block-navigation-item, .wp-block-navigation-item__content, .wp-block-navigation-submenu__toggle),
header.wp-block-template-part :where(.wp-block-navigation, .wp-block-navigation__container, .wp-block-navigation-item, .wp-block-navigation-item__content, .wp-block-navigation-submenu__toggle) {
	margin-block-end: 0;
	margin-block-start: 0;
}

.wp-site-blocks > header > .wp-block-group,
header.wp-block-template-part > .wp-block-group,
.kwt-site-header__inner {
	align-items: center;
	display: grid;
	gap: clamp(0.65rem, 2vw, 1.25rem);
	grid-template-areas: "brand nav actions";
	grid-template-columns: auto minmax(0, 1fr) auto;
	margin-inline: auto;
	max-width: var(--kwt-wide-width);
	min-height: calc(var(--kwt-header-control-height) + (var(--kwt-header-inner-padding-y) * 2));
	padding-block: var(--kwt-header-inner-padding-y);
	width: min(calc(100% - clamp(1rem, 4vw, 3rem)), var(--kwt-wide-width));
}

.wp-site-blocks > header,
header.wp-block-template-part {
	overflow: visible;
}

.kwt-site-brand {
	align-items: center;
	display: flex;
	flex: 0 0 auto;
	gap: 0.75rem;
	grid-area: brand;
	min-width: 0;
}

.kwt-site-brand__title,
.kwt-site-brand .wp-block-site-title {
	align-items: center;
	display: flex;
	line-height: 1.1;
	margin: 0;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.kwt-site-brand .wp-block-site-title a {
	line-height: 1.1;
	margin: 0;
}

.kwt-site-brand .wp-block-site-logo,
.kwt-site-brand__logo {
	flex: 0 0 auto;
}

.kwt-site-brand .wp-block-site-logo a,
.kwt-site-brand .custom-logo-link {
	align-items: center;
	background: color-mix(in srgb, var(--kwt-color-card) 90%, var(--kwt-color-background));
	border: 1px solid var(--kwt-color-border);
	border-radius: var(--kwt-radius-lg);
	box-sizing: border-box;
	display: inline-flex;
	flex-shrink: 0;
	height: var(--kwt-header-control-height);
	justify-content: center;
	padding: 0.3rem;
	width: var(--kwt-header-control-height);
}

.kwt-site-brand .wp-block-site-logo img,
.kwt-site-brand .custom-logo {
	display: block;
	flex-shrink: 0;
	height: calc(var(--kwt-header-control-height) - 0.45rem);
	object-fit: contain;
	width: calc(var(--kwt-header-control-height) - 0.45rem);
}

.kwt-header-nav {
	align-items: center;
	display: flex;
	grid-area: nav;
	justify-content: center;
	min-width: 0;
	overflow: visible;
	width: 100%;
}

.kwt-header-nav .kwt-menu--primary {
	align-items: center;
	display: flex;
	flex: 1 1 auto;
	justify-content: center;
	max-width: 100%;
	min-width: 0;
	overflow: visible;
	width: 100%;
}

.kwt-header-nav .kwt-menu__list {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	min-height: var(--kwt-header-control-height);
	min-width: 0;
	overflow: visible;
}

.kwt-header-actions {
	align-items: center;
	display: flex;
	flex: 0 0 auto;
	flex-wrap: nowrap;
	gap: 0.45rem;
	grid-area: actions;
	justify-content: flex-end;
	min-width: 0;
}

.kwt-icon-button {
	align-items: center;
	background: color-mix(in srgb, var(--kwt-color-card) 84%, transparent);
	border: 1px solid var(--kwt-color-border);
	border-radius: var(--kwt-radius-pill);
	box-shadow: var(--kwt-shadow-subtle);
	box-sizing: border-box;
	color: var(--kwt-color-foreground);
	cursor: pointer;
	display: inline-flex;
	flex: 0 0 auto;
	height: var(--kwt-header-control-height);
	justify-content: center;
	padding: 0;
	transition: background-color var(--kwt-transition-fast), border-color var(--kwt-transition-fast), color var(--kwt-transition-fast), box-shadow var(--kwt-transition-fast);
	width: var(--kwt-header-control-height);
}

.kwt-icon-button__svg,
.kwt-icon-button__icon {
	display: block;
	flex: 0 0 auto;
}

.kwt-icon-button:hover,
.kwt-icon-button:focus-visible {
	background: var(--kwt-color-card);
	border-color: color-mix(in srgb, var(--kwt-color-primary) 38%, transparent);
	box-shadow: var(--kwt-shadow-subtle);
	color: var(--kwt-color-primary);
	outline: none;
}

.kwt-icon-button.is-active,
.kwt-icon-button[aria-pressed="true"] {
	background: color-mix(in srgb, var(--kwt-color-primary) 14%, var(--kwt-color-card));
	border-color: color-mix(in srgb, var(--kwt-color-primary) 34%, transparent);
	color: var(--kwt-color-primary);
}

.kwt-header-search {
	align-items: center;
	display: flex;
	flex: 0 1 15rem;
	height: var(--kwt-header-control-height);
	margin: 0;
	max-width: 17.5rem;
	min-width: 0;
	position: relative;
	transition: flex-basis var(--kwt-transition-normal), max-width var(--kwt-transition-normal);
	width: clamp(11rem, 16vw, 17.5rem);
	z-index: calc(var(--kwt-z-dropdown) + 1);
}

.kwt-header-search:focus-within {
	flex-basis: 20rem;
	max-width: 22.5rem;
	width: clamp(14rem, 18vw, 22.5rem);
}

.kwt-header-search__input {
	appearance: none;
	background: color-mix(in srgb, var(--kwt-color-card) 86%, transparent);
	border: 1px solid var(--kwt-color-border);
	border-radius: var(--kwt-radius-pill);
	box-shadow: var(--kwt-shadow-subtle);
	box-sizing: border-box;
	color: var(--kwt-color-foreground);
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	height: var(--kwt-header-control-height);
	line-height: 1;
	margin: 0;
	padding: 0 2.35rem 0 0.95rem;
	transition: background-color var(--kwt-transition-fast), border-color var(--kwt-transition-fast), box-shadow var(--kwt-transition-fast);
	width: 100%;
}

.kwt-header-search__input::placeholder {
	color: var(--kwt-color-muted);
	opacity: 0.82;
}

.kwt-header-search__input:focus-visible {
	background: var(--kwt-color-card);
	border-color: color-mix(in srgb, var(--kwt-color-primary) 45%, transparent);
	box-shadow: var(--kwt-shadow-focus);
	outline: 0;
}

.kwt-search-toggle {
	display: none;
}

.kwt-icon-button--menu,
.kwt-menu-toggle {
	display: none;
}

.kwt-menu-toggle__icon,
.kwt-menu-toggle__icon::before,
.kwt-menu-toggle__icon::after {
	background: currentColor;
	border-radius: var(--kwt-radius-pill);
	content: "";
	display: block;
	height: 2px;
	transition: transform var(--kwt-transition-fast), opacity var(--kwt-transition-fast), top var(--kwt-transition-fast);
	width: 1.1rem;
}

.kwt-menu-toggle__icon {
	position: relative;
}

.kwt-menu-toggle__icon::before,
.kwt-menu-toggle__icon::after {
	left: 0;
	position: absolute;
}

.kwt-menu-toggle__icon::before {
	top: -0.36rem;
}

.kwt-menu-toggle__icon::after {
	top: 0.36rem;
}

[data-kwt-menu="on"] .kwt-menu-toggle__icon {
	background: transparent;
}

[data-kwt-menu="on"] .kwt-menu-toggle__icon::before {
	top: 0;
	transform: rotate(45deg);
}

[data-kwt-menu="on"] .kwt-menu-toggle__icon::after {
	top: 0;
	transform: rotate(-45deg);
}

.kwt-theme-icon[hidden] {
	display: none !important;
}

:root[data-kwt-theme="auto"] .kwt-theme-icon--auto,
:root[data-kwt-theme="light"] .kwt-theme-icon--light,
:root[data-kwt-theme="dark"] .kwt-theme-icon--dark,
:root:not([data-kwt-theme]) .kwt-theme-icon--auto {
	display: block;
}

.kwt-nav-more {
	position: relative;
}

.kwt-nav-more[hidden] {
	display: none !important;
}

.kwt-nav-more__toggle {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: var(--kwt-radius-md);
	box-sizing: border-box;
	color: var(--kwt-color-foreground);
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 650;
	gap: 0.25rem;
	height: var(--kwt-header-control-height);
	line-height: 1;
	padding: 0 0.75rem;
	white-space: nowrap;
}

.kwt-nav-more__toggle:hover,
.kwt-nav-more__toggle:focus-visible {
	background: color-mix(in srgb, var(--kwt-color-primary) 10%, transparent);
	color: var(--kwt-color-primary);
	outline: none;
}

.kwt-nav-more__list {
	-webkit-backdrop-filter: blur(var(--kwt-backdrop-blur));
	backdrop-filter: blur(var(--kwt-backdrop-blur));
	background: color-mix(in srgb, var(--kwt-color-card) 94%, transparent);
	border: 1px solid var(--kwt-color-border);
	border-radius: var(--kwt-radius-lg);
	box-shadow: var(--kwt-shadow-card);
	display: none;
	list-style: none;
	margin: 0.45rem 0 0;
	min-width: 12rem;
	padding: 0.4rem;
	position: absolute;
	right: 0;
	top: calc(100% + 0.35rem);
	z-index: calc(var(--kwt-z-dropdown) + 2);
}

.kwt-nav-more.is-open > .kwt-nav-more__list {
	display: grid;
	gap: 0.2rem;
}

.kwt-nav-more__list .menu-item a {
	border-radius: var(--kwt-radius-md);
	display: block;
	padding: 0.55rem 0.75rem;
	text-decoration: none;
	white-space: nowrap;
}

.kwt-menu--primary .current-menu-item > a,
.kwt-menu--primary .current-menu-ancestor > a {
	background: transparent;
	color: var(--kwt-color-primary);
	font-weight: 700;
}

@media (min-width: 900px) {
	.kwt-site-header__inner > .kwt-site-brand,
	.kwt-site-header__inner > .kwt-header-nav,
	.kwt-site-header__inner > .kwt-header-actions {
		align-self: center;
	}

	.kwt-header-nav .wp-block-navigation,
	.kwt-header-nav .wp-block-navigation__container,
	.kwt-header-nav .wp-block-navigation-item,
	.kwt-header-nav .kwt-menu--primary > .kwt-menu__list > .menu-item {
		align-items: center;
		display: flex;
	}

	.kwt-header-nav .wp-block-navigation-item__content,
	.kwt-header-nav .wp-block-navigation-submenu__toggle,
	.kwt-header-nav .kwt-menu--primary > .kwt-menu__list > .menu-item > a,
	.kwt-header-nav .kwt-nav-more__toggle {
		align-items: center;
		box-sizing: border-box;
		display: inline-flex;
		height: var(--kwt-header-control-height);
		line-height: 1;
		margin: 0;
		padding: 0 0.75rem;
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children > .sub-menu {
		-webkit-backdrop-filter: blur(var(--kwt-backdrop-blur));
		backdrop-filter: blur(var(--kwt-backdrop-blur));
		background: color-mix(in srgb, var(--kwt-color-card) 94%, transparent);
		border: 1px solid var(--kwt-color-border);
		border-radius: var(--kwt-radius-lg);
		box-shadow: var(--kwt-shadow-card);
		margin-top: 0.35rem;
		min-width: 13rem;
		padding: 0.45rem;
		top: calc(100% + 0.15rem);
		z-index: calc(var(--kwt-z-dropdown) + 2);
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children > .sub-menu a {
		border-radius: var(--kwt-radius-md);
		display: block;
		padding: 0.55rem 0.75rem;
		white-space: nowrap;
	}
}

@media (max-width: 1199px) {
	.kwt-header-search {
		flex-basis: 11rem;
		max-width: 13rem;
		width: 11rem;
	}

	.kwt-header-search:focus-within {
		flex-basis: 14rem;
		max-width: 16rem;
		width: 14rem;
	}
}

@media (max-width: 1040px) {
	:root:not([data-kwt-search="on"]) .kwt-header-search {
		display: none;
	}

	:root:not([data-kwt-search="on"]) .kwt-search-toggle {
		display: inline-flex;
	}
}

@media (max-width: 899px) {
	html.kwt-menu-is-open,
	body.kwt-menu-is-open {
		overflow: hidden;
		overscroll-behavior: none;
		touch-action: manipulation;
	}

	[data-kwt-menu="on"] .wp-site-blocks > header,
	[data-kwt-menu="on"] header.wp-block-template-part {
		isolation: isolate;
		z-index: calc(var(--kwt-z-modal) + 3);
	}

	.kwt-site-header__inner {
		grid-template-areas: "brand actions";
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.kwt-header-nav {
		inset: 0;
		overflow: visible;
		pointer-events: none;
		position: fixed;
		z-index: var(--kwt-z-modal);
	}

	.kwt-header-nav::before {
		-webkit-backdrop-filter: blur(24px) saturate(140%);
		backdrop-filter: blur(24px) saturate(140%);
		background: var(--kwt-mobile-menu-scrim);
		content: "";
		inset: 0;
		opacity: 0;
		pointer-events: none;
		position: fixed;
		transition: opacity var(--kwt-transition-normal), visibility var(--kwt-transition-normal);
		visibility: hidden;
		z-index: calc(var(--kwt-z-modal) - 1);
	}

	[data-kwt-menu="on"] .kwt-header-nav::before {
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
	}

	[data-kwt-menu="on"] .kwt-header-nav {
		pointer-events: auto;
	}

	.kwt-header-nav .kwt-menu--primary {
		background: transparent;
		border: 0;
		border-radius: 0;
		box-sizing: border-box;
		display: block;
		left: clamp(1rem, 4vw, 1.5rem);
		margin: 0;
		max-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0px) - var(--kwt-header-bar-height, 4.25rem) - max(1rem, env(safe-area-inset-bottom)));
		opacity: 0;
		overflow-x: hidden;
		overflow-y: auto;
		padding: 0.65rem 0 max(0.75rem, env(safe-area-inset-bottom));
		pointer-events: none;
		position: fixed;
		right: clamp(1rem, 4vw, 1.5rem);
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--kwt-header-bar-height, 4.25rem));
		transform: translateY(0.35rem);
		transition: opacity var(--kwt-transition-normal), transform var(--kwt-transition-normal), visibility var(--kwt-transition-normal);
		visibility: hidden;
		width: auto;
		z-index: var(--kwt-z-modal);
	}

	[data-kwt-menu="on"] .kwt-header-nav .kwt-menu--primary {
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
		visibility: visible;
	}

	.kwt-header-nav .kwt-menu__list {
		-webkit-backdrop-filter: blur(var(--kwt-backdrop-blur));
		backdrop-filter: blur(var(--kwt-backdrop-blur));
		align-items: stretch;
		background: var(--kwt-mobile-menu-surface);
		border: 1px solid var(--kwt-color-border);
		border-radius: var(--kwt-radius-2xl);
		box-shadow: var(--kwt-shadow-hover);
		display: grid;
		gap: 0;
		margin-inline: auto;
		max-width: 28rem;
		overflow: visible;
		padding: 0.35rem 0;
		width: 100%;
	}

	.kwt-header-nav .kwt-menu--primary a {
		align-items: center;
		background: transparent;
		border: 0;
		border-radius: var(--kwt-radius-md);
		display: flex;
		font-size: 1.0625rem;
		font-weight: 650;
		justify-content: flex-start;
		line-height: 1.2;
		min-height: var(--kwt-mobile-menu-item-height);
		padding: 0.7rem 1.1rem;
		transition: background-color var(--kwt-transition-fast), color var(--kwt-transition-fast);
		white-space: normal;
		width: 100%;
	}

	.kwt-header-nav .kwt-menu--primary a:hover,
	.kwt-header-nav .kwt-menu--primary a:focus-visible {
		background: color-mix(in srgb, var(--kwt-color-primary) 10%, transparent);
		color: var(--kwt-color-primary);
	}

	.kwt-header-nav .kwt-menu--primary .current-menu-item > a,
	.kwt-header-nav .kwt-menu--primary .current-menu-ancestor > a,
	.kwt-header-nav .kwt-menu--primary .current-menu-item > a:hover,
	.kwt-header-nav .kwt-menu--primary .current-menu-item > a:focus-visible,
	.kwt-header-nav .kwt-menu--primary .current-menu-ancestor > a:hover,
	.kwt-header-nav .kwt-menu--primary .current-menu-ancestor > a:focus-visible {
		background: transparent;
		color: var(--kwt-color-primary);
		font-weight: 700;
	}

	.kwt-header-nav .kwt-menu--primary .sub-menu .current-menu-item > a,
	.kwt-header-nav .kwt-menu--primary .sub-menu .current-menu-ancestor > a {
		background: transparent;
		color: var(--kwt-color-primary);
		font-weight: 650;
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children > .sub-menu {
		background: transparent;
		border: 0;
		box-shadow: none;
		display: none;
		gap: 0;
		height: auto;
		left: auto;
		margin: 0;
		min-width: 0;
		opacity: 1;
		padding: 0 0 0.15rem 0.35rem;
		pointer-events: auto;
		position: static;
		top: auto;
		transform: none;
		visibility: visible;
		width: 100%;
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children.is-kwt-submenu-open > .sub-menu {
		display: grid;
	}

	.kwt-header-nav .kwt-menu--primary .sub-menu a {
		background: transparent;
		border: 0;
		border-radius: var(--kwt-radius-md);
		color: var(--kwt-color-muted);
		font-size: 0.9375rem;
		font-weight: 600;
		min-height: var(--kwt-mobile-menu-subitem-height);
		padding: 0.55rem 1.1rem 0.55rem 1.65rem;
	}

	.kwt-header-nav .kwt-menu--primary .sub-menu a:hover,
	.kwt-header-nav .kwt-menu--primary .sub-menu a:focus-visible {
		background: color-mix(in srgb, var(--kwt-color-primary) 8%, transparent);
		color: var(--kwt-color-primary);
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children > a {
		gap: 0.875rem;
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children > a::after {
		align-self: center;
		border-bottom: 2px solid currentColor;
		border-right: 2px solid currentColor;
		content: "";
		display: inline-block;
		flex: 0 0 auto;
		height: 0.42rem;
		margin-inline-start: 0;
		opacity: 0.72;
		order: 1;
		transform: rotate(45deg);
		transition: transform var(--kwt-transition-fast);
		width: 0.42rem;
	}

	.kwt-header-nav .kwt-menu--primary .menu-item-has-children.is-kwt-submenu-open > a::after {
		transform: rotate(225deg);
	}

	.kwt-header-search {
		display: none;
	}

	.kwt-search-toggle,
	.kwt-icon-button--menu,
	.kwt-menu-toggle {
		display: inline-flex;
		position: relative;
		z-index: calc(var(--kwt-z-modal) + 1);
	}

	.kwt-icon-button--reading {
		display: none;
	}

	.kwt-nav-more {
		display: none !important;
	}

	.kwt-search-overlay {
		align-items: flex-start;
		padding: calc(var(--kwt-header-bar-height, 4.25rem) + 1rem + var(--wp-admin--admin-bar--height, 0px)) max(1rem, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
	}

	.kwt-search-overlay__dialog {
		border-radius: var(--kwt-radius-2xl);
		padding: 1.15rem 1.1rem 1.25rem;
		width: min(100%, 28rem);
	}

	.kwt-search-overlay__form {
		gap: 0.85rem;
		padding-top: 0.35rem;
	}

	.kwt-search-overlay__form label {
		font-size: 1.35rem;
	}
}

@media (max-width: 480px) {
	.kwt-header-nav .kwt-menu--primary {
		left: max(0.85rem, env(safe-area-inset-left));
		right: max(0.85rem, env(safe-area-inset-right));
	}

	.kwt-site-brand .wp-block-site-logo a,
	.kwt-site-brand .custom-logo-link {
		height: 2.5rem;
		width: 2.5rem;
	}

	.kwt-site-brand .wp-block-site-logo img,
	.kwt-site-brand .custom-logo {
		height: 2rem;
		width: 2rem;
	}

	.kwt-site-brand__title,
	.kwt-site-brand .wp-block-site-title {
		font-size: 0.95rem;
		max-width: min(46vw, 11rem);
	}

	.kwt-header-actions {
		gap: 0.35rem;
	}

	.kwt-icon-button {
		height: 2.35rem;
		width: 2.35rem;
	}

	.kwt-header-search__input {
		height: 2.35rem;
	}

	.kwt-site-footer__inner {
		padding-inline: max(1rem, env(safe-area-inset-left)) max(1rem, env(safe-area-inset-right));
	}
}

@media (prefers-reduced-motion: reduce) {
	.kwt-icon-button,
	.kwt-header-search,
	.kwt-header-nav .kwt-menu--primary {
		transition: none;
	}
}
