.brand-opening{position:fixed;inset:0;z-index:100;overflow:hidden;cursor:pointer;animation:opening-failsafe 2.4s step-end forwards}
.opening-shutter{position:absolute;inset:0;width:100%;height:100%;stroke:none}
.opening-aperture{transform-box:view-box;transform-origin:50% 50%;animation:opening-aperture 2s cubic-bezier(.76,0,.24,1) both}
.opening-stage{position:absolute;left:50%;top:50%;width:72px;height:96px;transform:translate(-50%,-50%)}
.opening-logo{width:72px;filter:drop-shadow(0 0 18px #ffffff18);animation:opening-logo 2s ease both}
.opening-spark{position:absolute;left:18px;top:22px;width:36px;height:36px;fill:#e7322a;stroke:none;filter:drop-shadow(0 0 12px #e7322a66);animation:opening-spark 2s ease both}
.opening-active .hero-name{animation:opening-home-logo 2s ease both}
@keyframes opening-spark{0%{opacity:0;transform:scale(.45) rotate(-35deg)}18%{opacity:1;transform:scale(1) rotate(0)}31%{opacity:1;transform:scale(1.08)}45%,100%{opacity:0;transform:translate(16px,-36px) scale(.45)}}
@keyframes opening-logo{0%,22%{opacity:0;clip-path:inset(100% 0 0);transform:translateY(6px)}47%,64%{opacity:1;clip-path:inset(0);transform:translateY(0)}82%,100%{opacity:0;clip-path:inset(0);transform:scale(1.08)}}
@keyframes opening-aperture{0%,58%{transform:scale(0)}100%{transform:scale(160)}}
@keyframes opening-home-logo{0%,65%{opacity:0}100%{opacity:1}}
@keyframes opening-failsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
@media(prefers-reduced-motion:reduce){.brand-opening{display:none!important}.opening-active .hero-name{animation:none}}