/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{
  background: var(--color-ink);
  color: rgba(255,255,255,.72);
  padding: 72px 0 28px;
}
.footer-top{
  display:grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 40px;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.footer-brand img{ height: 30px; margin-bottom: 18px; }
.footer-brand p{ font-size: 14.5px; max-width: 34ch; margin-bottom:22px; }
.social-row{ display:flex; gap:10px; }
.social-row a{
  width:34px; height:34px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background: rgba(255,255,255,.08);
  transition: background .25s ease, transform .25s ease;
}
.social-row a:hover{ background: var(--color-accent); transform: translateY(-3px); }
.social-row img{ width:16px; height:16px; }

.footer-col h4{
  color:#fff;
  font-size: 14px;
  font-weight:700;
  margin-bottom: 18px;
}
.footer-col ul li{ margin-bottom: 12px; }
.footer-col a{ font-size: 14.5px; transition: color .2s ease; }
.footer-col a:hover{ color: var(--color-accent); }

.footer-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  padding-top: 26px;
  font-size: 13px;
}
.footer-legal{ display:flex; gap:20px; flex-wrap:wrap; }
.footer-legal a:hover{ color: var(--color-accent); }