<?php include 'header.php'; ?>

<body>
  <div class="nav-bg" data-noprint>
    <div class="wrap nav">
      <a href="index.html" class="brand"><span class="brand-mark"><i></i></span><span
          class="brand-name">Crawlie</span></a>
      <div class="nav-links" data-nav-links>
        <a class="nav-link" href="index.html">Home</a>
        <a class="nav-link" href="tools.html">Free tools</a>
        <a class="nav-link mobile-only" href="index.html#audit">Site audit</a>
        <a class="nav-link" href="blog/index.html">Blog</a>
        <a class="nav-link" href="about.html">About</a>
        <a class="nav-link is-active" href="contact.html">Contact</a>
      </div>
      <a class="btn-ghost" href="index.html#audit">Run free audit</a>
      <button class="nav-toggle" data-nav-toggle aria-label="Menu"><span></span></button>
    </div>
  </div>

  <div class="wrap-narrow" style="padding-top:50px;padding-bottom:110px;">
    <div class="eyebrow">Contact</div>
    <h1 style="font-size:40px;margin-bottom:16px;">Get in touch</h1>
    <p class="muted" style="font-size:16px;line-height:1.65;margin-bottom:36px;max-width:520px;">Found a bug, have a
      tool idea, or want to say hello? Send us a note and we'll open it in your email client — nothing is submitted to a
      server.</p>

    <div class="card" style="padding:32px;max-width:560px;">
      <form id="contact-form">
        <div class="field"><label>Your name</label><input id="c-name" class="input" required></div>
        <div class="field"><label>Your email</label><input id="c-email" class="input" type="email" required></div>
        <div class="field"><label>Subject</label>
          <select id="c-subject" class="select">
            <option>Bug report</option>
            <option>Tool suggestion</option>
            <option>General question</option>
            <option>Something else</option>
          </select>
        </div>
        <div class="field" style="margin-bottom:0;"><label>Message</label><textarea id="c-message" class="textarea"
            style="font-family:inherit;" rows="5" required></textarea></div>
        <button type="submit" class="btn btn-primary btn-md" style="margin-top:22px;">Send message →</button>
        <p class="hint" id="c-status" style="margin-top:12px;"></p>
      </form>
    </div>
  </div>

  <footer class="footer wrap" data-noprint>
    <div class="footer-grid">
      <div>
        <a href="index.html" class="brand" style="margin-bottom:14px;"><span class="brand-mark"><i></i></span><span
            class="brand-name">Crawlie</span></a>
        <p class="muted" style="font-size:14px;line-height:1.6;max-width:260px;margin-top:14px;">A free, no-login SEO
          audit tool and toolbox that runs entirely in your browser.</p>
      </div>
      <div>
        <h4>Product</h4><a href="index.html">Free SEO audit</a><a href="tools.html">Free tools</a><a
          href="blog/index.html">Blog</a><a href="report.html?url=https%3A%2F%2Fexample.com">Sample report</a>
      </div>
      <div>
        <h4>Tools</h4><a href="tools/sitemap-generator.html">Sitemap generator</a><a
          href="tools/robots-generator.html">Robots.txt generator</a><a href="tools/backlink-checker.html">Backlink
          checker</a><a href="tools/ai-crawler-checker.html">AI crawler & llms.txt checker</a>
      </div>
      <div>
        <h4>Company</h4><a href="about.html">About</a><a href="contact.html">Contact</a><a
          href="privacy-policy.html">Privacy Policy</a>
      </div>
    </div>
    <div class="footer-bottom">
      <span>&copy; <span data-year></span> Crawlie. All checks run locally in your browser.</span>
      <span>Built with care for people who'd rather fix than guess.</span>
    </div>
  </footer>
  <script src="assets/main.js?v=2"></script>
  <script>
    document.getElementById('contact-form').addEventListener('submit', function(e) {
      e.preventDefault();
      var name = document.getElementById('c-name').value.trim();
      var email = document.getElementById('c-email').value.trim();
      var subject = document.getElementById('c-subject').value;
      var message = document.getElementById('c-message').value.trim();
      if (!name || !email || !message) {
        document.getElementById('c-status').textContent = 'Please fill in every field.';
        return;
      }
      var body = 'From: ' + name + ' (' + email + ')\n\n' + message;
      window.location.href = 'mailto:hello@crawlie.app?subject=' + encodeURIComponent('[Crawlie] ' + subject) + '&body=' + encodeURIComponent(body);
      document.getElementById('c-status').textContent = 'Opening your email client...';
    });
  </script>
  <!-- Mobile Sticky Ad -->
  <div class="ad-container-mobile-sticky" data-noprint>
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXX"
      crossorigin="anonymous"></script>
    <ins class="adsbygoogle" style="display:inline-block;width:320px;height:50px" data-ad-client="ca-pub-XXXXX"
      data-ad-slot="0987654321"></ins>
    <script>
      (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
  </div>
</body>

</html>