/* REDFORD V6 · nav.css (TOR A, ROZBIÓRKA mkvision 18.10). Nagłówek jak mkvision (pomiar 1440: logo x48 y37, pigułki h52 r999 pad 5/5/5/24,
 * napis 13 px caps, kółko 42 px; odstęp 16). Chowa się w dół (-112 px), wraca w górę; pas pod nim papier .72 + blur 12 (ciemne sekcje: czerń .55).
 * Menu: ciemny panel na środku (940 px, odstęp 26 px od góry i dołu, r 32), przyciemnienie strony .4, duże linki spod maski.
 * R3-D (18.10, Rafał): pionowa zakładka Wycena przy prawej krawędzi usunięta (HTML, CSS, JS). */
.nv{position:fixed;left:0;right:0;top:0;height:0;z-index:var(--z-nav);pointer-events:none}
.nv-bar{position:absolute;left:0;right:0;top:0;height:100px;transition:transform .7s var(--e-out)}
html.nv-hide:not(.is-menu) .nv-bar{transform:translateY(-112px)}
.nv-under{position:absolute;inset:0;background:rgba(243,243,239,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;transition:opacity .45s var(--e-out),background-color .45s var(--e-out)}
html.nv-scrolled .nv-under{opacity:1}
html.nv-inv .nv-under{background:rgba(14,14,14,.55)}
html.is-menu .nv-under,html.hv-full .nv-under{opacity:0}
.nv-logo{position:absolute;left:var(--m);top:37px;display:block;width:155px;height:26px;pointer-events:auto}
.nv-logo img{position:absolute;inset:0;width:155px;height:26px;transition:opacity .35s var(--e-out)}
.nv-logo .lg-paper{opacity:0}
html.nv-inv .nv-logo .lg-ink{opacity:0}
html.nv-inv .nv-logo .lg-paper{opacity:1}
.nv-r{position:absolute;right:var(--m);top:24px;display:flex;align-items:center;gap:16px;pointer-events:auto}
.nv-pill{display:inline-flex;align-items:center;gap:16px;height:52px;padding:5px 5px 5px 24px;border:0;border-radius:999px;font:700 13px/1 var(--f-text);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .35s var(--e-out),color .35s var(--e-out),box-shadow .35s var(--e-out)}
.nv-cta{background:#fff;color:var(--ink);box-shadow:0 10px 30px -18px rgba(14,14,14,.35)}
.nv-menu{background:var(--ink);color:var(--paper)}
.nv-ic{display:flex;align-items:center;justify-content:center;flex:none;width:42px;height:42px;border-radius:50%;transition:background-color .35s var(--e-out),transform .45s var(--e-out)}
.nv-cta .nv-ic{background:var(--red);color:#fff}
@media (hover:hover) and (pointer:fine){.nv-cta:hover .nv-ic{background:var(--red-hover)}}
.nv-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--e-out)}
@media (hover:hover) and (pointer:fine){.nv-cta:hover .nv-ic svg{transform:translateX(2px)}}
.nv-menu .nv-ic{gap:5px;background:rgba(255,255,255,.15)}
.nv-dots i{display:block;width:6px;height:6px;border-radius:50%;background:var(--red-hover);transition:transform .5s var(--e-out)}
@media (hover:hover) and (pointer:fine){.nv-menu:hover .nv-dots i{transform:scale(1.3)}}
html.is-menu .nv-dots i:first-child{transform:translateX(5.5px)}
html.is-menu .nv-dots i:last-child{transform:translateX(-5.5px)}
.nv-roll{display:grid;height:1.25em;overflow:hidden;line-height:1.25}
.nv-roll>span{grid-area:1/1;transition:transform .6s var(--e-out)}
.nv-roll>span+span{transform:translateY(110%)}
html.is-menu .nv-menu .nv-roll>span:first-child{transform:translateY(-110%)}@media (hover:hover) and (pointer:fine){.nv-cta:hover .nv-roll>span:first-child{transform:translateY(-110%)}}
html.is-menu .nv-menu .nv-roll>span+span{transform:none}@media (hover:hover) and (pointer:fine){.nv-cta:hover .nv-roll>span+span{transform:none}}
html.nv-inv:not(.is-menu) .nv-menu{background:var(--paper);color:var(--ink)}
html.nv-inv:not(.is-menu) .nv-menu .nv-ic{background:rgba(14,14,14,.08)}
html.is-menu .nv-menu{background:#2A2A28}

/* menu: panel na środku */
.mn{position:fixed;inset:0;z-index:var(--z-menu);visibility:hidden;pointer-events:none}
html.is-menu .mn{visibility:visible;pointer-events:auto}
.mn-ov{position:absolute;inset:0;background:rgba(14,14,14,.4);opacity:0}
.mn-p{position:absolute;left:50%;top:26px;bottom:26px;display:flex;flex-direction:column;width:min(940px,calc(100vw - 2 * var(--m)));padding:0 79px 48px;border-radius:32px;background:var(--ink);color:var(--paper);overflow:hidden auto;overscroll-behavior:contain;transform:translateX(-50%);clip-path:inset(0 0 100% 0 round 32px)}
.mn-head{display:flex;flex:none;align-items:flex-end;justify-content:space-between;height:119px}
.mn-logo{display:block;width:155px;height:26px}
.mn-x{position:relative;flex:none;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.15);cursor:pointer;transition:background-color .3s var(--e-out),transform .45s var(--e-out)}
@media (hover:hover) and (pointer:fine){.mn-x:hover{background:var(--red);transform:rotate(90deg)}}
.mn-x i{position:absolute;left:13px;top:19.25px;width:14px;height:1.5px;background:#fff}
.mn-x i:first-child{rotate:45deg}
.mn-x i+i{rotate:-45deg}
.mn-nav{display:flex;flex:1 0 auto;align-items:center;padding:8px 0 32px}
.mn-list{margin:0;padding:0;list-style:none}
.mn-m{display:block;margin:0;overflow:hidden}
.mn-rv{display:inline-block}
.mn-a{display:block;color:inherit;text-decoration:none;font-size:clamp(34px,min(4.4444vw,7.4vh),64px);line-height:1.22;letter-spacing:-.02em;transition:opacity .35s var(--e-out),color .35s var(--e-out)}
.mn-a .mn-m{padding:.02em 0 .06em}
.mn-a[aria-current]{color:var(--red-hover)}
@media (hover:hover) and (pointer:fine){.mn-list:hover .mn-a{opacity:.45}}
.mn-list .mn-a:focus-visible{opacity:1}@media (hover:hover) and (pointer:fine){.mn-list .mn-a:hover{opacity:1}}
.mn-a .mn-m>.mn-rv{transition:translate .5s var(--e-out)}
@media (hover:hover) and (pointer:fine){.mn-a:hover .mn-m>.mn-rv{translate:16px 0}}
.mn-foot{display:flex;flex:none;align-items:flex-end;gap:56px;padding-top:28px;border-top:1px solid rgba(243,243,239,.14)}
.mn-col{display:grid;gap:4px}
.mn-lbl{color:rgba(243,243,239,.55);font-size:13px;line-height:1.4}
.mn-c{color:inherit;text-decoration:none;font-size:var(--fs-sm);line-height:1.45}
@media (hover:hover) and (pointer:fine){a.mn-c:hover{text-decoration:underline;text-underline-offset:4px}}
.mn-cta-w{margin-left:auto;padding:2px}
.mn :focus-visible{outline-color:var(--paper)}

html:not(.js) .nv-menu,html:not(.js) .mn,html.rf-nogsap .nv-menu,html.rf-nogsap .mn{display:none}
@media (max-width:1023px){
  .nv-bar{height:76px}
  .nv-under{background:rgba(243,243,239,.94);-webkit-backdrop-filter:none;backdrop-filter:none}
  html.nv-inv .nv-under{background:rgba(14,14,14,.9)}
  html.nv-hide:not(.is-menu) .nv-bar{transform:translateY(-88px)}
  .nv-logo{top:25px}
  .nv-r{top:14px;gap:8px}
  .nv-pill{height:48px;padding-left:18px;gap:12px}
  .nv-ic{width:38px;height:38px}
  .nv-cta .nv-roll{display:none}
  .nv-cta{padding-left:5px}
  .mn-p{left:0;top:0;bottom:0;width:100%;padding:96px 24px 28px;border-radius:0;transform:none}
  .mn-head{display:none}
  html.is-menu .nv-logo .lg-ink{opacity:0}
  html.is-menu .nv-logo .lg-paper{opacity:1}
  .mn-a{font-size:clamp(34px,10vw,48px)}
  .mn-foot{flex-wrap:wrap;gap:20px 32px}
  .mn-cta-w{margin-left:0;width:100%}
  .mn-cta{width:100%}
}


/* R8-B (19.10): pigułka "Realizacje" zamiast "Wycena". Na telefonie (kółko ze strzałką 48 px) jej lewa krawędź wchodziła w logo
   (390: 178 przy końcu logo 175, 360: 148). Do 440 px: mniejsze odstępy w pigułkach i między nimi (logo bez zmian);
   poniżej 390 px dodatkowo napis Menu 12 px i logo do 37vw (360: 133 px), pionowo na tym samym środku. Pomiar w qa-R8B. */
@media (max-width:440px){
  .nv-r{gap:6px}
  .nv-pill{padding-left:14px;gap:8px}
  .nv-cta{padding-left:5px}
}
@media (max-width:389px){
  .nv-pill{font-size:12px;letter-spacing:.04em}
}
/* R8-B2 (19.10): luz mierzony po pikselach liter logo do białej obwódki pigułki (>= 12 px). Szerokość logo liczona od FAKTYCZNEJ
   szerokości paska nagłówka (% od .nv-bar, bez paska przewijania; vw go wlicza i w oknie z klasycznym paskiem przewijania przycisk
   wchodził na logo). Rezerwa 240 px = lewy margines 20 + luz ~20 + grupa przycisków ~182 + prawy margines 20. Pudełko logo zostaje
   26 px wysokie (top 25), obraz skaluje się w nim (contain, do lewej, środek pionowy 38 px bez zmian). Litery kończą się na prawej
   krawędzi obrazu. Telefon 360: logo 120 px, 375: 135, 390: 150, 414 i szerzej: 155. */
@media (max-width:440px){
  .nv-logo{width:min(155px,calc(100% - 240px))}
  .nv-logo img{width:100%;height:100%;object-fit:contain;object-position:left center}
}

/* KOREKTA 5: przycisk "Zapytaj o wycenę" w menu: tekst na środku wysokości (było inline-block z line-height 15 px, tekst przy górnej krawędzi) */
.mn-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 28px;line-height:1;white-space:nowrap}
.mn-cta .arr{display:inline-block;line-height:1}

/* R23-A: dłuższa nazwa „Projekty i Realizacje” w menu rozwijanym mieści się w jednej linii także na 320 px */
@media (max-width:359px){.mn-a{font-size:30px}}