/* ==========================================================================
   PASEK MASTER — wspólny pasek nawigacji dla każdego landing page i projektu
   Standard nawigacji i UX — wersja 6 (19.10.2026). Jeden plik CSS dla
   MotorsAgent, MotorsBot i każdego innego projektu (z dofinansowaniem UE lub bez).
   Motyw: atrybut data-theme="dark" | "light" na <html> (ustawia pasek_master.js).
   Pasek kompaktowy (menu) poniżej 1200 px szerokości okna.
   ========================================================================== */

:root{
  --pm-font: "Manrope", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --pm-mono: "Space Mono", "JetBrains Mono", "SFMono-Regular", Menlo, monospace;
  --pm-eu-font: "Ubuntu", "Verdana", "Tahoma", "Arial", sans-serif;   /* zał. IX pkt 1.3 */
  --pm-h: 62px;                /* wysokość paska */
  --pm-logo-h: 34px;           /* wysokość logo = wysokość flagi UE (zał. IX pkt 1.7) */
  --pm-flag-w: 51px; --pm-flag-h: 34px;
  --pm-z: 100;
  /* motyw ciemny (domyślny) */
  --pm-bg: rgba(14,14,16,.82); --pm-fg: #F5F5F6; --pm-fg2: rgba(245,245,246,.74);   /* ciemny: #0E0E10 · 82 % + rozmycie */
  --pm-line: rgba(255,255,255,.10); --pm-hover: rgba(255,255,255,.09);
  --pm-act-bg: #FFFFFF; --pm-act-fg: #111214;
  --pm-tip-bg: #26282D; --pm-tip-fg: #FFFFFF;
  --pm-pop-bg: #16171A; --pm-pop-fg: #F5F5F6; --pm-pop-line: rgba(255,255,255,.14);
  --pm-drw-bg: #0E0E10; --pm-drw-fg: #F5F5F6; --pm-drw-mut: rgba(245,245,246,.62); --pm-drw-line: rgba(255,255,255,.08);
  --pm-focus: #B4E053;
  --pm-flag-outline: rgba(255,255,255,.9);
  --pm-brand: #CC4200;          /* nadpisuje pasek_master.js z konfiguracji marki */
}
html[data-theme="light"]{
  --pm-bg: #EBEBEB; --pm-fg: #16171A; --pm-fg2: rgba(22,23,26,.72);   /* tło jasnoszare, pełne — decyzja z 19.10.2026 (U56) */
  --pm-line: rgba(0,0,0,.09); --pm-hover: rgba(0,0,0,.05);
  --pm-act-bg: #16171A; --pm-act-fg: #FFFFFF;
  --pm-tip-bg: #16171A; --pm-tip-fg: #FFFFFF;
  --pm-pop-bg: #FFFFFF; --pm-pop-fg: #16171A; --pm-pop-line: rgba(0,0,0,.12);
  --pm-drw-bg: #FFFFFF; --pm-drw-fg: #16171A; --pm-drw-mut: rgba(22,23,26,.60); --pm-drw-line: rgba(0,0,0,.08);
  --pm-focus: #C2410C;
  --pm-flag-outline: rgba(0,0,0,.18);
}
html[data-contrast="high"]{ --pm-fg2: var(--pm-fg); --pm-line: rgba(255,255,255,.35); }
html[data-theme="light"][data-contrast="high"]{ --pm-line: rgba(0,0,0,.4); }

/* ---------- pasek ---------- */
.pm-bar{position:sticky;top:0;z-index:var(--pm-z);height:var(--pm-h);display:flex;align-items:center;gap:6px;padding-inline:16px;
  background:var(--pm-bg);color:var(--pm-fg);border-bottom:1px solid var(--pm-line);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-family:var(--pm-font);box-sizing:border-box}
.pm-bar *, .pm-bar *::before, .pm-bar *::after{box-sizing:border-box}
.pm-skip{position:absolute;left:-9999px;top:8px;z-index:calc(var(--pm-z) + 5);background:var(--pm-act-bg);color:var(--pm-act-fg);padding:10px 14px;border-radius:8px;font:700 14px var(--pm-font)}
.pm-skip:focus{left:12px}
.pm-logo{display:inline-flex;align-items:center;padding:3px 6px;border-radius:8px;color:var(--pm-fg);text-decoration:none;white-space:nowrap;transition:opacity .2s}
.pm-logo:hover{opacity:.9}
.pm-logo svg{height:var(--pm-logo-h);width:auto;display:block;fill:currentColor}
.pm-logo img{height:var(--pm-logo-h);width:auto;display:block}
.pm-logo img.pm-img-light{display:none}
html[data-theme="light"] .pm-logo img.pm-img-dark{display:none}
html[data-theme="light"] .pm-logo img.pm-img-light{display:block}
.pm-logo .pm-wordmark{font:800 20px/1 var(--pm-font);letter-spacing:-.01em}
.pm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pm-spacer{flex:1}
.pm-grp{display:flex;align-items:center;gap:2px}
.pm-sep{width:1px;height:24px;background:var(--pm-line);margin-inline:6px}

