/* Fonts */
:root {
    --footer-font: "Mulish", Helvetica;
  }
  
  /* Global Colors */
  :root {
    /* Background Color - This color is applied to the background of the entire website as well as individual sections. */
    /* --background-color: #ffffff; */
  
    /* Default Color - This is the default color used for the majority of the text content. */
    --default-color: #364d59;
  
    /* Heading Color - This color is used for titles, headings and secondary elements. */
    --heading-color: #52565e;
  
    /* Accent Color - This is the main accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out. */
    /* --accent-color: #feb900; */
  
    /* Contrast Color - This is a color used for text when the background color is one of the heading, accent, or default colors. Its purpose is to ensure proper contrast and readability when placed over these more dominant colors. */
    --contrast-color: #ffffff;
  }


/*--------------------------------------------------------------
# Global Footer
--------------------------------------------------------------*/
.footer a {
  text-decoration: none;
  transition: 0.3s;
}
.footer-img {
  width: 140px;
  height: 90.661px;
  flex-shrink: 0;
}


.footer {
  --heading-color: var(--contrast-color);
  --default-color: var(--contrast-color);
  color: var(--default-color);
  background-color: #2F82C3;
  background-size: cover;
  font-size: 14px;
  padding-bottom: 0px;
  background: #005292;
}

.footer .container {
  position: relative;
}

.footer .footer-top {
margin-top: 1.5rem;
}
.Sustain a {
  color: #fff;
  text-decoration: none;
  transition: color 0.3s ease;
}

.Sustain a:hover {
  color:#fff; /* 👈 Change this to your desired hover color */
  text-decoration: none; /* optional */
}

.footer .footer-about .logo {
  line-height: 1;
  margin-bottom: 25px;
}

.footer .footer-about .logo img {
  width: 140px;
  height: 90.661px;
  flex-shrink: 0;
}

.footer .footer-about .logo span {
  color: var(--heading-color);
  font-family: var(--heading-font);
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 1px;
}

.footer .footer-about p {
  font-size: 14px;
  font-family: var(--heading-font);
}

.footer .social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 40px;
  font-size: 16px;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  transition: 0.3s;

}

.footer .social-links a:hover {
  color: var(--accent-color);
  border-color: var(--accent-color);
}

.footer h4 {
  font-size: 16px;
  font-family: var(--footer-font);
  font-weight: 700;
  position: relative;
  /* padding-bottom: 10px; */
  letter-spacing: 0;
}

.footer .footer-links {
  margin-bottom: 30px;
}

.footer .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .footer-links ul i {
  padding-right: 2px;
  font-size: 12px;
  line-height: 0;
}

.footer .footer-links ul li {
  padding: 6px 0;
  display: flex;
  align-items: center;
}

.footer .footer-links ul li:first-child {
  padding-top: 0;
}

.footer .footer-links ul a {
  color: #FFF;
  display: inline-block;
}


.footer .footer-contact p,
.footer .footer-all {
  font-family: var(--footer-font);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height:  25px;
  letter-spacing: 0;
  margin-bottom: 5px;
}
.footer .footer-links .Sustain{
  /* padding: 0 0 6px 0; */
}
.footer .footer-sustainability {
  font-family: var(--footer-font);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 1px 0;
}

.footer-all-icon{
line-height:0.7 !important;
letter-spacing: 0;
color: #FFF;
font-family: Mulish;
font-size: 16px;
font-style: normal;
font-weight: 700;
}

.footer-all-line br {
  /* line-height: 2; */
  /* This value will increase the space between lines */
}
.footer .footer-contact-mob{
  font-family: var(--footer-font);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height:  0.5;
  letter-spacing: 0;
  margin-bottom: 5px;
  display:none;
}

@media (max-width: 768px) {
  .footer .footer-contact {
    display: none;
  }
  .footer .footer-contact-mob{
    display: block;
    margin-bottom:4rem;
  }
}
@media (max-width: 767px) {
  .footer .footer-links ul li {
    padding: 2px 0;
}
}
@media (max-width: 427px) {
  .footer .footer-links-res {
    margin-bottom:3rem;
  }
  .footer .footer-links .Sustain{
    padding-bottom: 0px;
    line-height: 1.5;
    font-weight: 400;
    font-size: 14px;
  }
  .footer .footer-sustainability {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
  }

}
@media (max-width: 320px) {
  .footer .footer-about p {
    font-size: 13px;
}
}
.footer-inspiration p {
  text-align: center;
  font-family: Mulish;
  font-size: 48px!important;
  font-style: normal;
  font-weight: 800;
  line-height: 58px!important;
padding: 63px 0px 26px 0px;
  color: #fff; /* White text */
}


    .footer-inspiration span {
      color: #99CC66;
    }
÷¯
.footer-inspiration {
    text-align: center;
    margin: 30px auto 10px;
}
.footer .footer-contact p, .footer .footer-all{
  color: #fff!important;
}
.footer-bottom {
  text-align: center;
  padding: 15px 0;
}