/*
 * Nagłówek i nawigacja (makieta: _header.scss, 1:1 poza nazwami kontenerów).
 * Próg nawigacji 1344 px (desktop: menu w linii z mega menu; poniżej: panel
 * wsuwany z prawej z drugim ekranem). Stany przełącza moduł widoku klasami
 * `is-*` i atrybutami `aria-*`; bez skryptu działa `.no-js` z dołu pliku.
 */

.masthead {
	position: relative;
	z-index: 20;
	border-bottom: 1px solid var(--c-border);
	background: var(--c-surface);
}

/* Pasek przyklejony (makieta, decyzja 2026-09-30): po zjechaniu 250 px moduł
   widoku nadaje `is-stuck` części szablonu z nagłówkiem. `sticky`, nie `fixed`:
   pasek zostaje w przepływie, więc włączenie stanu niczego nie przesuwa. */
.wp-block-template-part.is-stuck,
.site-header.is-stuck {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 45;
	overflow-x: clip;
	animation-name: site-header-in;
	animation-duration: var(--duration-base);
	animation-timing-function: var(--ease-out-soft);
	animation-fill-mode: backwards;
}

@keyframes site-header-in {

	from {
		transform: translateY(-100%);
		opacity: 0;
	}
}

:where(main, footer) :where(a, button, input, select, textarea, summary, [tabindex], [id]),
:where(#tresc) {
	scroll-margin-top: calc(var(--header-offset) + var(--space-5));
}

.masthead__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-11);
	max-width: var(--container);
	min-height: 6rem;
	margin-inline: auto;
	padding-inline: var(--pad-x);
}

.brand {
	display: block;
	flex: none;
}

.brand:focus-visible {
	outline-offset: 4px;
}

.brand img {
	display: block;
	width: auto;
	height: 5rem;
}

.brand__text {
	color: var(--c-ink);
	font-family: var(--font-serif);
	font-size: var(--text-8);
	font-weight: 600;
}

.site-nav__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	min-height: var(--target-min);
	padding: 0.8em 0.95em;
	border: 0;
	border-radius: var(--radius-4);
	background: none;
	color: var(--c-text);
	font-family: inherit;
	font-size: var(--text-5);
	font-weight: 600;
	line-height: 1.6;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}

.site-nav__link:hover,
.site-nav__link[aria-current] {
	background: var(--c-tint);
	color: var(--c-primary-hover);
}

.site-nav .chev {
	flex: none;
	width: 0.56em;
	height: 0.65em;
	color: var(--c-text-muted);
}

.masthead__cta {
	flex: none;
}

.nav-toggle {
	display: none;
	align-items: center;
	gap: 0.6em;
	min-height: var(--target-min);
	padding: 0.4em 1.1em;
	border: 2px solid var(--c-primary);
	border-radius: var(--radius-pill);
	background: none;
	color: var(--c-primary-hover);
	font-family: inherit;
	font-size: var(--text-4);
	font-weight: 600;
	cursor: pointer;
}

.nav-toggle[aria-expanded="true"] {
	background: var(--c-tint);
}

.nav-toggle__bars {
	display: block;
	width: 1.125em;
	height: 0.125rem;
	background: currentcolor;
	box-shadow: 0 -5px 0 currentcolor, 0 5px 0 currentcolor;
}

.site-nav__extra,
.site-nav__close,
.site-nav__back,
.site-nav__screen-title {
	display: none;
}

/* --- Mega menu „Poradnie i usługi” --- */

.mega__list,
.mega__grid {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mega__link {
	display: block;
	padding: 0.7em 0.85em;
	border-radius: var(--radius-4);
	color: var(--c-text);
	font-size: var(--text-5);
	line-height: 1.6;
	text-decoration: none;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.mega__link:hover {
	background: var(--c-tint);
	color: var(--c-primary-hover);
}

.mega__link--tick {
	border-left: 3px solid transparent;
}

.mega__link--tick:hover {
	border-left-color: var(--c-accent);
}

.mega__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-13);
	margin-bottom: var(--space-9);
}

.mega__title {
	margin: 0;
	color: var(--c-ink);
	font-family: var(--font-serif);
	font-size: var(--text-9);
	font-weight: 600;
	line-height: 1.6;
}

.mega__group--uslugi .mega__title {
	margin-bottom: var(--space-9);
}

.mega__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-13);
	margin-top: var(--space-15);
	padding-top: var(--space-13);
	border-top: 1px solid var(--c-border);
}

.mega__foot p {
	max-width: 51.25rem;
	margin: 0;
	color: var(--c-text-soft);
	font-size: var(--text-5);
}

