window.Hero = function Hero() {
  return (
    <section className="section reveal" style={{ 
      textAlign: 'center', 
      paddingTop: '160px',
      paddingBottom: '80px',
      display: 'flex',
      flexDirection: 'column',
      alignItems: 'center',
      justifyContent: 'center'
    }}>
      <div className="container">
        <div style={{
          display: 'inline-flex',
          alignItems: 'center',
          gap: '8px',
          padding: '6px 16px',
          background: 'var(--card-bg)',
          border: '1px solid var(--glass-border)',
          borderRadius: '999px',
          fontSize: '0.875rem',
          fontWeight: '600',
          marginBottom: '24px',
          color: 'var(--accent-color)'
        }}>
          ✨ AI-Powered UX Analysis Engine
        </div>
        
        <h1 style={{
          fontSize: 'clamp(2.5rem, 5vw, 4.5rem)',
          fontWeight: '800',
          lineHeight: '1.1',
          letterSpacing: '-1px',
          marginBottom: '24px',
          maxWidth: '800px',
          marginLeft: 'auto',
          marginRight: 'auto'
        }}>
          disvi Powered <br/> <span className="bg-gradient-text">UI Analyzer</span>
        </h1>
        
        <p style={{
          fontSize: '1.25rem',
          color: 'var(--text-secondary)',
          maxWidth: '600px',
          margin: '0 auto 40px auto',
          lineHeight: '1.6'
        }}>
          Get instant UX feedback and redesign suggestions for your website. 
          Simply drop your URL and let our AI models audit your design instantly.
        </p>
        
        <button 
          onClick={() => document.getElementById('analyzer-form').scrollIntoView({ behavior: 'smooth' })}
          className="btn btn-primary" 
          style={{ fontSize: '1.125rem', padding: '16px 36px' }}
        >
          Analyze My UI
          <svg style={{marginLeft: '8px'}} width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path></svg>
        </button>
      </div>
    </section>
  );
};