// Hero — full-bleed sky photo, big title, marquee
function Hero() {
  return (
    <section className="vm-hero" id="accueil" data-screen-label="01 Accueil">
      <div className="vm-hero-inner">
        <div className="vm-hero-content">
          <h1 className="vm-h1">
            <span className="vm-h1-l1">VINCENT</span>
            <span className="vm-h1-l2">MORIN</span>
          </h1>
        </div>
      </div>

      {/* floating polaroid — masqué sur mobile */}
      <div className="vm-hero-poloroid" aria-hidden="true">
        <div className="vm-tape"></div>
        <img src="assets/moi.jpg" alt="" />
        <p>A la recherche d'une nouvelle expérience !</p>
      </div>

      {/* <div className="vm-hero-sub">
        <p className="vm-hero-role">
          <strong>Développeur web</strong> & étudiant en BUT MMI à l'IUT de Blois.
          Front, back, WordPress — je conçois des sites pensés pour leurs utilisateurs,
          quelque part entre une ligne de commande et un sentier de randonnée.
        </p>
      </div> */}

      <div className="vm-scroll-cue">
        <span>DESCENDRE LE SENTIER</span>
        <span className="arrow"></span>
      </div>

      {/* marquee — le stack défile comme une frise de carnet */}
      <div className="vm-hero-mq" aria-hidden="true">
        <div className="vm-hero-mq-track">
          <span>DÉVELOPPEUR FULL-STACK <span className="sep">·</span> CRÉATEUR <span className="sep">·</span> AVENTURIER <span className="sep">·</span> REACT <span className="sep">·</span> SYMFONY <span className="sep">·</span> GSAP <span className="sep">·</span> C# / .NET <span className="sep">·</span> WORDPRESS <span className="sep">·</span></span>
          <span>DÉVELOPPEUR FULL-STACK <span className="sep">·</span> CRÉATEUR <span className="sep">·</span> AVENTURIER <span className="sep">·</span> REACT <span className="sep">·</span> SYMFONY <span className="sep">·</span> GSAP <span className="sep">·</span> C# / .NET <span className="sep">·</span> WORDPRESS <span className="sep">·</span></span>
        </div>
      </div>

    </section>
  );
}
window.Hero = Hero;
