/* ============================================================
   PASEK „OBSERWUJ NAS” (28.10.2026) — Facebook i Instagram nad stopką.
   Osobny plik: strona główna ma CSP bez stylów w linii.
   Kolory z tokenów obu skórek; przyciski duże, z ikoną i nazwą.
   ============================================================ */
.soc-pasek{margin:40px auto 0;padding:0 20px;max-width:1200px}
.soc-pasek-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 28px;
  padding:22px 26px;border:1px solid var(--line);border-radius:var(--r-lg,16px);
  background:linear-gradient(135deg,color-mix(in srgb,var(--acc,var(--akcent)) 12%,var(--panel,#111)),var(--panel,#111))}
.soc-pasek-tx{flex:1 1 320px;min-width:0}
.soc-pasek-tx b{display:block;font-size:20px;line-height:1.2;color:var(--tx);margin:0 0 4px;letter-spacing:.01em}
.soc-pasek-tx span{display:block;font-size:14px;line-height:1.55;color:var(--mut)}
.soc-pasek-btn{display:flex;flex-wrap:wrap;gap:12px}
.soc-b{display:inline-flex;align-items:center;gap:12px;padding:12px 20px 12px 16px;border-radius:999px;
  font-weight:800;font-size:15px;line-height:1.15;text-decoration:none;color:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.25);transition:transform .15s,box-shadow .15s,filter .15s}
.soc-b:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.32);filter:brightness(1.07);color:#fff}
.soc-b:focus-visible{outline:3px solid var(--acc,var(--akcent));outline-offset:3px}
.soc-b .soc-ik{width:24px;height:24px;flex:none}
.soc-b small{display:block;font-weight:500;font-size:12px;opacity:.88;margin-top:2px}
.soc-b-facebook{background:#1877f2}
.soc-b-instagram{background:linear-gradient(45deg,#f58529,#dd2a7b 45%,#8134af 75%,#515bd4)}
@media(max-width:560px){
  .soc-pasek{margin-top:28px;padding:0 16px}
  .soc-pasek-in{padding:18px}
  .soc-pasek-btn{width:100%}
  .soc-b{flex:1 1 100%;justify-content:flex-start}
}