/* header-v2.css – zmodernizowany nagłówek i nawigacja */
:root {
  --hdr-bg: #ffffff;
  --hdr-border: rgba(17,24,39,0.06);
  --hdr-text: #1f2937;
  --hdr-text-muted: #6b7280;
  --hdr-accent: #0b61d5;
  --hdr-accent-hover: #094fae;
  --hdr-height: 84px;
  --hdr-max-width: 1280px;
  --hdr-radius-menu: 16px;
  --hdr-transition: 0.25s cubic-bezier(.4,0,.2,1);
  --hdr-ease: cubic-bezier(.4,0,.2,1);
  --hdr-shadow: 0 2px 16px rgba(17,24,39,0.05);
  --hdr-shadow-float: 0 8px 32px rgba(17,24,39,0.12);
  --hdr-focus: 0 0 0 3px rgba(11,97,213,0.35);

  --hdr-font-size: 16px;
  --submenu-mobile-max-height: 900px; /* logiczna górna granica dla akordeonu */
  --submenu-hover-bg: rgba(11,97,213,0.08);
}

@media (min-width: 992px){
  .qjk-header-v2 { position:sticky; top:0; z-index:1100; box-shadow:var(--hdr-shadow); }
}

.qjk-header-v2 { background:var(--hdr-bg); border-bottom:1px solid var(--hdr-border); color:var(--hdr-text); font-family:var(--hdr-font-family); transition:transform .35s var(--hdr-ease), box-shadow .25s var(--hdr-ease); will-change:transform; }
.qjk-header-v2__wrap { max-width:var(--hdr-max-width); margin:0 auto; height:var(--hdr-height); display:flex; align-items:center; padding:0 14px; transition:height .28s var(--hdr-ease); }

/* Left */
.qjk-header-v2__left { display:flex; align-items:center; min-width:120px; }
.qjk-logo-v2 { max-height:calc(var(--hdr-height) - 24px); width:auto; display:block; max-width:180px; height:auto; }
@media (max-width: 520px){
  .qjk-logo-v2 { max-width:150px; }
}
@media (max-width: 400px){
  .qjk-logo-v2 { max-width:132px; }
}
.qjk-header-v2__brand-link { display:inline-flex; align-items:center; gap:8px; text-decoration:none; }

/* Center nav */
.qjk-header-v2__center { display:flex; align-items:center; justify-content:center; }
.qjk-nav-v2 { list-style:none; margin:0; padding:0; display:flex; gap:20px; font-size:var(--hdr-font-size); font-weight:600; }
.qjk-nav-v2 > li { position:relative; }
.qjk-nav-v2 > li > a { min-height:42px; display:inline-flex; align-items:center; }
.qjk-nav-v2 a { text-decoration:none; color:var(--hdr-text); padding:6px 12px; border-radius:0; display:inline-flex; align-items:center; justify-content:center; gap:6px; line-height:1.2; position:relative; }
/* Animated underline (scaleX) – tylko elementy najwyższego poziomu */
.qjk-nav-v2 > li > a::after { content:""; position:absolute; left:12px; right:12px; bottom:2px; height:2px; background:var(--hdr-accent); transform:scaleX(0); transform-origin:left center; transition:transform .28s var(--hdr-ease); border-radius:2px; }
.qjk-nav-v2 > li > a:hover::after,
.qjk-nav-v2 > li > a:focus-visible::after { transform:scaleX(1); }
.qjk-nav-v2 > li > a:focus-visible { outline:var(--hdr-focus); outline-offset:2px; }
.qjk-nav-v2 > li > a:hover { color:var(--hdr-accent); }
.qjk-nav-v2 > li > a[aria-current='page'] { color:var(--hdr-accent); font-weight:700; }
.qjk-nav-v2 > li > a[aria-current='page']::after { transform:scaleX(1); }

/* Dropdown (desktop) */
/* Oferta toggle (desktop) – usuwamy dodatkowe padding-right aby tekst pozostał wyśrodkowany względem innych pozycji */
.qjk-oferta-dropdown-v2 > .qjk-nav-v2__toggle { position:relative; }
/* Chevron – zmniejszona szerokość aby nie "ściągać" optycznie tekstu w lewo */
.qjk-nav-v2__chevron { flex:0 0 14px; width:14px; height:14px; margin-left:4px; position:relative; display:inline-block; }
.qjk-nav-v2__chevron::before { content:""; width:9px; height:9px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); border:2px solid currentColor; border-left:0; border-top:0; transition:transform var(--hdr-transition); }
/* Dodatkowa normalizacja odstępu tylko dla toggle (gdyby inne linki miały ikonki w przyszłości) */
/* Desktop minimal gap chevron */
.qjk-nav-v2__toggle .qjk-nav-v2__chevron { margin-left:4px; }

