/* Footer */ /* wraps the footer markup (see assets/js/site-footer.js). display:contents removes its own box so .footer stays a layout child of and its full-width border/padding render unchanged. */ site-footer { display: contents; } .footer { border-top: 1px solid #171717; padding: 36px 0; } .footer-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); } /* footer reuses the .brand lockup at a smaller, dimmer size */ .footer .brand-mark { width: 24px; height: 24px; border-radius: 7px; } .footer .brand-text { font-size: 14px; color: #d8d8d8; } .footer-links { display: flex; gap: 26px; font-size: 13px; } .footer-links a { color: #7a7a7a; transition: color 160ms ease; } .footer-links a:hover { color: #c9c9c9; } .copyright { color: #515151; font-family: var(--mono); font-size: 12px; }