// Hero — flush-left headline + gold flowing CTA + emphasis underline
const Hero = () => {
  return (
    <section className="gb-hero gb-hero--dark" id="top">
      <div className="gb-hero__bg" aria-hidden="true">
        <div className="gb-hero__bg-image"></div>
        <div className="gb-hero__bg-veil"></div>
      </div>
      <div className="gb-container">
        <h1 className="gb-hero__headline">
          Connecting Global<br/>
          Premium Brands to<br/>
          APAC's <em className="gb-hero__emphasis">Closed-Loop</em><br/>Networks.
        </h1>
        <div className="gb-hero__cta-wrap">
          <a href="#contact" className="gb-hero__cta">
            <span className="gb-hero__cta-label">Initiate Partnership</span>
            <span className="gb-hero__cta-arrow">→</span>
          </a>
        </div>
      </div>
    </section>
  );
};
window.Hero = Hero;