/* ── Responsive enhancements for restored site ────────────────────── */

/* Ensure images never overflow their containers */
img { max-width: 100%; height: auto; }

/* Responsive tables */
@media (max-width: 768px) {
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Better touch targets for nav */
@media (max-width: 900px) {
  #topnav li a { padding: 10px 12px; }
}

/* Donation form responsive tweaks */
@media (max-width: 640px) {
  #frm_365191 .form-label { display: block; width: auto; margin-bottom: 4px; }
  #frm_365191 .form-textbox { width: 100% !important; box-sizing: border-box; }
  .causeContainer { padding: 10px 0; }
}

/* Get-involved form responsive tweaks */
@media (max-width: 640px) {
  #form-505396 .form-textbox { width: 100%; box-sizing: border-box; }
  #form-505396 fieldset.columns { column-count: 1; }
}

/* Missions image on small screens */
@media (max-width: 480px) {
  .detail_textgraphic img[style*="float:right"] {
    float: none !important;
    display: block;
    margin: 0 auto 16px !important;
    max-width: 100% !important;
  }
}

/* ── Sticky-nav clearance ────────────────────────────────────────────────── */
/*
 * CSS fallback — site-loader.js measures the real header.main offsetHeight
 * and sets banner.style.paddingTop dynamically. These are conservative
 * over-estimates so content is clear even before JS runs.
 */
#banner.no_banner {
  padding-top: 220px !important;
}
h1#page_heading {
  scroll-margin-top: 110px;
}
@media (max-width: 767px) {
  #banner.no_banner {
    padding-top: 130px !important;
  }
  h1#page_heading {
    scroll-margin-top: 90px;
  }
}

/* ── Footer copyright centering ──────────────────────────────────────────── */
/*
 * css.css sets: footer p { float: right; padding-right: 62px; }
 * Override for the copyright paragraph only.
 */
footer .footer-bottom p {
  float: none !important;
  text-align: center !important;
  padding-right: 0 !important;
  margin: 0 auto;
}

/* Skip nav accessibility */
#skip-nav a {
  position: absolute;
  left: -9999px;
}
#skip-nav a:focus {
  left: 50%;
  transform: translateX(-50%);
  background: #6c4f85;
  color: #fff;
  padding: 8px 16px;
  z-index: 9999;
  top: 0;
}