// Final CTA section

const FinalCTASection = () => (
  <section data-screen-label="09 Final CTA" style={{position:'relative',padding:'160px 0 100px',background:'#0e0e10',overflow:'hidden'}}>
    <div aria-hidden style={{position:'absolute',inset:0,pointerEvents:'none'}}>
      <div style={{position:'absolute',top:'10%',left:'50%',transform:'translateX(-50%)',width:'90%',maxWidth:1100,height:'70%',background:'radial-gradient(ellipse, rgba(255,107,0,0.18), transparent 60%)'}} />
      <div style={{position:'absolute',inset:0,backgroundImage:'linear-gradient(rgba(93,230,255,0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(93,230,255,0.08) 1px, transparent 1px)',backgroundSize:'72px 72px',WebkitMaskImage:'radial-gradient(ellipse 60% 50% at 50% 50%, black 0%, transparent 80%)',maskImage:'radial-gradient(ellipse 60% 50% at 50% 50%, black 0%, transparent 80%)'}} />
    </div>

    <div style={{position:'relative',maxWidth:900,margin:'0 auto',padding:'0 32px',textAlign:'center'}}>
      <h2 style={{fontFamily:'Manrope',fontSize:'clamp(40px, 5vw, 68px)',fontWeight:800,letterSpacing:'-0.04em',lineHeight:1.05,color:'#e5e1e4',margin:'0 0 24px',textWrap:'balance'}}>
        E-ticaretinizi yeniden<br/>
        <span style={{background:'linear-gradient(90deg,#FF8C33,#FF6B00)',WebkitBackgroundClip:'text',backgroundClip:'text',WebkitTextFillColor:'transparent'}}>sizin için çalıştırın</span>
      </h2>
      <p style={{fontSize:18,lineHeight:1.6,color:'#a98a7d',margin:'0 auto 48px',maxWidth:620,textWrap:'pretty'}}>
        İlk gün kurulum. İlk hafta otomasyon. İlk ay tam kontrol.
        Bekleme listemize katılın; erken erişim, daha iyi fiyat, kurucu ekiple doğrudan hat.
      </p>
      <div style={{display:'flex',gap:14,justifyContent:'center',flexWrap:'wrap'}}>
        <button className="sp-primary-cta sp-cta-glow"
          onClick={() => { try { window.top.location.href = '/waitlist'; } catch { window.location.href = '/waitlist'; } }}
          style={{padding:'18px 36px',borderRadius:14,background:'#FF6B00',color:'#572000',border:'none',fontSize:17,fontWeight:800,cursor:'pointer',fontFamily:'Inter',letterSpacing:'-0.01em',transition:'transform .25s, box-shadow .25s'}}>
          Bekleme Listesine Katıl
        </button>
      </div>

      {/* ═══════════════════ FOOTER: Legal + Copyright ═══════════════════ */}
      <div style={{
        marginTop: 72, paddingTop: 40,
        borderTop: '1px solid rgba(255,255,255,0.06)',
        display: 'flex', flexDirection: 'column',
        alignItems: 'center', gap: 16,
        fontSize: 12, color: '#6b655f',
        fontFamily: 'JetBrains Mono', letterSpacing: '0.08em',
      }}>
        {/* Legal links */}
        <div style={{
          display: 'flex', gap: 14, flexWrap: 'wrap', justifyContent: 'center',
        }}>
          {[
            'Gizlilik', 'Kullanım Koşulları', 'KVKK', 'Çerez', 'İletişim',
          ].map((label, i, arr) => (
            <React.Fragment key={label}>
              <a href="#" style={{
                color: '#a98a7d', textDecoration: 'none',
                transition: 'color .2s ease',
              }}
                onMouseEnter={e => e.currentTarget.style.color = '#FF6B00'}
                onMouseLeave={e => e.currentTarget.style.color = '#a98a7d'}>
                {label}
              </a>
              {i < arr.length - 1 && <span style={{ opacity: 0.3 }}>·</span>}
            </React.Fragment>
          ))}
        </div>

        {/* Trademark + Satıcı */}
        <div style={{
          textAlign: 'center', fontSize: 11,
          color: '#6b655f', lineHeight: 1.6, maxWidth: 620,
        }}>
          ShopPanel<sup style={{fontSize:8}}>™</sup>, Bifamo Tasarım Ltd. Şti. markasıdır.
          <br />Satıcı: Bifamo Tasarım Ltd. Şti.
        </div>

        {/* Copyright */}
        <div style={{
          fontSize: 10, opacity: 0.6, letterSpacing: '0.15em',
        }}>
          © 2026 · Tüm hakları saklıdır.
        </div>
      </div>
    </div>
  </section>
);

window.FinalCTASection = FinalCTASection;