/* v5 UX (25/10/2026, anh Quyet gop y sau ban xem truoc): chuyen dong thong nhat, menu noi mobile,
   slider hero vuot duoc, thanh tin chu y xoay vong, chan the/footer can phai-deu, ra soat mobile 390/768.
   Nap SAU site.css, trang.css, them.css. */
:root{
  --t-fast:150ms; --t:220ms; --t-slow:360ms;
  --ease:cubic-bezier(.2,.7,.2,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --bong-1:0 1px 2px rgba(11,59,31,.06),0 4px 12px -6px rgba(11,59,31,.12);
  --bong-2:0 2px 4px rgba(11,59,31,.05),0 14px 28px -12px rgba(11,59,31,.22);
  --vong:0 0 0 3px rgba(74,160,0,.45);
}

/* ---------- 1. nut, pill, lien ket, the: cung mot bo thoi gian/duong cong ---------- */
.v5 a,.v5 button{-webkit-tap-highlight-color:transparent}
.v5 .pill{transition:background-color var(--t) var(--ease),color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.v5 .pill:active{transform:scale(.97);transition-duration:var(--t-fast)}
.v5 .pill:focus-visible{outline:2px solid var(--leaf);outline-offset:2px;box-shadow:var(--vong)}
.v5 .pill-w{background:#fff;color:var(--deep);border-color:#fff}
.v5 .lnk::after{transition:transform var(--t) var(--ease)}
.v5 .menu>a,.v5 .mc-nut,.v5 .mc-cot a,.v5 footer a,.v5 .ic,.v5 .tabs button,.v5 .other img,.v5 .lh .so{transition:color var(--t) var(--ease),background-color var(--t) var(--ease),border-color var(--t) var(--ease),filter var(--t) var(--ease),opacity var(--t) var(--ease),transform var(--t) var(--ease)}
.v5 .ic{border-radius:50%}
.v5 .ic:active,.v5 .tabs button:active{transform:scale(.94);transition-duration:var(--t-fast)}
.v5 .sp,.v5 .val,.v5 .nw,.v5 .hang-sp,.v5 .cs-app,.v5 .panel>a,.v5 .tree .n{transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),background-color var(--t) var(--ease),border-color var(--t) var(--ease)}
.v5 a.sp:active,.v5 a.nw:active,.v5 a.hang-sp:active,.v5 .panel>a:active{transform:scale(.985);transition-duration:var(--t-fast)}
.v5 a.sp:focus-visible,.v5 a.nw:focus-visible,.v5 a.hang-sp:focus-visible,.v5 .panel>a:focus-visible{outline:2px solid var(--leaf);outline-offset:3px}
@media (hover:hover) and (pointer:fine){
  .v5 .pill-g:hover{box-shadow:0 8px 18px -8px rgba(10,138,47,.55);transform:translateY(-1px)}
  .v5 .pill-o:hover{transform:translateY(-1px)}
  .v5 .pill-w:hover{background:#e4f4dc;border-color:#e4f4dc;transform:translateY(-1px)}
  .v5 .pill:active{transform:translateY(0) scale(.97)}
  .v5 .lnk:hover::after,.v5 a:hover .lnk::after{transform:translateX(3px) rotate(45deg)}
  .v5 .ic:hover{background:var(--grey2)}
  .v5 a.sp:hover,.v5 .cs-app:hover,.v5 a.nw:hover,.v5 .val:hover{transform:translateY(-3px);box-shadow:var(--bong-2)}
  .v5 a.sp:hover .pill-g{background:var(--deep)}
  .v5 a.sp.noi:hover .pill{background:#e4f4dc}
  .v5 a.hang-sp:hover{transform:translateY(-2px);box-shadow:var(--bong-2)}
  .v5 a.hang-sp:hover .pill-g{background:var(--deep)}
  .v5 a.hang-sp.noi:hover .pill-g{background:#e4f4dc;color:var(--deep)}
  .v5 .panel>a:hover{background:rgba(255,255,255,.55)}
  .v5 .tree .n:hover{transform:translateY(-2px);box-shadow:var(--bong-1)}
  .v5 .tabs button:hover{border-color:var(--brand);color:var(--brand)}
  .v5 .tabs button[aria-pressed=true]:hover{color:#fff}
  .v5 .lh .so:hover{color:#c8f0b4}
}
.v5 .panel>a{border-radius:16px}
.v5 .val{border:1px solid transparent}

/* gach chan truot cho menu cap 1 (desktop) */
@media (min-width:1001px){
  .v5 .menu>a,.v5 .mc-nut{position:relative}
  .v5 .menu>a::after,.v5 .mc-nut::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform var(--t) var(--ease)}
  .v5 .mc-nut::after{right:16px}
  .v5 .menu>a:hover::after,.v5 .mc-nut:hover::after,.v5 .mc.mo .mc-nut::after{transform:scaleX(1)}
  .v5 .mc-nut svg{transition:transform var(--t) var(--ease)}
  .v5 .mc:hover .mc-nut svg,.v5 .mc.mo .mc-nut svg{transform:rotate(180deg)}
  /* menu tha xuong: mo/dong bang opacity + truot nhe, dong tre 120ms de chuot di qua khe khong bi tat */
  .v5 .mc-bang{opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none;transition:opacity var(--t) var(--ease),transform var(--t) var(--ease),visibility 0s linear var(--t);transition-delay:120ms}
  .v5 .mc-bang::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
  .v5 .mc:hover .mc-bang,.v5 .mc.mo .mc-bang,.v5 .mc:focus-within .mc-bang{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
  .v5 .mc-cot a{transition:color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
  .v5 .mc-cot a:not(.mc-tde):hover{transform:translateX(3px)}
  .v5 .menu-phu,.v5 .menu-nen{display:none}
}

/* ---------- 2. menu noi tren mobile/tablet (<=1000px) ---------- */
.v5 .ham{position:relative;cursor:pointer;color:var(--ink)}
.v5 .ham-i{position:relative;display:block;width:22px;height:16px}
.v5 .ham-i i{position:absolute;left:0;width:22px;height:2px;border-radius:2px;background:currentColor;transition:transform var(--t-slow) var(--ease-out),opacity var(--t-fast) var(--ease),top var(--t) var(--ease) var(--t-fast)}
.v5 .ham-i i:nth-child(1){top:0}.v5 .ham-i i:nth-child(2){top:7px}.v5 .ham-i i:nth-child(3){top:14px}
.v5 .ham.mo .ham-i i{transition:top var(--t) var(--ease),transform var(--t-slow) var(--ease-out) var(--t-fast),opacity var(--t-fast) var(--ease)}
.v5 .ham.mo .ham-i i:nth-child(1){top:7px;transform:rotate(45deg)}
.v5 .ham.mo .ham-i i:nth-child(2){opacity:0;transform:scaleX(.2)}
.v5 .ham.mo .ham-i i:nth-child(3){top:7px;transform:rotate(-45deg)}
.v5 .ham.mo{background:var(--grey);color:var(--brand)}
html.v5-khoa,html.v5-khoa body{overflow:hidden}
html.v5-khoa [class*="hcrm-widget"]{visibility:hidden!important}
@media (max-width:1000px){
  .v5 .top{z-index:1000}
  .v5 .menu{display:flex;position:fixed;top:var(--menu-top,72px);right:12px;width:min(420px,calc(100vw - 24px));max-height:calc(100vh - var(--menu-top,72px) - 12px);max-height:calc(100dvh - var(--menu-top,72px) - 12px);overflow-y:auto;overscroll-behavior:contain;
    flex-direction:column;align-items:stretch;gap:0;background:#fff;border:1px solid var(--line);border-radius:20px;padding:6px 18px 18px;z-index:2;
    box-shadow:0 30px 60px -20px rgba(11,40,22,.45),0 8px 20px -10px rgba(11,40,22,.25);
    opacity:0;visibility:hidden;transform:translateY(-12px) scale(.97);transform-origin:top right;pointer-events:none;
    transition:opacity var(--t) var(--ease),transform var(--t-slow) var(--ease-out),visibility 0s linear var(--t-slow)}
  .v5 .menu.mo{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
  .v5 .menu>*{opacity:0;transform:translateY(-6px);transition:opacity var(--t) var(--ease),transform var(--t) var(--ease)}
  .v5 .menu.mo>*{opacity:1;transform:none}
  .v5 .menu.mo>*:nth-child(2){transition-delay:30ms}.v5 .menu.mo>*:nth-child(3){transition-delay:60ms}.v5 .menu.mo>*:nth-child(4){transition-delay:90ms}
  .v5 .menu.mo>*:nth-child(5){transition-delay:120ms}.v5 .menu.mo>*:nth-child(6){transition-delay:150ms}.v5 .menu.mo>*:nth-child(n+7){transition-delay:180ms}
  .v5 .menu>a,.v5 .menu .mc-nut{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px;padding:12px 4px;border-bottom:1px solid var(--line);font:600 19px var(--h);color:var(--ink);text-align:left}
  .v5 .menu>a:active,.v5 .menu .mc-nut:active{color:var(--brand)}
  .v5 .menu .mc-nut svg{width:14px;height:14px;transition:transform var(--t) var(--ease)}
  .v5 .menu .mc.mo .mc-nut{color:var(--brand);border-bottom-color:transparent}
  .v5 .menu .mc.mo .mc-nut svg{transform:rotate(180deg)}
  .v5 .menu .mc-bang{position:static;min-width:0;box-shadow:none;border:0;border-radius:14px;background:var(--grey2);padding:0 14px;grid-template-columns:1fr;gap:0;
    max-height:0;overflow:hidden;opacity:0;transition:max-height var(--t-slow) var(--ease),opacity var(--t) var(--ease),padding var(--t-slow) var(--ease),margin var(--t-slow) var(--ease)}
  .v5 .menu .mc.mo .mc-bang{opacity:1;padding:6px 14px 10px;margin:0 0 8px}
  .v5 .menu .mc-bang{grid-template-columns:1fr 1fr;column-gap:12px}
  .v5 .menu .mc-cot{grid-column:1/-1;padding:6px 0;border-bottom:1px solid var(--line)}
  /* cot chi co tieu de (khong co muc con): xep 2 cot cho gon */
  .v5 .menu .mc-cot:not(:has(a+a)){grid-column:auto;border-bottom:0;padding:0}
  .v5 .menu .mc-cot:not(:has(a+a)) .mc-tde{font:500 15px "Be Vietnam Pro","BVP Fallback",sans-serif;color:var(--ink)}
  .v5 .menu .mc-cot:last-child{border-bottom:0}
  .v5 .menu .mc-cot a{display:flex;align-items:center;min-height:40px;font-size:15px;padding:4px 0}
  .v5 .menu .mc-cot .mc-tde{font-size:17px;margin:0;color:var(--deep)}
  .v5 .menu-phu{display:grid;gap:12px;padding-top:16px}
  .v5 .menu-phu .pill{min-height:48px;font-size:16px}
  .v5 .menu-nho{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .v5 .menu-nho a{display:flex;align-items:center;gap:8px;min-height:46px;padding:8px 12px;border-radius:12px;background:var(--grey2);font-size:14px;color:var(--ink);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .v5 .menu-nho a svg{flex:none;color:var(--brand)}
  .v5 .menu-nho a:active{background:var(--grey)}
  .v5 .menu-nen{display:block;position:fixed;left:0;right:0;bottom:0;top:64px;z-index:1;background:rgba(8,30,17,.42);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity var(--t-slow) var(--ease),visibility 0s linear var(--t-slow)}
  .v5 .menu-nen.mo{opacity:1;visibility:visible;transition-delay:0s}
  .v5 .ic{width:44px;height:44px}
  .v5 .tp{gap:4px}
}
@media (max-width:560px){
  .v5 .ic-phu{display:none}
  .v5 .top .wrap{gap:8px}
  .v5 .menu{right:10px;width:calc(100vw - 20px)}
}

/* ---------- 3. thanh tin chu y (xoay vong nhieu tin) ---------- */
.v5 .bar .wrap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px 18px;padding-top:10px;padding-bottom:10px}
.v5 .bar-nhan{font:700 13px var(--h);letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.16);border-radius:999px;padding:5px 12px;white-space:nowrap}
.v5 .bar-ds{display:grid;min-width:0;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.v5 .bar-tin{grid-area:1/1;min-width:0;display:block;color:#fff;opacity:0;visibility:hidden;transform:translateX(calc(var(--huong,1) * 28px));
  transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease-out),visibility 0s linear var(--t-slow)}
.v5 .bar-tin.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.v5 .bar-tin.ra{transform:translateX(calc(var(--huong,1) * -28px))}
.v5 .bar-tin.vao{transition:none}
.v5 .bar-tin b{display:block;font:600 20px/1.3 var(--h);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v5 .bar-tin:hover b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.v5 .bar-tin:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:4px}
.v5 .bar-dk{display:flex;align-items:center;gap:4px}
.v5 .bar-nut{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:#fff;cursor:pointer;transition:background-color var(--t) var(--ease),transform var(--t) var(--ease)}
.v5 .bar-nut:hover{background:rgba(255,255,255,.16)}
.v5 .bar-nut:active{transform:scale(.9);transition-duration:var(--t-fast)}
.v5 .bar-nut:focus-visible{outline:2px solid #fff;outline-offset:1px}
.v5 .bar-so{font:600 14px var(--h);min-width:30px;text-align:center}
.v5 .bar .bar-doc{margin-left:10px;background:#fff;color:var(--brand);padding:9px 20px}
.v5 .bar .bar-doc:hover{background:#e4f4dc}
.v5 .bar .bar-doc:focus-visible{outline-color:#fff}
@media (max-width:760px){
  .v5 .bar .wrap{grid-template-columns:minmax(0,1fr);gap:8px;padding-top:12px;padding-bottom:10px}
  .v5 .bar-nhan{display:none}
  .v5 .bar-tin b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:18px;line-height:1.3}
  .v5 .bar-dk{margin-left:-10px}
  .v5 .bar .bar-doc{margin-left:auto;min-height:40px}
}
@media (max-width:560px){.v5 .bar .wrap{align-items:center}}

/* ---------- 4. slider hero: ray truot, vuot/keo, cham dang vien nang + thanh tien do ---------- */
.v5 .hero .wrap>*{min-width:0}
.v5 .sl{outline:0;min-width:0}
.v5 .sl:focus-visible .sl-khung{outline:2px solid var(--leaf);outline-offset:4px;border-radius:18px}
.v5 .sl-khung{overflow:hidden;margin:-14px -16px -24px;padding:14px 16px 24px;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.v5 .sl-khung.dang-keo{cursor:grabbing}
.v5 .sl-ray{display:flex;align-items:flex-start;gap:32px;transition:transform 520ms var(--ease-out);will-change:transform}
.v5 .sl .sd{display:block;flex:0 0 100%;min-width:0;opacity:.35;transition:opacity 520ms var(--ease)}
.v5 .sl .sd.on{opacity:1}
.v5 .sl-khung.dang-keo .sd{opacity:1}
.v5 .sl img{-webkit-user-drag:none;pointer-events:none}
.v5 .kh{box-shadow:0 18px 36px -20px rgba(11,59,31,.38)}
.v5 .dots{display:flex;gap:0;margin:6px 0 0 -10px}
.v5 .dots button{position:relative;width:auto;min-width:28px;height:36px;padding:0 10px;background:none;border:0;border-radius:0;cursor:pointer}
.v5 .dots button::before{content:"";display:block;width:8px;height:8px;border-radius:4px;background:var(--line);transition:width var(--t-slow) var(--ease-out),background-color var(--t) var(--ease)}
.v5 .dots button:hover::before{background:#b9c7be}
.v5 .dots button[aria-current=true]::before{width:30px;background:#cfe0d4}
.v5 .dots button::after{content:"";position:absolute;left:10px;top:14px;height:8px;width:0;border-radius:4px;background:var(--brand)}
.v5 .dots button[aria-current=true]::after{width:30px}
.v5 .sl.chay .dots button[aria-current=true]::after{animation:v5tiendo 6s linear both}
@keyframes v5tiendo{from{width:8px}to{width:30px}}
.v5 .dots button:focus-visible{outline:0}
.v5 .dots button:focus-visible::before{box-shadow:var(--vong)}
@media (max-width:1000px){
  /* (viec 8) mobile/tablet: slider anh len tren phan chu, khong doi thu tu HTML */
  .v5 .hero .wrap{gap:18px}
  .v5 .hero .sl{order:-1}
  .v5 .hero .kh{aspect-ratio:16/9;max-height:42vh;max-height:42svh;margin:0 auto}
  .v5 .hero .kh img{object-position:top}
}
@media (max-width:560px){
  .v5 .hero .wrap{padding-top:16px;padding-bottom:20px}
  .v5 .sd figcaption{margin-top:8px}
  .v5 .sd b{font-size:18px;line-height:1.25}
  .v5 .sd figcaption span:last-child{font-size:14px}
  .v5 .hero p{margin:10px 0 16px}
  .v5 .hero .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .v5 .hero .acts .pill{min-height:48px;padding:11px 12px}
}

/* ---------- 5. chan the: gia ben trai, nut Mua ben phai ---------- */
.v5 .sp-chan{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding-top:12px;border-top:1px solid rgba(11,59,31,.08)}
.v5 .sp-chan .gia{margin:0}
.v5 .sp .sp-chan .pill{margin:0;align-self:auto;flex:none}
.v5 .sp.noi .sp-chan{border-top-color:rgba(255,255,255,.14)}
.v5 .sp .cap{margin-bottom:0}
@media (max-width:1180px) and (min-width:1001px){.v5 .sp-chan{flex-wrap:wrap}}
.v5 .val .pill{align-self:flex-end}

/* ---------- 6. dai "Can tu van?" + footer ---------- */
.v5 .lh .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 32px}
.v5 .lh-act{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.v5 .lh .so{display:inline-flex;align-items:center;gap:10px;margin:0;padding:6px 18px 6px 14px;min-height:48px;border-radius:999px;border:1.5px solid rgba(255,255,255,.28);font:700 26px var(--h);letter-spacing:.01em}
.v5 .lh .so svg{color:#9be07f}
.v5 .lh .pill{min-height:48px;padding:12px 26px;font-size:16px}
.v5 footer ul a{display:inline-block;padding:2px 0}
.v5 footer a{transition:color var(--t) var(--ease)}
.v5 .cp .wrap{gap:16px}
@media (max-width:760px){
  .v5 .lh .wrap{grid-template-columns:1fr;gap:16px;padding-top:26px;padding-bottom:26px}
  .v5 .lh-act{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .v5 .lh .so{justify-content:center;font-size:20px;padding:6px 10px;gap:8px}
  .v5 .lh .so svg{width:18px;height:18px}
  .v5 .lh .pill{width:100%}
}
@media (max-width:560px){
  .v5 footer .wrap{grid-template-columns:1fr 1fr;gap:22px 18px;padding-top:28px}
  .v5 footer .wrap>div:first-child{grid-column:1/-1}
  .v5 footer ul{line-height:1.45}
  .v5 footer ul a{padding:9px 0;min-height:40px}
  .v5 footer h3.ft{margin-bottom:2px}
  .v5 .cp .wrap{align-items:flex-start;text-align:left}
}
@media (max-width:380px){.v5 .lh-act{grid-template-columns:1fr}}

/* ---------- 7. ra soat mobile chung ---------- */
@media (max-width:1000px){
  .v5 .top .wrap{gap:16px}
}
@media (max-width:560px){
  .v5 .tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;margin-left:-16px;margin-right:-16px;padding:2px 16px 4px;scroll-padding:16px}
  .v5 .tabs::-webkit-scrollbar{display:none}
  .v5 .tabs button{flex:none;min-height:44px;padding:10px 18px}
  .v5 .lineup{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;scroll-padding:16px;scrollbar-width:none}
  .v5 .lineup::-webkit-scrollbar{display:none}
  .v5 .sp .pill,.v5 .hang-sp .pill{min-height:44px;padding:10px 20px}
  .v5 .panel>a{padding:16px 18px}
  .v5 .lnk{min-height:40px}
  /* danh sach san pham: gia trai, nut phai */
  .v5 .hang-sp{grid-template-columns:minmax(0,1fr) auto;align-items:center}
  .v5 .hang-sp>div:first-child{grid-column:1/-1}
  .v5 .hang-sp .gia{text-align:left}
  .v5 .hang-sp .pill{justify-self:end}
  .v5 .other .dong{gap:16px 28px}
}

/* ---------- 8. hien dan luoi the khi cuon toi (JS them .cho/.hien) ---------- */
.v5 .cho>*{opacity:0;transform:translateY(14px)}
.v5 .cho.hien>*{opacity:1;transform:none;transition:opacity 480ms var(--ease),transform 560ms var(--ease-out)}
.v5 .cho.hien>*:nth-child(2){transition-delay:50ms}.v5 .cho.hien>*:nth-child(3){transition-delay:100ms}.v5 .cho.hien>*:nth-child(4){transition-delay:150ms}
.v5 .cho.hien>*:nth-child(5){transition-delay:200ms}.v5 .cho.hien>*:nth-child(n+6){transition-delay:240ms}

/* ---------- 9. giam chuyen dong ---------- */
@media (prefers-reduced-motion:reduce){
  .v5 *,.v5 *::before,.v5 *::after{transition-duration:1ms!important;transition-delay:0s!important;animation-duration:1ms!important;animation-iteration-count:1!important}
  .v5 .sl-ray{transition:none!important}
  .v5 .cho>*{opacity:1;transform:none}
  .v5 a.sp:hover,.v5 a.nw:hover,.v5 .val:hover,.v5 a.hang-sp:hover,.v5 .pill:hover,.v5 .pill:active{transform:none!important}
}

/* ---------- 10. bo icon chung (sprite #i-* trong v5dau.php, net 1.75 kieu Lucide) + it chu hon ---------- */
.v5 .ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px}
.v5 .ico-o{box-sizing:content-box;width:20px;height:20px;padding:9px;border-radius:12px;background:#e3f1e6;color:var(--brand)}
.v5 .ico-l{width:24px;height:24px;padding:11px;border-radius:14px}
.v5 .sp.noi .ico-o,.v5 .noi .ico-o{background:rgba(255,255,255,.12);color:#9be07f}
.v5 .hero-y{list-style:none;padding:0;margin:14px 0 22px;display:flex;flex-wrap:wrap;gap:8px 18px}
.v5 .hero-y li{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--ink);font-size:16px}
.v5 .hero-y .ico{color:var(--brand);width:22px;height:22px}
.v5 .panel .lv{display:flex;align-items:center;gap:10px}
.v5 .panel .lv .ico-o{padding:7px;border-radius:10px}
.v5 .panel>a:hover .ico-o{background:var(--brand);color:#fff}
.v5 .panel .ico-o,.v5 .val .ico-o,.v5 .cs-app .ico-o{transition:background-color var(--t) var(--ease),color var(--t) var(--ease),transform var(--t) var(--ease)}
.v5 .val .ico-o{display:block;margin-bottom:12px}
@media (hover:hover){.v5 .val:hover .ico-o{background:var(--brand);color:#fff;transform:rotate(-4deg)}.v5 .cs-app:hover .ico-o{background:var(--brand);color:#fff}}
.v5 .cs-app .kicker{display:flex;align-items:center;gap:10px}
.v5 .cs-app .kicker .ico-o{padding:7px;border-radius:10px}
.v5 .cs-y{list-style:none;padding:0;margin:4px 0;display:grid;gap:6px;font-size:15px}
.v5 .cs-y li{display:flex;align-items:center;gap:8px}
.v5 .cs-y .ico{color:var(--brand)}
.v5 .cs-tang{font-size:13px!important;font-weight:600;color:var(--brand)!important;background:#e3f1e6;border-radius:8px;padding:6px 10px;align-self:flex-start}
.v5 .tv-c{display:flex;align-items:center;gap:16px}
.v5 .tv .ico-o{background:#fff}
@media (max-width:560px){
  .v5 .hero-y{gap:6px 14px;margin:10px 0 16px}
  .v5 .hero-y li{font-size:15px}
  .v5 .tv-c{gap:12px}
  .v5 .tv .wrap{align-items:stretch}
  .v5 .tv .pill{width:100%;min-height:48px}
}
/* tu van: icon trong tung lua chon */
.v5 .lc label{grid-template-columns:auto 1fr;column-gap:10px;align-items:center;transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.v5 .lc label .ico{grid-row:1/3;width:24px;height:24px;color:var(--brand)}
.v5 .lc label b,.v5 .lc label span{grid-column:2}
.v5 .lc label:active{transform:scale(.98)}
@media (hover:hover){.v5 .lc label:hover{border-color:#a9cdb3}}
.v5 .cau legend{margin-bottom:10px}
@media (max-width:560px){
  /* the co icon: icon ben trai, chu ben phai -> the thap hon tren mobile */
  .v5 .val:has(>.ico-o){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;align-items:start;padding:16px}
  .v5 .val>.ico-o{grid-row:1/span 3;margin:0}
  .v5 .val:has(>.ico-o)>*:not(.ico-o){grid-column:2}
  .v5 .val:has(>.ico-o) .pill{justify-self:start;margin-top:10px}
  /* DV/OV/EV: gia ben phai, bo dong "Xem san pham" (ca the la lien ket) */
  .v5 .panel>a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:2px;padding:14px 16px}
  .v5 .panel .lv{grid-column:1/-1}
  .v5 .panel h2,.v5 .panel p{grid-column:1}
  .v5 .panel .gia{grid-column:2;grid-row:2/span 2;margin:0;font-size:22px;text-align:right}
  .v5 .panel .gia small{display:block}
  .v5 .panel .lnk{display:none}
  .v5 .other .dong{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;width:100%}
}
/* a11y 25/10: tieu de khung mua (h3 -> h2 cho dung thu tu), chu nut nhanh cua khung chat hCRM du tuong phan */
.v5 .mua h2.mua-tde{font-size:21px;margin-bottom:10px}
.hcrm-widget .hcrm-quick-action-btn{color:#b42318!important}
.v5 .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- QA 25/10 (sua loi sau QA v5test) ---------- */
/* QA-12: dong Gia hang / Tiet kiem an bang [hidden] (.v5 .mua .dong dat display:flex nen phai ep lai) */
.v5 .mua .dong[hidden],.v5 [hidden]{display:none!important}
/* QA-05: khung chat hCRM - trang san pham & gio: bo bong loi chao + nut nhanh (che hop mua / form), giu nut tron;
   khi nut tron de len nut/o nhap dang dung (v5/chat.js) thi tam an */
html.v5-chat-gon .hcrm-quick-actions-bubble,html.v5-chat-gon .hcrm-quick-actions-welcome{display:none!important}
html.v5-tranh-chat .hcrm-widget{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity var(--t) var(--ease),visibility 0s linear var(--t)}
.hcrm-widget{transition:opacity var(--t) var(--ease)}
/* chua cho cuon het noi dung len tren nut chat o cuoi trang (mobile) */
@media (max-width:760px){
  html.v5-chat-gon .v5 .ct,html.v5-chat-gon .v5-gio{padding-bottom:84px}
}
/* QA-21 -> #556 (26/10): nut "Dau trang" = nut tron icon mui ten len, BEN PHAI, giua chieu cao man hinh (anh chot).
   Van an khi de len nut/o nhap (html.v5-tranh-len, v5/chat.js). */
.v5 .scroll-top{top:50%;bottom:auto;right:14px;left:auto;transform:translateY(-50%);-webkit-transform:translateY(-50%);z-index:600}
.v5 .scroll-top a,.v5 .scroll-top a:visited{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;
  background:#fff;border:1.5px solid var(--line);box-shadow:var(--bong-1);font-size:0;line-height:0;color:var(--brand);text-transform:none;writing-mode:horizontal-tb}
.v5 .scroll-top a:before{content:"";position:static;transform:none;left:auto;top:auto;width:20px;height:20px;border:0;font-size:0;font-family:inherit;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}
.v5 .scroll-top a:after{display:none}
.v5 .scroll-top a:hover:before{left:auto}
.v5 .scroll-top a:hover,.v5 .scroll-top a:focus-visible{color:#fff;background:var(--brand);border-color:var(--brand)}
@media (max-width:760px){ .v5 .scroll-top{right:10px}.v5 .scroll-top a,.v5 .scroll-top a:visited{width:40px;height:40px} }
html.v5-tranh-len .v5 .scroll-top{opacity:0!important;visibility:hidden!important;pointer-events:none}
/* hop mua dinh (sticky) cao hon man hinh laptop -> cuon trong hop, khong de nut cuoi nam duoi man hinh */
@media (min-width:1001px){
  .v5 .ct>.mua,.v5 .ct-phai>.mua:only-child{max-height:calc(100vh - 92px);overflow-y:auto;overscroll-behavior:contain}
}
/* QA-17: bang menu "San pham" cao ~850px -> laptop 768px bi cat day, khong cuon duoc */
@media (min-width:1001px){
  .v5 .mc-bang{max-height:calc(100vh - 88px);max-height:calc(100dvh - 88px);overflow-y:auto;overscroll-behavior:contain}
  .v5 .mc::after{content:"";position:absolute;left:0;right:0;top:100%;height:16px}
}
/* QA2-N5 (sua lai): bo content-visibility - cong cu chup ca trang / bot co the khong ve khoi ngoai man hinh (footer, mo ta trong) */