/* Andance OS · tokens: brand-tokens.json (colors, fonts, web group) */
:root{--bg:#0B0D0F;--bg2:#0F1113;--card:#171A1D;--line:#2A2F34;--tx:#EEF0EE;--mut:#C3CACE;--acc:#00D2FF;--acc2:#60DFFF;--warn:#FF7A6B;--on:#0B0D0F;
--r-card:14px;--r-btn:10px;--r-tag:6px;--glow:0 0 12px #00D2FF;--fs-h1:34px;--fs-card:18px;--fs-body:17px;--fs-sm:15px;--fs-mono:13px;--mono:'JetBrains Mono',monospace}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:400 var(--fs-body)/1.65 'Be Vietnam Pro',sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}.wrap{max-width:1120px;margin:auto;padding:0 24px}.narrow{max-width:760px}
.nav{position:sticky;top:0;z-index:9;background:rgba(11,13,15,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:60px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px;white-space:nowrap}.logo.sm{font-size:15px}
.dot{width:11px;height:11px;border-radius:50%;background:var(--acc);box-shadow:var(--glow);flex:none;animation:breathe 2s ease-in-out infinite}
@keyframes breathe{50%{box-shadow:0 0 4px #00D2FF}}
nav{display:flex;gap:22px;margin-left:auto;color:var(--mut);font-size:var(--fs-sm)}nav a:hover{color:var(--acc)}
.btn{display:inline-block;background:var(--acc);color:var(--on);font-weight:700;padding:13px 22px;border-radius:var(--r-btn);transition:.2s;text-align:center}
.btn:hover{background:var(--acc2);transform:translateY(-2px);box-shadow:0 0 24px rgba(0,210,255,.35)}.btn.sm{padding:8px 14px;font-size:var(--fs-sm)}
.btn.ghost{background:none;color:var(--tx);border:1px solid var(--line)}.btn.ghost:hover{border-color:var(--acc);box-shadow:none}.btn.wide{display:block;margin:20px 0 10px}
section{padding:88px 0}.alt{background:var(--bg2)}
.kicker{font:600 var(--fs-mono) var(--mono);color:var(--acc);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
h1{font-size:clamp(34px,4.6vw,54px);line-height:1.12;font-weight:800;letter-spacing:-.02em}h1 em,h2 em{font-style:normal;color:var(--acc)}
h2{font-size:var(--fs-h1);line-height:1.25;font-weight:800;letter-spacing:-.01em;margin-bottom:10px}
.sub{color:var(--mut);max-width:640px;margin-bottom:36px}.sub.c{margin:0 auto 28px}
.lead{color:var(--mut);font-size:17px;margin:20px 0 26px;max-width:560px}
.hero{padding:72px 0 88px;background:radial-gradient(700px 380px at 82% 18%,rgba(0,210,255,.08),transparent)}
.grid2{display:grid;grid-template-columns:1.1fr 1fr;gap:52px;align-items:center}.grid2>*{min-width:0}
.video-intro{padding-top:0}.intro-video{display:block;width:100%;max-width:1120px;aspect-ratio:16/9;height:auto;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:0 16px 40px rgba(0,0,0,.24);object-fit:cover}
.facts{display:grid;grid-template-columns:repeat(4,auto);gap:10px;justify-content:start;margin-bottom:22px}
.facts div{background:var(--card);border:1px solid var(--line);border-radius:var(--r-btn);padding:9px 13px}
.facts span{display:block;font:var(--fs-mono) var(--mono);color:var(--mut);text-transform:uppercase}.facts b{font-size:var(--fs-sm);white-space:nowrap}
.price-line{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:22px}.price-line s{color:var(--mut);font-size:18px}
.price-line b{font-size:32px;font-weight:800;color:var(--acc)}.price-line span{color:var(--mut);font-size:var(--fs-sm)}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.term{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:18px 22px 20px;font:13.5px/2 var(--mono);box-shadow:0 20px 60px rgba(0,0,0,.4)}
.tbar{display:flex;gap:6px;align-items:center;margin-bottom:10px}.tbar i{width:10px;height:10px;border-radius:50%;background:var(--line)}.tbar span{margin-left:auto;color:var(--mut);font-size:var(--fs-mono)}
.cmd{color:var(--tx)}.cmd::after{content:'▋';color:var(--acc);margin-left:4px;animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
.ok{color:var(--mut)}.ok b{color:var(--acc);font-weight:600}.out{color:var(--acc)}
.term.on .ok,.term.on .out{animation:in .4s both}.term.on .ok:nth-of-type(2){animation-delay:.3s}.term.on .ok:nth-of-type(3){animation-delay:.6s}.term.on .ok:nth-of-type(4){animation-delay:.9s}.term.on .ok:nth-of-type(5){animation-delay:1.2s}.term.on .out{animation-delay:1.5s}
@keyframes in{from{opacity:0;transform:translateX(-6px)}}
.cards{display:grid;gap:18px}.two{grid-template-columns:1fr 1fr}.three{grid-template-columns:repeat(3,1fr)}.four{grid-template-columns:repeat(4,1fr)}.five{grid-template-columns:repeat(5,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:24px;transition:.25s;min-width:0}.card:hover{border-color:rgba(0,210,255,.6)}
.card h3{font-size:var(--fs-card);font-weight:700;margin:8px 0 6px;line-height:1.4}.card p,.card li{color:var(--mut)}
.warn{border-left:3px solid var(--warn)}
.tag{display:inline-block;font:600 var(--fs-mono) var(--mono);color:var(--acc);border:1px solid var(--acc);border-radius:var(--r-tag);padding:1px 8px}
.ic{font-size:22px;color:var(--acc)}
.fit{border-top:3px solid var(--acc)}.nofit{border-top:3px solid var(--warn)}.fit ul,.nofit ul{margin:12px 0 0 18px;display:grid;gap:10px}
.yes{color:var(--acc)}.no{color:var(--warn)}
.weeks{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.wk{font:600 var(--fs-mono) var(--mono);color:var(--on);background:var(--acc);display:inline-block;padding:2px 9px;border-radius:var(--r-tag);letter-spacing:.06em}
.week h3{font-size:19px;margin-top:12px}.out-txt{font-size:var(--fs-sm);border-left:2px solid var(--acc);padding-left:10px;margin:8px 0 14px}
.week ol{margin-left:20px;display:grid;gap:8px}.week li::marker{color:var(--acc);font-family:var(--mono);font-size:var(--fs-sm)}
.cost{margin-top:18px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.cost h3{margin:0}
.center{align-items:center}
.price{max-width:560px;margin:0 auto;border-color:var(--acc);box-shadow:0 0 40px rgba(0,210,255,.08);padding:30px}.price h3{font-size:19px;margin-top:14px}
.amt{font-size:42px;font-weight:800;color:var(--tx)!important;margin:6px 0}.amt s{font-size:20px;color:var(--mut);font-weight:500;margin-right:6px}.amt small{font-size:15px;color:var(--mut);font-weight:500}
.pnote{font-size:var(--fs-sm)}.pnote.small{font-size:var(--fs-mono);text-align:center}
.price ul{margin:16px 0 16px 18px;display:grid;gap:6px}.price li::marker{color:var(--acc)}
details{border-bottom:1px solid var(--line);padding:18px 0}summary{cursor:pointer;font-weight:700;font-size:16px;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::after{content:'+';color:var(--acc);font-family:var(--mono)}details[open] summary::after{content:'−'}details p{color:var(--mut);margin-top:10px}
.end{text-align:center;background:radial-gradient(600px 300px at 50% 100%,rgba(0,210,255,.12),transparent)}.end h2{font-size:clamp(26px,3.4vw,38px)}
.site-footer{background:linear-gradient(180deg,rgba(15,17,19,.8) 0%,#080a0c 100%);border-top:1px solid var(--line);padding:56px 0 0;position:relative}
.site-footer::before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:.6}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:48px;padding-bottom:40px}
.brand-col .logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:19px;color:var(--tx);text-decoration:none;margin-bottom:14px}
.logo-img{width:30px;height:30px;border-radius:8px}
.brand-desc{color:var(--mut);font-size:14px;line-height:1.6;margin-bottom:20px;max-width:440px}
.brand-contact{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.contact-chip{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:8px 14px;color:var(--tx);font-size:13.5px;text-decoration:none;transition:all .2s}
.contact-chip:hover{border-color:var(--acc);background:rgba(0,210,255,.08);color:var(--acc);transform:translateY(-1px)}
.contact-chip svg{width:15px;height:15px;color:var(--acc);flex-shrink:0}
.contact-chip.hotline{font-weight:700;color:var(--acc)}
.social-strip{display:flex;align-items:center;gap:10px}
.social-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--mut);text-decoration:none;transition:all .2s}
.social-btn:hover{background:var(--acc);border-color:var(--acc);color:#0B0D0F;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,210,255,.3)}
.social-btn svg{width:16px;height:16px}
.col-heading{font-size:13.5px;font-weight:700;color:var(--tx);text-transform:uppercase;letter-spacing:.06em;margin-bottom:18px;display:flex;align-items:center;gap:8px}
.col-heading::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:var(--glow)}
.nav-list{list-style:none;display:grid;gap:11px}
.nav-list a{color:var(--mut);text-decoration:none;font-size:14px;display:inline-flex;align-items:center;gap:6px;transition:all .2s}
.nav-list a:hover{color:var(--acc);transform:translateX(4px)}
.nav-list a svg{width:12px;height:12px;opacity:0;transform:translateX(-4px);transition:all .2s}
.nav-list a:hover svg{opacity:1;transform:translateX(0)}
.locations-section{border-top:1px solid rgba(255,255,255,.06);padding:28px 0;margin-top:8px}
.loc-title{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:6px}
.loc-title svg{width:14px;height:14px;color:var(--acc)}
.locations-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.loc-card{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:14px 16px;transition:all .2s}
.loc-card:hover{background:rgba(255,255,255,.04);border-color:rgba(0,210,255,.3)}
.loc-label{font-size:12px;font-weight:700;color:var(--acc);margin-bottom:4px;text-transform:uppercase;letter-spacing:.04em}
.loc-text{font-size:13px;color:var(--mut);line-height:1.5}
.footer-bottom{border-top:1px solid var(--line);padding:20px 0;font-size:13px;color:var(--mut);background:#07090b}
.bottom-wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.license-text{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.badge-dkkd{background:rgba(0,210,255,.08);border:1px solid rgba(0,210,255,.2);color:var(--acc);padding:2px 8px;border-radius:4px;font-size:11.5px;font-weight:600}
.bottom-links{display:flex;align-items:center;gap:16px}
.bottom-links a{color:var(--mut);text-decoration:none;transition:color .2s}
.bottom-links a:hover{color:var(--acc)}
@media(max-width:900px){.footer-top{grid-template-columns:1fr;gap:36px}.locations-grid{grid-template-columns:1fr;gap:12px}}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}.reveal.on{opacity:1;transform:none}
@media(max-width:1000px){.five{grid-template-columns:repeat(3,1fr)}.four{grid-template-columns:1fr 1fr}.facts{grid-template-columns:1fr 1fr}}
@media(max-width:760px){nav{display:none}.nav .btn.sm{margin-left:auto}
.grid2,.two,.three,.four,.weeks{grid-template-columns:1fr}.five{grid-template-columns:1fr}.grid2{gap:36px}
section{padding:60px 0}.hero{padding:44px 0 60px}h2{font-size:24px}.lead{font-size:15px}.cta .btn{flex:1 1 100%}.facts b{white-space:normal}
.term{font-size:13px;padding:14px 16px}.amt{font-size:34px}.price{padding:22px}}
@media(max-width:380px){.logo{font-size:16px}.nav .btn.sm{padding:7px 10px}}
/* 3 đợt giá */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.tier{display:flex;flex-direction:column;padding:26px}.tier ul{margin:14px 0 20px 18px;display:grid;gap:8px;flex:1;align-content:start}.tier li::marker{color:var(--line)}
.tier-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tag.mute{color:var(--mut);border-color:var(--line)}
.badge{font:600 var(--fs-mono) var(--mono);color:var(--mut);border:1px solid var(--line);border-radius:999px;padding:2px 10px;white-space:nowrap}
.badge.on{background:var(--acc);color:var(--on);border-color:var(--acc);box-shadow:var(--glow)}
.tier h3{font-size:19px;margin-top:14px}.tier .amt{font-size:32px;letter-spacing:-.01em;white-space:nowrap}
.when{font:var(--fs-sm) var(--mono);color:var(--mut)!important}
.tier.active{border:1.5px solid var(--acc);box-shadow:0 0 40px rgba(0,210,255,.12);background:linear-gradient(180deg,rgba(0,210,255,.06),var(--card) 40%)}
.tier.active .amt{color:var(--acc)!important}.tier.active li::marker{color:var(--acc)}
.tier:not(.active) .amt{color:var(--tx)!important}
.why{font-size:var(--fs-sm);list-style:none;margin-left:-18px;border-left:2px solid var(--line);padding-left:10px}
.got{list-style:none;margin-left:-18px;color:var(--acc)!important;font-weight:600}
.btn.disabled{background:none;border:1px solid var(--line);color:var(--mut);cursor:default}.btn.disabled:hover{transform:none;box-shadow:none}
.tier .btn.wide{margin:0}
.incl{margin-top:18px}.incl ul{margin:10px 0 12px 18px;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px}.incl li::marker{color:var(--acc)}
.live{font:600 var(--fs-mono) var(--mono);background:var(--acc);color:var(--on);border-radius:999px;padding:3px 10px;align-self:center;box-shadow:var(--glow)}
@media(max-width:960px){.tiers{grid-template-columns:1fr;max-width:560px;margin:0 auto}.incl{max-width:560px;margin:18px auto 0}.incl ul{grid-template-columns:1fr}}
.price-line .live{color:var(--on);font-size:var(--fs-mono)}
.facts{display:flex;flex-wrap:wrap;max-width:560px}.facts div{flex:0 1 auto}.facts b{white-space:normal}
/* 2 buổi + gói luồng */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step h3{font-size:17px;margin-top:12px}
.docs{margin-top:18px}.docs ul{margin:10px 0 0 18px;display:grid;gap:6px}.docs li{color:var(--mut)}.docs li::marker{color:var(--acc)}
.pk-explain{max-width:none;margin-bottom:18px}.pk-explain p{margin-top:10px}
.pkgs{display:grid;gap:8px;margin:14px 0 4px}
.pkg{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);padding:10px 14px}
.pkg span{font:600 var(--fs-mono) var(--mono);color:var(--mut);text-transform:uppercase;white-space:nowrap}
.pkg b{font-size:20px;font-weight:800;white-space:nowrap}
.tier.active .pkg.main{border-color:var(--acc)}.tier.active .pkg.main b{color:var(--acc)}
.btn.wide2{display:block;margin-top:10px;padding:10px;font-size:var(--fs-sm)}
.tier .when{margin-top:2px}
@media(max-width:1000px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.steps{grid-template-columns:1fr}}
/* pre-order: mẫu đội, sơ đồ, form */
.tpl .card{display:flex;flex-direction:column}.tpl h3{font-size:20px}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 14px}
.flow span{font:600 11.5px var(--mono);color:var(--tx);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-tag);padding:3px 8px;white-space:nowrap}
.flow i{font-style:normal;color:var(--acc);font-family:var(--mono);font-size:13px}
.ev{margin-top:auto;padding-top:14px;font-size:var(--fs-sm);color:var(--mut)}
.diagram{margin-top:18px;padding:28px}
.dg{display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap}
.node{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-card);padding:12px 18px;font-weight:700;text-align:center;font-size:var(--fs-card);min-width:150px}
.node small{display:block;font:var(--fs-mono) var(--mono);color:var(--mut);font-weight:400;margin-top:2px}
.node.nlead{border-color:var(--acc);box-shadow:0 0 18px rgba(0,210,255,.15)}.node.check{border-color:var(--acc2)}.node.nopt{border-style:dashed;color:var(--mut)}
.group{display:grid;gap:8px;position:relative;padding:12px;border:1px dashed var(--line);border-radius:var(--r-card)}.group .gl{font:var(--fs-mono) var(--mono);color:var(--mut);text-align:center}
.ar{font-style:normal;color:var(--acc);font:700 22px var(--mono)}
.loop{margin-top:18px;text-align:center;color:var(--mut);font-size:var(--fs-sm);border-top:1px dashed var(--line);padding-top:14px}
.pk2{font-size:var(--fs-sm);margin:2px 0 4px}.tier .amt{margin:8px 0 2px}.tier.active .amt{color:var(--acc)!important}
.c2{margin-top:18px;text-align:center}
.form-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px 24px 12px;box-shadow:0 20px 45px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.05);overflow:hidden}
.form-card::before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,#00D2FF,transparent)}
.iframe-form{width:100%;height:450px;border:none;display:block;filter:invert(.92) hue-rotate(185deg) contrast(1.1);border-radius:12px}
@media(max-width:760px){.form-card{padding:16px 12px 8px}.iframe-form{height:460px}}
.form{display:grid;gap:16px;padding:28px}.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label{display:grid;gap:6px;font-weight:600;font-size:var(--fs-sm)}
.form input[type=text],.form input:not([type]),.form input[type=email],.form input[type=tel]{font:inherit;font-size:var(--fs-body);color:var(--tx);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);padding:12px 14px;outline:none;width:100%}
.form input:focus{border-color:var(--acc)}.form ::placeholder{color:#5f676d}
fieldset{border:0}legend{font-weight:600;font-size:var(--fs-sm);margin-bottom:8px}
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.opts.two{grid-template-columns:1fr 1fr}
.opt{position:relative;cursor:pointer}.opt input{position:absolute;opacity:0}
.opt span{display:block;border:1px solid var(--line);border-radius:var(--r-btn);padding:12px;text-align:center;background:var(--bg);font-weight:700;transition:.2s}
.opt span small{display:block;font:var(--fs-mono) var(--mono);color:var(--mut);font-weight:400;margin-top:2px}
.opt input:checked+span{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset;color:var(--acc)}
.opt input:focus-visible+span{outline:2px solid var(--acc2)}
.form .agree{display:flex;align-items:center;gap:10px;font-weight:400;color:var(--mut)}.agree input{accent-color:var(--acc);width:18px;height:18px;flex:none}
.pay{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px dashed var(--line);border-radius:var(--r-btn);padding:14px;font-size:var(--fs-sm)}.pay b{margin-right:4px}
.form button{border:0;cursor:pointer;font:inherit;font-weight:700}
.confirm{text-align:center;padding:36px;display:grid;gap:12px;justify-items:center}.confirm[hidden],.form[hidden]{display:none}
.okdot{width:56px;height:56px;border-radius:50%;background:var(--acc);color:var(--on);display:grid;place-items:center;font-size:28px;font-weight:800;box-shadow:var(--glow)}
.confirm h3{font-size:20px}.confirm p{color:var(--mut)}
@media(max-width:760px){.row2,.opts{grid-template-columns:1fr}.opts.two{grid-template-columns:1fr 1fr}.dg{flex-direction:column}.ar{transform:rotate(90deg)}.node{min-width:200px}.group{width:100%;max-width:280px}.form{padding:20px}}
.opt span small.phs{color:var(--warn);border:1px dashed var(--warn);border-radius:6px;display:inline-block;padding:0 6px;margin-top:4px}
.tpl .card .tag{align-self:flex-start}
.confirm button{font:inherit;font-weight:700;cursor:pointer}
.lnk{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
/* trang chính sách */
.doc{padding:56px 0 80px}.doc .wrap{max-width:780px}
.draft{display:inline-block;border:1.5px dashed var(--warn);color:var(--warn);background:rgba(255,122,107,.07);border-radius:var(--r-tag);padding:4px 12px;font:600 var(--fs-mono) var(--mono);letter-spacing:.06em;margin-bottom:18px}
.doc h1{font-size:clamp(28px,4vw,40px);margin-bottom:10px}.doc .meta{color:var(--mut);font-size:var(--fs-sm);margin-bottom:28px}
.doc .toc{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:18px 22px;margin-bottom:32px}
.doc .toc ol{margin-left:20px;columns:2;column-gap:28px;color:var(--mut);font-size:var(--fs-sm)}.doc .toc a:hover{color:var(--acc)}
.doc h2{font-size:20px;margin:34px 0 10px;scroll-margin-top:80px}.doc h2 span{font:600 var(--fs-mono) var(--mono);color:var(--acc);margin-right:8px}
.doc p,.doc li{color:var(--mut)}.doc ul{margin:8px 0 0 20px;display:grid;gap:6px}.doc li::marker{color:var(--acc)}.doc b{color:var(--tx)}
@media(max-width:760px){.doc .toc ol{columns:1}}
/* thẻ Tùy chỉnh + ô mô tả */
.tpl.four{grid-template-columns:repeat(4,1fr)}
.custom-tpl{border:1.5px dashed var(--acc)!important;background:linear-gradient(180deg,rgba(0,210,255,.05),var(--card) 50%)}
.custom-tpl .flow span{border-style:dashed;border-color:rgba(0,210,255,.5);color:var(--acc)}
.custom-tpl .ev.lnk{color:var(--acc);font-weight:600}
.opts{grid-template-columns:repeat(4,1fr)}.opt.custom span{border-style:dashed;border-color:rgba(0,210,255,.5)}
.form .mota textarea{font:inherit;font-size:var(--fs-body);color:var(--tx);background:var(--bg);border:1px solid var(--acc);border-radius:var(--r-btn);padding:12px 14px;resize:vertical;min-height:96px;width:100%;outline:none}
.form .mota[hidden]{display:none}.form .mota textarea:focus{box-shadow:0 0 0 2px rgba(0,210,255,.25)}
@media(max-width:1100px){.tpl.four{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.tpl.four{grid-template-columns:1fr}.opts{grid-template-columns:1fr 1fr}}
/* chương trình học + chọn đợt + chi phí */
.ba{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;margin-bottom:22px}
.ba-h,.ba-r{display:grid;grid-template-columns:1fr 1fr}.ba-h span{font:600 var(--fs-mono) var(--mono);text-transform:uppercase;letter-spacing:.06em;padding:12px 18px;color:var(--mut)}
.ba-h span+span{color:var(--acc)}.ba-r{border-top:1px solid var(--line)}.ba-r p{padding:12px 18px;color:var(--mut);font-size:var(--fs-sm)}.ba-r p+p{color:var(--tx);border-left:1px solid var(--line);background:rgba(0,210,255,.03)}
.upd{display:inline-block;font:600 var(--fs-sm) 'Be Vietnam Pro';color:var(--acc);border:1px solid rgba(0,210,255,.4);border-radius:999px;padding:5px 14px;margin-bottom:14px}
.mods{border-top:1px solid var(--line)}.mod summary{align-items:center;justify-content:flex-start}.mod summary::after{margin-left:8px}
.mn{font:600 var(--fs-mono) var(--mono);color:var(--acc);flex:none;width:28px}.mt{flex:1}
.mtag{font:600 11px var(--mono);color:var(--on);background:var(--acc);border-radius:var(--r-tag);padding:1px 8px;white-space:nowrap;flex:none}.mtag.mute{background:none;color:var(--mut);border:1px solid var(--line)}
.mod p{padding-left:28px}.mod .take{color:var(--tx);font-size:var(--fs-sm);border-left:2px solid var(--acc);padding-left:12px;margin-left:28px}
.early{margin-bottom:22px;padding:28px;border:1.5px solid var(--acc);background:linear-gradient(180deg,rgba(0,210,255,.06),var(--card) 45%)}.early h3{font-size:22px;margin-top:0}
.cmp{overflow-x:auto;margin:18px 0 14px}.cmp table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);min-width:520px}
.cmp th,.cmp td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}.cmp thead th{font:600 var(--fs-mono) var(--mono);text-transform:uppercase;color:var(--mut)}
.cmp tbody th{color:var(--mut);font-weight:500;white-space:nowrap}.cmp td{color:var(--mut)}.cmp .hi{color:var(--tx);background:rgba(0,210,255,.06)}.cmp thead .hi{color:var(--acc)}.cmp .hi b{color:var(--acc)}
.early .close{color:var(--tx)!important;font-weight:700}
.costbox{margin-top:22px;display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;padding:28px}.costbox h3{margin-top:0;font-size:19px}
.costbox .big{font-size:18px;color:var(--tx)!important;margin-top:10px}.costbox .big b{font-size:40px;font-weight:800;color:var(--acc)}
.costbox ul{margin:8px 0 14px 18px;display:grid;gap:6px}.costbox li::marker{color:var(--acc)}.costbox li b{color:var(--tx)}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.vs div{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);padding:10px 14px;font-size:var(--fs-sm);color:var(--mut)}
.vs span{display:block;font:600 var(--fs-mono) var(--mono);text-transform:uppercase;color:var(--acc);margin-bottom:2px}.vs div+div span{color:var(--warn)}
@media(max-width:760px){.ba-r p,.ba-h span{padding:10px 12px}.costbox{grid-template-columns:1fr;padding:22px}.vs{grid-template-columns:1fr}.early{padding:22px}.mod p{padding-left:0}.mod .take{margin-left:0}.mtag{font-size:12px}}
@media(max-width:760px){.cmp{overflow:visible}.cmp table{min-width:0}.cmp thead{display:none}.cmp table,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block}.cmp tr{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden}.cmp tbody th{white-space:normal;color:var(--tx);font-weight:600;padding:10px 12px 6px;border-bottom:0}.cmp td{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:8px 12px;border-bottom:0;border-top:1px solid var(--line)}.cmp td::before{content:attr(data-d);font:600 var(--fs-mono) var(--mono);text-transform:uppercase;color:var(--mut)}.cmp td.hi::before{color:var(--acc)}}
.botvs{margin-top:22px}.botvs h3{margin:6px 0 8px}.botvs>p{color:var(--mut);margin-bottom:14px}.botvs .vs div:first-child span{color:var(--acc)}
.valuebox{margin-bottom:22px}.valuebox h3{margin:6px 0 8px;font-size:20px}.valuebox>p{color:var(--mut);margin-bottom:16px;max-width:760px}.valuebox .vi{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);padding:16px;color:var(--mut);font-size:var(--fs-sm)}.valuebox .vi span{display:block;font:600 var(--fs-mono) var(--mono);text-transform:uppercase;color:var(--mut);margin-bottom:4px}.valuebox .vi b{display:block;color:var(--tx);font-size:var(--fs-card);margin-bottom:6px}.valuebox .vi.hi{border-color:rgba(0,210,255,.45);background:rgba(0,210,255,.05)}.valuebox .vi.hi span{color:var(--acc)}
.appnote{margin-top:18px;color:var(--mut);font-size:var(--fs-sm);text-align:center;max-width:820px;margin-left:auto;margin-right:auto}.appnote b{color:var(--tx);font-weight:600}
.app{display:grid;grid-template-columns:300px minmax(0,1fr);background:#FAFAFA;color:#1A1B22;border-radius:22px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45);border:1px solid #E6E7EB;height:680px;font-size:15px}
.app aside{background:#F4F4F5;border-right:1px solid #E6E7EB;display:flex;flex-direction:column;padding:14px 12px;min-height:0}
.app .top{display:flex;align-items:center;gap:8px;margin-bottom:10px}.app .dots{display:flex;gap:7px;margin-right:auto;padding-left:4px}.app .dots i{width:12px;height:12px;border-radius:50%;background:#D9D9DC}
.app .rb{width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.08);display:grid;place-items:center;font-size:18px;color:#333}
.app .pins{display:flex;justify-content:space-around;padding:6px 0 14px}
.app .pin{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;cursor:pointer;font:inherit;color:#1A1B22;font-size:13px;position:relative;padding:8px 10px;border-radius:14px}
.app .pin.on{background:#E7E7EA}.app .pin .star{position:absolute;top:40px;left:calc(50% + 12px);width:18px;height:18px;border-radius:50%;background:#F59E0B;color:#fff;font-size:10px;font-style:normal;display:grid;place-items:center;border:2px solid #F4F4F5}
.app .list{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin}
.app .gh{display:flex;align-items:center;justify-content:space-between;background:#E9E9EC;border-radius:10px;padding:6px 12px;color:#6B6E76;font-size:13px;margin:8px 0 4px}.app .gh i{font-style:normal}
.app .list .it{display:flex;gap:12px;align-items:center;width:100%;text-align:left;background:none;border:0;border-radius:12px;padding:8px 10px;cursor:pointer;font:inherit;color:inherit;transition:background .15s}
.app .list .it:hover,.app .pin:hover{background:#EBEBEE}.app .list .it.on{background:#E2E2E6}
.app .tx{display:flex;flex-direction:column;min-width:0}.app .tx b{font-weight:600;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app .tx small{color:#70737C;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app .foot{display:flex;align-items:center;gap:10px;padding-top:10px}.app .foot>i{width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-style:normal;font-size:13px;color:#555;box-shadow:0 1px 3px rgba(0,0,0,.08)}.app .conn{flex:1;background:#fff;border-radius:999px;padding:8px 14px;text-align:center;font-size:14px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.av{flex:none;width:38px;height:38px;position:relative;display:block;border-radius:52% 48% 46% 54%/56% 50% 50% 44%}.av.s2{border-radius:44% 56% 50% 50%/40% 46% 54% 60%}.av.s3{border-radius:50%/42%}.av.s4{border-radius:58% 42% 52% 48%/50% 58% 42% 50%}
.av b::before,.av b::after{content:"";position:absolute;top:30%;width:11%;height:26%;border-radius:4px;background:#fff;transform:rotate(-14deg)}.av b::before{left:36%}.av b::after{left:56%}
.av.lg{width:60px;height:56px}.av.sm{width:28px;height:28px}.av.xs{width:22px;height:22px;position:absolute;border:2px solid #F4F4F5}
.gav{flex:none;width:40px;height:40px;position:relative;display:block}.gav .av:nth-child(1){left:0;top:2px}.gav .av:nth-child(2){right:0;top:0}.gav .av:nth-child(3){left:9px;bottom:0}
.bc1{background:#EF4444}.bc2{background:#FB923C}.bc3{background:#8B5CF6}.bc4{background:#4F46E5}.bc5{background:#84CC16}.bc6{background:#14B8A6}.bc7{background:#EC4899}.bc8{background:#A3A3A3}
.app .main{display:flex;min-width:0;min-height:0}.app .pane{display:flex;flex-direction:column;flex:1;min-width:0}.app .pane[hidden]{display:none}
.app .ph-h{display:flex;align-items:center;gap:10px;padding:12px 20px;border-bottom:1px solid #ECEDF0;background:#fff}.app .ph-h>.av{width:26px;height:26px}.app .ph-h .gav{transform:scale(.75)}.app .ph-h .tt{font-weight:600}.app .ph-h em{margin-left:auto;font-style:normal;font-size:12px;color:#8A8D96;border:1px solid #E3E4E8;border-radius:999px;padding:2px 10px}
.app .flowc{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px}
.app .msg{display:flex;gap:10px;max-width:80%}.app .msg small{display:block;font-size:12px;color:#8A8D96;margin:0 0 3px 2px}.app .msg p{background:#F0F1F3;border-radius:16px;padding:11px 15px;line-height:1.55;color:#1A1B22;margin:0}.app .msg p b{font-weight:600}
.app .msg.me{align-self:flex-end}.app .msg.me p{background:#111216;color:#fff}.app .sys{align-self:center;font-size:13px;color:#8A8D96}
.app .acts{display:flex;gap:8px;margin-top:8px}.app .acts span{border:1px solid #D9DBE0;border-radius:999px;padding:6px 14px;font-size:13px;background:#fff;color:#1A1B22}.app .acts .pri{background:#111216;color:#fff;border-color:#111216}
.app .go{display:inline-block;margin-top:8px;color:#00A3FF;font-weight:600;font-size:14px}
.app .comp{margin:0 20px 18px;border:1px solid #E3E4E8;background:#fff;border-radius:16px;padding:12px 16px;color:#9A9DA5;font-size:14px;display:flex;align-items:center}.app .comp i{margin-left:auto;width:28px;height:28px;border-radius:50%;background:#111216}
@media(max-width:760px){.app{grid-template-columns:minmax(0,1fr);height:auto;border-radius:18px}.app aside{border-right:0;border-bottom:1px solid #E6E7EB;padding:10px;flex-direction:row;overflow-x:auto;gap:4px;scrollbar-width:none}.app .top,.app .foot,.app .gh,.app .tx small{display:none}.app .pins{padding:0;gap:4px;flex:none}.app .pin{padding:6px 8px;font-size:12px;white-space:nowrap}.app .pin .av.lg{width:38px;height:36px}.app .pin .star{top:30px;width:15px;height:15px;font-size:8px}.app .list{display:flex;overflow:visible;flex:none}.app .grp{display:contents}.app .list .it{flex-direction:column;gap:6px;width:auto;padding:6px 8px;flex:none}.app .tx b{font-size:12px;font-weight:500;max-width:84px;text-align:center}.app .flowc{max-height:none;padding:16px}.app .msg{max-width:92%}.app .comp{margin:0 16px 14px}}
.combo{margin-top:14px;padding:12px 16px;border-radius:var(--r-btn);background:rgba(0,210,255,.06);border:1px solid rgba(0,210,255,.3);color:var(--mut);font-size:var(--fs-sm)}.combo b{color:var(--acc);font-weight:600}
.costbox .combo{margin-bottom:10px}
.appwrap{display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:end}.appwrap .app{grid-column:1/3;grid-row:1;margin-right:150px}
.phone{grid-column:2;grid-row:1;position:relative;z-index:2;width:270px;margin-bottom:-46px;background:#111;border-radius:44px;padding:9px;box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 0 2px #2a2a2a inset;color:#1A1B22}
.phone .scr{background:#FAFAFA;border-radius:36px;overflow:hidden;height:540px;position:relative;font-size:13px}
.phone .sb{display:flex;align-items:center;justify-content:space-between;padding:12px 22px 4px;font-size:12px}.phone .sb b{font-weight:600}.phone .notch{width:84px;height:24px;border-radius:14px;background:#111}.phone .sb i{width:22px;height:10px;border-radius:3px;border:1.5px solid #333;position:relative}.phone .sb i::after{content:"";position:absolute;inset:1px 6px 1px 1px;background:#333;border-radius:1px}
.phone .ptop{display:flex;justify-content:space-between;padding:6px 16px}.phone .ptop i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12)}.phone .ptop .me{background:#E5E5E8;font-size:12px}.phone .ptop .pl{font-size:18px}
.phone .ppins{display:flex;justify-content:center;gap:26px;padding:4px 0 10px}.phone .ppins>div{display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;font-size:12px;color:#55585F}.phone .ppins .av.lg{width:58px;height:54px}.phone .ppins .star{position:absolute;top:38px;right:2px;width:17px;height:17px;border-radius:50%;background:#F59E0B;color:#fff;font-size:9px;font-style:normal;display:grid;place-items:center;border:2px solid #FAFAFA}
.phone .pg{padding:8px 16px 2px;color:#8A8D96;font-size:12.5px}.phone .pg i{font-style:normal}
.phone .prow{display:flex;gap:10px;align-items:center;padding:7px 16px}.phone .prow>.av{width:36px;height:36px}.phone .prow .gav{width:36px;height:36px}.phone .prow .av.xs{width:20px;height:20px;border-color:#FAFAFA}
.phone .tx{min-width:0;flex:1}.phone .tx b{display:flex;justify-content:space-between;font-weight:600;font-size:13.5px}.phone .tx b em{font-style:normal;font-weight:400;font-size:11px;color:#9A9DA5}.phone .tx small{display:block;color:#70737C;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phone .pbot{position:absolute;left:12px;right:12px;bottom:14px;display:flex;gap:8px}.phone .pbot i{width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;font-style:normal;box-shadow:0 2px 8px rgba(0,0,0,.12)}.phone .pbot span{flex:1;background:#fff;border-radius:999px;display:flex;align-items:center;padding:0 14px;color:#9A9DA5;box-shadow:0 2px 8px rgba(0,0,0,.12)}
@media(max-width:1000px){.appwrap{grid-template-columns:minmax(0,1fr)}.appwrap .app{grid-column:1;margin-right:0}.phone{grid-column:1;grid-row:2;justify-self:center;margin:28px 0 0}}
@media(max-width:760px){.phone{width:240px}.phone .scr{height:480px}}
.phone .tx b{gap:6px}.phone .tx b span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phone .tx b em{flex:none}
@media(min-width:1001px){.appwrap .app .flowc{padding-right:150px}.appwrap .app .comp{margin-right:150px}.appwrap+.appnote{margin-top:72px}}
.pwg{margin-bottom:18px}.pw .pi{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(0,210,255,.1);color:var(--acc);border:1px solid rgba(0,210,255,.3)}.pw .pi svg{width:22px;height:22px}.pw h3{margin:14px 0 6px}.pw p{color:var(--mut)}
.tools .tgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px 28px;margin-top:6px}.tools .tg>span{display:block;font:600 var(--fs-mono) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin-bottom:8px}.tools .tg div{display:flex;flex-wrap:wrap;gap:8px}.tools .tg i{font-style:normal;font-size:var(--fs-sm);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--tx)}.tools .tg:last-child i{border-style:dashed;border-color:rgba(0,210,255,.45)}
.tnote{margin-top:16px;color:var(--mut);font-size:13px;border-top:1px dashed var(--line);padding-top:12px}
@media(max-width:760px){.tools .tgs{grid-template-columns:1fr}}
.intg{background:linear-gradient(180deg,#15181B,#111316);border:1px solid var(--line);border-radius:22px;padding:28px;margin-top:4px}
.ihead{display:flex;align-items:center;gap:20px;margin-bottom:22px}.ihead .kicker{margin-bottom:6px}.ihead h3{font-size:22px;line-height:1.3}
.hub{position:relative;width:72px;height:72px;display:grid;place-items:center;flex:none}.hub .av.lg{width:60px;height:56px}.hub .ring{position:absolute;inset:-6px;border-radius:50%;border:1.5px dashed rgba(0,210,255,.5);animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.hub .ring{animation:none}}
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.bx{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px}.bx.w2{grid-column:span 2}
.bx h4{font-size:var(--fs-card);font-weight:700;margin-bottom:4px}.bx>p{color:var(--mut);font-size:var(--fs-sm);margin-bottom:16px}
.lts{display:flex;flex-wrap:wrap;gap:14px 12px}.lt{width:64px;display:flex;flex-direction:column;align-items:center;gap:6px}.lt span{font-size:12px;color:var(--mut);text-align:center;line-height:1.2}
.lgo{width:52px;height:52px;border-radius:14px;background:#fff;display:grid;place-items:center;position:relative;box-shadow:0 6px 16px rgba(0,0,0,.35);transition:transform .2s}.lt:hover .lgo{transform:translateY(-3px)}
.lgo::before{content:"";width:26px;height:26px;background:var(--c);-webkit-mask:var(--u) center/contain no-repeat;mask:var(--u) center/contain no-repeat}
.lgo.mine{background:transparent;border:1.5px dashed var(--acc);color:var(--acc);font:700 14px var(--mono);box-shadow:none}.lgo.mine::before{display:none}
.bx.vibe{border-color:rgba(0,210,255,.45);background:linear-gradient(180deg,rgba(0,210,255,.07),rgba(0,210,255,.02))}.bx.vibe h4{color:var(--acc)}
.anyweb{display:flex;gap:14px;align-items:center;margin-top:14px;padding:16px 20px;border-radius:16px;border:1px dashed rgba(0,210,255,.4)}.anyweb svg{width:28px;height:28px;color:var(--acc);flex:none}.anyweb p{color:var(--mut);font-size:var(--fs-sm)}.anyweb b{color:var(--tx);font-weight:600}
@media(max-width:900px){.bento{grid-template-columns:minmax(0,1fr)}.bx.w2{grid-column:auto}}
@media(max-width:760px){.intg{padding:18px}.ihead{gap:14px}.ihead h3{font-size:18px}.lt{width:56px}.lgo{width:46px;height:46px}.lgo::before{width:22px;height:22px}}
.ankit{margin-top:28px}.akh{max-width:760px;margin-bottom:18px}.akh .kicker{margin-bottom:8px}.akh h3{font-size:22px;line-height:1.3;margin-bottom:6px}.akh p{color:var(--mut);font-size:var(--fs-sm)}
.apg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.apc{display:flex;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;transition:transform .2s,border-color .2s}.apc:hover{transform:translateY(-3px);border-color:rgba(0,210,255,.4)}
.api{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.25)}.api svg{width:24px;height:24px}
.api.g1{background:linear-gradient(135deg,#FF6B6B,#E5383B)}.api.g2{background:linear-gradient(135deg,#4F8CFF,#2557D6)}.api.g3{background:linear-gradient(135deg,#34D399,#059669)}.api.g4{background:linear-gradient(135deg,#FBBF24,#D97706)}.api.g5{background:linear-gradient(135deg,#A78BFA,#7C3AED)}.api.g6{background:linear-gradient(135deg,#F472B6,#DB2777)}.api.g7{background:linear-gradient(135deg,#22D3EE,#0891B2)}.api.g8{background:linear-gradient(135deg,#38BDF8,#0284C7);color:#fff}
.apc h4{font-size:15.5px;font-weight:700;margin-bottom:4px}.apc p{color:var(--mut);font-size:13.5px;line-height:1.5}.apc em{display:inline-block;margin-top:8px;font-style:normal;font:600 11px var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--acc);background:rgba(0,210,255,.08);border:1px solid rgba(0,210,255,.25);border-radius:999px;padding:2px 8px}
@media(max-width:1100px){.apg{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.apg{grid-template-columns:minmax(0,1fr)}.akh h3{font-size:18px}}
.logo-img{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(0,210,255,.35))}
.hero-vis{position:relative;display:flex;flex-direction:column;align-items:center}.hero-bot{width:min(300px,70%);height:auto;margin-bottom:-36px;position:relative;z-index:2;filter:drop-shadow(0 12px 24px rgba(0,0,0,.45));transition:transform .3s ease}.hero-bot:hover{transform:translateY(-4px)}.hero-vis .term{width:100%}
@media(prefers-reduced-motion:reduce){.hero-bot{animation:none}}
.hub img{width:62px;height:62px;object-fit:contain;position:relative;z-index:1}
@media(max-width:760px){.hero-bot{width:200px;margin-bottom:-24px}}
.nav .btn.sm{white-space:nowrap}@media(max-width:420px){.logo{font-size:15px;gap:7px}.logo-img{width:28px;height:28px}.nav .btn.sm{padding:7px 11px;font-size:13px}}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.form-error{color:var(--warn);margin:1rem 0}.payment{margin-top:1.5rem}.pay-qr{display:block;width:min(280px,100%);margin:1rem auto;border-radius:12px}.copy{border:0;background:transparent;color:inherit;text-decoration:underline;cursor:pointer;font:inherit}
.checks{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px;margin:26px 0 28px;padding:0}
.checks li{display:flex;align-items:flex-start;gap:12px;opacity:0;transform:translateY(8px);animation:ckIn .5s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.15s + var(--i)*.09s)}
.checks span{display:flex;flex-direction:column;line-height:1.35}.checks b{font-weight:700;color:var(--tx)}.checks em{font-style:normal;font:600 11.5px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin-top:3px}
.ck{flex:none;position:relative;width:24px;height:24px;border-radius:50%;background:var(--acc);display:grid;place-items:center;margin-top:1px;box-shadow:0 0 10px rgba(0,210,255,.4);animation:ckPop .45s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(.2s + var(--i)*.09s)}
.ck svg{width:15px;height:15px;fill:none;stroke:#0B0D0F;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22;animation:ckDraw .4s ease-out forwards;animation-delay:calc(.45s + var(--i)*.09s)}
@keyframes ckIn{to{opacity:1;transform:none}}@keyframes ckPop{from{transform:scale(0)}to{transform:scale(1)}}@keyframes ckDraw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.checks li,.ck,.ck svg{animation:none;opacity:1;transform:none;stroke-dashoffset:0}}
@media(max-width:600px){.checks{grid-template-columns:minmax(0,1fr);gap:12px}}

.bx.w3{grid-column:span 3}@media(max-width:900px){.bx.w3{grid-column:auto}}

/* Nút mạng xã hội nổi + thanh Menu/CTA đáy trên điện thoại */
.soc-float{position:fixed;right:18px;bottom:24px;z-index:40;display:flex;flex-direction:column;gap:10px}
.soc-float a{width:48px;height:48px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 2px rgba(0,210,255,.35);transition:transform .2s}
.soc-float a:hover{transform:translateY(-2px) scale(1.05)}
.soc-float svg{width:26px;height:26px}
.mbar,.msheet{display:none}
@media(max-width:760px){
.nav .btn.sm:not(.ghost){display:none}
body{padding-bottom:92px}
.soc-float{right:14px;bottom:96px}
.mbar{display:flex;gap:8px;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:45;width:calc(100% - 28px);max-width:420px;padding:7px;border-radius:999px;background:rgba(23,26,29,.92);backdrop-filter:blur(12px);border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.5)}
.mbar-menu{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);color:var(--tx);font:700 16px 'Be Vietnam Pro',sans-serif;cursor:pointer}
.mbar-menu svg{width:20px;height:20px}
.mbar-cta{flex:1;display:grid;place-items:center;padding:12px 16px;border-radius:999px;background:var(--acc);color:var(--on);font-weight:800;font-size:16px;box-shadow:0 0 20px rgba(0,210,255,.35)}
.msheet:not([hidden]){display:block;position:fixed;inset:0;z-index:44}
.msheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.msheet-box{position:absolute;left:14px;right:14px;bottom:calc(86px + env(safe-area-inset-bottom));display:flex;flex-direction:column;padding:8px;border-radius:20px;background:var(--card);border:1px solid var(--line);box-shadow:0 14px 40px rgba(0,0,0,.6)}
.msheet-box a{padding:14px 16px;border-radius:12px;font-weight:600;font-size:17px;color:var(--tx)}
.msheet-box a:active,.msheet-box a:hover{background:var(--bg2);color:var(--acc)}
}
.soc-ms{position:relative}
.soc-bubble{position:absolute;right:calc(100% + 12px);top:50%;transform:translate(8px,-50%) scale(.92);transform-origin:right center;white-space:nowrap;background:#fff;color:#0B0D0F;font:700 14px 'Be Vietnam Pro',sans-serif;padding:9px 14px;border-radius:16px 16px 4px 16px;box-shadow:0 8px 22px rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .35s,transform .35s cubic-bezier(.2,.9,.3,1.3)}
.soc-bubble.on{opacity:1;transform:translate(0,-50%) scale(1);pointer-events:auto}
.soc-bubble::after{content:"";position:absolute;right:-6px;top:50%;margin-top:-6px;border:6px solid transparent;border-left-color:#fff;border-right:0}
@media(prefers-reduced-motion:reduce){.soc-bubble{transition:opacity .2s}}

.btn:not(.ghost):not(.disabled),.mbar-cta{position:relative;isolation:isolate;box-shadow:0 0 16px rgba(0,210,255,.3)}

/* Mascot Otter Character styling */
.mascot-img{display:block;height:auto;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.4));transition:transform .25s ease}
.mascot-img:hover{transform:translateY(-4px)}
.botvs-flex{display:flex;gap:24px;align-items:center}
.botvs-main{flex:1;min-width:0}
.botvs-mascot{flex:none;width:150px;text-align:center}
.botvs-mascot img{width:100%;height:auto}
@media(max-width:760px){.botvs-flex{flex-direction:column-reverse;align-items:center}.botvs-mascot{width:130px;margin-bottom:12px}}
.commit-vis{position:relative;display:flex;flex-direction:column;align-items:center;width:100%}
.commit-mascot{position:absolute;top:-45px;right:15px;width:120px;height:auto;z-index:3;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45));transition:transform .25s ease}
.commit-mascot:hover{transform:translateY(-4px)}
@media(max-width:760px){.commit-mascot{position:static;width:110px;margin-bottom:-15px}}
.valuebox-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.valuebox-mascot{flex:none;width:125px}
.valuebox-mascot img{width:100%;height:auto}
@media(max-width:760px){.valuebox-head{flex-direction:column-reverse}.valuebox-mascot{width:95px;margin:0 auto 10px}}
.end-box{display:flex;align-items:center;justify-content:center;gap:36px}
.end-mascot{flex:none;width:150px}
.end-mascot img{width:100%;height:auto}
@media(max-width:760px){.end-box{flex-direction:column;gap:18px}.end-mascot{width:120px}}
.steps-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
.steps-mascot{flex:none;width:110px}
@media(max-width:760px){.steps-mascot{display:none}}
.app-header-mascot{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px}
.app-mascot{flex:none;width:115px}
@media(max-width:760px){.app-mascot{display:none}}