/* ===== Landing page: nền mint nhạt, mảng xanh đậm làm điểm tựa, vàng xu chỉ dùng ở nút và đồng xu ===== */
.wrap.full{max-width:none;padding:0}
.wrap.full>.alert{max-width:1140px;margin:1rem auto}
.lp{--lp-bg:#eaf3fc;--lp-fg:#0a2342;--lp-mute:#4b6483;--lp-panel:#0a2342;--lp-panel-fg:#e8f1fc;--lp-soft:#d7e7f8;--lp-line:#bdd2ea;--lp-jade:#0b63c8;--lp-gold:#f5b301;--lp-goldd:#b57f00;--lp-card:#fbfdff;
  background:var(--lp-bg);color:var(--lp-fg)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .lp{--lp-bg:#0b1524;--lp-fg:#e6eefb;--lp-mute:#98aecb;--lp-panel:#0b2a50;--lp-soft:#13253f;--lp-line:#243d5c;--lp-jade:#4da3ff;--lp-card:#101d31}}
:root[data-theme="dark"] .lp{--lp-bg:#0b1524;--lp-fg:#e6eefb;--lp-mute:#98aecb;--lp-panel:#0b2a50;--lp-soft:#13253f;--lp-line:#243d5c;--lp-jade:#4da3ff;--lp-card:#101d31}
.lp-in{max-width:1140px;margin:0 auto;padding:0 1.4rem}
.lp h1,.lp h2,.lp h3{margin:0}
.lp-h{font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.1;font-weight:800;letter-spacing:-.025em;max-width:16ch}
.lp .btn{background:var(--lp-gold);border-color:var(--lp-gold);color:#241a00}
.lp .btn:hover{background:#ffc82e;border-color:#ffc82e;box-shadow:0 6px 18px rgba(181,127,0,.3)}
.lp .btn.ghost{background:transparent;border-color:var(--lp-line);color:var(--lp-fg)}
.lp .btn.ghost:hover{background:var(--lp-soft);border-color:var(--lp-jade);box-shadow:none}
.lp-btn{padding:.85rem 1.5rem;font-size:1.02rem;border-radius:14px}

/* Hero */
.lp-hero{padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,6vw,5.5rem)}
.lp-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.lp-title{font-size:clamp(2.5rem,6.2vw,4.9rem);line-height:1;font-weight:800;letter-spacing:-.04em}
.ln{display:block;overflow:hidden;padding-bottom:.1em}.ln>span{display:block}
.lp-sub{max-width:50ch;margin:1.4rem 0 1.6rem;font-size:1.15rem;line-height:1.6;color:var(--lp-mute)}
.lp-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin:0}
.js .ln>span{transform:translateY(112%);animation:lnup .95s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i)*.14s + .1s)}
.js .lp-sub,.js .lp-cta{opacity:0;animation:a-rise .8s cubic-bezier(.2,.8,.25,1) forwards;animation-delay:calc(var(--s)*.14s + .2s)}
.js .lp-sim{opacity:0;animation:simin 1s cubic-bezier(.2,.8,.2,1) .4s forwards}
@keyframes lnup{to{transform:none}}
@keyframes simin{from{opacity:0;transform:translateX(44px)}to{opacity:1;transform:none}}

/* Máy tính thu nhập: điểm nhấn của trang */
.lp-sim{background:var(--lp-panel);color:var(--lp-panel-fg);border-radius:30px;padding:1.6rem 1.7rem 1.3rem;box-shadow:0 30px 60px -28px rgba(10,35,66,.55)}
.lp-sim h2{font-size:1rem;font-weight:700;opacity:.85;margin-bottom:1rem}
.sim-grid{display:grid;grid-template-columns:132px 1fr;gap:1.4rem;align-items:end}
.sim-ctl label{display:block;margin:0 0 1rem;font-size:.9rem;font-weight:500;color:var(--lp-panel-fg);opacity:.9}
.sim-ctl label b{color:#ffcf4a;font-variant-numeric:tabular-nums}
.sim-ctl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;margin:.7rem 0 0;padding:0;border:0;border-radius:6px;background:rgba(255,255,255,.18);cursor:pointer}
.sim-ctl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:var(--lp-gold);border:3px solid var(--lp-panel);box-shadow:0 0 0 2px var(--lp-gold)}
.sim-ctl input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--lp-gold);border:3px solid var(--lp-panel);box-shadow:0 0 0 2px var(--lp-gold)}
.sim-ctl input[type=range]:focus-visible{outline:2px solid #ffcf4a;outline-offset:6px}
.sim-out{margin:.4rem 0 0;font-size:clamp(2.2rem,4.4vw,3.2rem);line-height:1;font-weight:800;letter-spacing:-.03em;color:#ffcf4a;font-variant-numeric:tabular-nums}
.sim-out small{display:block;margin-top:.45rem;font-size:.92rem;font-weight:500;letter-spacing:0;color:var(--lp-panel-fg);opacity:.85}
.sim-note{margin:1.1rem 0 0;font-size:.78rem;line-height:1.5;opacity:.65}
.pile{position:relative;width:132px;height:250px}
.pile i,.lp-sim-static .pile i{position:absolute;left:0;width:132px;height:34px;border-radius:50%;background:radial-gradient(ellipse at 50% 30%,#ffe9a0,var(--lp-gold) 65%);box-shadow:0 8px 0 var(--lp-goldd),0 12px 12px rgba(0,0,0,.28);animation:coindrop .6s cubic-bezier(.3,1.35,.5,1) both}
.pile i::after{content:"";position:absolute;inset:7px 24px;border-radius:50%;border:2px solid rgba(255,255,255,.45)}
.pile i.out{animation:coinout .26s ease forwards}
.lp-sim-static{display:grid;place-items:center;min-height:260px}.lp-sim-static .pile i:nth-child(n){animation-delay:calc(var(--k,0)*80ms)}
@keyframes coinout{to{opacity:0;transform:translateY(-14px) scale(.7)}}

/* Dòng sự thật */
.lp-facts{margin:0;padding:1.05rem 0;background:var(--lp-panel);color:var(--lp-panel-fg);font-size:1.08rem;font-weight:600}

/* Các bước: trình tự thật nên có số, đường nối vẽ ra khi cuộn tới */
.lp-how{padding:clamp(3.5rem,8vw,6.5rem) 0}
.lp-how-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}
.lp-how .lp-h{position:sticky;top:5.5rem}
.lp-steps{position:relative;list-style:none;margin:0;padding:0}
.lp-steps::before,.lp-steps::after{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;background:var(--lp-line)}
.lp-steps::after{background:var(--lp-jade);transform-origin:top;transform:scaleY(0);transition:transform 1.5s cubic-bezier(.4,0,.2,1)}
.lp-steps.in::after{transform:scaleY(1)}
.lp-steps li{position:relative;display:grid;grid-template-columns:56px 1fr;gap:1.2rem;padding:0 0 2.2rem;z-index:1}.lp-steps li:last-child{padding-bottom:0}
.lp-steps .n{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;border:2px solid var(--lp-line);background:var(--lp-bg);font-size:1.2rem;font-weight:800;transition:background .4s,color .4s,border-color .4s}
.lp-steps.in .n{background:var(--lp-jade);border-color:var(--lp-jade);color:#fff;transition-delay:calc(var(--i)*.38s + .15s)}
.lp-steps h3{font-size:1.2rem;font-weight:700;margin:.5rem 0 .25rem}.lp-steps p{margin:0;color:var(--lp-mute);max-width:46ch}

/* Tính năng: kích thước và chất liệu khác nhau theo mức quan trọng */
.lp-feat{padding:0 0 clamp(3.5rem,8vw,6.5rem)}.lp-feat .lp-h{margin-bottom:1.6rem;max-width:22ch}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.cell{display:flex;flex-direction:column;gap:.55rem;padding:1.5rem;position:relative;overflow:hidden}
.cell h3{font-size:1.1rem;font-weight:700}.cell p{margin:0;font-size:.95rem;line-height:1.55}.cell svg{flex:none}
.b0{grid-column:span 4;min-height:250px;justify-content:flex-end;background:var(--lp-panel);color:var(--lp-panel-fg);border-radius:30px}
.b0 svg{position:absolute;top:1.5rem;left:1.5rem;color:var(--lp-gold);width:34px;height:34px}.b0 h3{font-size:1.5rem}.b0 p{max-width:40ch;opacity:.85}
.b0::after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;border:34px solid rgba(245,179,1,.9);box-shadow:inset 0 0 0 16px rgba(245,179,1,.25)}
.b1{grid-column:span 2;background:var(--lp-gold);color:#241a00;border-radius:18px}
.b2{grid-column:span 2;background:var(--lp-card);border:1px solid var(--lp-line);border-radius:14px}.b2 svg{color:var(--lp-jade)}
.b3{grid-column:span 2;background:var(--lp-soft);border-radius:26px 8px 26px 8px}.b3 svg{color:var(--lp-jade)}
.b4{grid-column:span 2;border:2px solid var(--lp-fg);border-radius:10px}.b4 svg{color:var(--lp-jade)}
.b5{grid-column:span 6;flex-direction:row;align-items:center;gap:1.4rem;background:var(--lp-jade);color:#fff;border-radius:30px}.b5 svg{width:34px;height:34px}.b5 p{opacity:.9;max-width:62ch}
.b5 h3{white-space:nowrap}

/* Bảng giá */
.lp-cat{padding:0 0 clamp(3.5rem,8vw,6rem)}
.lp-cat-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}
.lp-lead{margin:1rem 0 1.4rem;color:var(--lp-mute);max-width:40ch}
.prices{list-style:none;margin:0;padding:0}
.prices li{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--lp-line)}.prices li:first-child{border-top:1px solid var(--lp-line)}
.pn b{display:block;font-size:1.05rem}.pn small{color:var(--lp-mute)}
.pp{display:flex;align-items:baseline;gap:.5rem;font-size:1.25rem;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp s{font-size:.85rem;font-weight:500;color:var(--lp-mute)}.pp em{font-style:normal;font-size:.85rem;font-weight:800;color:#b3261e}

.lp-stats{margin:0;padding:0 0 clamp(3rem,7vw,5rem);font-size:clamp(1.3rem,2.6vw,1.9rem);line-height:1.4;font-weight:600;letter-spacing:-.01em}
.lp-stats b{font-weight:800;color:var(--lp-jade);font-variant-numeric:tabular-nums}
.lp-quotes{padding:0 0 clamp(3rem,7vw,5rem)}.lp-quotes .lp-h{margin-bottom:1.4rem}
.lp-quotes blockquote{margin:0 0 1.2rem;padding:.2rem 0 .2rem 1.2rem;border-left:4px solid var(--lp-gold);max-width:60ch}
.lp-quotes blockquote p{margin:0 0 .3rem;font-size:1.15rem}.lp-quotes footer{color:var(--lp-mute);font-size:.9rem}

/* Hỏi đáp: mở ra là phản hồi trực tiếp thao tác */
.lp-faq{padding:0 0 clamp(3.5rem,8vw,6rem)}
.lp-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}
.faq-item{border-bottom:1px solid var(--lp-line)}.faq-item:first-child{border-top:1px solid var(--lp-line)}
.faq-item button{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:100%;padding:1.1rem 0;border:0;background:none;color:var(--lp-fg);font:inherit;font-size:1.05rem;font-weight:600;text-align:left;cursor:pointer}
.faq-item button i{position:relative;flex:none;width:20px;height:20px}
.faq-item button i::before,.faq-item button i::after{content:"";position:absolute;left:3px;right:3px;top:9px;height:2px;border-radius:2px;background:var(--lp-jade);transition:transform .3s}
.faq-item button i::after{transform:rotate(90deg)}.faq-item.open button i::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:1fr}.faq-a>div{overflow:hidden}.faq-a p{margin:0 0 1.1rem;color:var(--lp-mute);max-width:56ch}
.js .faq-a{grid-template-rows:0fr;transition:grid-template-rows .32s ease}.js .faq-item.open .faq-a{grid-template-rows:1fr}

/* Cuối trang */
.lp-final{background:var(--lp-panel);color:var(--lp-panel-fg);padding:clamp(3rem,7vw,5rem) 0}
.lp-final-grid{display:flex;flex-wrap:wrap;gap:1.4rem 2.5rem;align-items:center;justify-content:space-between}
.lp-final h2{font-size:clamp(1.8rem,4.2vw,3.1rem);line-height:1.05;font-weight:800;letter-spacing:-.03em;max-width:18ch}.lp-final p{margin:.7rem 0 0;opacity:.8}
.lp-sticky{display:none}

@media(max-width:860px){
  .lp-hero-grid,.lp-how-grid,.lp-cat-grid,.lp-faq-grid{grid-template-columns:1fr}
  .lp-how .lp-h{position:static}
  .bento{grid-template-columns:1fr}.cell,.b0,.b1,.b2,.b3,.b4,.b5{grid-column:auto}.b5{flex-direction:column;align-items:flex-start}.b5 h3{white-space:normal}.b0{min-height:210px}
  .lp-sticky{display:block;position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:40;padding:.9rem;text-align:center;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.28);transform:translateY(160%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .lp-sticky.show{transform:none}
}
@media(max-width:480px){.sim-grid{grid-template-columns:96px 1fr}.pile{width:96px;height:210px}.pile i,.lp-sim-static .pile i{width:96px;height:26px}.lp-sim{padding:1.3rem 1.2rem 1.1rem}}