<!-- Navigation -->
<nav style="display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background-color:#0f172a;font-family:'Inter',sans-serif;">
  <a href="home.html" style="font-size:22px;font-weight:700;color:#ffffff;text-decoration:none;letter-spacing:-0.5px;">NovaTech</a>
  <div style="display:flex;align-items:center;gap:32px;">
    <a href="product.html" style="color:#cbd5e1;text-decoration:none;font-size:15px;font-weight:500;">Product</a>
    <a href="team.html" style="color:#cbd5e1;text-decoration:none;font-size:15px;font-weight:500;">Team</a>
    <a href="contact.html" style="color:#ffffff;text-decoration:none;font-size:15px;font-weight:600;">Contact</a>
    <a href="#" style="background-color:#6366f1;color:#ffffff;padding:10px 24px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:600;">Get Started</a>
  </div>
</nav>

<!-- Contact Section -->
<section style="background-color:#ffffff;padding:96px 48px;font-family:'Inter',sans-serif;">
  <div style="max-width:1100px;margin:0 auto;display:flex;gap:64px;flex-wrap:wrap;">
    <!-- Left: Contact Info -->
    <div style="flex:1;min-width:320px;">
      <p style="font-size:14px;font-weight:600;color:#6366f1;text-transform:uppercase;letter-spacing:2px;margin:0 0 12px;">Contact Us</p>
      <h1 style="font-size:42px;font-weight:800;color:#0f172a;line-height:1.15;margin:0 0 20px;letter-spacing:-1px;">Let's Talk</h1>
      <p style="font-size:16px;color:#64748b;line-height:1.8;margin:0 0 40px;">Have a question about NovaTech? Want a personalized demo? We'd love to hear from you.</p>
      <div style="display:flex;flex-direction:column;gap:28px;">
        <div>
          <h4 style="font-size:14px;font-weight:700;color:#0f172a;margin:0 0 6px;">Email</h4>
          <a href="mailto:hello@novatech.io" style="font-size:15px;color:#6366f1;text-decoration:none;">hello@novatech.io</a>
        </div>
        <div>
          <h4 style="font-size:14px;font-weight:700;color:#0f172a;margin:0 0 6px;">Headquarters</h4>
          <p style="font-size:15px;color:#64748b;margin:0;line-height:1.6;">123 Innovation Drive, Suite 400<br />San Francisco, CA 94107</p>
        </div>
        <div>
          <h4 style="font-size:14px;font-weight:700;color:#0f172a;margin:0 0 6px;">Follow Us</h4>
          <div style="display:flex;gap:16px;">
            <a href="#" style="color:#6366f1;text-decoration:none;font-size:15px;font-weight:500;">Twitter</a>
            <a href="#" style="color:#6366f1;text-decoration:none;font-size:15px;font-weight:500;">LinkedIn</a>
            <a href="#" style="color:#6366f1;text-decoration:none;font-size:15px;font-weight:500;">GitHub</a>
          </div>
        </div>
      </div>
    </div>
    <!-- Right: Contact Form -->
    <div style="flex:1;min-width:320px;background-color:#f8fafc;border-radius:16px;padding:40px;">
      <form style="display:flex;flex-direction:column;gap:20px;">
        <div style="display:flex;gap:16px;flex-wrap:wrap;">
          <div style="flex:1;min-width:140px;">
            <label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Name</label>
            <input type="text" placeholder="Your name" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;box-sizing:border-box;" />
          </div>
          <div style="flex:1;min-width:140px;">
            <label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Email</label>
            <input type="email" placeholder="you@company.com" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;box-sizing:border-box;" />
          </div>
        </div>
        <div>
          <label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Company</label>
          <input type="text" placeholder="Your company" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;box-sizing:border-box;" />
        </div>
        <div>
          <label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Subject</label>
          <select style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;box-sizing:border-box;color:#64748b;">
            <option>General Inquiry</option>
            <option>Request a Demo</option>
            <option>Pricing Question</option>
            <option>Technical Support</option>
            <option>Partnership</option>
          </select>
        </div>
        <div>
          <label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Message</label>
          <textarea placeholder="How can we help?" rows="5" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;resize:vertical;box-sizing:border-box;"></textarea>
        </div>
        <button type="submit" style="background-color:#6366f1;color:#ffffff;padding:12px 24px;border:none;border-radius:8px;font-size:15px;font-weight:600;font-family:'Inter',sans-serif;cursor:pointer;">Send Message</button>
      </form>
    </div>
  </div>
