/* ============================================================
   Site-wide footer — loaded on every page (see functions.php), not
   just the landing template, since footer.php always renders
   template-parts/footer/site-footer.php regardless of page template.
   Selectors are plain .site-footer, NOT .ixbrl-lp .site-footer, unlike
   the source fragment: the footer element sits outside the .ixbrl-lp
   wrapper (that div is closed inside <main>, before get_footer() runs),
   so an .ixbrl-lp-scoped selector would never match here.
   ============================================================ */

/* GeneratePress's own Customizer-generated CSS ("Container" layout set to
"One Container") includes ".one-container .container{background-color:var(--base-3)}"
(a plain white) — GP's body class is .one-container whenever that layout is
selected, and our footer's inner Bootstrap ".container" div matches that
selector directly (same class name, unrelated meaning), painting white over
the dark footer. Selector specificity here (element + 2 classes) beats GP's
(2 classes) regardless of stylesheet load order, so this doesn't depend on
ixbrl-footer.css happening to load after GP's inline style. */
footer.site-footer .container { background-color: transparent; }

.site-footer a { color: rgba(255,255,255,.75); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.site-footer .fcol-title { font-size: .75rem; font-weight: 700; letter-spacing: .1em; color: #fff; margin-bottom: 1rem; }
.site-footer .social { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: rgba(255,255,255,.75); font-size: .9rem; text-decoration: none; transition: background .2s, border-color .2s; }
.site-footer .social:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.5); text-decoration: none; }
/* card marks sit on white chips so the official Visa/Mastercard colours stay legal on a dark bar */
.site-footer .paymark { background: #fff; border-radius: 4px; padding: 4px 8px; display: flex; align-items: center; justify-content: center; }
.site-footer .paymark img { height: 24px; width: auto; max-width: 60px; object-fit: contain; display: block; }