:root{
  --g900:var(--sg-nen1);      /* xanh rừng đậm — header, footer */
  --g800:var(--sg-nen1);
  --g700:var(--sg-nen1);      /* primary */
  --g500:var(--sg-nen2);
  --g200:var(--sg-ke);
  --g100:var(--sg-giay);      /* nền section nhạt */
  --g50:var(--sg-giay);       /* nền trang */
  --white:#FFFFFF;
  --ink:var(--sg-nen1);
  --muted:var(--sg-mo);
  --line:var(--sg-giay);
  --amber:var(--sg-dong);
  --amber-bg:var(--sg-khoi);
  --amber-line:var(--sg-ke);
  --up:var(--sg-len);
  --down:var(--sg-xuong);
  --radius:14px;
  --shadow:0 2px 10px rgba(18,59,40,.08);
  --shadow-lg:0 12px 34px rgba(18,59,40,.14);
  --font:'Be Vietnam Pro',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono','SF Mono',Consolas,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);background:var(--g50);font-size:15.5px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit}
input,select{font-family:inherit;font-size:inherit}
:focus-visible{outline:3px solid var(--sg-mo);outline-offset:2px;border-radius:4px}
/* ---------- TOPBAR ---------- */
.topbar{position:sticky;top:0;z-index:60;background:var(--g900);color:var(--sg-giay)}
.topbar-inner{max-width:1240px;margin:0 auto;padding:0 24px;height:66px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:11px;cursor:pointer;flex-shrink:0}
.brand-mark{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--sg-nen2),var(--sg-nen1));display:grid;place-items:center;font-weight:800;font-size:15px;color:#fff;letter-spacing:.5px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.25)}
.brand-txt{line-height:1.2}
.brand-txt b{font-size:17px;letter-spacing:.06em;display:block}
.brand-txt span{font-size:10.5px;color:var(--sg-mo);letter-spacing:.02em}
.nav{display:flex;gap:2px;margin-left:6px}
.nav button{color:var(--sg-ke);padding:8px 13px;border-radius:8px;font-size:14px;font-weight:500;transition:background .15s,color .15s;white-space:nowrap}
.nav button:hover{background:rgba(255,255,255,.08);color:#fff}
.nav button.active{background:rgba(255,255,255,.14);color:#fff;font-weight:600}
.topbar-spacer{flex:1}
.searchbox{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:7px 14px;min-width:190px}
.searchbox svg{flex-shrink:0;opacity:.75}
.searchbox input{background:none;border:none;color:#fff;width:100%;font-size:13.5px}
.searchbox input::placeholder{color:var(--sg-mo)}
.lang{display:flex;border:1px solid rgba(255,255,255,.2);border-radius:8px;overflow:hidden;font-size:12px;font-weight:600}
.lang button{color:var(--sg-ke);padding:6px 10px}
.lang button.on{background:#fff;color:var(--g900)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;border-radius:10px;padding:11px 22px;transition:transform .15s,box-shadow .15s,background .15s;text-align:center}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--g700);color:#fff;box-shadow:0 3px 12px rgba(30,107,69,.35)}
.btn-primary:hover{background:var(--g800)}
.btn-light{background:#fff;color:var(--g800)}
.btn-light:hover{background:var(--sg-giay)}
.btn-ghost{border:1.5px solid var(--g200);color:var(--g800);background:#fff}
.btn-ghost:hover{border-color:var(--g500);background:var(--g100)}
.btn-hero{border:1.5px solid rgba(255,255,255,.45);color:#fff}
.btn-hero:hover{background:rgba(255,255,255,.12)}
.btn-sm{padding:8px 16px;font-size:13.5px;border-radius:8px}
.btn-block{width:100%}
.topbar .btn-light{padding:9px 18px;font-size:14px}
/* ---------- TICKER TAPE (signature) ---------- */
.tape{background:var(--sg-nen1);border-top:1px solid rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.07);overflow:hidden;position:relative;cursor:pointer}
.tape-track{display:flex;width:max-content;animation:tape 46s linear infinite;padding:9px 0}
.tape:hover .tape-track{animation-play-state:paused}
@keyframes tape{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tape-item{display:flex;align-items:baseline;gap:9px;padding:0 26px;border-right:1px solid rgba(255,255,255,.08);font-family:var(--mono);font-size:12.5px;white-space:nowrap}
.tape-item .sym{color:var(--sg-lens);font-weight:600}
.tape-item .price{color:var(--sg-giay)}
.tape-item .chg{font-weight:600}
.chg.up{color:var(--sg-lens)}.chg.down{color:var(--sg-xuongs)}.chg.flat{color:var(--sg-ke)}
.tape-index .sym{color:var(--sg-dongs)}
/* ---------- PAGE FRAME ---------- */
.page{display:none}
.page.on{display:block;animation:fadein .3s ease}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.section{padding:58px 0}
.section.tint{background:var(--g100)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.sec-eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g500);margin-bottom:6px}
h2.sec-title{font-size:27px;font-weight:800;letter-spacing:-.01em;color:var(--g900)}
.sec-sub{color:var(--muted);max-width:640px;margin-top:6px}
/* ---------- HERO ---------- */
.hero{background:linear-gradient(160deg,var(--sg-nen1) 0%,var(--sg-nen1) 55%,var(--sg-nen1) 100%);color:#fff;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;background:
  radial-gradient(600px 300px at 85% 20%,rgba(140,214,170,.16),transparent 70%),
  radial-gradient(500px 260px at 8% 90%,rgba(240,208,111,.10),transparent 70%);pointer-events:none}
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:72px 0 66px}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:6px 14px;font-size:12.5px;font-weight:600;color:var(--sg-ke);margin-bottom:20px}
.hero-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--sg-lens);box-shadow:0 0 0 4px rgba(92,217,143,.22)}
.hero h1{font-size:clamp(30px,4.2vw,46px);font-weight:800;line-height:1.16;letter-spacing:-.015em;margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--sg-lens)}
.hero p.lead{font-size:16.5px;color:var(--sg-ke);max-width:540px;margin-bottom:30px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:38px}
.hero-stats{display:flex;gap:38px;flex-wrap:wrap}
.hstat b{font-size:26px;font-weight:800;font-family:var(--mono);display:block;letter-spacing:-.01em}
.hstat span{font-size:12.5px;color:var(--sg-mo)}
.hero-board{background:rgba(9,32,21,.55);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:22px;backdrop-filter:blur(4px);box-shadow:var(--shadow-lg)}
.hero-board h3{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--sg-mo);display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.hero-board h3 .live{font-size:10.5px;color:var(--sg-lens);display:flex;align-items:center;gap:6px}
.hb-row{display:grid;grid-template-columns:1.15fr 1.5fr .9fr .8fr;gap:10px;padding:9px 10px;border-radius:8px;font-size:13px;align-items:center}
.hb-row.head{color:var(--sg-mo);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;padding-bottom:5px}
.hb-row:not(.head):hover{background:rgba(255,255,255,.06)}
.hb-row .sym{font-family:var(--mono);font-weight:600;color:var(--sg-lens);font-size:12.5px}
.hb-row .price{font-family:var(--mono);text-align:right}
.hb-row .pct{font-family:var(--mono);text-align:right;font-weight:600}
.hb-idx{margin-top:14px;border-top:1px dashed rgba(255,255,255,.18);padding-top:14px;display:flex;justify-content:space-between;align-items:center}
.hb-idx .name{font-size:12px;color:var(--sg-dongs);font-weight:700;letter-spacing:.06em}
.hb-idx .val{font-family:var(--mono);font-size:20px;font-weight:600}
.hb-idx .val small{font-size:12px;color:var(--sg-lens);margin-left:8px}
/* ---------- NOTICE ---------- */
.notice{background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:12px;padding:14px 18px;display:flex;gap:12px;align-items:flex-start;color:var(--sg-dong);font-size:14px;margin-top:26px}
.notice b{color:var(--amber)}
/* ---------- CARDS ---------- */
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s}
.card.hover:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;padding:4px 10px;border-radius:999px;text-transform:uppercase}
.tag-sell{background:var(--sg-giay);color:var(--g700)}
.tag-buy{background:var(--sg-khoi);color:var(--sg-dong)}
.op-card h4{font-size:16px;font-weight:700;margin:12px 0 6px;color:var(--g900);line-height:1.4}
.op-meta{font-size:13px;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.op-meta span{display:flex;align-items:center;gap:5px}
.op-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:14px}
.op-price{font-family:var(--mono);font-weight:600;color:var(--g700);font-size:14.5px}
/* community */
.comm{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:stretch}
.comm-stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;text-align:center;box-shadow:var(--shadow)}
.stat-card b{font-size:34px;font-family:var(--mono);font-weight:600;color:var(--g700);display:block;letter-spacing:-.02em}
.stat-card span{font-size:13px;color:var(--muted)}
.comm-cta{background:linear-gradient(150deg,var(--g800),var(--g700));border-radius:var(--radius);color:#fff;padding:30px;display:flex;flex-direction:column;justify-content:center;gap:14px;box-shadow:var(--shadow-lg)}
.comm-cta h3{font-size:21px;font-weight:800}
.comm-cta p{color:var(--sg-ke);font-size:14.5px}
/* roles strip */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.role-card{position:relative;overflow:hidden}
.role-card .ric{width:46px;height:46px;border-radius:12px;background:var(--g100);display:grid;place-items:center;font-size:22px;margin-bottom:14px}
.role-card h4{font-size:16.5px;font-weight:700;color:var(--g900);margin-bottom:6px}
.role-card p{font-size:13.5px;color:var(--muted)}
/* ---------- FOOTER ---------- */
footer{background:var(--g900);color:var(--sg-ke);margin-top:70px}
.foot-inner{max-width:1240px;margin:0 auto;padding:52px 24px 26px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:34px}
footer h5{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
footer p,footer li{font-size:13.5px;line-height:1.8}
footer ul{list-style:none}
footer li a{cursor:pointer}
footer li a:hover{color:#fff;text-decoration:underline}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:38px;padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--sg-mo);grid-column:1/-1}
/* ---------- AUTH LAYOUT ---------- */
.auth{min-height:calc(100vh - 110px);display:grid;grid-template-columns:1fr 1fr;background:var(--g100)}
.auth-brand{background:linear-gradient(165deg,var(--sg-nen1),var(--sg-nen1));color:#fff;padding:64px 56px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.auth-brand::after{content:"";position:absolute;inset:0;background:radial-gradient(560px 300px at 90% 8%,rgba(140,214,170,.15),transparent 70%)}
.auth-brand>*{position:relative;z-index:1}
.auth-brand .brand{margin-bottom:34px}
.auth-brand h2{font-size:29px;font-weight:800;line-height:1.25;margin-bottom:14px;letter-spacing:-.01em}
.auth-brand p{color:var(--sg-ke);max-width:420px;margin-bottom:34px}
.auth-chart{background:rgba(9,32,21,.5);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:20px;max-width:440px}
.auth-chart .row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12.5px;color:var(--sg-mo);margin-bottom:10px}
.auth-chart .row b{color:var(--sg-dongs)}
.auth-panel{display:flex;align-items:center;justify-content:center;padding:48px 28px}
.form-card{background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);border:1px solid var(--line);width:100%;max-width:440px;padding:34px 32px}
.form-card h3{font-size:22px;font-weight:800;color:var(--g900);text-align:center}
.form-card .fc-sub{text-align:center;color:var(--muted);font-size:13.5px;margin:6px 0 22px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--g900);margin-bottom:6px}
.field input{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;font-size:14.5px;background:var(--g50);transition:border .15s}
.field input:focus{border-color:var(--g500);outline:none;background:#fff}
.field .hint{font-size:12px;color:var(--muted);margin-top:5px}
.pw-wrap{position:relative}
.pw-wrap button{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:12px;font-weight:600}
.form-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin:4px 0 18px}
.form-row a{color:var(--g700);font-weight:600;cursor:pointer}
.form-row a:hover{text-decoration:underline}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted);margin-bottom:12px;cursor:pointer}
.check input{width:16px;height:16px;margin-top:2px;accent-color:var(--g700);flex-shrink:0}
.check a{color:var(--g700);font-weight:600;text-decoration:underline}
.divider{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:12px;margin:18px 0}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.sso{display:flex;align-items:center;justify-content:center;gap:10px;border:1.5px solid var(--line);border-radius:10px;padding:11px;width:100%;font-weight:600;font-size:14px;color:var(--ink);transition:background .15s}
.sso:hover{background:var(--g50)}
.form-foot{text-align:center;font-size:13.5px;color:var(--muted);margin-top:18px}
.form-foot a{color:var(--g700);font-weight:700;cursor:pointer}
.form-actions{display:flex;gap:12px;margin-top:6px}
.form-actions .btn{flex:1}
.tabs2{display:grid;grid-template-columns:1fr 1fr;background:var(--g100);border-radius:10px;padding:4px;margin-bottom:20px}
.tabs2 button{padding:9px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--muted)}
.tabs2 button.on{background:#fff;color:var(--g800);box-shadow:0 1px 4px rgba(18,59,40,.12)}
.radio-card{display:flex;gap:14px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;margin-bottom:12px;transition:border .15s,background .15s}
.radio-card:hover{border-color:var(--g500)}
.radio-card.on{border-color:var(--g700);background:var(--g100);box-shadow:inset 0 0 0 1px var(--g700)}
.radio-card .ric{width:42px;height:42px;border-radius:10px;background:var(--g100);display:grid;place-items:center;font-size:20px;flex-shrink:0}
.radio-card.on .ric{background:#fff}
.radio-card b{font-size:14.5px;color:var(--g900);display:block}
.radio-card span{font-size:12.5px;color:var(--muted)}
.radio-card .rdot{margin-left:auto;width:19px;height:19px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;display:grid;place-items:center}
.radio-card.on .rdot{border-color:var(--g700)}
.radio-card.on .rdot::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--g700)}
.upload{border:1.5px dashed var(--g200);border-radius:12px;padding:18px;text-align:center;cursor:pointer;transition:border .15s,background .15s;background:var(--g50)}
.upload:hover{border-color:var(--g500);background:var(--g100)}
.upload b{color:var(--g700);font-size:13.5px;display:block}
.upload span{font-size:12px;color:var(--muted)}
.upload.done{border-style:solid;border-color:var(--g500);background:var(--g100)}
.up-num{font-size:13px;font-weight:700;color:var(--g900);margin:14px 0 8px}
.role-pill{display:inline-flex;align-items:center;gap:7px;background:var(--g100);border:1px solid var(--g200);color:var(--g800);font-size:12.5px;font-weight:600;border-radius:999px;padding:5px 13px;margin:0 auto 4px}
.step-dots{display:flex;gap:7px;justify-content:center;margin-top:18px}
.step-dots i{width:7px;height:7px;border-radius:50%;background:var(--g200)}
.step-dots i.on{background:var(--g700)}
/* ---------- PORTAL ---------- */
.portal-band{background:var(--g800);color:var(--sg-giay);font-size:12.5px}
.portal-band .wrap{display:flex;align-items:center;gap:10px;padding:8px 24px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.banner{background:linear-gradient(150deg,var(--g900),var(--g700));border-radius:18px;color:#fff;padding:38px 40px;margin:34px 0 8px;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}
.banner::after{content:"";position:absolute;inset:0;background:radial-gradient(420px 200px at 92% 10%,rgba(140,214,170,.18),transparent 70%)}
.banner h1{font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:.01em;position:relative;z-index:1}
.banner p{color:var(--sg-ke);margin-top:8px;max-width:680px;font-size:14.5px;position:relative;z-index:1}
.subnav{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 6px}
.subnav button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 18px;font-size:13.5px;font-weight:600;color:var(--muted);transition:all .15s}
.subnav button:hover{border-color:var(--g500);color:var(--g800)}
.subnav button.on{background:var(--g700);border-color:var(--g700);color:#fff}
.subpage{display:none}
.subpage.on{display:block;animation:fadein .25s ease}
/* member cards */
.member-card{text-align:center}
.member-card .avatar{width:58px;height:58px;border-radius:50%;margin:0 auto 12px;display:grid;place-items:center;font-weight:800;font-size:19px;color:#fff}
.member-card b{display:block;font-size:14.5px;color:var(--g900)}
.member-card span{font-size:12.5px;color:var(--muted)}
.member-card .mtag{margin-top:10px}
/* benefit */
.benefit .bic{width:44px;height:44px;border-radius:12px;background:var(--g100);display:grid;place-items:center;font-size:21px;margin-bottom:12px}
.benefit h4{font-size:15.5px;font-weight:700;color:var(--g900);margin-bottom:6px}
.benefit p{font-size:13.5px;color:var(--muted)}
.priv-list{list-style:none;counter-reset:pv}
.priv-list li{counter-increment:pv;display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}
.priv-list li::before{content:counter(pv,decimal-leading-zero);font-family:var(--mono);font-weight:600;color:var(--g500);font-size:14px;flex-shrink:0;padding-top:1px}
.priv-list b{color:var(--g900)}
/* timeline */
.timeline{position:relative;padding-left:34px}
.timeline::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:2px;background:var(--g200)}
.tl-item{position:relative;padding-bottom:26px}
.tl-item::before{content:"";position:absolute;left:-31px;top:4px;width:15px;height:15px;border-radius:50%;background:#fff;border:3.5px solid var(--g700)}
.tl-item h4{font-size:15.5px;font-weight:700;color:var(--g900)}
.tl-item h4 .tl-step{font-family:var(--mono);font-size:11.5px;color:var(--g500);font-weight:600;letter-spacing:.08em;display:block;margin-bottom:2px}
.tl-item p{font-size:13.5px;color:var(--muted);margin-top:4px;max-width:640px}
/* legal doc */
.legal{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 38px;box-shadow:var(--shadow)}
.legal h4{font-size:15px;color:var(--g900);margin:22px 0 8px;display:flex;gap:10px;align-items:baseline}
.legal h4 .art{background:var(--g700);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.06em;border-radius:6px;padding:3px 9px;text-transform:uppercase;flex-shrink:0}
.legal p,.legal li{font-size:14px;color:var(--sg-nen1)}
.legal ul{padding-left:22px;margin-top:4px}
.legal .sign{margin-top:30px;text-align:right;font-size:13.5px;color:var(--muted)}
.legal .sign b{display:block;color:var(--g900);font-size:14.5px}
/* news */
.news-featured{display:grid;grid-template-columns:1.4fr .9fr;gap:22px}
.nf-main{position:relative;border-radius:var(--radius);overflow:hidden;min-height:330px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow-lg)}
.nf-main .bg{position:absolute;inset:0;background:linear-gradient(150deg,var(--sg-nen1),var(--sg-nen1))}
.nf-main .bg::after{content:"▶";position:absolute;top:50%;left:50%;transform:translate(-50%,-60%);width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.5);display:grid;place-items:center;font-size:20px;padding-left:5px}
.nf-main .ct{position:relative;z-index:1;padding:26px;background:linear-gradient(transparent,rgba(9,32,21,.9))}
.nf-main .ct .tag{background:rgba(255,255,255,.18);color:#fff;margin-bottom:10px}
.nf-main h3{font-size:19px;font-weight:800;line-height:1.35}
.nf-main span{font-size:12.5px;color:var(--sg-ke)}
.nf-side{display:flex;flex-direction:column;gap:12px}
.nf-side .item{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;transition:transform .15s}
.nf-side .item:hover{transform:translateX(3px)}
.nf-side .item b{font-size:13.5px;color:var(--g900);display:block;line-height:1.45}
.nf-side .item span{font-size:12px;color:var(--muted)}
.news-card .thumb{height:130px;border-radius:10px;margin-bottom:14px;position:relative;overflow:hidden}
.news-card b{font-size:14.5px;color:var(--g900);display:block;line-height:1.45;margin-bottom:6px}
.news-card span{font-size:12.5px;color:var(--muted)}
.pager{display:flex;gap:8px;justify-content:center;margin-top:30px}
.pager button{width:36px;height:36px;border-radius:9px;border:1.5px solid var(--line);background:#fff;font-weight:600;color:var(--muted);font-size:13.5px}
.pager button.on{background:var(--g700);border-color:var(--g700);color:#fff}
.pager button:hover:not(.on){border-color:var(--g500)}
/* IR */
.ir-card{text-align:left;cursor:pointer}
.ir-card .code{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--g500);letter-spacing:.08em}
.ir-card b{display:block;font-size:15px;color:var(--g900);margin:6px 0 4px}
.ir-card span{font-size:12.5px;color:var(--muted)}
.ir-card .dl{margin-top:14px;font-size:13px;font-weight:700;color:var(--g700);display:inline-flex;gap:6px;align-items:center}
/* contract stepper */
.stepper{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:26px 0 30px;counter-reset:st}
.stepper button{position:relative;padding:14px 8px 12px;text-align:center;font-size:12.5px;font-weight:600;color:var(--muted);border-bottom:3px solid var(--line)}
.stepper button.on{color:var(--g800);border-bottom-color:var(--g700)}
.stepper button.done{color:var(--g500)}
.stepper button i{display:block;font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.1em;margin-bottom:3px;color:var(--g500)}
.doc-frame{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:38px 44px;font-size:14px}
.doc-frame .qh{text-align:center;margin-bottom:26px}
.doc-frame .qh b{display:block;font-size:14px;letter-spacing:.04em}
.doc-frame .qh u{display:block;text-decoration:none;border-bottom:1.5px solid var(--ink);width:200px;margin:4px auto 0}
.doc-frame h3{text-align:center;font-size:17px;margin:18px 0 4px;color:var(--g900)}
.doc-frame .doc-sub{text-align:center;font-size:13px;color:var(--muted);margin-bottom:22px}
.doc-frame h5{font-size:14px;margin:18px 0 6px;color:var(--g900)}
.doc-frame p,.doc-frame li{color:var(--sg-nen1);line-height:1.75}
.doc-frame ul{padding-left:22px}
.callout{border-radius:12px;padding:16px 18px;font-size:13.5px;margin:18px 0;display:flex;gap:12px;align-items:flex-start}
.callout.warn{background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--sg-dong)}
.callout.ok{background:var(--sg-giay);border:1px solid var(--g200);color:var(--g800)}
.sign-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}
.sign-box{border:1.5px dashed var(--g200);border-radius:12px;padding:20px;text-align:center}
.sign-box.signed{border-style:solid;border-color:var(--g500);background:var(--g100)}
.sign-box b{display:block;font-size:13.5px;color:var(--g900)}
.sign-box .st{font-size:12.5px;color:var(--muted);margin:6px 0 12px;display:block}
.sign-box .stamp{display:inline-block;border:2px solid var(--g700);color:var(--g700);border-radius:8px;padding:6px 16px;font-weight:800;font-size:13px;letter-spacing:.1em;transform:rotate(-4deg);text-transform:uppercase}
.kv{display:grid;grid-template-columns:180px 1fr;gap:8px 18px;font-size:14px;margin-top:12px}
.kv dt{color:var(--muted)}
.kv dd{font-weight:600;color:var(--g900);font-family:var(--mono);font-size:13.5px}
.success-ring{width:74px;height:74px;border-radius:50%;background:var(--g100);border:2px solid var(--g500);display:grid;place-items:center;margin:0 auto 18px;font-size:32px;color:var(--g700)}
/* exchange page */
.xch-table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.xch-table th{background:var(--g900);color:var(--sg-ke);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;padding:13px 16px;text-align:left;font-weight:600}
.xch-table td{padding:13px 16px;border-top:1px solid var(--line);font-size:14px}
.xch-table td.mono{font-family:var(--mono);font-size:13px}
.xch-table tr:hover td{background:var(--g50)}
.fresh{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-family:var(--mono)}
.fresh i{width:52px;height:6px;border-radius:99px;background:var(--g100);overflow:hidden;display:inline-block}
.fresh i b{display:block;height:100%;background:var(--g500);border-radius:99px}
.rule-card h4{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--g900);margin-bottom:6px}
.rule-card h4 .rc{font-family:var(--mono);font-size:11px;background:var(--g100);color:var(--g700);border-radius:6px;padding:3px 8px;font-weight:600;letter-spacing:.05em}
.rule-card p{font-size:13.5px;color:var(--muted)}
.idx-hero{background:linear-gradient(150deg,var(--sg-nen1),var(--sg-nen1));border-radius:var(--radius);color:#fff;padding:28px 30px;display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;box-shadow:var(--shadow-lg)}
.idx-hero .big{font-family:var(--mono);font-size:44px;font-weight:600;letter-spacing:-.02em;line-height:1}
.idx-hero .big small{font-size:15px;color:var(--sg-lens);display:block;margin-top:8px;font-weight:600}
.idx-hero p{color:var(--sg-ke);font-size:13.5px;max-width:560px}
.idx-hero .lbl{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sg-dongs);font-weight:700;margin-bottom:10px}
.spark{margin-top:14px}
/* misc */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.value-card{text-align:center}
.value-card .vic{width:52px;height:52px;border-radius:14px;background:var(--g100);display:grid;place-items:center;font-size:24px;margin:0 auto 12px}
.value-card h4{color:var(--g900);font-size:16px;margin-bottom:6px}
.value-card p{font-size:13.5px;color:var(--muted)}
.doc-check{display:flex;gap:14px;align-items:flex-start}
.doc-check .dic{width:40px;height:40px;border-radius:10px;background:var(--g100);display:grid;place-items:center;font-size:19px;flex-shrink:0}
.doc-check b{font-size:14px;color:var(--g900);display:block}
.doc-check span{font-size:12.5px;color:var(--muted)}
.crumb{font-size:12.5px;color:var(--muted);margin-top:26px}
.crumb a{color:var(--g700);font-weight:600;cursor:pointer}
.center{text-align:center}
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}
/* ---------- PORK TRADING TERMINAL ---------- */
.term{background:var(--sg-giay);min-height:calc(100vh - 110px);padding-bottom:34px}
.term-strip{background:#fff;border-bottom:1px solid var(--line)}
.term-strip .wrap{display:flex;align-items:center;gap:18px;padding:10px 24px;flex-wrap:wrap;font-size:13px}
.term-strip .sess{display:flex;align-items:center;gap:8px;color:var(--g900);font-weight:600}
.term-strip .sess .dot{width:8px;height:8px;border-radius:50%;background:var(--up);box-shadow:0 0 0 3px rgba(30,158,90,.18)}
.term-chip{font-family:var(--mono);font-size:12px;background:var(--g100);border:1px solid var(--g200);color:var(--g800);border-radius:8px;padding:5px 12px;font-weight:600}
.term-grid{display:grid;grid-template-columns:1fr 372px;gap:16px;margin-top:16px;align-items:start}
.term-panel{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.term-tabs{display:flex;border-bottom:1px solid var(--line);background:var(--g50)}
.term-tabs button{padding:11px 18px;font-size:13.5px;font-weight:600;color:var(--muted);border-bottom:2.5px solid transparent;margin-bottom:-1px}
.term-tabs button.on{color:var(--g800);border-bottom-color:var(--g700);background:#fff}
.term-sub{display:flex;gap:6px;padding:12px 16px 0;flex-wrap:wrap}
.term-sub button{font-size:12.5px;font-weight:600;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 13px;display:inline-flex;align-items:center;gap:7px}
.term-sub button.on{background:var(--g700);border-color:var(--g700);color:#fff}
.term-sub .cnt{font-family:var(--mono);font-size:10.5px;background:rgba(0,0,0,.12);border-radius:5px;padding:1px 6px;min-width:18px;text-align:center}
.term-sub button:not(.on) .cnt{background:var(--g100);color:var(--g700)}
.term-filters{display:grid;grid-template-columns:1.1fr 1.4fr 1fr auto;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);align-items:end}
.tf label{display:block;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.tf select,.tf input{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:7px 10px;font-size:13px;background:#fff;color:var(--ink)}
.tf .pair{display:flex;gap:8px}
.term-refresh{width:36px;height:36px;border-radius:8px;background:var(--g700);color:#fff;display:grid;place-items:center;font-size:15px}
.term-refresh:hover{background:var(--g800)}
.term-table{width:100%;border-collapse:collapse}
.term-table th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--g50);font-weight:700;white-space:nowrap}
.term-table td{padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;white-space:nowrap}
.term-table tr:hover td{background:var(--g50)}
.term-table .mono{font-family:var(--mono);font-size:12.5px}
.side-buy{color:var(--up);font-weight:700}
.side-sell{color:var(--down);font-weight:700}
.st-pill{font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px}
.st-wait{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-line)}
.st-done{background:var(--sg-giay);color:var(--g700)}
.row-act{display:flex;gap:8px}
.row-act button{width:26px;height:26px;border-radius:7px;border:1px solid var(--line);display:grid;place-items:center;font-size:12px;color:var(--muted)}
.row-act button:hover{border-color:var(--g500);color:var(--g700)}
.term-empty{padding:44px 20px;text-align:center;color:var(--muted);font-size:13.5px}
.term-empty b{display:block;font-size:15px;color:var(--g900);margin-bottom:4px}
.term-foot{display:flex;justify-content:center;gap:22px;align-items:center;padding:11px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--line);flex-wrap:wrap}
.term-foot select{border:1px solid var(--line);border-radius:6px;padding:3px 6px;font-size:12.5px}
/* order panel */
.op-panel{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;position:sticky;top:82px}
.op-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.op-tabs button{padding:12px 8px;font-size:13px;font-weight:700;color:var(--muted);background:var(--g50)}
.op-tabs button.on{color:var(--g800);background:#fff;box-shadow:inset 0 -2.5px 0 var(--g700)}
.op-body{padding:14px 16px 16px;max-height:calc(100vh - 210px);overflow-y:auto}
.op-bal{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:var(--muted);background:var(--g100);border:1px solid var(--g200);border-radius:8px;padding:8px 12px;margin-bottom:12px}
.op-bal b{font-family:var(--mono);color:var(--g800);font-size:13px}
.op-sec{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--g700);margin:14px 0 8px;display:flex;align-items:center;gap:8px}
.op-sec::after{content:"";flex:1;height:1px;background:var(--line)}
.op-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opf{margin-bottom:10px}
.opf label{display:block;font-size:11.5px;font-weight:600;color:var(--ink);margin-bottom:4px}
.opf label i{color:var(--down);font-style:normal}
.opf input,.opf select{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13px;background:#fff}
.opf input:focus,.opf select:focus{border-color:var(--g500);outline:none}
.opf .unit{position:relative}
.opf .unit span{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11.5px;color:var(--muted);font-family:var(--mono)}
.opf .unit input{padding-right:36px}
.bs-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 2px}
.bs-toggle button{padding:10px;border-radius:9px;font-weight:800;font-size:14px;border:1.5px solid var(--line);color:var(--muted)}
.bs-toggle .b-buy.on{background:var(--up);border-color:var(--up);color:#fff}
.bs-toggle .b-sell.on{background:var(--down);border-color:var(--down);color:#fff}
.op-submit{width:100%;padding:13px;border-radius:10px;font-weight:800;font-size:14.5px;color:#fff;background:var(--up);margin-top:12px;letter-spacing:.02em}
.op-submit.sell{background:var(--down)}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--g900);color:#fff;padding:12px 22px;border-radius:10px;font-size:13.5px;font-weight:600;box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:all .3s;z-index:99}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:1080px){
  .term-grid{grid-template-columns:1fr}
  .op-panel{position:static}
  .op-body{max-height:none}
  .term-filters{grid-template-columns:1fr 1fr}
}
/* ---------- TICK XANH TRÁCH NHIỆM ---------- */
.tx-banner{background:linear-gradient(150deg,var(--sg-nen1),var(--sg-len));border-radius:18px;color:#fff;padding:42px 44px;margin:34px 0 8px;position:relative;overflow:hidden;box-shadow:var(--shadow-lg);display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
.tx-banner::after{content:"";position:absolute;inset:0;background:radial-gradient(460px 220px at 90% 90%,rgba(245,208,111,.14),transparent 70%)}
.tx-banner>*{position:relative;z-index:1}
.tx-banner h1{font-size:clamp(23px,3.2vw,32px);font-weight:800}
.tx-banner p{color:var(--sg-giay);margin-top:10px;max-width:640px;font-size:14.5px}
.tx-mark{width:120px;height:120px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.25);flex-shrink:0}
.tx-mark svg{width:76px;height:76px}
.tick-badge{display:inline-flex;align-items:center;gap:7px;background:var(--sg-giay);border:1.5px solid var(--sg-mo);color:var(--sg-len);font-size:11.5px;font-weight:800;border-radius:999px;padding:4px 12px;letter-spacing:.03em}
.tick-badge svg{width:14px;height:14px}
.tick-badge.revoked{background:var(--sg-khoi);border-color:var(--sg-ke);color:var(--down)}
.ncc-card{position:relative;padding-top:26px;text-align:center}
.ncc-card .tick-float{position:absolute;top:-16px;left:50%;transform:translateX(-50%);width:36px;height:36px;border-radius:50%;background:var(--sg-len);display:grid;place-items:center;box-shadow:0 4px 12px rgba(30,158,90,.4);border:3px solid #fff}
.ncc-card .tick-float svg{width:18px;height:18px}
.ncc-card .avatar{width:56px;height:56px;border-radius:14px;margin:4px auto 12px;display:grid;place-items:center;font-weight:800;font-size:18px;color:#fff}
.ncc-card b{display:block;font-size:14.5px;color:var(--g900);line-height:1.4}
.ncc-card .cat{font-size:12.5px;color:var(--muted);margin-top:3px}
.ncc-card .sym-link{font-family:var(--mono);font-size:11.5px;color:var(--g700);font-weight:600;background:var(--g100);border-radius:6px;padding:2px 8px;display:inline-block;margin-top:8px}
.ncc-card .valid{font-size:11.5px;color:var(--muted);margin-top:10px;border-top:1px dashed var(--line);padding-top:10px}
.tx-crit .cic{width:46px;height:46px;border-radius:12px;background:var(--sg-giay);display:grid;place-items:center;font-size:22px;margin-bottom:12px}
.tx-crit h4{font-size:15.5px;font-weight:700;color:var(--g900);margin-bottom:6px}
.tx-crit p{font-size:13.5px;color:var(--muted)}
.tx-pledge{background:#fff;border:1.5px solid var(--sg-mo);border-left:5px solid var(--sg-len);border-radius:12px;padding:22px 26px;font-size:14px;color:var(--sg-nen1)}
.tx-pledge b{color:var(--sg-len)}
.tx-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:26px 0 6px}
@media (max-width:1080px){.tx-stats{grid-template-columns:repeat(2,1fr)}.tx-banner{grid-template-columns:1fr}.tx-mark{display:none}}
/* ---------- RESPONSIVE ---------- */
@media (max-width:1080px){
  .nav{display:none}
  .searchbox{display:none}
  .hero-inner{grid-template-columns:1fr;padding:52px 0}
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .comm{grid-template-columns:1fr}
  .roles{grid-template-columns:1fr}
  .auth{grid-template-columns:1fr}
  .auth-brand{display:none}
  .foot-inner{grid-template-columns:1fr 1fr}
  .news-featured{grid-template-columns:1fr}
  .stepper{grid-template-columns:1fr;gap:4px}
  .stepper button{text-align:left;border-bottom:none;border-left:3px solid var(--line);padding:9px 14px}
  .stepper button.on{border-left-color:var(--g700)}
  .idx-hero{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .sign-grid{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr}
}
@media (max-width:620px){
  .g4,.g3,.g2{grid-template-columns:1fr}
  .doc-frame{padding:24px 20px}
  .legal{padding:24px 20px}
  .banner{padding:28px 24px}
  .comm-stats{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ================= BỔ SUNG KHI TÁCH TRANG (sgmm.vn) ================= */
/* Nav dùng thẻ <a> để công cụ tìm kiếm đọc được liên kết */
.nav a{display:inline-block;text-decoration:none;color:var(--sg-ke);padding:8px 13px;border-radius:8px;
  font-size:14px;font-weight:500;transition:background .15s,color .15s;white-space:nowrap;cursor:pointer}
.nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.nav a.active{background:rgba(255,255,255,.14);color:#fff;font-weight:600}
.brand{cursor:pointer;text-decoration:none}

/* Nút menu điện thoại */
.navtoggle{display:none;background:rgba(255,255,255,.10);border:0;color:#fff;border-radius:9px;
  padding:9px 11px;cursor:pointer;line-height:0;margin-left:auto}
.navtoggle:hover{background:rgba(255,255,255,.18)}
.navtoggle svg{width:20px;height:20px;stroke:#fff;stroke-width:2.2;fill:none;stroke-linecap:round}

/* Ngăn kéo menu điện thoại */
.mobnav{position:fixed;inset:0;z-index:120;display:none}
.mobnav.on{display:block}
.mobnav-bg{position:absolute;inset:0;z-index:1;background:rgba(9,28,18,.55);backdrop-filter:blur(2px)}
.mobnav-panel{position:absolute;top:0;right:0;bottom:0;z-index:2;width:min(320px,86vw);background:var(--g900);
  padding:18px 16px;overflow-y:auto;box-shadow:-14px 0 40px rgba(0,0,0,.35);
  transform:translateX(100%);transition:transform .22s ease}
.mobnav.on .mobnav-panel{transform:translateX(0)}
.mobnav-head{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:14px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.14)}
.mobnav-head b{color:#fff;font-size:15px;letter-spacing:.02em}
.mobnav-close{background:rgba(255,255,255,.12);border:0;color:#fff;font-size:19px;line-height:1;
  width:34px;height:34px;border-radius:9px;cursor:pointer}
.mobnav-panel a{display:block;color:var(--sg-ke);text-decoration:none;padding:11px 12px;border-radius:9px;
  font-size:15px;font-weight:500}
.mobnav-panel a:hover{background:rgba(255,255,255,.08);color:#fff}
.mobnav-panel a.active{background:rgba(255,255,255,.15);color:#fff;font-weight:600}
.mobnav-panel .sep{height:1px;background:rgba(255,255,255,.14);margin:12px 4px}
.mobnav-panel .cta{background:var(--g500);color:#fff;text-align:center;font-weight:600;margin-top:6px}
.mobnav-panel .cta:hover{background:var(--sg-nen2);color:#fff}
@media (max-width:1080px){ .navtoggle{display:inline-block} .topbar .btn-light{display:none} }
/* Bản gốc ẩn menu ở 1080px mà không có gì thay thế — nay đã có nút hamburger từ 1300px */

/* ---- SỬA LỖI CÓ SẴN: thanh điều hướng tràn ngang trên desktop ----
   Bản gốc để .topbar-inner rộng tối đa 1240px nhưng nội dung bên trong (logo + 9 mục menu
   + ô tìm kiếm + nút đăng nhập) rộng hơn ~1700px nên đẩy tràn cả trang.
   Cách sửa: nới khung, cho menu co lại và tự cuộn ngang, ẩn dần các phần phụ. */
.topbar-inner{max-width:1900px;gap:14px;overflow:hidden}
.searchbox{min-width:150px;flex-shrink:0}
.nav{min-width:0;flex:0 1 auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}
.nav::-webkit-scrollbar{display:none}
.topbar-spacer{flex:1 1 0;min-width:0}
.topbar .btn-light{flex-shrink:0;white-space:nowrap}
.lang{flex-shrink:0}
@media (max-width:2000px){ .searchbox{display:none} }
@media (max-width:1660px){ .lang{display:none} .nav a{padding:8px 10px;font-size:13.5px} }
@media (max-width:1500px){ .nav a{padding:8px 8px;font-size:13px} }
/* Dưới 1400px chuyển hẳn sang menu hamburger cho gọn */
@media (max-width:1400px){ .nav{display:none} .navtoggle{display:inline-block} .topbar .btn-light{display:none} }

/* Bảng giá chạy nay là thẻ <a> — cần display:block để overflow:hidden có hiệu lực,
   nếu không trang sẽ bị tràn ngang trên điện thoại */
a.tape{display:block;text-decoration:none}

/* Liên kết trong footer */
footer a[href]{cursor:pointer}
@media print{ .topbar,.tape,.mobnav,footer{display:none} }

/* liên kết thẻ hội viên */
.mlink{display:block;text-decoration:none;color:inherit}
.mlink .member-card{position:relative;height:100%;transition:transform .16s ease,box-shadow .16s ease}
.mlink:hover .member-card{transform:translateY(-3px);box-shadow:0 10px 26px -14px rgba(21,37,28,.4)}
.mlink:focus-visible .member-card{outline:2px solid var(--sg-nen1);outline-offset:3px}
.mext{position:absolute;top:12px;right:14px;font-size:15px;color:var(--sg-nen1);opacity:.75}

/* ===== TRO LY AI ===== */
.tl-fab{position:fixed;right:22px;bottom:22px;z-index:9998;width:58px;height:58px;border-radius:50%;background:var(--sg-nen1);color:#fff;border:0;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 22px -6px rgba(21,37,28,.55);transition:transform .16s,background .16s}
.tl-fab:hover{background:var(--sg-nen1);transform:scale(1.06)}
.tl-fab svg{width:27px;height:27px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tl-fab .x{display:none}
.tl-fab.mo .c{display:none}
.tl-fab.mo .x{display:block}
.tl-panel{position:fixed;right:22px;bottom:92px;z-index:9999;width:388px;max-width:calc(100vw - 32px);height:540px;max-height:calc(100vh - 130px);background:#fff;border:1px solid var(--sg-giay);border-radius:16px;display:none;flex-direction:column;overflow:hidden;box-shadow:0 20px 56px -20px rgba(21,37,28,.45)}
.tl-panel.mo{display:flex}
.tl-head{background:var(--sg-nen1);color:#fff;padding:15px 18px;flex:none}
.tl-head b{display:block;font-size:15px;line-height:1.3}
.tl-head span{font-size:12px;opacity:.82}
.tl-body{flex:1;overflow-y:auto;padding:16px;background:var(--sg-giay);display:flex;flex-direction:column;gap:11px}
.tl-msg{max-width:85%;padding:11px 14px;border-radius:13px;font-size:14px;line-height:1.6;white-space:pre-wrap;word-wrap:break-word}
.tl-msg.bot{background:#fff;border:1px solid var(--sg-giay);color:var(--sg-nen1);align-self:flex-start;border-bottom-left-radius:4px}
.tl-msg.user{background:var(--sg-nen1);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.tl-msg.loi{background:var(--sg-khoi);border:1px solid var(--sg-ke);color:var(--sg-xuong);align-self:flex-start}
.tl-cho{align-self:flex-start;display:flex;gap:5px;padding:13px 15px;background:#fff;border:1px solid var(--sg-giay);border-radius:13px}
.tl-cho i{width:7px;height:7px;border-radius:50%;background:var(--sg-mo);animation:tlnhay 1.2s infinite}
.tl-cho i:nth-child(2){animation-delay:.18s}
.tl-cho i:nth-child(3){animation-delay:.36s}
@keyframes tlnhay{0%,60%,100%{opacity:.28}30%{opacity:1}}
.tl-goi{display:flex;flex-wrap:wrap;gap:7px;padding:0 16px 12px;background:var(--sg-giay)}
.tl-goi button{background:#fff;border:1px solid var(--sg-ke);border-radius:999px;padding:7px 13px;font:inherit;font-size:12.5px;color:var(--sg-nen1);cursor:pointer}
.tl-goi button:hover{background:var(--sg-giay)}
.tl-foot{border-top:1px solid var(--sg-giay);padding:11px;display:flex;gap:9px;align-items:flex-end;background:#fff;flex:none}
.tl-foot textarea{flex:1;font:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--sg-ke);border-radius:10px;resize:none;height:42px;max-height:110px;line-height:1.5;color:var(--sg-nen1)}
.tl-foot textarea:focus{outline:2px solid var(--sg-nen1);outline-offset:-1px}
.tl-send{background:var(--sg-nen1);color:#fff;border:0;border-radius:10px;width:42px;height:42px;flex:none;cursor:pointer;display:grid;place-items:center}
.tl-send:disabled{opacity:.45;cursor:not-allowed}
.tl-send svg{width:19px;height:19px;fill:#fff}
.tl-note{font-size:11px;color:var(--sg-mo);text-align:center;padding:0 12px 9px;background:#fff;line-height:1.5}
@media(max-width:560px){.tl-panel{right:10px;left:10px;bottom:84px;width:auto;height:calc(100vh - 120px)}.tl-fab{right:14px;bottom:14px;width:52px;height:52px}}

.foot-ten{font-weight:700;line-height:1.45;margin:0 0 10px}
.foot-lh{list-style:none;margin:0;padding:0}
.foot-lh li{display:flex;gap:9px;align-items:flex-start;margin:0 0 9px}
.foot-lh .foot-ic{width:15px;height:15px;flex:none;margin-top:3px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.72}
.foot-lh a{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.foot-lh a:hover{border-bottom-color:currentColor}

.foot-lh .foot-gio{margin-left:7px;opacity:.62;font-size:12.5px;white-space:nowrap}
@media(max-width:400px){.foot-lh .foot-gio{display:block;margin:2px 0 0}}

/* ===== LOP SINH DONG ===== */
html{scroll-behavior:smooth}
html.sgmm-dong .sgmm-rv{opacity:0;transform:translateY(18px)}
html.sgmm-dong .sgmm-rv.sgmm-ra{opacity:1;transform:none;
 transition:opacity .6s ease, transform .6s cubic-bezier(.22,.8,.26,1)}
.stat-card,.hstat,.sgmm-hst .hst-o,.sgmm-sl .sl-o,.sgmm-cta-dk{
 transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
.stat-card:hover,.hstat:hover{transform:translateY(-3px);
 box-shadow:0 12px 28px -14px rgba(18,45,30,.38)}
.sgmm-sl .sl-o:hover{transform:translateY(-3px);background:rgba(255,255,255,.11)}
.sgmm-cta-dk:hover{box-shadow:0 14px 34px -18px rgba(18,45,30,.30)}
.banner h1{position:relative}
.banner h1::after{content:"";display:block;width:54px;height:3px;margin-top:14px;
 border-radius:2px;background:linear-gradient(90deg,var(--sg-nen1),var(--sg-nen2))}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
 outline:2px solid var(--sg-nen1);outline-offset:2px;border-radius:4px}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 html.sgmm-dong .sgmm-rv{opacity:1;transform:none}
 .stat-card:hover,.hstat:hover,.sgmm-sl .sl-o:hover{transform:none}}

/* ===== LOGO SGMM + TEN THUONG HIEU DAY DU ===== */
[data-sgmm="mk"]{width:58px!important;height:40px!important;border-radius:12px!important;
 display:flex!important;align-items:center!important;justify-content:center!important;
 flex:none!important;font-size:15px!important;font-weight:800!important;
 letter-spacing:.05em!important;padding:0!important}
[data-sgmm="ten"]{font-size:15.5px!important;letter-spacing:.055em;line-height:1.15;
 white-space:nowrap}
@media(max-width:640px){
 [data-sgmm="mk"]{width:50px!important;height:36px!important;font-size:13px!important}
 [data-sgmm="ten"]{font-size:12.5px!important;letter-spacing:.03em}}
@media(max-width:380px){
 [data-sgmm="mk"]{width:46px!important;height:34px!important;font-size:12px!important}
 [data-sgmm="ten"]{font-size:11.5px!important}}


/* ============ MENU LUON HIEN O MOI DO RONG (05/09/2026) ============
   Truoc day duoi 1400px thanh .nav bi display:none nen nam ten trang
   bien mat, chi con nut hamburger. Nay giu nguyen menu va cho cuon
   ngang; nut hamburger van con de mo menu day du. */
.topbar{box-shadow:0 2px 14px rgba(9,32,21,.20)}
@media (max-width:1400px){
  .nav{display:flex!important;min-width:0;flex:1 1 auto;
       overflow-x:auto;overflow-y:hidden;
       scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:8px 9px;font-size:13px}
  .navtoggle{display:inline-block}
}
@media (max-width:900px){
  .nav a{padding:7px 8px;font-size:12.5px}
}
@media (max-width:640px){
  .topbar-inner{height:58px;padding:0 12px;gap:8px}
  .topbar-spacer{display:none}
  .nav{gap:0;margin-left:2px}
  .nav a{padding:7px 7px;font-size:12px}
}
/* Bam lien ket neo (#loiich, #thutuc...) khong bi thanh menu che tieu de */
[id]{scroll-margin-top:82px}

/* ==== MENU KHONG BI EP BIEN MAT (05/09/2026) ==== */
.topbar .nav{display:flex!important;flex:1 1 auto!important;min-width:150px!important;
  overflow-x:auto!important;overflow-y:hidden!important;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
.topbar .nav::-webkit-scrollbar{display:none}
.topbar .topbar-spacer{flex:0 1 auto!important;min-width:0!important}

/* ==== LOGO DOI TAC (05/09/2026) ==== */
/* do uu tien cao hon khoi <style> rieng trong trang */
.dtc-wrap .dtc-luoi .dtc-o{flex-direction:column;justify-content:center;
  gap:10px;padding:18px 14px;min-height:104px}
.dtc-wrap .dtc-luoi .dtc-o a{display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;width:100%;line-height:1.35}
.dtc-wrap .dtc-luoi .dtc-logo{display:block;height:38px;width:auto;max-width:152px;
  object-fit:contain;margin:0}
.dtc-wrap .dtc-luoi .dtc-logo[src*="horizon"],
.dtc-wrap .dtc-luoi .dtc-logo[src*="binh-dien"],
.dtc-wrap .dtc-luoi .dtc-logo[src*="thu-duc"],
.dtc-wrap .dtc-luoi .dtc-logo[src*="vissan"]{height:46px}
.dtc-wrap .dtc-the h3{display:flex;align-items:center;gap:12px}
.dtc-wrap .dtc-the .dtc-logo{height:40px;width:auto;max-width:150px;
  object-fit:contain;flex:0 0 auto;margin:0}
.dt-wrap .dt-logo,.dt-logo{display:inline-block;vertical-align:middle;
  margin-right:10px;height:34px;width:auto;max-width:150px;object-fit:contain}
@media (max-width:640px){
  .dtc-wrap .dtc-luoi .dtc-o{min-height:92px;gap:8px}
  .dtc-wrap .dtc-luoi .dtc-logo{height:32px;max-width:124px}
  .dtc-wrap .dtc-luoi .dtc-logo[src*="horizon"],
  .dtc-wrap .dtc-luoi .dtc-logo[src*="binh-dien"],
  .dtc-wrap .dtc-luoi .dtc-logo[src*="thu-duc"],
  .dtc-wrap .dtc-luoi .dtc-logo[src*="vissan"]{height:40px}
  .dtc-wrap .dtc-the .dtc-logo{height:34px}
  .dt-logo{height:28px}}
/* ==== HET LOGO DOI TAC ==== */

/* ==== SUA GIAO DIEN DIEN THOAI (06/09/2026) ==== */
/* 1. Duoi 900px: an thanh menu ngang, tra lai nut hamburger + ngan keo
      (truoc do nut hamburger bi day ra ngoai man hinh nen khach khong mo duoc menu) */
@media (max-width:900px){
  .topbar .nav{display:none!important}
  .navtoggle{display:inline-block!important}
  .topbar-spacer{display:block!important;flex:1 1 auto!important}
}
@media (min-width:901px){
  .navtoggle{display:none!important}
}

/* 2. O luoi khong duoc phep rong hon khung cha -> het tran ngang */
.dn-wrap > *,.auth > *,.dn-left,.dn-right,.auth-panel{min-width:0}
.dn-card-idx{max-width:100%;box-sizing:border-box}
.dn-spark,.dn-card-idx svg{width:100%;max-width:100%;height:auto;display:block}
.dn-idx-row{flex-wrap:wrap;gap:6px}

@media (max-width:640px){
  .dn-left{padding:30px 16px}
  .dn-right{padding:26px 14px}
  .dn-box{padding:24px 16px}
  .dn-card-idx{padding:16px 14px}
  .auth-panel{padding:32px 16px}
}

/* 3. Anh va bang khong duoc lam vo bo cuc tren dien thoai */
img,video,svg{max-width:100%}
@media (max-width:640px){
  .kd-bang,table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
/* ==== HET SUA GIAO DIEN DIEN THOAI ==== */

/* ==== VA DOT B (06/09/2026) ==== */
/* 1. Nut "Dang nhap / Dang ky" phai thay duoc tren laptop 901-1400px.
      Truoc day @media (max-width:1400px) an no, ma nut ☰ lai chi hien duoi 901px
      -> khoang 901-1400px khong con loi nao vao dang nhap. */
@media (min-width:901px){
  .topbar .btn-light{display:inline-flex!important;align-items:center}
}
@media (min-width:901px) and (max-width:1180px){
  .nav a{padding:8px 9px;font-size:13px}
  .topbar .btn-light{padding:8px 13px;font-size:13px}
  .brand-sub{display:none}
}
/* 2. O tim kiem va nut VI/EN da go khoi HTML (chua co chuc nang) */
.searchbox,.lang{display:none!important}
/* 3. Cot "Hoi vien" o chan trang: moi lien ket mot dong */
.foot-inner ul li a.phaply{display:block;margin-top:6px}
/* 4. Tieu de an danh cho trinh doc man hinh */
.chi-doc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* ==== HET VA DOT B ==== */

/* ==== VA DOT G (06/09/2026) ==== */
/* 1. Khoi "Cong dong hoi vien": da go o so lieu nen chi con the CTA
      -> cho the CTA chiem tron chieu ngang, khong con lech nua trang. */
.comm{grid-template-columns:1fr}
.comm-stats:empty{display:none}

/* 2. Nut goi co dinh dang de len chu tren man hinh may tinh.
      Tren dien thoai no la thanh duoi cung (huu ich) nen van giu.
      Muon hien lai tren may tinh: xoa doan nay. */
@media (min-width:901px){
  body .sgmm-goi{display:none!important}
}
/* ==== HET VA DOT G ==== */

/* ==== NAV MANG LUOI (06/09/2026) ==== */
@media (min-width:901px) and (max-width:1120px){
  body .topbar-inner{gap:10px}
  body .topbar .nav{margin-left:0;gap:0}
  body .topbar .nav a{padding:7px 6px;font-size:12.5px}
  body .topbar .btn-light{padding:8px 11px;font-size:12.5px}
  body .brand-txt b{font-size:14px}
}
@media (min-width:901px) and (max-width:980px){
  body .topbar .nav a{padding:7px 5px;font-size:12px}
  body .brand-txt b{font-size:13px}
}
/* ==== HET NAV MANG LUOI ==== */
/* SGMM SLOGAN 1309 */
@media (max-width:900px){
  .brand{flex-shrink:1;min-width:0}
  .brand-txt{min-width:0}
  .brand-txt span{display:block;white-space:normal;overflow-wrap:anywhere}
}
/* HET SGMM SLOGAN 1309 */
/* ==== SGMM DONG HANH — LOP HANH DONG — BAT DAU ==== */
:root{--dong:var(--sg-dong);--dong-dam:var(--sg-dong);--dong-sang:var(--sg-dongs)}
.btn-primary,.b2c-nut,.chs-hnut,.chs-nut,.cta-nut,.dnv-nut,.dt-nut,.dtc-nut,
.hd-nut,.hdb2c-nut,.hn-nut,.hu-nut,.kt-nut,.kvh-nut,.qtr-nut,
.sgmm-cta-nut,.sgmm-tin-nut,.sgmm-tv-nut,.pg-nut,.dgt-nut,.dkb-nut,.nt-nut,
.cta-chinh,.sgmm-cta-dk{
  background:var(--dong)!important;color:var(--sg-giay)!important;
  box-shadow:0 2px 10px rgba(142,96,28,.30)!important}
.btn-primary *,.sgmm-cta-nut *,.cta-nut *,.hn-nut *,.dtc-nut *,.hd-nut *,
.hdb2c-nut *,.dnv-nut *,.chs-hnut *,.cta-chinh *,.sgmm-cta-dk *{color:inherit!important}
.btn-primary:hover,.sgmm-cta-nut:hover,.dtc-nut:hover,.hdb2c-nut:hover,
.dnv-nut:hover,.hd-nut:hover,.chs-hnut:hover,.cta-nut:hover,.hn-nut:hover{
  background:var(--dong-dam)!important}
.hd-nut.phu,.cta-phu,.dtc-nut2{background:transparent!important;
  color:var(--dong)!important;border:1.5px solid var(--dong)!important;box-shadow:none!important}
.form-row a,.check a,.form-foot a,.crumb a,.sgmm-can a,.p a,.li a{color:var(--dong)}
:focus-visible{outline:3px solid var(--dong-sang)}
.sgmm-goi{background:var(--dong)!important}
.brand-mark{background:linear-gradient(135deg,var(--sg-dongs),var(--sg-dong))!important;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.30)!important;color:var(--sg-nen1)!important}
/* chu nhat tren cac mang teal dam */
.topbar .brand-txt span,.label,.hu-nhan,.sl-tit,.sl-ghi,.sgmm-sl .sl-tit,
.sgmm-sl .sl-ghi,.nt-o label,.nt-o>span,.hero-board h3,.hb-row.head,
.hero p,.banner p,.pvn-bia .pvn-nhan{color:var(--sg-mo)!important}
footer .foot-inner p,footer .foot-bottom,footer .foot-bottom span{color:var(--sg-mo)}
/* ==== SGMM DONG HANH — LOP HANH DONG — KET THUC ==== */
/* ==== SGMM DAU HIEU HORIZON — BAT DAU ==== */
.sgmm-hrz{max-width:1100px;margin:0 auto;padding:18px 18px 6px}
.sgmm-hrz a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;
  color:inherit;opacity:.85;transition:opacity .15s}
.sgmm-hrz a:hover{opacity:1}
.sgmm-hrz img{width:30px;height:30px;border-radius:6px;background:#fff;padding:2px;flex:none}
.sgmm-hrz span{font-size:13px;line-height:1.4;letter-spacing:.01em}
.sgmm-hrz b{font-weight:700}
/* ==== SGMM DAU HIEU HORIZON — KET THUC ==== */
/* ==== SGMM BO NHAN DIEN — BAT DAU ==== */
/* --- 1. BANG MAU: doi mau toan trang chi can sua o day --- */
:root{
  --sg-nen1:   #013B42;   /* Xanh dem sau — dau trang, chan trang, khoi lon */
  --sg-nen2:   #0B4750;   /* Xanh dem — khoi thu hai, the tren nen dam */
  --sg-khoid:  #2E6B70;   /* Xanh khoi — thanh tien do, duong nhan */
  --sg-dong:   #038981;   /* Rang dong — nut bam, lien ket */
  --sg-dongs:  #5FC9BE;   /* Rang dong sang — nhan tren nen dam */
  --sg-giay:   #F7F8F9;   /* Giay — nen trang */
  --sg-khoi:   #EAEEF2;   /* Khoi — nen khoi nhat */
  --sg-ke:     #D4DCE3;   /* Duong ke */
  --sg-muc:    #13202B;   /* Muc — chu than */
  --sg-mo:     #55677A;   /* Chu mo tren nen sang */
  --sg-nhat:   #AFC2D2;   /* Chu nhat tren nen dam */
  --sg-len:    #0E7A3F;   /* Gia len */
  --sg-lens:   #4FC98A;   /* Gia len tren nen dam */
  --sg-xuong:  #B8382B;   /* Gia xuong */
  --sg-xuongs: #F0928A;   /* Gia xuong tren nen dam */
}

/* --- 2. THANG CHU --- */
body{font-size:16px;line-height:1.68}
h1{font-size:clamp(28px,6.4vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1.08}
h2{font-size:clamp(21px,4.6vw,30px);font-weight:800;letter-spacing:-.022em;line-height:1.2}
h3{font-size:clamp(17px,3.4vw,20px);font-weight:700;letter-spacing:-.01em;line-height:1.32}
h1,h2,h3,h4,h5{text-wrap:balance}
.sec-eyebrow,.eb,.lb,.nhan,.sl-tit,.hst-nhan,.hb-row.head,.bg .tit,.hu-nhan{
  font-family:var(--mono);font-size:11px!important;font-weight:600!important;
  letter-spacing:.16em!important;text-transform:uppercase}
.mono,.so,.gt,.dh,.sv,.hu-dem,.sl-o .so,.chg,.hb-row .mono{
  font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.012em}
.small,.ghi,.phu,.dg,.vung{font-size:13.5px;line-height:1.56}

/* --- 3. LOP HANH DONG: rang dong --- */
.btn-primary,.b2c-nut,.chs-hnut,.chs-nut,.cta-nut,.dnv-nut,.dt-nut,.dtc-nut,
.hd-nut,.hdb2c-nut,.hn-nut,.hu-nut,.kt-nut,.kvh-nut,.qtr-nut,.sgmm-cta-nut,
.sgmm-tin-nut,.sgmm-tv-nut,.pg-nut,.dgt-nut,.dkb-nut,.nt-nut,.cta-chinh,
.sgmm-cta-dk{background:var(--sg-dong)!important;color:var(--sg-giay)!important;
  box-shadow:0 2px 10px rgba(158,87,38,.30)!important}
.btn-primary *,.sgmm-cta-nut *,.cta-nut *,.hn-nut *,.dtc-nut *,.hd-nut *,
.hdb2c-nut *,.dnv-nut *,.chs-hnut *,.cta-chinh *,.sgmm-cta-dk *{color:inherit!important}
.btn-primary:hover,.sgmm-cta-nut:hover,.dtc-nut:hover,.hdb2c-nut:hover,
.dnv-nut:hover,.hd-nut:hover,.chs-hnut:hover,.cta-nut:hover,.hn-nut:hover{
  filter:brightness(.88)}
.hd-nut.phu,.cta-phu,.dtc-nut2{background:transparent!important;
  color:var(--sg-dong)!important;border:1.5px solid var(--sg-dong)!important;
  box-shadow:none!important}
.form-row a,.check a,.form-foot a,.crumb a,.sgmm-can a,.p a,.li a{color:var(--sg-dong)}
:focus-visible{outline:3px solid var(--sg-dongs)}
.sgmm-goi{background:var(--sg-dong)!important}
.brand-mark{background:var(--sg-nen2)!important;color:var(--sg-dongs)!important;
  box-shadow:inset 0 0 0 1.5px rgba(232,162,94,.45)!important}

/* --- 4. CHU NHAT TREN CAC MANG DAM --- */
.topbar .brand-txt span,.label,.hu-nhan,.sl-tit,.sl-ghi,.sgmm-sl .sl-tit,
.sgmm-sl .sl-ghi,.nt-o label,.nt-o>span,.hero p,.banner p,.hero .eb,
.hb-row.head,.hero-board h3,.pvn-bia .pvn-nhan{color:var(--sg-nhat)!important}
footer .foot-inner p,footer .foot-bottom,footer .foot-bottom span{color:var(--sg-nhat)}

/* --- 5. DAU HIEU HE SINH THAI --- */
.sgmm-hrz{max-width:1100px;margin:0 auto;padding:18px 18px 6px}
.sgmm-hrz a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;
  color:inherit;opacity:.85;transition:opacity .15s}
.sgmm-hrz a:hover{opacity:1}
.sgmm-hrz img{width:30px;height:30px;border-radius:6px;background:#fff;padding:2px;flex:none}
.sgmm-hrz span{font-size:13px;line-height:1.4}
.sgmm-hrz b{font-weight:700}
/* ==== SGMM BO NHAN DIEN — KET THUC ==== */
/* ==== SGMM U1 CAN CHU — BAT DAU ==== */
/* 1. Khong de mot chu le loi tren dong cuoi (chi trinh duyet moi hieu) */
p,li,td,dd,blockquote,figcaption,
.p,.li,.b,.small,.ghi,.phu,.sgmm-can,.sec-eyebrow,.sl-trong,.dnv-lien{
  text-wrap:pretty}
h1,h2,h3,h4,h5,.sec-title,.banner p{text-wrap:balance}
/* 2. O trong luoi khong duoc phinh ra ngoai */
.grid>*,.sl-luoi>*,.g2>*,.g3>*,.g4>*{min-width:0}
/* 3. So tien / khoi luong khong tach khoi don vi */
.sl-o .so,.sgmm-sl .sl-o b,.stat-card b,.hstat b,.sl-hang .gt,#pgThanhTien,
.pg-tt b,.dct-tien,.dct-so{white-space:nowrap}
/* 4. Chu dai (ma so, email, duong dan) khong day o ra ngoai */
td,.td,.b,.p,.li,.sgmm-can{overflow-wrap:break-word}
/* ==== SGMM U1 CAN CHU — KET THUC ==== */
/* ==== SGMM LOGO CHU — BAT DAU ==== */
/* Logo la CHU SGMM, khong phai o vuong — tranh bi tuong la bieu tuong ung dung */
.brand-mark{background:none!important;box-shadow:none!important;border:0!important;
  width:auto!important;height:auto!important;border-radius:0!important;
  display:block!important;flex:none;
  font-family:var(--font),'Be Vietnam Pro',system-ui,sans-serif;
  font-size:21px!important;font-weight:800!important;letter-spacing:.055em!important;
  line-height:1!important;color:var(--sg-dongs)!important;padding:0!important}
.brand{gap:13px!important;align-items:center;min-width:0!important;
  flex:0 1 auto!important}
.brand-txt b,.brand-txt span{white-space:normal!important;overflow-wrap:anywhere}
/* nut menu khong bao gio bi bop hay day ra ngoai le */
.topbar-inner{gap:10px!important}
.brand-txt{min-width:0!important}
.navtoggle,.topbar>.topbar-inner>button,.topbar button[class*="toggle"]{
  flex:0 0 auto!important;width:42px!important;min-width:42px!important}
.brand-txt b{font-size:11.5px!important;font-weight:700!important;letter-spacing:.1em!important;
  line-height:1.3!important}
.brand-txt span{font-size:10.5px!important;line-height:1.35!important}
@media(max-width:420px){
  .brand-mark{font-size:19px!important}
  .brand-txt b{font-size:10.5px!important;letter-spacing:.07em!important}
  .brand-txt span{font-size:10px!important}
  .brand{gap:10px!important}
}
@media(min-width:901px){
  .brand{flex:0 0 auto!important}
  .brand-txt b,.brand-txt span{white-space:nowrap!important}
}
@media(max-width:340px){
  .brand-mark{font-size:17px!important}
  .brand-txt span{display:none!important}
}
/* ==== SGMM LOGO CHU — KET THUC ==== */
/* ==== SGMM LOGO CHU BEN — BAT DAU ==== */
/* Chu SGMM ve bang ::before cua chinh khoi .brand:
   khong phu thuoc o .brand-mark, va khong script nao xoa duoc. */
a.brand{display:flex!important;align-items:center!important;gap:13px!important;
  min-width:0!important;flex:0 1 auto!important;text-decoration:none!important}
a.brand::before{content:"SGMM";flex:0 0 auto;
  font-family:'Be Vietnam Pro',system-ui,-apple-system,sans-serif;
  font-size:21px;font-weight:800;letter-spacing:.055em;line-height:1;
  color:#5FC9BE;-webkit-text-fill-color:#5FC9BE;white-space:nowrap;
  display:block;visibility:visible;opacity:1}
/* an o vuong cu di */
a.brand .brand-mark,a.brand [data-sgmm="mk"]{display:none!important}
a.brand .brand-txt{min-width:0!important}
a.brand .brand-txt b,a.brand .brand-txt span{white-space:normal!important;
  overflow-wrap:anywhere}
.brand-txt b{font-size:11.5px!important;font-weight:700!important;
  letter-spacing:.1em!important;line-height:1.3!important}
.brand-txt span{font-size:10.5px!important;line-height:1.35!important}
.topbar-inner{gap:10px!important}
.navtoggle,.topbar button[class*="toggle"]{flex:0 0 auto!important;
  width:42px!important;min-width:42px!important}
@media(max-width:420px){
  a.brand::before{font-size:19px}
  .brand-txt b{font-size:10.5px!important;letter-spacing:.07em!important}
  .brand-txt span{font-size:10px!important}
  a.brand{gap:10px!important}
}
@media(max-width:340px){
  a.brand::before{font-size:17px}
  .brand-txt span{display:none!important}
}
@media(min-width:901px){
  a.brand{flex:0 0 auto!important}
  .brand-txt b,.brand-txt span{white-space:nowrap!important}
}
/* ==== SGMM LOGO CHU BEN — KET THUC ==== */
/* ==== SGMM DON VI CHU QUAN — BAT DAU ==== */
.sg-cq{border-top:1px solid rgba(255,255,255,.14);margin-top:8px}
.sg-cq-in{max-width:1240px;margin:0 auto;padding:22px 24px 26px;text-align:center}
.sg-cq p{margin:0}
.sg-cq-nhan{font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;
  opacity:.72;margin-bottom:10px!important}
.sg-cq-logo{display:block;height:34px;width:auto;max-width:210px;
  margin:0 auto 10px;object-fit:contain}
.sg-cq-ten{font-size:16px!important;font-weight:800;letter-spacing:.06em;
  line-height:1.3!important;color:var(--sg-dongs,#5FC9BE);margin-bottom:6px!important}
.sg-cq-mo{font-size:12.5px!important;line-height:1.75!important;opacity:.78;
  max-width:660px;margin-left:auto!important;margin-right:auto!important}
@media(max-width:520px){
  .sg-cq-in{padding:18px 18px 22px}
  .sg-cq-ten{font-size:14.5px!important}
  .sg-cq-mo{font-size:12px!important}
  .sg-cq-logo{height:30px}
}
/* ==== SGMM DON VI CHU QUAN — KET THUC ==== */
/* ==== SGMM RA SOAT V8 DOT 1 (25/09/2026) — BAT DAU ====
   Khoi cuoi cung, thang moi luat .brand-txt o tren (dong 37-39, 760-771, 901-958)
   va luat viet thang trong tung trang. Khong doi mau/nhan dien. */
/* 1. Dau trang: tu 900px tro xuong chu toi thieu 12px; dien thoai an dong phu
      de khong bi cat va khong cao gap doi */
@media(max-width:900px){
  body a.brand .brand-txt b,body .brand-txt b{font-size:12px!important}
  body a.brand .brand-txt span,body .brand-txt span{font-size:12px!important}
}
@media(max-width:640px){
  body a.brand .brand-txt b,body .brand-txt b{font-size:12px!important;letter-spacing:.07em!important;
    line-height:1.3!important;white-space:normal!important}
  body a.brand .brand-txt span,body .brand-txt span{display:none!important}
}
/* 2. Nhan "Don vi chu quan", 3. chu thich anh: toi thieu 12px */
body .sg-cq .sg-cq-nhan{font-size:12px!important}
body .nga-ghi,body .sgmm-ghi{font-size:12px!important}
/* 4. O nhap >=16px tren dien thoai/iPad: iPhone khong tu phong to khi bam */
@media(max-width:1024px){
  body input:not([type=checkbox]):not([type=radio]):not([type=range]),
  body select,body textarea{font-size:16px!important}
}
/* 5. Lien ket chan trang de bam hon tren dien thoai/iPad */
@media(max-width:1024px){
  body footer li{font-size:14px}
  body footer li a{display:inline-block;padding:9px 0}
}
/* ==== SGMM RA SOAT V8 DOT 1 — KET THUC ==== */
/* ==== SGMM RA SOAT V8 DOT 2 (25/09/2026) — BAT DAU ====
   Nhan nho rieng tung trang: toi thieu 12.5px tren dien thoai/iPad (bang co dang dung
   o cac nhan da dat chuan, khong lam nho chu nao). May tinh giu nguyen. */
@media(max-width:1024px){
  body .km-nhan,body .hu-nhan,body .cha-ghi,
  body p.nhan,body p.nhan b,body .sl-hang .nhan,body .sl-chip,body #slMoc,
  body .mxv-chinh b,body #sgDb b.nh,body #sgDb em,body .lbl,
  body .dv-nhan,body .nvgt-e,body .tick-badge,body .card .valid,
  body .sec-eyebrow,body .pvn-nhan,body .sgmm-tin-the{font-size:12.5px!important}
}
/* ==== SGMM RA SOAT V8 DOT 2 — KET THUC ==== */
/* ==== SGMM RA SOAT V8 DOT 3 (25/09/2026) — BAT DAU ====
   Chu nho con lai (khong co class rieng): nham theo khoi cha. Chi dien thoai/iPad. */
@media(max-width:1024px){
  body .opp-the .opp-so span,body .opp-the .opp-chuan i,body .kc .kc-nhan,body #gttO b,
  body #mxvO b,body #mxvNd b,body #mxvNd em,body .sg-lk .nh,body .rule-card .rc,
  body .stepper button i,body .dv-so .o>span,body .dv-g .noi em,body .dv-ct dt,
  body .dv-lop .vt,body .dv-bg.ngang h3,body .dtc-buoc span{font-size:12.5px!important}
}
/* ==== SGMM RA SOAT V8 DOT 3 — KET THUC ==== */