</section>

<!-- FAQ Section -->
<section style="background-color:#f8fafc;padding:96px 48px;font-family:'Inter',sans-serif;">
  <div style="max-width:800px;margin:0 auto;">
    <h2 style="font-size:34px;font-weight:800;color:#0f172a;margin:0 0 48px;text-align:center;letter-spacing:-0.5px;">Frequently Asked Questions</h2>
    <div style="display:flex;flex-direction:column;gap:24px;">
      <div style="background-color:#ffffff;border:1px solid #e2e8f0;border-radius:12px;padding:28px 32px;">
        <h3 style="font-size:17px;font-weight:700;color:#0f172a;margin:0 0 10px;">What is NovaTech?</h3>
        <p style="font-size:15px;color:#64748b;line-height:1.7;margin:0;">NovaTech is an AI-powered analytics and automation platform that helps teams turn raw data into actionable insights. We combine real-time dashboards, workflow automation, and 200+ integrations in one unified workspace.</p>
      </div>
      <div style="background-color:#ffffff;border:1px solid #e2e8f0;border-radius:12px;padding:28px 32px;">
        <h3 style="font-size:17px;font-weight:700;color:#0f172a;margin:0 0 10px;">Is there a free plan?</h3>
        <p style="font-size:15px;color:#64748b;line-height:1.7;margin:0;">Yes! Our Starter plan is completely free and includes up to 3 dashboards, 1,000 data points per day, and 5 integrations. No credit card required to get started.</p>
      </div>
      <div style="background-color:#ffffff;border:1px solid #e2e8f0;border-radius:12px;padding:28px 32px;">
        <h3 style="font-size:17px;font-weight:700;color:#0f172a;margin:0 0 10px;">How long does setup take?</h3>
        <p style="font-size:15px;color:#64748b;line-height:1.7;margin:0;">Most teams are up and running within 15 minutes. Our one-click integrations connect to your existing tools instantly, and our onboarding wizard guides you through creating your first dashboard.</p>
      </div>
      <div style="background-color:#ffffff;border:1px solid #e2e8f0;border-radius:12px;padding:28px 32px;">
        <h3 style="font-size:17px;font-weight:700;color:#0f172a;margin:0 0 10px;">Can I cancel anytime?</h3>
        <p style="font-size:15px;color:#64748b;line-height:1.7;margin:0;">Absolutely. All paid plans are month-to-month with no long-term contracts. You can upgrade, downgrade, or cancel at any time from your account settings.</p>
      </div>
    </div>
  </div>
</section>

<!-- Footer -->
<footer style="background-color:#0f172a;padding:48px;font-family:'Inter',sans-serif;">
  <div style="max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;">
    <a href="home.html" style="font-size:18px;font-weight:700;color:#ffffff;letter-spacing:-0.5px;text-decoration:none;">NovaTech</a>
    <div style="display:flex;gap:28px;">
      <a href="product.html" style="color:#94a3b8;text-decoration:none;font-size:14px;">Product</a>
      <a href="team.html" style="color:#94a3b8;text-decoration:none;font-size:14px;">Team</a>
      <a href="contact.html" style="color:#94a3b8;text-decoration:none;font-size:14px;">Contact</a>
      <a href="#" style="color:#94a3b8;text-decoration:none;font-size:14px;">Privacy</a>
    </div>
    <p style="color:#475569;font-size:13px;margin:0;">&copy; 2026 NovaTech. All rights reserved.</p>
  </div>
</footer>
