/* ==========================================================================
MEKONG GREEN, DESIGN SYSTEM v5 (khớp giao diện tham khảo v0-mekong-green-website)
Font: Be Vietnam Pro (đúng font gốc). Màu: lấy mẫu trực tiếp từ ảnh chụp trang tham khảo.
Nap font qua + preconnect (nhanh hon @import 1 vong tron-trip),
bo bot -- 300 khong dung toi, chi con 400/500/600/700/800/900 + italic 400.
========================================================================== */
/* ==========================================================================
TOKENS — nguồn duy nhất. (Trước đây có 3 khối :root rải rác — v5 gốc,
"v2 bảng màu theo logo", và mg-polish — ghi đè chồng lên nhau, không ai
biết token nào đang thật sự có hiệu lực. Đã gộp về một chỗ, giữ đúng giá
trị cuối cùng đang hiển thị ngoài site, không đổi giao diện.)
========================================================================== */
:root{
--brand:#22B81A; /* xanh lá logo */
--brand-dark:#1CA015;
--brand-deep:#178011; /* đậm cho chữ, green */
--teal:#0FAADA; /* xanh dương logo */
--teal-dark:#0B82AD; /* đậm cho chữ, blue */
--teal-deep:#0A759C; /* đậm hơn teal-dark -- dung lam NEN cho nut/badge chu trang, dat AA 4.5:1 (teal-dark tren nen chi 4.37:1, sat nguong nhung khong du) */
--teal-tint:rgba(15,170,218,.12);
--ink-deep:#111827; /* mực đen, nền tối footer/CTA/mobile-panel */
--deep:#111827;
--forest:#178011;
--forest-light:#FFFFFF;
--paper:#EAF6EE; /* tint xen kẽ green */
--surface:#FFFFFF;
--surface-2:#FAFBFC;
--ink:#111827; /* mực đen chữ chính */
--muted:#5B6B72;
--muted-2:#93A0A6;
--border:#DCEEE8;
--badge-bg:rgba(34,184,26,.12);
--badge-bg-dark:rgba(255,255,255,.08);
--badge-border-dark:rgba(255,255,255,.16);
--gold:#0FAADA; --gold-tint:rgba(15,170,218,.12); --gold-ink:#0B82AD;
--soil:#0B82AD; --leaf:#22B81A;
--radius:16px; --radius-sm:10px; --radius-lg:24px;
--maxw:1280px;
/* --shadow / --shadow-lg lấy giá trị cuối từ lớp mg-polish (v6) — xem bên dưới */
--shadow:0 1px 2px rgba(15,51,35,.05),0 8px 24px rgba(15,51,35,.06);
--shadow-lg:0 24px 70px rgba(15,51,35,.16);
--shadow-hover:0 2px 4px rgba(15,51,35,.06),0 22px 48px rgba(15,51,35,.14);
--display:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
--mono:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
--ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;}
button,input,select,textarea,optgroup,option{font-family:inherit;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--surface-2);color:var(--ink);
font-family:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
line-height:1.6; -webkit-font-smoothing:antialiased;}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--brand);color:#fff;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
@media (max-width:900px){.container{padding:0 20px;}}
.container-narrow{max-width:820px;margin:0 auto;padding:0 32px;}
@media (max-width:900px){.container-narrow{padding:0 20px;}}
h1,h2,h3,h4{font-family:inherit;font-weight:800;text-wrap:balance;margin:0;letter-spacing:-.015em;}
h2.section-title{font-size:clamp(30px,3.8vw,46px);color:var(--ink);text-align:center;}
.section-head{text-align:center;max-width:760px;margin:0 auto 48px;}
.section-head .lede{margin:14px auto 0;}
/* ---- badge / pill (thay cho eyebrow cu) ---- */
.badge-pill{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--brand-deep);
background:var(--badge-bg);border:1px solid rgba(38,184,74,.25);padding:8px 16px;border-radius:999px;margin:0 0 18px;}
.badge-pill.center{margin-left:auto;margin-right:auto;}
.badge-pill.on-dark{color:#fff;background:rgba(10,20,12,.42);border-color:rgba(255,255,255,.28);backdrop-filter:blur(6px);}
.section-head .badge-pill{display:inline-flex;}
.lede{color:var(--muted);font-size:17.5px;max-width:660px;line-height:1.7;}
/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px;
padding:14px 26px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;
transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
white-space:nowrap;font-family:inherit;}
.btn:active{transform:translateY(1px);}
/* nen dung --brand-deep (khong phai --brand) vi chu trang tren --brand chi dat 2.65:1, khong qua duoc AA 4.5:1 */
.btn-primary{background:var(--brand-deep);color:#fff;box-shadow:0 8px 20px rgba(38,184,74,.28);}
.btn-primary:hover{background:var(--brand-deep);filter:brightness(.88);box-shadow:0 10px 24px rgba(38,184,74,.4);}
.btn-white{background:#fff;color:var(--forest);}
.btn-white:hover{background:#EAFBF0;}
.btn-gold{background:var(--teal-deep);color:#fff;}
.btn-gold:hover{background:var(--teal-deep);filter:brightness(.88);}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.55);}
.btn-outline:hover{background:rgba(255,255,255,.12);border-color:#fff;}
.btn-outline-dark{background:transparent;color:var(--ink);border-color:var(--border);}
.btn-outline-dark:hover{border-color:var(--brand);color:var(--brand-deep);}
.btn-sm{padding:10px 18px;font-size:13.5px;}
.btn-pilllink{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink);
border:1px solid var(--border);padding:9px 18px;border-radius:999px;background:#fff;}
.btn-pilllink:hover{border-color:var(--brand);color:var(--brand-deep);}
/* ============ HEADER ============ */
header.site{position:fixed;top:0;left:0;right:0;z-index:100;background:transparent;border-bottom:1px solid transparent;
transition:background .25s ease, border-color .25s ease, box-shadow .25s ease;}
header.site:is(.scrolled,.solid){background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-color:var(--border);
box-shadow:0 1px 2px rgba(17,24,16,.05);}
.nav-row{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px;}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16.5px;letter-spacing:.02em;color:#fff;flex:none;
transition:color .25s ease;}
header.site:is(.scrolled,.solid) .logo{color:var(--ink);}
.logo .mark{width:38px;height:38px;flex:none;border-radius:10px;overflow:hidden;background:#fff;}
.logo .mark img{width:100%;height:100%;object-fit:contain;}
.logo .logo-full{height:52px;width:auto;object-fit:contain;flex:none;}
.logo .logo-companyname{font-size:11px;font-weight:700;line-height:1.35;letter-spacing:.01em;
border-left:1px solid currentColor;opacity:.75;padding-left:12px;margin-left:2px;}
@media (max-width:520px){.logo .logo-full{height:42px;}.logo .logo-companyname{display:none;}}
nav.primary{display:flex;align-items:center;gap:2px;flex:1;justify-content:center;min-width:0;}
.nav-item{position:relative;flex:none;}
.nav-link{display:flex;align-items:center;gap:4px;padding:10px 14px;border-radius:8px;font-size:14.5px;
font-weight:600;color:#fff;white-space:nowrap;transition:color .25s ease;}
.nav-link:hover,.nav-link.active{color:var(--brand);}
header.site:is(.scrolled,.solid) .nav-link{color:var(--ink);}
header.site:is(.scrolled,.solid) .nav-link:hover,header.site:is(.scrolled,.solid) .nav-link.active{color:var(--brand-deep);}
.nav-actions{display:flex;align-items:center;gap:12px;flex:none;}
.burger{display:none;flex:none;width:40px;height:40px;border-radius:8px;border:1px solid rgba(255,255,255,.3);
background:rgba(255,255,255,.12);align-items:center;justify-content:center;transition:background .25s,border-color .25s;}
.burger svg path{stroke:#fff;transition:stroke .25s;}
header.site:is(.scrolled,.solid) .burger{background:#fff;border-color:var(--border);}
header.site:is(.scrolled,.solid) .burger svg path{stroke:var(--ink);}
@media (max-width:980px){
nav.primary,.nav-actions .btn-primary{display:none;}
.burger{display:flex;}
}
body{padding-top:0;}
main,.page-body{display:block;}
.mobile-panel{position:fixed;inset:0;background:var(--ink-deep);z-index:200;color:#fff;padding:24px;
transform:translateX(100%);overflow-y:auto;
visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s;}
.mobile-panel.open{transform:translateX(0);visibility:visible;transition:transform .25s ease,visibility 0s linear 0s;}
.mobile-panel .mtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;}
.mobile-panel .close{width:38px;height:38px;border-radius:8px;background:rgba(255,255,255,.1);border:none;color:#fff;font-size:18px;}
.mobile-panel a.mlink{display:block;padding:14px 4px;font-size:17px;font-weight:700;border-bottom:1px solid rgba(255,255,255,.12);}
.mobile-panel .btn{margin-top:20px;width:100%;justify-content:center;}
/* ============ HERO ANH THAT (trang chu) ============ */
.hero-photo{position:relative;min-height:860px;display:flex;align-items:flex-end;overflow:hidden;color:#fff;}
.hero-photo .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-photo .overlay{position:absolute;inset:0;z-index:1;
background:linear-gradient(0deg, rgba(6,14,8,.38) 0%, rgba(6,14,8,.08) 45%, rgba(6,14,8,0) 70%);}
.hero-photo .container{position:relative;z-index:2;padding-top:160px;padding-bottom:64px;width:100%;}
.hero-grid2{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;}
@media (max-width:940px){.hero-grid2{grid-template-columns:1fr;}}
.hero-photo h1{font-size:clamp(38px,5.4vw,64px);line-height:1.12;margin:16px 0 20px;text-shadow:0 2px 18px rgba(0,0,0,.5);}
.hero-photo h1 .accent{color:var(--brand);}
.hero-photo p.lede{color:#F2F8F0;max-width:580px;font-size:19px;text-shadow:0 1px 10px rgba(0,0,0,.55);}
.hero-photo p.lede b{color:var(--brand);font-weight:700;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}
.hero-actions .btn{font-size:16px;padding:15px 28px;}
/* hero pillar row - 3 nang luc cot loi, thay cho khoi so lieu so sanh */
.hero-pillar-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px;max-width:640px;}
@media (max-width:560px){.hero-pillar-row{grid-template-columns:1fr;}}
.hero-pillar-row .hp{background:rgba(10,16,10,.42);border:1px solid rgba(255,255,255,.16);border-radius:16px;
padding:18px 16px;backdrop-filter:blur(8px);}
.hero-pillar-row .hp svg{margin-bottom:10px;stroke:var(--brand);}
.hero-pillar-row .hp h5{font-size:14.5px;color:#fff;margin:0 0 5px;font-weight:800;}
.hero-pillar-row .hp p{font-size:12.5px;color:#DCF0DF;margin:0;line-height:1.5;}
.hero-orbit{position:relative;width:380px;height:380px;margin:0 auto;display:none;}
@media (min-width:941px){.hero-orbit{display:block;}}
.orbit-ring{position:absolute;inset:0;border-radius:50%;padding:1.5px;
background:conic-gradient(from 200deg, var(--teal), var(--brand) 45%, var(--brand) 75%, var(--teal) 100%);
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor; mask-composite:exclude; opacity:.55;}
.orbit-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:250px;height:250px;border-radius:50%;
background:radial-gradient(circle at 32% 28%, #3AD65A, var(--brand) 55%, var(--teal-dark) 130%);
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#fff;
box-shadow:0 0 0 12px rgba(38,184,74,.12), 0 24px 60px rgba(0,0,0,.4);}
.orbit-core svg{margin-bottom:4px;}
.orbit-core b{font-size:20px;font-weight:800;letter-spacing:.02em;}
.orbit-core .yr{font-size:30px;font-weight:800;}
.orbit-core span.tag{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.9;}
.orbit-badge{position:absolute;font-size:13.5px;font-weight:700;color:#fff;background:rgba(10,20,12,.75);
border:1px solid rgba(38,184,74,.4);padding:8px 16px;border-radius:999px;backdrop-filter:blur(4px);white-space:nowrap;}
.orbit-badge.teal{border-color:rgba(23,172,218,.5);}
.orbit-badge.b1{top:-6%;left:50%;transform:translateX(-50%);}
.orbit-badge.b2{bottom:4%;right:-16%;}
.orbit-badge.b3{bottom:4%;left:-16%;}
.orbit-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 8px var(--brand);}
.orbit-dot.d1{top:-4px;left:50%;transform:translateX(-50%);}
.orbit-dot.d2{bottom:-4px;left:50%;transform:translateX(-50%);}
/* ============ SECTIONS ============ */
section{padding:96px 0;}
@media (max-width:760px){section{padding:56px 0;}}
section.alt{background:var(--paper);}
section.white{background:var(--surface);}
section.sm{padding:56px 0;}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;flex-wrap:wrap;}
.head-row .btn{flex:none;}
/* platform cards (anh len tren, icon overlay) */
.platform-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
@media (max-width:900px){.platform-grid{grid-template-columns:1fr;}}
.platform-card{background:var(--surface);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .18s;}
.platform-card:hover{transform:translateY(-4px);}
.platform-card .thumb{position:relative;height:190px;}
.platform-card .thumb img{width:100%;height:100%;object-fit:cover;}
.platform-card .thumb .icb{position:absolute;left:16px;bottom:-18px;width:48px;height:48px;border-radius:12px;
background:var(--brand);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(38,184,74,.4);}
.platform-card .body{padding:32px 22px 22px;}
.platform-card h3{font-size:19.5px;margin-bottom:8px;}
.platform-card p{font-size:14.5px;color:var(--muted);margin:0;}
/* value grid (icon + stat) */
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:900px){.value-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.value-grid{grid-template-columns:1fr;}}
.value-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px;
display:flex;flex-direction:column;gap:14px;}
.value-card .ic{width:52px;height:52px;border-radius:14px;background:var(--paper);display:flex;align-items:center;justify-content:center;}
.value-card h4{font-size:17px;}
.value-card p.d{font-size:14px;color:var(--muted);margin:0;flex:1;}
.value-card .stat{display:flex;align-items:baseline;gap:8px;padding-top:6px;border-top:1px solid var(--border);}
.value-card .stat b{font-size:24px;font-weight:800;color:var(--brand-deep);}
.value-card .stat span{font-size:12px;color:var(--muted);}
/* process steps */
.step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
@media (max-width:900px){.step-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.step-grid{grid-template-columns:1fr;}}
.step-card{position:relative;}
.step-card .thumb{position:relative;height:150px;border-radius:var(--radius) var(--radius) 0 0;overflow:hidden;}
.step-card .thumb img{width:100%;height:100%;object-fit:cover;}
.step-card .num{position:absolute;top:14px;left:14px;width:36px;height:36px;border-radius:10px;background:var(--forest);
color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;z-index:2;}
.step-card .body{background:#fff;border:1px solid var(--border);border-top:none;border-radius:0 0 var(--radius) var(--radius);padding:18px;}
.step-card h4{font-size:15px;margin-bottom:6px;}
.step-card p{font-size:12.5px;color:var(--muted);margin:0;}
/* stat floating card */
.stat-float{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);
padding:32px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
@media (max-width:700px){.stat-float{grid-template-columns:1fr 1fr;}}
.stat-float b{display:block;font-size:30px;font-weight:800;color:var(--brand-deep);font-variant-numeric:tabular-nums;}
.stat-float span{font-size:13px;color:var(--muted);}
/* dark tech section */
.tech-dark{background:linear-gradient(180deg,var(--paper) 0%,#EAF6F2 100%);color:var(--ink);}
.tech-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
@media (max-width:900px){.tech-grid{grid-template-columns:1fr;}}
.tech-dark h2{color:var(--ink);font-size:clamp(26px,3.4vw,36px);text-align:left;}
.tech-dark h2 .accent{color:#17ACDA;display:block;}
.tech-dark p.lede{color:var(--muted);}
.tech-feat{display:flex;gap:16px;margin-top:26px;}
.tech-feat .ic{width:48px;height:48px;border-radius:12px;background:#fff;border:1px solid rgba(23,172,218,.35);
display:flex;align-items:center;justify-content:center;flex:none;box-shadow:var(--shadow);}
.tech-feat .ic svg{stroke:var(--teal-dark);}
.tech-feat h4{font-size:15.5px;color:var(--ink);margin-bottom:4px;}
.tech-feat p{font-size:13.5px;color:var(--muted);margin:0;}
.tech-side{display:flex;flex-direction:column;gap:16px;align-items:flex-end;}
@media (max-width:900px){.tech-side{align-items:flex-start;}}
.tech-badge{background:var(--brand-deep);border-radius:16px;padding:18px 22px;color:#fff;text-align:right;box-shadow:0 10px 24px rgba(38,184,74,.28);}
@media (max-width:900px){.tech-badge{text-align:left;}}
.tech-badge b{font-size:20px;display:block;}
.tech-badge span{font-size:12px;opacity:.85;}
.tech-stat{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px 22px;text-align:right;box-shadow:var(--shadow);}
@media (max-width:900px){.tech-stat{text-align:left;}}
.tech-stat b{font-size:22px;color:var(--teal-dark);display:block;}
.tech-stat span{font-size:12px;color:var(--muted);}
/* partners */
.partner-grid2{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (max-width:900px){.partner-grid2{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.partner-grid2{grid-template-columns:1fr;}}
.partner-card2{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px 22px;text-align:center;}
.partner-card2 .ic{width:52px;height:52px;border-radius:14px;background:var(--paper);display:flex;align-items:center;
justify-content:center;margin:0 auto 14px;}
.partner-card2 h4{font-size:15px;}
.partner-card2 p{font-size:12.5px;color:var(--muted);margin:4px 0 0;}
/* CTA band */
.cta-band{position:relative;background:var(--forest);color:#fff;overflow:hidden;text-align:center;}
.cta-band .blob{position:absolute;border-radius:50%;background:var(--forest-light);opacity:.5;filter:blur(2px);}
.cta-band .blob.b1{width:340px;height:340px;left:-120px;top:-100px;}
.cta-band .blob.b2{width:280px;height:280px;right:-100px;bottom:-120px;}
.cta-band .inner{position:relative;z-index:2;max-width:640px;margin:0 auto;}
.cta-band h2{color:#fff;font-size:clamp(24px,3.2vw,34px);}
.cta-band p{color:#D6ECD9;margin-top:12px;font-size:15.5px;}
.cta-formrow{display:flex;gap:12px;justify-content:center;margin-top:28px;flex-wrap:wrap;}
.cta-formrow input{padding:14px 20px;border-radius:999px;border:none;font-family:inherit;font-size:14.5px;min-width:260px;}
/* bright CTA strip - thay cho cac khoi CTA nen den truoc day */
.cta-strip{position:relative;background:linear-gradient(120deg,var(--brand) 0%,var(--brand-dark) 100%);color:#fff;overflow:hidden;text-align:center;}
.cta-strip .blob{position:absolute;border-radius:50%;background:rgba(255,255,255,.14);filter:blur(2px);}
.cta-strip .blob.b1{width:280px;height:280px;left:-100px;top:-90px;}
.cta-strip .blob.b2{width:240px;height:240px;right:-90px;bottom:-100px;}
.cta-strip .inner{position:relative;z-index:2;}
.cta-strip h2{color:#fff;}
.cta-strip .eyebrow{color:#EAFBEF;}
.cta-strip .eyebrow::before{background:#fff;}
.cta-strip p.lede{color:#EAFBEF;}
/* value-row: 5 gia tri cot loi trinh bay 1 hang co icon */
.value-row{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
@media (max-width:980px){.value-row{grid-template-columns:repeat(3,1fr);}}
@media (max-width:620px){.value-row{grid-template-columns:repeat(2,1fr);}}
.value-row .vr-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px 18px;text-align:center;}
.value-row .vr-card.first{border-color:var(--brand);border-width:1.6px;background:var(--badge-bg);}
.value-row .vr-ic{width:52px;height:52px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.value-row .vr-card.first .vr-ic{background:#fff;}
.value-row h4{font-size:14.5px;color:var(--ink);margin-bottom:6px;}
.value-row p{font-size:12px;color:var(--muted);margin:0;line-height:1.55;}
/* founder card voi anh that */
.founder-card .avatar-photo{width:150px;height:150px;border-radius:50%;object-fit:cover;flex:none;border:3px solid var(--surface);box-shadow:var(--shadow);}
@media (max-width:700px){.founder-card .avatar-photo{margin:0 auto;}}
/* partner logo chip - dung khi chua co logo that cua doi tac */
.partner-logo{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;
font-weight:800;font-size:15px;color:#fff;margin:0 auto 14px;letter-spacing:.02em;}
.partner-logo.img{background:var(--surface);border:1px solid var(--border);padding:8px;}
.partner-logo.img img{width:100%;height:100%;object-fit:contain;}
/* vertical column timeline (lo trinh khong so lieu trieu tan) */
.tl-col-wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;padding-top:8px;}
@media (max-width:900px){.tl-col-wrap{grid-template-columns:1fr;gap:28px;}}
.tl-col-wrap::before{content:"";position:absolute;top:8px;left:0;right:0;height:100%;}
.tl-col{position:relative;padding:0 14px;text-align:center;display:flex;flex-direction:column;align-items:center;}
@media (max-width:900px){.tl-col{flex-direction:row;align-items:flex-start;text-align:left;padding:0;gap:16px;}}
.tl-col .bar-wrap{width:100%;height:180px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:16px;}
@media (max-width:900px){.tl-col .bar-wrap{width:6px;height:auto;align-self:stretch;margin-bottom:0;}}
.tl-col .bar{width:64%;border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,var(--brand) 0%,var(--brand-dark) 100%);position:relative;}
@media (max-width:900px){.tl-col .bar{width:6px;border-radius:6px;min-height:100%;}}
.tl-col.now .bar{background:linear-gradient(180deg,var(--teal) 0%,var(--teal-dark) 100%);}
.tl-col .yr{font-size:20px;font-weight:800;color:var(--ink);}
.tl-col .now-flag{display:inline-block;font-size:10px;font-weight:700;color:var(--teal-dark);background:var(--teal-tint);
padding:2px 9px;border-radius:999px;margin:4px 0 2px;}
.tl-col h4{font-size:13.5px;color:var(--brand-deep);text-transform:uppercase;letter-spacing:.04em;margin:4px 0 10px;}
.tl-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.tl-col li{font-size:12px;color:var(--muted);line-height:1.5;}
/* legacy component classes kept for subpage compatibility */
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--brand-deep);
display:inline-flex;align-items:center;gap:8px;margin:0 0 10px;}
.eyebrow::before{content:"";width:16px;height:2px;background:var(--brand);border-radius:2px;flex:none;}
.eyebrow.on-dark{color:#CFEAE0;}
.page-hero{position:relative;overflow:hidden;min-height:340px;display:flex;align-items:center;color:#fff;}
.page-hero .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.page-hero .overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg, rgba(6,14,8,.42) 0%, rgba(6,14,8,.1) 55%, rgba(6,14,8,0) 78%);}
.page-hero .container{position:relative;z-index:2;padding:120px 32px 64px;}
.breadcrumb{font-size:12.5px;color:#EAF6EC;margin-bottom:16px;display:flex;gap:8px;align-items:center;text-shadow:0 1px 8px rgba(0,0,0,.5);}
.breadcrumb a{color:#BFE0D2;}
.breadcrumb a:hover{color:#fff;}
.page-hero h1{font-size:clamp(32px,4.4vw,48px);line-height:1.14;margin:12px 0 14px;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.5);}
.page-hero p.lede{color:#F2F8F0;max-width:620px;font-size:18px;text-shadow:0 1px 10px rgba(0,0,0,.55);}
.page-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;position:relative;z-index:2;}
@media (max-width:900px){.page-hero-grid{grid-template-columns:1fr;}}
.quote-block{max-width:820px;margin:0 auto;text-align:center;}
.quote-block blockquote{margin:0;font-size:clamp(22px,3vw,30px);font-weight:700;color:var(--ink);line-height:1.35;text-wrap:balance;}
.quote-block blockquote span{color:var(--brand-deep);}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px;}
@media (max-width:760px){.stat-row{grid-template-columns:1fr;}}
.stat-row.cols-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){.stat-row.cols-4{grid-template-columns:repeat(2,1fr);}}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px 22px;}
.stat-card b{display:block;font-size:32px;font-weight:800;color:var(--brand-deep);font-variant-numeric:tabular-nums;}
.stat-card p{margin:6px 0 0;font-size:13.5px;color:var(--muted);}
.prod-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
@media (max-width:1080px){.prod-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:640px){.prod-grid{grid-template-columns:1fr 1fr;}}
.prod-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px 18px;
display:flex;flex-direction:column;gap:12px;transition:box-shadow .15s, transform .15s;}
.prod-card:hover{box-shadow:var(--shadow);transform:translateY(-3px);}
.prod-card .ic{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--paper);}
.prod-card h3{font-size:15px;}
.prod-card p{font-size:12.5px;color:var(--muted);margin:0;flex:1;}
.prod-card .go{font-size:12.5px;font-weight:700;color:var(--brand-deep);}
.steps{display:flex;gap:0;overflow-x:auto;padding-bottom:8px;margin:0 -4px;scrollbar-width:thin;}
.step{flex:1 0 150px;padding:0 18px;position:relative;text-align:center;}
.step:not(:last-child)::after{content:"";position:absolute;top:19px;right:-10px;width:22px;height:1.6px;background:var(--border);}
.step .n{width:38px;height:38px;border-radius:50%;background:var(--brand-deep);color:#fff;display:flex;
align-items:center;justify-content:center;font-weight:800;font-size:14px;margin:0 auto 12px;}
.step p{font-size:13px;font-weight:600;margin:0;color:var(--ink);}
.trust{background:var(--paper);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.trust-row{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:space-between;}
.trust-quote{max-width:460px;font-size:16px;font-weight:600;color:var(--ink);}
.trust-logos{display:flex;gap:34px;align-items:center;flex-wrap:wrap;}
.trust-logos .lg{font-weight:800;font-size:15px;color:var(--muted);letter-spacing:.02em;opacity:.85;}
.trust-stat{text-align:center;}
.trust-stat b{font-size:26px;color:var(--brand-deep);font-weight:800;}
.trust-stat span{display:block;font-size:11.5px;color:var(--muted);}
.timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;}
.timeline::before{content:"";position:absolute;top:9px;left:5%;right:5%;height:2px;background:var(--border);}
@media (max-width:820px){.timeline{grid-template-columns:1fr;gap:22px;} .timeline::before{display:none;}}
.tl-item{position:relative;padding-top:28px;}
@media (max-width:820px){.tl-item{padding-top:0;padding-left:26px;}}
.tl-dot{position:absolute;top:0;left:calc(50% - 9px);width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--border);}
@media (max-width:820px){.tl-dot{top:2px;left:0;}}
.tl-item.now .tl-dot{border-color:var(--brand);background:var(--brand);}
.tl-item h4{text-align:center;font-size:14px;color:var(--ink);}
.tl-item p{text-align:center;font-size:12px;color:var(--muted);margin:4px 0 0;}
@media (max-width:820px){.tl-item h4,.tl-item p{text-align:left;}}
.tl-vert{position:relative;padding-left:34px;border-left:2px solid var(--border);display:flex;flex-direction:column;gap:34px;}
.tlv-item{position:relative;}
.tlv-item::before{content:"";position:absolute;left:-42px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--brand);border:3px solid var(--surface-2);}
.tlv-item .yr{font-size:12.5px;font-weight:800;color:var(--brand-deep);background:var(--badge-bg);display:inline-block;padding:3px 10px;border-radius:999px;margin-bottom:8px;}
.tlv-item h4{font-size:17px;color:var(--ink);margin-bottom:6px;}
.tlv-item p{font-size:14px;color:var(--muted);margin:0;max-width:640px;}
.val-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
@media (max-width:900px){.val-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.val-grid{grid-template-columns:1fr;}}
.val-card{border:1px solid var(--border);border-radius:var(--radius);padding:20px 16px;background:var(--surface);text-align:left;}
.val-card.first{border-color:var(--brand);border-width:1.6px;}
.val-card .num{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.06em;}
.val-card h4{font-size:14.5px;margin:8px 0 4px;color:var(--ink);}
.val-card p{font-size:12px;color:var(--muted);margin:0;}
.val-detail{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:26px;margin-bottom:18px;}
.val-detail.first{border-color:var(--brand);border-width:1.6px;background:var(--badge-bg);}
.val-detail .vh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;}
.val-detail .vh h3{font-size:19px;color:var(--ink);}
.val-detail .vh span{font-size:12.5px;color:var(--muted);font-style:italic;}
.val-detail p.desc{font-size:14px;color:var(--ink);margin:10px 0 16px;max-width:760px;}
.dolist{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media (max-width:700px){.dolist{grid-template-columns:1fr;}}
.dolist h5{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;}
.dolist.do h5{color:var(--brand-deep);} .dolist.dont h5{color:#B45309;}
.dolist ul{margin:0;padding-left:18px;font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:6px;}
.people-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (max-width:900px){.people-row{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.people-row{grid-template-columns:1fr;}}
.person{text-align:center;}
.avatar{width:74px;height:74px;border-radius:50%;margin:0 auto 12px;display:flex;align-items:center;
justify-content:center;color:#fff;font-weight:800;font-size:22px;flex:none;}
.person h4{font-size:14.5px;margin:0;}
.person span{font-size:12px;color:var(--muted);display:block;margin-top:3px;line-height:1.4;}
.person p.bio{font-size:12.5px;color:var(--muted);margin-top:8px;line-height:1.5;text-align:left;}
.founder-card{display:grid;grid-template-columns:220px 1fr;gap:32px;align-items:center;background:var(--surface);
border:1px solid var(--border);border-radius:16px;padding:32px;}
@media (max-width:700px){.founder-card{grid-template-columns:1fr;text-align:center;}}
.founder-card .avatar{width:150px;height:150px;font-size:44px;margin:0;}
@media (max-width:700px){.founder-card .avatar{margin:0 auto;}}
.founder-card h3{font-size:22px;color:var(--ink);}
.founder-card .role{font-size:13.5px;font-weight:700;color:var(--brand-deep);margin:4px 0 12px;}
.founder-card p{font-size:14.5px;color:var(--muted);margin:0;}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:860px){.news-grid{grid-template-columns:1fr;}}
.news-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.news-thumb{height:150px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.news-thumb img{width:100%;height:100%;object-fit:cover;}
.news-thumb svg{position:absolute;inset:0;width:100%;height:100%;}
.news-body{padding:18px 20px 20px;}
.news-tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--brand-deep);}
.news-body h3{font-size:15.5px;margin:8px 0 6px;line-height:1.35;}
.news-body p{font-size:12.5px;color:var(--muted);margin:0 0 10px;}
.news-meta{font-size:11.5px;color:var(--muted);}
.filter-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.filter-tabs button{font-family:inherit;font-size:13px;font-weight:700;padding:9px 16px;border-radius:999px;
border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;}
.filter-tabs button.active{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff;}
.pagination{display:flex;justify-content:center;gap:8px;margin-top:44px;}
.pagination a,.pagination span{width:36px;height:36px;border-radius:8px;border:1px solid var(--border);display:flex;
align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--muted);}
.pagination a.active,.pagination span.active{background:var(--ink-deep);color:#fff;border-color:var(--ink-deep);}
.aud-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media (max-width:820px){.aud-grid{grid-template-columns:1fr;}}
.aud-card{border:1.4px solid var(--border);border-radius:var(--radius);padding:26px 22px;background:var(--surface);
display:flex;flex-direction:column;gap:14px;transition:border-color .15s, transform .15s;}
.aud-card:hover{border-color:var(--brand);transform:translateY(-2px);}
.aud-card h3{font-size:16.5px;}
.aud-card p{font-size:13px;color:var(--muted);margin:0;flex:1;}
.pathway{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;padding:64px 0;border-bottom:1px solid var(--border);}
.pathway:last-child{border-bottom:none;}
@media (max-width:860px){.pathway{grid-template-columns:1fr;gap:26px;}}
.pathway.rev .art{order:2;}
@media (max-width:860px){.pathway.rev .art{order:0;}}
.pathway .art{border-radius:16px;overflow:hidden;}
.pathway ul.feat{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.pathway ul.feat li{display:flex;gap:10px;font-size:13.5px;color:var(--ink);}
.pathway ul.feat svg{flex:none;margin-top:2px;}
.partner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media (max-width:820px){.partner-grid{grid-template-columns:1fr;}}
.partner-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px;}
.partner-card h3{font-size:16px;color:var(--ink);margin-bottom:10px;}
.partner-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--border);}
.partner-item:first-of-type{border-top:none;}
.partner-item b{font-size:13.5px;}
.partner-item span{font-size:12px;color:var(--muted);}
.job-list{display:flex;flex-direction:column;gap:12px;}
.job-card{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--surface);
border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;flex-wrap:wrap;}
.job-card h3{font-size:15.5px;}
.job-tags{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap;}
.tag-pill{font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--badge-bg);color:var(--brand-deep);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}
.channel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px;}
@media (max-width:760px){.channel-grid{grid-template-columns:1fr;}}
.channel-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-align:center;}
.channel-card .ic{width:44px;height:44px;border-radius:50%;background:var(--paper);display:flex;align-items:center;
justify-content:center;margin:0 auto 12px;}
.channel-card h4{font-size:14.5px;}
.channel-card p{font-size:12.5px;color:var(--muted);margin:6px 0 0;}
.office-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:16px;}
.office-card h4{font-size:14.5px;color:var(--ink);margin-bottom:8px;}
.office-card p{font-size:13px;color:var(--muted);margin:2px 0;}
.hotline-card{background:var(--badge-bg);border:1.4px solid var(--brand);border-radius:var(--radius);padding:20px 22px;
display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.hotline-card b{font-size:20px;color:var(--brand-deep);}
.hotline-card span{font-size:12.5px;color:var(--muted);}
form.lead{background:#fff;border-radius:16px;padding:28px;color:var(--ink);}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:480px){.frow{grid-template-columns:1fr;}}
form.lead label{display:block;font-size:12.5px;font-weight:700;margin:14px 0 6px;color:var(--ink);}
form.lead label.req::after{content:" *";color:#B45309;}
form.lead input,form.lead select,form.lead textarea{width:100%;padding:11px 13px;border-radius:8px;
border:1px solid var(--border);font-size:14px;font-family:inherit;background:var(--paper);color:var(--ink);}
form.lead input:focus,form.lead select:focus,form.lead textarea:focus{outline:2px solid var(--brand);outline-offset:1px;}
form.lead textarea{resize:vertical;min-height:76px;}
form.lead .form-file{padding:9px 0;font-size:13.5px;color:var(--muted);}
form.lead .form-hint{display:block;font-size:11.5px;color:var(--muted);margin-top:4px;}
form.lead .btn{width:100%;justify-content:center;margin-top:20px;}
.form-note{font-size:11.5px;color:var(--muted);margin-top:10px;text-align:center;}
.form-success{display:none;text-align:center;padding:36px 8px;}
.form-success svg{margin:0 auto 14px;}
.form-success h3{font-size:17px;color:var(--ink);}
.form-success p{font-size:13.5px;color:var(--muted);margin-top:6px;}
/* honeypot: bẫy bot spam — người dùng thật không thấy, không dùng display:none để bot khó phát hiện.
Tên class PHẢI khác .hp: .hp đã là thẻ năng lực ở hero trang chủ, dùng chung tên sẽ
kéo luôn position:absolute;left:-9999px sang hero và làm 3 thẻ đó biến mất. */
.hp-trap{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
/* nhãn chỉ dành cho trình đọc màn hình, ẩn khỏi màn hình nhưng vẫn được đọc lên */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
clip:rect(0,0,0,0);white-space:nowrap;border:0;}
/* skip-link: ẩn ngoài màn hình cho tới khi được focus bằng bàn phím (Tab đầu tiên) */
.skip-link{position:absolute;left:12px;top:-60px;z-index:10000;background:var(--brand-deep);color:#fff;
padding:12px 20px;border-radius:8px;font-weight:700;font-size:14px;transition:top .15s ease;}
.skip-link:focus{top:12px;}
form.lead .form-status{font-size:13px;margin-top:12px;text-align:center;color:var(--muted);}
form.lead .form-status.err{color:#B3261E;font-weight:600;}
form.lead label.consent{display:flex;gap:8px;align-items:flex-start;font-weight:400;font-size:12.5px;color:var(--muted);cursor:pointer;}
form.lead label.consent input{width:auto;margin:2px 0 0;flex:none;}
form.lead label.consent a{color:var(--brand-deep);text-decoration:underline;}
form.lead button[disabled]{opacity:.6;cursor:not-allowed;}
.faq{border-top:1px solid var(--border);}
.faq-item{border-bottom:1px solid var(--border);}
.faq-q{width:100%;text-align:left;background:none;border:none;font-family:inherit;font-size:14.5px;font-weight:700;
color:var(--ink);padding:18px 4px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;}
.faq-q .plus{flex:none;font-size:18px;color:var(--brand-deep);transition:transform .15s;}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .2s ease;}
.faq-item.open .faq-a{max-height:200px;}
.faq-a p{font-size:13.5px;color:var(--muted);margin:0 0 18px;padding:0 4px;}
.article-head{max-width:760px;margin:0 auto;}
.article-head .breadcrumb{color:var(--muted);text-shadow:none;}
.article-head .breadcrumb a{color:var(--muted);}
.article-head .breadcrumb a:hover{color:var(--brand-deep);}
.article-body{max-width:760px;margin:0 auto;font-size:15.5px;color:var(--ink);}
.article-body p{margin:0 0 20px;text-align:justify;}
.article-body li{text-align:justify;}
.article-body .pull{font-size:19px;font-weight:700;color:var(--ink);border-left:3px solid var(--brand);padding-left:18px;margin:32px 0;}
.article-cover{border-radius:16px;overflow:hidden;margin:28px 0 36px;}
.share-row{display:flex;gap:10px;align-items:center;margin-top:36px;padding-top:24px;border-top:1px solid var(--border);}
.share-row a{width:36px;height:36px;border-radius:50%;background:var(--paper);border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;}
/* ============ FOOTER ============ */
footer.site{background:var(--ink-deep);color:#B9C7BA;padding:64px 0 0;}
.foot-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:32px;padding-bottom:44px;}
@media (max-width:900px){.foot-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr;}}
.foot-grid h5{font-size:13px;font-weight:700;color:#fff;margin:0 0 16px;}
.foot-grid a{display:block;font-size:13.5px;color:#A9BAAA;padding:5px 0;}
.foot-grid a:hover{color:var(--brand);}
.foot-grid a.logo{display:flex;padding:0;}
.foot-brand p{font-size:13px;color:#8FA391;max-width:300px;margin:12px 0 18px;}
.foot-social{display:flex;gap:10px;}
.foot-social a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.06);
display:flex;align-items:center;justify-content:center;padding:0;}
.foot-social a:hover{background:var(--brand);}
.foot-contact-item{display:flex;gap:10px;font-size:13px;color:#A9BAAA;padding:6px 0;align-items:flex-start;}
.foot-contact-item svg{flex:none;margin-top:2px;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;display:flex;justify-content:space-between;
flex-wrap:wrap;gap:10px;font-size:12.5px;color:#7C8F7E;}
.foot-bottom a{display:inline;padding:0;margin-left:16px;color:#7C8F7E;}
.foot-bottom a:hover{color:#fff;}
.illus-frame{border-radius:16px;overflow:hidden;position:relative;background:var(--paper);}
.illus-frame.ratio-16-9{aspect-ratio:16/9;}
.illus-frame.ratio-4-3{aspect-ratio:4/3;}
.illus-frame.ratio-1-1{aspect-ratio:1/1;}
.illus-frame img,.illus-frame svg{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.illus-cap{display:none !important;}
.spa-page{display:none}.spa-page.active{display:block}
/* Header: luôn nền trắng đặc + chữ đen trên MỌI trang (bỏ kiểu trong suốt/chữ trắng) */
header.site{background:rgba(255,255,255,.97) !important;border-bottom:1px solid var(--border) !important;
box-shadow:0 1px 2px rgba(17,24,39,.06) !important;}
.logo{color:var(--ink) !important;}
.nav-link{color:var(--ink) !important;}
.nav-link:hover,.nav-link.active{color:var(--brand-deep) !important;}
.burger{background:#fff !important;border:1px solid var(--border) !important;}
.burger svg path{stroke:var(--ink) !important;}
/* Ảnh đầu trang: tràn màn, khớp viền, không bo góc, đồng bộ 1 chiều cao cho mọi trang con */
.hero-photo{min-height:520px !important;}
.hero-photo .container{padding-top:128px !important;padding-bottom:40px !important;}
.page-hero{min-height:260px !important;max-width:none !important;width:100% !important;
margin:0 !important;border-radius:0 !important;}
.page-hero .container{padding:96px 32px 24px !important;}
.page-hero-grid{display:block !important;}
@media (max-width:640px){
.hero-photo{min-height:440px !important;}
.page-hero{min-height:220px !important;}
.page-hero .container{padding:88px 20px 20px !important;}
}
/* Slide banner ảnh lớn, bấm mũi tên để lướt (tham khảo mekogreen.com), tràn màn, không bo góc */
.hero-slider{position:relative;width:100%;overflow:hidden;}
.hero-slider-track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1);}
.hero-slide{position:relative;flex:0 0 100%;height:460px;}
.hero-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-slide .slide-overlay{position:absolute;inset:0;
background:linear-gradient(0deg,rgba(6,14,8,.62) 0%,rgba(6,14,8,.2) 48%,rgba(6,14,8,0) 72%);}
.hero-slide .slide-txt{position:absolute;left:0;right:0;bottom:0;padding:40px 56px;color:#fff;z-index:2;}
.hero-slide .slide-txt span{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
color:#fff;background:rgba(34,184,26,.9);padding:5px 14px;border-radius:999px;margin-bottom:14px;}
.hero-slide .slide-txt h3{font-size:clamp(22px,3vw,34px);margin-bottom:10px;font-weight:800;}
.hero-slide .slide-txt p{font-size:15px;color:#EAF6EC;max-width:580px;margin:0;line-height:1.6;}
.hero-slider-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;
background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;cursor:pointer;
box-shadow:var(--shadow);z-index:3;border:none;transition:background .2s,transform .2s;}
.hero-slider-nav:hover{background:#fff;transform:translateY(-50%) scale(1.06);}
.hero-slider-nav.prev{left:18px;} .hero-slider-nav.next{right:18px;}
.hero-slider-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:3;}
.hero-slider-dots button{width:8px;height:8px;border-radius:50%;border:none;background:rgba(255,255,255,.55);cursor:pointer;padding:0;transition:all .2s;}
.hero-slider-dots button.active{background:#fff;width:24px;border-radius:5px;}
/* nut tam dung/tiep tuc tu dong chuyen anh -- bat buoc theo WCAG 2.2.2 (Pause, Stop, Hide) */
.hero-slider-pause{position:absolute;right:18px;bottom:14px;z-index:4;width:30px;height:30px;border-radius:50%;
background:rgba(255,255,255,.92);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;
transition:background .2s;}
.hero-slider-pause:hover{background:#fff;}
@media (max-width:900px){.hero-slide{height:400px;}}
@media (max-width:640px){
.hero-slide{height:340px;}
.hero-slide .slide-txt{padding:22px 24px;}
.hero-slider-nav{width:38px;height:38px;}
.hero-slider-dots{bottom:52px;}
.hero-slider-pause{right:14px;bottom:14px;}
}
/* Token của "v2 bảng màu theo logo" đã gộp vào :root duy nhất ở đầu file — xem ghi chú TOKENS. */
.badge-pill{border-color:rgba(34,184,26,.25);}
.btn-primary{box-shadow:0 8px 20px rgba(34,184,26,.28);}
.btn-primary:hover{box-shadow:0 10px 24px rgba(34,184,26,.4);}
.btn-white:hover{background:#EAF6EE;}
header.site:is(.scrolled,.solid){box-shadow:0 1px 2px rgba(17,24,39,.06);}
.cta-band{background:linear-gradient(135deg,#22B81A 0%,#1CA015 100%) !important;}
.tech-dark{background:linear-gradient(180deg,#EAF6EE 0%,#DCF3E1 100%) !important;}
footer.site{background:#111827 !important;}
.mobile-panel{background:#111827 !important;}
.pagination a.active,.pagination span.active{background:#111827 !important;border-color:#111827 !important;}
.platform-card .thumb .icb{box-shadow:0 8px 18px rgba(34,184,26,.4);}
/* Icon Sứ mệnh & 5 Giá trị Cốt lõi: bỏ khung tròn nền, dùng icon minh hoạ nhiều sắc độ xanh lá (fill), không viền, chuyên nghiệp */
.value-row .vr-card .vr-ic{background:transparent !important;box-shadow:none !important;width:auto !important;height:auto !important;margin:0 auto 16px !important;}
.value-row .vr-card .vr-ic svg{width:60px !important;height:60px !important;}
.value-grid .value-card .ic{background:var(--paper) !important;}
.value-grid .value-card .ic svg path,.value-grid .value-card .ic svg circle{stroke:var(--brand-deep) !important;}
.partner-grid2 .partner-card2 .ic{background:var(--paper) !important;}
.partner-grid2 .partner-card2 .ic svg path{stroke:var(--brand-deep) !important;}
.channel-grid .channel-card .ic{background:var(--paper) !important;}
.channel-grid .channel-card .ic svg path{stroke:var(--brand-deep) !important;}
/* Nút: dùng xanh dương cho nút phụ / nút ứng tuyển để tạo điểm nhấn */
/* --teal-deep (không phải --teal-dark/--teal) vì chữ trắng trên 2 màu đó chỉ đạt 4.37:1 / 2.70:1, chưa đủ AA 4.5:1 */
.btn-gold{background:var(--teal-deep) !important;}
.btn-gold:hover{background:var(--teal-deep) !important;filter:brightness(.88);}
.btn-outline-dark:hover{border-color:var(--teal-dark) !important;color:var(--teal-dark) !important;}
/* Founder card, phong cách thẻ tối, ảnh bo góc vuông, badge thành tích */
.founder-card{background:#111827 !important;border:1px solid #111827 !important;align-items:flex-start !important;padding:32px !important;}
.founder-card .avatar-photo{border-radius:16px !important;}
.founder-card .avatar{border-radius:16px !important;}
.founder-card h3{color:#fff;}
.founder-card .role{color:var(--brand) !important;}
.founder-card p{color:#C7D2CC !important;}
.founder-cred-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;margin-top:20px;}
@media (max-width:640px){.founder-cred-grid{grid-template-columns:1fr;}}
.founder-cred{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#DCE6E0;}
.founder-cred svg{flex:none;}
/* ==========================================================================
BẢN THỬ NGHIỆM "ĐẶC MÀN HÌNH", chữ to hơn, ảnh to hơn, icon to & đậm màu hơn
(chỉ đổi kích thước/độ đậm trình bày, không đổi nội dung chữ & lựa chọn ảnh)
========================================================================== */
/* ---- Chữ: tiêu đề & đoạn dẫn to, đậm hơn ---- */
h2.section-title{font-size:clamp(36px,4.6vw,56px) !important;}
.hero-photo h1{font-size:clamp(44px,6vw,72px) !important;}
.page-hero h1{font-size:clamp(38px,5vw,58px) !important;}
.lede{font-size:19.5px !important;max-width:none !important;line-height:1.75 !important;}
.eyebrow{font-size:15px !important;letter-spacing:.06em !important;gap:0 !important;}
.eyebrow::before{display:none !important;}
.badge-pill{font-size:15px !important;padding:10px 20px !important;}
.btn{font-size:17px !important;padding:17px 32px !important;}
.btn-sm{font-size:15px !important;padding:13px 24px !important;}
h3{font-size:1.16em;}
.value-card h4,.person h4,.founder-card h3{font-size:1.14em;}
/* ---- Ảnh: khung ảnh/thumbnail to hơn ---- */
.hero-slide{height:560px !important;}
.platform-card .thumb{height:250px !important;}
.step-card .thumb{height:190px !important;}
.founder-card .avatar-photo,.founder-card .avatar{width:180px !important;height:180px !important;}
.hero-orbit{width:420px !important;height:420px !important;}
.orbit-core{width:280px !important;height:280px !important;}
/* ---- Icon: to hơn, khối tròn/vuông to hơn, nét đậm hơn ---- */
.value-card .ic,.tech-feat .ic,.partner-card2 .ic,.channel-card .ic,.prod-card .ic,.partner-logo{
width:66px !important;height:66px !important;}
.value-card .ic svg,.tech-feat .ic svg,.partner-card2 .ic svg,.channel-card .ic svg,.prod-card .ic svg{
width:30px !important;height:30px !important;}
.value-card .ic svg *,.tech-feat .ic svg *,.partner-card2 .ic svg *,.channel-card .ic svg *,.prod-card .ic svg *{
stroke-width:2.3 !important;}
.avatar{width:84px !important;height:84px !important;font-size:22px !important;}
.badge-pill svg{width:18px !important;height:18px !important;}
ul.feat svg{width:22px !important;height:22px !important;}
/* ---- Thu gọn khoảng trắng giữa các section/dòng, đỡ phải lướt nhiều ---- */
body{line-height:1.5 !important;}
section{padding:52px 0 !important;}
@media (max-width:760px){section{padding:36px 0 !important;}}
.pathway{padding:36px 0 !important;gap:32px !important;}
.section-head{margin:0 auto 24px !important;}
.lede{line-height:1.55 !important;margin-bottom:0 !important;}
.value-grid{gap:16px !important;}
.value-row{gap:14px !important;}
h2.section-title{margin-bottom:0 !important;}
.tech-feat{margin-top:18px !important;}
.people-row,.founder-cred-grid{margin-top:14px !important;}
.step-card,.platform-card{margin-bottom:0;}
/* ---- Giá trị cho đối tác: bố cục 2 cột, không thẻ khung, icon minh hoạ màu xanh lá ---- */
.value-2col{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
@media (max-width:760px){.value-2col{grid-template-columns:1fr;gap:32px;}}
.value-list{display:flex;flex-direction:column;gap:22px;}
.value-item{display:flex;gap:16px;align-items:flex-start;text-align:left;}
.value-item .ic{flex:none;width:48px;height:48px;border-radius:0;background:transparent;
display:flex;align-items:center;justify-content:center;}
.value-item .ic svg{width:48px !important;height:48px !important;}
.value-item h4{font-size:15.5px;margin-bottom:4px;}
.value-item p{font-size:13.5px;color:var(--muted);margin:0;line-height:1.55;}
/* ---- Ưu thế công nghệ cốt lõi: bỏ khung viền quanh icon, icon minh hoạ màu xanh lá ---- */
.tech-feat .ic{background:transparent !important;border:none !important;box-shadow:none !important;
width:48px !important;height:48px !important;}
.tech-feat .ic svg{width:48px !important;height:48px !important;stroke:none !important;}
/* ---- Bỏ khung/viền bo tròn quanh các thẻ nội dung trên toàn site ---- */
.value-card,.platform-card,.partner-card,.partner-card2,.step-card,.channel-card,.prod-card,.news-card,
.value-row .vr-card,.value-row .vr-card.first{
background:transparent !important;border:none !important;border-radius:0 !important;box-shadow:none !important;}
.platform-card .thumb,.step-card .thumb,.news-thumb{border-radius:0 !important;}
.job-card{background:transparent !important;border:none !important;box-shadow:none !important;border-radius:0 !important;
border-bottom:1px solid var(--border) !important;padding-bottom:22px !important;}
/* Bỏ toàn bộ nút pill nhãn (badge-pill) trên khắp site */
.badge-pill{display:none !important;}
/* Hội đồng cố vấn: căn giữa chắc chắn, dùng ảnh thật, khung chữ nhật bo góc đồng bộ với ảnh CEO */
.person{text-align:center !important;}
.person h4,.person span{text-align:center !important;}
.avatar{align-items:center !important;justify-content:center !important;}
.person .avatar-photo{width:180px !important;height:180px !important;border-radius:16px !important;
object-fit:cover;display:block;margin:0 auto 14px;}
/* .people-row vốn định nghĩa 4 cột nhưng chỉ có 3 người -> bị dồn lệch trái. Sửa đúng 3 cột + căn giữa cả khối */
.people-row{grid-template-columns:repeat(3,1fr) !important;max-width:760px !important;margin:0 auto !important;}
@media (max-width:700px){.people-row{grid-template-columns:1fr !important;}}
/* Mô hình hợp tác Win Win: sơ đồ luồng 2 chiều thay cho khung thẻ + mũi tên chữ */
.winwin-flow{display:flex;align-items:flex-start;justify-content:center;gap:0;flex-wrap:wrap;margin-top:32px;}
.winwin-node{display:flex;flex-direction:column;align-items:center;text-align:center;width:190px;flex:none;}
.winwin-ic{width:68px;height:68px;border-radius:50%;background:var(--paper);display:flex;align-items:center;
justify-content:center;margin-bottom:14px;}
.winwin-node h4{font-size:15px;margin-bottom:4px;}
.winwin-role{font-size:12px;color:var(--muted);line-height:1.45;max-width:160px;}
.winwin-link{flex:1 1 70px;min-width:50px;max-width:110px;position:relative;display:flex;
align-items:center;padding-top:34px;}
.winwin-link .line{width:100%;height:2px;background:var(--border);}
.winwin-swap{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:26px;height:26px;
border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;
align-items:center;justify-content:center;color:var(--brand-deep);}
@media (max-width:820px){
.winwin-flow{flex-direction:column;align-items:center;}
.winwin-link{padding-top:0;margin:6px 0;height:40px;width:2px;max-width:none;flex:none;}
.winwin-link .line{width:2px;height:100%;margin:0 auto;}
}
/* Bỏ nốt khung bo góc quanh logo đối tác + khung ảnh minh hoạ, đồng thời phóng to logo */
.partner-logo{background:transparent !important;border:none !important;border-radius:0 !important;
box-shadow:none !important;padding:0 !important;width:140px !important;height:140px !important;}
.partner-logo.img{background:transparent !important;border:none !important;padding:0 !important;}
.partner-logo.img img{object-fit:contain !important;}
.illus-frame{border-radius:0 !important;}
/* .partner-grid vốn 3 cột nhưng nhóm đối tác hiện chỉ còn 2 mục -> sửa đúng 2 cột, căn giữa */
.partner-grid{grid-template-columns:repeat(2,1fr) !important;max-width:560px !important;margin:0 auto !important;}
@media (max-width:600px){.partner-grid{grid-template-columns:1fr !important;}}
/* ==========================================================================
MEKONG GREEN, POLISH LAYER (v6): type refinement, depth, motion
Khong thay doi noi dung. Chi tinh chinh thi giac + tuong tac cuon.
(Token display, mono, ease, shadow va cac bien shadow khac da gop vao :root duy nhat o dau file.)
========================================================================== */
body{background:var(--surface);}
/* ---------- TYPE ---------- */
h1,h2,h3,.hero-photo h1,.page-hero h1,h2.section-title,.cta-band h2,.cta-strip h2,.tech-dark h2{
font-family:var(--display);font-weight:800;letter-spacing:-.025em;line-height:1.12;}
h2.section-title{font-size:clamp(32px,4vw,52px);}
.hero-photo h1{font-size:clamp(36px,5.4vw,68px);line-height:1.06;letter-spacing:-.03em;}
.page-hero h1{font-size:clamp(32px,4.6vw,56px);line-height:1.08;}
h4,h5{letter-spacing:-.01em;}
.lede,.section-head .lede{color:var(--muted);font-size:clamp(16px,1.25vw,19px);line-height:1.7;text-wrap:pretty;}
.badge-pill,.eyebrow,.news-tag,.tag-pill,.filter-tabs button,.breadcrumb{
font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:700;}
.badge-pill{padding:8px 14px;border-radius:999px;}
.stat-card b,.value-card .stat b,.tech-stat b,.trust-stat b,.orbit-core b,.tl-col .yr,.tlv-item .yr,.val-card .num,.step-card .num,.step .n,.news-meta,.hotline-card b{
font-family:var(--mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.article-body p{font-size:18px;line-height:1.8;text-wrap:pretty;}
.section-head{margin-bottom:64px;}
section{padding-block:clamp(72px,8vw,124px);}
section.sm{padding-block:clamp(56px,6vw,88px);}
/* ---------- HEADER ---------- */
header.site{transition:background .35s var(--ease),box-shadow .35s var(--ease),backdrop-filter .35s;}
header.site:is(.scrolled,.solid){
background:rgba(255,255,255,.82);backdrop-filter:saturate(1.4) blur(14px);
-webkit-backdrop-filter:saturate(1.4) blur(14px);
box-shadow:0 1px 0 var(--border),0 8px 30px rgba(15,51,35,.06);}
header.site.scrolled .nav-row{min-height:60px;}
.nav-row{transition:min-height .35s var(--ease);}
.nav-link{position:relative;}
.nav-link::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;border-radius:2px;
background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);}
.nav-link:hover::after,.nav-link.active::after{transform:scaleX(1);}
#mgProgress{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:0 50%;
background:linear-gradient(90deg,var(--brand),var(--teal));z-index:9999;pointer-events:none;}
/* ---------- BUTTONS ---------- */
.btn{position:relative;overflow:hidden;border-radius:12px;font-weight:600;letter-spacing:-.005em;
transition:transform .18s var(--ease),box-shadow .25s var(--ease),background .2s var(--ease),color .2s;}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.28) 50%,transparent 80%);
transform:translateX(-120%);transition:transform .6s var(--ease);}
.btn:hover::before{transform:translateX(120%);}
.btn-primary{box-shadow:0 8px 22px rgba(38,184,74,.28);}
.btn:hover{transform:translateY(-2px);}
.btn-primary:hover{box-shadow:0 14px 32px rgba(38,184,74,.36);}
.btn:active{transform:translateY(1px);}
/* ---------- CARDS / SURFACES ---------- */
.platform-card,.value-card,.step-card,.news-card,.prod-card,.aud-card,.partner-card2,.job-card,
.stat-card,.channel-card,.office-card,.person,.founder-card,.val-detail,.faq-item,.illus-frame,.tl-col{
border-radius:18px;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s;}
.platform-card,.news-card,.prod-card,.aud-card,.job-card,.channel-card,.partner-card2,.value-card{box-shadow:var(--shadow);}
.platform-card:hover,.news-card:hover,.prod-card:hover,.aud-card:hover,.job-card:hover,.channel-card:hover,.partner-card2:hover,.value-card:hover{
transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:color-mix(in oklab,var(--brand) 35%,var(--border));}
.platform-card .thumb,.news-thumb,.step-card .thumb,.illus-frame,.article-cover{overflow:hidden;}
.platform-card .thumb img,.news-thumb img,.step-card .thumb img,.illus-frame img,.article-cover img{
transition:transform 1s var(--ease),filter .5s;will-change:transform;}
.platform-card:hover .thumb img,.news-card:hover .news-thumb img,.step-card:hover .thumb img{transform:scale(1.06);}
.value-card .ic,.prod-card .ic,.channel-card .ic,.tech-feat .ic,.value-row .vr-ic{transition:transform .4s var(--ease);}
.value-card:hover .ic,.prod-card:hover .ic,.channel-card:hover .ic,.tech-feat:hover .ic{transform:translateY(-3px) scale(1.06);}
.partner-logo.img img{filter:none;transition:transform .4s var(--ease);}
.partner-card2:hover .partner-logo.img img{transform:scale(1.06);}
form.lead input,form.lead select,form.lead textarea{border-radius:12px;transition:border-color .2s,box-shadow .2s;}
form.lead input:focus,form.lead select:focus,form.lead textarea:focus{box-shadow:0 0 0 4px rgba(38,184,74,.14);}
.faq-q{transition:color .2s;}
.faq-item.open{box-shadow:var(--shadow);}
/* ---------- HERO ---------- */
.hero-photo .bgimg,.page-hero .bgimg{will-change:transform;}
.hero-photo h1 .accent{background:none;-webkit-text-fill-color:currentColor;color:var(--brand);}
.hero-pillar-row .hp{transition:transform .4s var(--ease),background .3s;}
.hero-pillar-row .hp:hover{transform:translateY(-4px);}
.orbit-ring{animation:mg-spin 46s linear infinite;}
@keyframes mg-spin{to{transform:rotate(360deg);}}
.orbit-badge{animation:mg-float 7s var(--ease) infinite;}
.orbit-badge.b1{animation-name:mg-float-b1;}
.orbit-badge.b2{animation-delay:-2.3s;}
.orbit-badge.b3{animation-delay:-4.6s;}
@keyframes mg-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@keyframes mg-float-b1{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(-9px);}}
/* dark tech band: subtle depth */
.tech-dark{position:relative;overflow:hidden;}
.tech-dark::after{content:"";position:absolute;inset:auto -10% -40% -10%;height:70%;
background:radial-gradient(60% 100% at 50% 100%,rgba(38,184,74,.18),transparent 70%);pointer-events:none;}
.cta-band .blob,.cta-strip .blob{animation:mg-drift 18s var(--ease) infinite alternate;}
@keyframes mg-drift{to{transform:translate3d(24px,-18px,0) scale(1.08);}}
/* ---------- SCROLL REVEAL ---------- */
[data-mg-rv]{opacity:0;transform:translateY(26px);
transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0ms);will-change:opacity,transform;}
[data-mg-rv="left"]{transform:translateX(-32px);}
[data-mg-rv="right"]{transform:translateX(32px);}
[data-mg-rv="scale"]{transform:scale(.965);}
[data-mg-rv].mg-in{opacity:1;transform:none;}
.mg-line{position:relative;}
.mg-line::before{content:"";position:absolute;left:50%;top:-28px;width:1px;height:0;
background:linear-gradient(180deg,transparent,var(--brand));transition:height .9s var(--ease) .1s;}
.mg-line.mg-in::before{height:24px;}
@media (prefers-reduced-motion:reduce){
[data-mg-rv]{opacity:1!important;transform:none!important;}
.orbit-ring,.orbit-badge,.cta-band .blob,.cta-strip .blob{animation:none!important;}
html{scroll-behavior:auto;}
}
/* ==========================================================================
VE CHUNG TOI, editorial nong nghiep: anh lon, nhieu khoang tho, cuon tuong tac
========================================================================== */
[data-page="ve-chung-toi"]{--band-h:min(40vh,380px);}
[data-page="ve-chung-toi"] .page-hero{min-height:min(88vh,880px);}
[data-page="ve-chung-toi"] .page-hero .overlay{background:
linear-gradient(0deg,rgba(10,58,38,.7) 0%,rgba(12,66,44,.26) 48%,rgba(12,66,44,.06) 100%),
radial-gradient(85% 65% at 82% 6%,rgba(23,172,218,.24),transparent 60%);}
[data-page="ve-chung-toi"] .page-hero .container{padding:150px 32px 104px;}
[data-page="ve-chung-toi"] .page-hero h1{font-size:clamp(38px,6vw,80px);line-height:1.02;letter-spacing:-.035em;
max-width:16ch!important;text-shadow:0 6px 44px rgba(0,0,0,.42);}
[data-page="ve-chung-toi"] .page-hero .badge-pill{backdrop-filter:blur(6px);}
[data-page="ve-chung-toi"] .page-hero::after{content:"";position:absolute;left:50%;bottom:34px;width:1px;height:56px;z-index:3;
background:linear-gradient(180deg,rgba(255,255,255,.7),transparent);animation:mg-cue 2.4s var(--ease) infinite;}
@keyframes mg-cue{0%{transform:scaleY(.2);opacity:0;transform-origin:top;}45%{opacity:1;}100%{transform:scaleY(1);opacity:0;transform-origin:top;}}
/* --- cau chuyen: hai cot, anh dinh (sticky) khi cuon --- */
[data-page="ve-chung-toi"] #cau-chuyen{padding-block:clamp(96px,11vw,168px);background:
linear-gradient(180deg,#FFFFFF 0%,var(--paper) 100%);}
[data-page="ve-chung-toi"] #cau-chuyen .pathway{grid-template-columns:1fr 1fr;gap:clamp(48px,6vw,96px);
border-bottom:none;padding:0;align-items:start;}
[data-page="ve-chung-toi"] #cau-chuyen h2.section-title{text-align:left;font-size:clamp(34px,4.6vw,58px);margin-bottom:28px!important;}
[data-page="ve-chung-toi"] #cau-chuyen p{font-size:clamp(18px,1.5vw,21px)!important;line-height:1.78!important;
color:var(--ink)!important;text-wrap:pretty;}
[data-page="ve-chung-toi"] #cau-chuyen p::first-letter{float:left;font-size:3.6em;line-height:.86;font-weight:800;
padding:8px 16px 0 0;color:var(--brand);}
[data-page="ve-chung-toi"] #cau-chuyen .art{position:sticky;top:96px;}
[data-page="ve-chung-toi"] #cau-chuyen .illus-frame{border-radius:24px;box-shadow:var(--shadow-lg);aspect-ratio:4/3;background:#0F3323;}
[data-page="ve-chung-toi"] #cau-chuyen .illus-frame img{object-fit:contain!important;}
[data-page="ve-chung-toi"] #cau-chuyen .illus-cap{letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:700;}
@media (max-width:860px){[data-page="ve-chung-toi"] #cau-chuyen .art{position:static;}}
/* --- dai anh full-bleed, parallax --- */
.mg-band{position:relative;overflow:hidden;height:var(--band-h,min(70vh,640px));padding:0!important;}
.mg-band .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.mg-band-veil{position:absolute;inset:0;background:
linear-gradient(0deg,rgba(10,58,38,.46),rgba(10,58,38,.04) 55%,rgba(10,58,38,.16)),
radial-gradient(70% 60% at 20% 90%,rgba(38,184,74,.18),transparent 60%);}
.mg-band-cap{position:absolute;left:0;right:0;bottom:38px;text-align:center;color:rgba(255,255,255,.92);
font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:0 24px;
text-shadow:0 2px 18px rgba(0,0,0,.5);}
.mg-band-cap::before{content:"";display:block;width:44px;height:3px;background:#7BE08F;
border-radius:2px;margin:0 auto 16px;}
/* --- tam nhin 2030: dai thuong hieu toi mau tren anh dong ruong --- */
[data-page="ve-chung-toi"] #gia-tri{position:relative;overflow:hidden;color:#fff;
padding-block:clamp(96px,11vw,164px);
background:linear-gradient(150deg,#34B462 0%,#1E9E56 46%,#14875F 78%,#127C76 100%);}
[data-page="ve-chung-toi"] .mg-vision-bg{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;
opacity:.3;mix-blend-mode:soft-light;will-change:transform;}
[data-page="ve-chung-toi"] #gia-tri::after{content:"";position:absolute;inset:0;pointer-events:none;
background:radial-gradient(70% 60% at 80% 8%,rgba(120,235,255,.28),transparent 60%);}
[data-page="ve-chung-toi"] #gia-tri > .container{position:relative;z-index:2;}
[data-page="ve-chung-toi"] #gia-tri .eyebrow{color:#fff!important;}
[data-page="ve-chung-toi"] #gia-tri .eyebrow::before{background:#fff!important;}
[data-page="ve-chung-toi"] #gia-tri h2.section-title{color:#fff;text-align:left;font-size:clamp(38px,5.4vw,70px);}
[data-page="ve-chung-toi"] #gia-tri > .container > p.lede{color:#EAF6EE!important;
font-size:clamp(20px,2vw,28px)!important;line-height:1.5!important;font-weight:500;
max-width:26ch!important;margin:20px 0 clamp(56px,7vw,88px)!important;}
[data-page="ve-chung-toi"] #gia-tri h3{color:#fff!important;font-size:12px!important;font-weight:800;
letter-spacing:.16em;text-transform:uppercase;opacity:.92;padding-bottom:16px;
border-bottom:1px solid rgba(255,255,255,.32);margin-bottom:32px!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row{gap:18px;}
[data-page="ve-chung-toi"] #gia-tri .vr-card{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.32);
border-radius:20px;text-align:left;padding:30px 26px;
transition:transform .45s var(--ease),background .35s,border-color .35s;}
[data-page="ve-chung-toi"] #gia-tri .vr-card.first{background:rgba(255,255,255,.24);border-color:rgba(255,255,255,.6);}
[data-page="ve-chung-toi"] #gia-tri .vr-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.24);
border-color:rgba(255,255,255,.7);box-shadow:0 18px 40px rgba(6,50,32,.18);}
[data-page="ve-chung-toi"] #gia-tri .vr-ic{margin:0 0 20px;width:58px;height:58px;border-radius:18px;flex:none;
background:rgba(255,255,255,.9);transition:background .35s,transform .45s var(--ease);}
[data-page="ve-chung-toi"] #gia-tri .vr-card:hover .vr-ic{background:#fff;transform:scale(1.06) rotate(-2deg);}
[data-page="ve-chung-toi"] #gia-tri .vr-card h4{color:#fff;font-size:17.5px;}
[data-page="ve-chung-toi"] #gia-tri .vr-card p{color:rgba(255,255,255,.88);font-size:14.5px;line-height:1.68;margin-top:10px;}
/* --- doi ngu --- */
[data-page="ve-chung-toi"] #doi-ngu{padding-block:clamp(96px,11vw,160px);background:
linear-gradient(180deg,var(--paper) 0%,#FFFFFF 42%);}
[data-page="ve-chung-toi"] #doi-ngu h2.section-title{text-align:left;font-size:clamp(32px,4.2vw,52px);margin-bottom:48px!important;}
[data-page="ve-chung-toi"] .founder-card{background:#fff;border:1px solid var(--border);grid-template-columns:280px 1fr;gap:clamp(36px,4vw,56px);padding:clamp(28px,3.4vw,48px);
border-radius:24px;align-items:start;box-shadow:var(--shadow);}
[data-page="ve-chung-toi"] .founder-card .avatar-photo{width:100%;height:auto;aspect-ratio:4/5;border-radius:20px;
border:none;object-fit:cover;box-shadow:var(--shadow-lg);}
[data-page="ve-chung-toi"] .founder-card h3{font-size:clamp(24px,2.4vw,34px);}
[data-page="ve-chung-toi"] .founder-card .role{letter-spacing:.1em;text-transform:uppercase;font-size:11.5px;}
[data-page="ve-chung-toi"] .founder-card p{font-size:16.5px;line-height:1.8;}
[data-page="ve-chung-toi"] #doi-ngu > .container > h3{font-size:12px!important;font-weight:800;letter-spacing:.16em;
text-transform:uppercase;color:var(--muted)!important;padding-bottom:16px;border-bottom:1px solid var(--border);
margin:clamp(64px,7vw,96px) 0 36px!important;}
[data-page="ve-chung-toi"] .people-row{gap:28px;}
[data-page="ve-chung-toi"] .person .avatar-photo{width:100%;height:auto;aspect-ratio:1/1;border-radius:20px;
object-fit:cover;filter:grayscale(.4) contrast(1.02);margin:0 0 16px;display:block;
transition:filter .55s var(--ease),transform .55s var(--ease);}
[data-page="ve-chung-toi"] .person{text-align:left;}
[data-page="ve-chung-toi"] .person:hover .avatar-photo{filter:none;transform:translateY(-5px);}
[data-page="ve-chung-toi"] .person h4{font-size:16.5px;}
[data-page="ve-chung-toi"] .person span{font-size:12.5px;line-height:1.55;margin-top:5px;}
[data-page="ve-chung-toi"] .cta-strip{padding-block:clamp(72px,8vw,112px);}
/* --- ghi de lai cac reset !important cua stylesheet sau trong trang Ve chung toi --- */
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card{background:rgba(255,255,255,.14)!important;
border:1px solid rgba(255,255,255,.32)!important;border-style:solid!important;border-radius:20px!important;
box-shadow:0 10px 30px rgba(6,50,32,.1)!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card.first{background:rgba(255,255,255,.24)!important;
border-color:rgba(255,255,255,.6)!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card:hover{background:rgba(255,255,255,.24)!important;
border-color:rgba(255,255,255,.7)!important;box-shadow:0 18px 40px rgba(6,50,32,.18)!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card .vr-ic{background:#fff!important;width:58px!important;
height:58px!important;border-radius:18px!important;flex:none!important;display:flex!important;
align-items:center;justify-content:center;margin:0 0 20px!important;box-shadow:0 6px 18px rgba(6,50,32,.14)!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card .vr-ic svg{width:28px!important;height:28px!important;}
[data-page="ve-chung-toi"] #gia-tri .value-row .vr-card:hover .vr-ic{background:#fff!important;transform:scale(1.06) rotate(-2deg);}
/* ==========================================================================
WORDMARK theo logo + HOAT DONG THUC DIA + LOP DU LIEU
========================================================================== */
.wordmark{font-weight:900;letter-spacing:-.005em;font-size:19px;line-height:1;white-space:nowrap;}
.wordmark .wm-a{background:linear-gradient(95deg,#1BA5E0 0%,#1FB6C4 55%,#22B573 100%);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
.wordmark .wm-b{background:linear-gradient(95deg,#2BB742 0%,#3CC63F 60%,#7BE08F 100%);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
header.site:not(.scrolled):not(.solid) [data-solid="0"] ~ * .wordmark{}
.mobile-panel .mtop strong{font-weight:900;}
/* --- rail anh hoat dong --- */
.mg-ops{padding-block:clamp(80px,9vw,128px);background:linear-gradient(180deg,#fff 0%,var(--paper) 100%);overflow:hidden;}
.mg-ops .section-head{margin-bottom:44px;}
/* align-items:flex-start — mac dinh flex la stretch, figure se bi keo cao bang
cai cao nhat. Dat flex-start de moi the chi cao bang noi dung that cua no. */
.mg-ops-rail{display:flex;align-items:flex-start;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
padding:8px max(24px,calc((100vw - 1200px)/2)) 26px;scrollbar-width:thin;
scrollbar-color:color-mix(in oklab,var(--brand) 55%,transparent) transparent;}
.mg-ops-rail::-webkit-scrollbar{height:6px;}
.mg-ops-rail::-webkit-scrollbar-thumb{background:color-mix(in oklab,var(--brand) 55%,transparent);border-radius:99px;}
.mg-ops-rail figure{flex:0 0 clamp(260px,30vw,380px);margin:0;scroll-snap-align:start;
border-radius:20px;overflow:hidden;background:#fff;border:1px solid var(--border);
box-shadow:var(--shadow);transition:transform .45s var(--ease),box-shadow .45s var(--ease);}
.mg-ops-rail figure:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
/* height:auto la BAT BUOC. Thuoc tinh height="..." tren the ![]()
tro thanh
presentational hint dat height co dinh; khi ca width lan height deu xac dinh thi
aspect-ratio bi bo qua hoan toan. Thieu dong nay, anh render dung chieu cao goc
(956px / 1500px) nen cac the trong rail lech nhau va chu thich khong thang hang. */
.mg-ops-rail img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;
transition:transform .9s var(--ease);}
.mg-ops-rail figure:hover img{transform:scale(1.05);}
.mg-ops-rail figcaption{padding:18px 20px 22px;display:flex;flex-direction:column;gap:6px;}
.mg-ops-rail figcaption b{font-size:16px;color:var(--deep);letter-spacing:-.01em;}
.mg-ops-rail figcaption span{font-size:13.5px;line-height:1.6;color:var(--muted);}
.mg-ops-hint{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0;}
/* --- lop du lieu --- */
.mg-data{padding-block:clamp(84px,9vw,132px);background:var(--paper);}
.mg-data-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:end;margin-bottom:56px;}
.mg-data-top h2.section-title{text-align:left;margin:0;font-size:clamp(32px,4vw,50px);}
.mg-data-top p.lede{margin:0;}
.mg-data-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.mg-data-card{grid-column:span 2;background:#fff;border:1px solid var(--border);border-radius:20px;
padding:30px 28px;box-shadow:var(--shadow);position:relative;
transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .35s;}
.mg-data-card.wide{grid-column:span 4;}
.mg-data-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);
border-color:color-mix(in oklab,var(--brand) 40%,var(--border));}
.mg-data-card .tagno{font-size:12px;font-weight:800;letter-spacing:.14em;color:var(--brand);}
.mg-data-card h3{margin:12px 0 10px;font-size:clamp(19px,1.7vw,23px);color:var(--deep);letter-spacing:-.015em;}
.mg-data-card p{margin:0;font-size:15.5px;line-height:1.72;color:var(--muted);text-wrap:pretty;}
.mg-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;}
.mg-chips li{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
padding:7px 13px;border-radius:99px;background:var(--badge-bg,#EAF7EE);color:var(--brand-deep,#146B2E);
border:1px solid color-mix(in oklab,var(--brand) 26%,transparent);}
.mg-data-quote{grid-column:span 4;border-radius:20px;padding:36px 34px;color:#fff;
background:linear-gradient(120deg,#2BB05F 0%,#17925F 52%,#12807A 100%);
display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 24px;}
.mg-data-quote p{margin:0;font-size:clamp(22px,2.4vw,32px);font-weight:800;letter-spacing:-.02em;}
.mg-data-quote span{font-size:15px;color:rgba(255,255,255,.85);line-height:1.6;}
@media (max-width:900px){
.mg-data-top{grid-template-columns:1fr;align-items:start;}
.mg-data-grid{grid-template-columns:1fr;}
.mg-data-card,.mg-data-card.wide,.mg-data-quote{grid-column:auto;}
}
/* ==========================================================================
TRANG CHU v3, inspirational, khong khung the, tuong tac cuon
========================================================================== */
[data-page="index"] section.white,[data-page="index"] .mg-ops,[data-page="index"] .mg-data{
padding-block:clamp(96px,11vw,172px);background:var(--surface);}
[data-page="index"] .mg-data{background:linear-gradient(180deg,var(--paper) 0%,#fff 100%);}
/* eyebrow: bat lai duoi dang chu nho, khong vien */
[data-page="index"] .section-head .badge-pill{display:inline-flex!important;background:none!important;
border:none!important;padding:0!important;margin:0 0 20px!important;color:var(--brand-deep)!important;
font-size:11.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;gap:10px;}
[data-page="index"] .section-head .badge-pill svg{display:none;}
[data-page="index"] .section-head{text-align:left;max-width:none;margin:0 0 clamp(52px,6vw,84px);
display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,80px);align-items:end;}
[data-page="index"] .section-head .badge-pill{grid-column:1;grid-row:1;justify-self:start;}
[data-page="index"] .section-head h2.section-title{grid-column:1;grid-row:2;text-align:left;margin:0;
font-size:clamp(36px,5.2vw,68px);line-height:1.03;letter-spacing:-.035em;}
[data-page="index"] .section-head .lede{grid-column:2;grid-row:2;margin:0;max-width:46ch;font-size:17px;}
@media (max-width:900px){
[data-page="index"] .section-head{grid-template-columns:1fr;align-items:start;}
[data-page="index"] .section-head > *{grid-column:1!important;grid-row:auto!important;}
}
/* --- Tuyen ngon --- */
.mg-manifesto{position:relative;overflow:hidden;padding-block:clamp(110px,14vw,200px);
background:linear-gradient(160deg,#0E4430 0%,#0A3324 55%,#07281C 100%);color:#fff;}
.mg-manifesto canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.55;}
.mg-manifesto .container{position:relative;z-index:2;}
.mg-eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:11.5px;font-weight:800;
letter-spacing:.2em;text-transform:uppercase;color:var(--brand-deep);}
.mg-eyebrow.light{color:#7BE08F;}
.mg-statement{margin:34px 0 0;max-width:20ch;font-size:clamp(30px,5.4vw,68px);font-weight:800;
line-height:1.14;letter-spacing:-.035em;text-wrap:pretty;max-width:24ch;}
.mg-statement .w{color:rgba(255,255,255,.2);transition:color .35s var(--ease);}
.mg-statement .w.on{color:#fff;}
.mg-statement .w.hi.on{color:#7BE08F;}
/* --- Nen tang AgriGreen: 3 anh cao, chu tren anh --- */
[data-page="index"] .platform-grid{grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,24px);}
[data-page="index"] .platform-card{background:none!important;border:none!important;border-radius:0!important;
box-shadow:none!important;overflow:hidden;position:relative;isolation:isolate;transition:none;}
[data-page="index"] .platform-card:hover{transform:none;}
[data-page="index"] .platform-card .thumb{height:auto;aspect-ratio:3/4;border-radius:0;overflow:hidden;position:relative;}
[data-page="index"] .platform-card .thumb::after{content:"";position:absolute;inset:0;
background:linear-gradient(0deg,rgba(7,40,28,.92) 0%,rgba(7,40,28,.42) 42%,rgba(7,40,28,.06) 100%);
transition:opacity .5s var(--ease);}
[data-page="index"] .platform-card:hover .thumb::after{opacity:.86;}
[data-page="index"] .platform-card .thumb img{width:100%;height:100%;object-fit:cover;
transition:transform 1.1s var(--ease),filter .6s;}
[data-page="index"] .platform-card:hover .thumb img{transform:scale(1.07);}
[data-page="index"] .platform-card .thumb .icb{left:28px;bottom:auto;top:26px;width:42px;height:42px;
border-radius:50%;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);
border:1px solid rgba(255,255,255,.3);transition:background .4s,transform .5s var(--ease);}
[data-page="index"] .platform-card:hover .thumb .icb{background:var(--brand);transform:translateY(-3px);}
[data-page="index"] .platform-card .body{position:absolute;left:0;right:0;bottom:0;z-index:2;
padding:0 28px 30px;color:#fff;}
[data-page="index"] .platform-card h3{color:#fff;font-size:clamp(20px,1.9vw,26px);letter-spacing:-.025em;
line-height:1.18;margin:0;transition:transform .5s var(--ease);}
[data-page="index"] .platform-card p{color:rgba(255,255,255,.86);font-size:15px;line-height:1.65;
margin:0;max-height:0;opacity:0;overflow:hidden;
transition:max-height .6s var(--ease),opacity .45s var(--ease),margin .6s var(--ease);}
[data-page="index"] .platform-card:hover p{max-height:220px;opacity:1;margin-top:14px;}
@media (hover:none){
[data-page="index"] .platform-card p{max-height:220px;opacity:1;margin-top:14px;}
}
@media (max-width:900px){[data-page="index"] .platform-grid{grid-template-columns:1fr;}}
/* --- Gia tri cho doi tac: danh sach danh so, khong vien --- */
[data-page="index"] .value-2col{gap:clamp(44px,7vw,110px);}
[data-page="index"] .value-2col > div > h3{font-size:11.5px!important;font-weight:800;letter-spacing:.2em;
text-transform:uppercase;color:var(--brand-deep)!important;margin-bottom:36px!important;
display:flex;align-items:center;gap:10px;}
[data-page="index"] .value-list{counter-reset:vv;display:flex;flex-direction:column;gap:clamp(28px,3vw,44px);}
[data-page="index"] .value-item{counter-increment:vv;background:none!important;border:none!important;
border-radius:0!important;box-shadow:none!important;padding:0;align-items:start;gap:22px;
transition:transform .45s var(--ease);}
[data-page="index"] .value-item:hover{transform:translateX(8px);}
[data-page="index"] .value-item .ic{display:none!important;}
[data-page="index"] .value-item > div:last-child{position:relative;padding-left:56px;}
[data-page="index"] .value-item > div:last-child::before{content:counter(vv,decimal-leading-zero);
position:absolute;left:0;top:2px;font-size:13px;font-weight:800;letter-spacing:.1em;color:var(--brand);
transition:color .3s;}
[data-page="index"] .value-item h4{font-size:clamp(19px,1.8vw,24px);letter-spacing:-.02em;color:var(--deep);margin:0;}
[data-page="index"] .value-item p{font-size:15.5px;line-height:1.72;margin:8px 0 0;max-width:44ch;}
/* --- Rail anh thuc dia --- */
[data-page="index"] .mg-ops{background:linear-gradient(180deg,#fff 0%,var(--paper) 100%);}
[data-page="index"] .mg-ops-rail{cursor:grab;padding-bottom:12px;}
[data-page="index"] .mg-ops-rail.dragging{cursor:grabbing;scroll-snap-type:none;}
[data-page="index"] .mg-ops-rail figure{flex-basis:clamp(280px,34vw,440px);background:none;border:none;
border-radius:0;box-shadow:none;}
[data-page="index"] .mg-ops-rail figure:hover{transform:none;box-shadow:none;}
[data-page="index"] .mg-ops-rail img{border-radius:0;aspect-ratio:5/6;}
[data-page="index"] .mg-ops-rail figcaption{padding:18px 0 0;}
[data-page="index"] .mg-ops-rail figcaption b{font-size:17px;}
/* --- Lop du lieu: so lon, khong khung --- */
[data-page="index"] .mg-data-rows{gap:0;}
[data-page="index"] .mg-data-row{background:none!important;border:none!important;border-radius:0!important;
box-shadow:none!important;padding:clamp(30px,3.4vw,46px) 0;grid-template-columns:88px minmax(220px,28%) 1fr;
transition:transform .45s var(--ease);}
[data-page="index"] .mg-data-row:hover{transform:translateX(8px);box-shadow:none;}
[data-page="index"] .mg-data-row .tagno{font-size:clamp(30px,3.4vw,46px);font-weight:800;letter-spacing:-.04em;
padding-top:0;line-height:1;color:color-mix(in oklab,var(--brand) 34%,transparent);transition:color .4s var(--ease);}
[data-page="index"] .mg-data-row:hover .tagno{color:var(--brand);}
[data-page="index"] .mg-data-row h3{font-size:clamp(20px,2vw,27px);letter-spacing:-.025em;}
[data-page="index"] .mg-chips li{background:none;border-color:color-mix(in oklab,var(--brand) 30%,transparent);
color:var(--brand-deep);}
@media (max-width:880px){[data-page="index"] .mg-data-row{grid-template-columns:60px 1fr;}}
/* --- Doi tac: logo lon, khong khung --- */
[data-page="index"] .partner-grid2{gap:clamp(20px,3vw,44px);}
[data-page="index"] .partner-card2{background:none!important;border:none!important;border-radius:0!important;
box-shadow:none!important;padding:0;text-align:left;transition:transform .45s var(--ease);}
[data-page="index"] .partner-card2:hover{transform:translateY(-5px);}
[data-page="index"] .partner-logo.img{background:none!important;border:none!important;border-radius:0!important;
padding:0!important;width:auto!important;height:64px!important;justify-content:flex-start;}
[data-page="index"] .partner-logo.img img{width:auto;max-width:170px;height:100%;object-fit:contain;object-position:left center;}
[data-page="index"] .partner-card2 h4{margin-top:20px;font-size:15.5px;color:var(--deep);line-height:1.45;}
/* --- Uu the cong nghe --- */
[data-page="index"] .tech-dark{padding-block:clamp(96px,11vw,168px);}
[data-page="index"] .tech-dark h2{font-size:clamp(34px,4.8vw,60px);letter-spacing:-.035em;line-height:1.05;}
[data-page="index"] .tech-dark .tech-feat{padding:clamp(20px,2.2vw,30px) 0;align-items:start;
transition:transform .45s var(--ease);}
[data-page="index"] .tech-dark .tech-feat:hover{transform:translateX(8px);}
[data-page="index"] .tech-dark .tech-feat .ic{background:none!important;border:none!important;border-radius:0!important;}
[data-page="index"] .tech-dark .illus-frame{border-radius:0;box-shadow:var(--shadow-lg);}
/* --- nut: hieu ung tu tinh --- */
[data-page="index"] .btn{will-change:transform;}
[data-page="index"] .hero-actions .btn{transition:transform .25s var(--ease),box-shadow .3s var(--ease),background .2s;}
/* --- lop du lieu: 4 hang (khoi phuc rule goc) --- */
.mg-data-rows{display:flex;flex-direction:column;gap:14px;}
.mg-data-row{display:grid;grid-template-columns:64px minmax(240px,26%) 1fr;gap:clamp(20px,3vw,44px);
align-items:start;transition:transform .45s var(--ease);}
.mg-data-row .tagno{font-size:13px;font-weight:800;letter-spacing:.12em;color:var(--brand);padding-top:5px;}
.mg-data-row h3{margin:0;font-size:clamp(19px,1.7vw,23px);color:var(--deep);letter-spacing:-.015em;line-height:1.3;}
.mg-data-row .body{display:flex;flex-direction:column;gap:18px;}
.mg-data-row p{margin:0;font-size:15.5px;line-height:1.72;color:var(--muted);text-wrap:pretty;}
.mg-data-row .mg-chips{margin:0;}
@media (max-width:880px){
.mg-data-row{grid-template-columns:48px 1fr;gap:8px 16px;}
.mg-data-row .body{grid-column:2;}
}
[data-page="index"] .platform-card .thumb{height:auto!important;aspect-ratio:3/4;width:100%;}
/* ==========================================================================
CAC TRANG TRONG, phang, khong khung the, dong bo voi trang chu
========================================================================== */
.eyebrow::before,.mg-eyebrow::before,.section-head .badge-pill::before{content:none!important;display:none!important;}
.eyebrow{font-size:11.5px!important;font-weight:800!important;letter-spacing:.2em!important;
text-transform:uppercase;color:var(--brand-deep)!important;padding-left:0!important;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) section:not(.page-hero):not(.cta-strip):not(.cta-band){padding-block:clamp(84px,10vw,152px);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) section.tint{background:linear-gradient(180deg,var(--paper) 0%,#fff 100%);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .page-hero{min-height:min(72vh,660px);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .page-hero .overlay{background:linear-gradient(0deg,rgba(10,58,38,.78) 0%,rgba(12,66,44,.34) 50%,rgba(12,66,44,.1) 100%),radial-gradient(85% 65% at 82% 6%,rgba(23,172,218,.22),transparent 60%);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .page-hero .container{padding:140px 32px 88px;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .page-hero h1{font-size:clamp(34px,5.2vw,64px);line-height:1.04;letter-spacing:-.035em;max-width:17ch!important;text-shadow:0 5px 40px rgba(0,0,0,.4);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) h2.section-title{text-align:left;font-size:clamp(32px,4.4vw,56px);line-height:1.05;letter-spacing:-.035em;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .section-head{text-align:left;max-width:none;margin:0 0 clamp(44px,5vw,72px);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .section-head .lede{margin-left:0;margin-right:0;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) .eyebrow{display:inline-block;margin-bottom:18px;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) :is(.partner-card,.partner-card2,.news-card,.job-card,.channel-card,.step-card,.val-card,.faq-item,.office-card,.hotline-card,.prod-card,.aud-card,.winwin-node,.stat-card){
background:none!important;border:none!important;border-radius:0!important;box-shadow:none!important;
padding:0!important;transition:transform .45s var(--ease);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) :is(.partner-card,.news-card,.job-card,.channel-card,.step-card,.prod-card,.aud-card):hover{transform:translateY(-5px);box-shadow:none!important;}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) :is(.partner-grid,.partner-grid2,.news-grid,.channel-grid,.step-grid,.val-grid,.prod-grid,.aud-grid){gap:clamp(28px,3.4vw,52px);}
:is([data-page="doi-tac"],[data-page="nen-tang-agrigreen"],[data-page="giai-phap"],[data-page="tin-tuc"],[data-page="tuyen-dung"],[data-page="lien-he"]) :is(.illus-frame,.news-thumb,.step-card .thumb,.article-cover){border-radius:0!important;box-shadow:none!important;}
[data-page="tin-tuc"] .news-thumb{aspect-ratio:4/3;height:auto!important;overflow:hidden;}
[data-page="tin-tuc"] .news-thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease);}
[data-page="tin-tuc"] .news-card:hover .news-thumb img{transform:scale(1.06);}
[data-page="tin-tuc"] .news-body{padding:20px 0 0!important;}
[data-page="tin-tuc"] .news-body h3{font-size:clamp(19px,1.7vw,23px);letter-spacing:-.02em;line-height:1.3;}
[data-page="tin-tuc"] .news-tag{color:var(--brand-deep);background:none!important;padding:0!important;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;}
[data-page="tin-tuc"] .filter-tabs button{border-radius:0!important;background:none!important;border:none!important;border-bottom:2px solid transparent!important;padding:10px 0!important;margin-right:26px;}
[data-page="tin-tuc"] .filter-tabs button.active{border-bottom-color:var(--brand)!important;color:var(--brand-deep)!important;}
[data-page="tuyen-dung"] .job-list{display:flex;flex-direction:column;gap:0;}
[data-page="tuyen-dung"] .job-card{padding:clamp(26px,3vw,38px) 0!important;border-bottom:1px solid var(--border)!important;}
[data-page="tuyen-dung"] .job-card:last-child{border-bottom:none!important;}
[data-page="tuyen-dung"] .job-card:hover{transform:translateX(8px);}
[data-page="tuyen-dung"] .job-card h3{font-size:clamp(20px,2vw,27px);letter-spacing:-.025em;}
[data-page="lien-he"] .channel-card h4{font-size:19px;letter-spacing:-.02em;}
[data-page="lien-he"] form.lead input,[data-page="lien-he"] form.lead select,[data-page="lien-he"] form.lead textarea{border-radius:0!important;border-width:0 0 1.5px 0!important;background:none!important;padding-left:0!important;}
/* Kênh liên hệ: áp dụng thiết kế Tầm nhìn 2030, nền gradient xanh + thẻ trong suốt trắng */
[data-page="lien-he"] #lien-he-kenh{position:relative;overflow:hidden;color:#fff;
padding-block:clamp(72px,8vw,124px);
background:linear-gradient(150deg,#34B462 0%,#1E9E56 46%,#14875F 78%,#127C76 100%);}
[data-page="lien-he"] #lien-he-kenh .mg-vision-bg{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;
opacity:.3;mix-blend-mode:soft-light;will-change:transform;}
[data-page="lien-he"] #lien-he-kenh::after{content:"";position:absolute;inset:0;pointer-events:none;
background:radial-gradient(70% 60% at 80% 8%,rgba(120,235,255,.28),transparent 60%);}
[data-page="lien-he"] #lien-he-kenh > .container{position:relative;z-index:2;}
[data-page="lien-he"] .channel-card{background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.32)!important;
border-radius:20px!important;padding:30px 26px!important;
transition:transform .45s var(--ease),background .35s,border-color .35s;}
[data-page="lien-he"] .channel-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.24)!important;
border-color:rgba(255,255,255,.7)!important;box-shadow:0 18px 40px rgba(6,50,32,.18);}
[data-page="lien-he"] .channel-card .ic{background:rgba(255,255,255,.9)!important;border:none!important;
width:58px!important;height:58px!important;border-radius:18px!important;
display:flex!important;align-items:center;justify-content:center;margin-bottom:20px!important;
transition:background .35s,transform .45s var(--ease);}
[data-page="lien-he"] .channel-card:hover .ic{background:#fff!important;transform:scale(1.06) rotate(-2deg);}
[data-page="lien-he"] .channel-card h4{color:#fff!important;}
[data-page="lien-he"] .channel-card p{color:rgba(255,255,255,.88)!important;}
[data-page="doi-tac"] .partner-card{text-align:left!important;}
[data-page="doi-tac"] .partner-card h3{font-size:clamp(19px,1.8vw,24px);letter-spacing:-.02em;margin-bottom:14px;}
[data-page="doi-tac"] .partner-logo,[data-page="doi-tac"] .partner-logo.img{background:none!important;border:none!important;border-radius:0!important;padding:0!important;width:auto!important;height:60px!important;justify-content:flex-start;margin-bottom:18px;}
[data-page="doi-tac"] .partner-logo.img img{width:auto;max-width:170px;height:100%;object-fit:contain;object-position:left center;}
[data-page="doi-tac"] .partner-item{border-top:1px solid var(--border);}
/* Mô hình hợp tác Win Win: áp dụng thiết kế Tầm nhìn 2030 — nền gradient xanh + thẻ trong suốt trắng */
[data-page="doi-tac"] #win-win{position:relative;overflow:hidden;color:#fff;
background:linear-gradient(150deg,#34B462 0%,#1E9E56 46%,#14875F 78%,#127C76 100%)!important;}
[data-page="doi-tac"] #win-win .mg-vision-bg{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;
opacity:.3;mix-blend-mode:soft-light;will-change:transform;}
[data-page="doi-tac"] #win-win::after{content:"";position:absolute;inset:0;pointer-events:none;
background:radial-gradient(70% 60% at 80% 8%,rgba(120,235,255,.28),transparent 60%);}
[data-page="doi-tac"] #win-win > .container{position:relative;z-index:2;}
[data-page="doi-tac"] #win-win .eyebrow{color:#EAFFF1!important;}
[data-page="doi-tac"] #win-win .eyebrow::before{background:#EAFFF1!important;}
[data-page="doi-tac"] #win-win h2.section-title{color:#fff!important;}
[data-page="doi-tac"] #win-win > .container > p.lede{color:#EAF6EE!important;}
[data-page="doi-tac"] #win-win .winwin-node h4{color:#fff!important;}
[data-page="doi-tac"] #win-win .winwin-role{color:rgba(255,255,255,.85)!important;}
[data-page="doi-tac"] .winwin-ic{background:rgba(255,255,255,.9)!important;border:none!important;}
[data-page="doi-tac"] #win-win .winwin-link .line{background:rgba(255,255,255,.4)!important;}
[data-page="doi-tac"] #win-win .winwin-swap{background:rgba(255,255,255,.92)!important;color:#146B2E!important;border-color:rgba(255,255,255,.6)!important;}
:is([data-page="giai-phap"],[data-page="nen-tang-agrigreen"]) .pathway{border-bottom:none!important;gap:clamp(40px,6vw,88px);padding-block:clamp(20px,3vw,40px);}
:is([data-page="giai-phap"],[data-page="nen-tang-agrigreen"]) .pathway .illus-frame{border-radius:0!important;}
:is([data-page="giai-phap"],[data-page="nen-tang-agrigreen"]) :is(.step-card .num,.step .n){font-size:clamp(28px,3vw,42px);font-weight:800;letter-spacing:-.04em;color:color-mix(in oklab,var(--brand) 36%,transparent);background:none!important;width:auto!important;height:auto!important;border-radius:0!important;}
/* ============ PRINT: doi tac hay in bai viet ra hop -- an chrome, giu lai noi dung ============ */
@media print{
.skip-link,header.site,.mobile-panel,#mgProgress,#mgNet,.hero-slider-nav,.hero-slider-dots,
.cta-band,.cta-strip,footer.site,form.lead,.filter-tabs,.pagination,.hp-trap,
.btn,.badge-pill,.orbit-ring,.orbit-badge{display:none!important;}
body{background:#fff!important;color:#000!important;}
a{color:#000!important;text-decoration:underline;}
.container,.container-narrow{max-width:none!important;padding:0!important;}
.article-body{font-size:12pt;line-height:1.5;}
.page-hero,.hero-photo{min-height:auto!important;position:static!important;padding:12pt 0!important;}
.page-hero .overlay,.hero-photo .overlay{display:none!important;}
.page-hero .bgimg,.hero-photo .bgimg{position:static!important;width:auto!important;height:auto!important;
max-width:280px!important;transform:none!important;display:block;margin-bottom:12pt;}
.page-hero h1,.hero-photo h1{color:#000!important;text-shadow:none!important;}
a[href]:not([href^="#"])::after{content:" (" attr(href) ")";font-size:9pt;font-weight:400;}
}