/* PNHC Thành viên và mua lại. Dùng biến màu, font, nút của theme pnhc (son, vàng, kem). Mobile trước, mốc 600 / 860 / 1100px. */
.tv{--tv-pad:clamp(48px,7vw,88px)}
.tv-eyebrow{font:600 12.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d);margin:0 0 10px}
.tv-lead{font-size:clamp(16px,1.3vw,18px);line-height:1.7;color:var(--ink);max-width:34em;margin:0}
.tv-sec{padding:var(--tv-pad) 0 0}
.tv-sec:last-child{padding-bottom:var(--tv-pad)}
.tv-sec-head{margin:0 0 28px;max-width:62em}
.tv-sec-head h2{font-size:clamp(28px,4vw,46px);line-height:1.14;margin:0;text-wrap:balance}
.tv-sec-head-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;max-width:none}
.tv-more{display:inline-flex;align-items:center;gap:4px;min-height:44px;font-weight:600;white-space:nowrap}
.tv-ghi-nho{margin:16px 0 0;font-size:14px;color:var(--muted)}
.tv .crumbs{margin:0 0 18px}

/* Đầu trang */
.tv-hero{background:linear-gradient(100deg,var(--kem-2) 0%,var(--kem) 60%);border-bottom:1px solid var(--line);padding:20px 0 40px}
.tv-hero h1{color:var(--son);font-size:clamp(34px,8.6vw,68px);line-height:1.08;letter-spacing:-.01em;margin:0 0 18px;text-wrap:balance}
.tv-hero-in{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
.tv-facts{list-style:none;margin:28px 0 0;padding:20px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,minmax(0,auto));justify-content:start;gap:12px 36px}
.tv-facts li{display:grid;gap:2px}
.tv-facts b{font:600 clamp(18px,2vw,24px)/1.15 var(--serif);color:var(--gold-d);white-space:nowrap}
.tv-facts span{font-size:13.5px;color:var(--muted);line-height:1.35}
@media (max-width:420px){.tv-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tv-facts b{font-size:17px}}
.tv-hero-gon{padding-bottom:36px}
.tv-hero-gon h1{font-size:clamp(32px,6.4vw,56px)}
@media (min-width:1100px){
.tv-hero{padding:28px 0 64px}
.tv-hero-in{grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr);align-items:center;gap:64px}
.tv-hero h1{font-size:min(4.6vw,68px)}
}

