html.intro-loading body>header,html.intro-loading body>main,html.intro-loading body>footer{visibility:hidden}
.fstr-loader{position:fixed;inset:0;z-index:100;background:var(--bg);pointer-events:none}
.fstr-loader .typing-orbit{position:absolute;left:50%;top:44%;width:80px;height:80px;transform:translate(-50%,-50%)}
.fstr-loader .typing-orbit span{position:absolute;left:36px;top:36px;width:8px;height:8px;transform:translateX(-18px)}
.fstr-loader .typing-orbit span:nth-child(2){transform:translateX(0)}
.fstr-loader .typing-orbit span:nth-child(3){transform:translateX(18px)}
.fstr-loader .typing-orbit i{display:block;width:8px;height:8px;border-radius:50%;background:#d4ff4b;animation:fstr-typing 580ms cubic-bezier(.4,0,.2,1) 1 both}
.fstr-loader .typing-orbit span:nth-child(2) i{animation-delay:95ms}
.fstr-loader .typing-orbit span:nth-child(3) i{animation-delay:190ms}
@keyframes fstr-typing{0%,100%{opacity:.4;transform:translateY(0) scale(.86)}35%{opacity:1;transform:translateY(-4px) scale(1)}}
.fstr-loader.awaiting-fonts .typing-orbit span:first-child{opacity:.5!important;transform:none!important;animation:font-wait 800ms ease-in-out infinite alternate}
@keyframes font-wait{to{opacity:1}}
.intro-piece{animation:intro-piece 650ms cubic-bezier(.16,1,.3,1) both;animation-delay:var(--intro-delay,0ms)}
.intro-piece:is(h1,h2){animation-name:intro-title;animation-duration:720ms}
@keyframes intro-piece{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes intro-title{from{opacity:0;transform:translateY(8%)}to{opacity:1;transform:none}}
.platform-logo{display:block;width:34px;height:34px;margin-bottom:20px}
.direction:not(.direction-ae) .platform-logo{transition:filter 220ms ease}
.direction:not(.direction-ae):hover .platform-logo,.direction:not(.direction-ae):focus-visible .platform-logo{filter:brightness(0)}
.direction-ae:hover .platform-logo,.direction-ae:focus-visible .platform-logo{content:url('/brand/aftereffects-hover.svg')}
html.font-fallback body .header-identity .brand{font-family:Arial,sans-serif}html.font-fallback body{font-family:Arial,sans-serif}html.font-fallback .hero h1,html.font-fallback .product-intro h1,html.font-fallback .effects h1{font-family:'Arial Narrow',Arial,sans-serif}
@media(prefers-reduced-motion:reduce){.fstr-loader .typing-orbit i{animation:none}.intro-piece{animation:none}}
