/* Closing CTA band + site footer. */
const { Button } = window.LexInToshDesignSystem_e187a4;
const Icon = window.Icon;
const SITE = window.SITE;

function CTABand() {
  return (
    <section className="ctaband">
      <img src={window.__asset("mark", "assets/lexintosh-mark.png")} alt="" className="ctaband__mark" />
      <div className="wrap ctaband__inner">
        <window.Reveal><h2 className="h2 ctaband__title">Build on Nepal&rsquo;s legal infrastructure.</h2></window.Reveal>
        <window.Reveal delay={80}>
          <p className="ctaband__lead">Talk to our team about MeroCase, the LegalTech API, or a partnership across the ecosystem.</p>
        </window.Reveal>
        <window.Reveal delay={140}>
          <div className="ctaband__btns">
            <window.SalesButton style={{ ...window.CTA_LG, background: "#fff", color: "var(--primary)" }}>Contact Us</window.SalesButton>
            <Button variant="outline" onClick={() => window.open(SITE.contact.linkedin, "_blank", "noopener")}
              style={{ ...window.CTA_LG, background: "transparent", color: "#fff", borderColor: "rgba(255,255,255,.42)" }}>
              <Icon name="linkedin" size={18} /> Connect on LinkedIn
            </Button>
          </div>
        </window.Reveal>
      </div>
    </section>
  );
}

function SiteFooter() {
  const c = SITE.contact;
  return (
    <footer className="footer">
      <div className="wrap">
        <div className="footer__grid">
          <div className="footer__brand">
            <img src={window.__asset("logoLight", "assets/lexintosh-logo-light.png")} alt="LexInTosh" className="footer__logo" />
            <p className="footer__tag">Legal technology infrastructure for Nepal &mdash; empowering the public, advocates, firms, and builders with AI-grounded research, case management, and open APIs.</p>
            <div className="footer__social">
              <a href={c.linkedin} target="_blank" rel="noopener noreferrer" className="footer__ico" aria-label="LexInTosh on LinkedIn"><Icon name="linkedin" size={18} /></a>
              <a href={c.mailto} className="footer__ico" aria-label="Email LexInTosh"><Icon name="mail" size={18} /></a>
            </div>
          </div>
          <div className="footer__col">
            <h4>Products</h4>
            {SITE.footer.products.map((l) => (
              <a key={l.label} href={l.href} {...(l.external ? { target: "_blank", rel: "noopener noreferrer" } : {})}>{l.label}</a>
            ))}
          </div>
          <div className="footer__col">
            <h4>Platform</h4>
            {SITE.footer.platform.map((l) => <a key={l.label} href={l.href}>{l.label}</a>)}
          </div>
          <div className="footer__col footer__contact">
            <h4>Contact</h4>
            <a href={c.mailto} className="footer__cline"><Icon name="mail" size={16} /> {c.email}</a>
            <a href={c.linkedin} target="_blank" rel="noopener noreferrer" className="footer__cline"><Icon name="linkedin" size={16} /> LinkedIn</a>
            <a href={c.web} target="_blank" rel="noopener noreferrer" className="footer__cline"><Icon name="globe" size={16} /> meroadda.com</a>
            <span className="footer__cline"><Icon name="map-pin" size={16} /> {c.location}</span>
            <div className="footer__salesbtn"><window.SalesButton size={window.CTA_MD}>Contact Us</window.SalesButton></div>
          </div>
        </div>
        <div className="footer__bar">
          <span>&copy; 2026 LexInTosh. All rights reserved.</span>
          <span className="footer__made"><img src={window.__asset("mark", "assets/lexintosh-mark.png")} alt="" width={14} height={14} /> Made in Nepal</span>
        </div>
      </div>
    </footer>
  );
}

Object.assign(window, { CTABand, SiteFooter });