/* Wspólny pasek Znajdowalni nad każdym demo w /szablony. To nasza ramka, nie część strony klienta:
   kolory z marki Znajdowalni (limonka i grafit), przyklejony u góry. Menu demo przykleja się pod nim
   (top: var(--zn-pasek-h)); pasek-demo.js ustawia tę zmienną na rzeczywistą wysokość paska. */
:root{--zn-pasek-h:48px}
html{scroll-padding-top:calc(var(--zn-pasek-h) + var(--zn-naglowek, 84px))}
.zn-pasek{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:center;gap:18px;min-height:48px;margin:0;padding:7px 16px;background:#B9F24A;color:#121416;font:500 15px/1.35 Montserrat,"Segoe UI",Arial,sans-serif;text-align:left;box-shadow:0 1px 0 rgba(18,20,22,.25)}
.zn-pasek-tekst{margin:0}
.zn-pasek-tekst strong{font-weight:800}
.zn-pasek-cta{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 14px;background:#121416;color:#B9F24A;border-radius:2px;font:700 14px/1.2 Montserrat,"Segoe UI",Arial,sans-serif;text-decoration:none;white-space:nowrap}
.zn-pasek-cta:hover{background:#000;color:#fff}
.zn-pasek-cta:focus-visible{outline:3px solid #121416;outline-offset:3px}
.zn-pasek-krotko{display:none}
@media (max-width:600px){
  .zn-pasek{justify-content:space-between;gap:12px;padding:7px 12px;font-size:14px}
  .zn-pasek-dlugo{display:none}
  .zn-pasek-krotko{display:inline}
  .zn-pasek-cta{padding:8px 11px;font-size:13.5px}
}
@media print{.zn-pasek{position:static}}