
.vd-nav{--n-bg:#fff;--n-ink:#17202b;--n-mute:#5d6875;--n-line:#e2e6eb;--n-soft:#eceff3;--n-red:#d6322a;--n-red-d:#b32720;font-family:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:sticky;top:0;z-index:1000;background:var(--n-bg);border-bottom:1px solid var(--n-line);color:var(--n-ink);transition:box-shadow .2s}
.vd-nav *{box-sizing:border-box}
.vd-nav.vd-scrolled{box-shadow:0 6px 24px rgba(23,32,43,.12)}
.vd-in{max-width:1160px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:18px;min-height:64px}
.vd-logo{font-weight:800;font-size:19px;color:var(--n-ink);text-decoration:none;white-space:nowrap}.vd-logo span{color:var(--n-red)}
.vd-menu{display:flex;align-items:center}
.vd-list{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.vd-li{position:relative}
.vd-a{display:block;padding:22px 12px;font-size:14px;font-weight:600;color:var(--n-ink);text-decoration:none;white-space:nowrap}
.vd-li>.vd-a:hover{color:var(--n-red)}
.vd-has>.vd-a::after{content:"";display:inline-block;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-left:7px;position:relative;top:-2px;opacity:.55}
.vd-chev{display:none}
.vd-sub{display:none;position:absolute;left:0;top:100%;min-width:240px;list-style:none;margin:0;padding:8px;background:var(--n-bg);border:1px solid var(--n-line);border-radius:14px;box-shadow:0 14px 34px rgba(23,32,43,.16)}
.vd-li:hover>.vd-sub,.vd-li:focus-within>.vd-sub{display:block}
.vd-sub a{display:block;padding:9px 12px;border-radius:9px;font-size:14px;color:var(--n-ink);text-decoration:none}
.vd-sub a:hover{background:var(--n-soft);color:var(--n-red)}
.vd-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.vd-search{display:flex;align-items:center;background:var(--n-soft);border-radius:10px;overflow:hidden}
.vd-search input{border:0;background:transparent;padding:10px 4px 10px 12px;font:inherit;font-size:14px;color:var(--n-ink);width:160px;outline:0;height:auto;box-shadow:none}
.vd-search button{border:0;background:transparent;padding:0 12px;height:40px;cursor:pointer;color:var(--n-mute)}
.vd-search svg{width:18px;height:18px;display:block}
.vd-hot{background:var(--n-red);color:#fff!important;font-weight:700;font-size:14px;padding:10px 16px;border-radius:10px;text-decoration:none;white-space:nowrap}.vd-hot:hover{background:var(--n-red-d)}
.vd-hot i{display:none;font-style:normal}
.vd-burger{display:none;width:44px;height:44px;border:1px solid var(--n-line);border-radius:10px;background:var(--n-bg);cursor:pointer;padding:0;position:relative}
.vd-burger span,.vd-burger span::before,.vd-burger span::after{content:"";position:absolute;left:12px;width:18px;height:2px;background:var(--n-ink);border-radius:2px;transition:transform .2s}
.vd-burger span{top:20px}.vd-burger span::before{left:0;top:-6px}.vd-burger span::after{left:0;top:6px}
.vd-open .vd-burger span{background:transparent}.vd-open .vd-burger span::before{transform:translateY(6px) rotate(45deg)}.vd-open .vd-burger span::after{transform:translateY(-6px) rotate(-45deg)}
.vd-msearch{display:none}
@media (prefers-reduced-motion:reduce){.vd-nav,.vd-burger span,.vd-burger span::before,.vd-burger span::after{transition:none}}
@media (max-width:1040px){.vd-search input{width:120px}.vd-a{padding:22px 9px}}
@media (max-width:960px){
.vd-in{gap:10px}.vd-right{margin-left:auto}.vd-right .vd-search{display:none}
.vd-hot span{display:none}.vd-hot i{display:inline}
.vd-burger{display:block}
.vd-menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--n-bg);border-bottom:1px solid var(--n-line);max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px);overflow:auto;flex-direction:column;align-items:stretch;padding:8px 20px 18px;box-shadow:0 14px 30px rgba(23,32,43,.14)}
.vd-open .vd-menu{display:flex}
.vd-list{flex-direction:column;gap:0}
.vd-li{display:flex;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--n-line)}
.vd-a{flex:1;padding:15px 4px;font-size:16px}
.vd-has>.vd-a::after{display:none}
.vd-chev{display:block;width:48px;height:48px;border:0;background:transparent;cursor:pointer;position:relative}
.vd-chev::after{content:"";position:absolute;left:19px;top:16px;width:8px;height:8px;border-right:2px solid var(--n-ink);border-bottom:2px solid var(--n-ink);transform:rotate(45deg);transition:transform .2s}
.vd-on>.vd-chev::after{transform:rotate(-135deg);top:20px}
.vd-sub,.vd-li:hover>.vd-sub,.vd-li:focus-within>.vd-sub{display:none;position:static;width:100%;min-width:0;border:0;box-shadow:none;padding:0 0 10px 12px;border-radius:0}
.vd-li.vd-on>.vd-sub{display:block}
.vd-msearch{display:flex;margin-top:14px}.vd-msearch input{width:100%}
}