/* Submenu panel */
.qjk-header-v2 .qjk-submenu-v2 { position:absolute !important; inset:auto auto auto 0 !important; top:calc(100% + 10px) !important; min-width:240px !important; max-width:320px !important; padding:8px 0 !important; margin:0 !important; list-style:none !important; background:#fff !important; border:1px solid var(--hdr-border) !important; box-shadow:var(--hdr-shadow-float) !important; border-radius:var(--hdr-radius-menu) !important; opacity:0 !important; transform:translateY(4px) scale(.98) !important; pointer-events:none !important; transition:opacity .18s var(--hdr-ease), transform .24s var(--hdr-ease) !important; z-index:1200 !important; will-change:transform, opacity !important; display:block !important; flex-direction:column !important; flex-wrap:nowrap !important; }
.qjk-submenu-v2__item { display:block !important; padding:10px 16px; font-size:.95rem; color:var(--hdr-text); text-decoration:none; line-height:1.25; border-radius:6px; transition:background .18s var(--hdr-ease), color .16s var(--hdr-ease); position:relative; }
.qjk-submenu-v2__item:hover { background:var(--submenu-hover-bg); color:var(--hdr-accent); }
/* Delikatne wyróżnienie pozycji Promocje */
.qjk-submenu-v2__item--promo { background:#fff1f2; color:#b91c1c; }
.qjk-submenu-v2__item--promo:hover { background:#ffe4e6; color:#9f1239; }
/* Usuń animowane pseudo-underline z elementów submenu (odziedziczone przez selektor nadrzędny) */
.qjk-submenu-v2 a::after { display:none !important; }
.qjk-submenu-v2__item:focus-visible { outline:var(--hdr-focus); }

/* State open (JS adds .is-open) */
.qjk-oferta-dropdown-v2.is-open > .qjk-submenu-v2 { opacity:1 !important; transform:translateY(0) scale(1) !important; pointer-events:auto !important; }
/* Height animation handled via JS inline style (desktop). */
.qjk-oferta-dropdown-v2.is-open > .qjk-nav-v2__toggle .qjk-nav-v2__chevron::before { transform:translate(-50%,-50%) rotate(225deg); }

/* Fallback: if JS updated aria-expanded on the toggle but for some reason .is-open wasn't applied,
   make submenu visible when the toggle has aria-expanded="true". This covers pages where
   initialization missed setting up the full state but aria attributes were toggled. */
.qjk-nav-v2__toggle[aria-expanded="true"] + .qjk-submenu-v2 {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}

/* Mobile fallback for accordion state when aria-expanded changed */
.qjk-mobile-menu-v2 .qjk-nav-v2__toggle[aria-expanded="true"] + .qjk-submenu-v2 {
  max-height: var(--submenu-mobile-max-height) !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Right side */
.qjk-header-v2__right { display:flex; align-items:center; gap:18px; }
.qjk-header-v2__contact { display:flex; flex-direction:column; align-items:flex-end; line-height:1.4; }
.qjk-phone-v2 { font-weight:700; color:#ff5e6c; letter-spacing:-.3px; text-decoration:none; font-size:1.08rem; line-height:1.15; }
.qjk-phone-v2:hover { text-decoration:underline; }
.qjk-contact-small-v2 { font-size:.75rem; color:var(--hdr-text-muted); }
.qjk-email-v2 { text-decoration:none; color:var(--hdr-text-muted); transition:color .18s ease; }
.qjk-email-v2:hover, .qjk-email-v2:focus-visible { color:var(--hdr-accent); text-decoration:underline; }

    /* Mobile: pokaż wyraźniej email pod numerem, lekko większy rozmiar */
@media (max-width:991.98px){
  .qjk-email-v2 { font-size:.72rem; }
  /* Ensure toggleable items are clearly clickable */
  .qjk-mobile-menu-v2 .qjk-nav-v2__toggle {
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
  }
  .qjk-mobile-menu-v2 .qjk-nav-v2__toggle:active {
    background: rgba(0,0,0,0.05);
  }
  @media (max-width:420px){
    .qjk-email-v2 { font-size:.68rem; }
  }
}

/* Divider */
.qjk-header-v2__divider { width:1px; height:46%; background:var(--hdr-border); margin-right: 2rem !important; }

/* Mobile toggle */
.qjk-mobile-toggle-v2 { width:48px; height:44px; border:none; background:transparent; border-radius:10px; font-size:26px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:background .18s ease; position:relative; }
.qjk-mobile-toggle-v2:focus-visible { outline:var(--hdr-focus); }
.qjk-mobile-toggle-v2:hover { background:rgba(0,0,0,0.06); }
.qjk-mobile-toggle-v2[data-state='open'] { font-size:0; }
.qjk-mobile-toggle-v2[data-state='open']::before, .qjk-mobile-toggle-v2[data-state='open']::after { content:""; position:absolute; left:50%; top:50%; width:26px; height:3px; background:currentColor; border-radius:2px; transform-origin:center; }
.qjk-mobile-toggle-v2[data-state='open']::before { transform:translate(-50%,-50%) rotate(45deg); }
.qjk-mobile-toggle-v2[data-state='open']::after { transform:translate(-50%,-50%) rotate(-45deg); }

/* Mobile layout */
@media (max-width:991.98px){
  .qjk-header-v2__center { display:none !important; }
  .qjk-header-v2__wrap { justify-content:space-between; }
  /* Mobilny nagłówek: pozycjonowanie fixed aby móc go chować/pokazywać */
  .qjk-header-v2 { position:fixed; top:0; left:0; right:0; z-index:1100; }
  body.has-mobile-menu-v2-open::before { content:""; position:fixed; inset:0; background:rgba(15,23,42,0.55); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); z-index:900; }
  .qjk-mobile-menu-v2 { position:fixed; top:var(--hdr-height); left:0; right:0; z-index:950; background:#fff; border-radius:0 0 24px 24px; box-shadow:0 12px 32px -6px rgba(0,0,0,0.28),0 4px 16px -2px rgba(0,0,0,0.14); max-height:calc(100vh - var(--hdr-height)); overflow-y:auto; padding:18px 20px 30px; transform:translateY(-16px); opacity:0; visibility:hidden; pointer-events:none; transition:transform .30s var(--hdr-ease), opacity .22s var(--hdr-ease), visibility 0s linear .22s; }
  body.has-mobile-menu-v2-open .qjk-mobile-menu-v2 { transform:translateY(0); opacity:1; visibility:visible; pointer-events:auto; transition-delay:0s; }
  /* Stagger fade/slide dla pozycji menu */
  .qjk-mobile-menu-v2 nav ul.qjk-nav-v2 > li { opacity:0; transform:translateY(10px); transition:opacity .38s var(--hdr-ease), transform .48s var(--hdr-ease); }
  body.has-mobile-menu-v2-open .qjk-mobile-menu-v2 nav ul.qjk-nav-v2 > li { opacity:1; transform:translateY(0); }
  .qjk-mobile-menu-v2 nav { width:100%; }
  .qjk-mobile-menu-v2 .qjk-nav-v2 { flex-direction:column; gap:0; }
  /* Linki top-level (mobile) – tekst idealnie wyśrodkowany, strzałka absolutnie po prawej */
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a,
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a.qjk-nav-v2__toggle { width:100%; text-align:center; padding:14px 44px 14px 24px; font-size:1.05rem; font-weight:600; border-bottom:1px solid rgba(0,0,0,0.08); border-radius:0; position:relative; display:flex; align-items:center; justify-content:center; line-height:1.14; white-space:nowrap; }
  /* Mobile underline animation (same concept as desktop, adapted to full-width links) */
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a::after { content:""; position:absolute; left:24px; right:44px; bottom:6px; height:2px; background:var(--hdr-accent); transform:scaleX(0); transform-origin:center center; transition:transform .28s var(--hdr-ease); border-radius:2px; }
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a:hover::after,
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a:focus-visible::after { transform:scaleX(1); }
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a[aria-current='page'] { color:var(--hdr-accent); font-weight:700; }
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a[aria-current='page']::after { transform:scaleX(1); }
  /* Chevron (mobile) absolutnie po prawej – nie wpływa na centrowanie tekstu */
  .qjk-mobile-menu-v2 .qjk-nav-v2__toggle .qjk-nav-v2__chevron { position:absolute; right:20px; top:50%; transform:translateY(-50%); width:14px; height:14px; margin:0; pointer-events:none; }
  .qjk-mobile-menu-v2 .qjk-nav-v2__toggle .qjk-nav-v2__chevron::before { width:9px; height:9px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); }
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li:last-child > a { border-bottom:none; }
  .qjk-mobile-menu-v2 .qjk-submenu-v2 { 
    position: static !important; 
    max-height: 0; 
    opacity: 0; 
    transform: translateY(-4px); 
    border: none !important; 
    box-shadow: none !important; 
    padding: 0 0 4px 0; 
    margin: 0; 
    transition: max-height .34s var(--hdr-ease), opacity .24s var(--hdr-ease), transform .30s var(--hdr-ease); 
    overflow: hidden; 
    will-change: max-height, opacity, transform;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .qjk-mobile-menu-v2 .qjk-submenu-v2__item { padding:10px 18px 10px 34px; margin:0 -14px 0 -18px; /* wyciągnięcie tła na pełną szerokość jak w top-level */ color:var(--hdr-text); border-radius:0; }
  .qjk-mobile-menu-v2 .qjk-submenu-v2__item:hover { background:var(--submenu-hover-bg); color:var(--hdr-accent); }
  /* Wyróżnienie Promocje w menu mobilnym */
  .qjk-mobile-menu-v2 .qjk-submenu-v2__item--promo { background:#fff1f2; color:#b91c1c; }
  .qjk-mobile-menu-v2 .qjk-submenu-v2__item--promo:hover { background:#ffe4e6; color:#9f1239; }
  .qjk-mobile-menu-v2 .qjk-submenu-v2 a::after { display:none !important; }
  .qjk-mobile-menu-v2 .qjk-oferta-dropdown-v2.is-open > .qjk-submenu-v2 { 
    max-height: var(--submenu-mobile-max-height) !important; 
    opacity: 1 !important; 
    transform: translateY(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .qjk-mobile-menu-v2 .qjk-oferta-dropdown-v2.is-open > .qjk-nav-v2__toggle .qjk-nav-v2__chevron::before { transform:translate(-50%,-50%) rotate(225deg); }

  /* Większy obszar dotyku i lepszy focus pod togglami mobilnymi */
  /* Uspójnione zbliżenie chevron do tekstu (usuwamy duży odstęp) */
  /* Usunięto neutralną rotację 45deg (domyślnie już jest w desktop base); stanie open nadpisuje do 225deg */
  /* Minimalnie ciaśniejszy odstęp gdy potrzebne (opcjonalna klasa przyszłościowo) */
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li.compact > a.qjk-nav-v2__toggle .qjk-nav-v2__chevron { margin-left:6px; }
  .qjk-mobile-menu-v2 .qjk-nav-v2 > li > a.qjk-nav-v2__toggle:focus-visible { outline:var(--hdr-focus); outline-offset:3px; }
  .qjk-mobile-menu-v2 .qjk-submenu-v2__item:focus-visible { outline:var(--hdr-focus); outline-offset:2px; }

  /* Mobile header layout adjustments */
  .qjk-header-v2__wrap { gap:12px; }
  .qjk-header-v2__right { gap:12px; margin-left:auto; }
  .qjk-header-v2__divider { display:none !important; }
  .qjk-header-v2__contact { flex-direction:column; align-items:flex-end; gap:8px; }
  .qjk-phone-v2 { font-size:1.05rem; letter-spacing:-.5px; line-height:1.1; }
  .qjk-contact-small-v2 { display:block; font-size:0.65rem; line-height:1; }
  .qjk-mobile-toggle-v2 { width:44px; height:42px; }
  /* If width extremely narrow hide phone to keep layout stable */
  @media (max-width:400px){
    .qjk-phone-v2 { font-size:0.95rem; }
    .qjk-header-v2__contact { gap:6px; }
  }
  @media (max-width:360px){
    .qjk-contact-small-v2 { display:none; }
    /* Keep email visible even on very narrow screens */
    .qjk-contact-small-v2.qjk-email-v2 { display:inline-block; }
  }
}

/* Mobile hide-on-scroll (klasa dodawana przez JS) */
@media (max-width:991.98px){
  body.qjk-mobile-header-offset { padding-top: var(--hdr-height); }
  .qjk-header-v2.is-hidden-mobile { transform:translateY(-110%); box-shadow:none; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .qjk-mobile-menu-v2, .qjk-submenu-v2 { transition:none !important; }
}

/* Utility states */
.qjk-header-v2 [hidden] { display:none !important; }

/* Accessibility helpers */
.qjk-nav-v2__toggle { cursor:pointer; }
.qjk-nav-v2__toggle[aria-expanded='true'] { color:var(--hdr-accent); }

/* Scroll shrink example hook (optional future JS) */
.qjk-header-v2.is-scrolled { box-shadow:0 4px 20px rgba(17,24,39,0.10); }
.qjk-header-v2.is-scrolled .qjk-header-v2__wrap { height:68px; }
.qjk-header-v2.is-scrolled .qjk-logo-v2 { max-height:calc(68px - 22px); transition:max-height .28s var(--hdr-ease); }