function Press() {
  return (
    <section id="basin">
      <div className="container">
        <div className="press-card">
          <div className="press-grid">
            <div>
              <span className="eyebrow gold">{t('10 / BASIN KİTİ', '10 / PRESS KIT')}</span>
              <h2 className="h-1" style={{ marginTop: 14 }}>
                {t('Şehirleri', 'Rewriting')}<br/>
                <span className="serif" style={{ color: 'var(--gold)' }}>{t('yeniden yazmak.', 'historic cities.')}</span>
              </h2>
              <p style={{ marginTop: 20, maxWidth: 520 }}>
                {t(
                  'Atlas, global bir şablonun lokalizasyonu değil — şehirler için sıfırdan tasarlandı. İlk olarak İstanbul\'un 12 merkez ilçesinde binlerce kültürel, tarihî ve doğal mekânı kapsar; yeni şehirler eklenecek.',
                  'Atlas is not the localization of a global template — it was designed from scratch for cities. Starting with thousands of cultural, historical, and natural landmarks across 12 central districts of Istanbul; more cities to come.'
                )}
              </p>
              <div style={{ display: 'flex', gap: 14, marginTop: 32, flexWrap: 'wrap' }}>
                <a href="mailto:press@atlasdiscovers.com" className="btn btn-primary">
                  press@atlasdiscovers.com <IconArrow size={12}/>
                </a>
              </div>
            </div>

            <div className="press-stats">
              <div className="press-stat">
                <div className="n green">9.7K</div>
                <div className="l">{t('Kültürel Nokta', 'Cultural Sites')}</div>
              </div>
              <div className="press-stat">
                <div className="n cyan">12</div>
                <div className="l">{t('İstanbul İlçesi', 'Istanbul Districts')}</div>
              </div>
              <div className="press-stat">
                <div className="n gold">50</div>
                <div className="l">{t('Seviye · 11 Unvan', 'Levels · 11 Titles')}</div>
              </div>
              <div className="press-stat">
                <div className="n">14</div>
                <div className="l">{t('Kategori · 5 Rarity', 'Categories · 5 Rarities')}</div>
              </div>
            </div>
          </div>

          {/* device rail */}
          <div style={{ marginTop: 72 }}>
            <div className="eyebrow cyan" style={{ marginBottom: 24, textAlign: 'center' }}>{t('✦ UYGULAMADAN', '✦ FROM THE APP')}</div>
            <div className="device-rail">
              <div className="device">
                <div className="notch"/>
                <div className="screen"><img src="/assets/screens/press-discover.png" alt="Discover"/></div>
                <div className="caption">{t('KEŞFET', 'DISCOVER')}</div>
              </div>
              <div className="device offset-2">
                <div className="notch"/>
                <div className="screen"><img src="/assets/screens/press-hidden.png" alt="Hidden places"/></div>
                <div className="caption">{t('GİZLİ YERLER', 'HIDDEN PLACES')}</div>
              </div>
              <div className="device offset-1">
                <div className="notch"/>
                <div className="screen"><img src="/assets/screens/press-stats.png" alt="Neighborhood statistics"/></div>
                <div className="caption">{t('MAHALLE İSTATİSTİKLERİ', 'NEIGHBORHOOD STATS')}</div>
              </div>
              <div className="device">
                <div className="notch"/>
                <div className="screen"><img src="/assets/screens/press-season.png" alt="Season"/></div>
                <div className="caption">{t('SEZON', 'SEASON')}</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}
Object.assign(window, { Press });