/* ikona (pole 44 × 44) */
.pm-ib{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:10px;color:var(--pm-fg2);background:transparent;border:0;cursor:pointer;position:relative;text-decoration:none;padding:0;font:inherit}
.pm-ib:hover{background:var(--pm-hover);color:var(--pm-fg)}
.pm-ib:focus-visible, .pm-eu:focus-visible, .pm-logo:focus-visible{outline:2px solid var(--pm-focus);outline-offset:2px}
.pm-ib svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pm-ib svg.pm-color{stroke:none;fill:none}          /* ikony kolorowe (Google Play) — bez obrysu */
.pm-ib svg.pm-gplay{width:23px;height:23px}
.pm-ib img{display:block;width:26px;height:26px}
.pm-ib img.pm-img-light{display:none}
html[data-theme="light"] .pm-ib img.pm-img-dark{display:none}
html[data-theme="light"] .pm-ib img.pm-img-light{display:block}
.pm-ib[data-tip]:hover::after, .pm-ib[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);
  background:var(--pm-tip-bg);color:var(--pm-tip-fg);font:600 12px/1 var(--pm-font);padding:7px 9px;border-radius:6px;white-space:nowrap;z-index:40;pointer-events:none}
.pm-ib[aria-expanded="true"]::after{display:none!important}
.pm-ib[aria-current="page"], .pm-ib[aria-current="page"]:hover{background:var(--pm-act-bg);color:var(--pm-act-fg)}   /* ikona aktywna — odwrócone kolory */
.pm-ib.pm-lang{width:auto;padding-inline:10px;gap:6px;display:inline-flex;align-items:center;font-weight:700;font-size:13px}
.pm-ib.pm-burger{display:none}

/* ---------- znak UE „Dofinansowane przez Unię Europejską” — wariant 2 (flaga po lewej, tekst po prawej) ---------- */
.pm-eu{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 8px 0 7px;margin-left:2px;border-radius:9px;color:var(--pm-fg);text-decoration:none;white-space:nowrap;flex:none}
.pm-eu:hover{background:var(--pm-hover)}
.pm-eu .pm-flag{width:var(--pm-flag-w);height:var(--pm-flag-h);flex:none;outline:1px solid var(--pm-flag-outline);outline-offset:0;border-radius:1px;display:block}
.pm-eu .pm-eut{font:700 10px/1.18 var(--pm-eu-font);letter-spacing:0;text-align:left}
html[data-eu="off"] .pm-eu{display:none}

/* ---------- pasek kompaktowy (telefon / wąskie okno) ---------- */
@media (max-width: 1199.98px){
  .pm-bar .pm-grp, .pm-bar .pm-sep, .pm-bar .pm-theme{display:none}
  .pm-ib.pm-burger{display:grid}
  .pm-bar{padding-inline:10px}
  .pm-logo{padding:3px 2px}
  .pm-logo svg, .pm-logo img{height:30px}
  .pm-eu{flex-direction:column;gap:2px;height:auto;padding:3px 4px;margin-left:0}
  .pm-eu .pm-flag{width:45px;height:30px}
  .pm-eu .pm-eut{font-size:7.5px;line-height:1.15;text-align:center}
}

/* ---------- menu na telefonie ---------- */
.pm-drawer{position:fixed;left:0;right:0;top:var(--pm-h);z-index:calc(var(--pm-z) - 1);background:var(--pm-drw-bg);color:var(--pm-drw-fg);border-bottom:1px solid var(--pm-drw-line);
  max-height:calc(100vh - var(--pm-h));overflow-y:auto;padding:8px 14px 18px;box-shadow:0 20px 40px rgba(0,0,0,.35);font-family:var(--pm-font)}
