/* Nowy Świat 33 — rdzeń wszystkich stron (rozszerza site.css): paleta i tokeny, górny pasek, nawigacja i menu mobilne, stopka,
   baner cookies, przyciski, typografia, FAQ, wspólne bloki podstron, dokumentów, bloga i mapy strony.
   Sekcje tylko strony głównej i cennika są w ns33-cennik.css i ns33-home.css (inc/assets.php ładuje je po tym pliku) —
   reguła używana też na innych stronach należy tutaj; przy przenoszeniu reguł między plikami zachowaj kolejność kaskady. */
/* ===================== PALETA NS33 — jedyne źródło kolorów (brief kolorystyczny 19.10.2026) =====================
   Role: granat = tekst i hierarchia · niebieski = główna akcja zakupowa (ograniczony zasób) · zieleń = oszczędność i sukces
   · złoto = tylko pakiet Gold i gwiazdki ocen · czerwień = błędy. Nie dodawaj nowych odcieni poza tą listą. */
:root,.po{   /* .po: site.css definiuje zmienne na .po, więc paleta musi je nadpisać na tym samym poziomie */
  --color-navy:#0A1B3D;
  --color-primary:#2563FF;
  --color-primary-hover:#1D4FE0;     /* także niebieski tekst na jasnoniebieskim tle (kontrast ≥ 4,5:1) */
  --color-primary-soft:#EEF3FF;
  --color-background:#F6F8FB;
  --color-surface:#FFFFFF;
  --color-text:#0A1B3D;
  --color-text-secondary:#4A5878;
  --color-border:#D7DEEA;
  --color-success:#0F6B45;
  --color-success-soft:#E8F6EE;
  --color-gold:#F4C95D;
  --color-gold-strong:#B7791F;
  --color-gold-soft:#FFF9E8;
  --color-error:#B42318;
  --color-error-soft:#FDECEA;
  /* pochodne funkcjonalne (uzasadnione odstępstwa, opisane w CZYTAJ-MNIE) */
  --color-gold-card:#FFFDF6;          /* tło karty Gold */
  --color-gold-line:rgba(183,121,31,.35);
  --color-star:#F6B800;               /* gwiazdki ocen (z obrysem gold-strong dla kontrastu 3:1) */
  --color-border-strong:#7E8BA5;      /* granice kontrolek (pola, radio) — kontrast ≥ 3:1 */
  --color-primary-line:#C9D7FF;       /* ramka elementów na tle primary-soft */
  --color-success-line:rgba(15,107,69,.20);
  --color-error-text:#7A1A12;
  --color-error-line:#F3C1BC;
  --color-navy-hover:#13295A;
  --color-on-dark:#FFFFFF;
  --color-on-dark-muted:#E6EEFF;      /* tekst drugorzędny na granacie */
  --color-on-dark-icon:#A9C3FF;       /* ikony i detale na granacie */
  --color-on-dark-line:rgba(169,195,255,.45);
  /* zmienne systemu Glass Duo (site.css) przepięte na paletę NS33 */
  --bg:var(--color-background); --ink:var(--color-navy); --surface:var(--color-surface); --text:var(--color-text);
  --acc:var(--color-primary); --acc-hover:var(--color-primary-hover); --lime:var(--color-primary); --lime-hover:var(--color-primary-hover);
  --muted:var(--color-text-secondary); --muted-inv:var(--color-on-dark-muted); --border:var(--color-border); --control:var(--color-border-strong);
  --ok:var(--color-success); --err:var(--color-error); --tint:var(--color-navy); --tint-ink:var(--color-on-dark);
  /* „szkło” sekcji odwróconych: granat zamiast niebieskiego — niebieski zostaje dla przycisków zakupowych */
  --glass-b:linear-gradient(155deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,0) 34%),linear-gradient(135deg,#132B5E,var(--color-navy));
}
body{margin:0;background:var(--color-background)}
/* jak na kanwie pozycja.online: jednolite tło var(--color-background), bez siatki */
.po{background:var(--color-background);background-image:none}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--color-navy);color:#fff;padding:10px 14px;border-radius:10px;font:600 15px Onest,system-ui,sans-serif}
.skip:focus{top:12px}
.center{text-align:center;margin-inline:auto}
[hidden]{display:none!important}
/* top bar */
.topbar{font-size:14px;color:var(--muted)}
.topbar-in{display:flex;justify-content:space-between;align-items:center;min-height:44px;gap:16px}
.tb-l{list-style:none;margin:0;padding:0;display:flex;gap:20px;align-items:center}
.tb-l a,.tb-l span{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--muted);white-space:nowrap}
.tb-l a:hover{color:var(--ink)}
.tb-l .ic{width:16px;height:16px}
.tb-r{display:flex;align-items:center;gap:20px}
/* separatory „|” między informacjami */
.topbar .tb-l>li+li,.topbar .tb-r>*+*{border-left:1px solid var(--color-border);padding-left:20px}
.tb-l a,.tb-l span{min-height:36px}
.tb-link{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0;border:0;background:none;color:var(--muted);font:500 14px/1 Onest,system-ui,sans-serif;text-decoration:none;cursor:pointer;white-space:nowrap}
.tb-link:hover{color:var(--ink)}
.tb-link .ic{width:16px;height:16px}
.tb-link[aria-expanded="true"] .ic{transform:rotate(180deg)}
.topbar .dd-panel{top:calc(100% + 6px)}
.nav{padding-top:6px}
.logo{font-size:19px}
.nav-r{display:flex;align-items:center;gap:8px}
/* dropdowny w nawigacji */
.dd{position:relative}
.dd-panel{position:absolute;left:0;top:calc(100% + 14px);min-width:280px;padding:8px;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--color-border);box-shadow:0 24px 50px -24px rgba(10,27,61,.35);z-index:45;animation:po-fade .18s ease}
.dd-panel a{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px;border-radius:10px;text-decoration:none;color:var(--ink);font-weight:500;font-size:15px}
.dd-panel a:hover{background:color-mix(in srgb,var(--color-primary) 8%,transparent)}
.dd-panel a .ic{width:18px;height:18px;color:var(--acc)}
.dd-panel a b{display:grid;place-items:center;width:32px;height:24px;border-radius:6px;background:var(--color-primary-soft);font-size:12px}
.dd-panel a[aria-current] b{background:var(--acc);color:#fff}
.nav-link[aria-expanded="true"] .ic{transform:rotate(180deg)}
.nav-link .ic{transition:transform .2s}
.drawer a .ic{width:18px;height:18px}
/* aktywna sekcja w menu (podświetlenie podczas przewijania) */
.nav-links .nav-link{position:relative}
.nav-links .nav-link[aria-current]::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;border-radius:2px;background:var(--acc)}
/* wyszukiwarka */
.nav-cta .ic{width:18px;height:18px}
/* menu mobilne: „Dla kogo?” rozwijane, wybór języka */
.drawer a.btn{justify-content:center;gap:10px}
.drawer a.btn .ic{color:#fff}
.drawer-c{margin-top:14px!important;font-size:14px;color:var(--muted)}
.drawer .drawer-c a{display:inline;min-height:0;border:0;font:500 14px Onest,system-ui,sans-serif;color:var(--ink)}
/* hero */
.btn .ic{width:20px;height:20px}
.star{width:18px;height:18px}
/* faq */
.acc summary{font-size:17px;line-height:24px}
.acc-body p+p,.acc-body p+ul,.acc-body ul+p{margin-top:10px}
.acc-body b{color:var(--ink)}
/* kontakt */
textarea.input{padding:14px 16px;min-height:140px;resize:vertical}
.input[aria-invalid="true"]{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
/* responsywność */
@container po (max-width:1279px){.nav-links .nav-link{padding:0 10px}
.nav-links .nav-link[aria-current]::after{left:10px;right:10px}
.nav-in{gap:16px}}
@container po (max-width:1023px){.nav-r .btn--sec{display:none}
.tb-addr{display:none}}
@container po (max-width:767px){.topbar{display:none}
.nav-r{gap:2px}
.nav-r .btn--lime{padding:0 14px;font-size:14px;min-height:44px}
.nav-cta .ic{display:none}
.logo{font-size:17px;gap:8px}
.nav .logo>span:nth-child(2){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.acc summary{font-size:16px}}
@media (prefers-reduced-transparency:reduce){.dd-panel{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}
/* menu mobilne: wyszukiwarka jako pozycja menu */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}
*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
@container po (max-width:767px){/* nagłówek: logo | Wybierz pakiet | ☰ */
.nav-r .dd{position:static}
.nav-in{position:relative}}
/* nagłówek: granatowe linki, hover var(--color-primary-hover), aktywny var(--color-primary), bez kolorowych teł pod pozycjami */
.po .nav-link{color:var(--color-navy)}
.po .nav-link:hover{background:none;color:var(--color-primary-hover)}
.nav-links .nav-link[aria-current]{color:var(--color-primary)}
.po .nav-cta:hover{background:var(--color-primary-hover)}
.tb-l .ic,.tb-link .ic{color:var(--color-text-secondary)}
.drawer a .ic{color:var(--color-navy)}
/* przyciski: jedna dominująca akcja (niebieski), drugorzędne bez wypełnienia */
.po .btn--lime{background:var(--color-primary);color:var(--color-on-dark)}
.po .btn--lime:hover{background:var(--color-primary-hover)}
.po .btn--sec{background:var(--color-surface);color:var(--color-navy);border:1.5px solid var(--color-navy)}
.po .btn--sec:hover{background:var(--color-background);border-color:var(--color-navy)}
.po .eyebrow{color:var(--color-text-secondary)}
.star,.stars-r .star,.rvc-stars svg{fill:var(--color-star);stroke:var(--color-gold-strong);stroke-width:2;stroke-linejoin:round;paint-order:stroke}
/* FAQ: granatowe pytania i ikony, odpowiedzi #4A5878, hover/focus niebieski, rozwinięte pytanie na bardzo jasnym tle */
.po .acc summary{color:var(--color-navy)}
.acc summary .ic{color:var(--color-navy)}
.po .acc summary:hover,.po .acc summary:hover .ic{color:var(--color-primary)}
.acc-body{color:var(--color-text-secondary)}
/* P0: przewijanie do kotwic — tytuł sekcji pod przyklejonym nagłówkiem (nagłówek kończy się ok. 74 px desktop / 66 px telefon) */
html{scroll-padding-top:92px}
@media (max-width:767px){html{scroll-padding-top:80px}}
/* ===================== KONWERSJA (20.10.2026): kolejność bezpieczeństwo → cennik → opinie, rytm tła, lżejsze sekcje ===================== */
.po{--kv-blue:#F2F6FF;--kv-card:#F7F9FC;--kv-line:var(--color-border)}
/* rytm: biały / bardzo jasny niebieski / … / granat (końcowe CTA) */
.po main > .sec{background:#FFFFFF}
.po #opinie,.po #faq{background:var(--kv-blue)}
.ua-flag{flex:none;width:44px;height:44px;border-radius:50%;background:linear-gradient(180deg,#0057B7 0 50%,#FFD700 50% 100%);box-shadow:inset 0 0 0 1px rgba(10,27,61,.1)}
/* --- FAQ: 900–960 px, wygodne wiersze, CTA po odpowiedziach --- */
.faq-wrap{max-width:960px}
.faq-box{padding:6px 28px;background:#FFFFFF;border:1px solid var(--kv-line)}
.faq-box .acc{border-top:0;border-bottom:1px solid var(--kv-line)}
.faq-box > .acc:last-of-type,.faq-more > .acc:last-child{border-bottom:0}
.po .faq-box .acc summary{min-height:60px;padding:16px 0;font-size:17px;line-height:1.4}
.po .faq-box .acc-body{padding:0 40px 20px 0;font-size:16px;line-height:1.65}
.po .ce-p{margin-top:16px;color:var(--color-on-dark-muted)}
.ce-btn{margin-top:32px}
/* --- Stopka: niska, 4 kolumny --- */
.foot{padding:48px 0 28px;background:var(--color-navy);color:var(--color-on-dark-muted);font-size:14.5px;line-height:1.5}
.foot-grid--4{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:28px}
.foot-col{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.po .foot .eyebrow{margin-bottom:4px;color:var(--color-on-dark-icon)}
.foot a{color:#FFFFFF;text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot :focus-visible{outline:2px solid #FFFFFF;outline-offset:2px}
.foot .logo{margin-bottom:10px;color:#FFFFFF}
.foot-co{display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.po .foot-bot{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16);font-size:13px;color:var(--color-on-dark-muted)}
@container po (max-width:1023px){.foot-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container po (max-width:767px){.faq-box{padding:4px 20px}
.po .faq-box .acc summary{min-height:56px;font-size:16px}
.po .faq-box .acc-body{padding-right:0;font-size:15.5px}
.ce-btn{width:100%}
.foot{padding:40px 0 calc(28px + 80px)}}
@container po (max-width:479px){.foot-grid--4{grid-template-columns:minmax(0,1fr)}}
.foot .logo b{color:var(--color-on-dark-icon)}
.kt-maplinks .btn .ic{width:16px;height:16px}
.mj-cta .btn .ic{width:20px;height:20px}
@container po (max-width:767px){.mj-cta .btn{width:100%}}
/* Ikony treści: kafelki iOS w kolorach strony (21.10.2026, 12:59) – Framework7 Icons (MIT), wzorowane na SF Symbols.
   Kolor = temat: zielony bezpieczeństwo/„w pakiecie”, złoty cena, czerwony powiadomienie/adres/kalendarz, niebieski dokumenty/poczta, fiolet ludzie/czas. */
[data-k="shield"]{--c1:#16A34A}
[data-k="check"]{--c1:#16A34A}
[data-k="phone"]{--c1:#16A34A}
[data-k="save"]{--c1:#16A34A}
[data-k="calendar"]{--c1:#F0444B}
[data-k="pin"]{--c1:#F0444B}
[data-k="bell"]{--c1:#F0444B}
[data-k="ret"]{--c1:#0EA5E9}
[data-k="tram"]{--c1:#0EA5E9}
[data-k="globe"]{--c1:#0EA5E9}
[data-k="tag"]{--c1:#F5A524}
[data-k="award"]{--c1:#F5A524}
[data-k="star"]{--c1:#F5A524}
[data-k="card"]{--c1:#F5A524}
[data-k="idea"]{--c1:#F5A524}
[data-k="doc"]{--c1:var(--color-primary)}
[data-k="mail"]{--c1:var(--color-primary)}
[data-k="home"]{--c1:var(--color-primary)}
[data-k="users"]{--c1:#6D5DF5}
[data-k="clock"]{--c1:#6D5DF5}
[data-k="person"]{--c1:#6D5DF5}
[data-k="car"]{--c1:#6D5DF5}
[data-k="building"]{--c1:#13295A}
span.ios.ios{--s:var(--ic-md);display:inline-grid;place-items:center;flex:none;flex-direction:row;gap:0;width:var(--s);height:var(--s);margin-top:0;padding:0;border-radius:calc(var(--s) * .24);background:linear-gradient(180deg,color-mix(in srgb,var(--c1,var(--color-primary)) 80%,#FFFFFF),var(--c1,var(--color-primary)));color:#FFFFFF;box-shadow:0 1px 2px rgba(10,27,61,.12)}
span.ios.ios svg{display:block;width:calc(var(--s) * .58);height:calc(var(--s) * .58);padding:0;margin:0;border:0;border-radius:0;background:none;color:#FFFFFF;fill:currentColor}
/* Karty pakietów – progresja Standard → Gold → Platinum (21.10.2026, 18:30).
   Wysokość rośnie z zakresem; karty wyrównane do dołu, więc „Dzisiaj do zapłaty” i przyciski są na jednej linii.
   Gold zostaje najmocniej rekomendowany (złoto + główne CTA), Platinum jest największy, bo ma najszerszy zakres. */
[data-k="social"]{--c1:#6D5DF5}
@container po (max-width:767px){.hero__cta .btn--lg{width:100%}}
.tb-card{display:flex;align-items:center;justify-content:center;height:150px;padding:14px 10px;background:#FFFFFF;border:1px solid rgba(215,222,234,.75)}
@container po (max-width:1023px){/* 3 + 2 wyśrodkowane, każdy kafelek = 2 kolumny */
.tb-card{grid-column:span 2;height:128px}
.tb-card:nth-child(4){grid-column:2/span 2}}
@container po (max-width:767px){.tb-card,.tb-card:nth-child(4){grid-column:auto;height:108px;padding:12px 8px;border-radius:18px}}
/* =====================================================================
   SYSTEM UI (22.10.2026, visual polish) – jedno źródło dla siatki, rytmu, typografii, kart, cieni i przycisków.
   Skala odstępów: 8 / 12 / 16 / 24 / 32 / 48 / 64 / 88 / 96 px. Tokeny responsywne przełączane na .po-page.
   Wcześniejsze wartości tych samych selektorów zostały usunięte (css-dedupe) – nie dopisywać nadpisań wyżej.
   ===================================================================== */
:root,.po{
  --pad:24px;                                      /* = padding .nav-in: treść każdej sekcji na linii logo */
  --sec-y:88px; --sec-y-compact:48px;              /* sekcja standardowa / kompaktowa (pas UA) */
  --head-gap:48px;                                 /* nagłówek sekcji → zawartość */
  /* Skala typografii — jedna dla wszystkich stron (29.10.2026). Role, nie wartości: komponenty biorą rozmiar z tokenu,
     a progi kontenera zmieniają tylko tokeny. display = H1 strony docelowej, h2 = tytuł sekcji (i H1 stron prostych),
     h3l = podtytuł bloku / nazwa planu, h3 = tytuł karty, eyebrow = etykieta nad tytułem, badge = pigułka, lead = wstęp. */
  --fs-display:clamp(32px,2.6vw + 14px,52px); --lh-display:1.05; --ls-display:-.035em;
  --fs-h2:44px; --lh-h2:1.12; --fw-h2:800; --ls-h2:-.03em;
  --fs-h3l:26px; --lh-h3l:1.2; --ls-h3l:-.02em;
  --fs-h3:20px; --lh-h3:1.25; --ls-h3:-.01em;
  --fs-eyebrow:13px; --ls-eyebrow:.12em;
  --fs-badge:12px; --ls-badge:.08em;
  --fs-lead:18px; --lh-lead:1.55;
  --r-sm:14px; --r-card:20px; --r-lg:28px; --r-btn:10px;
  --ic-sm:28px; --ic-md:32px; --ic-lg:40px; --ic-xl:48px;   /* kafelki ikon: listy / feature / duże / wyróżnione */
  --sh-card:0 16px 32px -26px rgba(10,27,61,.34);
  --sh-emph:0 26px 52px -30px rgba(10,27,61,.42);
  --sh-frame:0 30px 60px -40px rgba(10,27,61,.32);
  --sh-dark:0 30px 60px -34px rgba(10,27,61,.6);
  --sh-btn:0 10px 24px -12px color-mix(in srgb,var(--color-primary) 55%,transparent);
}
@container po (max-width:1279px){.po-page{--fs-h2:40px}}
@container po (max-width:1023px){.po-page{--sec-y:64px;--head-gap:40px;--fs-h2:36px;--fs-h3l:24px;--r-lg:22px}}
@container po (max-width:767px){.po-page{--sec-y:48px;--sec-y-compact:32px;--head-gap:32px;--fs-h2:30px;--fs-h3l:22px;--fs-h3:18px;--fs-lead:16.5px;--r-lg:20px}}
@container po (max-width:379px){.po-page{--fs-display:30px;--fs-h2:27px}}
/* --- Rytm sekcji --- */
.po main > .sec{padding-block:var(--sec-y)}
.po #gratis,.po #miejsce,.po #pakiety,.po #opinie,.po #kontakt,.po #zamow{padding-block:var(--sec-y)}
/* Dwie białe sekcje pod rząd (pakiety → skanowanie): bez podwójnego odstępu, który czytał się jak dziura */
/* 30.10.2026: białe sekcje pod sobą (gratis → pakiety → poczta) z tym samym odstępem między treściami: 2 × --sec-y-compact */
.po #pakiety:has(+ #poczta){padding-bottom:var(--sec-y-compact)}
.po #pakiety + #poczta{padding-top:var(--sec-y-compact)}
/* --- Nagłówki sekcji: EYEBROW → H2 (12 px) → lead (16 px) → treść (--head-gap) --- */
.po .eyebrow{font-size:var(--fs-eyebrow);line-height:1.3;font-weight:800;letter-spacing:var(--ls-eyebrow);text-transform:uppercase}
.po .h2,.po .rv3 .h2,.po .ce-in .h2,.po .kt-top .h2,.po .tb-h{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-h2);letter-spacing:var(--ls-h2);text-wrap:balance}
.po .sec-head > .h2 + *{margin-top:16px}
.po .sec-head .bodyL,.po .rv3-lead,.po .ce-p{max-width:62ch;margin-inline:auto;font-size:var(--fs-lead);line-height:var(--lh-lead)}
/* --- Karty: BASE (--r-card, --sh-card), EMPHASIS (--sh-emph), DARK/MEDIA (--sh-dark), małe elementy w kartach (--r-sm) --- */
.tb-card,.rvc-card,.rv3 .rvc-card,.faq-box,.kt-form,.kt-map,.mj-room,.mj-key,.gal-item,.bn-card{border-radius:var(--r-card)}
.hero__promo,.hero__office-card,.hero__mail-card,.mj-hours li,.dd-panel{border-radius:var(--r-sm)}
/* --- Przyciski: primary 52 px, large primary 56 px; jeden radius, waga, ikona, cień --- */
.po .btn{border-radius:var(--r-btn);font-weight:700}
.po .btn--lg{min-height:56px;padding:0 28px;font-size:17px}
.po .btn--lime{box-shadow:var(--sh-btn)}
.po .btn .ic{width:20px;height:20px}
@container po (max-width:767px){.po .btn--lg{padding:0 18px}}
.foot-col a{display:inline-flex;align-items:center;min-height:28px}
@container po (max-width:767px){.foot-col a{min-height:40px}}
/* --- Social media (22.10.2026): stopka (główne miejsce), kontakt, link w „Realnym biurze”. Bez adresów w #ns33-social bloki są ukryte. --- */
.soc-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.soc-a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-navy);transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.soc-a svg{width:22px;height:22px;fill:currentColor}
.soc-a:hover{border-color:var(--color-primary);background:var(--color-primary-soft);color:var(--color-primary)}
.soc-a:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
.foot-soc{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.foot .soc-a{border-color:rgba(255,255,255,.24);background:transparent;color:#FFFFFF}
.foot .soc-a:hover{border-color:#FFFFFF;background:#FFFFFF;color:var(--color-navy)}
.foot .soc-a:focus-visible{outline-color:#FFFFFF}
@media (prefers-reduced-motion:reduce){.soc-a{transition:none}}
/* cennik zaraz po kompaktowej promocji – mniejszy odstęp górny */
.po #gratis + #pakiety{padding-top:var(--sec-y-compact)}
.rcm-src{display:inline-flex;min-height:40px;align-items:center;font-size:13.5px;font-weight:700;color:var(--color-primary-hover,#1D4ED8)}
.rcm-dot{width:10px;height:10px;padding:0;border:0;border-radius:50%;background:var(--color-border);cursor:pointer}
.rcm-dot[aria-current="true"]{background:var(--color-navy)}
.nav-links .nav-link[aria-current="page"]{font-weight:600}
.drawer a[aria-current="page"]{color:var(--color-primary)}
.drawer a[aria-current="page"] .ic{color:var(--color-primary)}
/* dwie długie pozycje menu (osoba fizyczna, Ukraińcy): krótkie pozycje, logo i CTA w jednej linii; długie – najwyżej 2 linie */
.nav-links .nav-link,.nav-in .logo,.nav-cta{white-space:nowrap}
@container po (min-width:1024px) and (max-width:1279px){.nav-links .nav-link{padding:0 8px}}
/* górny pasek: jasne tło, szaroniebieskie napisy, cienkie separatory, ikony liniowe */
.po .topbar{background:transparent;color:var(--color-text-secondary);font-size:14px}
.po .topbar-in{min-height:44px;gap:16px}
.po .tb-l{gap:0}
.po .tb-l>li{display:flex;align-items:center}
.po .tb-l>li+li{margin-left:18px;padding-left:18px;border-left:1px solid var(--color-border)}
.po .tb-l a,.po .tb-l span,.po .tb-link{color:var(--color-text-secondary);font-size:14px;font-weight:500}
.po .tb-l a:hover,.po .tb-link:hover{color:var(--color-navy)}
.po .tb-r{gap:0}
.po .tb-r>*+*{margin-left:18px;padding-left:18px;border-left:1px solid var(--color-border)}
.lang-btn .lang-cur{font-weight:700;color:var(--color-navy);letter-spacing:.02em}
.po .dd-chev{width:14px!important;height:14px!important;transition:transform .2s}
[aria-expanded="true"]>.dd-chev{transform:rotate(180deg)}
/* rozwijane panele (Dla kogo, język, panel klienta) – białe, zaokrąglone, delikatny cień */
.po .dd-panel{background:#FFFFFF;-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid var(--color-border);border-radius:16px;box-shadow:0 24px 48px -24px rgba(10,27,61,.32),0 2px 6px rgba(10,27,61,.04);padding:8px}
.po .dd-lang .dd-panel{left:auto;right:0;top:calc(100% + 6px);min-width:220px}
.po .lang-list{margin:0;padding:0;list-style:none;display:grid;gap:2px}
.po .lang-list a{display:flex;align-items:center;gap:12px;min-height:46px;padding:6px 12px;border-radius:10px;color:var(--color-navy);text-decoration:none;font-size:15px;font-weight:500}
.po .lang-list a:hover{background:var(--color-primary-soft)}
.po .lang-list a[aria-current]{background:var(--color-primary-soft);font-weight:600}
.lang-flag .flag{display:block;width:22px;height:15px;border-radius:3px;box-shadow:0 0 0 1px rgba(10,27,61,.12)}
.po .lang-nm{display:flex;flex-direction:column;flex:1;line-height:1.25}
.po .lang-nm small{font-size:12px;font-weight:400;color:var(--color-text-secondary)}
.po .lang-ck{width:18px;height:18px;color:var(--color-primary);stroke-width:2.4}
/* główna nawigacja: jeden biały kontener */
.po .nav-in{height:76px;padding:0 14px 0 26px!important;background:#FFFFFF;-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid rgba(10,27,61,.09);border-radius:18px;box-shadow:0 14px 34px -24px rgba(10,27,61,.28)}
.po .nav-links{gap:4px}
.po .nav-links .nav-link{padding:0 14px;font-size:16px;font-weight:500;min-height:44px}
.po .who-btn{gap:6px}
.po .who-btn[aria-expanded="true"],.po .who-btn[data-current]{color:var(--color-primary)}
.po .who-btn[aria-expanded="true"]::after,.po .who-btn[data-current]::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;border-radius:2px;background:var(--color-primary)}
.po .dd-who .dd-panel{left:-8px;top:calc(100% + 16px);width:372px;padding:6px}
.po .who-list{margin:0;padding:0;list-style:none}
.po .who-list li+li{border-top:1px solid var(--color-border)}
.po .who-list a{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 12px;border-radius:12px;color:var(--color-navy);text-decoration:none}
.po .who-list a:hover,.po .who-list a:focus-visible{background:var(--color-primary-soft)}
.po .who-list a[aria-current]{background:var(--color-primary-soft)}
.who-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:var(--color-primary-soft);color:var(--color-primary)}
.who-ic .ic{width:22px;height:22px}
.who-ic .flag{width:28px;height:19px;border-radius:3px}
.po .who-t{display:flex;flex-direction:column;flex:1;min-width:0}
.po .who-t b{font-size:16px;font-weight:700;line-height:1.3}
.po .who-t small{font-size:14px;line-height:1.4;color:var(--color-text-secondary)}
.po .who-t .who-pl{font-size:12px}
.po .who-go{width:18px;height:18px;color:var(--color-text-secondary)}
/* prawa część: Panel klienta (drugorzędny, obrys) + Wybierz pakiet (główne CTA) */
.po .nav-r{gap:10px}
.po .nav-panel,.po .nav-cta{min-height:48px;padding:0 20px;border-radius:12px;font-size:15.5px;font-weight:600;white-space:nowrap}
.po .nav-panel{display:inline-flex;align-items:center;gap:9px;background:#FFFFFF;color:var(--color-primary);border:1.5px solid var(--color-primary);cursor:pointer;text-decoration:none}
.po .nav-panel[hidden]{display:none}
.po .nav-panel:hover{background:var(--color-primary-soft);color:var(--color-primary-hover);border-color:var(--color-primary-hover)}
.po .nav-panel .ic{width:20px;height:20px;color:currentColor}
.po .nav-cta{gap:10px}
.po .nav-cta .ic{width:18px;height:18px}
.po .nav-panel:focus-visible,.po .nav-cta:focus-visible,.po .nav-burger:focus-visible,.po .lang-btn:focus-visible,.po .who-btn:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px}
.dd-panel-wrap{position:relative}
.po .panel-info.dd-panel{left:auto;right:0;top:calc(100% + 12px);width:320px;padding:16px 18px}
.po .pi-h{margin:0;font-weight:700;color:var(--color-navy)}
.po .pi-t{margin:6px 0 0;font-size:14.5px;line-height:1.5;color:var(--color-text-secondary)}
.po .pi-c{display:flex;flex-wrap:wrap;gap:4px 16px;margin:10px 0 0;font-size:14.5px}
.po .pi-c a{display:inline-flex;align-items:center;gap:6px;min-height:36px;color:var(--color-primary);font-weight:600;text-decoration:none}
.po .pi-c .ic{width:16px;height:16px}
.po .nav-burger{display:none;place-items:center;width:46px;height:46px;border:0;border-radius:12px;background:transparent;color:var(--color-navy);cursor:pointer}
.po .nav-burger .ic{width:26px;height:26px}
.po .nav-mini{display:none}
/* menu mobilne: boczny panel modalny */
.drawer{position:fixed;inset:0;z-index:90;margin:0;padding:0}
.drawer[hidden]{display:none}
.drawer-ov{position:absolute;inset:0;background:rgba(10,27,61,.42)}
.drawer-sheet{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:min(400px,calc(100% - 28px));padding:14px 16px calc(18px + env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;background:#FFFFFF;border-radius:20px 0 0 20px;box-shadow:-24px 0 48px -24px rgba(10,27,61,.4);animation:drawer-in .22s ease}
@keyframes drawer-in{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
.drawer-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 2px 12px;border-bottom:1px solid var(--color-border)}
.drawer-top .logo{font-size:19px}
.drawer-x{display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:12px;background:transparent;color:var(--color-navy);cursor:pointer}
.drawer-x .ic{width:24px;height:24px}
.drawer-x:focus-visible,.drawer-nav a:focus-visible,.drawer-nav button:focus-visible,.drawer-cta:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
.drawer-nav{display:flex;flex-direction:column;padding:6px 0}
.po .drawer-nav>a,.po .drawer-nav>button,.drawer-nav>a,.drawer-nav>button{display:flex;align-items:center;gap:14px;width:100%;min-height:52px;padding:0 10px;border:0;border-radius:12px;background:transparent;color:var(--color-navy);font:500 17px/1.2 Onest,system-ui,sans-serif;text-align:left;text-decoration:none;cursor:pointer;border-bottom:0}
.drawer-nav>a:hover,.drawer-nav>button:hover{background:var(--color-background)}
.drawer-nav>button[aria-expanded="true"]{background:var(--color-primary-soft);color:var(--color-navy)}
.drawer-nav>a>span,.drawer-nav>button>span{flex:1}
.drawer-nav>a>.ic:first-child,.drawer-nav>button>.ic:first-child{width:22px;height:22px;color:var(--color-navy)}
.drawer .d-go{width:18px;height:18px;color:var(--color-text-secondary)}
.drawer .d-chev{transition:transform .2s}
.drawer [aria-expanded="true"] .d-chev{transform:rotate(180deg)}
.drawer .d-panel,.drawer .d-lang{margin-top:6px;border-top:1px solid var(--color-border)!important;border-radius:0!important}
.drawer .d-sub{margin:2px 0 6px;padding:0 0 0 22px;list-style:none}
.drawer .d-sub.who-list a{min-height:56px;padding:8px 10px}
.drawer .d-sub .who-ic{width:36px;height:36px;border-radius:10px}
.drawer .d-sub .who-t b{font-size:15.5px}
.drawer .d-sub .who-t small{font-size:13px}
.drawer .d-sub.panel-info{padding:6px 10px 10px 46px}
.drawer .lang-list a{min-height:48px}
.drawer a.drawer-cta{display:flex;justify-content:center;align-items:center;gap:10px;min-height:54px;margin-top:auto;border-radius:14px;font-size:17px;color:#FFFFFF}
.drawer-cta .ic{width:20px;height:20px;color:#FFFFFF}
.drawer .drawer-c{margin:12px 0 0!important;text-align:center;font-size:14px;color:var(--color-text-secondary)}
.drawer .drawer-c a{color:var(--color-navy);font-weight:600;text-decoration:none}
html.drawer-open,html.drawer-open body{overflow:hidden}
/* tablet / telefon */
@container po (max-width:1279px){.po .nav-links .nav-link{padding:0 11px;font-size:15.5px}
.po .nav-panel,.po .nav-cta{padding:0 16px}
.po .who-btn[aria-expanded="true"]::after,.po .who-btn[data-current]::after{left:11px;right:11px}}
@container po (max-width:1023px){.po .nav-burger{display:grid}
.po .nav-in{height:68px;padding:0 8px 0 20px!important}}
@container po (max-width:767px){.po .nav-in{height:64px;padding:0 6px 0 14px!important;gap:8px}
.po .nav-r{gap:6px}
.po .nav-panel,.po .nav-cta{min-height:44px;padding:0 14px;font-size:14.5px;border-radius:11px}
.po .nav-cta .ic{display:inline-block;width:16px;height:16px}
.po .nav .logo>span:nth-child(2){position:static;width:auto;height:auto;overflow:visible;clip:auto}
.po .nav .logo{font-size:17px;gap:8px}
.po .nav-mini{display:flex;justify-content:space-between;gap:6px;margin:8px 12px 0;padding:6px 14px;list-style:none;background:#FFFFFF;border:1px solid rgba(10,27,61,.07);border-radius:14px;font-size:13.5px}
.po .nav-mini li{display:flex;align-items:center;min-width:0}
.po .nav-mini li+li{padding-left:8px;border-left:1px solid var(--color-border)}
.po .nav-mini a,.po .nav-mini span{display:inline-flex;align-items:center;gap:6px;min-height:36px;color:var(--color-navy);text-decoration:none;white-space:nowrap;font-weight:500}
.po .nav-mini .ic{width:16px;height:16px;color:var(--color-text-secondary)}}
@container po (max-width:559px){.po .nav-r .nav-panel{display:none}}
@container po (max-width:399px){.po .nav-cta .ic{display:none}}
@container po (max-width:359px){.po .nav-mini li:nth-child(3){display:none}
.po .nav-mini{justify-content:space-around}}
/* stopka: granat, białe logo, cztery kolumny, subtelne linie */
.po .foot{padding:56px 0 24px;background:var(--color-navy);color:#C9D5EE;font-size:15px;line-height:1.5}
.po .foot-grid--4{grid-template-columns:minmax(0,1.25fr) minmax(0,1.05fr) minmax(0,1fr) minmax(0,1fr);gap:0}
.po .foot-col{gap:0;padding:0 28px}
.po .foot-col:first-child{padding-left:0}
.po .foot-col+.foot-col{border-left:1px solid rgba(169,195,255,.16)}
.po .foot .logo{margin:0;font-size:21px}
.po .foot-claim{margin:12px 0 0;color:#E6EEFF}
.po .foot-co{margin-top:16px;font-size:14px;color:#C9D5EE}
.po .foot .eyebrow{margin:0 0 14px;font-size:var(--fs-eyebrow);font-weight:800;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--color-on-dark-icon);line-height:1.3}
.po .foot-list{margin:0;padding:0;list-style:none;display:grid;gap:4px;width:100%}
.po .foot-contact li{display:flex;align-items:flex-start;gap:12px;padding:5px 0}
.po .foot-contact li>.ic{flex:none;width:20px;height:20px;margin-top:2px;color:var(--color-on-dark-icon)}
.po .foot-contact span{display:flex;flex-direction:column}
.po .foot-contact small{font-size:13.5px;color:#C9D5EE}
.po .foot-contact a{color:#FFFFFF}
.po .foot-addr{user-select:all;-webkit-user-select:all;color:#FFFFFF}
.po .foot-route{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:8px;min-height:32px}
.po .foot-route .ic{width:16px;height:16px}
.po .foot-links a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:36px;color:#E6EEFF}
.po .foot-links a>span{display:inline-flex;align-items:center;gap:10px}
.po .foot-links small,.po .foot-docs small{font-size:12.5px;color:#A9B8D6}
.po .f-go{width:16px;height:16px;flex:none;color:#7F93BD}
.po .f-flag .flag{display:block;width:20px;height:14px;border-radius:2px}
.po .foot-docs li{display:flex;align-items:center;gap:12px;min-height:36px}
.po .foot-docs a{display:flex;align-items:center;gap:12px;min-height:36px;color:#E6EEFF}
.po .foot-docs .ic{flex:none;width:20px;height:20px;color:var(--color-on-dark-icon)}
.po .foot .foot-soc{margin-top:18px}
.po .foot .soc-a{width:44px;height:44px;border:1.5px solid rgba(255,255,255,.35);border-radius:50%}
.po .foot-trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:40px 0 0;padding:20px 0;list-style:none;border-top:1px solid rgba(169,195,255,.16);border-bottom:1px solid rgba(169,195,255,.16)}
.po .foot-trust li{display:flex;align-items:center;gap:14px;padding:4px 22px;min-width:0}
.po .foot-trust li:first-child{padding-left:0}
.po .foot-trust li+li{border-left:1px solid rgba(169,195,255,.16)}
.po .ft-ic{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--color-primary) 18%,transparent);color:#FFFFFF}
.po .ft-ic .ic{width:24px;height:24px}
.po .foot-trust span:last-child{display:flex;flex-direction:column;color:#E6EEFF;font-size:14.5px;line-height:1.35}
.po .foot-trust b{color:#FFFFFF;font-weight:700}
.po .foot-trust small{font-size:13px;color:#A9B8D6}
.po .foot-bot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 24px;margin-top:0;padding-top:18px;border-top:0;font-size:13.5px;color:#A9B8D6}
.po .foot-bot p{margin:0}
.po .foot-aux{display:flex;margin:0;padding:0;list-style:none}
.po .foot-aux li+li{margin-left:18px;padding-left:18px;border-left:1px solid rgba(169,195,255,.25)}
.po .foot-aux a{display:inline-flex;align-items:center;min-height:36px;color:#E6EEFF}
.po .foot-agency{flex-basis:100%;margin:6px 0 0;font-size:12.5px;color:#8FA2C6}
.po .foot-agency a{color:#C7D4EE;text-decoration:underline;text-underline-offset:2px}
.po .foot-agency a:hover{color:#fff}
@container po (max-width:1023px){.po .foot-grid--4{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
.po .foot-col:nth-child(3){padding-left:0;border-left:0}
.po .foot-trust{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}
.po .foot-trust li:nth-child(3){padding-left:0;border-left:0}}
@container po (max-width:767px){.po .foot{padding:40px 0 calc(28px + 80px)}
.po .foot-grid--4{grid-template-columns:minmax(0,1fr)}
.po .foot-col{padding:0!important;border-left:0!important}
.po .foot-col+.foot-col{padding-top:24px!important;border-top:1px solid rgba(169,195,255,.16)!important}
.po .foot-trust{grid-template-columns:minmax(0,1fr)}
.po .foot-trust li{padding:4px 0!important;border-left:0!important}
.po .foot-bot{flex-direction:column;align-items:flex-start}}
/* neutralizacja starych stylów listy w .dd-panel (kody języków jako „b”) */
.po .dd-panel .who-t b,.po .drawer .who-t b{display:block;place-items:initial;width:auto;height:auto;border-radius:0;background:none;color:inherit;font-size:16px}
.po .drawer .d-sub .who-t b{font-size:15.5px}
.po .dd-panel a[aria-current] .who-t b{background:none;color:inherit}
.po .drawer a,.drawer a{border-bottom:0}
/* stare style szuflady (linie pod linkami) – nowy panel ma własne odstępy */
.drawer .drawer-top .logo{min-height:46px}
.po .foot-doc-note{margin:12px 0 0;font-size:13px;line-height:1.5;color:rgba(255,255,255,.72)}
.po .map-h{margin:0 0 10px;font-size:17px;font-weight:700;color:var(--color-navy)}
/* 26.10.2026: dłuższe etykiety UK / EN / DE – nawigacja mieści się w jednym rzędzie bez przewijania w poziomie */
@container po (min-width:1024px) and (max-width:1279px){.po .nav-in{padding:0 12px 0 23px!important;gap:12px}
.po .nav-links .nav-link{padding:0 7px;font-size:15px}
.po .nav-r{gap:8px}
.po .nav-panel,.po .nav-cta{padding:0 12px;gap:6px}
.po .who-btn[aria-expanded="true"]::after,.po .who-btn[data-current]::after{left:7px;right:7px}}
@container po (min-width:400px) and (max-width:559px){.po .nav-cta .ic{display:none}
.po .nav-cta{padding:0 12px}}
/* 26.10.2026: drugi rząd nagłówka mobilnego (telefon | adres | godziny) – zwarty; na niskich ekranach (≤ 700 px wysokości) ukryty,
   żeby główne CTA hero zostało na pierwszym ekranie (te same dane są w menu mobilnym i w sekcji kontakt) */
@container po (max-width:767px){.po .nav-mini{margin-top:6px;padding:3px 12px}
.po .nav-mini a,.po .nav-mini span{min-height:34px}}
@media (max-height:700px){.po .nav-mini{display:none!important}}
/* wyrównanie logo do linii treści (padding sekcji 24 px = 1 px ramki + 23 px) */
.po .nav-in{padding-left:23px!important}
@container po (max-width:1023px){.po .nav-in{padding-left:20px!important}}
@container po (max-width:767px){.po .nav-in{padding-left:14px!important}}
/* 26.10.2026 (10:38): flaga bieżącego języka widoczna od razu w przycisku wyboru języka (pasek górny i menu mobilne) */
.po .lang-flag--cur{display:inline-flex;flex:none}
.po .lang-flag--cur .flag{width:20px;height:14px}
.po .d-lang .lang-flag--cur .flag{width:22px;height:15px}
/* 26.10.2026 (14:16): nowe logo Nowy Świat 33 (pliki od firmy): nagłówek i menu mobilne – wersja jasna pozioma (bez podpisu, czytelna w małym rozmiarze),
   stopka (granat) – wersja ciemna pozioma z podpisem „Wirtualne biuro”, najwęższe telefony (< 400 px) – sam znak */
.po .logo{display:inline-flex;align-items:center;gap:0;line-height:0}
.po .logo-img{display:block;width:auto;height:56px}
.po .logo-znak{display:none;width:auto;height:40px}
.po .drawer-top .logo-img{height:42px}
.po .logo--foot .logo-img{height:58px}
@container po (max-width:1279px){.po .nav .logo-img{height:46px}}
@container po (max-width:767px){.po .nav .logo-img{height:40px}}
@container po (max-width:399px){.po .nav .logo-img{height:34px}}
@container po (max-width:359px){.po .nav .logo-img{display:none}
.po .nav .logo-znak{display:block}}
/* 26.10.2026 (14:54): ikony Instagram / Facebook w stopce wyśrodkowane w kółkach (reguła linków stopki nadpisywała układ) */
.po .foot .soc-a{display:inline-flex;align-items:center;justify-content:center;gap:0;padding:0;flex:none}
.po .foot .soc-a svg{display:block;margin:0;width:20px;height:20px}
/* =====================================================================================================================
   27.10.2026 – NAGŁÓWEK I HERO (instrukcja „WDROŻENIE NOWEGO NAGŁÓWKA I HERO”)
   Górny pasek i nawigacja na szerokość ramki HERO (.hx-frame: max 1600 px, marginesy 20 / 12 / 8 px), kolejność przycisków
   [Wybierz pakiet] [Panel klienta]; sticky: od 1024 px pasek zmniejsza się z 84 do 64 px (wysokość .nav zarezerwowana → bez skoków).
   HERO: CTA nad kartą „Start za darmo”, trzecia karta na zdjęciu (sala konferencyjna), pasek 4 korzyści pod HERO.
   ===================================================================================================================== */
.po .topbar-in,.po .nav .nav-in{box-sizing:border-box;width:auto;max-width:var(--frame);margin-left:max(var(--edge),calc((100% - var(--frame)) / 2));margin-right:max(var(--edge),calc((100% - var(--frame)) / 2))}
/* centrowanie + margines 5vw w jednym przez max() wyżej — bez skoku na progu (dawne @media margin:auto usunięte) */
@container po (max-width:1023px){.po .topbar-in,.po .nav .nav-in{margin-left:12px;margin-right:12px}}
@container po (max-width:767px){.po .topbar-in,.po .nav .nav-in{margin-left:8px;margin-right:8px}}
/* górny pasek: 40 px, 14,5 px, granat, niebieskie ikony; tekst na linii logo */
.po .topbar-in{min-height:40px;padding:0 33px!important}
.po .tb-l a,.po .tb-l span,.po .tb-link{min-height:40px;color:var(--color-navy);font-size:14.5px;font-weight:600}
.po .tb-l a:hover,.po .tb-link:hover{color:var(--color-primary)}
.po .tb-l .ic,.po .tb-link .ic{width:17px;height:17px;color:var(--color-primary)}
.po .tb-link .dd-chev{color:var(--color-navy)}
.po .tb-l>li+li,.po .tb-r>*+*{margin-left:22px;padding-left:22px}
.po .tb-l a:focus-visible,.po .tb-link:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px;border-radius:4px}
/* główny pasek: 84 px, wewnętrzne odstępy 32 px, logo 60 px, przyciski 52 px, odstęp 14 px */
.po .nav .nav-in{height:84px;padding:0 28px 0 32px!important;transition:height .2s ease,box-shadow .2s ease}
.po .nav .logo-img{height:60px;transition:height .2s ease}
.po .nav .nav-r{gap:14px}
.po .nav .nav-panel,.po .nav .nav-cta{min-height:52px;padding:0 22px;border-radius:12px;font-size:16px;font-weight:600;transition:min-height .2s ease,background-color .15s ease,color .15s ease,border-color .15s ease}
.po .nav .nav-cta:hover{background:var(--color-primary-hover)}
.po .nav-links .nav-link{transition:color .15s ease}
.po .nav-links .nav-link:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px;border-radius:8px}
@container po (min-width:1360px){.po .nav-links{gap:8px}
.po .nav-links .nav-link{padding:0 14px}}
/* sticky (≥ 1024 px): rezerwacja wysokości, kompaktowy pasek po rozpoczęciu przewijania */
@container po (min-width:1024px){.po .nav{box-sizing:border-box;height:90px;pointer-events:none}
.po .nav .nav-in{pointer-events:auto}
.po .nav.is-compact .nav-in{height:64px;box-shadow:0 16px 34px -22px rgba(10,27,61,.32)}
.po .nav.is-compact .logo-img{height:44px}
.po .nav.is-compact .nav-panel,.po .nav.is-compact .nav-cta{min-height:44px}}
@container po (min-width:1024px) and (max-width:1279px){.po .nav .nav-in{height:76px;padding:0 16px 0 24px!important}
.po .nav{height:82px}
.po .nav .logo-img{height:48px}
.po .nav .nav-r{gap:10px}
.po .nav .nav-panel,.po .nav .nav-cta{min-height:48px;padding:0 14px;font-size:15px}}
@container po (max-width:1023px){.po .nav .nav-in{padding:0 8px 0 20px!important}
.po .topbar-in{padding:0 21px!important}}
@container po (max-width:767px){.po .nav .nav-in{padding:0 6px 0 14px!important}
.po .nav .nav-panel,.po .nav .nav-cta{min-height:44px;padding:0 14px;font-size:14.5px;border-radius:11px}
.po .nav .nav-r{gap:6px}
.po .nav .logo-img{height:40px}}
@container po (max-width:399px){.po .nav .logo-img{height:34px}}
@media (prefers-reduced-motion:reduce){.po .nav .nav-in,.po .nav .logo-img,.po .nav .nav-panel,.po .nav .nav-cta{transition:none}}
/* tablet: górny pasek uproszczony (adres jest tuż niżej w HERO), mniejsze odstępy; karty pod zdjęciem równej wysokości */
@container po (max-width:1023px){.po .tb-l>li.tb-addr{display:none}
.po .tb-l>li+li,.po .tb-r>*+*{margin-left:16px;padding-left:16px}
.po .tb-l a,.po .tb-l span,.po .tb-link{font-size:14px}}
/* logo nie jest ściskane (oryginalne proporcje); przy 1024–1279 px dłuższe etykiety UK / DE mieszczą się dzięki mniejszym odstępom */
.po .nav .nav-in>.logo{flex:none}
.po .nav .logo-img{max-width:none;width:auto}
@container po (min-width:1024px) and (max-width:1279px){.po .nav .nav-in{gap:10px}
.po .nav-links .nav-link{padding:0 6px}
.po .nav .nav-panel,.po .nav .nav-cta{padding:0 12px}}
@container po (min-width:1024px) and (max-width:1199px){.po .nav .logo-img{height:44px}
.po .nav .nav-panel,.po .nav .nav-cta{font-size:14.5px}}
/* telefon (< 768 px): logo, kompaktowe „Wybierz pakiet”, menu – „Panel klienta” w menu mobilnym */
@container po (max-width:767px){.po .nav-r .nav-panel,.po .nav-r .dd-panel-wrap{display:none}}
@container po (max-width:399px){.po .nav .nav-in{gap:6px;padding-right:4px!important}
.po .nav .nav-cta{padding:0 10px;font-size:14px}
.po .nav-burger{width:42px}
.po .nav .logo-img{height:32px}}
/* wspólna siatka: logo i pierwszy element górnego paska na linii tekstu HERO wszędzie tam, gdzie HERO nie jest wyśrodkowane (< 1280 px) */
@container po (min-width:1024px) and (max-width:1279px){.po .topbar-in{padding:0 17px 0 25px!important}}
@container po (max-width:1023px){.po .nav .nav-in{padding-left:24px!important}
.po .topbar-in{padding-left:25px!important}}
@container po (max-width:767px){.po .nav .nav-in{padding-left:20px!important}}
@container po (max-width:379px){.po .nav .logo-img{height:29px}
.po .nav .nav-cta{padding:0 9px}}
@container po (max-width:399px){.po .nav-burger{width:44px;height:44px}}
@container po (max-width:379px){.po .nav .nav-cta{font-size:13.5px;padding:0 8px}
.po .nav .nav-in{gap:4px}}
/* wysokości jak dotąd: tablet 68 px, telefon 64 px */
@container po (max-width:1023px){.po .nav .nav-in{height:68px}
.po .nav .logo-img{height:44px}}
@container po (max-width:767px){.po .nav .nav-in{height:64px}
.po .nav .logo-img{height:40px}}
@container po (max-width:399px){.po .nav .logo-img{height:32px}}
@container po (max-width:379px){.po .nav .logo-img{height:29px}}
.po .foot-cookies{display:flex;align-items:center;gap:12px;min-height:36px;padding:0;border:0;background:none;color:#E6EEFF;font:inherit;text-align:left;cursor:pointer}
.po .foot-cookies:hover{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.po .foot-cookies:focus-visible{outline:3px solid #FFFFFF;outline-offset:2px;border-radius:4px}
.po .foot-cookies .ic{flex:none;width:20px;height:20px;color:var(--color-on-dark-icon)}
/* strona dokumentu */
.po .lg-doc,.po .sec.lg-doc{padding:28px 0 64px}
.po .lg-wrap{max-width:860px}
.po .lg-bc ol{display:flex;flex-wrap:wrap;gap:4px 8px;margin:0 0 18px;padding:0;list-style:none;font-size:14px;color:var(--color-text-secondary)}
.po .lg-bc li+li::before{content:"›";margin-right:8px;color:#94A3B8}
.po .lg-bc a{color:var(--color-primary)}
.po .lg-status{margin:0 0 22px;padding:14px 18px;border:1.5px solid #E9B44C;border-radius:14px;background:#FFF8E6;color:#5B3A06}
.po .lg-status p{margin:0;font-size:15px;line-height:1.55}
.po .lg-status a{color:#7A4B00;font-weight:600}
.po .lg-doc .h2{margin:6px 0 6px}
.po .lg-sub{margin:4px 0 0;font-size:15px;color:var(--color-text-secondary)}
.po .lg-meta{display:grid;grid-template-columns:repeat(3,auto) minmax(0,1fr);gap:10px 28px;margin:20px 0 0;padding:14px 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.po .lg-meta div{min-width:0}
.po .lg-meta dt{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-secondary)}
.po .lg-meta dd{margin:2px 0 0;font-size:15px;font-weight:600;color:var(--color-navy)}
.po .lg-meta code{display:block;font:500 12.5px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-wrap:anywhere;color:#3E4C6B}
.po .lg-actions{margin:18px 0 0}
.po .lg-pdf{display:inline-flex;align-items:center;gap:10px;min-height:48px}
.po .lg-pdf .ic{width:20px;height:20px}
.po .lg-pdf small{font-weight:500;color:var(--color-text-secondary)}
.po .lg-others{margin:26px 0 0;padding:18px 22px;background:#FFFFFF;border:1px solid var(--color-border);border-radius:16px}
.po .lg-toc-h{margin:0 0 8px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary)}
.po .lg-others ul{margin:0;padding-left:20px;display:grid;gap:4px}
.po .lg-others a{display:inline-block;min-height:28px;padding:2px 0;color:var(--color-primary);font-size:15.5px}
.po .lg-text{margin-top:30px;font-size:17px;line-height:1.7;color:#24324F}
.po .lg-text h2{margin:34px 0 10px;font-size:22px;line-height:1.3;font-weight:800;color:var(--color-navy);scroll-margin-top:96px}
.po .lg-text p{margin:0 0 14px;max-width:none}
.po .lg-text ul,.po .lg-text ol{margin:0 0 16px;padding-left:24px}
.po .lg-text li{margin:0 0 6px}
@container po (max-width:767px){.po .lg-doc,.po .sec.lg-doc{padding:18px 0 48px}
.po .lg-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
.po .lg-meta-sha{grid-column:1/-1}
.po .lg-text{font-size:16px;line-height:1.65}
.po .lg-text h2{font-size:19px;margin-top:28px}
.po .lg-others{padding-left:16px;padding-right:16px}
.po .lg-pdf{width:100%;justify-content:center}}
@media print{.po .topbar,.po .nav,.po .nav-mini,.po .foot,.ck-banner,.ck-dlg,.po .lg-others,.po .lg-actions,.po .lg-bc{display:none!important}}
/* baner zgody (nie blokuje strony; trzy równorzędne przyciski) */
.ck-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:80;display:flex;justify-content:center;pointer-events:none}
.ck-banner[hidden]{display:none}
.ck-in{pointer-events:auto;width:min(980px,100%);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 24px;padding:18px 22px;background:#FFFFFF;color:var(--color-navy);border:1px solid rgba(10,27,61,.14);border-radius:18px;box-shadow:0 24px 60px -24px rgba(10,27,61,.45);font-family:Onest,system-ui,sans-serif}
.ck-h{grid-column:1;margin:0;font-size:16px;line-height:1.3;font-weight:800;color:var(--color-navy)}
.ck-t{grid-column:1;margin:0;font-size:14.5px;line-height:1.5;color:#3E4C6B}
.ck-t a,.ck-note a{color:#1D4ED8;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ck-btns{display:flex;flex-wrap:wrap;gap:10px}
.ck-in .ck-btns{grid-column:2;grid-row:1/span 2}
.ck-btn{min-width:132px;min-height:46px;padding:0 18px;border:1.5px solid var(--color-navy);border-radius:12px;background:#FFFFFF;color:var(--color-navy);font:600 15px/1 Onest,system-ui,sans-serif;cursor:pointer}
.ck-btn:hover{background:var(--color-navy);color:#FFFFFF}
.ck-btn:focus-visible,.ck-x:focus-visible,.ck-cat input:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
@media (max-width:767px){.ck-banner{left:8px;right:8px;bottom:8px}
.ck-in{grid-template-columns:minmax(0,1fr);padding:14px 16px 16px}
.ck-in .ck-btns{grid-column:1;grid-row:auto;margin-top:6px}
.ck-btn{flex:1 1 auto;min-width:0;padding:0 12px;white-space:nowrap}
.ck-t{font-size:13.5px}}
/* okno ustawień */
.ck-dlg{width:min(560px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:24px;border:0;border-radius:20px;background:#FFFFFF;color:var(--color-navy);box-shadow:0 30px 80px -30px rgba(10,27,61,.55);font-family:Onest,system-ui,sans-serif;overflow:auto}
.ck-dlg::backdrop{background:rgba(10,27,61,.45)}
.ck-dlg .ck-h{font-size:20px;padding-right:44px}
.ck-dlg .ck-t{margin-top:6px}
.ck-cats{display:grid;gap:10px;margin:18px 0;padding:0;border:0}
.ck-cat{display:flex;gap:14px;align-items:flex-start;padding:14px;border:1px solid rgba(10,27,61,.14);border-radius:14px;cursor:pointer}
.ck-cat[hidden]{display:none}
.ck-cat input{flex:none;width:22px;height:22px;margin:2px 0 0;accent-color:var(--color-primary)}
.ck-cat input:disabled{cursor:not-allowed}
.ck-cat span{display:flex;flex-direction:column;gap:3px}
.ck-cat b{font-size:15.5px}
.ck-cat small{font-size:14px;line-height:1.45;color:#3E4C6B}
.ck-dlg .ck-btns .ck-btn{flex:1 1 150px}
.ck-note{margin:14px 0 0;font-size:14px;color:#3E4C6B}
.ck-x{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:var(--color-navy);cursor:pointer}
.ck-x .ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
.ck-x:hover{background:#F2F6FF}
/* ==== 27.10.2026: PRZEBUDOWA SEKCJI OPINII – nagłówek bez licznika, siatka 43/57 (max 1160, odstęp 36),
   lewa: rekomendacja (karta 16/28, zdjęcie 76), prawa: pasek oceny Google + karuzela 2 kart (1 na telefonie).
   Telefon: ocena Google → rekomendacja → karuzela. Bez pozycjonowania absolutnego. ==== */
#opinie{--rv-line:#E2E8F0}
/* 27.10.2026: menu „Usługi” – ciaśniejsze odstępy linków, żeby pasek mieścił się we wszystkich językach (1024–1439 px) */
@container po (min-width:1280px) and (max-width:1439px){.po .nav-links{gap:2px}
.po .nav-links .nav-link{padding:0 10px}
.po .nav .nav-in{gap:16px}}
@container po (min-width:1024px) and (max-width:1279px){.po .nav-links{gap:0}
.po .nav-links .nav-link{padding:0 6px}}
@container po (min-width:1024px) and (max-width:1099px){.po .nav-links .nav-link{padding:0 5px;font-size:15px}
.po .nav .nav-panel,.po .nav .nav-cta{padding:0 9px}}
/* 30.10.2026: wszystkie sekcje tej samej szerokości co ramka hero i menu: 20 px od brzegu ekranu (12 px tablet, 8 px telefon), maks. 1600 px.
   Treść każdej sekcji (.wrap w main i w stopce) wypełnia tę samą szerokość; hero i menu bez zmian. */
.po-page{--edge:clamp(20px,5vw,160px);--frame:1440px}
@container po (max-width:1023px){.po-page{--edge:12px}}
@container po (max-width:767px){.po-page{--edge:8px}}
.po main .wrap,.po .foot .wrap{max-width:none;padding-inline:max(var(--edge),calc((100% - var(--frame)) / 2))}
.po #faq .faq-box .acc-body{max-width:80ch}

/* === „Z bloga”: najnowsze wpisy (strona główna i landingi „dla…”). Komponent rdzeniowy — dostępny na każdej stronie. === */
.vot-rbl__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 24px;flex-wrap:wrap}
.vot-rbl__head h2{font-size:var(--fs-h2,36px);line-height:1.1;letter-spacing:-.02em;color:var(--color-navy);margin:0}
.vot-rbl__all{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--color-primary-hover);text-decoration:none;white-space:nowrap}
.vot-rbl__all:hover{text-decoration:underline}
.vot-rbl__all .ic{width:18px;height:18px}
.vot-rbl__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.vot-rbl__card a{display:flex;flex-direction:column;height:100%;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-card);overflow:hidden;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.vot-rbl__card a:hover{transform:translateY(-3px);box-shadow:var(--sh-card);border-color:var(--color-primary-line)}
.vot-rbl__card a:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
.vot-rbl__m{display:block;aspect-ratio:16/10;background:var(--color-primary-soft);overflow:hidden}
.vot-rbl__m img{width:100%;height:100%;object-fit:cover;display:block}
.vot-rbl__b{display:flex;flex-direction:column;gap:8px;padding:18px 20px}
.vot-rbl__chip{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--color-primary-hover);background:var(--color-primary-soft);border-radius:999px;padding:4px 11px}
.vot-rbl__t{font-size:17px;font-weight:700;line-height:1.3;color:var(--color-navy);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.vot-rbl__meta{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--color-text-secondary);margin-top:auto}
@media (prefers-reduced-motion:reduce){.vot-rbl__card a{transition:none}.vot-rbl__card a:hover{transform:none}}
