/* Site footer — NUTEX wordmark + logo badge, ported from
   src/components/Footer.astro (the reconciled Astro reference). Replaces the
   earlier "Stay tuned." coming-soon footer now that there's real content
   (Where it applies / Talk to Us) above it.

   The bar's right slot is the Home/Contact nav directly, rather than
   Footer.astro's separate "Back to top" link + nav-below-the-bar split — this
   is the single-page site, so there's no second route to link "up" from. */

/* No padding-top: __hero carries its own padding-block, and having both meant
   48px here stacked on 64px there for 112px of empty space before the wordmark
   even started. */
.site-footer {
  background: var(--color-dark-bg);
  color: var(--color-paper);
  overflow: hidden;
}

/* Tightened: this block was ~454px tall above the divider (48 + 64 + 130 + 16
   + 132 + 64) for a wordmark and a logo, which read as a gap rather than a
   sign-off. Now ~260px. The stacked lockup is unchanged — the wordmark still
   sits above the badge — only the scale and the spacing came down. */
.site-footer__hero {
  display: flex;
  justify-content: center;
  padding-block: var(--space-6);
}

/* The wordmark + badge stack is a flex column on the link itself, not on
   .site-footer__hero — an earlier version used display:contents on this
   link so .site-footer__hero could keep doing the flex-column layout
   directly on its "invisible" children, but display:contents on an <a> has
   known cross-browser rendering bugs (notably in Safari), so the layout is
   done here on a real flex container instead. */
.site-footer__home-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
}

.site-footer__home-link:hover .site-footer__wordmark,
.site-footer__home-link:hover .site-footer__badge {
  opacity: 0.85;
}

.site-footer__wordmark,
.site-footer__badge {
  transition: opacity var(--duration-fast) var(--ease-standard);
}

/* Solid metallic-gray gradient fill (sampled from the reference: ~#919191 at
   top fading to ~#444 at the bottom) — not a hollow brand-gradient stroke. */
.site-footer__wordmark {
  margin: 0;
  font-family: var(--font-family-base);
  font-weight: 800;
  font-size: clamp(40px, 7vw, 96px);
  letter-spacing: 0.2em;
  line-height: 1;
  text-align: center;
  background: linear-gradient(180deg, #919191, #444444);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.site-footer__badge {
  display: inline-flex;
}

.site-footer__badge img {
  width: 88px;
  height: 88px;
  object-fit: contain;
  display: block;
}

.site-footer__divider {
  border-top: 1px solid var(--color-dark-border);
}

/* .container (from contact.CW3nh7dV.css) supplies the max-width + horizontal
   padding here, so the bar lines up with every other section instead of
   running its own edge-to-edge width. */
.site-footer__bar {
  padding-block: var(--space-5);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  text-align: center;
}

.site-footer__copyright {
  font-size: var(--type-label);
  font-weight: 400;
  color: var(--color-gray-300);
}

/* "Engineered by Cognizance Technologies" — was folded into the copyright
   line in a separate "Stay tuned." footer; now its own bar item so the grid
   below can center it exactly, with the copyright and nav balanced on
   either side. Keeps the same icon + gradient link treatment it had there. */
.site-footer__attribution {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--type-label);
  color: var(--color-gray-300);
}

.site-footer__external-icon {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  color: currentColor;
}

/* Cognizance's own brand palette (gold -> green), not the Nutex
   orange/magenta/violet --gradient-brand — this link points off-site to
   cognizancetech.com. */
.site-footer__link {
  font-weight: 500;
  background-image: linear-gradient(90deg, #ffb71b, #38bb7b);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.site-footer__link:hover,
.site-footer__link:focus-visible {
  text-decoration: underline;
  text-decoration-color: #ffb71b;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.site-footer__nav ul {
  display: flex;
  justify-content: center;
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer__nav a {
  font-size: var(--font-size-sm);
  color: var(--color-gray-300);
}

.site-footer__nav a:hover {
  color: var(--color-paper);
}

@media (min-width: 700px) {
  /* Equal 1fr outer columns absorb the leftover space evenly, so the middle
     column (the attribution) lands exactly at the bar's horizontal center
     regardless of how long the copyright or nav text is — a plain flex row
     can't guarantee that unless both ends happen to be the same width. */
  .site-footer__bar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: var(--space-6);
  }

  .site-footer__copyright {
    justify-self: start;
    text-align: left;
  }

  .site-footer__attribution {
    justify-self: center;
  }

  .site-footer__nav {
    justify-self: end;
  }
}