export default function NewsletterSocialProof() {
    return (
        <section className="section-dark pb-16 lg:pb-24 relative z-10 -mt-8 pt-8">
            <div className="text-center max-w-[1200px] mx-auto px-4 sm:px-6 lg:px-8 gsap-fade-up">
                <p className="text-sm font-medium text-text-light-muted mb-6">Join 5,000+ industry professionals from:</p>
                <div className="flex flex-wrap justify-center items-center gap-8 md:gap-16 opacity-50 grayscale hover:grayscale-0 transition-all duration-500">
                    {/* Logo 1 */}
                    <div className="h-6 w-auto flex items-center justify-center hover:text-primary-light text-light-surface transition-colors">
                        <svg className="h-6" fill="currentColor" viewBox="0 0 100 30" xmlns="http://www.w3.org/2000/svg">
                            <path d="M10,5 L15,25 L20,5 M30,5 L30,25 M40,5 L50,5 M45,5 L45,25" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="3"></path>
                        </svg>
                    </div>
                    {/* Logo 2 */}
                    <div className="h-6 w-auto flex items-center justify-center hover:text-primary-light text-light-surface transition-colors">
                        <svg className="h-6" fill="currentColor" viewBox="0 0 100 30" xmlns="http://www.w3.org/2000/svg">
                            <circle cx="15" cy="15" fill="none" r="10" stroke="currentColor" strokeWidth="3"></circle>
                            <rect fill="none" height="20" stroke="currentColor" strokeWidth="3" width="20" x="35" y="5"></rect>
                        </svg>
                    </div>
                    {/* Logo 3 */}
                    <div className="h-6 w-auto flex items-center justify-center hover:text-primary-light text-light-surface transition-colors">
                        <svg className="h-6" fill="currentColor" viewBox="0 0 100 30" xmlns="http://www.w3.org/2000/svg">
                            <path d="M10,25 L20,5 L30,25 M40,5 L40,25 L60,25" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="3"></path>
                        </svg>
                    </div>
                    {/* Logo 4 */}
                    <div className="h-6 w-auto flex items-center justify-center hover:text-primary-light text-light-surface transition-colors">
                        <svg className="h-6" fill="currentColor" viewBox="0 0 100 30" xmlns="http://www.w3.org/2000/svg">
                            <path d="M10,15 L20,5 L30,15 L20,25 Z M40,5 L40,25 M50,5 L60,5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="3"></path>
                        </svg>
                    </div>
                </div>
            </div>
        </section>
    );
}
