@media(min-width:901px) and (prefers-reduced-motion:no-preference){
  .hero-scroll-scene{position:relative}
  .hero-scroll-scene>.hero{position:sticky;top:var(--hero-pin-top,0px)}
  .hero.has-logo-scroll{--hero-scroll:0;--hero-copy-opacity:1}
  .hero.has-logo-scroll>:is(.hero-top,.hero-content,.hero-bottom){opacity:var(--hero-copy-opacity)}
  .hero-logo-shade{
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    background:#020403;
    opacity:calc(var(--hero-scroll)*.92);
    mask-image:linear-gradient(#fff,#fff),url("assets/hero-beauty-mask.svg?v=beauty-mask-vector-2");
    mask-size:100% 100%,var(--hero-logo-size);
    mask-position:center;
    mask-repeat:no-repeat;
    -webkit-mask-composite:xor;
    mask-composite:exclude;
  }
}
