/* An original, short brand entrance. The supplied mark is isolated in SVG;
   the banner itself remains unchanged. */
.brand-reveal{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#030a1a;overflow:hidden;isolation:isolate;animation:ob-curtain .8s cubic-bezier(.76,0,.24,1) 2.2s both}
.reveal-halo{position:absolute;width:85vmax;height:85vmax;border-radius:50%;background:radial-gradient(ellipse,#0958de40,transparent 60%);animation:ob-halo 2.5s ease both}
.reveal-mark{width:clamp(210px,27vw,410px);aspect-ratio:240/154;animation:ob-mark 2.3s cubic-bezier(.22,1,.36,1) both;position:relative}
.reveal-mark svg{display:block;width:100%;height:100%;overflow:hidden}
.reveal-mark:after{content:'';position:absolute;inset:-15%;background:linear-gradient(110deg,transparent 35%,#9ccaff24 50%,transparent 65%);mix-blend-mode:screen;transform:translateX(-130%);animation:ob-light 1s ease .8s both;pointer-events:none}
.reveal-skip{position:absolute;right:clamp(24px,4vw,64px);bottom:36px;border:1px solid #ffffff35;border-radius:100px;background:transparent;color:#dce8ff;padding:12px 19px;font:12px Arial,sans-serif;cursor:pointer}.reveal-skip span{margin-left:16px}.reveal-skip:focus-visible{outline:2px solid #fff;outline-offset:5px}
.reveal-track{position:absolute;bottom:0;left:0;width:100%;height:2px;background:#428eff;transform-origin:left;animation:ob-progress 2.2s ease-in-out both}
@keyframes ob-mark{0%{opacity:1;transform:translateY(12px) scale(.94);clip-path:inset(0)}35%{opacity:1;transform:translateY(0) scale(1);clip-path:inset(0)}80%{opacity:1;transform:scale(1)}100%{opacity:1;transform:scale(1.035)}}
@keyframes ob-curtain{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0)}}
@keyframes ob-halo{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1.1)}}
@keyframes ob-light{to{transform:translateX(130%)}}
@keyframes ob-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.brand-reveal{display:none}}
