/* 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: 50px;
  background: #005292;
}

.footer .container {
  position: relative;
}

/* .footer .footer-top {
  padding-top: 50px;
} */

.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;
    font-style: normal;
    font-weight: 800;
    line-height: 58px;
    padding: 63px 0px;
    background: linear-gradient(87deg, #FFF 31.29%, #8ED527 97.35%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    }

    .footer-inspiration span {
      color: #99CC66;
    }
    .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;
    background: linear-gradient(87deg, #FFF 31.29%, #8ED527 97.35%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.footer-inspiration {
    text-align: center;
    margin: 30px auto 10px;
}
.footer .footer-contact p, .footer .footer-all{
  color: #fff!important;
}