.mega__foot strong {
	color: var(--c-text);
}

.mega__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6em;
	min-height: var(--target-min);
	padding: 0.9em 1.8em;
	text-decoration: none;
}

.mega__cta .icon {
	flex: none;
}

/* --- Układ desktopowy (od 1344 px) --- */

@media (min-width: 1344px) {

	.site-nav__list {
		display: flex;
		align-items: stretch;
		gap: var(--space-1);
	}

	.site-nav__item {
		display: flex;
		align-items: center;
	}

	.mega {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		max-height: calc(100dvh - var(--header-offset));
		overflow-y: auto;
		overscroll-behavior: contain;
		border-top: 1px solid var(--c-border);
		background: var(--c-surface);
		box-shadow: var(--shadow-mega);
	}

	.mega__inner {
		max-width: var(--container);
		margin-inline: auto;
		padding: var(--space-17) var(--pad-x) var(--space-16);
	}

	.mega__cols {
		display: grid;
		grid-template-columns: 17rem 1fr;
		gap: var(--space-18);
	}

	.mega__group--uslugi {
		padding-right: var(--space-18);
		border-right: 1px solid var(--c-border);
	}

	.mega__grid--poradnie {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: var(--space-4) var(--space-15);
	}

	.no-js .mega {
		display: none;
	}

	.no-js .has-mega:hover .mega,
	.no-js .has-mega:focus-within .mega {
		display: block;
	}

	.js .mega {
		display: none;
	}

	.js .has-mega.is-open .mega {
		display: block;
	}

	.js .has-mega.is-open > .site-nav__link {
		background: var(--c-tint);
		color: var(--c-primary-hover);
	}

	.site-nav__link--parent {
		padding-right: 0.2em;
		border-radius: var(--radius-4) 0 0 var(--radius-4);
	}

	.site-nav__sub-toggle {
		align-self: stretch;
		min-width: var(--target-min);
		padding-left: 0.2em;
		border-radius: 0 var(--radius-4) var(--radius-4) 0;
	}

	.site-nav__sub-label {
		display: none;
	}

	.has-mega:hover > .site-nav__link,
	.site-nav__link--parent[aria-current] + .site-nav__sub-toggle {
		background: var(--c-tint);
		color: var(--c-primary-hover);
	}
}

/* --- Układ mobilny (poniżej 1344 px) --- */

