/* jft.com.vn — bản tối ưu theo hình mẫu uspeak: sáng, mềm, nhiều nhịp; nhân vật Tôi đi Nhật thay ảnh người,
   chữ nhấn đỏ trên vệt hồng, thẻ nổi trắng có biểu tượng tròn, đường bay chấm + mặt trời đỏ, cánh hoa anh đào, sao vàng. */
:root{--navy:#0B1F4E;--navy2:#1B3577;--red:#D7263D;--red2:#B81C31;--pink:#FDE6EA;--blue:#EAF0FA;--sky:#F5F8FD;--sun:#F5B83D;--green:#1E8A55;
--ink:#1A2340;--muted:#5E6782;--line:#E4E8F0;--f:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,sans-serif;--jp:"Noto Sans JP","Hiragino Sans",sans-serif;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--f);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}a{color:inherit}
.jp,ruby{font-family:var(--jp)}rt{font-size:.48em;color:var(--muted)}
.w{max-width:1200px;margin:0 auto;padding-inline:20px}
h1,h2,h3,h4{margin:0;color:var(--navy);line-height:1.22;text-wrap:balance}
h1{font-size:clamp(34px,4.6vw,56px);font-weight:800;letter-spacing:-.025em}
h2{font-size:clamp(28px,3.2vw,40px);font-weight:800;letter-spacing:-.02em}
h3{font-size:clamp(21px,2vw,26px);font-weight:700}
h4{font-size:18px;font-weight:700}
p{margin:0 0 12px}
.lead{font-size:clamp(16.5px,1.4vw,18px);color:var(--muted)}
.mk{color:var(--red);background:linear-gradient(transparent 62%,var(--pink) 62% 92%,transparent 92%);padding:0 .08em;white-space:nowrap}
.tag{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--red);background:var(--pink);padding:6px 14px;border-radius:999px;margin-bottom:14px}
.tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red)}
.tag.sm{font-size:12.5px;padding:4px 12px;color:var(--navy);background:var(--blue)}.tag.sm::before{background:var(--navy)}
.tag.w{background:rgba(255,255,255,.14);color:#fff}.tag.w::before{background:#FF8B9A}
.btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:700;font-size:15.5px;padding:13px 24px;border-radius:999px;border:2px solid transparent;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn.red{background:var(--red);color:#fff;box-shadow:0 8px 20px rgba(215,38,61,.25)}.btn.red:hover{background:var(--red2)}
.btn.navy{background:var(--navy);color:#fff;box-shadow:0 8px 20px rgba(11,31,78,.22)}
.btn.line{border-color:var(--navy);color:var(--navy);background:#fff}
.btn.white{background:#fff;color:var(--navy)}
.btn.sm{padding:9px 18px;font-size:14px}
.head{display:grid;gap:4px;margin-bottom:40px;max-width:760px}.head.c{text-align:center;justify-items:center;margin-inline:auto}
.head.row{max-width:none;grid-template-columns:1fr auto;align-items:end}
section{padding-block:clamp(60px,7vw,96px)}
.dd{position:absolute;pointer-events:none}
.ic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;flex:none}
.ic svg{width:22px;height:22px}
.ic.r{background:var(--pink);color:var(--red)}.ic.b{background:var(--blue);color:var(--navy)}.ic.y{background:#FFF1D6;color:#B07500}.ic.g{background:#E3F4EA;color:var(--green)}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.top .w{display:flex;align-items:center;gap:20px;min-height:76px}
.logo img{height:48px;width:auto}
.top nav{display:flex;gap:2px;margin-left:auto}
.top nav a{text-decoration:none;font-weight:600;font-size:15px;padding:8px 13px;border-radius:999px;white-space:nowrap}
.top nav a:hover{color:var(--red)}.top nav a.on{color:var(--red)}
.hot{display:grid;text-decoration:none;font-size:12px;color:var(--muted);line-height:1.3;padding-left:16px;border-left:1px solid var(--line)}
.hot b{color:var(--navy);font-size:15px}

/* hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 0,#FBFCFF 100%)}
.hero .w{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center;padding-block:clamp(40px,6vw,72px)}
.hero h1{margin:4px 0 18px}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin:26px 0 30px}
.call{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:13px;color:var(--muted)}
.call i{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--pink);color:var(--red)}
.call b{display:block;color:var(--navy);font-size:16.5px}
.mini-proof{display:flex;flex-wrap:wrap;gap:8px 26px;font-size:14px;color:var(--muted)}
.mini-proof b{color:var(--navy);font-size:20px;margin-right:4px}
.hero-art{position:relative;height:520px}
.blob{position:absolute;inset:40px 30px 30px 50px;border-radius:46% 54% 50% 50%/52% 48% 52% 48%;background:radial-gradient(circle at 30% 30%,#F2F6FD,#DFE8F7)}
.nv{display:block;overflow:visible}
.nv.big{position:absolute;left:50%;bottom:22px;width:min(380px,72%);transform:translateX(-46%)}
.plane{width:300px;left:6%;top:10px}.sun{width:52px;right:12%;top:20px}
.petal{width:26px}.p1{left:10%;top:42%;transform:rotate(-20deg)}.p2{right:4%;top:46%;width:20px;transform:rotate(30deg)}.p3{right:18px;bottom:22px}
.star{width:30px;left:20%;bottom:20%}.squig{width:90px;right:8%;bottom:8%;opacity:.8}
.fl{position:absolute;display:flex;gap:12px;align-items:center;background:#fff;border-radius:16px;padding:12px 16px;box-shadow:0 16px 36px rgba(11,31,78,.14);font-size:12.5px;color:var(--muted);z-index:2}
.fl b{display:block;color:var(--navy);font-size:17px}
.f1{left:0;top:36%}.f2{right:0;bottom:16%}
.f3{right:6%;top:24%;padding:9px 14px;gap:10px}.f3 .jp{font-size:16px;color:var(--ink)}.f3 em{font-style:normal;font-weight:700;color:var(--green);font-size:13px}

/* about */
.about .w{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center}
.collage{position:relative;height:440px}
.card{position:absolute;background:#fff;border-radius:18px;box-shadow:0 18px 40px rgba(11,31,78,.12);padding:18px}
.card .t{font-size:12.5px;font-weight:700;color:var(--muted);letter-spacing:.04em;margin-bottom:10px}
.c-lich{left:0;top:10px;width:300px}
.c-lich .r{display:grid;grid-template-columns:70px 1fr auto;gap:8px;align-items:center;font-size:13.5px;padding:8px 0;border-top:1px solid var(--line)}
.c-lich .r b{color:var(--navy)}.c-lich .r span{color:var(--muted)}.c-lich .r i{font-style:normal;font-size:12px;font-weight:700;color:var(--green);background:#E3F4EA;padding:2px 8px;border-radius:999px}.c-lich .r i.few{color:var(--red);background:var(--pink)}
.c-flash{right:20px;top:150px;width:220px;text-align:center}
.c-flash .big{font-size:40px;margin:4px 0 0;color:var(--navy)}.c-flash .m{color:var(--muted);font-size:14px}
.c-flash .b{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.c-flash .b span{font-size:12px;font-weight:600;padding:6px;border-radius:8px;background:var(--sky);color:var(--muted)}.c-flash .b .ok{background:#E3F4EA;color:var(--green)}
.badge{position:absolute;left:30px;bottom:20px;background:var(--navy);color:#fff;border-radius:20px;padding:16px 20px;display:flex;gap:10px;align-items:center;box-shadow:0 18px 40px rgba(11,31,78,.25)}
.badge b{font-size:44px;line-height:1}.badge span{font-size:13px;line-height:1.3;color:#C9D3EA}
.nv.mid{position:absolute;right:-10px;bottom:-10px;width:200px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:26px 0 30px}
.stats>div{display:flex;gap:12px;align-items:flex-start}.stats p{margin:0;font-size:14px;color:var(--muted)}.stats b{display:block;color:var(--navy);font-size:19px}

/* gain */
.gain{background:var(--sky)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-top:64px}
.gain .head+.row{margin-top:0}
.row.rev .art{order:2}
.row h3{margin:4px 0 10px}.row p{color:var(--muted)}
.art{position:relative;background:#fff;border-radius:28px;min-height:320px;display:grid;place-items:center;padding:34px 140px 34px 34px;overflow:hidden;box-shadow:0 1px 0 var(--line)}
.row.rev .art{padding:34px 34px 34px 140px}
.art::before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-80px;bottom:-110px;background:var(--blue)}
.art.t2::before{background:var(--pink);left:-80px;right:auto}.art.t3::before{background:#FFF1D6}
.nv.side{position:absolute;right:6px;bottom:6px;width:170px}.nv.side.r{right:auto;left:6px}
.kgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%;max-width:320px;position:relative}
.kgrid span{background:var(--sky);border-radius:12px;aspect-ratio:1;display:grid;place-items:center;font-size:26px;color:var(--navy)}
.kgrid span.r{background:var(--red);color:#fff}
.chat{display:grid;gap:8px;width:100%;max-width:340px;position:relative;font-size:15px}
.chat .b{margin:0;background:var(--sky);padding:8px 13px;border-radius:16px 16px 16px 4px;max-width:88%}
.chat .b.me{justify-self:end;background:var(--navy);color:#fff;border-radius:16px 16px 4px 16px}.chat .b.me rt{color:#C9D3EA}
.score{width:100%;max-width:330px;position:relative}
.score .t{font-size:13px;font-weight:700;color:var(--muted)}
.bars{display:grid;gap:10px;font-size:13.5px}.bars span{display:grid;grid-template-columns:90px 1fr 38px;gap:10px;align-items:center}
.bars i{height:9px;border-radius:9px;background:var(--line);position:relative;overflow:hidden}.bars i::after{content:"";position:absolute;inset:0;width:var(--w);background:var(--navy);border-radius:9px}
.pass{margin:14px 0 0!important;font-weight:700;color:var(--green)!important}
ul.ok{list-style:none;margin:6px 0 16px;padding:0;display:grid;gap:9px}
ul.ok li{display:flex;gap:10px}
ul.ok li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700;margin-top:1px}
.more{font-weight:700;color:var(--red);text-decoration:none}

/* road */
.path{position:relative;display:grid;grid-template-columns:repeat(3,1fr) 180px;gap:26px;align-items:end}
.track{position:absolute;left:0;right:150px;top:28px;height:60px;width:calc(100% - 150px)}
.stop{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px 24px 22px;box-shadow:0 12px 30px rgba(11,31,78,.06)}
.stop .n{position:absolute;top:-22px;left:24px;width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;box-shadow:0 0 0 6px #fff}
.stop:nth-child(3) .n{background:var(--navy2)}.stop:nth-child(4) .n{background:var(--red)}
.stop .lv{font-size:12.5px;font-weight:700;color:var(--red);letter-spacing:.06em;text-transform:uppercase;margin:10px 0 6px}
.stop h4{margin-bottom:8px}.stop p{font-size:14.5px;color:var(--muted)}
.stop .time{display:inline-block;font-weight:700;color:var(--navy);background:var(--blue);padding:3px 10px;border-radius:999px;font-size:13px}
.stop a{display:block;font-weight:700;color:var(--red);text-decoration:none;font-size:14.5px;margin-top:4px}
.go .nv.end{width:190px}
.tip{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:34px;background:var(--sky);border-radius:20px;padding:16px 22px;font-weight:600;color:var(--navy)}
.tip span:not(.ic){flex:1;min-width:220px}

/* try */
.try{padding-top:20px}
.try-in{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center;background:var(--navy);border-radius:32px;padding:clamp(28px,5vw,56px);color:#C9D3EA;overflow:visible}
.try-in::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.05)}
.try h2{color:#fff;margin-bottom:16px}
.try ol{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:12px}
.try li{display:flex;gap:12px;align-items:center}.try li b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--red);color:#fff;font-size:14px}
.player{position:relative;z-index:1;background:#fff;border-radius:22px;padding:22px 24px;color:var(--ink);text-align:center;box-shadow:0 24px 50px rgba(0,0,0,.25)}
.player .ph{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:16px}.player .ph b{color:var(--navy)}
.player .vi{font-size:20px;font-weight:700;color:var(--red);margin:0}
.player .ja{font-size:34px;color:var(--navy);margin:2px 0;line-height:1.9}
.player .dg{font-size:13.5px;color:var(--muted)}
.player .bar{height:5px;border-radius:9px;background:var(--line);margin:8px auto 14px;max-width:260px;overflow:hidden}.player .bar i{display:block;height:100%;width:60%;background:var(--red)}
.ctl{display:flex;gap:12px;justify-content:center;align-items:center}.ctl span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);color:var(--navy);font-size:20px}
.opt{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:16px}.opt span{font-size:12.5px;font-weight:600;background:var(--sky);color:var(--muted);padding:5px 11px;border-radius:999px}.opt span.on{background:var(--navy);color:#fff}
.nv.try-nv{position:absolute;right:-14px;bottom:-14px;width:160px;z-index:2}

/* courses */
.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:-14px 0 30px}
.tabs span{font-size:14px;font-weight:600;padding:8px 16px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.tabs span.on{background:var(--navy);border-color:var(--navy);color:#fff}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.course{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.course:hover{box-shadow:0 20px 44px rgba(11,31,78,.12);transform:translateY(-3px)}
.cover{position:relative;height:190px;overflow:hidden}
.cover.a1{background:linear-gradient(135deg,#0B1F4E,#1D3A80)}.cover.a2{background:linear-gradient(135deg,#B81C31,#E2475A)}.cover.a3{background:linear-gradient(135deg,#EAF0FA,#DCE6F7)}
.cover .lvl{position:absolute;left:22px;bottom:14px;font-size:64px;font-weight:800;color:#fff;line-height:1;letter-spacing:-.03em}
.cover.a3 .lvl{color:var(--navy)}
.cover .badge2{position:absolute;left:22px;top:18px;font-size:12px;font-weight:700;background:rgba(255,255,255,.18);color:#fff;padding:4px 11px;border-radius:999px}
.cover.a3 .badge2{background:#fff;color:var(--navy)}
.nv.cv-nv{position:absolute;right:6px;bottom:-40px;width:150px}
.cb{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.cb .cat{font-size:12.5px;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.06em;margin:0}
.cb h3{font-size:20px}.cb p{color:var(--muted);font-size:14.5px;margin:0}
.cb .meta{display:flex;gap:6px;align-items:center;font-size:13.5px}
.foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}
.price{font-size:22px;font-weight:800;color:var(--navy)!important}.price span{font-size:13px;font-weight:500;color:var(--muted)}

/* method */
.method{background:var(--sky)}
.four{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.four>div{background:#fff;border-radius:22px;padding:26px 22px}
.four h4{margin:16px 0 8px}.four p{font-size:14.5px;color:var(--muted);margin:0}

/* sched */
.clist{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cls{display:grid;grid-template-columns:auto 1fr;gap:16px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;box-shadow:0 10px 26px rgba(11,31,78,.05)}
.cal{width:70px;border-radius:16px;overflow:hidden;text-align:center;background:var(--sky);padding-bottom:6px;align-self:start}
.cal span{display:block;background:var(--red);color:#fff;font-size:12px;font-weight:700;padding:4px 0}
.cal b{display:block;font-size:30px;color:var(--navy);line-height:1.15;margin-top:4px}.cal small{font-size:11.5px;color:var(--muted)}
.ci .code{font-size:12px;font-weight:700;color:var(--muted);margin:0 0 2px;letter-spacing:.04em}
.ci h4{font-size:16.5px}.ci p{font-size:13.5px;color:var(--muted);margin:2px 0 0}
.seat{position:relative;margin-top:10px!important;padding-top:10px;font-weight:600;color:var(--green)!important}
.seat::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;border-radius:9px;background:var(--line)}
.seat i{position:absolute;left:0;top:0;height:6px;border-radius:9px;background:var(--green)}
.seat.few{color:var(--red)!important}.seat.few i{background:var(--red)}
.cls .btn{grid-column:1/-1;justify-content:center}

/* faq + cta */
.faq-cta .w{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
.faq h2{margin-bottom:22px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0 20px;margin-bottom:10px}
.faq summary{cursor:pointer;list-style:none;padding:16px 30px 16px 0;font-weight:700;color:var(--navy);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:11px;font-size:24px;font-weight:400;color:var(--red)}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--muted);margin:0;padding-bottom:16px}
.cta-box{position:relative;background:var(--navy);border-radius:28px;padding:34px 30px 34px;color:#C9D3EA;overflow:hidden}
.cta-box .sun{top:-18px;right:110px;width:70px;opacity:.95}
.cta-box h3{color:#fff;font-size:26px;margin-bottom:10px;max-width:16ch}
.cta-box p{max-width:30ch}
.cta-box form{display:grid;gap:10px;margin-top:18px;max-width:300px;position:relative;z-index:1}
.cta-box input{font:inherit;padding:12px 16px;border-radius:12px;border:0;font-size:15px}
.cta-box .btn{justify-content:center}
.okm{color:#9BE2B7;font-weight:600;margin:0}
.nv.cta-nv{position:absolute;right:-6px;bottom:-8px;width:170px}

/* footer */
footer{background:var(--navy);color:#B8C2D9;font-size:14.5px}
footer .w{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;padding-block:52px 40px}
footer img{height:46px;width:auto;margin-bottom:12px}
footer b{display:block;color:#fff;margin-bottom:10px}footer a,footer span{display:block;text-decoration:none;padding:3px 0}
.zalo-fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;width:58px;height:58px;border-radius:50%;background:#0068FF;color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px;text-decoration:none;box-shadow:0 10px 24px rgba(0,104,255,.35)}

@media (max-width:1100px){.top nav{display:none}.hot{display:none}}
@media (max-width:960px){
 .hero .w,.about .w,.row,.try-in,.faq-cta .w{grid-template-columns:1fr}
 .hero-art{height:440px}.row.rev .art{order:0}
 .path{grid-template-columns:1fr;gap:34px}.track,.go{display:none}
 .cards,.clist,.four{grid-template-columns:1fr 1fr}
 .collage{height:420px}
}
@media (max-width:640px){
 .cards,.clist,.four,.stats{grid-template-columns:1fr}
 .art,.row.rev .art{padding:26px 26px 150px}.nv.side,.nv.side.r{width:130px;right:10px;left:auto}
 .hero-art{height:380px}.plane{width:200px}.f1{top:auto;bottom:40%}.f3{display:none}.nv.big{width:68%}
 .c-lich{width:260px}.c-flash{width:180px;top:180px;right:0}.nv.mid{width:140px}.badge{left:10px}
 .head.row{grid-template-columns:1fr}.try-nv{display:none}.nv.cta-nv{width:120px}
 .top .btn{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* bỏ nhân vật: khung máy tính, thẻ giấy xác nhận, chữ Nhật lớn làm nền */
.device{position:absolute;left:9%;right:6%;top:70px;background:#fff;border-radius:16px;box-shadow:0 30px 70px rgba(11,31,78,.2),0 0 0 1px rgba(11,31,78,.06);overflow:hidden;z-index:1}
.dv-top{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#F1F4F9;border-bottom:1px solid var(--line)}
.dv-top i{width:9px;height:9px;border-radius:50%;background:#D5DBE6}.dv-top i:first-child{background:#F2A0A9}
.dv-top span{margin-left:10px;font-size:11.5px;color:var(--muted);background:#fff;border-radius:6px;padding:2px 10px}
.dv-bar{display:flex;justify-content:space-between;background:var(--navy);color:#fff;font-size:12px;padding:9px 16px}
.dv-bar span{background:rgba(255,255,255,.15);padding:1px 9px;border-radius:5px;font-variant-numeric:tabular-nums}
.dv-body{padding:16px 18px 20px}
.dv-body .q{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:0 0 4px}.dv-body .q span{border:1px solid var(--line);border-radius:5px;padding:0 8px;color:var(--navy)}
.dv-body .ins{font-size:13px;margin:0 0 10px}
.dv-body .sent{font-size:17px;background:var(--sky);border-left:3px solid var(--red);border-radius:0 8px 8px 0;padding:10px 12px;line-height:1.8;margin:0 0 12px}
.dv-body .sent small{font-size:12px;color:var(--muted)}.dv-body .blank{display:inline-block;width:3.4em;border-bottom:2px solid var(--navy)}
.dv-body .opts{display:grid;grid-template-columns:1fr 1fr;gap:7px;font-size:14px}
.dv-body .opts span{display:flex;gap:7px;align-items:center;border:1.5px solid var(--line);border-radius:8px;padding:7px 9px}
.dv-body .opts i{font-style:normal;font-family:var(--f);font-size:11px;font-weight:700;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:var(--sky);color:var(--navy)}
.dv-body .opts .ok{border-color:var(--green);background:#E8F6EE}.dv-body .opts .ok i{background:var(--green);color:#fff}
.seal{position:absolute;right:2%;top:46px;width:78px;transform:rotate(10deg);z-index:3;filter:drop-shadow(0 8px 14px rgba(215,38,61,.28))}
.f1{left:0;top:auto;bottom:70px}.f2{right:0;bottom:12px}.f3{right:auto;left:4%;top:18px}
.ok-dot{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;font-weight:800}
.plane{left:auto;right:4%;top:auto;bottom:-6px;width:240px;transform:scaleX(-1)}.sun{right:auto;left:2%;top:auto;bottom:150px;width:36px}
.star{left:auto;right:30%;bottom:2%}.squig{display:none}.p1{left:2%;top:40%}.p2{right:1%;top:56%}
.c-cert{right:30px;bottom:6px;width:210px;text-align:center;border:5px double var(--blue)}
.c-cert .h{font-size:32px;font-weight:800;color:var(--red);margin:0;line-height:1.2}.c-cert .m{font-size:12.5px;color:var(--muted);margin:2px 0 8px}.c-cert img{width:36px;margin:0 auto}
.c-flash{top:118px}
.art{padding:34px!important}
.art-k{position:absolute;right:18px;bottom:-30px;font-size:170px;font-weight:700;color:rgba(11,31,78,.05);line-height:1}
.row.rev .art-k{right:auto;left:18px}
.dest{background:var(--navy);color:#C9D3EA;border-radius:22px;padding:22px;display:grid;gap:4px;font-size:13.5px}
.dest b{color:#fff;font-size:20px}.dest .dp{width:110px;height:auto;margin-bottom:6px}
.cv-k{position:absolute;right:16px;top:8px;font-size:84px;font-weight:700;color:rgba(255,255,255,.14);line-height:1.1}
.cover.a3 .cv-k{color:rgba(11,31,78,.08)}
.cv-plane{position:absolute;right:14px;bottom:20px;width:190px}
.cta-seal{position:absolute;right:26px;bottom:26px;width:110px;transform:rotate(-8deg);opacity:.95}
@media (max-width:960px){.go{display:block!important}.dest{max-width:340px}}
@media (max-width:640px){.device{left:0;right:0;top:56px}.dv-body .opts{grid-template-columns:1fr}.seal{width:58px;right:0;top:30px}.f1{bottom:6px}.f2{display:none}.c-cert{width:170px;right:0}.cta-seal{width:70px;right:14px;bottom:14px}}
/* chỉnh bố cục thẻ nổi */
.device{top:56px}
.f1{left:0;bottom:2px}.f2{right:0;bottom:2px}.f3{left:2%;top:10px}
.sun{left:-1%;bottom:auto;top:46%}
.c-lich{left:0;top:0}.c-flash{right:0;top:36px;width:210px}.c-cert{right:70px;left:auto;bottom:0;width:210px}.badge{left:24px;bottom:34px}
.path{align-items:stretch}
.try-in{overflow:hidden}html,body{overflow-x:clip}
@media (max-width:640px){
 .hero-art{height:auto;padding:26px 0 8px}.blob{inset:10px -10px 0}
 .device{position:relative;left:auto;right:auto;top:auto}
 .fl,.plane,.sun,.petal,.star{display:none}.seal{top:4px;right:-4px;width:56px}
 .collage{height:auto;display:grid;gap:14px}
 .card,.badge{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto!important}
 .c-flash{display:none}.badge{justify-self:start}
}

/* ===== phân biệt từng phần + chuyển động (29/10) ===== */
.art-k,.cv-k{display:none}
section{position:relative}
.wave{position:absolute;left:0;top:-69px;width:100%;height:70px;display:block}
.gain{background:#EEF3FB}
.road{background:#fff}
.courses{background:#FFF4F5}
.method{background:#fff}
.sched{background:#EEF3FB}
.gain .art{box-shadow:0 18px 40px rgba(11,31,78,.08)}
.method .four>div{border:1px solid var(--line);box-shadow:0 10px 26px rgba(11,31,78,.05);transition:transform .25s,box-shadow .25s}
.method .four>div:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(11,31,78,.12)}
.method .four>div:nth-child(1){border-top:4px solid var(--red)}.method .four>div:nth-child(2){border-top:4px solid var(--navy)}.method .four>div:nth-child(3){border-top:4px solid var(--green)}.method .four>div:nth-child(4){border-top:4px solid var(--sun)}
/* dải chữ chạy ngang */
.marquee{background:var(--navy);color:#fff;overflow:hidden;padding:16px 0;position:relative;z-index:2}
.marquee.jpq{background:var(--red)}
.mq{display:flex;width:max-content;gap:28px;align-items:center;animation:mq 38s linear infinite;font-weight:700;font-size:17px;white-space:nowrap}
.marquee.jpq .mq{animation-duration:46s;animation-direction:reverse;font-weight:500;font-size:18px}
.mq i{width:9px;height:9px;border-radius:50%;background:var(--red);flex:none}.marquee.jpq .mq i{background:#fff;opacity:.7}
@keyframes mq{to{transform:translateX(-50%)}}
.marquee:hover .mq{animation-play-state:paused}
/* hiện dần khi cuộn */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease var(--d,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
.rv.in{opacity:1;transform:none}
/* hero: thẻ nổi bập bềnh, con dấu đóng xuống, máy bay bay theo đường chấm */
@keyframes bob{50%{transform:translateY(-10px)}}
.f1{animation:bob 5s ease-in-out infinite}.f2{animation:bob 5.6s ease-in-out .8s infinite}
.f3{transform:scale(.6);opacity:0;transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .3s}.f3.pop{transform:none;opacity:1}
@keyframes stamp{0%{transform:rotate(10deg) scale(2.2);opacity:0}60%{transform:rotate(10deg) scale(.92);opacity:1}100%{transform:rotate(10deg) scale(1)}}
.seal{animation:stamp .7s cubic-bezier(.3,1.4,.5,1) .5s both}
@keyframes dash{to{stroke-dashoffset:-110}}
.plane path:first-child{animation:dash 4s linear infinite}
.plane g{animation:fly 7s ease-in-out infinite}
@keyframes fly{0%,100%{transform:translate(176px,22px) rotate(12deg)}50%{transform:translate(186px,15px) rotate(10deg)}}
.sun{animation:bob 6s ease-in-out infinite}
@keyframes drift{50%{transform:translate(10px,14px) rotate(40deg)}}
.petal{animation:drift 7s ease-in-out infinite}.p2{animation-delay:1.5s}.p3{animation-delay:.7s}
.blob{animation:morph 14s ease-in-out infinite}
@keyframes morph{50%{border-radius:54% 46% 44% 56%/46% 56% 44% 54%}}
/* câu hỏi thi chạy thử */
.dv-body .opts span{transition:border-color .2s,background .2s,transform .2s}
.dv-body .opts span.hv{border-color:var(--navy);background:var(--sky);transform:translateX(3px)}
.dv-body .opts span.ok{border-color:var(--green);background:#E8F6EE}.dv-body .opts span.ok i{background:var(--green);color:#fff}
.dv-body .opts span:not(.ok) i{background:var(--sky);color:var(--navy)}
.dv-body .blank{min-width:3.4em;width:auto;text-align:center;color:var(--green);font-weight:700;transition:color .3s}
.dv-body .blank.on{animation:pop .4s ease}
@keyframes pop{0%{transform:scale(.6)}70%{transform:scale(1.12)}}
/* thẻ ôn lật */
.flip{position:relative;height:96px;perspective:600px;cursor:pointer}
.flip .fr,.flip .bk{position:absolute;inset:0;backface-visibility:hidden;transition:transform .6s;display:grid;place-content:center}
.flip .bk{transform:rotateY(180deg)}.flip.on .fr{transform:rotateY(-180deg)}.flip.on .bk{transform:rotateY(0)}
.flip .big{margin:0}.flip .big2{font-size:24px;font-weight:800;color:var(--red);margin:0}.flip .m{margin:0}
/* thanh điểm, chỗ còn lại, đường lộ trình */
.bars i::after{width:0;transition:width 1.2s cubic-bezier(.2,.7,.2,1)}.bars.go i::after{width:var(--w)}
.bars span:nth-child(2) i::after{transition-delay:.15s}.bars span:nth-child(3) i::after{transition-delay:.3s}.bars span:nth-child(4) i::after{transition-delay:.45s}
.seat i{transition:width 1.1s ease .2s}.seat:not(.go) i{width:0!important}
.track path{stroke-dashoffset:0}.track.go path{animation:dash 6s linear infinite}
.stop .n{transition:transform .3s}.stop:hover .n{transform:scale(1.12)}
.stop{transition:transform .25s,box-shadow .25s}.stop:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(11,31,78,.12)}
/* luyện nói: chữ Nhật mờ rồi hiện, thanh chờ chạy */
.player .ja{animation:reveal 6s ease-in-out infinite}
@keyframes reveal{0%,35%{filter:blur(7px);opacity:.25}50%,100%{filter:none;opacity:1}}
.player .bar i{animation:wait 6s linear infinite;width:0}
@keyframes wait{0%{width:0}35%{width:100%}36%,100%{width:0}}
.player .ctl .btn{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(215,38,61,0)}0%,100%{box-shadow:0 0 0 0 rgba(215,38,61,.35)}}
/* khóa học: vệt sáng lướt khi rê chuột */
.cover::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 45%,transparent 60%);transform:translateX(-100%);transition:transform .8s}
.course:hover .cover::after{transform:translateX(100%)}
.cv-plane path{animation:dash 5s linear infinite}
.btn:hover{box-shadow:0 12px 26px rgba(11,31,78,.18)}
.zalo-fab{animation:pulse 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.mq,.f1,.f2,.seal,.plane *,.sun,.petal,.blob,.player .ja,.player .bar i,.player .ctl .btn,.zalo-fab,.track path,.cv-plane path{animation:none!important}.rv{opacity:1;transform:none}.f3{opacity:1;transform:none}}
@media (max-width:640px){.wave{height:40px;top:-39px}.mq{font-size:15px}}
.cta-box .sun{left:auto;right:40px;top:-22px;bottom:auto;width:64px}

/* ======================= TRANG CON (áp giao diện tối ưu cho toàn web, 29/10) ======================= */
.hl{color:var(--red);background:linear-gradient(transparent 62%,var(--pink) 62% 92%,transparent 92%);padding:0 .08em;white-space:nowrap}
[hidden]{display:none!important}
.burger{display:none;margin-left:auto;background:#fff;border:1px solid var(--line);border-radius:12px;width:44px;height:44px;cursor:pointer}
.burger span{display:block;width:20px;height:2px;background:var(--navy);margin:4px auto;border-radius:2px}
.acc{font-weight:700;font-size:14.5px;text-decoration:none;color:var(--navy);white-space:nowrap}
@media (max-width:1100px){
 .top nav.main{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;padding:8px 16px 18px;box-shadow:0 18px 30px rgba(11,31,78,.12)}
 .top nav.main.open{display:flex}.top nav.main a{border-radius:10px;padding:12px 10px;font-size:16px}
 .burger{display:block}.top .acc{margin-left:auto}
}
@media (max-width:640px){.top .acc{display:none}}
/* hero trang con */
.phero{position:relative;overflow:hidden;background:linear-gradient(180deg,#F5F8FD,#EEF3FB);padding-block:clamp(40px,6vw,72px)}
.phero .w{position:relative;z-index:1}
.phero h1{font-size:clamp(30px,4vw,48px);margin:2px 0 14px;max-width:22ch}
.phero .lead{max-width:62ch}
.crumbs{font-size:13.5px;color:var(--muted);margin-bottom:14px}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--red)}
.phero::before{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#fff,#DDE6F6);opacity:.8}
.phero::after{content:"";position:absolute;right:9%;top:22%;width:46px;height:46px;border-radius:50%;background:var(--red);box-shadow:-120px 40px 0 -16px #F7B6C2}
/* bảng, chú thích, ghi chú */
.tbl{overflow-x:auto;border-radius:18px;background:#fff;margin:16px 0;box-shadow:0 12px 30px rgba(11,31,78,.06)}
.tbl table{border-collapse:collapse;width:100%;font-size:15px;min-width:560px}
.tbl th,.tbl td{padding:13px 18px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{background:#EEF3FB;color:var(--navy);font-size:13.5px}
.tbl tr:last-child td{border-bottom:0}.tbl td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.tbl tr.h td{background:#FFF6F7}
.callout{border-radius:16px;background:var(--pink);padding:16px 20px;font-size:15.5px;margin:18px 0}.callout.n{background:#EEF3FB}
.src{font-size:13px;color:var(--muted)}.src a{color:var(--muted)}
.note{font-size:13.5px;color:var(--muted)}
.ph{display:inline-block;background:#FFF3D6;color:#7A5300;border:1px dashed #E0B24F;border-radius:6px;padding:0 6px;font-size:.92em;font-weight:600}
.road-cta{margin-top:26px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;background:#EEF3FB;border-radius:20px;padding:16px 22px;font-weight:600;color:var(--navy)}
.tabs-filter{display:flex;gap:8px;flex-wrap:wrap}
.tabs-filter button{font:inherit;font-size:14px;font-weight:600;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;cursor:pointer;color:var(--muted)}
.tabs-filter button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.sec-head{display:grid;gap:4px;margin-bottom:34px;max-width:760px;justify-items:start}.sec-head.c{margin-inline:auto;text-align:center;justify-items:center}
.sec-head.row{max-width:none;grid-template-columns:1fr auto;align-items:end}.sec-head.row>div{display:grid;gap:4px}
@media (max-width:760px){.sec-head.row{grid-template-columns:1fr}}
.sec{padding-block:clamp(56px,7vw,90px)}.sec.paper{background:#EEF3FB}.sec.pink{background:#FFF4F5}
/* form */
.form{background:#fff;border-radius:22px;padding:24px;box-shadow:0 20px 44px rgba(11,31,78,.12);color:var(--ink)}
.form h3{margin-bottom:4px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.fgrid .full{grid-column:1/-1}
.field{display:grid;gap:5px;min-width:0}.field label{font-size:13px;font-weight:600;color:var(--navy)}
.field input,.field select,.field textarea{font:inherit;font-size:15px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(11,31,78,.1)}
.consent{display:flex;gap:9px;font-size:12.5px;color:var(--muted);align-items:flex-start}.consent input{margin-top:2px;accent-color:var(--red);width:16px;height:16px;flex:none}
.ok-msg{display:none;margin-top:12px;padding:12px 14px;border-radius:12px;background:#E3F4EA;color:var(--green);font-size:14.5px;font-weight:600}.ok-msg.show{display:block}
.fgrid .btn{justify-content:center}
@media (max-width:560px){.fgrid{grid-template-columns:1fr}}
.ask{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:start}
@media (max-width:960px){.ask{grid-template-columns:1fr}}
.faq details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0 20px;margin-bottom:10px}
.faq details>div{padding:0 0 16px;color:var(--muted);font-size:15px}.faq details>div p:last-child{margin:0}
/* trang khóa Zoom */
.chero .w{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:start}
.cstats{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}
.cstats div{background:#fff;border-radius:16px;padding:12px 18px;box-shadow:0 8px 20px rgba(11,31,78,.06)}
.cstats b{display:block;font-size:22px;color:var(--navy);font-weight:800;line-height:1.2}.cstats span{font-size:12.5px;color:var(--muted)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.spec{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 22px 50px rgba(11,31,78,.14);position:sticky;top:96px}
.spec .sp-h{display:flex;justify-content:space-between;align-items:center;background:var(--navy);color:#fff;padding:14px 20px;position:static;box-shadow:none;backdrop-filter:none}
.spec .sp-h span{font-size:12.5px;color:#FF9AA7}
.spec .body{padding:18px 20px;display:grid;gap:10px}
.spec .price{font-size:28px;font-weight:800;color:var(--navy)}.spec .price small{font-size:13px;color:var(--muted);font-weight:600}
.spec .r{display:flex;justify-content:space-between;gap:12px;font-size:14px;border-bottom:1px dashed var(--line);padding-bottom:8px}.spec .r span{color:var(--muted)}.spec .r b{color:var(--navy);text-align:right}
.spec .btn{justify-content:center}
@media (max-width:960px){.chero .w{grid-template-columns:1fr}.spec{position:static}}
.journey{display:flex;border-radius:16px;overflow:hidden;margin-bottom:22px;box-shadow:0 10px 26px rgba(11,31,78,.06)}
.journey div{flex-basis:0;min-width:84px;padding:12px 14px;font-size:12.5px;color:var(--navy);background:#fff;border-right:1px solid var(--line)}
.journey div:last-child{border-right:0}.journey div b{display:block;font-size:13.5px}
.journey .r{background:var(--pink)}.journey .n{background:var(--navy);color:#fff}.journey .n b{color:#fff}
@media (max-width:760px){.journey{flex-direction:column}.journey div{flex:none!important;border-right:0;border-bottom:1px solid var(--line)}}
.chap{display:grid;gap:10px}
.chap details{background:#fff;border-radius:16px;box-shadow:0 8px 20px rgba(11,31,78,.05)}
.chap summary{cursor:pointer;list-style:none;padding:16px 20px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}
.chap summary::-webkit-details-marker{display:none}
.chap summary .tg{font-size:12px;font-weight:800;background:var(--navy);color:#fff;padding:4px 11px;border-radius:999px;white-space:nowrap}
.chap summary b{color:var(--navy)}.chap summary span{font-size:13px;color:var(--muted);white-space:nowrap}
.chap ol{margin:0;padding:0 20px 18px 46px;display:grid;gap:8px;font-size:14.5px}.chap ol li span{color:var(--muted)}.chap ol li .jp{color:var(--muted);font-size:13px;margin-left:4px}
@media (max-width:640px){.chap summary{grid-template-columns:1fr auto}.chap summary .tg{grid-column:1/-1;justify-self:start}}
.flow6{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.fs{background:#fff;border-radius:18px;padding:18px 12px;text-align:center;box-shadow:0 8px 20px rgba(11,31,78,.05)}
.fs i{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 10px;background:var(--navy);color:#fff;font-style:normal;font-weight:800;border-radius:50%}
.fs:nth-child(n+4) i{background:var(--red)}.fs b{display:block;color:var(--navy);font-size:15px}.fs span{font-size:12.5px;color:var(--muted)}
@media (max-width:860px){.flow6{grid-template-columns:repeat(3,1fr)}}@media (max-width:480px){.flow6{grid-template-columns:1fr 1fr}}
.after{columns:2;column-gap:40px;list-style:none;padding:0;margin:0}
.after li{break-inside:avoid;margin:0 0 12px;padding-left:32px;position:relative}
.after li::before{content:"✓";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:12px}
@media (max-width:760px){.after{columns:1}}
.story{background:#fff;border-radius:22px;padding:26px 28px;box-shadow:0 12px 30px rgba(11,31,78,.06);max-width:860px;border-left:5px solid var(--red)}
.story .q{font-size:20px;font-weight:700;color:var(--navy);line-height:1.5;margin-bottom:12px}
.qa{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.qa div{background:#fff;border-radius:18px;padding:18px 20px;box-shadow:0 8px 20px rgba(11,31,78,.05)}
.qa b{display:block;color:var(--navy);margin-bottom:4px}.qa p{font-size:14.5px;color:var(--muted);margin:0}
@media (max-width:760px){.qa{grid-template-columns:1fr}}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.ticks li{position:relative;padding-left:28px;font-size:14.5px}
.ticks li::before{content:"✓";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:11px}
.fmt{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fm{background:#fff;border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:12px;box-shadow:0 12px 30px rgba(11,31,78,.07);border-top:5px solid var(--line)}
.fm.star{border-top-color:var(--red);box-shadow:0 22px 44px rgba(215,38,61,.14)}
.fm .k{font-size:12.5px;font-weight:700;color:var(--red);letter-spacing:.06em;text-transform:uppercase}
.fm .price{font-size:26px;font-weight:800;color:var(--navy)}.fm .price small{font-size:13px;color:var(--muted);font-weight:600}
.fm .btn{margin-top:auto;justify-content:center}
@media (max-width:900px){.fmt{grid-template-columns:1fr}}
/* bảng lớp (trang lịch) */
.ctable{display:grid;gap:12px}
.crow{display:grid;grid-template-columns:110px 1.5fr 1.2fr 120px 150px auto;gap:16px;align-items:center;padding:16px 20px;background:#fff;border-radius:18px;box-shadow:0 8px 22px rgba(11,31,78,.06);transition:transform .2s,box-shadow .2s}
.crow:not(.head):hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(11,31,78,.1)}
.crow.head{background:none;box-shadow:none;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-block:2px}
.crow .code{font-weight:800;color:var(--navy);font-size:14px}.crow .code small{display:block;font-size:11.5px;font-weight:600;color:var(--muted)}
.crow h3{font-size:16px}.crow .sub{font-size:13px;color:var(--muted)}
.crow .when b{display:block;color:var(--navy)}.crow .when span{font-size:12.5px;color:var(--red);font-weight:600}
.seatline{font-size:13px;color:var(--muted)}.seatline b{color:var(--green)}
.seatline .sb{display:block;height:6px;border-radius:9px;background:var(--line);margin-top:6px;overflow:hidden}.seatline .sb i{display:block;height:100%;background:var(--green);border-radius:9px}
.seatline.few b{color:var(--red)}.seatline.few .sb i{background:var(--red)}
.days{display:flex;gap:3px;margin-top:6px}
.days i{font-style:normal;font-size:10.5px;font-weight:700;width:24px;height:20px;display:grid;place-items:center;border-radius:5px;background:#F1F4F9;color:#A3ADC4}
.days i.on{background:var(--navy);color:#fff}
@media (max-width:980px){.crow.head{display:none}.crow{grid-template-columns:1fr auto;gap:8px 14px}.crow>*:nth-child(2){grid-column:1/-1;order:-1}.crow .act{grid-column:1/-1}.crow .act .btn{width:100%;justify-content:center}}
.fbar{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-end;padding:18px 20px;border-radius:20px;background:#fff;margin-bottom:18px;box-shadow:0 10px 26px rgba(11,31,78,.06)}
.fgrp{display:grid;gap:6px}.fgrp>span{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fgrp .chips{display:flex;flex-wrap:wrap;gap:6px}
.fchip{display:inline-flex;align-items:center;font-size:13.5px;font-weight:600;padding:7px 13px;border:1px solid var(--line);border-radius:999px;cursor:pointer;background:#fff}
.fchip input{position:absolute;opacity:0;pointer-events:none}
.fchip:has(input:checked){background:var(--navy);color:#fff;border-color:var(--navy)}
.fbar .field{min-width:180px}.fbar .field input{padding:8px 12px;font-size:14px}
.empty{display:none;border:1px dashed var(--line);border-radius:18px;padding:26px;text-align:center;color:var(--muted);margin-top:14px;background:#fff}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.s3{background:#fff;border-radius:20px;padding:22px;box-shadow:0 10px 26px rgba(11,31,78,.06)}
.s3 .n{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--red);color:#fff;font-weight:800;margin-bottom:10px}
.s3 h3{font-size:17px;margin-bottom:4px}.s3 p{font-size:14.5px;color:var(--muted);margin:0}
@media (max-width:860px){.steps3{grid-template-columns:1fr}}
/* đăng ký */
.reg{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.order,.cust{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(11,31,78,.08)}
.order .oh{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:var(--navy);color:#fff}.order .oh .mode{font-size:12.5px;color:#FF9AA7;font-weight:700}
.order .ob{padding:18px 20px;display:grid;gap:10px}
.order .r{display:flex;justify-content:space-between;gap:12px;font-size:14.5px;border-bottom:1px dashed var(--line);padding-bottom:8px}.order .r span{color:var(--muted)}.order .r b{color:var(--navy);text-align:right}
.order .tot{display:flex;justify-content:space-between;align-items:center;background:#EEF3FB;padding:16px 20px;font-weight:700;color:var(--navy)}.order .tot b{font-size:24px}
.cust{padding:22px}.cust h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin:18px 0 10px}.cust h4:first-child{margin-top:0}
.tog{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1.5px solid var(--line);border-radius:12px;padding:11px 14px;font-size:14.5px;font-weight:600;cursor:pointer}
.tog input{width:20px;height:20px;accent-color:var(--navy)}
.pay{display:flex;gap:10px;align-items:center;border:1.5px solid var(--navy);background:#F5F8FD;border-radius:12px;padding:12px 14px;font-weight:600;font-size:14.5px}
.qr{display:none;margin-top:16px;border:2px dashed var(--line);border-radius:16px;padding:20px;text-align:center}.qr.show{display:block}
.qr .box{width:160px;height:160px;margin:10px auto;background:repeating-conic-gradient(var(--navy) 0 25%,#fff 0 50%) 0 0/20px 20px;opacity:.12;border-radius:12px}
@media (max-width:900px){.reg{grid-template-columns:1fr}}
/* luyện nói */
.ln-steps{display:flex;flex-wrap:wrap;gap:10px 26px;margin-bottom:20px;font-size:14.5px;color:var(--muted)}
.ln-steps span{display:flex;align-items:center;gap:8px}.ln-steps b{display:grid;place-items:center;width:28px;height:28px;background:var(--red);color:#fff;border-radius:50%;font-size:13px}
.lnp{display:grid;grid-template-columns:1.35fr .65fr;border-radius:26px;overflow:hidden;background:#fff;box-shadow:0 24px 54px rgba(11,31,78,.12);text-align:left;padding:0}
.pl-main{display:flex;flex-direction:column;min-width:0}
.pl-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;align-items:center;padding:16px 22px;background:var(--navy);color:#fff}
.pl-head h3{font-size:17px;color:#fff}.pl-head .meta{font-size:12.5px;color:#B9C4DE}
.pl-keys{font-size:12px;color:#B9C4DE}.pl-keys kbd{font-family:inherit;background:rgba(255,255,255,.14);padding:1px 6px;border-radius:4px}
.pl-stage{flex:1;padding:30px 22px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;background:radial-gradient(circle at 50% 0,#F5F8FD,#fff 70%)}
.pl-count{font-size:12.5px;color:var(--muted)}
.pl-vi{font-size:clamp(19px,2.4vw,24px);font-weight:700;color:var(--red);min-height:1.4em}
.pl-ja{font-family:var(--jp);font-size:clamp(26px,3.8vw,40px);font-weight:600;color:var(--navy);min-height:1.9em;line-height:1.8;transition:opacity .25s,filter .25s}
.pl-ja.hide{opacity:.1;filter:blur(7px)}
.pl-dung{font-size:13.5px;color:var(--muted);min-height:1.4em}
.pl-state{font-size:13.5px;font-weight:700;color:var(--navy);background:#EEF3FB;padding:6px 14px;border-radius:999px;min-height:30px}.pl-state.talk{background:var(--pink);color:var(--red)}
.pl-bar{width:min(300px,80%);height:6px;border-radius:9px;background:var(--line);overflow:hidden}.pl-bar i{display:block;height:100%;width:0;background:var(--red)}
.pl-ctrl{display:flex;gap:10px;align-items:center;justify-content:center;margin-top:6px}
.pl-ctrl .round{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:18px;color:var(--navy)}
.pl-ctrl .btn{min-width:140px;justify-content:center}
.pl-side{border-left:1px solid var(--line);display:flex;flex-direction:column;min-width:0;background:#FBFCFE}
.pl-tabs{display:flex;flex-direction:column;padding:10px;gap:4px;border-bottom:1px solid var(--line)}
.pl-tabs button{font:inherit;font-size:14px;text-align:left;border:0;background:none;padding:10px 12px;border-radius:12px;cursor:pointer;color:var(--ink)}
.pl-tabs button:hover{background:#EEF3FB}.pl-tabs button.on{background:var(--pink);color:var(--red);font-weight:700}
.pl-set{display:grid;gap:14px;padding:16px}
.pl-set label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.seg{display:flex;background:#EEF3FB;border-radius:12px;padding:3px;gap:2px}
.seg button{flex:1;font:inherit;font-size:13px;font-weight:600;border:0;background:none;border-radius:9px;padding:7px 4px;cursor:pointer;color:var(--muted);white-space:nowrap}
.seg button.on{background:#fff;color:var(--navy);box-shadow:0 2px 6px rgba(11,31,78,.1)}
.step{display:flex;align-items:center;justify-content:space-between;background:#EEF3FB;border-radius:12px;padding:3px}
.step button{width:34px;height:32px;border:0;border-radius:9px;background:#fff;cursor:pointer;font-size:16px;color:var(--navy)}.step b{color:var(--navy);font-size:14.5px}
.pl-list{grid-column:1/-1;border-top:1px solid var(--line)}
.pl-list summary{cursor:pointer;padding:14px 22px;font-weight:600;color:var(--navy);font-size:14.5px}
.pl-list ol{margin:0;padding:0 22px 16px 46px;display:grid;grid-template-columns:1fr 1fr;gap:4px 24px;font-size:14px}
.pl-list li button{font:inherit;background:none;border:0;padding:3px 0;text-align:left;cursor:pointer;color:var(--ink)}.pl-list li button:hover{color:var(--red)}.pl-list li .jp{color:var(--muted);margin-left:6px}
@media (max-width:860px){.lnp{grid-template-columns:1fr}.pl-side{border-left:0;border-top:1px solid var(--line)}.pl-tabs{flex-direction:row;overflow-x:auto}.pl-tabs button{white-space:nowrap}.pl-set{grid-template-columns:1fr 1fr}.pl-list ol{grid-template-columns:1fr}}
@media (max-width:480px){.pl-set{grid-template-columns:1fr}.pl-ctrl .btn{min-width:0}}
.pl-tip{margin:16px 0 0;background:#FFF8E6;border-radius:16px;padding:12px 18px;font-size:14px;color:#6B4E00}
.sets{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.set{background:#fff;border:0;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:8px;text-align:left;cursor:pointer;font:inherit;color:inherit;box-shadow:0 10px 26px rgba(11,31,78,.06);transition:transform .2s,box-shadow .2s}
.set:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(11,31,78,.1)}.set.on{box-shadow:0 0 0 2px var(--red),0 18px 36px rgba(215,38,61,.12)}
.set .tags{display:flex;gap:6px}.set .tags span{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:#EEF3FB;color:var(--navy)}.set .tags span.a2{background:var(--pink);color:var(--red)}
.set h3{font-size:17px}.set p{font-size:14px;color:var(--muted);margin:0}.set .gol{margin-top:auto;font-size:14px;font-weight:700;color:var(--red)}
@media (max-width:900px){.sets{grid-template-columns:1fr 1fr}}@media (max-width:560px){.sets{grid-template-columns:1fr}}
/* quà tặng */
.gifts{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.gift{background:#fff;border-radius:22px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 12px 30px rgba(11,31,78,.07);transition:transform .25s,box-shadow .25s}
.gift:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(11,31,78,.12)}
.gift .gc{height:230px;display:grid;place-items:center;padding:20px;position:relative;overflow:hidden;background:linear-gradient(160deg,#F5F8FD,#E4ECF8)}
.gift:nth-child(4n+2) .gc{background:linear-gradient(160deg,#FFF6F7,#FCE3E8)}.gift:nth-child(4n+3) .gc{background:linear-gradient(160deg,#FFFBF1,#FCEFD2)}
.gift .gc img{height:190px!important;width:auto!important;max-width:none;border-radius:6px;box-shadow:0 14px 28px rgba(11,31,78,.25);transform:rotate(-3deg);transition:transform .3s}
.gift:hover .gc img{transform:rotate(0) scale(1.04)}
.gift .gc .fake{height:190px;aspect-ratio:3/4;border-radius:8px;background:var(--navy);color:#fff;padding:14px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 14px 28px rgba(11,31,78,.25);transform:rotate(-3deg);font-size:11.5px}
.gift .gc .fake b{font-size:18px;line-height:1.2}.gift .gc .fake.red{background:var(--red)}.gift .gc .fake.ok{background:#1E6B4A}
.gift .gc .ty{position:absolute;top:12px;left:12px;font-size:11px;font-weight:800;padding:3px 10px;border-radius:999px;background:#fff;color:var(--navy)}
.gift .gb{padding:18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.gift h3{font-size:16.5px}.gift p{font-size:14px;color:var(--muted);margin:0}.gift .m{font-size:12.5px;color:var(--muted)}
.gift .btn{margin-top:auto;align-self:flex-start}.gift .getbox{margin-top:6px;display:grid;gap:8px}
@media (max-width:1100px){.gifts{grid-template-columns:repeat(3,1fr)}}@media (max-width:820px){.gifts{grid-template-columns:1fr 1fr}}@media (max-width:540px){.gifts{grid-template-columns:1fr}}
/* blog */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.post{background:#fff;border-radius:22px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;box-shadow:0 12px 30px rgba(11,31,78,.07);transition:transform .25s,box-shadow .25s}
a.post:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(11,31,78,.12)}
.post .cv{aspect-ratio:16/8;display:flex;align-items:flex-end;padding:16px 18px;color:#fff;position:relative;overflow:hidden;max-width:100%;background:linear-gradient(135deg,#0B1F4E,#1D3A80)}
.post .cv b{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;position:relative;z-index:1}
.post .cv .k{display:none}
.post .cv::before{content:"";position:absolute;right:18px;top:18px;width:44px;height:44px;border-radius:50%;background:var(--red)}
.post .cv::after{content:"";position:absolute;left:-10%;right:30%;top:58%;border-top:2px dotted rgba(255,255,255,.45);transform:rotate(-10deg)}
.cv.c2,.cv.c5{background:linear-gradient(135deg,#B81C31,#E2475A)}.cv.c2::before,.cv.c5::before{background:#fff}
.cv.c3,.cv.c6{background:linear-gradient(135deg,#1B3577,#3A5BA8)}
.post .pb{padding:18px 20px 20px;display:grid;gap:8px}
.post .cat{font-size:12px;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.06em}
.post h3{font-size:17.5px}.post p{font-size:14px;color:var(--muted);margin:0}.post .by{font-size:12.5px;color:var(--muted);display:flex;gap:12px}
.post.soon{opacity:.72}.post.soon .cat::after{content:" · Sắp đăng";color:var(--muted)}
@media (max-width:960px){.posts{grid-template-columns:1fr 1fr}}@media (max-width:600px){.posts{grid-template-columns:1fr}}
.article{max-width:760px;margin:0 auto}
.article h2{font-size:26px;margin:40px 0 14px}.article p,.article li{font-size:17px;line-height:1.78}
.article ul,.article ol{padding-left:22px}.article li{margin:6px 0}
.toc{background:#fff;border-radius:18px;padding:16px 22px;margin:24px 0;box-shadow:0 10px 26px rgba(11,31,78,.06)}
.toc b{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}.toc ol{margin:8px 0 0}.toc li{font-size:15.5px;margin:3px 0}
.art-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:var(--muted)}
/* khối khóa tự học, tài khoản, liên hệ */
.trial{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.trial div{background:#fff;border-radius:18px;padding:18px;box-shadow:0 8px 22px rgba(11,31,78,.06)}
.trial b{display:block;color:var(--navy);margin:10px 0 4px}.trial p{font-size:14px;color:var(--muted);margin:0}
@media (max-width:900px){.trial{grid-template-columns:1fr 1fr}}@media (max-width:520px){.trial{grid-template-columns:1fr}}
.auth{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.auth .box{background:#fff;border-radius:24px;padding:26px;box-shadow:0 22px 50px rgba(11,31,78,.12)}
.auth .tabsw{display:flex;background:#EEF3FB;border-radius:14px;padding:4px;margin-bottom:16px}
.auth .tabsw button{flex:1;font:inherit;font-weight:700;border:0;background:none;padding:10px;border-radius:11px;cursor:pointer;color:var(--muted)}.auth .tabsw button.on{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(11,31,78,.1)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;font:inherit;font-weight:700;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:12px;cursor:pointer;color:var(--ink)}
.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin:14px 0}.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.done{display:none;text-align:center}.done.show{display:block}
.done .ok-dot{margin:0 auto 10px;width:52px;height:52px;font-size:22px}
@media (max-width:900px){.auth{grid-template-columns:1fr}}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:start}
.cline{display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cline b{display:block;color:var(--navy)}.cline span{font-size:14.5px;color:var(--muted)}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.ok-dot{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;font-weight:800}
/* bí danh để mã trang cũ dùng chung kiểu nút/khung mới */
.wrap{max-width:1200px;margin:0 auto;padding-inline:20px}
.btn-red{background:var(--red);color:#fff;box-shadow:0 8px 20px rgba(215,38,61,.25)}.btn-red:hover{background:var(--red2)}
.btn-navy{background:var(--navy);color:#fff;box-shadow:0 8px 20px rgba(11,31,78,.22)}
.btn-line{border-color:var(--navy);color:var(--navy);background:#fff}
.btn-soft{background:var(--blue);color:var(--navy)}
.btn-sm{padding:9px 18px;font-size:14px}
.btn.arrow::after{content:"→";transition:transform .15s}.btn.arrow:hover::after{transform:translateX(3px)}
.demobar{background:#FFF8E6;color:#6B4E00;font-size:12.5px;text-align:center;padding:5px 16px}
/* đầu trang 7 mục */
.top nav.main{display:flex;gap:0;margin-left:auto}
.top nav.main a{padding:8px 10px}
.top nav.main a.mob{display:none}
.acc{display:inline-flex;align-items:center;gap:6px;padding-left:14px;border-left:1px solid var(--line)}
.acc:hover{color:var(--red)}.acc.in{color:var(--green)}
@media (max-width:1199px){
 .top nav.main{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;padding:8px 16px 18px;box-shadow:0 18px 30px rgba(11,31,78,.12);margin:0}
 .top nav.main.open{display:flex}.top nav.main a{border-radius:10px;padding:12px 10px;font-size:16px}
 .top nav.main a.mob{display:flex;justify-content:center;margin-top:8px;color:#fff}
 .burger{display:block;margin-left:0}.top .acc{margin-left:auto;border-left:0}
}
@media (max-width:640px){.top .cta-top{display:none}.top .acc span{display:none}.top .w{gap:12px;min-height:64px}.logo img{height:40px}}
.top{position:sticky}
footer small{color:#8C98B6}
.zalo-fab{text-decoration:none}
/* trang chủ: 4 khóa, quà tặng, blog */
.cards.four-c{grid-template-columns:repeat(4,1fr);gap:20px}
.cover.a4{background:linear-gradient(135deg,#FFF3DA,#FBE2B4)}.cover.a4 .lvl,.cover.a3 .lvl{color:var(--navy)}.cover.a4 .badge2{background:#fff;color:#8A5A00}
.cover.a3 .cv-plane path,.cover.a4 .cv-plane path{stroke:#0B1F4E}.cover.a3 .cv-plane circle{fill:#D7263D}.cover.a4 .cv-plane circle{fill:#D7263D}
.four-c .cover .lvl{font-size:52px}
.tabs{justify-content:center}.tabs button{font:inherit;font-size:14px;font-weight:600;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;cursor:pointer;color:var(--muted)}
.tabs button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.trial-tip{background:#fff;box-shadow:0 10px 26px rgba(11,31,78,.06)}
.gifts-home{background:#FFF4F5}.blog-home{background:#EEF3FB}
.gh{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.fan{position:relative;height:420px}
.fan img{position:absolute;width:190px;height:auto;border-radius:6px;box-shadow:0 18px 36px rgba(11,31,78,.25);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.fan .b0{left:34%;top:20px;z-index:5;width:210px}.fan .b1{left:6%;top:70px;transform:rotate(-9deg);z-index:3}.fan .b2{left:62%;top:70px;transform:rotate(8deg);z-index:3}
.fan .b3{left:-2%;top:170px;transform:rotate(-15deg);z-index:1;width:170px}.fan .b4{left:74%;top:170px;transform:rotate(14deg);z-index:1;width:170px}
.fan:hover .b1{transform:rotate(-12deg) translate(-14px,-6px)}.fan:hover .b2{transform:rotate(11deg) translate(14px,-6px)}.fan:hover .b0{transform:translateY(-10px)}
.okm.show{display:block;background:rgba(255,255,255,.12);color:#9BE2B7}
@media (max-width:1100px){.cards.four-c{grid-template-columns:1fr 1fr}}
@media (max-width:960px){.gh{grid-template-columns:1fr;gap:30px}.fan{height:360px;max-width:460px;margin:0 auto;width:100%}}
@media (max-width:600px){.cards.four-c{grid-template-columns:1fr}.fan{height:290px}.fan img{width:130px}.fan .b0{width:150px;left:32%}.fan .b3,.fan .b4{width:120px}}
/* trang tự học: mô phỏng sản phẩm */
.cards.two-c{grid-template-columns:1fr 1fr;max-width:900px}
@media (max-width:640px){.cards.two-c{grid-template-columns:1fr}}
.art .vid,.art .qz,.art .fc2,.art .pathm{position:relative;z-index:1;width:100%;max-width:360px}
.vid{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 16px 36px rgba(11,31,78,.14)}
.vs{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#0B1F4E,#1D3A80);display:grid;place-items:center;color:#fff}
.vs p{font-size:22px;margin:0;color:#fff}.vtag{position:absolute;left:12px;top:10px;font-size:11px;font-weight:700;background:var(--red);padding:2px 9px;border-radius:999px}
.play{position:absolute;right:14px;bottom:12px;width:40px;height:40px;border-radius:50%;background:#fff;color:var(--red);display:grid;place-items:center;font-size:14px;animation:pulse 2.4s ease-in-out infinite}
.vbar{height:5px;background:var(--line)}.vbar i{display:block;height:100%;background:var(--red)}
.vch{display:flex;flex-wrap:wrap;gap:5px;padding:10px 12px}.vch span{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--sky);color:var(--muted)}.vch span.on{background:var(--navy);color:#fff}
.qz,.fc2,.pathm{background:#fff;border-radius:18px;padding:18px;box-shadow:0 16px 36px rgba(11,31,78,.14)}
.qz .t,.fc2 .t,.pathm .t{font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:10px}
.qz .q{font-size:17px;color:var(--navy)}.qz u{text-decoration:none;display:inline-block;min-width:2.6em;border-bottom:2px solid var(--navy)}
.qo{display:grid;grid-template-columns:1fr 1fr;gap:7px}.qo span{border:1.5px solid var(--line);border-radius:9px;padding:7px 10px;font-size:14px}.qo .ok{border-color:var(--green);background:#E8F6EE;color:var(--green);font-weight:700}
.qz .fb{font-size:13px;color:var(--green);margin:10px 0 8px;font-weight:600}
.qs{display:flex;justify-content:space-between;align-items:center;background:var(--sky);border-radius:10px;padding:8px 12px;font-size:13px;color:var(--muted)}.qs b{color:var(--navy);font-size:18px}
.fc2{text-align:center}.fc2 .big{font-size:40px;color:var(--navy)}.fc2 .m{color:var(--muted);font-size:13.5px}
.fc2 .b{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.fc2 .b span{font-size:12.5px;font-weight:700;padding:7px 4px;border-radius:9px;background:var(--sky);color:var(--muted);display:grid}.fc2 .b small{font-weight:500;font-size:11px}.fc2 .b .ok{background:#E3F4EA;color:var(--green)}
.fc2 .b span:first-child{background:var(--pink);color:var(--red)}
.pm{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.pm .d{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#E3F4EA;color:var(--green);font-weight:800;font-size:12px}
.pm b{color:var(--navy)}.pm i{font-style:normal;font-size:12px;color:var(--muted)}
.pm.now .d{background:var(--red);color:#fff}.pm.now i{color:var(--red);font-weight:700}
.pm:last-of-type .d{background:var(--sky);color:var(--muted)}
.pathm .m{font-size:12.5px;color:var(--muted);margin:10px 0 0}.pathm .m b{color:var(--red)}
.steps3.s4{grid-template-columns:repeat(4,1fr)}@media (max-width:960px){.steps3.s4{grid-template-columns:1fr 1fr}}@media (max-width:560px){.steps3.s4{grid-template-columns:1fr}}
.trial .ic{margin-bottom:4px}
/* học thử */
.hts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ht{background:#fff;border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:8px;box-shadow:0 12px 30px rgba(11,31,78,.07);border-top:4px solid var(--blue);transition:transform .25s,box-shadow .25s}
.ht:nth-child(-n+3){border-top-color:var(--red)}.ht:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(11,31,78,.12)}
.ht-h{display:flex;justify-content:space-between;align-items:center}.ht-h .m{font-size:12.5px;font-weight:600;color:var(--muted);background:var(--sky);padding:3px 10px;border-radius:999px}
.ht h3{font-size:19px}.ht p{font-size:14.5px;color:var(--muted);margin:0 0 6px}.ht .btn{margin-top:auto;align-self:flex-start}
@media (max-width:900px){.hts{grid-template-columns:1fr 1fr}}@media (max-width:560px){.hts{grid-template-columns:1fr}}
/* tài khoản */
.sso{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center}
.ss{background:#fff;border-radius:18px;padding:18px;box-shadow:0 12px 30px rgba(11,31,78,.08);border-top:4px solid var(--navy)}.ss.r{border-top-color:var(--red)}
.ss b{display:block;color:var(--navy);font-size:17px;margin-bottom:4px}.ss span{font-size:13.5px;color:var(--muted)}
.ss-mid{display:grid;justify-items:center;gap:6px}.ss-mid .key{font-size:12px;font-weight:700;color:#fff;background:var(--green);padding:4px 10px;border-radius:999px;white-space:nowrap}
.ss-mid i{width:70px;height:2px;background:repeating-linear-gradient(90deg,var(--green) 0 6px,transparent 6px 11px);animation:dash 1.2s linear infinite}
@keyframes dash{to{background-position:22px 0}}
@media (max-width:560px){.sso{grid-template-columns:1fr}.ss-mid i{width:2px;height:30px;background:repeating-linear-gradient(180deg,var(--green) 0 6px,transparent 6px 11px)}}
.mine{display:grid;gap:10px;margin-top:16px;text-align:left}
.my{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--line);border-radius:14px;padding:12px 14px}
.my b{display:block;color:var(--navy);font-size:15px}.my span{font-size:12.5px;color:var(--muted)}
.my .pg{display:block;height:5px;border-radius:9px;background:var(--line);margin-top:6px;width:160px;max-width:100%}.my .pg i{display:block;height:100%;background:var(--red);border-radius:9px}
.partner{margin-top:26px;background:#EEF3FB;border-radius:20px;padding:20px 22px}.partner h3{font-size:19px;margin-bottom:6px}.partner p{font-size:14.5px;color:var(--muted);margin:0}
.cline .ic{width:42px;height:42px}
.article .h{font-weight:700;color:var(--navy)}
.paid{margin-top:16px;background:#E3F4EA;border-radius:16px;padding:18px;display:grid;justify-items:center;gap:6px}.paid b{color:var(--green)}.paid p{font-size:14px;color:var(--muted);margin:0 0 6px}
footer .w>div{min-width:0}
@media (max-width:960px){footer .w{grid-template-columns:1fr 1fr}footer .fc{grid-column:1/-1}}
@media (max-width:480px){footer .w{grid-template-columns:1fr;gap:22px}}
.crow>*{min-width:0}
@media (max-width:980px){.crow{grid-template-columns:minmax(0,1fr) auto}}
.gifts-home{overflow:hidden}
.cls{grid-template-rows:1fr auto;align-items:start}
.chero::after{display:none}.chero::before{right:-180px;top:auto;bottom:-200px}
.sec.paper .callout.n{background:#fff}

/* ===== bản public (p_public.py) ===== */
footer .w.legal{display:block;padding-block:18px 22px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;color:#8C98B6}
.cta-box .consent{color:#C9D3EA;font-size:12px}.cta-box .consent a{color:#fff}.cta-box .consent input{padding:0;border-radius:3px}
.consent a{color:inherit;text-decoration:underline}
.srcs ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:10px}
.srcs li{font-size:13.5px;line-height:1.45;padding:10px 12px;border-radius:12px;background:var(--blue,#EEF3FB);color:var(--ink)}
.srcs .pass{margin-top:12px}
.policy h2{font-size:21px;margin:34px 0 10px}.policy h2:first-child{margin-top:0}
.ok-msg.err{background:var(--pink,#FFE9EC);color:var(--red)}
.notfound{padding:120px 0;text-align:center}.notfound h1{font-size:clamp(32px,5vw,52px)}
.c-lich .r{grid-template-columns:26px 1fr auto}.c-lich .r span{line-height:1.35}
.courses .cards.two-c{grid-template-columns:repeat(2,minmax(0,1fr));max-width:860px;margin-inline:auto}@media (max-width:700px){.courses .cards.two-c{grid-template-columns:1fr}}
.top .w>.cta-top{margin-left:auto}.top .w>.burger{margin-left:12px}@media (max-width:640px){.top .w>.burger{margin-left:auto}}