/* Motion X Academy: supplied blue assets, warm process cards, black foundations. */
html { color-scheme: dark; }
html:has(dialog[open]) { overflow:hidden; }
.group\/player:focus-within [aria-label="Fullscreen"] { opacity:1 !important; }
@media(pointer:coarse) { [aria-label="Fullscreen"] { opacity:1 !important; } }
@media(hover:none) { .mx-hover-panel { grid-template-rows:1fr !important; } .mx-hover-panel > * { visibility:visible !important; } }
body { font-family: Figtree, 'Noto Sans Bengali', system-ui, sans-serif; }
h1,h2,h3 { text-wrap: balance; }
a,button,input,select,textarea { touch-action: manipulation; }
svg { flex-shrink: 0; }
.mx-header-gradient { isolation: isolate; }
.mx-header-gradient::before,.mx-footer-gradient::before { content:""; position:absolute; inset:0; pointer-events:none; z-index:-1; }
.mx-header-gradient::before { background:linear-gradient(to bottom,rgba(0,0,0,.32),rgba(0,0,0,.50) 35%,#000 95%),url('../images/bg/header-user.webp') center top/cover no-repeat; }
.mx-footer-gradient { isolation:isolate; }
.mx-footer-gradient::before { z-index:0; background:linear-gradient(to bottom,#000,rgba(0,0,0,.65) 30%,rgba(0,0,0,.22)),url('../images/bg/footer-user.webp') center bottom/cover no-repeat; }
.mx-footer-gradient > * { position:relative; z-index:1; }
.mx-footer-gradient > .pointer-events-none { position:absolute; }

.mx-ribbon { opacity:1 !important; }
.mx-ribbon use { stroke:#e8e9ff !important; }
.mx-ribbon text { fill:#292cbc !important; }
.mx-shell { width:min(1216px,calc(100% - 48px)); margin-inline:auto; }
.mx-section { padding-block:96px; }
.mx-eyebrow { margin:0 0 16px; color:var(--color-accent-text); font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.mx-section h2,.mx-continue h2 { font-size:clamp(32px,4vw,54px); font-weight:650; line-height:1.06; letter-spacing:-.035em; margin:0 0 24px; }
.mx-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:32px; }
.mx-section-heading p:not(.mx-eyebrow),.mx-preview-grid > div > p:not(.mx-eyebrow) { color:var(--color-ink-2); line-height:1.75; max-width:410px; }
.mx-comparison { border-top:1px solid var(--color-rule-soft); }
.mx-comparison-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border:1px solid var(--color-rule); border-radius:20px; overflow:hidden; }
.mx-plan { padding:32px; background:var(--color-surface); display:flex; flex-direction:column; }
.mx-plan + .mx-plan { border-left:1px solid var(--color-rule); }
.mx-plan-featured { background:#101022; box-shadow:inset 0 3px var(--color-accent); }
.mx-plan-number { color:var(--color-muted); font-size:10px; letter-spacing:.14em; margin-bottom:28px; }
.mx-plan h3 { font-size:25px; font-weight:600; letter-spacing:-.02em; line-height:1.2; margin-bottom:12px; }
.mx-plan > p { font-size:14px; line-height:1.6; min-height:44px; color:var(--color-muted); }
.mx-price { font-size:32px; font-weight:600; letter-spacing:-.03em; margin:26px 0 24px; font-variant-numeric:tabular-nums; }
.mx-price small { font-size:12px; color:var(--color-muted); letter-spacing:0; }
.mx-plan dl { margin-bottom:28px; flex:1; }
.mx-plan dl div { display:grid; grid-template-columns:76px 1fr; gap:12px; padding:12px 0; border-top:1px solid var(--color-rule-soft); font-size:12px; line-height:1.6; }
.mx-plan dt { color:var(--color-muted); }
.mx-plan dd { color:var(--color-ink-2); }
.mx-button { display:inline-flex; justify-content:center; align-items:center; gap:18px; border:1px solid transparent; border-radius:10px; padding:13px 17px; background:var(--color-accent); color:#fff; font-size:13px; font-weight:600; transition:background .2s,transform .25s; }
.mx-button:hover { background:var(--color-accent-hover); transform:translateY(-2px); }
.mx-button-secondary { background:transparent; border-color:var(--color-rule); color:var(--color-ink); }
.mx-button-secondary:hover { background:var(--color-surface-hover); }
.mx-footnote,.mx-muted { font-size:12px; color:var(--color-muted); line-height:1.7; }
.mx-footnote { margin-top:24px; max-width:800px; }
.mx-footnote a,.mx-checkout-help a { color:var(--color-accent-text); text-decoration:underline; text-underline-offset:3px; }
.mx-preview-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:80px; align-items:center; }
.mx-preview-grid .mx-button { margin-top:24px; }
.mx-text-link { display:block; width:fit-content; margin-top:20px; color:var(--color-accent-text); font-size:13px; font-weight:600; }
.mx-text-link:hover { text-decoration:underline; text-underline-offset:4px; }
.mx-preview-art { position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--color-rule); aspect-ratio:16/10; width:100%; background:var(--color-surface); }
.mx-preview-art img { width:100%; height:100%; object-fit:cover; opacity:.65; transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .6s; }
.mx-preview-art:hover img { transform:scale(1.025); opacity:.85; }
.mx-preview-art .mx-play { position:absolute; inset:auto; top:50%; left:50%; margin:0; width:68px; height:68px; background:var(--color-accent); color:var(--color-accent-ink); border:1px solid var(--color-accent-text); border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px var(--color-overlay); font-size:0; line-height:0; transform:translate(-50%,-50%); transition:scale .25s var(--ease-out),background .25s; }
.mx-preview-art .mx-play::before,.mx-preview-art .mx-play::after { content:none; }
.mx-preview-art .mx-play svg { position:static; display:block; width:28px; height:28px; margin:0; transform:translateX(1px); }
.mx-preview-art:hover .mx-play { scale:1.07; background:var(--color-accent-hover); }
.mx-preview-art:focus-visible { outline:2px solid var(--color-focus); outline-offset:5px; }
.mx-preview-art:active .mx-play { scale:.96; }
.mx-preview-play-button { display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;background:var(--color-accent)!important;color:var(--color-accent-ink)!important; }
.mx-preview-play-button svg { width:18px;height:18px;flex:none; }
@media(prefers-reduced-motion:reduce){.mx-preview-art .mx-play{transition:none}.mx-preview-art:hover .mx-play{scale:1}}
.mx-preview-caption { position:absolute; bottom:24px; left:24px; color:white; font-size:11px; letter-spacing:.13em; }
.mx-course-card { position:relative; }
.mx-card-link::after { content:""; position:absolute; inset:0; z-index:5; }
.mx-bookmark { position:absolute; top:12px; right:12px; z-index:10; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#15151de8; color:#c8c9d5; border:1px solid #ffffff26; }
.mx-bookmark svg { width:18px; height:18px; }
.mx-bookmark[aria-pressed="true"] { color:#acaeff; background:#242543; }
.mx-bookmark[aria-pressed="true"] svg { fill:currentColor; }
.mx-continue { margin-block:36px; display:grid; grid-template-columns:1.4fr 1fr; gap:40px; border:1px solid var(--color-rule); border-radius:18px; padding:32px; background:var(--color-surface); }
.mx-continue h2 { font-size:34px; margin-bottom:14px; }
.mx-continue .mx-button { margin-top:24px; }
.mx-next-actions { align-self:center; }
.mx-next-actions a { display:flex; justify-content:space-between; padding:18px 0; border-bottom:1px solid var(--color-rule); font-size:14px; color:var(--color-ink-2); }
.mx-next-actions a:hover { color:var(--color-ink); }
.mx-payment-summary { order:-1; }
.mx-checkout-help { padding:24px; border:1px solid var(--color-rule); border-radius:16px; font-size:13px; line-height:1.7; color:var(--color-ink-2); }
.mx-checkout-help h3 { font-size:16px; font-weight:600; margin-bottom:16px; color:var(--color-ink); }
.mx-checkout-help ol { list-style:decimal; padding-left:18px; margin-bottom:16px; }
.mx-checkout-help p { margin-top:16px; }
.mx-static-note { font-size:12px; color:var(--color-muted); line-height:1.7; padding:12px 0; }
.mx-form-status { color:var(--color-warning); font-size:13px; line-height:1.7; }
.mx-course-readiness,.mx-lesson-note { margin-block:48px; padding:28px; border:1px solid var(--color-rule); border-radius:16px; }
.mx-course-readiness h2,.mx-lesson-note h2 { font-size:24px; margin-bottom:16px; font-weight:600; }
.mx-course-readiness p,.mx-lesson-note p { color:var(--color-ink-2); line-height:1.7; font-size:14px; }
.mx-lesson-note label { display:block; margin-top:24px; font-size:13px; margin-bottom:10px; }
.mx-lesson-note textarea { display:block; width:100%; padding:14px; border-radius:10px; background:var(--color-surface); border:1px solid var(--color-rule); margin-bottom:14px; }
.mx-skip { position:fixed; top:8px; left:8px; transform:translateY(-160%); z-index:99999; background:white; color:#111; padding:12px 20px; border-radius:8px; }
.mx-skip:focus { transform:translateY(0); }
.mx-preview-dialog { color:var(--color-ink); background:#0d0d12; padding:0; border:1px solid #ffffff25; width:min(1000px,calc(100% - 32px)); max-height:calc(100dvh - 32px); border-radius:18px; overscroll-behavior:contain; }
.mx-preview-dialog::backdrop { background:#000c; backdrop-filter:blur(8px); }
.mx-dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 24px; }
.mx-dialog-heading h2 { font-size:18px; font-weight:600; }
.mx-dialog-close { min-width:44px; min-height:44px; border:1px solid var(--color-rule); border-radius:50%; }
.mx-preview-dialog iframe { width:100%; aspect-ratio:16/9; border:0; background:#000; }
.mx-preview-summary { padding:22px 24px; font-size:13px; color:var(--color-ink-2); line-height:1.7; }
.mx-preview-summary a { color:var(--color-accent-text); }
.mx-payment-state { margin-top:20px; border:1px solid var(--color-rule); border-radius:12px; padding:18px; }
.mx-payment-state strong { display:block; color:var(--color-ink); margin-bottom:6px; font-size:16px; }
.mx-status-preview-label { display:block; font-size:12px; margin-top:24px; margin-bottom:8px; }
.mx-status-select { padding:10px 14px; border:1px solid var(--color-rule); border-radius:8px; width:100%; color:var(--color-ink); background:var(--color-surface); }
.mx-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); z-index:9999; background:#232331; border:1px solid #ffffff30; color:white; padding:12px 20px; border-radius:12px; font-size:13px; }
.mx-preview-dialog .mx-button { margin-top:20px; }
.mx-mobile-content { display:none; }
@media(min-width:1024px) { .mx-payment-summary { order:0; } }
@media(max-width:900px) { .mx-plan { padding:24px 18px; } .mx-plan h3 { font-size:21px; } .mx-preview-grid { gap:32px; } }
@media(max-width:700px) {
 .mx-shell { width:calc(100% - 32px); } .mx-section { padding-block:64px; }
 .mx-section-heading { display:block; } .mx-section-heading > p { margin-top:16px; }
 .mx-comparison-grid,.mx-preview-grid,.mx-continue { grid-template-columns:1fr; }
 .mx-plan + .mx-plan { border-left:0; border-top:1px solid var(--color-rule); }
 .mx-plan { padding:28px; } .mx-plan h3 { font-size:27px; } .mx-plan > p { min-height:0; }
 .mx-plan dl div { grid-template-columns:90px 1fr; }
 .mx-preview-grid { gap:32px; } .mx-continue { padding:24px; gap:20px; }
 .mx-preview-caption { font-size:9px; left:16px; bottom:16px; }
 .mx-preview-dialog iframe { aspect-ratio:16/10; } .mx-dialog-heading { padding:12px 16px; }
 .mx-mobile-content { display:block; }
}
@media(prefers-reduced-motion:reduce) { .mx-header-gradient .mx-float,.mx-header-gradient .mx-float-slow { animation:none !important; } .mx-how-it-works .mx-card-tilt,.mx-how-it-works .group:hover .mx-card-tilt { transform:none !important; } .mx-preview-art img,.mx-button { transition:none; } .mx-button:hover { transform:none; } }