@media (max-width: 1343.98px) {

	.nav-toggle {
		display: inline-flex;
	}

	.brand {
		margin-right: auto;
	}

	html.has-nav-open {
		overflow: hidden;
	}

	.site-nav {
		position: fixed;
		inset: 0;
		z-index: 60;
		visibility: hidden;
		transition: visibility 0.4s;
	}

	.site-nav::before {
		content: "";
		position: absolute;
		inset: 0;
		background: rgb(var(--c-dark-rgb) / 0.45);
		opacity: 0;
		transition: opacity 0.3s;
	}

	.site-nav.is-open {
		visibility: visible;
	}

	.site-nav.is-open::before {
		opacity: 1;
	}

	.site-nav__panel {
		position: absolute;
		top: 0.75rem;
		right: 0.75rem;
		bottom: 0.75rem;
		width: calc(100% - 1.5rem);
		max-width: 22.5rem;
		overflow: hidden;
		border-radius: var(--radius-7);
		background: var(--c-surface);
		box-shadow: var(--shadow-panel);
		transform: translateX(calc(100% + 0.75rem));
		transition: transform 0.4s var(--ease-out-soft);
	}

	.site-nav.is-open .site-nav__panel {
		transform: none;
	}

	.site-nav__close {
		position: absolute;
		top: 1.25rem;
		right: 1.25rem;
		z-index: 2;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.5rem;
		height: 2.5rem;
		padding: 0;
		border: 0;
		border-radius: var(--radius-pill);
		background: none;
		color: var(--c-text);
		cursor: pointer;
		transition: background 0.15s, color 0.15s;
	}

	.site-nav__close:hover {
		background: var(--c-tint);
		color: var(--c-primary-hover);
	}

	.site-nav__list {
		height: 100%;
		overflow-y: auto;
		padding: var(--space-21) var(--space-13) var(--space-13);
	}

	.site-nav__link {
		display: flex;
		justify-content: space-between;
		width: calc(100% + 1.5rem);
		margin-inline: calc(-1 * var(--space-7));
		padding: 0.7em var(--space-7);
		font-size: var(--text-6);
		text-align: left;
	}

	.site-nav__link .chev {
		margin-left: auto;
		transform: rotate(-90deg);
	}

	.js .site-nav__link--parent,
	.no-js .site-nav__sub-toggle {
		display: none;
	}

	.mega {
		position: absolute;
		inset: 0;
		z-index: 1;
		overflow-y: auto;
		padding: var(--space-21) var(--space-13) var(--space-13);
		background: var(--c-surface);
		visibility: hidden;
		transform: translateX(100%);
		transition: transform 0.4s var(--ease-out-soft), visibility 0.4s;
	}

	.has-mega.is-open .mega {
		visibility: visible;
		transform: none;
	}

	.site-nav__back {
		position: absolute;
		top: 1.25rem;
		left: 1.5rem;
		display: inline-flex;
		align-items: center;
		gap: var(--space-5);
		min-height: 2.5rem;
		margin-left: calc(-1 * var(--space-5));
		padding: 0 var(--space-5);
		border: 0;
		border-radius: var(--radius-4);
		background: none;
		color: var(--c-primary-hover);
		font-family: inherit;
		font-size: var(--text-4);
		font-weight: 600;
		cursor: pointer;
		transition: background 0.15s;
	}

	.site-nav__back:hover {
		background: var(--c-tint);
	}

	.site-nav__screen-title {
		display: block;
		margin: 0 0 var(--space-7);
		color: var(--c-ink);
		font-family: var(--font-serif);
		font-size: var(--text-10);
		font-weight: 600;
	}

	.mega__link {
		margin-inline: calc(-1 * var(--space-7));
		padding: 0.7em var(--space-7);
		border-left: 0;
		font-size: var(--text-5);
	}

	.mega__title {
		padding: var(--space-11) 0 var(--space-3);
		color: var(--c-text-muted);
		font-family: var(--font-sans);
		font-size: var(--text-2);
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}

	.mega__group--uslugi .mega__title {
		margin-bottom: 0;
		padding-top: var(--space-5);
	}

	.mega__head {
		margin-bottom: 0;
	}

	.mega__foot {
		margin-top: var(--space-11);
		padding-top: var(--space-11);
	}

	.mega__foot p {
		font-size: var(--text-4);
	}

	.no-js .nav-toggle,
	.no-js .site-nav__close,
	.no-js .site-nav__back,
	.no-js .site-nav__screen-title {
		display: none;
	}

	.no-js .masthead__inner {
		flex-wrap: wrap;
	}

	.no-js .site-nav {
		position: static;
		order: 1;
		width: 100%;
		visibility: visible;
	}

	.no-js .site-nav::before {
		display: none;
	}

	.no-js .site-nav__panel {
		position: static;
		width: auto;
		max-width: none;
		border-radius: 0;
		box-shadow: none;
		transform: none;
	}

	.no-js .site-nav__list {
		height: auto;
		padding: var(--space-7) 0 var(--space-9);
	}

	.no-js .site-nav__link,
	.no-js .mega__link {
		width: 100%;
		margin-inline: 0;
	}

	.no-js .mega {
		position: static;
		padding: 0 0 var(--space-7) var(--space-9);
		visibility: visible;
		transform: none;
	}

	.site-nav__extra {
		display: block;
		margin-top: var(--space-7);
		padding: var(--space-11) 0 var(--space-5);
		border-top: 1px solid var(--c-border);
	}

	.site-nav__extra-title {
		margin: 0 0 var(--space-5);
		color: var(--c-text-muted);
		font-size: var(--text-3);
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}

	.site-nav__extra-list {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.site-nav__extra-list a {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.45em;
		min-height: var(--target-min);
		padding: 0.5em 0;
		color: var(--c-primary-hover);
		font-weight: 600;
		text-decoration: none;
	}

	.site-nav__extra-list a:hover {
		color: var(--c-primary-deep);
		text-decoration: underline;
	}

	.site-nav__extra-note {
		color: var(--c-text-muted);
		font-weight: 400;
	}
}

@media (max-width: 767.98px) {

	.brand img {
		height: 2.75rem;
	}

	.masthead__inner {
		min-height: 4.5rem;
	}

	.masthead__cta {
		display: none;
	}

	:root[data-font-size] .brand {
		flex-shrink: 1;
		min-width: 0;
	}

	:root[data-font-size] .brand img {
		max-width: 100%;
		height: auto;
		max-height: 2.75rem;
	}
}

/* Kanwa edytora: podgląd pokazuje pasek, panel i mega menu nie przykrywają
   treści. */
.editor-styles-wrapper .mega,
.editor-styles-wrapper .site-nav__extra {
	display: none;
}