function Footer() {
  const [showPrivacy, setShowPrivacy] = React.useState(false);

  React.useEffect(() => {
    if (!showPrivacy) return;
    const scrollY = window.scrollY;
    const prev = document.body.style.overflow;
    document.body.style.overflow = 'hidden';
    return () => { document.body.style.overflow = prev; };
  }, [showPrivacy]);

  return (
    <footer className="footer">
      <div className="container footer-grid">
        <div className="logo footer-logo">
          <img src="uploads/Dark Version Primary Logo.png" alt="Elevate Construction Group" style={{height:'52px', width:'auto', display:'block'}} />
        </div>
        <div style={{display:'flex', gap:24, flexWrap:'wrap', alignItems:'center'}}>
          <span>Licensed · Bonded · Insured · CA</span>
          <button onClick={() => setShowPrivacy(true)} style={{background:'none', border:'none', padding:0, font:'inherit', color:'var(--ink-3)', textDecoration:'underline', cursor:'pointer', fontSize:13}}>Privacy Policy</button>
          <span>© {new Date().getFullYear()} Elevate Construction Group</span>
        </div>
      </div>
      <div className="container" style={{marginTop:16, paddingTop:16, borderTop:'1px solid var(--line)'}}>
        <p style={{fontSize:11, color:'var(--ink-3)', lineHeight:1.6, margin:0, maxWidth:680}}>
          This site is not a part of the Facebook™ website or Facebook™ Inc. Additionally, this site is NOT endorsed by Facebook™ in any way. FACEBOOK™ is a trademark of FACEBOOK™, Inc.
        </p>
      </div>

      {showPrivacy && (
        <div className="modal-backdrop" onClick={(e) => { if (e.target === e.currentTarget) setShowPrivacy(false); }}>
          <div className="modal" style={{maxWidth:720, maxHeight:'calc(100vh - 48px)'}}>
            <div className="modal-header">
              <h3 style={{fontFamily:'var(--display)', fontWeight:700, fontSize:18, margin:0, letterSpacing:'-0.01em'}}>Privacy Policy</h3>
              <button className="modal-close" onClick={() => setShowPrivacy(false)}><Ic.close /></button>
            </div>
            <div className="modal-body" style={{padding:'28px 32px', fontSize:14, color:'var(--ink-2)', lineHeight:1.7, overflowY:'auto'}}>
              <p style={{fontWeight:600, color:'var(--ink)', marginTop:0}}>Elevate Construction Group</p>
              <p style={{marginTop:0}}>Effective Date: March 6, 2026</p>

              <p>Elevate Construction Group ("Company", "we", "our", or "us") respects your privacy and is committed to protecting the personal information you share with us. This Privacy Policy explains how we collect, use, and safeguard your information when you visit our website, interact with our advertisements, or request services from us.</p>
              <p>By using our website or submitting your information, you agree to the practices described in this policy.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Information We Collect</h4>
              <p>We may collect personal information that you voluntarily provide when you:</p>
              <ul style={{paddingLeft:20, margin:'8px 0'}}>
                <li>Request a window installation estimate</li>
                <li>Fill out a contact form</li>
                <li>Submit information through advertisements or lead forms</li>
                <li>Contact us directly</li>
              </ul>
              <p>This information may include:</p>
              <ul style={{paddingLeft:20, margin:'8px 0'}}>
                <li>Name</li>
                <li>Email address</li>
                <li>Phone number</li>
                <li>Property address</li>
                <li>Project details or service inquiries</li>
              </ul>
              <p>We may also automatically collect certain technical information when you visit our website, including IP address, browser type, device information, pages visited, and time spent on our website. This information helps us improve our website and overall user experience.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>How We Use Your Information</h4>
              <p>We use the information we collect to:</p>
              <ul style={{paddingLeft:20, margin:'8px 0'}}>
                <li>Respond to estimate requests and service inquiries</li>
                <li>Contact you regarding your project</li>
                <li>Provide quotes and project information</li>
                <li>Improve our website, advertising, and services</li>
                <li>Send updates, promotions, or relevant service information</li>
              </ul>
              <p>We only collect the information necessary to provide our services and communicate with potential customers.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Communication Consent</h4>
              <p>By submitting your information through our website, forms, or advertisements, you agree to be contacted by Elevate Construction Group via call, text message (SMS), and email, including the use of automated technology.</p>
              <p>Message and data rates may apply. Message frequency may vary. You can opt out of text messages at any time by replying STOP, or reply HELP for assistance.</p>
              <p>Consent is not a condition of purchase.</p>
              <p>We do not sell or share your contact information with third parties for marketing purposes.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Advertising and Tracking Technologies</h4>
              <p>Our website and advertisements may use tracking technologies such as cookies, pixels, or analytics tools. These help us understand how visitors interact with our website and improve our marketing performance.</p>
              <p>We may use platforms such as Meta Platforms (Facebook and Instagram) to measure ad performance and deliver relevant advertisements. These technologies may collect information about your interactions with our website or ads.</p>
              <p>You can disable cookies through your browser settings if you prefer not to allow this type of tracking.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Sharing of Information</h4>
              <p>We do not sell, rent, or trade your personal information.</p>
              <p>We may share your information with trusted service providers who help us operate our website, manage advertising campaigns, or support our business operations. These providers are required to keep your information secure and confidential.</p>
              <p>We may also disclose information if required to comply with legal obligations.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Data Security</h4>
              <p>We take reasonable measures to protect the information you provide. While we work to safeguard your personal information, no online system can guarantee complete security.</p>
              <p>We encourage users to only submit necessary information when requesting services.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Your Privacy Rights</h4>
              <p>You may request to:</p>
              <ul style={{paddingLeft:20, margin:'8px 0'}}>
                <li>Access the personal information we have about you</li>
                <li>Correct or update your information</li>
                <li>Request that we delete your information</li>
              </ul>
              <p>To make a request, please contact us using the information below.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Third-Party Links</h4>
              <p>Our website may contain links to third-party websites. We are not responsible for the privacy practices or content of those websites.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Changes to This Policy</h4>
              <p>We may update this Privacy Policy from time to time. Any changes will be posted on this page with a revised effective date.</p>

              <h4 style={{color:'var(--ink)', margin:'24px 0 8px', fontSize:15}}>Contact Information</h4>
              <p>If you have any questions about this Privacy Policy or how your information is handled, please contact us:</p>
              <p style={{marginBottom:0}}>Elevate Construction Group<br/>Email: info@elevatebld.com</p>
            </div>
          </div>
        </div>
      )}
    </footer>
  );
}
window.Footer = Footer;