// Footer — site footer with CTA band

function Footer({ go }) {
  const { Button, Eyebrow } = window.NewAgeAnimationDesignSystem_178027;
  return (
    <footer style={{ borderTop: "1px solid var(--border-soft)", background: "var(--ink-900)" }}>
      <div style={{
        padding: "var(--section-y) var(--gutter)", textAlign: "center",
        display: "flex", flexDirection: "column", alignItems: "center", gap: 24,
      }}>
        <Eyebrow>Let&rsquo;s make something</Eyebrow>
        <h2 style={{
          margin: 0, fontFamily: "var(--font-display)", fontWeight: 700,
          fontSize: "var(--fs-display-m)", lineHeight: 1.0, letterSpacing: "-0.02em",
          color: "var(--paper-100)", maxWidth: 760,
        }}>Tell us what you&rsquo;re making.</h2>
        <div style={{ display: "flex", gap: 12 }}>
          <Button variant="solid" size="lg" onClick={() => go("contact")}>Start a project</Button>
          <Button variant="ghost" size="lg" onClick={() => go("rush")}>Rush delivery &rarr;</Button>
        </div>
      </div>
      <div style={{
        display: "flex", alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 12,
        padding: "20px var(--gutter)", borderTop: "1px solid var(--border-soft)",
        fontFamily: "var(--font-mono)", fontSize: 12, color: "var(--text-muted)",
        letterSpacing: "0.06em", textTransform: "uppercase",
      }}>
        <span>© 2026 New Age Animation</span>
        <span>newageanimation.com</span>
        <span>Editing · Motion · Content</span>
      </div>
    </footer>
  );
}
window.Footer = Footer;