/*
Version: 1.0 – Footer
*/

/* ----------------------------------------------------------
   Footer Bar 1
----------------------------------------------------------- */
#footer-bar1 {
  text-align: center;
  padding: 1rem 0;
  width: 100%;
  overflow-x: hidden;
}

#footer-bar1 a {
  color: #FFFFFF;
  text-decoration: none;
  font-size: 0.95rem;
  margin: 0 0.25rem;
}

#footer-bar1 a:hover,
#footer-bar1 a:focus-visible {
  color: #00B8A9;
  outline: 0;
}

#footer-bar1 .separator {
  color: #FFFFFF;
  margin: 0 0.25rem;
  user-select: none;
}


/* ----------------------------------------------------------
   Footer Bar 2 – Menu Titles (Icon + linked text)
----------------------------------------------------------- */
.footer-title1,
.footer-title2,
.footer-title3,
.footer-title4,
.footer-title5,
.footer-title6 {
  display: inline-flex;
  align-items: center;
  font-size: 0.9rem;
  gap: 0.8rem;            /* keep icon/text spacing consistent */
}

/* clickable text only */
.footer-title1 a,
.footer-title2 a,
.footer-title3 a,
.footer-title4 a,
.footer-title5 a,
.footer-title6 a {
  color: #FFFFFF;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.3s ease;
}

.footer-title1 a:hover,
.footer-title2 a:hover,
.footer-title3 a:hover,
.footer-title4 a:hover,
.footer-title5 a:hover,
.footer-title6 a:hover {
  color: #00B8A9;
  text-decoration: underline;
}

/* Icons – unchanged pseudo-elements so they still render */
.footer-title1::before,
.footer-title2::before,
.footer-title3::before,
.footer-title4::before,
.footer-title5::before,
.footer-title6::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 1.25rem;
  opacity: 0.8;
  margin-right: 0.2rem;
  color: #FFFFFF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
  top: 0;
}

/* Individual icons – keep the same offsets */
.footer-title1::before { content: "\f0f1"; top: 5px; }
.footer-title2::before { content: "\f471"; top: 5px; }
.footer-title3::before { content: "\e579"; top: -5px; }
.footer-title4::before { content: "\f490"; top: -5px; }
.footer-title5::before { content: "\f559"; top: 5px; }
.footer-title6::before { content: "\f5bb"; top: 5px; }


/* ----------------------------------------------------------
   Footer Bar 2 Menu – Adjustable line height, vertical gap, and icon spacing
----------------------------------------------------------*/

:root {
  --footer-menu-line-height: 1.2;      /* line height for links */
  --footer-menu-vertical-gap: 2rem;    /* vertical gap between items */
  --footer-menu-icon-gap: 0.75rem;     /* space between icon and text */
}

.footer-menu {
  margin-left: 1.5rem;
  display: flex;
  flex-direction: column;              /* vertical list */
  gap: var(--footer-menu-vertical-gap);/* single control for item spacing */
}

.footer-menu a {
  display: inline-flex;                 /* icon + text stay on one line */
  align-items: center;                  /* vertical centering */
  line-height: var(--footer-menu-line-height);
  font-size: 0.8rem;
  color: #FFFFFF;
  text-decoration: none;
  transition: color 0.2s ease-in-out;
  word-break: break-word;
}

.footer-menu a:hover {
  color: #00B8A9;
}

.footer-menu a::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f061";
  font-size: 0.75rem;
  color: inherit;
  margin-right: var(--footer-menu-icon-gap); /* only gap that matters */
}

@media (max-width: 768px) {
  .footer-menu {
    gap: 1.5rem;                         /* tighter vertical gap on small screens */
  }
  .footer-menu a {
    line-height: 1.25;
  }
}


/* ----------------------------------------------------------
   Footer Bar 3 – Address and Contacts (Responsive Icon Alignment)
----------------------------------------------------------- */

.address-heading {
  display: inline-flex;              /* same alignment as footer titles */
  align-items: center;
  font-size: 0.9rem;                 /* match footer title size */
  font-weight: 400;                  /* same weight */
  color: #FFFFFF !important;         /* same color */
  text-decoration: none;             /* just in case */
  margin-bottom: 0.5rem;             /* keep the spacing you had */
}

.address-heading::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f3c5";                   /* pick an icon you like */
  font-size: 1.25rem;
  opacity: 0.8;
  margin-right: 0.8rem;
  color: #FFFFFF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
  top: 0px;
}

.address-text {
  display: inline-flex;              /* same alignment as footer titles */
  align-items: center;
  font-size: 0.9rem;                 /* match footer title size */
  font-weight: 400;                  /* same weight */
  color: #FFFFFF !important;         /* same color */
  text-decoration: none;             /* just in case */
  margin-bottom: 0.5rem;             /* keep the spacing you had */
  padding-left: 30px;
}

.enquiry-heading {
  display: inline-flex;              /* same alignment as footer titles */
  align-items: center;
  font-size: 0.9rem;                 /* match footer title size */
  font-weight: 400;                  /* same weight */
  color: #FFFFFF !important;         /* same color */
  text-decoration: none;             /* just in case */
  margin-bottom: 0.5rem;             /* keep the spacing you had */
}

.enquiry-heading::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f3ce";                   /* pick an icon you like */
  font-size: 1.25rem;
  opacity: 0.8;
  margin-right: 0.8rem;
  color: #FFFFFF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
  top: 0px;
}

