/* The vector logo assembles in its final header position with the first playing frame. */
body .intro{display:none!important}
.entry-header .brand-logo.header-vector{display:block;width:100%;height:auto;aspect-ratio:694/216;background:transparent;mask:none;-webkit-mask:none;overflow:visible}
.header-letter{transform-box:fill-box;transform-origin:center;--letter-x:0px;--letter-y:30px;--letter-r:0deg}
.header-letter:nth-child(1){--letter-x:-55px;--letter-y:18px;--letter-r:-8deg}.header-letter:nth-child(2){--letter-x:-15px;--letter-y:-35px;--letter-r:-3deg}.header-letter:nth-child(3){--letter-y:40px;--letter-r:4deg}.header-letter:nth-child(4){--letter-x:18px;--letter-y:-30px;--letter-r:4deg}.header-letter:nth-child(5){--letter-x:60px;--letter-y:18px;--letter-r:8deg}
.logo-pending .header-letter{opacity:0}
.logo-assembling .header-letter{animation:header-letter-settle .95s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--letter-i)*60ms)}
.logo-settled .header-letter{opacity:1;transform:none}
@keyframes header-letter-settle{from{opacity:0;transform:translate(var(--letter-x),var(--letter-y)) rotate(var(--letter-r))}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.header-letter{opacity:1!important;animation:none!important;transform:none!important}}
body.motion-off .header-letter{opacity:1!important;transform:none!important}

/* Video and live text share a clock. No text is baked into the product footage. */
body .hero-sticky::after{display:none}
body .hero-visual{clip-path:none!important}
body .hero-visual #hero-image{transform:none!important;transition:opacity .3s ease}
.hero-film-video{position:absolute;inset:auto;left:50%;top:50%;width:auto;height:auto;max-width:100%;max-height:100%;transform:translate(-50%,-50%);object-fit:contain;opacity:0;pointer-events:none;filter:saturate(.2) brightness(1.12);mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}
.hero.film-enabled .hero-film-video{opacity:1}
.hero.film-enabled #hero-image{opacity:0}
.hero.film-static .hero-film-video{opacity:0}
.hero.film-static #hero-image{opacity:1}
body .hero.film-enabled .hero-copy .line-mask>span{animation:none;transform:translateY(20px);opacity:0;transition:opacity .9s ease,transform 1.1s cubic-bezier(.22,1,.36,1)}
body .hero.film-enabled .hero-copy .line-mask.is-visible>span{transform:none;opacity:1}
body .hero.film-reset .hero-copy .line-mask>span{transition:none}
.hero-film-control{position:absolute;z-index:5;right:6%;bottom:6%;display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 0;border:0;border-bottom:1px solid transparent;background:transparent;color:var(--muted);font:400 12px/1.3 var(--sans);cursor:pointer}
.hero-film-control:hover{border-bottom-color:currentColor;color:var(--ink)}
.hero-film-control[hidden]{display:none}
.hero-film-control>span:first-child{font-size:16px;width:18px;text-align:center}
@media(max-width:760px){.hero-film-control{right:8%;bottom:3%}.hero-film-video{object-fit:contain}}
@media(prefers-reduced-motion:reduce){body .intro{display:none}body .hero.film-enabled .hero-copy .line-mask>span{transition:none}}
body.motion-off .hero.film-enabled .hero-copy .line-mask>span{transition:none}