.hero{overflow:hidden}
    .hero-fx{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;display:none}
    .hero .wrap{z-index:1}
    .hero-lockup{display:flex;align-items:center;gap:14px;margin-bottom:22px}
    .hero-mark{width:56px;height:56px;flex:none;overflow:visible}
    .hero-mark circle{fill:#fff}
    .hero-word{font-size:15px;letter-spacing:5px;text-transform:uppercase;font-weight:600}
    .hero-skip{position:absolute;right:16px;bottom:16px;z-index:3;background:rgba(0,0,0,.45);color:#fff;border:1px solid rgba(255,255,255,.35);
      font:500 12px/1 Raleway,sans-serif;letter-spacing:2px;text-transform:uppercase;padding:9px 14px;cursor:pointer;display:none}
    .hero.intro .hero-fx,.hero.intro .hero-skip{display:block}
    .hero-replay{position:absolute;right:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:7px;background:rgba(0,0,0,.45);color:#fff;
      border:1px solid rgba(255,255,255,.35);font:500 12px/1 Raleway,sans-serif;letter-spacing:2px;text-transform:uppercase;padding:8px 14px;cursor:pointer;
      opacity:0;animation:hUp .6s ease 2.6s forwards}
    .hero-replay svg{width:15px;height:15px;fill:currentColor}
    .hero-replay:hover,.hero-replay:focus-visible{background:rgba(0,0,0,.7);border-color:#fff}
    .hero.intro .hero-replay{display:none}
    /* staged text: hidden until the insignia lands */
    .hero.intro .hero-mark{opacity:0}
    .hero.intro .hero-word,.hero.intro .eyebrow,.hero.intro .hl,.hero.intro .hero-copy > p,.hero.intro .ctas{opacity:0}
    .hero.land .hero-mark{opacity:1}
    .hero.land .hero-word{animation:hwIn .8s cubic-bezier(.2,.7,.2,1) both}
    .hero.land .eyebrow{animation:hUp .7s cubic-bezier(.2,.7,.2,1) .25s both}
    .hero.land .hl{animation:hBlur .75s cubic-bezier(.2,.7,.2,1) both}
    .hero.land .hl:nth-of-type(1){animation-delay:.45s}.hero.land .hl:nth-of-type(2){animation-delay:.85s}
    .hero.land .hl:nth-of-type(3){animation-delay:1.1s}.hero.land .hl:nth-of-type(4){animation-delay:1.35s}
    .hero.land .hero-copy > p{animation:hUp .8s cubic-bezier(.2,.7,.2,1) 1.7s both}
    .hero.land .ctas{animation:hUp .8s cubic-bezier(.2,.7,.2,1) 1.95s both}
    .hl{display:inline-block}
    @keyframes hwIn{from{opacity:0;letter-spacing:18px;filter:blur(6px)}to{opacity:1;letter-spacing:5px;filter:blur(0)}}
    @keyframes hUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
    @keyframes hBlur{from{opacity:0;transform:translateY(10px) scale(.96);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
    @media (prefers-reduced-motion:reduce){.hero.land *{animation:none!important}}