:root{--ba-intro-duration:3800ms}
/* Approved finite brand reveal. Existing page remains interactive. */
.ba-intro-preview{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;pointer-events:none;isolation:isolate;color:var(--white,#f5f3ef)}
.ba-intro-preview[hidden],.ba-intro-replay[hidden]{display:none!important}
.ba-intro-veil{position:absolute;inset:0;z-index:-1;background:#02070a38;animation:ba-intro-veil var(--ba-intro-duration) linear both}
.ba-intro-composition{display:flex;flex-direction:column;align-items:center;max-width:min(92vw,800px);padding:28px;text-align:center;animation:ba-intro-exit var(--ba-intro-duration) linear both}
.ba-intro-brand{display:flex;flex-direction:column;align-items:center;gap:24px;animation:ba-intro-arrive 850ms var(--ease-out,cubic-bezier(.23,1,.32,1)) 100ms both}
.ba-intro-mark{position:relative;width:clamp(164px,20.5vw,260px);aspect-ratio:252/112}
.ba-intro-mark img{display:block;width:100%;height:100%;object-fit:contain}
.ba-intro-reflection{position:absolute;inset:0;overflow:hidden;mask:url('assets/brand/bets-academy-metal-siglas-20261023.webp') center/contain no-repeat;-webkit-mask:url('assets/brand/bets-academy-metal-siglas-20261023.webp') center/contain no-repeat}
.ba-intro-reflection::after{content:'';position:absolute;inset:-30%;background:linear-gradient(115deg,transparent 38%,#fff8 48%,#fff0 59%);opacity:.3;animation:ba-intro-reflect 1400ms var(--ease-in-out,cubic-bezier(.77,0,.175,1)) 430ms both} /* taste-skill-ignore: masked light reflection requested for the metallic logo. */
.ba-intro-name{font-family:var(--font-head,system-ui);font-size:clamp(12px,1.2vw,15px);font-weight:600;line-height:1.4;letter-spacing:.26em;text-indent:.26em;color:#f5f3efbb}
.ba-intro-tagline{margin:36px 0 0;font-family:var(--font-head,system-ui);font-size:clamp(27px,4.8vw,57px);font-weight:600;line-height:1.1;letter-spacing:-.045em}
.ba-intro-tagline span{display:block;animation:ba-intro-arrive 750ms var(--ease-out,cubic-bezier(.23,1,.32,1)) 650ms both}
.ba-intro-tagline em{display:block;margin-top:2px;font-family:var(--font-serif,Georgia);font-size:clamp(54px,8.3vw,98px);font-weight:400;line-height:1.1;letter-spacing:-.035em;color:var(--gold,#c9a84c);animation:ba-intro-arrive 850ms var(--ease-out,cubic-bezier(.23,1,.32,1)) 1000ms both}
.ba-intro-skip,.ba-intro-replay{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:9px 17px;border:1px solid #ffffff24;border-radius:100px;background:#02070ac9;color:#f5f3ef;font:500 12px/1.4 var(--font-sans,system-ui);letter-spacing:.01em;cursor:pointer;pointer-events:auto;transition:background 160ms ease,border-color 160ms ease}
.ba-intro-skip{position:absolute;top:max(20px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right))}
.ba-intro-skip::after{content:'→';font-size:17px;line-height:1}
.ba-intro-replay{position:fixed;z-index:120;top:calc(var(--nav-h,64px) + 12px);right:max(20px,env(safe-area-inset-right))}
.ba-intro-replay svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5}
.ba-intro-skip:focus-visible,.ba-intro-replay:focus-visible{outline:2px solid var(--gold,#c9a84c);outline-offset:4px}
@media(hover:hover) and (pointer:fine){.ba-intro-skip:hover,.ba-intro-replay:hover{background:#10212ded;border-color:#ffffff52}}
@media(max-width:480px){.ba-intro-composition{padding:20px}.ba-intro-brand{gap:20px}.ba-intro-tagline{margin-top:30px}.ba-intro-replay{right:12px;padding-inline:13px}.ba-intro-skip{right:16px;top:max(16px,env(safe-area-inset-top))}}
@keyframes ba-intro-arrive{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ba-intro-reflect{from{transform:translateX(-85%)}to{transform:translateX(85%)}}
@keyframes ba-intro-exit{0%,76%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-8px) scale(1.015)}}
@keyframes ba-intro-veil{0%,76%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.ba-intro-preview{display:none!important}.ba-intro-preview *{animation:none!important}.ba-intro-replay{transition:none}}

/* Reuse the real glass canvas during the opening; no second renderer. */
.ba-intro-running .apple-atmosphere{z-index:9999;animation:ba-intro-veil var(--ba-intro-duration) linear both}

.ba-intro-signature{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:-16px;color:var(--gold,#c9a84c);font:400 17px/1 var(--font-serif,Georgia);animation:ba-intro-arrive 650ms var(--ease-out,cubic-bezier(.23,1,.32,1)) 450ms both}
.ba-intro-signature img{display:block;width:clamp(76px,8vw,105px);height:auto}
