function Hero() {
  const tickerItems = [
    "Fibre optique jusqu'à 1 Gbps",
    "Installation gratuite",
    "Support 24h/7j",
    "Couverture Conakry & banlieue",
    "Wi-Fi 6 inclus",
    "Sans engagement long",
  ];
  return (
    <React.Fragment>
      <header className="hero">
        <div className="container hero-inner">
          <div>
            <div className="eyebrow on-dark">★ MouNa Fibre — Édition 2026</div>
            <h1>
              La fibre qui réveille<br/>
              <em>la Guinée</em> connectée.
            </h1>
            <p className="lede">
              Une fibre optique de bout en bout — stable, ultra-rapide, et taillée pour les entreprises comme pour les foyers. Streaming 4K, gaming, télétravail et visioconférence sans aucune latence.
            </p>
            <div className="hero-ctas">
              <a href="onboarding.html" className="btn btn-primary on-dark">
                Souscrire en 3 min <Icons.Arrow size={14} />
              </a>
              <a href="#eligibilite" className="btn btn-ghost on-dark">
                Vérifier mon éligibilité
              </a>
            </div>
            <div className="hero-stats">
              <div className="hero-stat">
                <span className="v">10k<sub>+</sub></span>
                <span className="k">Clients connectés</span>
              </div>
              <div className="hero-stat">
                <span className="v">99.9<sub>%</sub></span>
                <span className="k">Uptime garanti</span>
              </div>
              <div className="hero-stat">
                <span className="v">24<sub>/7</sub></span>
                <span className="k">Support humain</span>
              </div>
            </div>
            <div className="hero-meter">
              <div className="hero-meter-top">
                <div className="hero-meter-speed">
                  860<sub> Mbps</sub>
                </div>
                <div className="hero-meter-tag">↑ DEBIT TEMPS RÉEL</div>
              </div>
              <div className="hero-meter-bar"><div className="hero-meter-fill"></div></div>
            </div>
          </div>

          <div className="hero-visual" aria-hidden="true"></div>
        </div>
      </header>

      <div className="hero-ticker" aria-hidden="true">
        <div className="hero-ticker-track">
          {[...tickerItems, ...tickerItems, ...tickerItems].map((t, i) => <span key={i}>{t}</span>)}
        </div>
      </div>
    </React.Fragment>
  );
}

window.Hero = Hero;