.site-footer { padding-top: 3rem; color: rgba(255,255,255,.68); background: #051226; }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: 2.7rem; }
.brand-footer { color: var(--white); }
.footer-company { display: flex; align-items: center; gap: 1rem; }
.footer-company p { margin: 0; font-size: .78rem; }
.footer-socials { display: flex; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.footer-socials a { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; color: var(--white); border: 1px solid rgba(255,255,255,.22); border-radius: 50%; transition: color var(--transition), border-color var(--transition), background var(--transition); }
.footer-socials a:hover, .footer-socials a:focus-visible { color: var(--navy); border-color: var(--mint); outline: 0; background: var(--mint); }
.footer-socials svg { width: 1rem; height: 1rem; fill: currentColor; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; padding-block: 1.4rem; border-top: 1px solid rgba(255,255,255,.12); font-size: .65rem; }

@media (max-width: 700px) {
  .footer-top, .footer-bottom { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .footer-company { align-items: flex-start; flex-direction: column; }
  .footer-top { padding-bottom: 2rem; }
  .footer-bottom { padding-block: 1.2rem; }
}