/* Site footer: company mark, links to every G-ynthetic Labs site, legal pages. */
.site-footer {
  display: grid;
  grid-template-columns: minmax(200px, 1.2fr) 1fr 1fr;
  gap: 32px 40px;
  padding: 48px 4.5% 35px;
  background: var(--flow-dark);
}
.site-footer .brand { align-self: start; }
.footer-nav h2 {
  margin: 0 0 16px;
  color: var(--dim);
  font: 400 9px/1.6 ui-monospace, Consolas, monospace;
  letter-spacing: .12em;
}
.footer-nav ul { margin: 0; padding: 0; list-style: none; }
.footer-nav li + li { margin-top: 10px; }
.footer-nav a { font-size: 13px; line-height: 1.5; }
.footer-nav a:hover { color: var(--accent); }
.footer-nav small { display: block; color: #8f978d; font-size: 10px; }
.footer-base {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  color: var(--dim);
  font-size: 10px;
  line-height: 1.6;
}
.footer-base small { display: inline-block; margin-top: 8px; font-size: 9px; }
.footer-base .mono { font-size: 8px; }

@media (max-width: 1000px) {
  .site-footer { grid-template-columns: 1fr 1fr; }
  .site-footer > .brand { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .site-footer .brand .company-logo { width: 200px; }
}
@media (max-width: 680px) {
  .site-footer { padding: 36px 5% 30px; gap: 28px 20px; }
  .footer-base { flex-direction: column; align-items: start; font-size: 9px; }
}