.site-footer{
  background:var(--ink);
  color:rgba(255,255,255,0.75);
  padding:56px 0 28px;
  border-top:3px solid var(--ink);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:36px;
  padding-bottom:36px;
  border-bottom:2px solid rgba(255,255,255,0.12);
}
.footer-brand .brand{ color:#fff; }
.footer-brand p{ margin-top:14px; font-size:0.9rem; max-width:32ch; }
.footer-col h4{ color:#fff; font-family:var(--font-display); font-size:0.95rem; margin-bottom:16px; }
.footer-col a, .footer-col span{
  display:block; font-size:0.88rem; margin-bottom:10px; color:rgba(255,255,255,0.65);
  transition:color .25s ease, transform .25s cubic-bezier(.2,.7,.3,1);
}
.footer-col a:hover{ color:var(--spark); transform:translateX(5px); }
.footer-col a:focus-visible{ outline:2px solid var(--spark); outline-offset:3px; border-radius:4px; }

.footer-social{ display:flex; gap:10px; margin-top:16px; }
.footer-social a{
  width:38px; height:38px; border-radius:12px;
  background:rgba(255,255,255,0.1);
  border:1.5px solid rgba(255,255,255,0.2);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .2s ease, transform .2s ease;
}
.footer-social a:hover{ background:var(--primary); transform:translateY(-2px); }
.footer-social svg{ width:16px; height:16px; }
.footer-bottom{
  padding-top:24px; display:flex; justify-content:space-between;
  font-size:0.8rem; flex-wrap:wrap; gap:10px;
}

@media (max-width:1024px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  .footer-grid{ grid-template-columns:1fr; }
  .footer-bottom{ flex-direction:column; }
}