/* =====================================================================
   NAGŁÓWEK: logo, menu, język, wygląd, „Wyceń auto”, menu na telefonie
   ===================================================================== */
/* rozmycie tła jest na nagłówku stale (na górze strony nic pod nim nie ma, więc go nie widać) – włączane dopiero przy przewijaniu
   i do tego płynnie (transition na backdrop-filter) zatrzymywało stronę na ok. 0,15 s w chwili ruszenia w dół */
.nag { position: fixed; top: 0; left: 0; right: 0; z-index: 50; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: background-color .35s, box-shadow .35s; }
/* zalogowany w WordPressie: pasek admina nad nagłówkiem */
.admin-bar .nag { top: var(--wp-admin--admin-bar--height, 32px); }
.nag--tlo { background: var(--nag-tlo); box-shadow: 0 1px 0 var(--linia); }
.nag__w { display: flex; align-items: center; gap: 28px; height: 84px; max-width: var(--szer); margin: 0 auto; padding: 0 var(--bok); }
.nag__logo { flex: none; display: block; width: 150px; color: var(--tekst); transition: color .3s; }
/* po najechaniu logo czerwone – jak w stopce (napis jest w currentColor) */
.nag__logo:hover, .nag__logo:focus-visible, .stopka__logo:focus-visible { color: var(--czerwony); }
.nag__logo svg, .stopka__logo svg { display: block; width: 100%; height: auto; }
/* animowane logo: ciemne części w kolorze tekstu motywu, czerwone – czerwień marki */
.logo-anim .la-c { fill: currentColor; fill-rule: evenodd; }
.logo-anim .la-r { fill: #ec2024; fill-rule: evenodd; }
@media (prefers-reduced-motion: reduce) { .logo-anim .pc-line { mask: none !important; } .logo-anim .pc-wordmark { opacity: 1 !important; } .logo-anim .pc-wordmark-motion { transform: none !important; } }
.nag__menu { display: flex; gap: 4px; margin: 0 auto; }
.nag__menu > a { display: block; padding: 10px 12px; white-space: nowrap; color: var(--tekst); font-size: 15px; font-weight: 500; text-decoration: none; opacity: .88; transition: opacity .2s, color .2s; }
.nag__menu > a:hover { opacity: 1; color: var(--czerwony); }
.nag__menu > a.aktywny, .nag__menu > a[aria-current="page"] { opacity: 1; box-shadow: inset 0 -2px 0 var(--czerwony); }
/* języki w menu na telefonie (w nagłówku są tam schowane) */
.nag__jezyki { display: none; }
.nag__akcje { display: flex; align-items: center; gap: 10px; }
/* „Wyceń auto”: schowany, dopóki nie przewiniemy (albo duży przycisk startu nie zniknie z ekranu);
   schowany ma visibility: hidden – nie łapie fokusu klawiszem Tab */
.nag__akcje .przycisk { max-width: 260px; overflow: hidden; white-space: nowrap;
	transition: max-width .5s cubic-bezier(.2, .8, .2, 1), padding .5s cubic-bezier(.2, .8, .2, 1), margin .5s cubic-bezier(.2, .8, .2, 1), opacity .4s, visibility .4s, box-shadow .3s, filter .3s; }
html.js:not(.cta-w-nag) .nag__akcje .przycisk { max-width: 0; padding-left: 0; padding-right: 0; margin-left: -10px; border-width: 0; opacity: 0; visibility: hidden; pointer-events: none; }
.ikonka--jezyk { width: auto; padding: 0 14px; border-radius: 21px; font: 600 13px var(--font-t); letter-spacing: 1px; }
/* wybór języka: flaga w kółku, po najechaniu / kliknięciu lista */
.jezyk { position: relative; }
.jezyk .ikonka--jezyk { width: 42px; padding: 0; }
.flaga-j { display: inline-block; flex: none; width: 22px; height: 15px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .15); background-size: cover; }
html[data-theme="light"] .flaga-j { box-shadow: 0 0 0 1px rgba(9, 19, 27, .2); }
.flaga-j--pl { background: linear-gradient(#fff 50%, #dc143c 0); }
.flaga-j--nl { background: linear-gradient(#ae1c28 33.3%, #fff 0 66.6%, #21468b 0); }
.flaga-j--en { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath fill='%23012169' d='M0 0h60v30H0z'/%3E%3Cpath stroke='%23fff' stroke-width='6' d='M0 0l60 30M60 0L0 30'/%3E%3Cpath stroke='%23C8102E' stroke-width='3' d='M0 0l60 30M60 0L0 30'/%3E%3Cpath stroke='%23fff' stroke-width='10' d='M30 0v30M0 15h60'/%3E%3Cpath stroke='%23C8102E' stroke-width='6' d='M30 0v30M0 15h60'/%3E%3C/svg%3E") center / cover; }
.jezyk__lista { position: absolute; right: 0; top: calc(100% + 10px); z-index: 5; min-width: 190px; margin: 0; padding: 8px; list-style: none; background: var(--nag-tlo); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	border: 1px solid var(--linia); box-shadow: var(--cien); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .25s; }
.jezyk__lista::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* mostek – lista nie znika przy przejściu myszą */
/* otwiera najechanie albo kliknięcie (.otwarty); po zamknięciu kliknięciem .zamkniety blokuje najechanie, aż kursor zjedzie z listy */
.jezyk.otwarty .jezyk__lista { opacity: 1; visibility: visible; transform: none; }
/* najechanie otwiera tylko przy myszy (na telefonie dotknięcie = :hover – lista otwierała się i od razu zamykała) */
@media (hover: hover) and (pointer: fine) { .jezyk:hover:not(.zamkniety) .jezyk__lista { opacity: 1; visibility: visible; transform: none; } }
.jezyk__lista a { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 12px; color: var(--tekst); font: 600 14px var(--font-t); letter-spacing: 1px; text-decoration: none; transition: background .2s, color .2s, padding .3s cubic-bezier(.2, .8, .2, 1); }
.jezyk__lista a span { margin-left: auto; padding-left: 14px; white-space: nowrap; color: var(--tekst-3); font-weight: 500; font-size: 13px; letter-spacing: 0; }
.jezyk__lista a:hover { background: var(--karta-hover); color: var(--czerwony); padding-left: 18px; }
.jezyk__lista a::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 2px; background: transparent; }
.jezyk__lista a[aria-current]::before { background: #ff3b2a; box-shadow: 0 0 8px rgba(255, 59, 42, .8); }
.jezyk__lista a[aria-current] { color: var(--tekst); }
/* ikona w kółku = bieżący wybór wyglądu (auto / jasny / ciemny) */
.motyw-wybor .ikonka svg { display: none; }
html[data-motyw-wybor="auto"] .motyw-wybor .ikona-auto, html[data-motyw-wybor="light"] .motyw-wybor .ikona-slonce, html[data-motyw-wybor="dark"] .motyw-wybor .ikona-ksiezyc, html[data-motyw-wybor="noc"] .motyw-wybor .ikona-pelnia { display: block; }
.motyw-wybor .ikonka--jezyk svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.motyw-wybor .jezyk__lista { min-width: 240px; }
.motyw-wybor .jezyk__lista svg { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.motyw-wybor .jezyk__lista a { letter-spacing: .3px; }
.nag__tel { color: var(--tekst); font-weight: 600; font-size: 15px; text-decoration: none; white-space: nowrap; }
.nag__tel:hover { color: var(--czerwony); }
.nag__burger { display: none; }

@media (max-width: 1440px) { .nag__tel { display: none; } }
@media (max-width: 1200px) { .nag__menu > a { padding: 10px 9px; font-size: 14px; } }
@media (max-width: 1000px) {
	.nag__menu, .nag__akcje .przycisk, .jezyk:not(.motyw-wybor) { display: none; }
	.nag__burger { display: grid; }
	.nag__w { height: 72px; }
	.nag__logo { width: 128px; margin-right: auto; }
	/* otwarte menu: nagłówek bez backdrop-filter (z nim menu „fixed” liczyło się względem nagłówka) */
	.nag--otwarte { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--tlo); }
	.nag--otwarte .nag__menu { position: fixed; inset: 72px 0 0; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 20px var(--bok) 40px; background: var(--tlo); overflow-y: auto; overscroll-behavior: contain; }
	.admin-bar .nag--otwarte .nag__menu { top: calc(72px + var(--wp-admin--admin-bar--height, 46px)); }
	.nag--otwarte .nag__menu > a { padding: 18px 0; border-bottom: 1px solid var(--linia); font-size: 19px; }
	.nag--otwarte .nag__menu > a[aria-current="page"], .nag--otwarte .nag__menu > a.aktywny { box-shadow: inset 3px 0 0 var(--czerwony); padding-left: 14px; }
	.nag--otwarte .nag__jezyki { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
	.nag__jezyki a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid var(--linia); color: var(--tekst); font: 600 14px var(--font-t); letter-spacing: 1px; text-decoration: none; }
	.nag__jezyki a[aria-current] { border-color: var(--czerwony); }
	/* przy otwartym menu strona pod spodem się nie przewija */
	html.menu-otwarte, html.menu-otwarte body { overflow: hidden; }
}
