/* ==========================================================================
   GLOBAL FOOTER STYLES
   ========================================================================== */

footer { 
  border-top: 1px solid #e5e5e5; 
  padding-top: 60px; 
  background: #ffffff; 
}

.footer-main { 
  display: flex; 
  justify-content: space-between; 
  align-items: flex-start; 
  gap: 40px; 
  flex-wrap: wrap; 
}

.footer-left { 
  flex: 1 1 420px; 
  max-width: 500px; 
}

.footer-brand-logo { 
  display: block; 
  width: 420px; 
  max-width: 100%; 
  height: auto; 
  object-fit: contain; 
  object-position: left center; 
}

.footer-image-carousel { 
  width: 500px; 
  max-width: 100%; 
  height: 104px; 
  margin-top: 24px; 
  overflow: hidden; 
  background: #f8f9fb; 
  border: 1px solid #e5e7eb; 
}

.footer-image-track { 
  display: flex; 
  width: max-content; 
  gap: 18px; 
  height: 100%; 
  padding: 14px; 
  animation: footer-images-scroll 12s linear infinite; 
  will-change: transform; 
}

.footer-image-placeholder { 
  flex: 0 0 115px; 
  height: 74px; 
  border-radius: 12px; 
  background: #d9d9d9; 
}

@keyframes footer-images-scroll { 
  from { transform: translateX(0); } 
  to { transform: translateX(-50%); } 
}

.footer-links { 
  display: flex; 
  flex-direction: column; 
  gap: 8px; 
  min-width: 130px; 
}

.footer-links h6 { 
  color: #0b68db; 
  font-size: 15px; 
  margin-bottom: 3px; 
  font-weight: 600; 
}

.footer-links a { 
  display: flex; 
  align-items: center; 
  gap: 10px; 
  color: #667080 !important; 
  font-size: 13px; 
}

.company-links a::before { 
  content: ""; 
  width: 4px; 
  height: 4px; 
  flex: 0 0 4px; 
  border-radius: 50%; 
  background: #3f8cf5; 
}

.footer-links a i,
.footer-links a .footer-icon { 
  display: inline-flex; 
  align-items: center; 
  justify-content: center; 
  width: 30px; 
  height: 30px; 
  flex: 0 0 30px; 
  border: 1px solid #d4e3f5; 
  border-radius: 50%; 
  color: #287ce4; 
  font-size: 13px; 
  background: #ebf3fe; 
  box-sizing: border-box; 
  transition: all 0.2s ease; 
}

.footer-links a .footer-icon img { 
  width: 14px; 
  height: 14px; 
  object-fit: contain; 
  display: block; 
}

.footer-links a:hover .footer-icon { 
  background: #d4e4fd; 
  border-color: #287ce4; 
}

.footer-bottom { 
  border-top: 1px solid #eeeeee; 
  margin-top: 40px; 
  padding: 20px 0; 
  text-align: center; 
}

.footer-bottom p { 
  font-size: 13px; 
  color: #888888; 
}

/* Form data inside older footer versions */
.form-data .form-control::placeholder { font-size: 14px!important; } 
.form-data .form-control { border-radius: 12px!important; border-top-right-radius: 0!important; border-bottom-right-radius: 0!important; border: 1px solid #0B68DB; background: #F4F4F4; backdrop-filter: blur(2px); font-size: 16px; height: 48px; } 
.form-data .btn { white-space: nowrap; border-radius: 12px!important; background-color: #0B68DB!important; box-shadow: 0px 2px 21.6px 9px rgba(47, 102, 245, 0.25)!important; border-top-left-radius: 0!important; border-bottom-left-radius: 0!important; } 

.links-section { display: flex; justify-content: flex-end; gap: 86px; flex-wrap: wrap; } 

/* ==========================================================================
   FOOTER RESPONSIVE STYLES
   ========================================================================== */

@media screen and (max-width: 820px) { 
  .footer-main { 
    flex-direction: column; 
    align-items: stretch; 
    gap: 30px; 
    padding: 40px 16px 0; 
  } 
  .footer-left { 
    width: 100%; 
    max-width: 100%; 
  } 
  .footer-brand-logo, .footer-image-carousel { 
    width: 100%; 
  } 
  .footer-links { 
    min-width: 0; 
  } 
  .footer-bottom { 
    margin: 0px 16px 0; 
  } 
  
  footer .row { display: flex; flex-direction: column; gap: 30px; } 
  footer .col-md-6, footer .col-md-5 { max-width: 100%; width: 100%; } 
  footer .form-data { display: flex; flex-direction: row; flex-wrap: nowrap; } 
  footer .form-data input[type="email"] { flex: 1; min-width: 200px; border-top-right-radius: 0; border-bottom-right-radius: 0; } 
  footer .form-data button { border-top-left-radius: 0; border-bottom-left-radius: 0; white-space: nowrap; } 
  footer .links-section { display: flex; justify-content: space-between; gap: 30px; flex-wrap: wrap; } 
  footer .links-section > div { flex: 1 1 45%; min-width: 140px; } 
  footer .links-section h6, footer .links-section a { text-align: left; } 
  footer .text-left { text-align: center !important; }
} 

@media (min-width: 481px) and (max-width: 767px) {
  .links-section { gap: 0px !important; }
  footer .row { flex-direction: column; align-items: stretch; } 
  .form-data { flex-direction: row; flex-wrap: wrap; gap: 10px; } 
  .form-data input[type="email"] { flex: 1 1 auto; min-width: 200px; } 
  .form-data button { flex-shrink: 0; white-space: nowrap; } 
  .links-section { display: flex; justify-content: space-between; gap: 20px; padding-top: 16px; flex-wrap: wrap; } 
  .links-section > div { flex: 1 1 45%; min-width: 140px; max-width: 200px; } 
  .links-section h6, .links-section a { text-align: left; } 
}

@media (max-width: 480px) { 
  .links-section { justify-content: center; gap: 20px; padding: 0 16px; } 
  .links-section > div { flex: 1 1 45%; min-width: 140px; max-width: 200px; } 
  .links-section h6, .links-section a { text-align: left; } 
}