:root{--pvc:#f97316;--szary:#6b7280;--szary-jasny:#e5e7eb;--bialy:#ffffff;--stal:#9ca3af;--tekst:#0b1220;--radius:16px;--shadow:0 10px 30px rgba(2,6,23,.12)}
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font:16px/1.6 system-ui,Segoe UI,Roboto,Ubuntu,sans-serif;color:var(--tekst);background:var(--bialy)}
  a{color:var(--pvc);text-decoration:none}a:hover{text-decoration:underline}
  .wrap{max-width:1120px;margin:auto;padding:24px}
  header.site{color:var(--bialy);background:linear-gradient(180deg,var(--szary),#374151)}
  .topbar{display:flex;gap:16px;align-items:center;justify-content:space-between}
  .brand{display:flex;align-items:center;gap:12px}
  .logo{width:56px;height:56px;border-radius:12px;display:grid;place-items:center;background:conic-gradient(from 180deg at 50% 50%,var(--stal),#6d7789,var(--stal));border:3px solid var(--szary-jasny);box-shadow:var(--shadow)}
  .logo b{color:#fff;font-size:12px;letter-spacing:.4px;text-transform:uppercase;text-align:center;white-space:pre-line}
  .brand h1{margin:0;font-size:20px;line-height:1.2}.brand h1 small{display:block;font-weight:500;opacity:.9}
  nav.main{margin-top:12px}.navlist{display:flex;gap:12px;flex-wrap:wrap}
  .navlist a{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.06);color:#e5e7eb;border:1px solid rgba(255,255,255,.15)}.navlist a:hover{background:rgba(255,255,255,.15);text-decoration:none}
  .btn{display:inline-block;padding:12px 16px;border-radius:12px;font-weight:800;border:1px solid transparent;transition:.15s}
  .btn-primary{background:#c2410c;color:#fff;border-color:#a33a0a}
  .btn-primary:hover{filter:brightness(.95);transform:translateY(-1px)}
  .btn-ghost{background:transparent;color:#fff;border-color:#d1d5db;border:1px solid #9ca3af}
  .hero{display:grid;gap:18px;grid-template-columns:1.1fr .9fr;align-items:center;padding:30px 0 40px}
  .hero .card{background:linear-gradient(180deg,#111827,#0b1220);border:1px solid #1f2937;border-radius:16px;padding:20px;box-shadow:var(--shadow)}
  .hero h2{margin:0 0 8px;font-size:28px;color:#fff}.hero p{margin:0 0 12px;color:#d1d5db}
  .badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
  .badge{background:linear-gradient(180deg,#fefefe,#e5e7eb);color:#111827;border:1px solid var(--szary-jasny);padding:6px 10px;border-radius:999px;font-size:13px}
  .grid{display:grid;gap:18px}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sekcja-blok{background:#fff;border:1px solid var(--szary-jasny);border-radius:16px;padding:20px;box-shadow:var(--shadow)}
  .hdr{display:flex;align-items:center;gap:10px;margin:0 0 10px}
  .hdr .line{flex:1;height:1px;background:linear-gradient(90deg,var(--pvc),transparent)}
  .usluga{background:#fff;border:1px dashed var(--stal);padding:16px;border-radius:14px}
  .kafel{padding:16px;border:1px solid var(--szary-jasny);border-radius:14px;background:linear-gradient(180deg,#fff,#f8fafc)}
  .list{margin:0;padding-left:18px}
  footer.site{margin-top:40px;background:linear-gradient(180deg,#0f172a,#0b1220);color:#e5e7eb}
  footer .cols{display:grid;gap:24px;grid-template-columns:2fr 1fr 1fr}
  .copyright{border-top:1px solid #1f2937;margin-top:16px;padding-top:16px;font-size:14px;color:#94a3b8}
  .sticky-call{position:fixed;bottom:14px;right:14px;z-index:50}
  .sticky-call a{display:inline-flex;align-items:center;gap:10px;background:#c2410c;color:#fff;padding:12px 16px;border-radius:999px;box-shadow:var(--shadow);border:1px solid #a33a0a}
  .table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:12px;border:1px solid var(--szary-jasny)}
  .table th,.table td{padding:10px;border-bottom:1px solid var(--szary-jasny)}.table th{text-align:left;background:linear-gradient(180deg,#fff,#f3f4f6)}
  .note{font-size:14px;color:#6b7280}
  .brushed{background:repeating-linear-gradient(90deg,rgba(255,255,255,.12)0,rgba(255,255,255,.12)2px,rgba(0,0,0,.06)2px,rgba(0,0,0,.06)4px),linear-gradient(180deg,#9aa0a6,#7a828a);border:1px solid #9ca3af;border-radius:12px;padding:12px;color:#111827}
  @media(max-width:900px){.hero{grid-template-columns:1fr}.hide-sm{display:none}}

  /*a11y-added*/
  a,button{outline:none}
  a:focus-visible,.btn:focus-visible,.navlist a:focus-visible{
    outline:3px solid #ffffff;
    outline-offset:2px;
    box-shadow:0 0 0 3px rgba(0,0,0,.25);
  }
  .btn,.sticky-call a{min-height:44px;min-width:44px;line-height:1.2}

  /* === Mobile header layout: title top, logo left, CTA right === */
  @media (max-width:900px){
    .topbar{
      display:grid;
      grid-template-columns: 1fr auto;
      grid-template-rows: auto auto;
      align-items:start;
      gap:12px;
    }
    .brand{ display:contents; }
    .brand h1{
      grid-column: 1 / -1;
      grid-row: 1;
      margin:0;
    }
    .brand .logo{
      grid-column: 1;
      grid-row: 2;
      justify-self:start;
      margin:0;
    }
    .topbar .cta{
      grid-column: 2;
      grid-row: 2;
      align-self:start;
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    /* extra mobile breathing room for sticky CTA */
    body{padding-bottom:96px}
    footer.site{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  }
  .sticky-call{bottom:calc(14px + env(safe-area-inset-bottom,0px))}

  /* Header CTA spacing desktop & mobile */
  .topbar .cta{display:flex;gap:14px;flex-wrap:wrap}
  @media (max-width:900px){
    .topbar{align-items:flex-start}
    .topbar .btn{min-width:180px}
  }

  /* Footer spacing */
  footer .cols{gap:24px}
  @media (max-width:900px){
    footer .cols{grid-template-columns:1fr;gap:18px}
    footer .cols h3, footer .cols h4{margin:0 0 8px}
    footer .cols p{margin:0;line-height:1.8}
    footer .cols a{display:inline-block;margin-bottom:6px}
    .copyright{margin-top:16px;padding-top:16px}
  }

  /* ====== MOBILE MENU – UX/A11y fix ====== */
  .nav-toggle{position:absolute;left:-9999px;top:-9999px}  /* hidden checkbox */
  .nav-toggle-btn{
    display:none;
    border:1px solid #d1d5db;
    background:#ffffff; color:#0b1220;
    padding:12px 14px; border-radius:12px; font-weight:800;
    box-shadow:0 6px 20px rgba(2,6,23,.06);
  }

  @media (max-width:900px){
    .nav-toggle-btn{display:inline-block;margin-top:12px}
    nav.main .navlist{display:none}
    .nav-toggle:checked + .nav-toggle-btn + nav.main .navlist{display:grid}
    .navlist{
      grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
      gap:12px; margin-top:12px;
    }
    .navlist a{
      background:#ffffff; color:#0b1220;
      border:1px solid #d1d5db;
      padding:14px 16px; border-radius:14px;
      font-weight:700; text-align:center;
      box-shadow:0 6px 20px rgba(2,6,23,.06);
    }
    .navlist a:focus-visible{outline:3px solid #111827; outline-offset:2px}
  }

  /* === Hamburger under PRO KANAŁ on mobile === */
  @media (max-width:900px){
    .nav-toggle-btn{
      display:inline-flex;
      align-items:center; justify-content:center;
      margin:8px 0 0 0;         /* pod logo, lewa krawędź */
      min-width:132px;
    }
  }

  /* === Services: single column on mobile === */
  @media (max-width:900px){
    .grid.cols-3, .grid.cols-2{grid-template-columns:1fr !important}
    .usluga{padding:18px}
  }

 /* === Contrast AA fix for links on light backgrounds === */
.sekcja-blok a,
.list a,
.kafel a {
  color: #c2410c;         /* ~5.18:1 na #fff – spełnia WCAG AA */
  font-weight: 700;
}
.sekcja-blok a:hover,
.list a:hover,
.kafel a:hover {
  text-decoration: underline;
}

/* (opcjonalnie) linki w nagłówkach sekcji, gdyby się pojawiły */
.sekcja-blok h2 a, .sekcja-blok h3 a { color: #9a3412; } /* ~7.31:1 */

  

/* Shared utility classes */
.btn-light{background:#fefefe;border:1px solid #d1d5db;color:#111827}
.plain-list{list-style:none;margin:0;padding:0}
.link-matka{margin:.4rem 0 0}
.spis-tresci{margin:20px 0}
.form-cta .btn{margin-top:.25rem}
.error-page{max-width:760px;margin:40px auto}
.error-page .actions{display:flex;gap:12px;flex-wrap:wrap}