/* Sylveco Strefa wiedzy - header additions (scoped to .sq-hdr-*) */
.site-header .tools a.sq-hdr-fav { position: relative; }
.site-header .sq-hdr-fav.has-items svg { fill: #d4202c; stroke: #d4202c; }
.site-header .sq-hdr-fav__n { position: absolute; top: 3px; right: 1px; min-width: 16px; height: 16px; padding: 0 4px; background: #0e0e0e; color: #fff; font-weight: 500; font-size: 10px; line-height: 16px; font-family: inherit; text-align: center; text-shadow: none; letter-spacing: 0; pointer-events: none; }
.site-header .sq-hdr-fav__n[hidden] { display: none; }
.site-header:not(.solid) .sq-hdr-fav__n { background: #fff; color: #0e0e0e; }
.nav-item.sq-hdr-nav.is-current > .nav-link::before { transform: scaleX(1); }
@media (max-width: 1020px) {
  .nav-item.sq-hdr-nav.is-current > .nav-link { font-weight: 700; }
}

/* Zone pages: the theme header is sticky (in flow) on solid/no-hero pages, so the shell must not reserve --hh again. */
body.sq-zone .sq-previewbar { margin-top: 0; }
body.sq-zone .sq-app { padding-top: 24px; }

/* The extra menu item must not push the last link under the search field on 1021-1500px desktops. */
@media (min-width: 1021px) and (max-width: 1500px) {
  .site-header .nav-top:has(.sq-hdr-nav) { gap: clamp(8px, 1vw, 20px); }
  .site-header .nav-top:has(.sq-hdr-nav) .nav-trigger,
  .site-header .nav-top:has(.sq-hdr-nav) .nav-link { letter-spacing: .04em; font-size: .6875rem; }
  .site-header .header-in:has(.sq-hdr-nav) { gap: clamp(12px, 1.6vw, 40px); }
}

/* Top bar */
.sq-topbar { display: flex; align-items: center; justify-content: center; gap: 16px; min-height: 30px; padding: 4px 16px; background: rgba(255, 255, 255, .78); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #0e0e0e; font-size: 12.8px; font-weight: 400; line-height: 1.3; font-family: inherit; text-decoration: none; text-align: center; position: relative; z-index: 60; }
.sq-topbar:hover { color: #0e0e0e; background: rgba(243, 243, 243, .88); }
/* na stronach ze zdjęciem w tle (nagłówek fixed) pasek leży na zdjęciu, więc przezroczystość jest widoczna */
.sq-topbar--over { position: absolute; top: 0; left: 0; right: 0; }
/* zdjęcie zaczyna się pod paskiem, więc przyciski slajdów schodzą o jego wysokość (bez zmiany ich położenia względem nagłówka) */
html .hero-dots { top: calc(var(--hh) + var(--sq-bar, 0px) + 20px); }
.sq-topbar__go { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.sq-topbar svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.8; }
@media (max-width: 600px) { .sq-topbar { justify-content: space-between; text-align: left; } }