/* ==========================================================
   VSTEP ONE — lớp tinh chỉnh "sang hơn" (bản 2.1)
   Chữ nhỏ và mảnh hơn, khoảng trắng rộng hơn, thẻ và nút nhẹ hơn.
   Nạp sau cùng, chỉ ghi đè cỡ chữ, khoảng cách, viền, bóng.
   ========================================================== */

/* ---------- nền tảng chữ ---------- */
.vs{font-size:15px;line-height:1.65;color:#14271B;letter-spacing:-.003em}
.vs h1,.vs h2,.vs h3,.vs h4{font-weight:700;letter-spacing:-.02em;line-height:1.2}
.vs h1,.vs h2{text-wrap:balance}
.wrap{max-width:1160px}

/* ---------- đầu trang ---------- */
.hdr{background:rgba(255,255,255,.9);border-bottom-color:rgba(13,91,39,.08)}
.hdr-in{height:68px}
.logo{font-size:20px}
.logo-one{font-size:16px;padding:1px 8px 2px;border-radius:5px}
.nav-a{font-size:14px;font-weight:500;padding:8px 13px;color:#2A3D2F}
.nav-a.on{font-weight:600}
.dd-menu{border-radius:16px;box-shadow:0 20px 44px -20px rgba(13,58,28,.35),0 2px 6px rgba(13,58,28,.06)}
.dd-ico{width:36px;height:36px;border-radius:10px;color:#2F6E23;background:#EEF5E2;box-shadow:none}
.dd-t{font-size:14px;font-weight:600}
.dd-s{font-size:12.5px}

/* ---------- nút ---------- */
.btn{min-height:44px;padding:0 20px;font-size:14px;font-weight:600;letter-spacing:.005em;gap:8px}
.btn-lg{min-height:50px;padding:0 26px;font-size:15px}
.btn-sm{min-height:38px;padding:0 16px;font-size:13.5px}
.btn::after{display:none}
.btn:hover{transform:translateY(-1px)}
.btn-pri{background:linear-gradient(180deg,#4C9439 0%,#357428 100%);border-color:#2E6623;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 22px -12px rgba(47,106,35,.7),0 1px 2px rgba(13,58,28,.12)}
.btn-pri:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 28px -12px rgba(47,106,35,.75),0 1px 2px rgba(13,58,28,.14)}
.btn-out{background:#FFFFFF;border:1px solid rgba(13,91,39,.35);box-shadow:0 6px 16px -12px rgba(13,91,39,.4)}
.btn-out:hover{border-color:#0D5B27}
.btn-glass{border-color:rgba(255,255,255,.32)}
.btn-round{width:46px;min-height:46px}

/* ---------- nhãn nhỏ trên tiêu đề: chữ hoa giãn cách, không khung ---------- */
.eyebrow{padding:0;gap:10px;background:none;border:0;box-shadow:none;font-size:12px;font-weight:700;letter-spacing:.18em;color:#438134}
.eyebrow::before{width:22px;height:1.5px;border-radius:0;background:currentColor;box-shadow:none}
.tst .eyebrow,.cta .eyebrow,.phero .eyebrow{background:none;border:0;box-shadow:none;color:#C6E05A}
.tst .eyebrow::before,.cta .eyebrow::before,.phero .eyebrow::before{background:currentColor;box-shadow:none}

/* từ nhấn trong tiêu đề: giữ màu chuyển, bỏ vạch tô đậm */
.hw::after{height:.1em;bottom:.02em;opacity:.55}
.hl svg{height:10px;bottom:-8px}
.hl svg path{stroke-width:2.5}

/* ---------- hero trang chủ & trang con ---------- */
.hero-in{padding:88px 24px 112px;gap:64px}
.hero h1{font-size:48px;font-weight:700;letter-spacing:-.03em;line-height:1.14;margin:20px 0 18px;max-width:14ch}
.hero-lead{font-size:17px;line-height:1.7;max-width:48ch}
.pill{font-size:13px;font-weight:500;padding:6px 14px 6px 10px}
.hero-act{margin-top:30px;gap:12px}
.trust{font-size:13px;margin-top:28px}
.phero-in{padding:64px 24px 88px}
.phero h1{font-size:42px;font-weight:700;letter-spacing:-.03em;line-height:1.14;margin:16px 0 16px}
.phero-lead{font-size:16.5px;line-height:1.7}
.ahead h1{font-size:38px;font-weight:700;letter-spacing:-.025em;line-height:1.2}
.hstat b{font-size:30px;font-weight:700}

/* ---------- số liệu ---------- */
.stats-in{border-radius:20px;border-color:rgba(13,91,39,.08);box-shadow:0 24px 50px -32px rgba(13,58,28,.35)}
.stat{padding:26px 28px}
.stat b{font-size:34px;font-weight:700;letter-spacing:-.025em}
.stat b small{font-size:16px;font-weight:600}
.stat span{font-size:13px}

/* ---------- tiêu đề khu vực ---------- */
.sec{padding:96px 0}
.band>.sec{padding:88px 0}
.band>.sec:first-child{padding-top:112px}
.sec-head{max-width:680px;margin-bottom:48px}
.sec-head h2,.head-row h2{font-size:36px;font-weight:700;letter-spacing:-.025em;line-height:1.18;margin:14px 0 12px}
.sec-head p,.head-row p{font-size:16px;line-height:1.7;color:#55644F}
.head-row{margin-bottom:40px}
.lt-head h2{font-size:30px;font-weight:700}
.story h2,.qual-copy h2{font-size:34px;font-weight:700;letter-spacing:-.025em}
.story p,.qual-copy>p{font-size:16px}
.fb-copy h2{font-size:32px;font-weight:700}
.ml-h{font-size:44px;font-weight:700;letter-spacing:-.03em}
.ml-lead{font-size:16px}
.news h2{font-size:26px;font-weight:700}
.cta-mini h2{font-size:24px;font-weight:700}

/* ---------- thẻ: viền mảnh, bóng mềm, bo 20px ---------- */
.tile,.course,.cmini,.step,.tm,.score,.post,.rc,.val,.inc,.lesson,.xc,.ml-card{border-radius:20px;border-color:rgba(13,91,39,.10);box-shadow:0 1px 2px rgba(13,58,28,.04),0 14px 34px -24px rgba(13,58,28,.32)}
.tile:hover,.course:hover,.cmini:hover,.tm:hover,.post:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(13,58,28,.05),0 22px 44px -26px rgba(13,58,28,.42)}
.tile{padding:28px;gap:10px}
.tile h3{font-size:18px;font-weight:700}
.tile-big h3{font-size:24px}
.tile p,.tile-big p{font-size:14px;line-height:1.65}
.tile-link{font-size:14px;font-weight:600}
.chip{width:46px;height:46px;border-radius:13px;color:#2F6E23;background:#EEF5E2;box-shadow:inset 0 0 0 1px rgba(67,129,52,.14)}
.tile-big .chip{color:#0B3A18;background:#C6E05A;box-shadow:none}
.mini-row{font-size:12.5px}

/* khoá học */
.course{padding:28px;gap:12px}
.course-feat{border:1.5px solid #438134}
.course h3{font-size:21px;font-weight:700}
.course p{font-size:14px}
.lvl,.ribbon{font-size:11px;font-weight:700;letter-spacing:.04em}
.facts b{font-size:15px}
.facts small{font-size:11.5px}
.ticks li{font-size:14px}
.cmini{padding:22px}
.cmini h3{font-size:17px;font-weight:700}
.cmini p{font-size:13.5px}
.cmini-ic{width:40px;height:40px;border-radius:12px;color:#2F6E23;background:#EEF5E2;box-shadow:none}
.cmini-dark .cmini-ic{color:#0B3A18;background:#C6E05A}
.xh h3{font-size:22px;font-weight:700}
.xc h3{font-size:18px;font-weight:700}
.syl-side h3{font-size:22px;font-weight:700}
.scale-top h2{font-size:19px;font-weight:700}

/* phương pháp: số thứ tự to, nhạt — kiểu chữ số trang trí */
.step{padding:26px;gap:16px}
.step-n{width:auto;height:auto;min-width:44px;border-radius:0;background:none;box-shadow:none;font-size:34px;font-weight:700;letter-spacing:-.04em;line-height:1;color:rgba(67,129,52,.32)}
.step h3{font-size:16px;font-weight:700}
.step p{font-size:13.5px}
.road-i .step-n{font-size:30px}
.road-i h3{font-size:16px}

/* đội ngũ, thành tích */
.tm-body{padding:16px 18px 20px}
.tm-name{font-size:16px;font-weight:700}
.tm-role{font-size:13px;font-weight:600}
.tm-exp{font-size:12.5px}
.tm-cert{font-size:12px;font-weight:600}
.score-n{font-size:14px;font-weight:700}
.score-big b{font-size:24px;font-weight:700}
.val h3,.pill-card h3{font-size:18px}
.rc h4,.vf h4,.ml-card h3,.mp h3,.f3 h3,.inc h3,.onl h3{font-size:15.5px;font-weight:700}

/* cảm nhận */
.quote{flex-basis:360px;padding:28px;border-radius:20px}
.q-mark{font-size:52px}
.q-text{font-size:15px;line-height:1.7}
.q-n{font-weight:700}
.q-c{font-size:12.5px}

/* blog */
.post-img{height:180px;font-size:14px;font-weight:700}
.post-b{padding:20px;gap:8px}
.post h3{font-size:16.5px;font-weight:700;line-height:1.4}
.feat-b h3{font-size:26px;font-weight:700}
.feat-b p{font-size:15px}
.prose{font-size:17px;line-height:1.8}
.prose h2{font-size:26px;font-weight:700}
.prose h3{font-size:20px;font-weight:700}
.prose blockquote{font-size:18px}

/* lịch thi */
.lt-kpi b{font-size:32px;font-weight:700}
.lt-col-h h3,.dir-h h3{font-size:16px;font-weight:700}
.ss-d b{font-size:18px}

/* ---------- đăng ký & chân trang ---------- */
.cta-in{padding:96px 24px;gap:72px}
.cta h2{font-size:38px;font-weight:700;letter-spacing:-.025em;line-height:1.18}
.vs .cta-lead{font-size:16px;line-height:1.7;margin-top:18px}
.cta-pt{font-size:14.5px}
.cta-pt i{width:38px;height:38px}
.form{border-radius:22px;padding:30px}
.form h3{font-size:19px;font-weight:700}
.fld label{font-size:13px;font-weight:600}
.inp{min-height:46px;border-radius:12px;border-width:1px;font-size:14.5px}
.ftr{font-size:14px;padding:68px 0 28px;border-top-width:3px}
.ftr h4{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ftr a{font-weight:500}
.ftr .logo{font-size:22px;font-weight:800}
.ftr .logo-one{font-size:18px}
.ftr-b{font-size:12.5px}

/* ---------- máy tính bảng & điện thoại ---------- */
@media (max-width:1100px){
.hero-in{padding:56px 24px 104px}
.hdr-in{height:64px}
}
@media (max-width:680px){
.vs{font-size:15px}
.hero h1{font-size:34px}
.hero-lead{font-size:16px}
.phero h1{font-size:31px}
.phero-lead{font-size:15.5px}
.ahead h1{font-size:28px}
.sec{padding:68px 0}
.band>.sec{padding:64px 0}
.band>.sec:first-child{padding-top:88px}
.sec-head{margin-bottom:36px}
.sec-head h2,.head-row h2,.story h2,.qual-copy h2{font-size:27px}
.fb-copy h2,.ml-h{font-size:28px}
.lt-head h2{font-size:24px}
.cta h2{font-size:28px}
.cta-in{padding:68px 24px}
.stat b{font-size:28px}
.feat-b h3{font-size:22px}
.prose{font-size:16px}
.prose h2{font-size:22px}
}

/* ==========================================================
   2.2 — bố cục có chiều sâu: đường cong, lớp chồng, nhịp so le
   ========================================================== */

/* đầu trang: đáy bo cong, vòng sáng mảnh phía sau */
.hero,.phero{border-radius:0 0 56px 56px;isolation:isolate}
.hero::after,.phero::after{content:"";position:absolute;z-index:0;pointer-events:none;width:720px;height:720px;right:-220px;top:-300px;border-radius:50%;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.02)}
.phero::after{width:560px;height:560px;right:-180px;top:-260px}
.hero-in,.phero-in{z-index:1}
/* thẻ minh hoạ ở hero hơi nghiêng, chồng lớp */
.card-exam{rotate:-2.2deg}
.card-ai{rotate:2.6deg}
.card-dict{rotate:-1.2deg}
.hstat:nth-child(even){translate:0 18px}

/* khối số liệu nổi lên trên mép cong */
.stats{margin-top:-64px}

/* nhịp căn lề: xen kẽ giữa căn giữa và căn trái */
#khoa-hoc .sec-head,#blog .sec-head{text-align:left;margin-left:0}
#khoa-hoc .sec-head .eyebrow,#blog .sec-head .eyebrow{justify-content:flex-start}

/* thẻ so le, thẻ nổi bật nhô lên */
.course-feat{translate:0 -18px;box-shadow:0 2px 4px rgba(13,58,28,.06),0 34px 64px -30px rgba(47,106,35,.55)}
.steps .step:nth-child(3n+2){translate:0 22px}
.team .tm:nth-child(even){translate:0 34px}
.team{padding-bottom:34px}
.values .val:nth-child(2),.vals .val:nth-child(2){translate:0 26px}
.bento .tile:not(.tile-big):nth-child(3){translate:0 14px}

/* các khối tối thành tấm nổi bo tròn, đè nhẹ lên khu vực trên */
.tst{border-radius:48px;margin:0 16px;box-shadow:0 40px 80px -50px rgba(13,58,28,.6)}
.cta{border-radius:56px 56px 0 0;margin-top:-56px;z-index:2;box-shadow:0 -24px 60px -40px rgba(13,58,28,.45)}
.cta-in{padding-top:120px}
.form{rotate:1.2deg;box-shadow:0 44px 90px -40px rgba(0,0,0,.65)}
.form:focus-within{rotate:0deg}
.form{transition:rotate .35s cubic-bezier(.2,.8,.2,1)}

/* thẻ tối có viền sáng bên trong cho cảm giác khối */
.tile-big,.cmini-dark,.pill-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 30px 60px -34px rgba(13,58,28,.6)}

/* ảnh đội ngũ: khung ảnh bo lớn hơn, chữ chồng nhẹ lên ảnh */
.tm-photo{border-radius:20px 20px 0 0}

/* chân trang: viền trên bỏ vạch, thay bằng góc bo nối với khối đăng ký */
.ftr{border-top:0}

@media (max-width:1100px){
.course-feat,.steps .step:nth-child(3n+2),.team .tm:nth-child(even),.values .val:nth-child(2),.vals .val:nth-child(2),.bento .tile:not(.tile-big):nth-child(3),.hstat:nth-child(even){translate:none}
.team{padding-bottom:0}
}
@media (max-width:680px){
.hero,.phero{border-radius:0 0 32px 32px}
.tst{border-radius:28px;margin:0 8px}
.cta{border-radius:32px 32px 0 0;margin-top:-32px}
.cta-in{padding-top:88px}
.card-exam,.card-ai,.card-dict,.form{rotate:none}
#khoa-hoc .sec-head,#blog .sec-head{text-align:center;margin-left:auto}
}

/* ==========================================================
   2.3 — linh vật, popup ưu đãi, dải ảnh feedback
   ========================================================== */

/* phần kiểm tra trình độ: giữ form thẳng */
.form,.form:focus-within{rotate:none}

/* ---------- linh vật ---------- */
.mascot{display:inline-block;position:relative;aspect-ratio:1/1;line-height:0;pointer-events:none}
.mascot svg{display:block;overflow:visible}
.m-body{transform-box:view-box;transform-origin:100px 186px;transform:rotate(var(--m-lean,0deg));transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.m-pupil{transition:transform .12s linear}
.m-eye{transform-box:fill-box;transform-origin:center;animation:m-blink 5.6s infinite}
.m-wave{transform-box:view-box;transform-origin:152px 132px;animation:m-wave 2.6s ease-in-out infinite}
.m-tassel{transform-box:view-box;transform-origin:148px 49px;animation:m-tassel 3.2s ease-in-out infinite}
.m-idle .m-pupil{animation:m-look 7s ease-in-out infinite}
@keyframes m-blink{0%,93%,100%{transform:scaleY(1)}95.5%{transform:scaleY(.08)}}
@keyframes m-wave{0%,100%{transform:rotate(0)}50%{transform:rotate(-18deg)}}
@keyframes m-tassel{0%,100%{transform:rotate(0)}50%{transform:rotate(6deg)}}
@keyframes m-look{0%,18%{transform:translate(0,0)}26%,44%{transform:translate(4px,1px)}52%,70%{transform:translate(-4px,1px)}78%,100%{transform:translate(0,-2px)}}
@keyframes m-float{0%,100%{translate:0 0}50%{translate:0 -8px}}
.m-hero{position:absolute;z-index:4;left:300px;top:-104px;filter:drop-shadow(0 18px 22px rgba(0,0,0,.28))}
.m-hero::before{content:"";position:absolute;inset:8% 4% 2%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(214,240,154,.55),rgba(214,240,154,0))}
.motion .m-hero{animation:m-float 5s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.m-eye,.m-wave,.m-tassel,.m-idle .m-pupil,.motion .m-hero{animation:none}.m-body{transition:none}}
@media (max-width:1100px){.m-hero{left:auto;right:6%;top:-70px}}
@media (max-width:680px){.m-hero{width:92px !important;right:4px;top:-58px}}

/* ---------- popup ưu đãi ---------- */
.promo{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px}
.promo[hidden]{display:none}
.promo-bg{position:absolute;inset:0;background:rgba(9,32,16,.52);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .26s}
.promo-box{position:relative;display:grid;grid-template-columns:300px minmax(0,1fr);width:min(760px,100%);border-radius:28px;overflow:hidden;background:#FFFFFF;box-shadow:0 50px 100px -40px rgba(0,0,0,.6),0 0 0 1px rgba(13,91,39,.08);opacity:0;transform:translateY(18px) scale(.97);transition:opacity .26s,transform .32s cubic-bezier(.2,.8,.2,1)}
.promo.on .promo-bg{opacity:1}
.promo.on .promo-box{opacity:1;transform:none}
.promo-art{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(240px 200px at 30% 20%,rgba(255,255,255,.9),transparent 70%),radial-gradient(260px 220px at 80% 100%,rgba(198,224,90,.55),transparent 70%),linear-gradient(160deg,#EAF4DA,#CFE4A8)}
.promo-art .mascot{position:relative;z-index:1;margin-top:20px}
.promo-dot{position:absolute;border-radius:50%}
.promo-dot.d1{width:120px;height:120px;left:-30px;top:-30px;background:rgba(255,255,255,.55)}
.promo-dot.d2{width:14px;height:14px;right:36px;top:46px;background:#9BCB3C}
.promo-dot.d3{width:9px;height:9px;left:48px;bottom:70px;background:#438134}
.promo-dot.d4{width:180px;height:180px;right:-70px;bottom:-80px;border:1px solid rgba(13,91,39,.18)}
.promo-body{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:40px 38px 30px}
.promo-tag{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#438134}
.promo-tag::before{content:"";width:20px;height:1.5px;background:currentColor}
.promo-body h2{font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.22;color:#0D5B27}
.vs .promo-big{margin-top:2px;font-size:40px;font-weight:800;letter-spacing:-.035em;line-height:1.05;background:linear-gradient(100deg,#0D5B27,#438134 45%,#7DB52F);-webkit-background-clip:text;background-clip:text;color:transparent}
.vs .promo-tx{font-size:14.5px;line-height:1.65;color:#4F5F4A}
.vs .promo-dl{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:#6B4E08;background:#FFF4D6;border:1px solid #F1D98C;padding:5px 11px;border-radius:999px}
.promo-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;width:100%}
.promo-act .btn{flex:1 1 auto}
.promo-later{align-self:center;margin-top:2px;padding:6px 10px;border:0;background:none;font:inherit;font-size:13px;color:#5B6B57;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.promo-x{position:absolute;z-index:2;top:14px;right:14px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(13,91,39,.14);background:rgba(255,255,255,.92);color:#1C3324;cursor:pointer}
.promo-x:hover{background:#FFFFFF;color:#0D5B27}
@media (max-width:720px){
.promo{place-items:end center;padding:0}
.promo-box{grid-template-columns:1fr;border-radius:26px 26px 0 0;max-height:92vh;overflow:auto;transform:translateY(40px)}
.promo-art{height:140px}
.promo-art .mascot{width:112px !important;margin-top:30px}
.promo-body{padding:22px 22px 26px}
.promo-body h2{font-size:22px}
.vs .promo-big{font-size:32px}
}
@media (prefers-reduced-motion:reduce){.promo-box,.promo-bg{transition:none}}

/* ---------- dải ảnh feedback chạy ngang, tràn hết màn hình ---------- */
.fb{background:linear-gradient(180deg,#FFFFFF 0%,#F4F9EA 100%);padding-bottom:104px}
.fb .sec-head{margin-bottom:44px}
.mq{display:grid;gap:22px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.mq-row{overflow:hidden;padding:10px 0 18px}
.mq-track{display:flex;width:max-content;animation:mq-left var(--mq-dur,60s) linear infinite}
.mq-rev .mq-track{animation-name:mq-right}
.mq-set{display:flex;gap:22px;padding-right:22px}
.mq-row:hover .mq-track,.mq-row:focus-within .mq-track{animation-play-state:paused}
@keyframes mq-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mq-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.fbc{flex:0 0 auto;width:300px;height:380px;border-radius:22px;overflow:hidden;background:#FFFFFF;border:1px solid rgba(13,91,39,.10);box-shadow:0 1px 2px rgba(13,58,28,.05),0 18px 40px -26px rgba(13,58,28,.4);transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.fbc:hover{transform:translateY(-6px);box-shadow:0 2px 4px rgba(13,58,28,.06),0 28px 54px -26px rgba(13,58,28,.5)}
.fbc-img{display:block;padding:10px;background:linear-gradient(180deg,#F4F7F1,#EAF0E3)}
.fbc-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;border-radius:14px;background:#FFFFFF}
.fbc-q{display:flex;flex-direction:column;gap:12px;margin:0;padding:26px}
.fbc-q .q-mark{font-size:54px;line-height:.6;height:24px;font-weight:800;color:#9BCB3C}
.fbc-q .q-text{margin:0;font-size:15px;line-height:1.7;color:#1C3324;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical}
.fbc-q .q-who{display:flex;gap:10px;align-items:center;padding-top:14px;border-top:1px solid #E7EEDC}
.fbc-q .q-ava{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;font-weight:700;font-size:13px;color:#0B3A18;background:#DCEBB8;overflow:hidden}
.fbc-q .q-ava img{width:100%;height:100%;object-fit:cover}
.fbc-q .q-n{display:block;font-weight:700;font-size:14px;color:#0D5B27}
.fbc-q .q-c{display:block;font-size:12px;color:#5B6B57}
.fbc-q .q-who>span:nth-child(2){flex:1;min-width:0}
.fbc-q .q-badge{margin-left:auto;white-space:nowrap;font-size:11px;font-weight:700;padding:5px 9px;border-radius:999px;color:#0D5B27;background:#EAF3DA;border:1px solid #C9DCA6}
.fbc-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px;color:#2F6E23;font-size:14px;font-weight:600;background:repeating-linear-gradient(135deg,#F6FAEF 0 14px,#ECF3E0 14px 28px)}
.fbc-ph small{font-size:12px;font-weight:500;color:#5B6B57}
.mq-row:nth-child(2) .fbc{height:340px}
.lb{max-width:min(92vw,900px);max-height:92vh;padding:0;border:0;border-radius:18px;background:#FFFFFF;box-shadow:0 40px 100px -30px rgba(0,0,0,.7);overflow:visible}
.lb::backdrop{background:rgba(9,32,16,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lb img{display:block;max-width:min(92vw,900px);max-height:90vh;border-radius:18px;object-fit:contain}
.lb-x{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:0;background:#FFFFFF;color:#0D5B27;box-shadow:0 8px 20px -8px rgba(0,0,0,.5);cursor:pointer}
@media (max-width:680px){
.fbc{width:240px;height:310px}
.mq-row:nth-child(2) .fbc{height:280px}
.fb{padding-bottom:76px}
}
@media (prefers-reduced-motion:reduce){
.mq{-webkit-mask-image:none;mask-image:none}
.mq-row{overflow-x:auto;scrollbar-width:thin}
.mq-track{animation:none}
.mq-set[aria-hidden="true"]{display:none}
}
.vs .promo-admin{font-size:11.5px;font-weight:600;color:#8A1F1F;background:#FDECEC;border:1px solid #F3C2C2;padding:3px 9px;border-radius:999px}

/* ==========================================================
   2.4 — giá ưu đãi, lưới cân đối, hồ sơ giảng viên, chat, báo lỗi
   ========================================================== */
.screen-reader-text{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- Học phí: giá gốc gạch + giá ưu đãi tô nổi ---- */
.price{display:flex;flex-direction:column;gap:3px}
.price-old{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12.5px;font-weight:500;color:#7B8A76;line-height:1.3}
.price-old s{position:relative;text-decoration:none;white-space:nowrap}
.price-old s::after{content:"";position:absolute;left:-3px;right:-3px;top:50%;height:2px;margin-top:-1px;border-radius:2px;background:#E0533D;transform:rotate(-7deg) scaleX(1);transform-origin:left center;transition:transform .55s .15s cubic-bezier(.65,0,.35,1)}
.price-off{font-size:10.5px;font-weight:800;letter-spacing:.02em;color:#FFFFFF;background:#E0533D;padding:2px 7px;border-radius:999px;line-height:1.5;box-shadow:0 4px 10px -4px rgba(224,83,61,.7)}
.facts .price-new,.syl-facts .price-new,.price-new{display:block;font-size:19px;font-weight:800;color:#0D5B27;white-space:nowrap;line-height:1.25}
.price-new span{padding:0 4px;margin:0 -4px;background-image:linear-gradient(100deg,rgba(198,224,90,0) 0,rgba(198,224,90,.85) 4%,rgba(198,224,90,.85) 96%,rgba(198,224,90,0) 100%);background-repeat:no-repeat;background-position:0 88%;background-size:100% 42%;transition:background-size .6s .55s cubic-bezier(.65,0,.35,1)}
.price.pre s::after{transform:rotate(-7deg) scaleX(0)}
.price.pre .price-new span{background-size:0% 42%}
.price.pre.is-seen s::after{transform:rotate(-7deg) scaleX(1)}
.price.pre.is-seen .price-new span{background-size:100% 42%}
.syl-facts .price-old{color:rgba(255,255,255,.7)}
.syl-facts .price-new{color:#FFFFFF}
.syl-facts .price-new span{background-image:linear-gradient(100deg,rgba(155,203,60,0) 0,rgba(155,203,60,.55) 4%,rgba(155,203,60,.55) 96%,rgba(155,203,60,0) 100%)}
.cmp td .price{align-items:center}
.cmp td .price-new{font-size:16px}
@media (prefers-reduced-motion:reduce){.price-old s::after,.price-new span{transition:none}}

/* ---- Lưới cân đối: chia hàng đều, hàng lẻ nằm giữa, thẻ cùng hàng cao bằng nhau ---- */
.team[data-balance],.gal-grid[data-balance]{--cols:4;--gap:22px;display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:var(--gap);padding-bottom:0}
.gal-grid[data-balance]{--gap:18px}
.team[data-balance]>.tm,.gal-grid[data-balance]>.shot{flex:0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));max-width:calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));min-width:0}
[data-balance]>.bk{flex:0 0 100%;height:0}
.team[data-balance],.gal-grid[data-balance]{row-gap:0;margin-bottom:calc(var(--gap) * -1)}
.team[data-balance]>.tm,.gal-grid[data-balance]>.shot{margin-bottom:var(--gap)}
.team .tm:nth-child(n){translate:none}
.gal-grid[data-balance] .shot:nth-child(n){margin-top:0}
.gal-grid[data-balance] .shot[hidden]{display:none}
@media (max-width:1100px){.team[data-balance],.gal-grid[data-balance]{--cols:3}}
@media (max-width:760px){.team[data-balance],.gal-grid[data-balance]{--cols:2;--gap:14px}}

/* ---- Thẻ giảng viên ---- */
.tm{position:relative;display:flex;flex-direction:column;cursor:pointer}
.tm.is-ph{cursor:default}
.tm-photo.has-img{background:radial-gradient(260px 220px at 85% 10%,rgba(198,224,90,.45),transparent 65%),linear-gradient(180deg,#EEF5E2,#DCEBC4)}
.tm-photo.has-img img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tm:hover .tm-photo.has-img img{transform:scale(1.035)}
.tm-cert,.tp-photo .tm-cert{left:12px;right:auto;bottom:12px;max-width:calc(100% - 24px);display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.3;color:#0D5B27;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px -10px rgba(13,58,28,.5);-webkit-backdrop-filter:none;backdrop-filter:none}
.tm-cert svg{flex:none;color:#6DA22A}
.tm-body{flex:1;display:flex;flex-direction:column}
.tm-stats{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tm-stats span{font-size:11.5px;font-weight:500;color:#4A5B45;padding:4px 9px;border-radius:999px;background:#F2F7EA;border:1px solid #E1ECCF;line-height:1.4}
.tm-stats b{font-weight:800;color:#0D5B27;margin-right:4px}
.tm-more{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:14px 0 0;border:0;background:none;font:inherit;font-size:13.5px;font-weight:700;color:#2E6A23;cursor:pointer}
.tm-more::after{content:"";position:absolute;inset:0;border-radius:inherit}
.tm-more svg{transition:transform .25s}
.tm:hover .tm-more svg{transform:translateX(4px)}
.tm-more:focus-visible{outline:none}
.tm:has(.tm-more:focus-visible){outline:3px solid #9BCB3C;outline-offset:3px}
.tm-exp{margin-top:6px}
@media (max-width:760px){
.tm-body{padding:12px 12px 14px}
.tm-name{font-size:14.5px}
.tm-role,.tm-exp{font-size:12px}
.tm-stats span{font-size:10.5px;padding:3px 7px}
.tm-more{font-size:12.5px;padding-top:10px}
.tm-cert{font-size:10.5px;padding:5px 8px;left:8px;bottom:8px;max-width:calc(100% - 16px)}
.tm-cert svg{display:none}
}

/* ---- Hồ sơ giảng viên ---- */
.tp{width:min(1040px,94vw);max-width:none;max-height:min(88vh,780px);padding:0;border:0;border-radius:28px;background:#FFFFFF;overflow:hidden;box-shadow:0 50px 120px -40px rgba(4,30,12,.75)}
.tp::backdrop{background:rgba(9,32,16,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.tp[open] .tp-card{animation:tp-in .4s cubic-bezier(.2,.8,.2,1)}
@keyframes tp-in{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.tp-card{position:relative}
.tp-in{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);height:min(88vh,780px)}
.tp-photo{position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(320px 260px at 90% 8%,rgba(155,203,60,.45),transparent 60%),linear-gradient(160deg,#0D5B27,#438134)}
.tp-photo.has-img{background:radial-gradient(320px 280px at 85% 8%,rgba(198,224,90,.5),transparent 62%),linear-gradient(180deg,#EEF5E2,#D3E6B6)}
.tp-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.tp-photo .tm-ini{font-size:84px}
.tp-photo .tm-cert{position:absolute;left:18px;bottom:18px;font-size:13px;padding:9px 14px}
.tp-body{overflow-y:auto;padding:46px 46px 34px;overscroll-behavior:contain}
.vs .tp-name{margin:8px 0 10px;font-size:30px;line-height:1.15;font-weight:800;letter-spacing:-.015em;color:#0D5B27}
.vs .tp-sub{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;font-size:14px;color:#4A5B45}
.tp-sub span{display:inline-flex;align-items:center;gap:7px}
.tp-sub svg{color:#6DA22A}
.tp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 22px}
.tp-stats.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.tp-stats.n1{grid-template-columns:minmax(0,1fr)}
.tp-stats div{position:relative;overflow:hidden;padding:18px 18px 16px;border-radius:20px;background:linear-gradient(155deg,#0D5B27,#2E6A23);color:#FFFFFF}
.tp-stats div::after{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;background:rgba(198,224,90,.16)}
.tp-stats b{display:block;font-size:32px;line-height:1.05;font-weight:800;letter-spacing:-.02em;color:#C6E05A}
.tp-stats small{display:block;margin-top:6px;font-size:12.5px;line-height:1.4;color:rgba(255,255,255,.82)}
.tp-stats div:nth-child(2){background:#F2F7EA;color:#1C3324;border:1px solid #DFEACB}
.tp-stats div:nth-child(2) b{color:#0D5B27}
.tp-stats div:nth-child(2) small{color:#4A5B45}
.tp-stats div:nth-child(3){background:#C6E05A;color:#0B3A18}
.tp-stats div:nth-child(3) b{color:#0B3A18}
.tp-stats div:nth-child(3) small{color:#2E4A1C}
.tp-stats div:nth-child(n+2)::after{background:rgba(255,255,255,.35)}
.vs .tp-motto{position:relative;margin:0 0 6px;padding:16px 20px 16px 54px;border-radius:18px;background:#F7FAF2;font-size:15.5px;line-height:1.6;font-style:italic;color:#1C3324}
.tp-motto::before{content:"“";position:absolute;left:16px;top:8px;font-size:56px;line-height:1;font-style:normal;font-weight:800;color:#9BCB3C}
.vs .tp-h{margin:24px 0 10px;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#6B7B66}
.tp-ach,.tp-edu{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tp-ach li{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:14px;background:#FFFFFF;border:1px solid #E5EDDA;font-size:14.5px;line-height:1.5;color:#1C3324}
.tp-ach li.top{padding:14px 16px 14px 12px;background:linear-gradient(120deg,#FBFDF5,#EAF4D6);border-color:#C9DCA6;font-weight:600;font-size:15px;color:#0B3A18}
.tp-ic{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#EAF3DA;color:#2E6A23}
.tp-ach li.top .tp-ic{width:38px;height:38px;background:#0D5B27;color:#C6E05A;box-shadow:0 8px 18px -8px rgba(13,91,39,.8)}
.tp-edu li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.55;color:#2B3D2F}
.tp-edu svg{flex:none;margin-top:3px;color:#6DA22A}
.vs .tp-bio p{margin:0 0 10px;font-size:14.5px;line-height:1.75;color:#33463A}
.vs .tp-empty{margin:22px 0 0;padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.6;color:#8A1F1F;background:#FDECEC;border:1px solid #F3C2C2}
.tp-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;padding-top:20px;border-top:1px solid #EEF2E8}
.tp-tools{position:absolute;top:16px;right:16px;z-index:3;display:flex;gap:8px}
.tp-nav,.tp-x{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(13,91,39,.18);background:rgba(255,255,255,.94);color:#0D5B27;cursor:pointer;box-shadow:0 6px 16px -10px rgba(13,58,28,.6);transition:transform .2s,background .2s}
.tp-nav:hover{transform:translateY(-1px);background:#F2F7EA}
.tp-x{background:#0D5B27;border-color:#0D5B27;color:#FFFFFF}
.tp-nav[hidden]{display:none}
@media (max-width:760px){
.tp{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
.tp-in{display:block;height:100dvh;overflow-y:auto;overscroll-behavior:contain}
.tp-photo{height:min(62vh,420px)}
.tp-body{overflow:visible;padding:24px 20px 40px}
.vs .tp-name{font-size:24px}
.tp-stats{gap:8px}
.tp-stats div{padding:14px 12px 12px;border-radius:16px}
.tp-stats b{font-size:24px}
.tp-stats small{font-size:11.5px}
.tp-tools{position:fixed;top:12px;right:12px}
.tp-act .btn{flex:1}
}

/* ---- Mũi tên điều hướng bảng điểm ---- */
.tst-nav .btn-round{width:50px;min-height:50px;padding:0}
.btn-round svg{width:22px !important;height:22px !important;flex:none;transition:transform .2s}
.btn-round:hover svg{transform:translateX(2px)}
.btn-round[data-track-prev]:hover svg{transform:translateX(-2px)}

/* ---- Nút nổi: báo lỗi (trái) + chat (phải) ---- */
.fl{position:fixed;bottom:22px;z-index:120;font-size:14px}
.fl-bug{left:22px}
.fl-chat{right:22px}
.fl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font:inherit}
.fl-btn-bug{height:42px;padding:0 15px 0 12px;border-radius:999px;font-size:13px;font-weight:600;color:#33463A;background:rgba(255,255,255,.94);border:1px solid rgba(13,91,39,.16);box-shadow:0 10px 26px -14px rgba(13,58,28,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .2s,box-shadow .2s,color .2s}
.fl-btn-bug svg{color:#C0533F}
.fl-btn-bug:hover,.fl-bug.is-open .fl-btn-bug{transform:translateY(-2px);color:#0D5B27;box-shadow:0 14px 30px -14px rgba(13,58,28,.6)}
.fl-btn-chat{position:relative;width:62px;height:62px;border-radius:50%;color:#FFFFFF;background:linear-gradient(180deg,#4C9439 0%,#2E6A23 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 18px 36px -14px rgba(13,58,28,.75);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.fl-btn-chat::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(155,203,60,.6);animation:fl-ring 2.4s ease-out infinite}
.fl-btn-chat:hover{transform:translateY(-2px) scale(1.04)}
@keyframes fl-ring{0%{opacity:.9;transform:scale(.9)}80%,100%{opacity:0;transform:scale(1.25)}}
.fl-ic-close{display:none}
.fl-chat.is-open .fl-btn-chat::before,.fl-chat.seen .fl-btn-chat::before{animation:none;opacity:0}
.fl-ic-open,.fl-ic-close{display:grid;place-items:center}
.fl-ic-close,.fl-chat.is-open .fl-ic-open{display:none}
.fl-chat.is-open .fl-ic-close{display:grid}
.fl-dot{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;display:grid;place-items:center;font-size:11px;font-weight:800;color:#FFFFFF;background:#E0533D;border:2px solid #FFFFFF}
.fl-chat.seen .fl-dot{display:none}
.vs .fl-teaser{position:absolute;right:76px;bottom:8px;width:250px;margin:0;padding:12px 30px 12px 14px;border-radius:18px 18px 4px 18px;font-size:13.5px;line-height:1.5;color:#1C3324;background:#FFFFFF;border:1px solid rgba(13,91,39,.12);box-shadow:0 18px 40px -20px rgba(13,58,28,.55);animation:fl-pop .35s cubic-bezier(.2,.8,.2,1)}
.fl-teaser[hidden]{display:none}
.fl-teaser-x{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;border:0;background:#F2F5EE;color:#4A5B45;cursor:pointer}
.fl-panel{position:absolute;bottom:76px;width:370px;max-height:min(620px,calc(100dvh - 120px));display:flex;flex-direction:column;overflow:hidden;border-radius:24px;background:#FFFFFF;border:1px solid rgba(13,91,39,.10);box-shadow:0 40px 90px -30px rgba(4,30,12,.55);animation:fl-pop .28s cubic-bezier(.2,.8,.2,1)}
.fl-chat .fl-panel{right:0;transform-origin:bottom right}
.fl-bug .fl-panel{left:0;bottom:56px;transform-origin:bottom left}
.fl-panel[hidden]{display:none}
@keyframes fl-pop{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.fl-head{display:flex;align-items:center;gap:12px;padding:16px 16px 16px 18px;color:#FFFFFF;background:radial-gradient(220px 120px at 100% 0%,rgba(155,203,60,.35),transparent 70%),linear-gradient(160deg,#0D5B27,#2E6A23)}
.fl-head-light{color:#1C3324;background:linear-gradient(160deg,#FBFDF7,#EEF5E3);border-bottom:1px solid #E5EDDA}
.fl-ava{position:relative;flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#FFFFFF;box-shadow:0 6px 14px -8px rgba(0,0,0,.45)}
.fl-ava .mascot{display:block;margin-top:2px}
.fl-ava-bug{color:#C0533F;background:#FFF1EE}
.fl-on{position:absolute;right:0;bottom:1px;width:12px;height:12px;border-radius:50%;background:#9BCB3C;border:2px solid #FFFFFF}
.vs .fl-name{margin:0;font-size:15px;font-weight:700;line-height:1.3}
.vs .fl-st{margin:2px 0 0;font-size:12px;opacity:.82}
.fl-x{margin-left:auto;flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:0;color:inherit;background:rgba(255,255,255,.16);cursor:pointer}
.fl-head-light .fl-x{background:#FFFFFF;border:1px solid #E1E9D6}
.fl-log{flex:1;min-height:200px;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:18px 16px;background:radial-gradient(rgba(13,91,39,.07) 1px,transparent 1.2px) 0 0/16px 16px,#F6F9F1}
.bub{max-width:84%;padding:10px 13px;border-radius:18px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;animation:fl-pop .25s ease-out}
.bub-in{align-self:flex-start;color:#1C3324;background:#FFFFFF;border:1px solid #E5EDDA;border-top-left-radius:6px}
.bub-out{align-self:flex-end;color:#FFFFFF;background:linear-gradient(180deg,#3F8530,#2E6A23);border-top-right-radius:6px}
.bub-ok{align-self:flex-start;color:#0B3A18;background:#EAF4D6;border:1px solid #C9DCA6;border-top-left-radius:6px}
.bub-typing{display:inline-flex;gap:4px;padding:12px 14px}
.bub-typing i{width:6px;height:6px;border-radius:50%;background:#8FA586;animation:fl-dots 1s infinite}
.bub-typing i:nth-child(2){animation-delay:.15s}
.bub-typing i:nth-child(3){animation-delay:.3s}
@keyframes fl-dots{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.fl-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.fl-q{padding:7px 12px;border-radius:999px;border:1px solid #C9DCA6;background:#FFFFFF;color:#2E6A23;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,border-color .2s}
.fl-q:hover{background:#EAF3DA;border-color:#9BCB3C}
.fl-compose{padding:10px 12px 12px;border-top:1px solid #EEF2E8;background:#FFFFFF}
.fl-row{display:flex;align-items:flex-end;gap:8px}
.fl-inp{display:block;width:100%;padding:10px 13px;border:1px solid #D9E3CC;border-radius:14px;background:#FFFFFF;font:inherit;font-size:14px;color:#1C3324;transition:border-color .2s,box-shadow .2s}
.fl-inp:focus{outline:none;border-color:#4C9439;box-shadow:0 0 0 3px rgba(155,203,60,.3)}
.fl-text{resize:none;min-height:44px;max-height:120px;line-height:1.45}
.fl-sendic{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:0;color:#FFFFFF;background:linear-gradient(180deg,#4C9439,#2E6A23);cursor:pointer;transition:transform .2s,opacity .2s}
.fl-sendic:hover{transform:scale(1.06)}
.fl-sendic:disabled,.fl-send:disabled{opacity:.55;cursor:wait}
.fl-who{margin-bottom:8px;padding:10px 10px 10px 12px;border-radius:14px;background:#F7FAF2;border:1px dashed #C9DCA6;animation:fl-pop .25s ease-out}
.fl-who[hidden]{display:none}
.vs .fl-who p{margin:0;font-size:12.5px;font-weight:600;color:#2E4A1C}
.fl-who-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.fl-who .fl-inp{padding:8px 11px;font-size:13.5px;border-radius:11px}
.vs .fl-msg{margin:0 0 6px;font-size:12.5px;font-weight:600;color:#B3261E}
.vs .fl-msg:empty{display:none}
.vs .fl-msg.ok{color:#2E6A23}
.fl-alt{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 14px 12px;border-top:1px solid #EEF2E8;font-size:12px;color:#6B7B66;background:#FBFCF8}
.fl-alt a{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;font-weight:700;font-size:12px;text-decoration:none;transition:transform .2s}
.fl-alt a:hover{transform:translateY(-1px)}
.fl-zalo{color:#FFFFFF;background:#0068FF}
.fl-mess{color:#FFFFFF;background:linear-gradient(90deg,#0084FF,#A334FA)}
.fl-tel{color:#0D5B27;background:#FFFFFF;border:1px solid #C9DCA6}
.fl-form{display:grid;gap:10px;padding:16px 18px 18px;overflow-y:auto}
.fl-kinds{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;border:0;min-width:0}
.fl-kinds legend{float:left;width:100%;margin-bottom:8px;font-size:13px;font-weight:700;color:#1C3324}
.fl-chip{position:relative}
.fl-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.fl-chip span{display:inline-block;padding:7px 12px;border-radius:999px;border:1px solid #D9E3CC;background:#FFFFFF;font-size:12.5px;font-weight:600;color:#33463A;transition:all .2s}
.fl-chip input:checked+span{color:#FFFFFF;background:#0D5B27;border-color:#0D5B27}
.fl-chip input:focus-visible+span{outline:3px solid #9BCB3C;outline-offset:2px}
.fl-lbl{font-size:13px;font-weight:700;color:#1C3324}
.fl-lbl small{font-weight:500;color:#7B8A76}
.vs .fl-meta{display:flex;gap:6px;align-items:flex-start;margin:0;font-size:11.5px;line-height:1.5;color:#7B8A76}
.fl-meta svg{flex:none;margin-top:1px}
.fl-send{width:100%}
.fl-thanks{display:grid;justify-items:center;gap:10px;padding:34px 24px 30px;text-align:center}
.fl-thanks .tick{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#FFFFFF;background:linear-gradient(180deg,#4C9439,#2E6A23);box-shadow:0 14px 30px -12px rgba(13,58,28,.7)}
.vs .fl-thanks p{margin:0;font-size:14px;line-height:1.6;color:#33463A}
.vs .fl-thanks b{font-size:16px;color:#0D5B27}
html.vs-lock .fl{visibility:hidden}
@media (max-width:560px){
.fl{bottom:14px}
.fl-bug{left:14px}
.fl-chat{right:14px}
.fl-btn-bug{width:42px;padding:0}
.fl-btn-bug span{display:none}
.fl-btn-chat{width:56px;height:56px}
.fl-panel{position:fixed;left:8px;right:8px;bottom:80px;width:auto;max-height:calc(100dvh - 100px)}
.fl-bug .fl-panel{bottom:66px}
.vs .fl-teaser{width:210px;right:68px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){.fl-btn-chat::before{animation:none}.fl-panel,.bub,.fl-teaser{animation:none}}
@media print{.fl{display:none}}
@media (max-width:760px){.tp-tools{padding:4px;gap:6px;border-radius:999px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 24px -14px rgba(13,58,28,.6)}.tp-nav,.tp-x{width:38px;height:38px;box-shadow:none}}

/* ---------- 2.5: lịch dự kiến, bảng lịch trong bài, khối kêu gọi ---------- */
.ss-tags .ss-tent{color:#8A5300;background:#FFF4DD;border-color:#F0D49A}
.lt-sc table td small{color:#4A5B45;font-size:13px}
.lt-sc tr.is-past td{color:#7A8775}
.lt-sc td a{font-weight:700;color:#2E6A23;white-space:nowrap}
.lt-sc-tag{display:inline-block;margin-left:4px;padding:1px 8px;border-radius:999px;font-size:12px;font-weight:700;color:#8A5300;background:#FFF4DD;vertical-align:1px}
.lt-sc figcaption{margin-top:8px;font-size:13px;line-height:1.55;color:#4A5B45;text-align:left}
.lt-sc-empty{padding:14px 18px;border-radius:14px;background:#F6F9F1;border:1px dashed #D9E3CC}
.vs-cta-box{margin:28px 0;padding:22px 24px;border-radius:20px;color:#FFFFFF;background:radial-gradient(420px 220px at 100% 0,rgba(155,203,60,.28),transparent 60%),linear-gradient(165deg,#0A4A20 0%,#0D5B27 55%,#1E6B2E 100%)}
.vs-cta-box p{margin:0 0 8px;color:rgba(255,255,255,.88)}
.vs-cta-box .vs-cta-t{font-size:20px;font-weight:700;line-height:1.35;color:#FFFFFF}
.vs-cta-box .vs-cta-b{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0}
.vs-cta-box .btn-pri{color:#0B3A18;background:#C6E05A;border-color:#C6E05A}
.vs-cta-box .btn-out{color:#FFFFFF;border-color:rgba(255,255,255,.55);background:transparent}
.prose .vs-cta-box a{text-decoration:none}
@media (max-width:640px){
.prose .lt-sc table,.lt-sc tbody,.lt-sc tr,.lt-sc td{display:block;width:100%;box-sizing:border-box}
.lt-sc thead{display:none}
.prose .lt-sc tr{padding:12px 16px;border-top:1px solid #E7EEDC}
.prose .lt-sc tr:first-child{border-top:0}
.prose .lt-sc td{padding:2px 0;border:0;background:none!important;font-size:15px}
.lt-sc td[data-l]::before{content:attr(data-l) ": ";font-weight:600;color:#4A5B45}
.lt-sc .lt-sc-date{font-size:16px}
.lt-sc .lt-sc-name{font-weight:600}
.lt-sc .lt-sc-go{padding-top:6px!important}
.prose .lt-sc tr:nth-child(even){background:#F6FAEF}
}

/* 2.5.2: tiêu đề bài viết căn giữa đúng (refine .phero h1 từng ghi đè margin auto) */
.ahead h1{margin-left:auto;margin-right:auto;max-width:24ch;text-wrap:balance}
.ahead .crumbs{flex-wrap:nowrap;max-width:100%}
.ahead .crumbs a,.ahead .crumbs span{flex:none}
.ahead .crumbs b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:32ch}
@media (max-width:640px){.ahead .crumbs b{max-width:14ch}.ahead h1{max-width:none}}