.site-footer{
  background: linear-gradient(to right,rgba(32,45,62,.98) 0%,rgba(32,45,62,.92) 50%,rgba(32,45,62,.75) 100%);
  color:#fff;padding:80px 0 0;border-top:1px solid rgba(255,255,255,.1);margin-top:60px
}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1.5fr;gap:60px;
  margin-bottom:60px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.08)
}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.footer-logo{
  width:80px;height:80px;border-radius:50%;border:2px solid rgba(255,255,255,.8);
  display:grid;place-items:center
}
.footer-desc{color:rgba(255,255,255,.6);line-height:1.8;margin-top:8px;max-width:400px}
.footer-links h4,.footer-contact h4{font-size:18px;margin:0 0 24px;font-weight:600}
.footer-links nav{display:flex;flex-direction:column;gap:16px}
.footer-links a{color:rgba(255,255,255,.7);transition:.2s}
.footer-links a:hover{color:#fff;transform:translateX(4px)}
.footer-contact ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.footer-contact li{display:block}
.footer-contact-link{
  display:flex;align-items:center;gap:16px;
  padding:8px;margin:-8px;border-radius:14px;
  color:inherit;text-decoration:none;
  transition:background .2s,transform .2s
}
.footer-contact-link:hover{background:rgba(255,255,255,.06)}
.footer-contact-link:hover .icon-circle{transform:scale(1.06)}
.icon-circle{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:20px;flex-shrink:0;transition:transform .2s}
.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding:32px 0;font-size:14px;color:rgba(255,255,255,.5)
}
.footer-legal{display:flex;gap:24px}
.footer-legal a:hover{color:#fff}

@media(max-width:1024px){
  .footer-grid{grid-template-columns:1.5fr 1fr 1.3fr;gap:40px}
}
@media(max-width:900px){
  .site-footer{padding:60px 0 0;margin-top:40px}
  .footer-grid{grid-template-columns:1fr;gap:40px;margin-bottom:40px;padding-bottom:40px}
  .footer-bottom{flex-direction:column;gap:16px;text-align:center;padding:24px 0}
  .footer-desc{max-width:100%}
}
@media(max-width:480px){
  .site-footer{padding:48px 0 0}
  .footer-grid{gap:30px}
  .footer-logo{width:64px;height:64px}
  .footer-links h4,.footer-contact h4{margin-bottom:18px;font-size:17px}
  .footer-contact li{gap:12px}
  .icon-circle{width:42px;height:42px;font-size:18px}
  .footer-legal{flex-wrap:wrap;justify-content:center;gap:16px}
}