/* Modal top layer keeps every navigation badge behind the entrance. */
.brand-intro { position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; border:0; overflow:hidden; background:radial-gradient(ellipse at center,#101f61 0%,#000c3c 64%); color:white; opacity:1; transition:opacity .6s ease; }
.brand-intro::backdrop { background:#000000d9; }
.brand-intro canvas { position:absolute; inset:0; pointer-events:none; }
.brand-intro-glow { position:absolute; left:50%; top:50%; width:18vmin; height:18vmin; border-radius:50%; background:#0091d2; filter:blur(40px); opacity:0; transform:translate(-50%,-50%); pointer-events:none; }
.brand-intro-lockup { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; opacity:0; transform:scale(.72); filter:blur(12px); transition:opacity .65s ease,transform 1.1s cubic-bezier(.16,1,.3,1),filter .8s ease; pointer-events:none; }
.brand-intro-lockup img { width:min(620px,75vw); height:auto; object-fit:contain; }
.brand-intro-lockup > span { display:none; }
.brand-intro.is-revealed .brand-intro-lockup { opacity:1; transform:scale(1); filter:blur(0); transition-delay:0s; }
.brand-intro.is-revealed .brand-intro-glow { animation:intro-glow 1.2s ease-out both; }
.brand-intro.is-leaving { opacity:0; }
.brand-intro-skip { position:absolute; right:32px; top:28px; display:flex; align-items:center; gap:18px; min-height:44px; padding:8px 20px; border:1px solid #ffffff55; border-radius:30px; background:#000c3c; color:white; font-size:13px; }
.brand-intro-skip span { font-size:22px; font-weight:300; }
.brand-intro-skip:hover { background:#0091d2; }
@keyframes intro-glow { 0% { opacity:0; transform:translate(-50%,-50%) scale(.3); } 18% { opacity:.65; } 100% { opacity:0; transform:translate(-50%,-50%) scale(5); } }
@media(max-width:600px) { .brand-intro-skip { right:16px; top:16px; } .brand-intro-lockup img { width:86vw; } }