/* Page CSS trích từ <style> inline của legal-global-ung-vien.html (bỏ preloader + base64 bg) */
.btn-ghost{border-color:rgba(255,255,255,.28);color:#fff}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-white{background:#fff;color:var(--red)}
.btn-white:hover{background:var(--ink);color:#fff}
.topbar .langs{display:flex;gap:6px}
.topbar .langs span{padding:2px 9px;border-radius:999px;cursor:pointer;transition:.2s}
.topbar .langs span.on{background:var(--red);color:#fff}
.topbar .langs span:not(.on):hover{color:#fff}
nav.menu a.on{color:var(--red)}
nav.menu a.on::after{width:100%;background:var(--red)}
.hero{position:relative;background:var(--ink);color:var(--on-dark);overflow:hidden}
.hero .mesh{position:absolute;inset:0;background:radial-gradient(820px 520px at 85% 10%,rgba(196,20,42,.30),transparent 60%),linear-gradient(180deg,rgba(22,25,29,.55),var(--ink) 90%)}
.hexpat{position:absolute;inset:0;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='64' viewBox='0 0 56 64'><path d='M28 1L54 16v32L28 63 2 48V16z' fill='none' stroke='white' stroke-width='1'/></svg>");background-size:56px 64px}
.hero .wrap{position:relative;z-index:2;padding:84px 32px 90px}
.hero h1{font-size:clamp(33px,4.4vw,56px);color:#fff;font-weight:900;max-width:760px;margin-top:20px}
.hero h1 .hl{color:var(--red)}
.hero p.lead{font-size:18px;color:var(--on-dark-mute);max-width:600px;margin-top:22px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.hero-badges{display:flex;gap:26px;flex-wrap:wrap;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.hbadge .n{font-family:"Archivo";font-weight:900;font-size:30px;color:#fff;line-height:1}
.hbadge .l{font-size:13px;color:var(--on-dark-mute);margin-top:5px}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.wcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:32px;transition:.3s}
.wcard:hover{border-color:var(--charcoal);transform:translateY(-6px);box-shadow:0 22px 44px rgba(20,23,28,.10)}
.wcard .wic{width:52px;height:52px;border-radius:13px;background:var(--mist);display:grid;place-items:center;color:var(--red);margin-bottom:20px;transition:.3s}
.wcard:hover .wic{background:var(--red);color:#fff}
.wcard h3{font-size:19px;margin-bottom:9px}
.wcard p{color:var(--muted);font-size:14.5px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}
.split .ph{border-radius:18px;overflow:hidden;aspect-ratio:4/3;background-size:cover;background-position:center;box-shadow:0 26px 50px rgba(20,23,28,.16)}
.split ul{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:14px}
.split ul li{display:flex;gap:13px;font-size:15.5px}
.split ul li .ck{width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;flex-shrink:0;font-size:13px;margin-top:2px}
.split ul li b{font-weight:600}
.inds{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ind{border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:12px;transition:.25s;background:#fff}
.ind:hover{background:var(--ink);color:#fff;transform:translateY(-4px)}
.ind .ii{width:44px;height:44px;border-radius:11px;background:rgba(196,20,42,.10);display:grid;place-items:center;color:var(--red);transition:.25s}
.ind:hover .ii{background:var(--red);color:#fff}
.ind h4{font-family:"Be Vietnam Pro";font-weight:700;font-size:15.5px;letter-spacing:0}
.ind p{font-size:12.5px;color:var(--muted)}
.ind:hover p{color:var(--on-dark-mute)}
.csteps{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;counter-reset:s}
.cstep{position:relative;padding-top:46px}
.cstep::before{counter-increment:s;content:"0" counter(s);position:absolute;top:0;left:0;font-family:"Archivo";font-weight:900;font-size:30px;color:var(--red)}
.cstep::after{content:"";position:absolute;top:15px;left:56px;right:-14px;height:2px;background:var(--line)}
.cstep:last-child::after{display:none}
.cstep h4{font-size:15px;margin-bottom:6px;font-family:"Be Vietnam Pro";font-weight:700;letter-spacing:0}
.cstep p{font-size:12.5px;color:var(--muted)}
.formsec{background:var(--ink);color:var(--on-dark);position:relative;overflow:hidden}
.formsec .wrap{position:relative;z-index:2}
.fwrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:start}
.formsec h2{color:#fff;font-size:clamp(27px,3.2vw,40px)}
.formsec .fintro{color:var(--on-dark-mute);font-size:16px;margin-top:16px;max-width:380px}
.ftrust{margin-top:28px;display:flex;flex-direction:column;gap:14px}
.ftrust li{list-style:none;display:flex;gap:12px;align-items:flex-start;color:var(--on-dark);font-size:14.5px}
.ftrust .ck{width:22px;height:22px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;flex-shrink:0;font-size:12px;margin-top:1px}
.card{background:#fff;border-radius:20px;padding:38px;box-shadow:0 30px 70px rgba(0,0,0,.4)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{margin-bottom:18px}
.field.full{grid-column:span 2}
label{display:block;font-size:13px;font-weight:600;color:var(--charcoal);margin-bottom:7px}
label .req{color:var(--red)}
input,select,textarea{width:100%;font-family:"Be Vietnam Pro";font-size:14.5px;color:var(--charcoal);padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;transition:.2s;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(196,20,42,.12)}
textarea{resize:vertical;min-height:92px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted);margin:4px 0 20px}
.consent input{width:auto;margin-top:3px}
.err{border-color:var(--red)!important}
.formnote{font-size:12px;color:var(--muted-2);margin-top:14px;text-align:center}
.success{display:none;text-align:center;padding:30px 10px}
.success .sic{width:72px;height:72px;border-radius:50%;background:rgba(196,20,42,.10);color:var(--red);display:grid;place-items:center;margin:0 auto 18px}
.success h3{font-size:24px;margin-bottom:10px}
.success p{color:var(--muted);font-size:15px;max-width:380px;margin:0 auto}
@media(max-width:980px){
.why,.inds{grid-template-columns:1fr 1fr}
.split,.fwrap{grid-template-columns:1fr;gap:32px}
.csteps{grid-template-columns:1fr 1fr}
.cstep::after{display:none}
}
@media(max-width:560px){
.why,.inds,.frow,.csteps,.fgrid{grid-template-columns:1fr}
.field.full{grid-column:span 1}
.card{padding:26px}
}
@media(max-width:560px){
.hero .wrap{padding-top:54px;padding-bottom:60px}
.hero-card{padding:22px}
.vcard,.scell,.ncard .nbody{padding:24px}
}
.hero h1{font-size:clamp(20px,2.1vw,30px) !important;line-height:1.18;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sec-head h2,.split h2{font-size:clamp(26px,3.1vw,40px) !important}
.sec-head h2,.split h2,.market h2,.ctaband h2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:768px){
.sec-head h2,.split h2,.market h2,.ctaband h2{-webkit-line-clamp:initial;display:block;overflow:visible}
}
.hero{position:relative;background:#10131a;color:var(--charcoal);min-height:calc(70vh);
    display:flex;flex-direction:column;padding:0;overflow:hidden}
.hero .bgimg,.hero .mesh,.hero .hexpat{display:none}
.hero .hero-slides{position:absolute;inset:0;z-index:0}
.hero .hslide{position:absolute;inset:0;background-size:cover;background-position:center;
    opacity:0;transform:scale(1.06);transition:opacity 1.1s ease, transform 6s ease}
.hero .hslide.is-active{opacity:1;transform:scale(1)}
.hero .hero-scrim{position:absolute;inset:0;z-index:1;background:
    linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.93) 34%, rgba(255,255,255,.64) 54%, rgba(255,255,255,.16) 72%, rgba(255,255,255,0) 88%)}
.hero .hero-grid{position:relative;z-index:2;flex:1 1 auto;display:flex;align-items:center}
.hero-left{width:100%;padding:64px max(36px,5vw) 64px max(40px,7vw);position:relative}
.hero-left::before{content:"";position:absolute;left:0;top:24%;bottom:24%;width:3px;background:var(--red)}
.hero-content{max-width:520px}
.hero h1{font-size:clamp(22px,2.4vw,34px) !important;line-height:1.16;color:var(--ink);margin:0;font-weight:900;
    text-shadow:0 1px 0 rgba(255,255,255,.4);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero h1 .hl{color:var(--red)}
.hero p.lead{font-size:clamp(15px,1.1vw,17px);color:#3c424a;max-width:420px;margin-top:18px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hero .hero-cta{display:flex;gap:12px;flex-wrap:nowrap;margin-top:26px;align-items:center}
.hero .hero-cta .btn{white-space:nowrap;flex:0 1 auto}
.hero .btn-ghost,.hero .btn-line{background:rgba(255,255,255,.72);backdrop-filter:blur(4px);
    border-color:var(--line);color:var(--charcoal)}
.hero .btn-ghost:hover,.hero .btn-line:hover{border-color:var(--charcoal);background:#fff}
.hero-badge{position:absolute;right:30px;bottom:30px;z-index:3;display:flex;align-items:center;gap:16px;
    background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.6);
    border-radius:16px;padding:14px 18px;box-shadow:0 20px 44px rgba(20,23,28,.22)}
.hero-badge .bn{font-family:"Archivo";font-weight:900;font-size:24px;color:var(--ink);line-height:1;white-space:nowrap}
.hero-badge .bd{width:1px;height:34px;background:var(--line)}
.hero-badge .bl{font-size:12px;color:var(--muted);max-width:150px;line-height:1.4}
.hero-dots{position:absolute;left:max(40px,7vw);bottom:34px;z-index:3;display:flex;gap:10px}
.hero-dots button{width:30px;height:4px;border-radius:99px;border:none;cursor:pointer;padding:0;
    background:rgba(20,23,28,.22);transition:.25s}
.hero-dots button.on{background:var(--red);width:44px}
@media(max-width:980px){
.hero{min-height:0}
.hero .hero-scrim{background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.88) 42%, rgba(255,255,255,.72) 66%, rgba(255,255,255,.6) 100%)}
.hero .hero-grid{min-height:56vh}
.hero-left{padding:48px max(20px,6vw) 56px}
.hero-left::before{top:48px;bottom:auto;height:40px}
.hero-badge{right:14px;top:16px;bottom:auto;padding:11px 14px}
.hero-dots{left:20px;bottom:18px}
}
@media(max-width:560px){
.hero .hero-grid{min-height:64vh}
.hero .hero-cta{gap:8px}
.hero .hero-cta .btn{padding:11px 13px;font-size:12.5px;gap:6px}
.hero-left{padding:40px 20px 56px}
.hero-badge .bn{font-size:20px}
.hero-badge .bl{font-size:11px;max-width:120px}
}
