/* Footer-specific CSS */
    .footer { background-color:var(--primary-green); color:var(--white); padding:50px 0 20px;}
    .footer h5 { margin-bottom:20px; font-weight:bold; }
    .footer ul { list-style:none; padding:0;}
    .footer ul li { margin-bottom:10px;}
    .footer ul li a { color:var(--white); text-decoration:none; opacity:0.8; transition:opacity 0.3s ease;}
    .footer ul li a:hover { opacity:1;}
    .extra-left-space { padding-left:100px !important; padding-right:100px !important; }
     
     /* ✅ Footer Base */
.footer img {
  max-width: 180px;
  height: auto;
}
.footer p,
.footer ul li,
.footer ul li a {
  font-size: 1rem;
}

.footer .contact-info a i {
  color: #fff !important;
}

.footer .contact-info a:hover i {
  opacity: 0.7; /* optional hover effect */
}

/* 🔹 <= 1200px */
@media (max-width: 1200px) {
  .footer img { max-width: 130px; }
  .footer h5 { font-size: 1.0rem; }
  .footer p,
  .footer ul li,
  .footer ul li a { font-size: 0.8rem; }
}


/* 🔹 <= 770px (Small Tablet) */
@media (max-width: 770px) {
  .footer .row {
    display: flex;
  }

  /* Keep order same as mobile */
  .footer .logo        { order: 1; text-align: center; }
  .footer .quick-links { order: 3; text-align: center;}
  .footer .our-partners{ order: 4; text-align: center;}
  .footer .contact-info{ order: 5; text-align: center;}

  .footer .row > div {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 25px;
  }

  /* Logo adjustments */
  .footer .logo img {
    display: block;
    margin: 0 auto 12px auto;
    width: 100px;        /* a bit bigger than mobile */
    max-width: 100px;
    height: auto;
  }
  .footer .logo p {
    text-align: center;
    font-size: 0.9rem;   /* slightly bigger */
  }

  /* Divider line */
  .footer .logo::after {
    content: "";
    display: block;
    width: 65%;
    margin: 18px auto;
    border-bottom: 1px solid rgba(255,255,255,0.4);
  }

  /* Font sizes */
  .footer h5 { font-size: 1rem; }
  .footer p,
  .footer ul li,
  .footer ul li a { font-size: 0.85rem; }
}



/* 🔹 <= 430px (Mobile Phones) */
@media (max-width: 430px) {
  .footer .row {
    display: flex;
    flex-direction: column; /* stack vertically */
  }

  /* Force correct order */
  .footer .logo        { order: 1; text-align: center; }
  .footer .quick-links { order: 3; text-align: center; }
  .footer .our-partners{ order: 4; text-align: center; }
  .footer .contact-info{ order: 5; text-align: center; }

  .footer .row > div {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }

  /* Center logo + its content */
  /* ✅ Make logo image smaller */
  .footer .logo img {
    display: block;
    margin: 0 auto 10px auto;
    width: 80px;         /* fixed smaller size */
    max-width: 80px;     /* prevents large images */
    height: auto;
  }
  .footer .logo p {
    text-align: center;
    font-size: 0.8rem;
  }
  /* Divider line after logo */
  .footer .logo::after {
    content: "";
    display: block;
    width: 60%;
    margin: 15px auto;
    border-bottom: 1px solid rgba(255,255,255,0.4);
  }

  /* Smaller font sizes */
  .footer h5 { font-size: 0.9rem; }
  .footer p,
  .footer ul li,
  .footer ul li a { font-size: 0.75rem; }
  .services ul li { font-size: 13px !important; }
}