/* =========================================================
   Stopka (biała, minimalistyczna) — LKS Brzoza Brzezówka
   Wgraj do: assets/css/footer.css  (podłączona na każdej stronie)
   ========================================================= */
.foot{
  position:relative;
  background:#fff;
  border-top:1px solid var(--paper-line);
  padding-top:34px;                /* linia ze strzałką blisko herbu i nazwy klubu */
  color:var(--ink-soft);
}
/* cienka kolorowa linia na górze stopki */
.foot::before{
  content:"";
  position:absolute; left:0; right:0; top:-1px; height:3px;
  background:linear-gradient(90deg, var(--navy-800), var(--mustard-500) 50%, var(--navy-800));
}

/* ---------- przycisk "na górę": sama cienka strzałka, bez kółka ---------- */
.to-top{
  position:absolute; left:50%; top:-24px;
  transform:translateX(-50%);
  padding:0 16px;
  height:48px;
  display:grid; place-items:center;
  background:#fff;                 /* "przecina" linię na górze stopki */
  color:var(--navy-900);
  transition:color .25s ease;
  z-index:2;
}
/* cienka musztardowa okrągła otoczka wokół strzałki */
.to-top::before{
  content:""; position:absolute; left:50%; top:50%;
  width:44px; height:44px; margin:-22px 0 0 -22px;
  border:1.5px solid var(--mustard-500); border-radius:50%;
  transition:background-color .25s ease, border-color .25s ease, transform .3s cubic-bezier(.2,.8,.2,1);
}
.to-top svg{
  position:relative;
  width:22px; height:22px;
  fill:none; stroke:currentColor; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.to-top:hover{color:var(--mustard-700);}
.to-top:hover::before{background:var(--mustard-100); border-color:var(--mustard-600); transform:scale(1.06);}
.to-top:hover svg{transform:translateY(-3px);}
.to-top:focus-visible{outline:none;}
.to-top:focus-visible::before{box-shadow:0 0 0 3px var(--mustard-100); border-color:var(--mustard-600);}

/* ---------- logo, nazwa i social — wyśrodkowane ---------- */
.foot-center{
  display:flex; flex-direction:column; align-items:center;
  gap:18px;
  padding-bottom:28px;
  text-align:center;
}
.foot-logo{display:inline-flex; align-items:center; gap:14px;}
.foot-logo img{width:64px; height:64px; object-fit:contain;}
.foot-logo span{
  font-family:var(--ff-display);
  font-weight:500;
  font-size:1.5rem;
  letter-spacing:.01em;
  color:var(--navy-900);
}

/* ---------- ikony social: minimalistyczne, same kontury ---------- */
.foot-social{display:flex; gap:30px;}
.foot-social a{
  position:relative;
  display:grid; place-items:center;
  color:var(--navy-900);
  transition:color .25s ease, transform .3s cubic-bezier(.2,.8,.2,1);
}
.foot-social svg{
  width:32px; height:32px;
  fill:none; stroke:currentColor; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
}
/* cienka kreska pod ikoną, która "wjeżdża" po najechaniu */
.foot-social a::after{
  content:"";
  position:absolute; left:50%; bottom:-8px;
  width:100%; height:1.5px;
  background:var(--mustard-500);
  transform:translateX(-50%) scaleX(0);
  transition:transform .3s ease;
}
.foot-social a:hover{color:var(--mustard-600); transform:translateY(-3px);}
.foot-social a:hover::after{transform:translateX(-50%) scaleX(1);}

/* ---------- dolny pasek ---------- */
.foot-bottom{
  padding:16px 0 20px;
  border-top:1px solid var(--paper-line);
  display:flex; justify-content:space-between; gap:8px 16px; flex-wrap:wrap;
  font-size:.84rem;
  color:var(--ink-faint);
}
@media (max-width:640px){
  .foot{padding-top:32px;}
  .foot-bottom{justify-content:center; text-align:center;}
  .foot-logo span{font-size:1.25rem;}
}