.pm-drawer[hidden]{display:none}
.pm-drawer h4{margin:16px 6px 6px;font:600 11px/1 var(--pm-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--pm-drw-mut)}
.pm-drawer .pm-it{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;width:100%;min-height:52px;padding:4px 8px 4px 0;border:0;border-radius:12px;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer;text-decoration:none}
.pm-drawer .pm-it:hover{background:var(--pm-hover)}
.pm-drawer .pm-ico{width:44px;height:44px;display:grid;place-items:center}
.pm-drawer .pm-ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pm-drawer .pm-ico svg.pm-color{stroke:none}
.pm-drawer .pm-ico img{width:26px;height:26px}
.pm-drawer .pm-ico img.pm-img-light{display:none}
html[data-theme="light"] .pm-drawer .pm-ico img.pm-img-dark{display:none}
html[data-theme="light"] .pm-drawer .pm-ico img.pm-img-light{display:block}
.pm-drawer .pm-nm{font-weight:700;font-size:15px;line-height:1.25}
.pm-drawer .pm-ds{display:block;font-weight:500;font-size:12.5px;color:var(--pm-drw-mut);line-height:1.35}
.pm-drawer .pm-ex{width:16px;height:16px;fill:none;stroke:var(--pm-drw-mut);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pm-drawer .pm-it[aria-current="page"] .pm-nm{text-decoration:underline;text-underline-offset:4px}
.pm-drawer .pm-gbadge{display:block;width:135px;height:40px;margin-top:5px}
.pm-drawer .pm-gbadge svg, .pm-drawer .pm-gbadge img{width:135px;height:40px;display:block}
.pm-drawer .pm-it.pm-gpit{min-height:72px}
.pm-drawer .pm-hello{padding:6px 8px 2px;color:var(--pm-drw-mut);font-size:13.5px}
.pm-drawer .pm-hello b{color:var(--pm-drw-fg)}
.pm-drawer .pm-row{display:flex;gap:6px;flex-wrap:wrap;padding:4px 8px}
.pm-drawer .pm-row button{font:600 12.5px/1 var(--pm-font);padding:10px 11px;border-radius:8px;border:1px solid var(--pm-drw-line);background:transparent;color:inherit;cursor:pointer;min-height:40px}
.pm-drawer .pm-row button[aria-pressed="true"]{background:var(--pm-hover);border-color:currentColor}

/* ---------- okienka (dostępność, język) ---------- */
.pm-pop{position:fixed;top:calc(var(--pm-h) + 6px);right:12px;z-index:calc(var(--pm-z) + 2);min-width:250px;border-radius:12px;padding:14px;display:grid;gap:10px;background:var(--pm-pop-bg);color:var(--pm-pop-fg);border:1px solid var(--pm-pop-line);box-shadow:0 18px 40px rgba(0,0,0,.30);font:13px var(--pm-font)}
.pm-pop[hidden]{display:none}
.pm-pop h4{margin:0;font:600 11px/1 var(--pm-mono);letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.pm-pop .pm-row{display:flex;gap:6px;flex-wrap:wrap}
.pm-pop button{font:600 12.5px/1 var(--pm-font);padding:10px 11px;border-radius:8px;border:1px solid var(--pm-pop-line);background:transparent;color:inherit;cursor:pointer;min-height:40px}
.pm-pop button[aria-pressed="true"], .pm-pop button[aria-current="true"]{background:var(--pm-hover);border-color:currentColor}
.pm-pop .pm-list{display:grid;gap:6px}
.pm-pop .pm-list button{text-align:left}

/* ---------- okno znaku UE ---------- */
.pm-eumask{position:fixed;inset:0;z-index:calc(var(--pm-z) + 10);background:rgba(0,0,0,.55);display:grid;place-items:start center;padding:70px 14px 20px;overflow:auto}
.pm-eumask[hidden]{display:none}
.pm-eudlg{position:relative;width:min(720px,100%);background:#fff;color:#16171A;border-radius:14px;padding:22px 24px 24px;box-shadow:0 30px 80px rgba(0,0,0,.45);display:grid;gap:14px;font-family:var(--pm-font)}
.pm-eudlg .pm-strip{display:block;width:100%;max-width:640px;height:auto;margin:0 auto}
.pm-eudlg h3{margin:0;font-size:17px;line-height:1.3}
.pm-eudlg p{margin:0;font-size:13.5px;line-height:1.5;color:#2a2f3a}
.pm-eudlg .pm-kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:13.5px}
.pm-eudlg .pm-kv b{color:#16171A}
.pm-eudlg .pm-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;border-radius:8px;background:#f1f3f7;font-size:20px;cursor:pointer}
.pm-eudlg .pm-lk{font-size:12.5px;color:#4a5568}

/* ---------- stopka (opcjonalna; wariant 'home' = stopka 1, 'links' = stopka 2) ---------- */
.pm-footer{font-family:var(--pm-font);border-top:1px solid var(--pm-line);padding:32px 24px 26px;color:var(--pm-fg);background:transparent}
.pm-footer .pm-fgrid{display:grid;grid-template-columns:300px 1fr;gap:28px;align-items:start;max-width:1200px;margin:0 auto}
.pm-footer .pm-fstrip{background:#fff;border-radius:8px;padding:10px 12px;outline:1px solid rgba(0,0,0,.08);width:300px;max-width:100%}
.pm-footer .pm-fstrip img{display:block;width:100%;height:auto}
.pm-footer h3{margin:0 0 8px;font:800 15px/1.3 var(--pm-font)}
.pm-footer p{margin:0 0 6px;font:13px/1.5 var(--pm-font);color:var(--pm-fg2)}
.pm-footer .pm-flinks{display:flex;flex-wrap:wrap;gap:6px 18px;max-width:1200px;margin:18px auto 0;font:12.5px/1.4 var(--pm-font);color:var(--pm-fg2)}
.pm-footer .pm-flinks a{color:inherit;text-decoration:none}
.pm-footer .pm-flinks a:hover{text-decoration:underline}
html[data-eu="off"] .pm-footer .pm-fgrid, html[data-eu="off"] .pm-footer .pm-eu-link{display:none}
@media (max-width: 760px){ .pm-footer .pm-fgrid{grid-template-columns:1fr} .pm-footer .pm-fstrip{width:min(360px,100%)} }

/* rozmiar tekstu z panelu dostępności (ustawiany na <html>) */
html[data-fs="115"]{font-size:115%} html[data-fs="130"]{font-size:130%}
@media (prefers-reduced-motion: reduce){ .pm-logo{transition:none} }