/* ===== VDC-v2 nền tảng ===== */
body{font-family:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#17202b;-webkit-font-smoothing:antialiased}
.vd-wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.vd-strip{background:#17202b;color:#dfe5eb;font-size:13px}
.vd-strip .vd-wrap{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:36px;flex-wrap:wrap}
.vd-strip a{color:#fff;font-weight:600;text-decoration:none}
.vd-strip-r{display:flex;gap:12px;align-items:center}
.vd-strip-r form,.vd-strip-r .btn-group{margin:0}
.vd-logo img{display:block;max-height:40px;width:auto}
.vd-in{max-width:1160px}
.vd-ic{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;color:var(--n-ink);text-decoration:none;font-size:17px}.vd-ic:hover{background:var(--n-soft)}
.vd-search,.vd-msearch{min-width:0}
.vd-search #search,.vd-msearch #search{margin:0;display:flex;width:220px;max-width:100%}
.vd-search #search .form-control,.vd-msearch #search .form-control{height:40px;border:0;border-radius:10px 0 0 10px;background:var(--n-soft);box-shadow:none;font-size:14px;width:100%;float:none}
.vd-search #search .input-group-btn,.vd-msearch #search .input-group-btn{width:auto}
.vd-search #search .btn,.vd-msearch #search .btn{height:40px;border:0;border-radius:0 10px 10px 0;background:var(--n-soft);color:var(--n-mute);padding:0 12px;margin:0;width:auto}
.vd-cart #cart{margin:0}
.vd-cart #cart>.btn{width:auto;height:40px;margin:0;padding:0 12px;border-radius:10px;background:var(--n-soft);color:var(--n-ink);border:0;font-size:14px;display:inline-block}
.vd-cart #cart .dropdown-menu{right:0;left:auto;z-index:1100}
.vd-hot i{display:none}
.vd-all a{font-weight:700;color:var(--n-red)}
.vd-msearch{display:none}
.vd-float{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:10px;z-index:900}
.vd-float a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:99px;font-weight:700;font-size:14px;text-decoration:none;box-shadow:0 8px 22px rgba(23,32,43,.22)}
.vd-float .call{background:#d6322a;color:#fff}.vd-float .zalo{background:#0068ff;color:#fff}
.vd-footer{background:#17202b;color:#c4ccd5;font-size:14px;margin-top:40px}
.vd-fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding-top:44px;padding-bottom:36px}
.vd-footer h5{color:#fff;font-size:15px;font-weight:700;margin:0 0 14px;text-transform:none}
.vd-footer ul{list-style:none;margin:0;padding:0}.vd-footer li{margin:0 0 9px;line-height:1.5}
.vd-footer li i{width:18px;color:#8794a3}
.vd-footer a{color:#e6ebf0;text-decoration:none}.vd-footer a:hover{color:#fff;text-decoration:underline}
.vd-copy{border-top:1px solid #2b3440;padding:16px 0;color:#8f9aa8;font-size:13px}
@media (max-width:1040px){.vd-search #search{width:150px}}
@media (max-width:960px){
.vd-right .vd-search{display:none}
.vd-msearch{display:block;margin-top:14px}.vd-msearch #search{width:100%}
.vd-hot{padding:10px 12px}.vd-hot span{display:none}.vd-hot i{display:inline-block;margin:0}
.vd-strip .vd-strip-r{display:none}
.vd-fg{grid-template-columns:1fr 1fr}
.vd-float{left:0;right:0;bottom:0;flex-direction:row;gap:8px;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid #e2e6eb}
.vd-float a{flex:1;border-radius:12px;box-shadow:none}
body{padding-bottom:70px}
}
@media (max-width:560px){.vd-fg{grid-template-columns:1fr}}
