function getFooterMarkup(options) {
  var includeContact = !options || options.includeContact !== false;

  var contactBlock = includeContact
    ? '<section id="contact" class="relative overflow-hidden bg-[#eef5ef]">' +
      '<div class="pointer-events-none absolute inset-0 opacity-[0.06]" style="background-image: radial-gradient(circle at 1px 1px, #2e7d32 1px, transparent 0); background-size: 24px 24px;"></div>' +
      '<div class="relative mx-auto grid max-w-7xl gap-12 px-4 py-16 lg:grid-cols-12 lg:items-center">' +
      '<div class="reveal lg:col-span-5">' +
      '<p class="text-xs font-semibold uppercase tracking-[0.32em]" style="color: var(--secondary-color);">Contact Us</p>' +
      '<h2 class="mt-3 font-serif text-4xl leading-tight sm:text-5xl" style="color: var(--primary-color);">Get in Touch</h2>' +
      '<p class="mt-5 max-w-md text-sm leading-7 text-slate-700">Have questions about our services or membership? Our team is here to help you secure your financial future.</p>' +
      '<div class="mt-8 space-y-5">' +
      '<div class="flex items-start gap-4">' +
      '<span class="mt-1 inline-flex h-10 w-10 items-center justify-center rounded-full border bg-white text-xs font-bold" style="color: var(--secondary-color); border-color: rgba(251, 192, 45, 0.45);">01</span>' +
      '<div><p class="text-sm font-semibold" style="color: var(--primary-color);">Our Location</p><p class="mt-1 max-w-sm text-sm leading-6 text-slate-700">144 A (32 A), T H Road, M R Nagar, Kodungaiyur, Chennai - 600 118, Tamilnadu, India</p></div>' +
      '</div>' +
      '<div class="flex items-start gap-4">' +
      '<span class="mt-1 inline-flex h-10 w-10 items-center justify-center rounded-full border bg-white text-xs font-bold" style="color: var(--secondary-color); border-color: rgba(251, 192, 45, 0.45);">02</span>' +
      '<div><p class="text-sm font-semibold" style="color: var(--primary-color);">Email Address</p><p class="mt-1 text-sm text-slate-700">knbf@gmail.com</p></div>' +
      '</div>' +
      '<div class="flex items-start gap-4">' +
      '<span class="mt-1 inline-flex h-10 w-10 items-center justify-center rounded-full border bg-white text-xs font-bold" style="color: var(--secondary-color); border-color: rgba(251, 192, 45, 0.45);">03</span>' +
      '<div><p class="text-sm font-semibold" style="color: var(--primary-color);">Working Hours</p><p class="mt-1 text-sm text-slate-700">Mon - Sat: 10.00 AM - 6.00 PM</p></div>' +
      '</div>' +
      '</div>' +
      '</div>' +
      '<div class="reveal lg:col-span-7">' +
      '<form id="contactForm" class="rounded-3xl border p-6 sm:p-8" style="border-color: #d7e4db; background: #f9fcf9; box-shadow: 0 20px 45px rgba(16, 58, 29, 0.12);">' +
      '<div id="formMessage" class="hidden mb-4 p-4 rounded-xl text-sm font-semibold"></div>' +
      '<div class="grid gap-4 sm:grid-cols-2">' +
      '<label class="text-xs font-semibold uppercase tracking-widest" style="color: #4b5563;">Full Name<input type="text" name="fullName" required placeholder="John Doe" class="mt-2 w-full rounded-xl border px-4 py-3 text-sm text-slate-700 outline-none transition" style="border-color: #d5e2d8; background: #ffffff;" /></label>' +
      '<label class="text-xs font-semibold uppercase tracking-widest" style="color: #4b5563;">Email Address<input type="email" name="email" required placeholder="john@example.com" class="mt-2 w-full rounded-xl border px-4 py-3 text-sm text-slate-700 outline-none transition" style="border-color: #d5e2d8; background: #ffffff;" /></label>' +
      '</div>' +
      '<label class="mt-4 block text-xs font-semibold uppercase tracking-widest" style="color: #4b5563;">Subject<input type="text" name="subject" required placeholder="How can we help?" class="mt-2 w-full rounded-xl border px-4 py-3 text-sm text-slate-700 outline-none transition" style="border-color: #d5e2d8; background: #ffffff;" /></label>' +
      '<label class="mt-4 block text-xs font-semibold uppercase tracking-widest" style="color: #4b5563;">Message<textarea rows="4" name="message" required placeholder="Your message here..." class="mt-2 w-full rounded-xl border px-4 py-3 text-sm text-slate-700 outline-none transition" style="border-color: #d5e2d8; background: #ffffff;"></textarea></label>' +
      '<button type="submit" id="submitBtn" class="mt-6 w-full rounded-xl bg-[var(--primary-color)] px-5 py-3 text-xs font-bold uppercase tracking-[0.22em] text-white transition hover:-translate-y-0.5 hover:brightness-110">Send Message</button>' +
      '</form>' +
      '</div>' +
      '</div>' +
      '</section>'
    : "";

  return (
    contactBlock +
    '<footer class="text-white" style="background: #111827;">' +
    '<div class="mx-auto grid max-w-7xl gap-10 px-4 py-12 md:grid-cols-12">' +
    '<div class="reveal md:col-span-6">' +
    '<div class="flex items-center gap-3 mb-4">' +
    '<div class="h-10 w-10 sm:h-12 sm:w-12 rounded-full bg-white flex items-center justify-center border border-[var(--secondary-color)] shadow-md flex-shrink-0">' +
    '<img src="logo.png" alt="SS Logo" class="h-8 w-8 sm:h-10 sm:w-10 object-contain" />' +
    '</div>' +
    '<div>' +
    '<p class="text-sm sm:text-lg font-bold text-white leading-tight">KANNADASAN NAGAR BENEFIT FUND LIMITED</p>' +
    '<p class="text-[9px] sm:text-[10px] font-semibold uppercase tracking-[0.3em] text-emerald-100">Save for Safety</p>' +
    '</div>' +
    '</div>' +
    '<p class="mt-4 max-w-md text-sm leading-7 text-emerald-100/90">A notified NIDHI company incorporated in 1995, dedicated to encouraging thrift and savings amongst its members. Governed by the Ministry of Company Affairs.</p>' +
    '<div class="mt-6 flex gap-3">' +
    '<a href="#" class="inline-flex h-8 w-8 items-center justify-center rounded-full border border-emerald-100/30 text-xs text-emerald-100 transition hover:border-[var(--secondary-color)] hover:text-[var(--secondary-color)]">f</a>' +
    '<a href="#" class="inline-flex h-8 w-8 items-center justify-center rounded-full border border-emerald-100/30 text-xs text-emerald-100 transition hover:border-[var(--secondary-color)] hover:text-[var(--secondary-color)]">x</a>' +
    '<a href="#" class="inline-flex h-8 w-8 items-center justify-center rounded-full border border-emerald-100/30 text-xs text-emerald-100 transition hover:border-[var(--secondary-color)] hover:text-[var(--secondary-color)]">in</a>' +
    '<a href="#" class="inline-flex h-8 w-8 items-center justify-center rounded-full border border-emerald-100/30 text-xs text-emerald-100 transition hover:border-[var(--secondary-color)] hover:text-[var(--secondary-color)]">ig</a>' +
    '</div>' +
    '</div>' +
    '<div class="reveal md:col-span-3">' +
    '<p class="text-sm sm:text-lg font-bold text-white leading-tight">QUICK LINKS</p>' +
    '<ul class="mt-4 space-y-2 text-sm text-emerald-100/90">' +
    '<li><a href="about.html" class="hover:text-white">About Us</a></li>' +
    '<li><a href="index.html#services" class="hover:text-white">Our Services</a></li>' +
    '<li><a href="index.html#vision" class="hover:text-white">Our Vision</a></li>' +
    '<li><a href="index.html#financials" class="hover:text-white">Financials</a></li>' +
    '</ul>' +
    '</div>' +
    '<div class="reveal md:col-span-3">' +
    '<p class="text-sm sm:text-lg font-bold text-white leading-tight">LEGAL</p>' +
    '<ul class="mt-4 space-y-2 text-sm text-emerald-100/90">' +
    '<li>CIN: U65991TN1995PLC32493</li>' +
    '<li>Reg No: 32493</li>' +
    '<li><a href="#" class="hover:text-white">Privacy Policy</a></li>' +
    '<li><a href="#" class="hover:text-white">Terms of Service</a></li>' +
    '</ul>' +
    '</div>' +
    '</div>' +
    '</footer>'
  );
}

