/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background: var(--ink); color: oklch(85% 0.01 80); padding-top: clamp(3.5rem, 7vw, 5rem); }
.site-footer__grid{ display: grid; grid-template-columns: repeat(12,1fr); gap: var(--gap); padding-bottom: 3rem; }
.site-footer__brand{ grid-column: span 4; }
.site-footer .site-header__wordmark-main{ color: var(--white); }
.site-footer .site-header__wordmark-sub{ color: oklch(78% 0.03 75); }
.site-footer__brand p{ margin-top: 1rem; font-size: .9rem; color: oklch(72% 0.01 80); max-width: 32ch; }
.site-footer__col{ grid-column: span 2; }
.site-footer__col:first-of-type{ grid-column: span 3; }
.site-footer__col h4{ color: var(--white); font-family: var(--font-body); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; margin-bottom: 1.1rem; }
.site-footer__col ul{ display: flex; flex-direction: column; gap: .7rem; }
.site-footer__col a{ font-size: .92rem; color: oklch(80% 0.01 80); transition: color var(--dur-fast) var(--ease-out); }
.site-footer__col a:hover{ color: var(--white); }
.site-footer__contact li{ display: flex; align-items: flex-start; gap: .6em; font-size: .9rem; color: oklch(80% 0.01 80); }
.site-footer__contact .icon{ margin-top: .15em; flex-shrink: 0; color: oklch(78% 0.03 75); }
.site-footer__contact a:hover{ color: var(--white); }

.site-footer__bottom{
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding-block: 1.4rem; border-top: 1px solid oklch(100% 0 0 / 0.1);
  font-size: .82rem; color: oklch(65% 0.01 80);
}
.footer-top{
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid oklch(100% 0 0 / 0.2);
  display: inline-flex; align-items: center; justify-content: center; background: transparent; color: var(--white);
  transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.footer-top:hover{ background: oklch(100% 0 0 / 0.1); transform: translateY(-3px); }
.footer-top:active{ transform: translateY(-1px) scale(.96); }

@media (max-width: 900px){
  .site-footer__brand{ grid-column: span 12; }
  .site-footer__col{ grid-column: span 4; }
  .site-footer__col:first-of-type{ grid-column: span 4; }
}
@media (max-width: 600px){
  .site-footer__grid{ gap: 2rem var(--gap); }
  .site-footer__col, .site-footer__col:first-of-type{ grid-column: span 6; }
  .site-footer__bottom{ flex-direction: column; align-items: flex-start; }
}