.brand-intro[hidden]{display:none}
.brand-intro{position:fixed;z-index:3000;inset:0;display:grid;place-items:center;background:var(--midnight);color:#fff;opacity:1;transition:opacity .42s ease,visibility .42s ease}
.brand-intro.is-leaving{opacity:0;visibility:hidden}
.brand-intro-content{display:flex;width:min(82vw,430px);flex-direction:column;align-items:center;text-align:center}
.brand-intro-content img{width:100%;height:auto;object-fit:contain;animation:brand-intro-arrive .75s cubic-bezier(.2,.7,.2,1) both}
.brand-intro-content p{margin-top:-12px;color:#d8d1e8;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;animation:brand-intro-copy .55s .18s ease both}
.brand-intro-progress{width:min(180px,55%);height:2px;margin-top:28px;overflow:hidden;background:rgba(255,255,255,.16)}
.brand-intro-progress span{display:block;width:100%;height:100%;background:var(--violet);transform:scaleX(0);transform-origin:left;animation:brand-intro-progress 1.45s .1s linear both}
.brand-intro-skip{position:absolute;top:24px;right:clamp(18px,4vw,56px);padding:10px 0;border:0;background:transparent;color:#d8d1e8;font:600 .75rem/1 var(--sans);cursor:pointer}
.brand-intro-skip:hover,.brand-intro-skip:focus-visible{color:#fff}
.brand-intro-skip:focus-visible{outline:2px solid var(--violet);outline-offset:5px}
body.brand-intro-active{overflow:hidden}
@keyframes brand-intro-arrive{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes brand-intro-copy{from{opacity:0}to{opacity:1}}
@keyframes brand-intro-progress{to{transform:scaleX(1)}}
@media(max-width:560px){.brand-intro-content{width:min(86vw,360px)}.brand-intro-content p{font-size:.62rem;letter-spacing:.12em}.brand-intro-skip{top:18px}}
@media(prefers-reduced-motion:reduce){.brand-intro,.brand-intro-content img,.brand-intro-content p,.brand-intro-progress span{animation:none;transition:none}}