/* ntbx-footer.css – stopka ntbx.pl (Kadence footer builder, 5 kolumn + dolny pasek). Wszystkie selektory pod #colophon. Wdrożone 2026-10-30. */
#colophon{--nf-ink:#282828;--nf-txt:#4a4a4a;--nf-mute:#6b6b6b;--nf-line:#ececec;--nf-y:#f2de01;
 background:#fff;border-top:1px solid var(--nf-line);font-family:Inter,system-ui,sans-serif;color:var(--nf-txt);-webkit-font-smoothing:antialiased}
#colophon .site-container{max-width:1240px;padding-left:24px;padding-right:24px}
#colophon .site-footer-row-container{padding-left:0!important;padding-right:0!important}
/* środkowy rząd: 5 kolumn, wyrównane do góry */
#colophon .site-middle-footer-inner-wrap{padding-top:64px;padding-bottom:48px;grid-column-gap:40px;grid-row-gap:40px;align-items:start}
#colophon .site-middle-footer-inner-wrap.site-footer-row-columns-5{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.15fr) minmax(0,.85fr) minmax(0,.9fr)}
#colophon .site-middle-footer-inner-wrap .site-footer-section{flex-direction:column;align-items:flex-start;gap:0}
#colophon .site-middle-footer-inner-wrap .site-footer-section:after{display:none}
#colophon .site-middle-footer-inner-wrap .widget{margin:0}
#colophon .site-middle-footer-inner-wrap .widget:not(:first-child)>.nf-h{margin-top:30px!important}
/* nagłówki kolumn 2–5 na wysokości środka logo */
#colophon .site-footer-middle-section-2,#colophon .site-footer-middle-section-3,#colophon .site-footer-middle-section-4,#colophon .site-footer-middle-section-5{padding-top:9px}
#colophon .footer-widget-area{width:100%}
/* nagłówki kolumn – jak etykiety filarów na stronie głównej (.nh .lbl) */
#colophon .nf-h{display:flex;align-items:center;gap:9px;margin:0 0 18px!important;padding:0;font-size:15px!important;line-height:1.3;font-weight:700;letter-spacing:.02em;color:var(--nf-ink);text-transform:none}
#colophon .nf-h::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--nf-y);flex:none}
/* listy linków */
#colophon ul.nf-list{list-style:none;margin:0;padding:0!important;display:grid;gap:10px;font-size:15px}
#colophon ul.nf-list li{margin:0;line-height:1.45!important}
#colophon a{color:var(--nf-txt);text-decoration:none}
#colophon ul.nf-list a,#colophon .nf-contact a{text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:4px;transition:color .15s,text-decoration-color .15s}
#colophon ul.nf-list a:hover,#colophon ul.nf-list a:focus-visible,#colophon .nf-contact a:hover{color:var(--nf-ink);text-decoration-color:var(--nf-y)}
#colophon ul.nf-list .nf-all a{font-weight:500;color:var(--nf-ink)}
#colophon ul.nf-list .nf-all a::after{content:" →"}
/* kolumna marki */
#colophon .nf-logo img{display:block;height:34px;width:auto;margin:0}
#colophon .nf-lead{margin:18px 0 0!important;font-size:15px;line-height:1.55;color:var(--nf-mute);max-width:250px}
#colophon .nf-contact{margin:22px 0 0!important;font-size:15px;line-height:1.7}
#colophon .nf-contact a{color:var(--nf-ink);font-weight:500}
/* LinkedIn – monochromatyczny, 30 px */
#colophon .footer-social-wrap{margin-top:22px}
#colophon .footer-social-inner-wrap{font-size:30px;gap:0}
#colophon .footer-social-item.social-button{display:inline-flex;width:auto;height:auto;padding:0;background:none!important;border:0!important;color:var(--nf-ink)!important;line-height:0;transition:transform .15s}
#colophon .footer-social-item .kadence-svg-iconset svg{width:30px;height:35px}
#colophon .footer-social-item:hover,#colophon .footer-social-item:focus-visible{color:#000!important;transform:translateY(-1px)}
/* sklep B2B – monochromatyczne logo notebooki.pl */
#colophon .nf-shop{margin-top:28px!important;padding-top:20px;border-top:1px solid var(--nf-line)}
#colophon .nf-shop-cap{display:block;margin:0 0 10px;font-size:13px;line-height:1.3;color:var(--nf-mute)}
#colophon .nf-shop a{display:inline-flex;transition:opacity .15s;opacity:.92}
#colophon .nf-shop a:hover,#colophon .nf-shop a:focus-visible{opacity:1}
#colophon .nf-shop img{display:block;height:17px;width:auto;max-width:none}
/* dolny pasek */
#colophon .site-bottom-footer-wrap{border-top:1px solid var(--nf-line)}
#colophon .site-bottom-footer-inner-wrap{padding-top:20px;padding-bottom:22px}
#colophon .footer-html-inner p{margin:0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 32px;font-size:13px;line-height:1.6;color:var(--nf-mute);text-align:left}
#colophon .footer-html-inner a{color:var(--nf-mute);text-decoration:underline;text-decoration-color:var(--nf-y);text-decoration-thickness:2px;text-underline-offset:3px}
#colophon .footer-html-inner a:hover{color:var(--nf-ink)}
#colophon .footer-html-inner .nf-sep{margin:0 .45em;color:#b5b5b5}
#colophon a:focus-visible{outline:2px solid var(--nf-ink);outline-offset:3px;border-radius:2px}
/* tablet */
@media (max-width:1024px){
 #colophon .site-middle-footer-inner-wrap.site-footer-row-columns-5{grid-template-columns:repeat(3,minmax(0,1fr))}
 #colophon .site-footer-middle-section-1{grid-column:1/-1}
}
/* telefon */
@media (max-width:719px){
 #colophon .site-container{padding-left:20px;padding-right:20px}
 #colophon .site-footer-middle-section-1{padding-top:0}
 #colophon .site-middle-footer-inner-wrap{padding-top:44px;padding-bottom:32px;grid-row-gap:34px;grid-column-gap:20px}
 #colophon .site-middle-footer-inner-wrap.site-footer-row-columns-5{grid-template-columns:repeat(2,minmax(0,1fr))}
 #colophon .site-footer-middle-section-1,#colophon .site-footer-middle-section-3{grid-column:1/-1}
 #colophon .site-footer-middle-section-3 ul.nf-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
 #colophon .nf-lead{max-width:none}
 #colophon .nf-brand-row{display:flex;align-items:flex-end;justify-content:space-between}
 #colophon .footer-html-inner p{display:block}
 #colophon .footer-html-inner .nf-l1,#colophon .footer-html-inner .nf-l2{display:block}
 #colophon .footer-html-inner .nf-l2{margin-top:8px}
}
@media (max-width:719px){
 #colophon .site-footer-middle-section-1{order:1}#colophon .site-footer-middle-section-2{order:2}
 #colophon .site-footer-middle-section-4{order:3}#colophon .site-footer-middle-section-3{order:4}
 #colophon .site-footer-middle-section-5{order:5}
}

