/* Landing intro: volume prompt, then the Think Mubit video full screen. */
#intro { position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;background:#120a06;color:#fff;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,sans-serif;transition:opacity .35s ease; }
#intro.intro-leaving { opacity:0;pointer-events:none; }
#intro [hidden] { display:none !important; }
.intro-gate { display:flex;flex-direction:column;align-items:center;gap:32px;padding:24px;text-align:center; }
.intro-gate h1 { margin:0;font-size:clamp(40px,7vw,104px);font-weight:800;line-height:1;letter-spacing:-.03em;animation:intro-rise .5s ease-out both; }
.intro-speaker { width:clamp(72px,9vw,120px);height:auto;fill:none;stroke:#fff;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;animation:intro-rise .5s ease-out both; }
.intro-speaker .body { fill:#fff; }
.intro-speaker .wave { animation:intro-wave 1.2s ease-in-out infinite; }
.intro-speaker .wave-2 { animation-delay:.2s; }
.intro-button { font:inherit;font-size:clamp(20px,2vw,28px);font-weight:800;letter-spacing:.02em;border-radius:999px;padding:.6em 2.2em;cursor:pointer;border:3px solid #fff;transition:background .15s,color .15s,transform .15s; }
.intro-button:hover { transform:translateY(-2px); }
.intro-button:focus-visible { outline:4px solid #fff;outline-offset:4px; }
.intro-primary { background:#ff4500;color:#fff; }
.intro-primary:hover { background:#fff;color:#ff4500; }
.intro-secondary { background:#fff;color:#ff4500; }
.intro-secondary:hover { background:#ff4500;color:#fff; }
#intro-ok { animation:intro-rise .45s ease-out .55s both,intro-pulse 1.8s ease-out 1.2s infinite; }
#intro-video { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000; }
#intro-skip { position:absolute;top:24px;right:24px;z-index:2;display:flex;align-items:center;gap:8px;font:inherit;font-size:18px;font-weight:700;color:#fff;background:rgba(18,10,6,.6);border:2px solid rgba(255,255,255,.75);border-radius:999px;padding:10px 20px;cursor:pointer;backdrop-filter:blur(6px); }
#intro-skip:hover { background:#fff;color:#120a06; }
#intro-skip svg { width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round; }
#intro-controls { position:absolute;left:50%;bottom:28px;z-index:2;transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:min(640px,calc(100vw - 32px));padding:8px 14px;border-radius:999px;background:rgba(18,10,6,.72);border:2px solid rgba(255,255,255,.35);backdrop-filter:blur(8px);transition:opacity .3s; }
#intro-controls.idle { opacity:0; }
#intro-controls button { flex:none;width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer; }
#intro-controls button:hover { background:rgba(255,255,255,.16); }
#intro-controls button:focus-visible { outline:3px solid #fff;outline-offset:2px; }
#intro-controls svg { width:24px;height:24px;fill:currentColor; }
#intro-play[data-state="playing"] .icon-play,#intro-play[data-state="paused"] .icon-pause,#intro-mute[data-state="on"] .icon-muted,#intro-mute[data-state="muted"] .icon-sound { display:none; }
#intro-seek { flex:1;min-width:0;height:6px;accent-color:#ff4500;cursor:pointer; }
#intro-prank { position:absolute;inset:0;z-index:3;background:#111512;overflow:hidden; }
#intro-prank img { width:100%;height:100%;object-fit:contain;display:block; }
#intro-kidding { position:absolute;inset:0;display:grid;place-items:center;white-space:nowrap;font-size:13vw;font-weight:900;line-height:1;letter-spacing:-.03em;color:#fff;text-shadow:0 .04em .25em rgba(0,0,0,.7);transform:rotate(-24deg);animation:intro-slam .35s cubic-bezier(.2,1.5,.4,1) both; }
@keyframes intro-slam { from { opacity:0;transform:rotate(-24deg) scale(2.6); } to { opacity:1;transform:rotate(-24deg) scale(1); } }
#intro-end { position:absolute;left:0;right:0;bottom:7vh;z-index:2;display:flex;justify-content:center;gap:20px;animation:intro-rise .4s ease-out both; }
@keyframes intro-rise { from { opacity:0;transform:translateY(16px); } to { opacity:1;transform:none; } }
@keyframes intro-wave { 0%,100% { opacity:.25; } 50% { opacity:1; } }
@keyframes intro-pulse { 0% { box-shadow:0 0 0 0 rgba(255,69,0,.55); } 100% { box-shadow:0 0 0 22px rgba(255,69,0,0); } }
@media (prefers-reduced-motion:reduce) { #intro *,#intro { animation:none !important;transition:none !important; } }