/* Thẻ hạng của khách */
.tv-the{--hm:var(--son);position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 22px 22px;box-shadow:0 18px 50px -24px rgba(90,40,10,.35);overflow:hidden}
.tv-the::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--hm)}
.tv-the-nhan{margin:0 0 4px;font-size:13.5px;color:var(--muted)}
.tv-the-ten{margin:0 0 6px;font:600 clamp(28px,4vw,38px)/1.15 var(--serif);color:var(--hm);color:color-mix(in srgb,var(--hm) 72%,#2b1a14)}
.tv-the-ten-sm{font-size:clamp(24px,3vw,30px);color:var(--ink)}
.tv-the-giam{display:inline-block;margin:0 0 16px;padding:5px 12px;border-radius:99px;background:var(--kem);color:var(--gold-d);font-weight:600;font-size:14px}
.tv-the-so{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:4px 0 16px}
.tv-the-so div{background:var(--kem);border-radius:12px;padding:12px 14px}
.tv-the-so dt{font-size:13px;color:var(--muted);line-height:1.35}
.tv-the-so dd{margin:4px 0 0;font:600 clamp(18px,2.4vw,22px)/1.2 var(--serif);color:var(--ink);white-space:nowrap}
.tv-thanh{height:10px;border-radius:99px;background:var(--kem-2);overflow:hidden}
.tv-thanh i{display:block;height:100%;min-width:10px;border-radius:inherit;background:linear-gradient(90deg,var(--gold),var(--hm))}
.tv-the-ghi{margin:12px 0 0;font-size:14.5px;color:var(--muted)}
.tv-the-link{display:inline-flex;align-items:center;gap:4px;min-height:44px;margin-top:8px;font-weight:600}
.tv-tra label{display:block;margin:14px 0 6px;font-weight:600;font-size:14.5px}
.tv-tra-o{display:flex;gap:8px}
.tv-tra-o input{flex:1;min-width:0;min-height:48px;padding:10px 14px;border:1px solid var(--gold-l);border-radius:var(--r-sm);background:#fff;font-size:16px}
.tv-tra-o input:focus{border-color:var(--son);outline:0;box-shadow:0 0 0 3px rgba(158,31,34,.12)}
.tv-tra-o .btn{min-height:48px}
.tv-tra-kq{margin:10px 0 0;font-size:14.5px;min-height:0}
.tv-tra-kq:empty{display:none}
.tv-tra-kq.is-ok{padding:12px 14px;border-radius:var(--r-sm);background:#f2f8f5;color:var(--ngoc)}
.tv-tra-kq.is-ok strong{display:block;font:600 20px/1.3 var(--serif);color:var(--son);margin-bottom:2px}
.tv-tra-kq.is-no{color:var(--muted)}
.tv-the-hoac{display:flex;align-items:center;gap:12px;margin:18px 0 12px;color:var(--muted);font-size:13px}
.tv-the-hoac::before,.tv-the-hoac::after{content:"";flex:1;height:1px;background:var(--line)}
.tv-the-dn{width:100%}
@media (min-width:600px){.tv-the{padding:30px 30px 26px}}

/* Các hạng */
.tv-hangs{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.tv-hang{--hm:var(--son);position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 20px 20px;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.tv-hang::before{content:"";position:absolute;inset:0 0 auto;height:4px;border-radius:16px 16px 0 0;background:var(--hm)}
.tv-hang:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.tv-hang.is-on{border-color:var(--hm);box-shadow:0 0 0 1px var(--hm),var(--shadow)}
.tv-hang-ban{position:absolute;top:16px;right:16px;padding:3px 10px;border-radius:99px;background:var(--hm);color:#fff;font:600 12px/1.5 var(--sans);white-space:nowrap}
.tv-hang-bac{margin:0 0 4px;font:600 12px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tv-hang-ten{margin:0 0 4px;font-size:clamp(22px,2.2vw,26px);color:var(--hm);color:color-mix(in srgb,var(--hm) 72%,#2b1a14)}
.tv-hang-muc{margin:0 0 16px;color:var(--muted);font-size:14.5px}
.tv-hang-muc strong{color:var(--ink)}
.tv-hang-giam{display:flex;align-items:baseline;gap:8px;margin:0 0 14px;padding:14px 0;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line)}
.tv-hang-giam b{font:600 clamp(40px,4.6vw,54px)/1 var(--serif);color:var(--ink)}
.tv-hang-giam span{color:var(--muted);font-size:14.5px}
.tv-hang-ql{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14.5px}
.tv-hang-ql li{position:relative;padding-left:22px}
.tv-hang-ql li::before{content:"";position:absolute;left:2px;top:.5em;width:10px;height:6px;border-left:2px solid var(--hm);border-bottom:2px solid var(--hm);transform:rotate(-45deg)}
@media (min-width:600px){.tv-hangs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.tv-hangs{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}

/* Gợi ý sản phẩm */
.tv-goi-y ul.products{margin:0}

/* Cách hoạt động */
.tv-buoc{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.tv-buoc li{background:var(--kem-2);border-radius:16px;padding:22px 20px}
.tv-buoc-so{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:14px;border-radius:50%;background:var(--son);color:#fff;font:600 18px/1 var(--serif)}
.tv-buoc h3{font-size:19px;margin:0 0 6px}
.tv-buoc p{margin:0;color:var(--muted);font-size:15px}
@media (min-width:860px){.tv-buoc{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.tv-buoc li{padding:28px 26px}}

/* Câu hỏi */
.tv-hoi-in{display:grid;gap:8px}
.tv-hoi-ghi{margin:14px 0 0;color:var(--muted)}
.tv-hoi-ghi a{text-decoration:underline;text-underline-offset:3px}
.tv-faq details{border-bottom:1px solid var(--line)}
.tv-faq details:first-child{border-top:1px solid var(--line)}
.tv-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:14px 0;font:600 17px/1.4 var(--serif);cursor:pointer;list-style:none}
.tv-faq summary::-webkit-details-marker{display:none}
.tv-faq summary .ic{transition:transform .25s;color:var(--gold-d)}
.tv-faq details[open] summary .ic{transform:rotate(180deg)}
.tv-faq summary:hover{color:var(--son)}
.tv-faq p{margin:0 0 18px;color:var(--ink);max-width:44em}
@media (min-width:1100px){.tv-hoi-in{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}}

/* Giỏ hàng */
.tv-hangs-chan{margin:18px 0 0;font-size:14.5px;color:var(--muted)}
.tv-hangs-chan a{font-weight:600}
.tv-gio{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:12px 14px;border-radius:var(--r-sm);background:var(--kem);border:1px solid var(--gold-l);color:var(--ink);font-size:14.5px;line-height:1.5}
.tv-gio .ic{color:var(--gold-d);margin-top:1px}
.tv-gio a{font-weight:600;white-space:nowrap}
.tv-gio.is-du{background:#f2f8f5;border-color:#cfe0d9}
.tv-gio.is-du .ic{color:var(--ngoc)}

/* Mua lại */
.tv-ml-wrap{padding-top:32px;padding-bottom:var(--tv-pad)}
.tv-ml-dau{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin:0 0 12px}
.tv-ml-tom{margin:0}
.tv-ml-han{color:var(--son);font-weight:600}
.tv-ml-tat{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;cursor:pointer}
.tv input[type=checkbox]{width:20px;height:20px;accent-color:var(--son);margin:0}
.tv-ml-ds{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.tv-ml-mon{display:grid;grid-template-columns:28px 72px minmax(0,1fr);gap:4px 12px;align-items:start;padding:16px 14px;border-top:1px solid var(--line)}
.tv-ml-mon:first-child{border-top:0}
.tv-ml-chon{display:flex;align-items:center;justify-content:center;min-height:72px}
.tv-ml-anh{display:block;width:72px;height:72px;border-radius:10px;overflow:hidden;background:var(--kem-2)}
.tv-ml-anh img{width:100%;height:100%;object-fit:cover}
.tv-ml-thong{min-width:0}
.tv-ml-ten{margin:0 0 2px;font-weight:600;line-height:1.4}
.tv-ml-ten a{color:var(--ink)}
.tv-ml-ten a:hover{color:var(--son)}
.tv-ml-phu{margin:0;font-size:13.5px;color:var(--muted)}
.tv-ml-tt{display:inline-block;margin:6px 0 0;padding:2px 10px;border-radius:99px;background:var(--kem);color:var(--muted);font-size:13px;font-weight:600}
.tv-ml-tt.is-han{background:var(--son);color:#fff}
.tv-ml-tt.is-sap{background:#fbeccc;color:var(--gold-d)}
.tv-ml-tt.is-het{background:#f1ece6;color:var(--muted)}
.tv-ml-mua{grid-column:2/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-top:8px}
.tv-ml-gia{margin:0;font-weight:600;color:var(--son)}
.tv-ml-gia del{color:var(--muted);font-weight:400;font-size:13.5px;margin-right:4px}
.tv-ml-gia ins{text-decoration:none}
.tv-ml-thay{margin:0;flex:1 1 220px;font-size:14px;color:var(--muted)}
.tv-ml-thay a{font-weight:600}
.tv-ml-mon.is-het .tv-ml-anh{opacity:.55}
.tv-ml-chot{position:sticky;bottom:calc(66px + env(safe-area-inset-bottom));z-index:46;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:8px 16px;margin-top:16px;padding:12px 14px;background:rgba(251,246,236,.97);border:1px solid var(--line);border-radius:14px;box-shadow:0 -8px 24px -16px rgba(60,30,10,.3)}
.tv-ml-chot p{margin:0;font-weight:600;white-space:nowrap}
.tv-ml-chot .btn{flex:0 0 auto}
.tv-ml-chot .btn[disabled]{opacity:.45;cursor:not-allowed}
@media (min-width:600px){
.tv-ml-mon{grid-template-columns:28px 88px minmax(0,1fr) auto;align-items:center;padding:16px 20px;gap:4px 16px}
.tv-ml-anh{width:88px;height:88px}
.tv-ml-chon{min-height:88px}
.tv-ml-mua{grid-column:auto;flex-direction:column;align-items:flex-end;justify-content:center;margin:0;text-align:right;max-width:300px}
.tv-ml-thay{flex:none;text-align:right}
.tv-ml-chot .btn{flex:0 0 auto}
}
.tv-don{margin-top:48px}
.tv-don h2{font-size:clamp(24px,3vw,32px);margin:0 0 16px}
.tv-don-ds{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tv-don-ds form{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px}
.tv-don-thong{flex:1 1 260px;min-width:0}
.tv-don-ma{margin:0 0 4px;font-weight:600}
.tv-don-ma span{font-weight:400;color:var(--muted);font-size:14px}
.tv-don-mon{margin:0;font-size:14px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tv-trong{max-width:640px;padding:28px 24px;background:#fff;border:1px solid var(--line);border-radius:16px}
.tv-trong p{margin:0 0 12px}
.tv-dn-nut{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.tv-sec-sat{padding-top:48px}
.tv-sec-sat h2{font-size:clamp(24px,3vw,32px)}
@media (min-width:1100px){.tv-ml-chot,.tv-tk .tv-ml-chot{bottom:12px}}