/* Site footer, shared by every page and styled only here (the markup is
   hand-maintained in each page; the Super AI and company generators copy it
   from /operations/index.html). The soft gradient line on top matches the
   one under the nav in /assets/nav.css. */

footer {
  position: relative; text-align: left;
  background: var(--navy-card);
  border-top: 1px solid transparent;
  padding: 60px;
}
footer::before {
  content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, rgba(59, 123, 255, 0) 0%, rgba(59, 123, 255, 0.45) 25%, rgba(0, 229, 255, 0.45) 75%, rgba(0, 229, 255, 0) 100%);
}

.footer-grid {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px; margin-bottom: 48px;
}
.footer-brand .nav-logo { display: block; margin-bottom: 16px; }
.footer-brand .nav-logo img { display: block; height: 42px; width: auto; }
.footer-brand p { font-size: 14px; color: var(--muted); line-height: 1.7; max-width: 260px; }

.footer-col h5 {
  font-family: 'Space Grotesk', sans-serif; font-size: 13px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted-light); margin-bottom: 18px;
}
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin-bottom: 10px; }
.footer-col a { color: var(--muted); font-size: 14px; text-decoration: none; transition: color 0.2s; }
.footer-col a:hover { color: var(--white); }

.footer-bottom {
  border-top: 1px solid var(--navy-border); padding-top: 28px;
  display: flex; justify-content: space-between; align-items: center;
}
.footer-bottom p { font-size: 13px; color: var(--muted); }
.footer-links { display: flex; gap: 28px; }
.footer-links a { font-size: 13px; color: var(--muted); text-decoration: none; }
.footer-links a:hover { color: var(--white); }

@media (max-width: 900px) {
  footer { padding: 48px 24px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
  .footer-links { flex-wrap: wrap; justify-content: center; gap: 12px 28px; }
}
@media (max-width: 340px) {
  .footer-grid { grid-template-columns: 1fr; }
}