/* BMM Traders -> AXT bridge + quiz. Self-contained on purpose: styles.css still carries the old orange BMM brand. */
:root { --bg:#050505; --fg:#fff; --muted:#a1a1aa; --blue:#233dff; --sky:#5cb6f9; --line:rgba(255,255,255,.12); }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--fg); font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; line-height: 1.5; -webkit-font-smoothing: antialiased; }
.stage { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 16px; overflow: hidden; text-align: center; }
.stage::before { content: ""; position: absolute; top: -160px; left: 50%; width: 720px; height: 480px; transform: translateX(-50%); background: rgba(35,61,255,.18); filter: blur(140px); border-radius: 50%; pointer-events: none; }
.wrap { position: relative; width: 100%; max-width: 520px; }
.logo { height: 40px; width: auto; display: block; margin: 0 auto 28px; }
.eyebrow { color: var(--sky); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 12px; }
h1 { font-size: clamp(32px, 8vw, 48px); line-height: 1.08; letter-spacing: -.02em; margin: 0; font-weight: 800; }
h1 span { color: var(--sky); }
.lead { color: var(--muted); font-size: 18px; margin: 16px 0 0; }
.btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0 28px; border-radius: 999px; background: var(--blue); color: #fff; font-weight: 700; font-size: 16px; text-decoration: none; border: 0; cursor: pointer; width: 100%; box-shadow: 0 0 40px rgba(35,61,255,.35); font-family: inherit; }
.btn:hover { opacity: .92; }
.btn:focus-visible, .link:focus-visible, .answer:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; }
.cta { margin-top: 32px; }
.note { color: var(--muted); font-size: 14px; margin: 12px 0 0; }
.links { margin-top: 20px; display: flex; flex-direction: column; align-items: center; }
.link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; color: #8fa2ff; font-size: 15px; font-weight: 600; text-decoration: none; background: none; border: 0; cursor: pointer; font-family: inherit; }
.link:hover { text-decoration: underline; text-underline-offset: 3px; }
.link.quiet { color: var(--muted); font-weight: 500; font-size: 14px; }
.fine { position: relative; color: #8b8b95; font-size: 12px; margin: 32px 0 0; }
/* quiz */
.progress { height: 4px; background: var(--line); border-radius: 4px; overflow: hidden; margin: 24px 0 8px; }
.progress > i { display: block; height: 100%; width: 0; background: var(--blue); transition: width .25s ease; }
.step { color: var(--muted); font-size: 13px; margin: 0 0 20px; }
.card { border: 1px solid var(--line); background: rgba(255,255,255,.02); border-radius: 24px; padding: 24px 16px; text-align: left; }
.card h2 { font-size: 22px; line-height: 1.25; margin: 0 4px 20px; font-weight: 700; }
.answer { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 12px 16px; margin-top: 10px; text-align: left; font: inherit; font-size: 16px; color: var(--fg); background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 14px; cursor: pointer; }
.answer:hover { border-color: rgba(255,255,255,.35); }
.answer.is-selected { border-color: var(--blue); background: rgba(35,61,255,.18); }
.result h2 { font-size: 26px; margin: 4px 4px 8px; }
.result p { color: var(--muted); margin: 0 4px 20px; font-size: 16px; }
.result .eyebrow { margin: 0 4px 8px; }
@media (min-width: 640px) { .card { padding: 32px; } .logo { height: 44px; } }
@media (prefers-reduced-motion: reduce) { .progress > i { transition: none; } }