/* Ikony profili spolecznosciowych (szablon home/includes/social.html).
   Ladowany w base.html PO nowa.css i telefon.css, bo musi nadpisac generyczne
   reguly stopki (.footer-grid a{display:block;margin-bottom:9px} z strama.css i nowa.css).
   Dwa warianty: .soc--stopka (granatowa stopka) i .soc--kontakt (jasna strona /kontakt/).
   Adresy profili sa w szablonie include, nie tutaj. */

.soc{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0}
.soc li{margin:0;padding:0}
.soc a{display:grid;place-items:center;width:40px;height:40px;margin:0;padding:0;
  color:inherit;background:transparent;line-height:0;
  transition:color .18s var(--ease),background-color .18s var(--ease)}
.soc a:hover{text-decoration:none;transform:none}
.soc svg{width:20px;height:20px;display:block;flex:none}

/* --- wariant: stopka (granat #171B2B, tekst #c9d3dc, akcent #7fc0ea) --------- */
.footer-soc{margin-top:18px;margin-left:-10px}  /* -10px = wyrownanie glifu do lewej krawedzi kolumny */
.soc--stopka a{color:#c9d3dc}
.soc--stopka a:hover{color:#fff;background:rgba(255,255,255,.09)}
.soc--stopka a:focus-visible{outline:2px solid #7fc0ea;outline-offset:-2px;color:#fff}

/* --- wariant: kontakt (jasne tlo, akcent --nieb #006EB6) -------------------- */
.soc--kontakt a{color:var(--granat)}
.soc--kontakt a:hover{color:var(--nieb);background:var(--n50)}
.soc--kontakt a:focus-visible{outline:2px solid var(--nieb);outline-offset:-2px;color:var(--nieb)}

@media (prefers-reduced-motion:reduce){.soc a{transition:none}}