function handleContactFormSubmit(e) {
  e.preventDefault();
  
  var form = e.target;
  var submitBtn = document.getElementById('submitBtn');
  var formMessage = document.getElementById('formMessage');
  
  // Get form data
  var formData = {
    fullName: form.fullName.value,
    email: form.email.value,
    subject: form.subject.value,
    message: form.message.value
  };
  
  // Disable submit button
  submitBtn.disabled = true;
  submitBtn.textContent = 'Sending...';
  
  // Simulate API call (replace with actual API endpoint)
  setTimeout(function() {
    // Success response
    formMessage.className = 'mb-4 p-4 rounded-xl text-sm font-semibold bg-green-100 text-green-800';
    formMessage.textContent = 'Thank you for your message! We will get back to you within 24-48 hours.';
    formMessage.classList.remove('hidden');
    
    // Reset form
    form.reset();
    
    // Re-enable button
    submitBtn.disabled = false;
    submitBtn.textContent = 'Send Message';
    
    // Hide message after 5 seconds
    setTimeout(function() {
      formMessage.classList.add('hidden');
    }, 5000);
    
    // Optional: Send to your email service
    // Example with FormSubmit, EmailJS, or your own backend
    /*
    fetch('YOUR_API_ENDPOINT', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(formData)
    })
    .then(response => response.json())
    .then(data => {
      // Handle success
    })
    .catch(error => {
      // Handle error
      formMessage.className = 'mb-4 p-4 rounded-xl text-sm font-semibold bg-red-100 text-red-800';
      formMessage.textContent = 'Sorry, something went wrong. Please try again or email us directly.';
      formMessage.classList.remove('hidden');
    });
    */
  }, 1500);
}

function mountFooter(options) {
  var targetId = (options && options.targetId) || "siteFooter";
  var target = document.getElementById(targetId);
  if (!target) return;
  target.innerHTML = getFooterMarkup(options || {});
  
  // Attach form submit handler
  var contactForm = document.getElementById('contactForm');
  if (contactForm) {
    contactForm.addEventListener('submit', handleContactFormSubmit);
  }
}