/* ===== ntbx – przycisk „Wróć na górę” (Kadence scroll_up), tylko ≤1024 px ===== */
@media (max-width:1024px){
  html #kt-scroll-up.scroll-up-wrap{
    box-sizing:border-box;width:44px;height:44px;padding:0;
    align-items:center;justify-content:center;
    right:30px;left:auto;                                   /* oś bąbelka czatu LeadBooster */
    bottom:calc(116px + env(safe-area-inset-bottom, 0px));  /* nad strefą czatu 104 px + 12 px */
    background:#fff;color:#282828;
    border:1px solid #e5e5e5;border-radius:50%;
    box-shadow:0 6px 18px rgba(0,0,0,.10),0 1px 3px rgba(0,0,0,.06);
    -webkit-tap-highlight-color:transparent;
    visibility:hidden;pointer-events:none;
    transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s;
  }
  html #kt-scroll-up.scroll-up-wrap .kadence-svg-iconset{display:flex}
  html #kt-scroll-up.scroll-up-wrap svg{width:18px;height:18px}
  /* akcent: cienki żółty pierścień przy dotyku / hover / fokusie */
  html #kt-scroll-up.scroll-up-wrap::after{
    content:"";position:absolute;inset:-5px;border-radius:50%;
    box-shadow:0 0 0 2px #f2de01;opacity:0;transform:scale(.92);
    transition:opacity .2s ease,transform .2s ease;
  }
  html #kt-scroll-up.scroll-up-wrap:hover::after,
  html #kt-scroll-up.scroll-up-wrap:active::after,
  html #kt-scroll-up.scroll-up-wrap:focus-visible::after{opacity:1;transform:scale(1)}
  html #kt-scroll-up.scroll-up-wrap:hover{color:#000;border-color:#d9d9d9}
  /* widoczny dopiero po ~600 px (klasa z mini-skryptu) */
  html.ntbx-top-600 #kt-scroll-up.scroll-up-wrap.scroll-visible{
    visibility:visible;pointer-events:auto;transition-delay:0s;
  }
  html:not(.ntbx-top-600) #kt-scroll-up.scroll-up-wrap{opacity:0;transform:translateY(16px)}
}
@media (prefers-reduced-motion:reduce){
  html #kt-scroll-up.scroll-up-wrap,html #kt-scroll-up.scroll-up-wrap::after{transition:none}
}
/* od 576 px LeadBooster odsuwa czat 28 px od krawędzi – przycisk dalej na osi czatu, 12 px nad nim */
@media (min-width:576px) and (max-width:1024px){
  html #kt-scroll-up.scroll-up-wrap{right:58px;bottom:calc(144px + env(safe-area-inset-bottom, 0px))}
}