@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/be-vietnam-pro-vietnamese-400-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/be-vietnam-pro-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/be-vietnam-pro-vietnamese-600-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/be-vietnam-pro-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/be-vietnam-pro-vietnamese-700-normal.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/be-vietnam-pro-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--g:#006738;--g2:#38b449;--g3:#8cc63e;--tx:#1d2a22;--mut:#58585b;--bg:#fff;--alt:#f3f7f4;--line:#dbe5de;--r:12px}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--tx:#e8efe9;--mut:#a9b3ac;--bg:#0f1713;--alt:#15211a;--line:#27382d}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 "Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--tx);background:var(--bg)}
a{color:var(--g)}@media (prefers-color-scheme:dark){a{color:var(--g3)}}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}.narrow{max-width:680px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:9}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.top{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--line);z-index:5}
.bar{display:flex;align-items:center;gap:16px;min-height:60px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:20px;text-decoration:none;color:var(--g)}
@media (prefers-color-scheme:dark){.brand{color:var(--g3)}}
.mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--g);color:#fff;font-size:17px}
.nav{display:flex;gap:18px;margin-left:8px}.nav a{color:var(--tx);text-decoration:none;font-size:15px}.nav a:hover{color:var(--g)}
.tools{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sw a{padding:4px 8px;text-decoration:none;color:var(--mut);font-size:13px;border:1px solid var(--line)}
.sw a:first-child{border-radius:6px 0 0 6px}.sw a:last-child{border-radius:0 6px 6px 0;border-left:0}.sw a.on{background:var(--g);color:#fff;border-color:var(--g)}
select,input,textarea{font:inherit;color:var(--tx);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 10px;width:100%}
.cur select{width:auto;padding:5px 8px}
.btn{display:inline-block;background:var(--g);color:#fff;text-decoration:none;border:0;border-radius:10px;padding:12px 20px;font-weight:600;cursor:pointer;font-size:16px}
.btn:hover{background:#00502b}.btn.sm{padding:7px 14px;font-size:14px}.btn.ghost{background:transparent;color:var(--g);border:1px solid var(--g)}
.btn.light{background:#fff;color:var(--g)}.btn.light:hover{background:#eaf5ec}
:focus-visible{outline:3px solid var(--g2);outline-offset:2px}
.hero{padding:72px 0 56px;background:linear-gradient(180deg,var(--alt),var(--bg))}
.badge{display:inline-block;background:#e4f3e7;color:var(--g);padding:4px 12px;border-radius:99px;font-size:13px;font-weight:600;margin:0 0 16px}
h1{font-size:clamp(30px,5vw,48px);line-height:1.15;margin:0 0 16px;color:var(--g)}
@media (prefers-color-scheme:dark){h1{color:#d9f0dd}}
h1,h2,h3{text-wrap:balance}p,li{text-wrap:pretty}h2{font-size:clamp(24px,3.4vw,32px);margin:0 0 20px}h3{margin:0 0 6px;font-size:18px}
.lead{font-size:19px;color:var(--mut);max-width:680px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 12px}
.note,.fx,.by{color:var(--mut);font-size:14px}
.sec{padding:56px 0}.alt{background:var(--alt)}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.steps li{background:var(--alt);border-radius:var(--r);padding:20px}.n{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--g);color:#fff;font-weight:700;margin-bottom:8px}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.two{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:20px}.card p,.card li{color:var(--mut)}
.card ul,.plan ul{padding-left:20px}
.band{background:var(--g);color:#fff;padding:56px 0;text-align:center}.band h2{color:#fff}
.from{font-size:20px;font-weight:600;color:var(--g)}
.plans{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:24px 0}
.plan{border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column}
.plan.feat{border:2px solid var(--g2)}.plan h2{font-size:22px;margin:0}.tag{margin:0 0 6px;color:var(--g);font-weight:700;font-size:13px}
.for{color:var(--mut);margin:4px 0 12px}.price{font-size:30px;font-weight:700;margin:0;color:var(--g)}.price span{font-size:14px;color:var(--mut);font-weight:400}
.cr,.day{margin:2px 0;color:var(--mut)}.plan ul{margin:14px 0;flex:1}
.ticks{list-style:none;padding:0}.ticks li{padding:6px 0 6px 26px;position:relative}.ticks li:before{content:"";position:absolute;left:4px;top:13px;width:8px;height:8px;border-radius:50%;background:var(--g2)}
.rows{margin:0 0 32px}.row{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line)}
.row p{margin:0;color:var(--mut)}.amt{font-weight:700;color:var(--tx)!important;white-space:nowrap}
.form{display:grid;gap:14px;margin:24px 0}.form label{display:grid;gap:4px;font-weight:600;font-size:14px}.form .note{margin:0}
.hp{position:absolute;left:-9999px}
.ok{background:#e4f3e7;border:1px solid var(--g2);border-radius:var(--r);padding:16px;color:#0b3a1f;margin:20px 0}
.err{background:#fdecea;border:1px solid #c00000;border-radius:var(--r);padding:8px 16px;color:#7a0000}
.foot{background:var(--alt);padding:40px 0;margin-top:0;border-top:1px solid var(--line)}.foot-grid{display:flex;gap:32px;flex-wrap:wrap;justify-content:space-between}
.logo{height:56px;width:auto}address{font-style:normal;color:var(--mut)}.legal{font-size:13px;color:var(--mut);margin:12px 0 0}
@media (max-width:640px){.nav{display:none}.row{flex-direction:column}.hero{padding:48px 0 40px}}

.hero-grid{display:grid;gap:48px;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center}
.dayplan{padding:8px 0}
.dayplan-h{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px}.demo{color:var(--mut);font-size:13px;border:1px solid var(--line);border-radius:4px;padding:2px 8px}
.rail{list-style:none;margin:0;padding:0 0 0 22px;border-left:2px solid var(--line);display:grid;gap:12px}
.ev{display:grid;grid-template-columns:54px 1fr;gap:10px;position:relative}.ev:before{content:"";position:absolute;left:-29px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--g)}
.ev time{color:var(--mut);font-weight:600;font-size:14px;padding-top:1px}
.evb{background:var(--alt);border-radius:8px;padding:10px 14px}.evb p{margin:2px 0 0;color:var(--mut);font-size:14px}.evb strong{display:block;font-size:15px}
.st{display:inline-block;margin-top:4px;font-size:12px;font-weight:600;padding:1px 8px;border-radius:4px;background:#e4f3e7;color:var(--g)}.ev.wait .st{background:#fff;border:1px solid var(--g)}
.ev.feat .evb{border:2px solid var(--g);background:#e4f3e7}
.draft{margin-top:8px}.draft summary{cursor:pointer;color:var(--g);font-weight:600;font-size:14px}.draft .to{font-weight:600;color:var(--tx)}.acts{display:flex;gap:8px;margin-top:8px!important}
@media (prefers-color-scheme:dark){.btn.ghost{color:var(--g3);border-color:var(--g3)}.ev.feat .evb{background:#15211a}.st,.ev.wait .st{background:transparent;color:var(--g3);border:1px solid var(--g3)}}
@media (max-width:820px){.hero-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.ev{animation:evin .5s cubic-bezier(.2,.7,.2,1) both}.ev:nth-child(2){animation-delay:.08s}.ev:nth-child(3){animation-delay:.16s}.ev:nth-child(4){animation-delay:.24s}@keyframes evin{from{opacity:0;transform:translateY(8px)}}}
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.flow li{border-top:2px solid var(--line);padding-top:20px}.flow li:last-child{border-top-color:var(--g)}.flow p{margin:0;color:var(--mut)}
.chip{display:inline-block;margin-bottom:12px;font-size:13px;font-weight:600;padding:2px 10px;border-radius:4px;background:#e4f3e7;color:var(--g)}.chip.wait{background:transparent;border:1px solid var(--g)}
.defs{margin:0;display:grid}.defs>div{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:32px;padding:20px 0;border-top:1px solid var(--line)}.defs>div:last-child{border-bottom:1px solid var(--line)}
.defs dt{font-weight:700;font-size:18px;color:var(--g)}.defs dd{margin:0;color:var(--mut)}
.fit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}.fit h3{margin-bottom:8px}.ticks.no li:before{background:var(--mut)}
@media (prefers-color-scheme:dark){.chip{background:transparent;border:1px solid var(--g3);color:var(--g3)}.defs dt{color:var(--g3)}}
@media (max-width:820px){.flow,.fit{grid-template-columns:1fr}.defs>div{grid-template-columns:1fr;gap:4px}}
.plan .tag{display:inline-block;align-self:flex-start;margin:0 0 10px;padding:2px 10px;border-radius:4px;background:#e4f3e7;font-size:13px}
@media (prefers-color-scheme:dark){.from,.price{color:var(--g3)}.plan .tag{background:transparent;border:1px solid var(--g3);color:var(--g3)}.plan.feat{border-color:var(--g3)}}
.flag{border:1px solid var(--line);border-radius:4px;padding:8px 12px;color:var(--mut);font-size:14px;margin:0 0 16px}
.tbl{overflow-x:auto}.cmp{border-collapse:collapse;width:100%;min-width:560px}
.cmp th,.cmp td{text-align:left;padding:12px 14px;border-top:1px solid var(--line);vertical-align:top;font-size:15px}
.cmp thead th{font-size:16px;color:var(--g)}.cmp thead td{border-top:0}.cmp .pm{display:block;font-weight:400;font-size:14px;color:var(--mut)}
.cmp tbody th{font-weight:600;width:26%}.uv{display:inline-block;margin-left:6px;font-size:12px;font-weight:600;color:var(--mut);border:1px solid var(--line);border-radius:4px;padding:0 6px}
@media (prefers-color-scheme:dark){.cmp thead th{color:var(--g3)}}
.contact-grid{display:grid;gap:48px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}.contact-grid .form{margin-top:0}
.chan{list-style:none;margin:0;padding:0}.chan li{padding:10px 0;border-top:1px solid var(--line)}.chan li:last-child{border-bottom:1px solid var(--line)}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr;gap:24px}}
@media (max-width:640px){.cmp{min-width:0}.cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:auto}.cmp tbody th{width:auto;padding:16px 0 4px;border-top:1px solid var(--line);font-size:16px}
.cmp td{border-top:0;padding:2px 0 2px 0}.cmp td:before{content:attr(data-label)": ";font-weight:600;color:var(--mut)}}

/* Hình minh hoạ các bước "Cách làm" (nền cùng tông --alt để ảnh nằm vừa trong khung ở cả sáng và tối) */
.ill{margin:0 0 16px;border-radius:8px;overflow:hidden;background:#f3f7f4;aspect-ratio:1/1}
.ill img{display:block;width:100%;height:100%;object-fit:cover}
:root{--feat:#e4f3e7;--feat-hi:#c9e8cf}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--feat:#15211a;--feat-hi:#244231}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (prefers-reduced-motion:no-preference){
/* Khoảnh khắc chính ở hero: sau khi các việc hiện ra, bước chờ duyệt được quét sáng một lần và chấm mốc nảy nhẹ, để mắt dừng ở điểm người quyết */
.ev.feat .evb{background:linear-gradient(100deg,var(--feat) 0 40%,var(--feat-hi) 50%,var(--feat) 60% 100%) 100% 0/250% 100%;animation:hold 1.1s cubic-bezier(.16,1,.3,1) .95s both}
.ev.feat:before{animation:dot .8s cubic-bezier(.16,1,.3,1) .95s both}
@keyframes hold{from{background-position:100% 0}to{background-position:0 0}}
@keyframes dot{40%{transform:scale(1.7)}}
}
/* Hiện dần từng bước khi cuộn tới (lớp .reveal do script thêm; không có script thì nội dung hiện sẵn) */
.reveal .flow li{opacity:0;transform:translateY(16px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal .flow li.in{opacity:1;transform:none}
.reveal .flow li:nth-child(2){transition-delay:.12s}.reveal .flow li:nth-child(3){transition-delay:.24s}
.reveal .flow li .ill img{transform:scale(1.05);transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.reveal .flow li.in .ill img{transform:none}