/*
   ===========================================================
   MOTOVEST CANONICAL FOOTER STYLES
   This file owns ALL footer styling for every page.
   It is the single source of truth — do not duplicate these
   rules in page-specific CSS (e.g. remove the FOOTER block
   from drivers.css so they can't conflict).
   ===========================================================
 */

.site-footer{
  background:#050505;
  border-top:1px solid var(--border-color);
  padding:70px 0 0;
}

.site-footer .footer-grid{
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1.2fr;
  gap:40px;
  align-items:start;
}

/* ---------- Brand column ---------- */
.footer-brand .logo{
  display:inline-flex;
  margin-bottom:18px;
}

.footer-brand .logo-img{
  height:40px;
  width:auto;
  display:block;
}

.footer-brand p{
  color:var(--text-secondary);
  max-width:340px;
  margin-bottom:22px;
  line-height:1.6;
}

/* ---------- Social icons ---------- */
.social-links{
  display:flex;
  align-items:center;
  gap:14px;
}

.social-links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  color:#fff;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border-color);
  transition:.25s ease;
}

.social-links a:hover{
  color:#000;
  background:var(--primary);
  border-color:var(--primary);
  transform:translateY(-3px);
}

.social-links svg{
  display:block;
}

/* ---------- Link columns ---------- */
.footer-links h3{
  color:#fff;
  margin-bottom:18px;
  font-size:1.05rem;
}

.footer-links a{
  display:block;
  color:var(--text-secondary);
  text-decoration:none;
  margin-bottom:12px;
  transition:color .25s ease;
}

.footer-links a:hover{
  color:var(--primary);
}

/* ---------- Contact column ---------- */
.footer-contact h3{
  color:#fff;
  margin-bottom:18px;
  font-size:1.05rem;
}

.footer-contact p{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--text-secondary);
  margin-bottom:12px;
}

.footer-contact a{
  color:var(--text-secondary);
  text-decoration:none;
  transition:color .25s ease;
}

.footer-contact a:hover{
  color:var(--primary);
}

.footer-contact svg{
  color:var(--primary);
  width:16px;
  height:16px;
  min-width:16px;
}

/* ---------- Bottom bar ---------- */
.footer-bottom{
  margin-top:60px;
  border-top:1px solid var(--border-color);
  padding:24px;
  text-align:center;
  color:var(--text-secondary);
  font-size:.9rem;
}

.footer-bottom p{
  margin:0;
}

/* ---------- Responsive ---------- */
@media(max-width:1024px){
  .site-footer .footer-grid{
    grid-template-columns:1fr 1fr;
    gap:36px 30px;
  }

  /* brand spans the full width on the first row */
  .footer-brand{
    grid-column:1 / -1;
  }
}

@media(max-width:768px){
  .site-footer{
    padding-top:50px;
  }

  .site-footer .footer-grid{
    grid-template-columns:1fr;
    gap:32px;
  }

  .footer-brand,
  .footer-brand p{
    grid-column:auto;
    max-width:none;
  }

  .social-links{
    justify-content:flex-start;
  }
}