/* Footer background image (assets/footer-bg.jpg) + the text/link/button color
   overrides needed for readability over it.
   Split out of assets/custom.css and loaded non-blocking (see footer.php, which uses
   the same preload+swap pattern index.php already uses for its own non-critical CSS)
   because this was one of the two heaviest assets on every page (377KB) despite being
   purely a footer background, confirmed off-screen on initial load. Kept as one unit
   with the color overrides below (not just the background-image) so there's no gap
   where footer text would render white-on-white before this stylesheet applies. */

.footer-bg-wrapper {
  background-image:
    linear-gradient(rgba(0,0,0,0.48), rgba(0,0,0,0.48)),
    url("/assets/footer-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #000; /* fallback base */
  position: relative;
}

/* Guarantee readable footer text & links over the image */
.footer-bg-wrapper,
.footer-bg-wrapper .text-muted,
.footer-bg-wrapper .text-secondary { color: #ffffff !important; }

.footer-bg-wrapper a,
.footer-bg-wrapper .footer-link {
  color: #ffffff !important;
  text-decoration-thickness: .08em;
}
.footer-bg-wrapper a:hover,
.footer-bg-wrapper .footer-link:hover {
  color: #e6f0ff !important;
  text-decoration: underline;
}

/* Buttons in footer over the image */
.footer-bg-wrapper .btn-outline-secondary {
  color: #e9ecef !important;
  border-color: rgba(233,236,239,.85) !important;
}
.footer-bg-wrapper .btn-outline-secondary:hover,
.footer-bg-wrapper .btn-outline-secondary:focus {
  background: #e9ecef !important;
  color: #1b1e21 !important;
  border-color: #e9ecef !important;
}

/* Slightly stronger overlay for small screens */
@media (max-width: 576px) {
  .footer-bg-wrapper {
    background-image:
      linear-gradient(rgba(0,0,0,0.58), rgba(0,0,0,0.58)),
      url("/assets/footer-bg.jpg");
  }
}