.herox{--scroll-height:340vh;position:relative}.herox #pin-wrapper{height:var(--scroll-height);position:relative}.herox #hero{background:#000;width:100%;height:100dvh;position:sticky;top:0;overflow:hidden}.herox #bottle-vid{object-fit:contain;z-index:1;width:100%;height:100%;position:absolute;inset:0}.herox .vignette{z-index:2;pointer-events:none;background:radial-gradient(80% 90% at 50% 55%,#0000 40%,#000000b3 100%);position:absolute;inset:0}@media (max-width:768px){.herox{--scroll-height:300vh}}.hero-rise{opacity:0;animation:.7s cubic-bezier(.16,1,.3,1) forwards hero-rise;animation-delay:var(--rise-delay,0s)}@keyframes hero-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.hero-line{transform-origin:0;animation:.8s ease-out .25s both hero-line}@keyframes hero-line{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.hero-scroll-line{background:#ece7db2e;width:1px;height:2rem;display:block;position:relative;overflow:hidden}.hero-scroll-dot{background:#00ba00;border-radius:9999px;width:4px;height:9px;animation:1.9s ease-in-out infinite hero-scroll;position:absolute;top:0;left:-1.5px}@keyframes hero-scroll{0%{opacity:0;transform:translateY(-9px)}25%{opacity:1}70%{opacity:1}to{opacity:0;transform:translateY(2rem)}}@media (prefers-reduced-motion:reduce){.hero-rise{opacity:1;animation:none}.hero-line{animation:none}.hero-scroll-dot{opacity:0;animation:none}}