/* ==========================================================================
   Shared site footer — the ONE footer design used on every public page,
   regardless of whether that page is on the Bootstrap chrome or the Tailwind
   chrome. Deliberately self-contained (hardcoded brand colors, no Bootstrap
   or Tailwind utility class names, no variable dependency on theme.css or
   the Tailwind build) so it never drifts out of sync again, and the mobile
   accordion uses native <details>/<summary> so it needs no JS at all —
   works identically whether jQuery, Alpine, both, or neither is loaded.

   Brand palette (kept in sync with theme.css's --bl-* tokens / the Tailwind
   build's --color-* tokens — hardcoded here on purpose, see above):
     gold #E9A400 / gold-dark #B98000 / gold-light #FDF3DC
     ink #1B1F27 / body #3C4250 / muted #6B7280
     border #E6E8EC / canvas #F6F7F9 / surface #FFFFFF
     success #198754 / success-dark #0F6B3F
   ========================================================================== */

.bl-footer {
  margin-top: 3rem;
  padding: 3rem 0;
  background: #F6F7F9;
  border-top: 4px solid #E9A400;
  color: #3C4250;
  font-size: 1rem;
  line-height: 1.5;
}
.bl-footer a { text-decoration: none; color: inherit; }
.bl-footer-inner { max-width: 1280px; margin: 0 auto; padding: 0 1.25rem; }

/* ---- stats + social row ---- */
.bl-footer-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #E6E8EC;
  text-align: center;
}
@media (min-width: 768px) {
  .bl-footer-top { flex-direction: row; justify-content: space-between; text-align: left; }
}
.bl-footer-stats { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem .5rem; }
@media (min-width: 768px) { .bl-footer-stats { justify-content: flex-start; } }
.bl-footer-stat-num { font-size: 1.25rem; font-weight: 700; color: #B98000; margin-right: .25rem; }
.bl-footer-social { display: flex; gap: .4rem; }
.bl-footer-social-btn {
  display: flex; align-items: center; justify-content: center;
  width: 2.25rem; height: 2.25rem; border-radius: 999px;
  border: 1px solid #E6E8EC; color: #1B1F27;
  transition: background-color .18s ease, color .18s ease;
}
.bl-footer-social-btn:hover { background: #1B1F27; color: #fff; }

/* ---- 4-column link grid ---- */
.bl-footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
@media (min-width: 576px) { .bl-footer-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }
@media (min-width: 992px) { .bl-footer-grid { grid-template-columns: repeat(4, 1fr); } }

.bl-footer-col { border-bottom: 1px solid #E6E8EC; }
@media (min-width: 576px) { .bl-footer-col { border-bottom: none; } }

.bl-footer-col-title {
  display: flex; align-items: center; justify-content: space-between;
  list-style: none;
  font-weight: 600; color: #1B1F27; font-size: 1rem;
  padding: .9rem 0; margin-bottom: 0;
  cursor: pointer;
}
.bl-footer-col-title::-webkit-details-marker { display: none; }
.bl-footer-col-title::marker { content: ''; }
.bl-footer-col-title .bl-footer-chevron { transition: transform .18s ease; font-size: .75rem; color: #6B7280; }
.bl-footer-col[open] .bl-footer-chevron { transform: rotate(180deg); }

.bl-footer-panel { display: flex; flex-direction: column; padding-bottom: 1rem; }

.bl-footer-link {
  display: flex; align-items: center; gap: .5rem;
  min-height: 44px;
  font-size: .9rem; color: #3C4250;
  transition: color .16s ease, transform .16s ease;
}
.bl-footer-link:hover { color: #198754; transform: translateX(2px); }
.bl-footer-link i { flex-shrink: 0; }
.bl-footer-link-accent { color: #B98000; font-weight: 600; }
.bl-footer-link-accent:hover { color: #B98000; }
.bl-footer-count { color: #6B7280; }

.bl-footer-cta {
  display: inline-flex; align-items: center; justify-content: center;
  width: fit-content;
  margin-top: .5rem;
  padding: .5rem 1.25rem;
  border-radius: 999px;
  background: #E9A400;
  color: #1B1F27 !important;
  font-size: .875rem; font-weight: 600;
  transition: background-color .18s ease;
}
.bl-footer-cta:hover { background: #B98000; }

/* Desktop: every column is always fully open, no toggle interaction */
@media (min-width: 768px) {
  .bl-footer-col-title { cursor: default; pointer-events: none; padding-top: 0; }
  .bl-footer-chevron { display: none; }
  .bl-footer-panel { display: flex !important; }
}

/* ---- bottom bar ---- */
.bl-footer-bottom {
  display: flex; flex-direction: column; align-items: center; gap: .75rem;
  margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #E6E8EC;
  font-size: .875rem; color: #6B7280; text-align: center;
}
@media (min-width: 768px) {
  .bl-footer-bottom { flex-direction: row; justify-content: space-between; text-align: left; }
}
.bl-footer-bottom a:hover { color: #198754; }
.bl-footer-bottom-links { display: flex; align-items: center; gap: .75rem; list-style: none; padding: 0; margin: 0; }
.bl-footer-bottom-links li { display: flex; align-items: center; gap: .75rem; border-left: 1px solid #E6E8EC; padding-left: .75rem; }
.bl-footer-bottom-links li:first-child { border-left: 0; padding-left: 0; }

/* ---- contextual internal-linking band (partials/contextual_links.php) ----
   Sits between page content and the footer; same "always the same design,
   framework-independent" treatment as the footer itself. */
.bl-contextual {
  background: #F6F7F9;
  border-top: 1px solid #E6E8EC;
  border-bottom: 1px solid #E6E8EC;
  padding: 2rem 0;
  margin-top: 1.5rem;
}
.bl-contextual-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 1.25rem;
  display: grid; grid-template-columns: 1fr; gap: 1.5rem;
}
@media (min-width: 768px) { .bl-contextual-inner { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .bl-contextual-inner { grid-template-columns: repeat(3, 1fr); } }
.bl-contextual-heading {
  font-size: .75rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: #6B7280; margin-bottom: .5rem;
}
.bl-contextual ul { list-style: none; padding: 0; margin: 0; }
.bl-contextual li { margin-bottom: .35rem; font-size: .875rem; }
.bl-contextual a { color: #3C4250; text-decoration: none; }
.bl-contextual a:hover { color: #198754; }
.bl-contextual .bl-footer-count { color: #6B7280; }