/* ---------- SKIP LINK (dostepnosc: pierwszy TAB na stronie) ---------- */
.skip-link{
  position:fixed; left:16px; top:16px; z-index:60;
  transform:translateY(-300%);
  background:var(--ink,#14161A); color:#fff;
  padding:.75rem 1.2rem; border-radius:10px;
  font-size:.95rem; font-weight:600; text-decoration:none; white-space:nowrap;
  outline:2px solid #0468C9; outline-offset:2px;
  transition:transform .15s ease;
}
.skip-link:focus{transform:none}
@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}



/* ---------- NAGŁÓWEK (ciemny pasek, gradientowa krawędź) ---------- */
header[data-header]{
  position:sticky; top:0; z-index:50;
  width:100%; max-width:none; margin:0; padding:0;   /* reset ewentualnych reguł ze styles.css/oferta.css */
  transition:transform .28s ease; will-change:transform;
  background:rgba(18,20,24,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
}

header[data-header]::after{
  content:""; display:block; height:3px;
  background:linear-gradient(90deg,#0586FE 0%,#48F983 50%,#8058FD 100%);
}

header[data-header] .wrap{max-width:1180px; margin:0 auto; padding:0 24px}

header[data-header] .nav{display:flex; align-items:center; justify-content:space-between; height:64px; gap:24px}

header[data-header] .logo{display:inline-flex; align-items:center; line-height:0; text-decoration:none}

header[data-header] .logo .brand-logo{height:30px; width:auto; display:block}

header[data-header] nav{display:block}

header[data-header] .nav-links{display:flex; gap:1.6rem; list-style:none; align-items:center; margin:0; padding:0}


header[data-header] .nav-links a{
  text-decoration:none; font-size:.95rem; font-weight:500; color:#EDEEF0;
  font-family:var(--body);
}

header[data-header] .nav-links a:hover{color:#4FA0FF}

header[data-header] .nav-links a[aria-current="page"]{color:#4FA0FF}

header[data-header] .nav-links a.btn{display:inline-block; padding:.8rem 1.5rem; border-radius:999px; font-weight:600; font-size:.95rem; border:1px solid transparent}

header[data-header] .nav-links a.btn-rec{background:#0468C9; color:#fff}  /* #0586FE dawal 3,6:1 z bialym; ten sam blekit o stopien ciemniej spelnia AA (5,5:1) */

header[data-header] .nav-links a.btn-rec:hover{background:#035AA6}

header[data-header].hdr-hidden{transform:translateY(-100%)}


/* ---------- HAMBURGER (mobile / tablet) ---------- */
header[data-header] .nav-toggle{display:none}
@media(max-width:1024px) {
  header[data-header] .nav-links{gap:1.15rem}

  header[data-header] .nav-links a{font-size:.95rem}}
@media(max-width:960px) {
  header[data-header] .nav-toggle{
    display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
    width:44px; height:44px; flex:0 0 auto; padding:0; cursor:pointer;
    background:transparent; border:1px solid rgba(255,255,255,.18); border-radius:11px;
    -webkit-tap-highlight-color:transparent;
  }

  header[data-header] .nav-toggle:hover{border-color:rgba(255,255,255,.34)}

  header[data-header] .nav-toggle:focus-visible{outline:2px solid #4FA0FF; outline-offset:2px}

  header[data-header] .nav-toggle span{
    display:block; width:21px; height:2px; background:#EDEEF0; border-radius:2px;
    transition:transform .22s ease, opacity .16s ease;
  }

  header[data-header] .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}

  header[data-header] .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}

  header[data-header] .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}


  header[data-header] nav{
    position:absolute; left:0; right:0; top:100%;
    background:#101216; box-shadow:0 18px 40px rgba(0,0,0,.45);
    border-bottom:1px solid rgba(255,255,255,.08);
    max-height:0; overflow:hidden; visibility:hidden;
    transition:max-height .26s ease, visibility 0s linear .26s;
  }

  header[data-header] nav.is-open{max-height:82vh; overflow-y:auto; visibility:visible; transition:max-height .26s ease, visibility 0s}

  header[data-header] .nav-links{
    flex-direction:column; align-items:stretch; gap:0;
    max-width:1180px; margin:0 auto; padding:.4rem 24px 1.5rem;
  }

  header[data-header] .nav-links li + li{border-top:1px solid rgba(255,255,255,.075)}

  header[data-header] .nav-links a{display:block; padding:1rem 0; font-size:.95rem}

  header[data-header] .nav-links li:last-child{border-top:0; margin-top:1rem}

  header[data-header] .nav-links a.btn{display:block; text-align:center; padding:.95rem 1.5rem}}
@media(max-width:520px) { header[data-header] .logo .brand-logo{height:26px}}


/* ---------- STOPKA (ciemna, 3 kolumny) ---------- */
footer[data-footer]{
  display:block; width:100%; max-width:none; margin:0;   /* reset ewentualnych reguł footer{} ze styles.css/oferta.css */
  background:#0E1013; color:#9BA0AA; padding:3.2rem 0 2.4rem; font-size:.95rem;
}

footer[data-footer] .wrap{max-width:1180px; margin:0 auto; padding:0 24px}

footer[data-footer] .cols{display:grid; grid-template-columns:1.5fr .9fr .9fr 1.1fr; gap:2rem; margin-bottom:2.2rem}

footer[data-footer] h3{
  font-family:var(--body); font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; color:#fff; margin:0 0 .9rem; font-weight:500; line-height:1.6;
}

footer[data-footer] p{margin:0}

footer[data-footer] ul{list-style:none; display:grid; gap:.5rem; margin:0; padding:0}

footer[data-footer] a{color:#9BA0AA; text-decoration:none}

footer[data-footer] a:hover{color:#fff}

footer[data-footer] .legal{
  border-top:1px solid #2E323A; padding-top:1.6rem; display:flex; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; font-family:var(--body); font-size:.72rem;
}
@media(max-width:820px) { footer[data-footer] .cols{grid-template-columns:1fr 1fr; gap:1.6rem}}
@media(max-width:560px) { footer[data-footer] .cols{grid-template-columns:1fr}}
/* Linki w kolumnach stopki mialy 13-17 px wysokosci pola kliku */
footer[data-footer] li a{display:inline-block;padding:.14rem 0}

/* Mapa Google wczytuje sie dopiero po kliknieciu - zadnych cookies Google przed zgoda */
.map-lazy{position:relative}
.map-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;min-height:inherit;height:100%;padding:1.6rem;text-align:center}
.map-placeholder p{margin:0;max-width:34ch}
.map-placeholder small{opacity:.72;font-size:.8rem}

/* --- Baner cookies (cookies.js) i linki prawne w stopce --- */
.ck{position:fixed;left:1rem;bottom:1rem;z-index:1200;max-width:34rem;font-family:var(--body)}
.ck[hidden]{display:none}
.ck-card{background:var(--ink);color:#fff;border:1px solid var(--line-dark);border-radius:16px;padding:1.2rem 1.3rem;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.ck h2{font-size:1rem;margin:0 0 .5rem;color:#fff}
.ck p{font-size:.85rem;line-height:1.55;color:var(--muted-light);margin:0 0 .9rem;max-width:none}
.ck p a{color:#fff}
.ck-actions{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.ck .btn{display:inline-block;padding:.65rem 1.2rem;border-radius:999px;font-weight:600;font-size:.9rem;border:1px solid transparent;cursor:pointer;font-family:inherit;line-height:1.2}
.ck .btn-rec{background:#0468C9;color:#fff}
.ck .btn-rec:hover{background:#035AA6}
.ck .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.ck .btn-ghost:hover{border-color:#fff}
.ck-link{background:none;border:0;color:#fff;text-decoration:underline;cursor:pointer;font:inherit;font-size:.85rem;padding:.4rem .2rem}
.ck-panel{margin-top:.9rem;border-top:1px solid var(--line-dark);padding-top:.9rem}
.ck-panel[hidden]{display:none}
.ck-opt{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 .6rem;font-size:.85rem;color:#fff;cursor:pointer}
.ck-opt input{margin-top:.2rem;accent-color:#0468C9;flex:none}
.ck-opt small{display:block;color:var(--muted-light);font-size:.78rem}
.ck-info{font-size:.78rem}
@media(max-width:640px){.ck{left:0;right:0;bottom:0;max-width:none}.ck-card{border-radius:16px 16px 0 0}}
@media(prefers-reduced-motion:no-preference){.ck-card{animation:ck-in .25s ease-out}}
@keyframes ck-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
footer[data-footer] .legal a,footer[data-footer] .legal .link-btn{color:inherit;text-decoration:underline}
footer[data-footer] .legal .link-btn{background:none;border:0;padding:0;font:inherit;cursor:pointer}