/* spintech-child — footer chrome
 * Inverts to navy-deep with a gold top rule. Mono uppercase widget headings,
 * paper-warm body text, gold link hovers. Closes the page with weight.
 */

.footer-section.main-footer {
  background-color: var(--navy-deep);
  color: var(--slab-text);
  border-top: 4px solid var(--gold);
}

.footer-section.main-footer,
.footer-section.main-footer p,
.footer-section.main-footer li,
.footer-section.main-footer span,
.footer-section.main-footer .textwidget,
.footer-section.main-footer .copyright-text {
  color: var(--slab-text);
}

/* Secondary text — slightly faded for hierarchy */
.footer-section.main-footer .footer-main .contact-info .text,
.footer-section.main-footer .copyright-text {
  color: rgba(247, 250, 254, 0.72);
}

/* ---------- Widget headings — mono eyebrow style ---------- */
.footer-section.main-footer .widget h1,
.footer-section.main-footer .widget h2,
.footer-section.main-footer .widget h3,
.footer-section.main-footer .widget h4,
.footer-section.main-footer .widget h5,
.footer-section.main-footer .widget h6,
.footer-section.main-footer .widget-title,
.footer-section.main-footer .widget .widget-title {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.25rem;
}

/* ---------- Footer links ---------- */
.footer-section.main-footer a:not(.btn):not(.wp-block-button__link) {
  color: var(--slab-text);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-standard);
}
.footer-section.main-footer a:not(.btn):not(.wp-block-button__link):hover,
.footer-section.main-footer a:not(.btn):not(.wp-block-button__link):focus {
  color: var(--gold);
}

/* ---------- Footer menu (right column) ----------
 * Force the items onto a single line on desktop (parent col-lg-4 is only
 * ~464px wide; default li display:inline-block plus 0.16em tracking made
 * "Terms and Conditions" wrap). Switch to flex with tightened tracking.
 * On mobile (col-md-12 full width) we re-allow wrap so items flow nicely
 * when stacked with the logo + copyright.
 */
.footer-copyright .widget_nav_menu .menu-pages-container {
  display: block;
}
.footer-copyright .widget_nav_menu .menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
}
.footer-copyright .widget_nav_menu .menu .menu-item {
  display: inline-flex;
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-copyright .widget_nav_menu .menu .menu-item > a {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Stacked layout: when the footer collapses to a single column on tablet
 * and below (col-md-12), let the menu wrap and centre. */
@media (max-width: 991.98px) {
  .footer-copyright .widget_nav_menu .menu {
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 20px;
  }
}

/* ---------- Copyright bar ---------- */
.footer-section.main-footer .footer-copyright {
  border-top: 1px solid rgba(247, 250, 254, 0.12);
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.footer-section.main-footer .copyright-text {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
}

/* ---------- Social icons (header inherits header.css; here for footer dup) ---------- */
.footer-section.main-footer .social-icons a,
.footer-section.main-footer .social-list a {
  color: var(--slab-text);
}
.footer-section.main-footer .social-icons a:hover,
.footer-section.main-footer .social-list a:hover {
  color: var(--gold);
}

/* ---------- Newsletter / form input on footer (if any widget renders one) ---------- */
.footer-section.main-footer input[type="text"],
.footer-section.main-footer input[type="email"],
.footer-section.main-footer textarea {
  background-color: var(--paper);
  color: var(--ink);
  border: 1px solid transparent;
  border-radius: 0;
}
.footer-section.main-footer input[type="text"]:focus,
.footer-section.main-footer input[type="email"]:focus,
.footer-section.main-footer textarea:focus {
  border-color: var(--gold);
  outline: none;
}

/* ---------- Hairline rule inside footer ---------- */
.footer-section.main-footer hr {
  background-color: rgba(247, 250, 254, 0.18);
}

/* ---------- Scroll-to-top button (lives outside footer but visually with it) ---------- */
.scrollingUp.scrolling-btn {
  background-color: var(--ink) !important;
  color: var(--paper) !important;
  border-radius: 0 !important;
  border: 1px solid var(--gold);
}
.scrollingUp.scrolling-btn:hover,
.scrollingUp.scrolling-btn:focus {
  background-color: var(--gold) !important;
  color: var(--ink) !important;
}
