/* A brief nod to the APEXIQ device boot sequence; the page stays usable. */
.brand-intro{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:var(--paper,#faf9f6);pointer-events:none;animation:brand-intro-out 3s ease both}
.brand-intro-mark{width:min(68vw,470px);perspective:900px}
.brand-intro-mark>svg{display:block;width:100%;height:auto;max-height:145px;overflow:hidden;transform-origin:center;backface-visibility:hidden;mix-blend-mode:multiply;animation:brand-intro-turn 1.875s cubic-bezier(.22,.65,.25,1) both}
.brand-intro-lsp .brand-intro-mark{width:min(62vw,350px)}
.brand-intro-mark::after{content:"";display:block;height:2px;width:18%;margin:28px 0 0;background:var(--red,#dc101b);animation:brand-intro-sweep .675s 1.8s ease-in-out both}
.brand-intro-apexiq .brand-intro-mark::after{background:#1498ff}
@keyframes brand-intro-turn{0%{opacity:0;transform:rotateY(-87deg)}12%{opacity:1}100%{opacity:1;transform:rotateY(0)}}
@keyframes brand-intro-sweep{0%{opacity:0;transform:translateX(0)}15%,75%{opacity:1}100%{opacity:0;transform:translateX(455%)}}
@keyframes brand-intro-out{0%,82%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){.brand-intro{display:none;animation:none}.brand-intro-mark>svg,.brand-intro-mark::after{animation:none}}
