/* Holy Wine – giao diện tối giản: đỏ #590907, vàng champagne #E8D285, xám olive #A5A79B */
:root{--wine:#590907;--wine-d:#3d0504;--gold:#E8D285;--gold-d:#b3953c;--sage:#A5A79B;--ink:#1c1414;--muted:#6f6a63;--line:#e4dfd4;--paper:#faf8f3;--tone:#f2ede3;--card:#fff;--ok:#2f7d4a;--r:2px;--sh:none;--ease:cubic-bezier(.2,.7,.2,1);--serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6;font-size:15.5px;font-weight:400}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0 0 .45em;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(2.3rem,4.6vw,3.9rem)}h2{font-size:clamp(1.8rem,3vw,2.6rem)}h3{font-size:1.35rem}
p{margin:0 0 1em}
a{color:var(--wine);text-decoration:none;transition:color .25s}a:hover{color:var(--wine-d)}
img{max-width:100%;height:auto;display:block}
.hero .art figure,.card,.tile,.tier,.tier .mini>*,.pdp>*,.post,.why>div,.steps>div,.timeline>div,.promise>div{min-width:0}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.sec{padding:72px 0}.sec.alt{background:var(--card)}.sec:not(.alt)+.sec:not(.alt){padding-top:0}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:36px;padding-bottom:18px;border-bottom:1px solid var(--line)}.sec-h p{margin:4px 0 0;color:var(--muted);max-width:520px}
.sec-h>a{font-size:12px;text-transform:uppercase;letter-spacing:.18em;font-weight:600;white-space:nowrap;padding-bottom:4px;border-bottom:1px solid currentColor}
.eyebrow,.kicker{display:inline-block;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:600;color:var(--wine);margin-bottom:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border-radius:var(--r);font-weight:600;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--wine);background:var(--wine);color:#fff;cursor:pointer;line-height:1;transition:background .3s var(--ease),color .3s,border-color .3s,transform .3s var(--ease)}
.btn:hover{background:var(--wine-d);border-color:var(--wine-d);color:#fff;transform:translateY(-1px)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--wine-d)}.btn.gold:hover{background:#f1e2a5;border-color:#f1e2a5;color:var(--wine-d)}
.btn.ghost{background:transparent;color:var(--wine)}.btn.ghost:hover{background:var(--wine);color:#fff}
.btn.sm{padding:11px 18px;font-size:11.5px}.btn.w{width:100%}
.chip{display:inline-block;padding:4px 10px;border:1px solid var(--line);border-radius:var(--r);color:var(--muted);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}
/* thanh trên + header */
.top{background:var(--wine-d);color:var(--gold);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}.top .wrap{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:12px}.top a{color:var(--gold)}.top b{font-weight:600}
.hd{background:var(--paper);border-bottom:1px solid transparent;position:sticky;top:0;z-index:50;transition:border-color .3s,background .3s}.hd.scrolled{border-bottom-color:var(--line);background:rgba(250,248,243,.94);backdrop-filter:saturate(1.2) blur(8px)}
.hd .wrap{display:flex;align-items:center;gap:26px;min-height:78px}
.logo{font-family:var(--serif);font-weight:600;font-size:1.75rem;color:var(--wine);letter-spacing:.02em;white-space:nowrap;line-height:1}.logo b{font-weight:600;color:var(--wine);font-style:italic}
.logo small{display:block;font-family:var(--sans);font-size:9.5px;letter-spacing:.26em;color:var(--sage);font-weight:600;text-transform:uppercase;margin-top:5px}
nav.main{display:flex;gap:2px;flex:1;align-items:center}nav.main>a,nav.main>details>summary{position:relative;padding:10px 12px;font-size:13px;letter-spacing:.06em;font-weight:500;color:var(--ink);white-space:nowrap;list-style:none;cursor:pointer}
nav.main>a::after,nav.main>details>summary::after{content:"";position:absolute;left:12px;right:12px;bottom:5px;height:1px;background:var(--wine);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
nav.main>a:hover::after,nav.main>details[open]>summary::after{transform:scaleX(1)}nav.main>a:hover{color:var(--wine)}
nav.main>a.b2b{color:var(--wine);font-weight:600}nav.main>a.b2b::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold-d);margin-right:8px;vertical-align:middle}
nav.main details{position:relative}nav.main details summary::-webkit-details-marker{display:none}
nav.main details>div{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);padding:12px;min-width:240px;display:grid;gap:2px;z-index:60;animation:drop .25s var(--ease)}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
nav.main details>div a{padding:8px 10px;color:var(--ink);font-size:14px}nav.main details>div a:hover{background:var(--tone);color:var(--wine)}
.hd-tools{display:flex;gap:14px;align-items:center;margin-left:auto}.icbtn{position:relative;display:inline-flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--line);background:transparent;color:var(--ink);font-weight:500;font-size:13px;letter-spacing:.06em;cursor:pointer;border-radius:var(--r);transition:border-color .3s}.icbtn:hover{border-color:var(--wine);color:var(--wine)}
.icbtn .n{position:absolute;top:-7px;right:-7px;background:var(--wine);color:var(--gold);border-radius:999px;font-size:10px;min-width:18px;height:18px;display:none;align-items:center;justify-content:center;padding:0 5px}.icbtn .n.on{display:inline-flex}
#menuBtn{display:none}
.search{position:relative}.search input{padding:9px 0;border:0;border-bottom:1px solid var(--line);background:transparent;width:180px;font:inherit;font-size:13.5px;outline:0;transition:border-color .3s}.search input:focus{border-bottom-color:var(--wine)}
.search .res{position:absolute;top:100%;right:0;width:380px;max-width:90vw;background:#fff;border:1px solid var(--line);display:none;max-height:60vh;overflow:auto;z-index:70}.search .res.on{display:block}
.search .res a{display:flex;gap:10px;padding:8px 12px;align-items:center;color:var(--ink)}.search .res a:hover{background:var(--tone)}.search .res img{width:36px;height:48px;object-fit:contain}
/* menu mobile */
.mnav{display:none;position:fixed;inset:0;background:rgba(61,5,4,.6);z-index:90}.mnav.on{display:block}.mnav .pane{background:var(--paper);width:min(86vw,340px);height:100%;overflow:auto;padding:20px;animation:slide .3s var(--ease)}
@keyframes slide{from{transform:translateX(-30px);opacity:0}to{transform:none;opacity:1}}
.mnav .pane a{display:block;padding:12px 6px;border-bottom:1px solid var(--line);font-weight:500;color:var(--ink);font-size:15px}.mnav .pane a.sub{padding-left:22px;font-weight:400;color:var(--muted);font-size:14px}.mnav .pane a.b2b{background:var(--wine);color:var(--gold);border:0;margin-bottom:10px;padding:14px 12px;letter-spacing:.08em;text-transform:uppercase;font-size:12.5px}
/* hero */
.hero{background:var(--paper);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;left:50%;right:0;top:0;bottom:0;background:var(--wine)}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;min-height:560px;padding-top:56px;padding-bottom:56px;position:relative}
.hero h1{color:var(--wine);font-size:clamp(2.6rem,5.4vw,4.8rem);max-width:12ch}.hero .lead{font-size:1.08rem;color:var(--muted);max-width:480px;font-weight:300}
.hero .cta{display:flex;gap:22px;flex-wrap:wrap;align-items:center;margin-top:28px}.hero .cta .ghost{border:0;padding:0;letter-spacing:.16em;color:var(--wine);position:relative}.hero .cta .ghost::after{content:"→";margin-left:4px;transition:transform .3s var(--ease);display:inline-block}.hero .cta .ghost:hover{background:transparent;color:var(--wine-d);transform:none}.hero .cta .ghost:hover::after{transform:translateX(6px)}
.hero .art{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:end;padding-left:24px}.hero .art figure{margin:0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}.hero .art figcaption{margin-top:12px}
.hero .art a{display:block;overflow:hidden;background:var(--tone)}.hero .art img{aspect-ratio:3/4;object-fit:cover;width:100%;transition:transform 1.2s var(--ease)}.hero .art a:hover img{transform:scale(1.05)}
.hero .art figure:nth-child(2){transform:translateY(-28px)}
/* dải chữ chạy */
.marq{background:var(--wine);color:var(--gold);overflow:hidden;white-space:nowrap;border-top:1px solid rgba(232,210,133,.25);border-bottom:1px solid rgba(232,210,133,.25)}
.marq .in{display:inline-flex;gap:0;animation:marq 38s linear infinite;will-change:transform}.marq:hover .in{animation-play-state:paused}
.marq span{display:inline-flex;align-items:center;gap:24px;padding:14px 24px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:500}.marq span::after{content:"◆";font-size:7px;color:var(--sage)}
@keyframes marq{to{transform:translateX(-50%)}}
.promise{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);margin-top:0}.promise div{padding:20px 22px;font-size:13.5px;color:var(--muted);border-right:1px solid var(--line)}.promise div:last-child{border-right:0}.promise b{display:block;color:var(--ink);margin-bottom:2px;font-family:var(--serif);font-size:1.15rem;font-weight:600}
/* lưới */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.tile{display:block;background:var(--card);padding:30px 26px;color:var(--ink);transition:background .4s var(--ease);position:relative;overflow:hidden;min-height:170px}
.tile::after{content:"→";position:absolute;right:22px;bottom:18px;color:var(--wine);opacity:0;transform:translateX(-8px);transition:.35s var(--ease)}.tile:hover{background:var(--tone)}.tile:hover::after{opacity:1;transform:none}
.tile b{display:block;font-family:var(--serif);font-size:1.5rem;font-weight:500;color:var(--ink);margin-bottom:6px}.tile span{color:var(--muted);font-size:14px}.tile .big{font-size:1.1rem;color:var(--wine);font-weight:600;letter-spacing:.02em;margin-bottom:8px}
.tile.t1,.tile.t2,.tile.t3,.tile.t4{border-top:0}.tile.t1 b::before,.tile.t2 b::before,.tile.t3 b::before,.tile.t4 b::before{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.24em;color:var(--sage);margin-bottom:10px;font-weight:600}
.tile.t1 b::before{content:"BẬC 01"}.tile.t2 b::before{content:"BẬC 02"}.tile.t3 b::before{content:"BẬC 03"}.tile.t4 b::before{content:"BẬC 04"}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 22px}.grid.c3{grid-template-columns:repeat(3,1fr)}
.card{background:transparent;border:0;display:flex;flex-direction:column;position:relative}
.card .ph{background:var(--tone);aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}.card:hover .ph img{transform:scale(1.06)}
.card .ph .tag{position:absolute;top:12px;left:12px;background:var(--wine);color:var(--gold);font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:5px 9px;font-weight:600}.card .ph .tag.box{left:auto;right:12px;background:var(--gold);color:var(--wine-d)}
.card .bd{padding:14px 0 0;display:flex;flex-direction:column;gap:3px;flex:1}.card .nm{font-family:var(--serif);font-weight:600;font-size:1.15rem;line-height:1.25;color:var(--ink)}.card .mt{font-size:12px;color:var(--sage);letter-spacing:.06em;text-transform:uppercase}
.card .pr{font-weight:600;color:var(--wine);font-size:1rem;margin-top:8px}.card .pr s{color:var(--muted);font-weight:400;font-size:.9em;margin-right:6px}.card .est{font-size:11px;color:var(--muted)}
.card .act{display:flex;gap:8px;margin-top:12px;opacity:.85;transition:opacity .3s}.card:hover .act{opacity:1}.card .act .btn{flex:1;padding:11px 10px;font-size:11px;letter-spacing:.12em}
.card.sold .ph{opacity:.45}.card.sold .pr{color:var(--muted)}
/* khối B2B trang chủ */
.b2b-band{background:var(--wine);color:#f3e8e5;padding:56px;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;position:relative;overflow:hidden}.b2b-band::before{content:"";position:absolute;inset:14px;border:1px solid rgba(232,210,133,.35);pointer-events:none}
.b2b-band h2{color:var(--gold)}.b2b-band ul{margin:0 0 22px;padding-left:0;list-style:none}.b2b-band li{margin:8px 0;padding-left:20px;position:relative}.b2b-band li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:1px;background:var(--gold)}
.b2b-band .btn.ghost{color:var(--gold)!important;border-color:rgba(232,210,133,.6)!important}.b2b-band .btn.ghost:hover{background:var(--gold);color:var(--wine-d)!important}
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.why div{padding:28px 24px;background:var(--card)}.why b{display:block;margin-bottom:8px;font-family:var(--serif);font-size:1.3rem;font-weight:600;color:var(--ink)}.why p{margin:0;font-size:14px;color:var(--muted)}
/* breadcrumb & trang */
.bc{font-size:11.5px;color:var(--sage);padding:18px 0 0;letter-spacing:.1em;text-transform:uppercase}.bc a{color:var(--sage)}.bc a:hover{color:var(--wine)}.bc span{margin:0 8px}
.page-h{padding:22px 0 16px}.page-h p{color:var(--muted);max-width:720px;margin:8px 0 0;font-size:1.02rem}
.prose{max-width:760px;font-size:16px}.prose h2{margin-top:1.8em}.prose table{border-collapse:collapse;width:100%;margin:16px 0;font-size:15px}.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}.prose th{font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.prose li{margin:5px 0}
/* bộ lọc */
.layout{display:grid;grid-template-columns:230px 1fr;gap:40px;align-items:start}
.filters{padding:0 20px 0 0;border-right:1px solid var(--line);position:sticky;top:94px}.filters h4{margin:18px 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.2em;color:var(--sage)}.filters h4:first-child{margin-top:0}.filters label{display:flex;gap:8px;align-items:center;font-size:14px;padding:4px 0;cursor:pointer;color:var(--ink)}.filters input{accent-color:var(--wine)}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:22px;font-size:13px;color:var(--muted);letter-spacing:.04em}.toolbar select{font:inherit;padding:8px 10px;border:1px solid var(--line);background:#fff;border-radius:var(--r)}
.empty{padding:40px;text-align:center;color:var(--muted);border:1px dashed var(--line)}
/* trang sản phẩm */
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}.pdp .gal{background:var(--tone);padding:0;position:sticky;top:94px;overflow:hidden}.pdp .gal img{aspect-ratio:3/4;object-fit:cover;width:100%}
.pdp .price{font-size:1.9rem;font-weight:500;color:var(--wine);font-family:var(--serif)}.pdp .price s{font-size:1rem;color:var(--muted);font-weight:400;margin-right:8px;font-family:var(--sans)}
.spec{width:100%;border-collapse:collapse;font-size:14px;margin:18px 0}.spec td{padding:9px 0;border-bottom:1px solid var(--line)}.spec td:first-child{color:var(--sage);width:40%;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.opt{margin:18px 0}.opt label{display:flex;gap:10px;align-items:center;padding:12px 14px;border:1px solid var(--line);margin-bottom:-1px;cursor:pointer;background:#fff;transition:border-color .25s}.opt label:has(input:checked){border-color:var(--wine);position:relative;z-index:1;background:#fff}.opt input{accent-color:var(--wine)}.opt .p{margin-left:auto;font-weight:600;color:var(--wine)}
.qty{display:inline-flex;border:1px solid var(--line);overflow:hidden}.qty button{width:42px;border:0;background:#fff;font-size:18px;cursor:pointer;color:var(--ink)}.qty button:hover{background:var(--tone)}.qty input{width:52px;border:0;text-align:center;font:inherit}
.buy{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:18px 0}.trust{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:13px;color:var(--muted);margin-top:16px}.trust div::before{content:"— ";color:var(--gold-d);font-weight:700}
.note{background:#fff;border:1px solid var(--line);border-left:3px solid var(--gold);padding:12px 14px;font-size:14px}
/* trang B2B */
.b2b-hero{background:var(--wine);color:#f3e8e5;position:relative;overflow:hidden}.b2b-hero::after{content:"";position:absolute;inset:16px;border:1px solid rgba(232,210,133,.3);pointer-events:none}.b2b-hero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center;padding:72px 24px}.b2b-hero h1{color:#fff}.b2b-hero .kicker{color:var(--gold)}.b2b-hero .lead{font-size:1.08rem;opacity:.9;font-weight:300;max-width:560px}
.b2b-hero .box{border:1px solid rgba(232,210,133,.5);padding:26px;font-size:14px;position:relative;z-index:1}.b2b-hero .box b{color:var(--gold)}.b2b-hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.6)}.b2b-hero .btn.ghost:hover{background:#fff;color:var(--wine)}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.tier{background:var(--card);padding:26px 22px;display:flex;flex-direction:column}.tier .nm{font-family:var(--serif);font-size:1.6rem;font-weight:500;color:var(--ink)}.tier .rg{font-size:.95rem;font-weight:600;color:var(--wine);letter-spacing:.04em}.tier .who{font-size:13px;color:var(--muted);margin:8px 0 14px}
.tier .mini{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:14px}.tier .mini img{aspect-ratio:3/4;object-fit:cover;background:var(--tone);width:100%}.tier ul{margin:0 0 16px;padding-left:0;list-style:none;font-size:13px;color:var(--muted)}.tier li{padding:4px 0;border-bottom:1px solid var(--line)}.tier .btn{margin-top:auto}
table.tb{width:100%;border-collapse:collapse;background:#fff;font-size:15px}table.tb th,table.tb td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left}table.tb th{background:transparent;font-weight:600;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--sage)}table.tb tr:last-child td{border-bottom:0}table.tb .hl{color:var(--wine);font-weight:600}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;counter-reset:s;background:var(--line);border:1px solid var(--line)}.steps div{background:#fff;padding:24px 20px;font-size:14px;position:relative;color:var(--muted)}.steps div::before{counter-increment:s;content:"0" counter(s);display:block;font-family:var(--serif);font-size:2rem;color:var(--gold-d);line-height:1;margin-bottom:12px}.steps b{display:block;margin-bottom:6px;color:var(--ink);font-family:var(--serif);font-size:1.2rem;font-weight:600}
.form{background:#fff;border:1px solid var(--line);padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:18px}.form .full{grid-column:1/-1}.form label{display:block;font-size:11px;font-weight:600;margin-bottom:6px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.form input,.form select,.form textarea{width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--line);font:inherit;font-size:15px;background:transparent;outline:0;transition:border-color .3s;border-radius:0}.form input:focus,.form select:focus,.form textarea:focus{border-bottom-color:var(--wine)}.form textarea{min-height:90px}.form .hp{display:none}
.faq details{background:transparent;border-bottom:1px solid var(--line);padding:16px 0}.faq summary{font-weight:500;cursor:pointer;font-family:var(--serif);font-size:1.2rem;list-style:none;display:flex;justify-content:space-between;gap:16px}.faq summary::after{content:"+";color:var(--wine);font-size:1.3rem;transition:transform .3s}.faq details[open] summary::after{transform:rotate(45deg)}.faq p{margin:10px 0 0;color:var(--muted);font-size:15px;max-width:720px}
.timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.timeline div{background:#fff;padding:20px 18px;font-size:13.5px;color:var(--muted)}.timeline b{display:block;color:var(--wine);font-family:var(--serif);font-size:1.5rem;font-weight:500;margin-bottom:6px}.timeline .tet{background:var(--wine);color:#f3e8e5}.timeline .tet b{color:var(--gold)}
/* giỏ hàng */
.cart-t{width:100%;border-collapse:collapse;background:#fff}.cart-t td,.cart-t th{padding:12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px;vertical-align:middle}.cart-t th{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);font-weight:600}.cart-t img{width:46px;height:60px;object-fit:cover}.cart-t .rm{color:var(--wine);cursor:pointer;background:none;border:0;font-size:18px}
.sum{background:#fff;border:1px solid var(--line);padding:24px}.sum .row{display:flex;justify-content:space-between;padding:7px 0;font-size:15px}.sum .row.tot{font-weight:600;font-size:1.3rem;border-top:1px solid var(--line);margin-top:8px;padding-top:12px;color:var(--wine);font-family:var(--serif)}
.ok-box{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gold);padding:28px}
/* bài viết */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.post{background:#fff;padding:28px 24px;display:flex;flex-direction:column;gap:8px;color:var(--ink);transition:background .4s var(--ease)}.post:hover{background:var(--tone)}.post b{font-family:var(--serif);font-size:1.4rem;font-weight:500;line-height:1.2;color:var(--ink)}.post span{font-size:14px;color:var(--muted)}
/* footer */
footer{background:var(--wine-d);color:#cdbfbb;margin-top:72px;font-size:14px}footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding:56px 24px 40px}footer h4{color:var(--gold);margin:0 0 14px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:600}footer a{color:#cdbfbb;display:block;padding:4px 0}footer a:hover{color:var(--gold)}footer .legal{border-top:1px solid rgba(232,210,133,.2);padding:16px 24px;font-size:12px;color:var(--sage);text-align:center;letter-spacing:.04em}
.warn{background:#2a0403;color:var(--sage);font-size:12px;text-align:center;padding:10px 16px;letter-spacing:.03em}
/* cổng 18+ */
.gate{position:fixed;inset:0;background:rgba(61,5,4,.94);z-index:200;display:none;align-items:center;justify-content:center;padding:16px}.gate.on{display:flex}.gate .bx{background:var(--paper);color:var(--ink);max-width:460px;padding:44px 36px;text-align:center;border:1px solid var(--gold);animation:drop .5s var(--ease)}.gate .bx h2{color:var(--wine)}.gate .bx .logo{display:block;margin-bottom:12px}.gate .row{display:flex;gap:10px;justify-content:center;margin-top:20px;flex-wrap:wrap}
/* thanh dưới mobile + nút nổi */
.mbar{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--paper);border-top:1px solid var(--line);z-index:80;grid-template-columns:repeat(5,1fr)}.mbar a{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px;padding:12px 4px;font-size:11px;color:var(--ink);font-weight:500;letter-spacing:.04em}.mbar a.b2b{background:var(--wine);color:var(--gold)}.mbar svg{width:20px;height:20px}
.float{position:fixed;right:20px;bottom:96px;z-index:70;display:flex;flex-direction:column;gap:8px}.float a{width:48px;height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:11px;letter-spacing:.04em;transition:transform .3s var(--ease)}.float a:hover{transform:translateY(-3px)}.float .z{background:#0068ff}.float .m{background:var(--wine);color:var(--gold)}
.toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:var(--wine-d);color:var(--gold);padding:12px 20px;font-size:13px;letter-spacing:.06em;opacity:0;pointer-events:none;transition:.3s;z-index:120}.toast.on{opacity:1}
/* hiệu ứng hiện dần khi cuộn */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.marq .in{animation:none}html{scroll-behavior:auto}}
@media(max-width:1180px){.search input{width:130px}.hd .wrap{gap:14px}nav.main>a,nav.main>details>summary{padding:10px 8px;font-size:12.5px}}
@media(max-width:980px){.tiles,.grid,.why,.promise,.tiers,.steps,.timeline{grid-template-columns:repeat(2,1fr)}.hero .wrap,.b2b-hero .wrap,.pdp,.b2b-band,.layout{grid-template-columns:1fr}.hero::before{display:none}.hero .art{padding:28px 16px 24px;margin:0 -24px;background:var(--wine)}.hero .wrap{min-height:0;gap:40px}.hero .art figure:nth-child(2){transform:none}.posts,.grid.c3{grid-template-columns:repeat(2,1fr)}footer .wrap{grid-template-columns:1fr 1fr}.filters{position:static;border-right:0;padding:0;border-bottom:1px solid var(--line);margin-bottom:10px}nav.main{display:none}#menuBtn{display:inline-flex}.search input{width:140px}.pdp .gal{position:static}.b2b-band{padding:36px 28px}.sec{padding:56px 0}}
@media(max-width:620px){body{padding-bottom:64px}.wrap{padding:0 16px}.tiles,.why,.promise,.steps,.posts,.grid.c3,.form,.timeline,.tiers{grid-template-columns:1fr}.form{padding:24px 18px}.form .full{grid-column:auto}.hero .art{grid-template-columns:repeat(3,1fr);gap:8px}.hero .wrap{padding-top:36px;padding-bottom:36px}.hero h1{font-size:2.4rem}.mbar{display:grid}.float{bottom:76px}.top{display:none}.search{display:none}.grid{grid-template-columns:repeat(2,1fr);gap:20px 12px}.card .nm{font-size:1rem}.trust{grid-template-columns:1fr}.sec{padding:44px 0}.sec-h{flex-direction:column;align-items:flex-start;gap:8px}.b2b-hero .wrap{padding:48px 16px}.b2b-band{padding:28px 20px}.hd .wrap{min-height:64px}.logo{font-size:1.5rem}.logo small{display:none}.hero .art{margin:0 -16px}}
/* ===== Bố cục kiểu landing: hero toàn màn hình, chuyển động theo chuột, thiết kế suất quà ===== */
.vf{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 70% 20%,#7a1410 0%,var(--wine) 45%,var(--wine-d) 100%);color:#f6ece4}
.vf::before{display:none}
.vf .glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(520px circle at var(--gx,50%) var(--gy,40%),rgba(232,210,133,.22),rgba(232,210,133,0) 60%);transition:opacity .4s;z-index:0}
.vf .specks{position:absolute;inset:0;pointer-events:none;z-index:0}.vf .specks i{position:absolute;width:3px;height:3px;border-radius:50%;background:var(--gold);opacity:0;animation:speck 8s ease-in-out infinite}
@keyframes speck{0%{transform:translateY(20px) scale(.6);opacity:0}30%{opacity:.9}70%{opacity:.5}100%{transform:translateY(-120px) scale(1.1);opacity:0}}
.hero.vf .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;min-height:min(calc(100vh - 112px),820px);padding-top:48px;padding-bottom:72px}
.hero.vf h1{color:#fff;font-size:clamp(2.6rem,5.6vw,5rem);max-width:none;line-height:1.02}.hero.vf h1 em{font-style:italic;color:var(--gold);display:block;font-size:.62em;margin-top:.15em;font-weight:500}
.hero.vf .kicker{color:var(--gold)}.hero.vf .lead{color:rgba(246,236,228,.8);max-width:520px}
.hero.vf .cta .ghost{color:#fff;border:1px solid rgba(255,255,255,.45);padding:15px 28px}.hero.vf .cta .ghost::after{content:none}.hero.vf .cta .ghost:hover{background:#fff;color:var(--wine);transform:translateY(-1px)}
.hero-stats{display:flex;gap:0;margin-top:40px;border-top:1px solid rgba(232,210,133,.3);padding-top:22px;flex-wrap:wrap}.hero-stats div{flex:1;min-width:110px;padding-right:16px}.hero-stats b{display:block;font-family:var(--serif);font-size:2.4rem;line-height:1;color:var(--gold);font-weight:500}.hero-stats span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,236,228,.65)}
.hero-art{position:relative;height:min(68vh,620px);min-height:420px}.hero-art figure{position:absolute;margin:0;will-change:transform;transition:transform .2s linear}
.hero-art figure a{display:block;background:linear-gradient(180deg,#fbf8f2,#ebe4d6);overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.35)}.hero-art figure img{width:100%;aspect-ratio:3/4;object-fit:cover;animation:floatY 6s ease-in-out infinite}
.hero-art .main{width:46%;left:27%;top:4%;z-index:3}.hero-art .side{width:32%;top:28%;z-index:2;opacity:.92}.hero-art .side.a{left:0}.hero-art .side.b{right:0}.hero-art .side.a img{animation-delay:-2s}.hero-art .side.b img{animation-delay:-4s}
.hero-art figcaption{margin-top:10px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);text-align:center}
.hero-art .ring{position:absolute;left:50%;top:50%;width:min(120%,640px);aspect-ratio:1;border:1px solid rgba(232,210,133,.28);border-radius:50%;margin:-50% 0 0 -50%;translate:0 -10%;z-index:1;animation:spin 60s linear infinite}.hero-art .ring::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--gold);top:-4px;left:50%;box-shadow:0 0 16px var(--gold)}
.hero-art .ring.r2{width:min(90%,480px);margin-left:-45%;margin-top:-45%;animation-direction:reverse;animation-duration:45s;border-color:rgba(232,210,133,.18)}
@keyframes spin{to{rotate:360deg}}@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.scroll-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:2;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(246,236,228,.6);display:flex;align-items:center;gap:10px}.scroll-hint span{width:22px;height:34px;border:1px solid rgba(246,236,228,.4);border-radius:12px;position:relative}.scroll-hint span::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--gold);animation:wheel 1.8s ease-in-out infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(12px)}}
.tilt{transform-style:preserve-3d;transition:transform .35s var(--ease);will-change:transform;position:relative}.tilt::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(240px circle at var(--sx,50%) var(--sy,50%),rgba(255,255,255,.28),transparent 70%);opacity:0;transition:opacity .3s}.tilt:hover::after{opacity:1}
/* thiết kế suất quà */
.cfg-sec{background:#fff}.cfg{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;border:1px solid var(--line);padding:32px}
.cfg-stage{position:relative;background:var(--tone);aspect-ratio:1/1;max-height:560px;display:flex;align-items:center;justify-content:center;overflow:hidden}.cfg-bg{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 60%,rgba(89,9,7,.12),transparent 70%)}
.cfg-stage img{width:68%;aspect-ratio:3/4;object-fit:cover;position:relative;z-index:1;box-shadow:0 30px 50px rgba(60,20,10,.25);animation:floatY 6s ease-in-out infinite}.cfg-stage img.sw{animation:swap .6s var(--ease),floatY 6s ease-in-out .6s infinite}
@keyframes swap{from{opacity:0;transform:translateX(40px) scale(.96)}to{opacity:1;transform:none}}
.cfg-tag{position:absolute;top:16px;left:16px;z-index:2;background:var(--wine);color:var(--gold);font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:6px 10px;font-weight:600}
.cfg-dots{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:2}.cfg-dots button{width:8px;height:8px;border-radius:50%;border:1px solid var(--wine);background:transparent;padding:0;cursor:pointer;transition:.25s}.cfg-dots button.on{background:var(--wine);transform:scale(1.3)}
.cfg-row{margin-bottom:20px}.cfg-row>label{display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--sage);font-weight:600;margin-bottom:10px}
.seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.seg button{border:1px solid var(--line);background:#fff;padding:12px 12px;text-align:left;cursor:pointer;font:inherit;transition:.25s var(--ease);border-radius:var(--r)}.seg button b{display:block;font-size:14px;font-weight:600;color:var(--ink)}.seg button small{display:block;font-size:12px;color:var(--muted);margin-top:2px}.seg button:hover{border-color:var(--wine)}.seg button.on{border-color:var(--wine);background:var(--wine);box-shadow:0 8px 20px rgba(89,9,7,.18)}.seg button.on b{color:#fff}.seg button.on small{color:var(--gold)}
.cfg-out{border-top:1px solid var(--line);padding-top:18px;margin-top:4px}.cfg-name{font-family:var(--serif);font-size:1.7rem;font-weight:500;line-height:1.15}.cfg-meta{font-size:13px;color:var(--muted);margin:4px 0 10px}.cfg-price span{font-family:var(--serif);font-size:2.2rem;color:var(--wine);font-weight:500;margin-right:10px}.cfg-price small{font-size:12px;color:var(--sage);letter-spacing:.06em}
.cfg-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.cfg-nav{display:flex;align-items:center;gap:14px;margin-top:18px;font-size:12px;letter-spacing:.14em;color:var(--muted)}.cfg-nav button{width:40px;height:40px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:16px;color:var(--wine);transition:.25s}.cfg-nav button:hover{background:var(--wine);color:#fff;border-color:var(--wine)}
/* thẻ sản phẩm: nút nhanh */
.card .act .btn.ghost{flex:0 0 auto;padding:11px 14px}.card .act .btn:not(.ghost){background:var(--wine)}.card .act{opacity:1}
@media(hover:hover){.card .act{opacity:0;transform:translateY(6px);transition:.3s var(--ease)}.card:hover .act{opacity:1;transform:none}}
/* thanh CTA bám đáy */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:75;background:rgba(61,5,4,.96);backdrop-filter:blur(8px);color:#f6ece4;transform:translateY(100%);transition:transform .45s var(--ease);border-top:1px solid rgba(232,210,133,.3)}.sticky-cta.on{transform:none}.sticky-cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:62px;font-size:13.5px}.sticky-cta b{color:var(--gold)}.sc-act{display:flex;gap:8px}.sticky-cta .btn.ghost{color:#fff;border-color:rgba(255,255,255,.5)}
body:has(.sticky-cta.on) .float{bottom:84px}
/* thanh mua trang sản phẩm (mobile) */
.buybar{display:none;position:fixed;left:0;right:0;bottom:64px;z-index:79;background:#fff;border-top:1px solid var(--line);padding:10px 16px;align-items:center;justify-content:space-between;gap:12px;transform:translateY(130%);transition:transform .35s var(--ease)}.buybar.on{transform:none}.buybar small{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}.buybar b{color:var(--wine);font-family:var(--serif);font-size:1.3rem}
/* B2B hero toàn màn hình */
.b2b-hero.vf::after{display:none}.b2b-hero.vf .wrap{min-height:min(calc(100vh - 112px),760px);align-items:center;position:relative;z-index:1}.b2b-hero.vf h1{font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.05}.b2b-hero.vf h1 em{font-style:italic;color:var(--gold);font-weight:500;display:block;font-size:.66em;margin-top:.2em}.b2b-hero.vf .box{background:rgba(61,5,4,.45);backdrop-filter:blur(6px);box-shadow:0 30px 60px rgba(0,0,0,.3)}.b2b-hero .hero-stats{margin-top:30px}
@media(max-width:980px){.hero.vf .wrap{grid-template-columns:1fr;min-height:0;padding-top:40px;padding-bottom:64px;gap:28px}.hero-art{height:380px;min-height:0}.hero-art .main{width:42%;left:29%}.hero-art .side{width:30%;top:24%}.cfg{grid-template-columns:1fr;padding:18px;gap:22px}.cfg-stage{max-height:440px}.b2b-hero.vf .wrap{min-height:0}.sticky-cta{display:none}}
@media(max-width:620px){.hero.vf .wrap{padding-top:28px;padding-bottom:56px}.hero.vf h1{font-size:2.5rem}.hero-stats b{font-size:1.8rem}.hero-stats div{min-width:40%;margin-bottom:12px}.hero-art{height:300px;margin:0}.hero-art .ring{display:none}.scroll-hint{display:none}.buybar{display:flex}.cfg-stage img{width:60%}.cfg-name{font-size:1.4rem}.cfg-price span{font-size:1.8rem}.seg{grid-template-columns:1fr 1fr}.card .act .btn.ghost{display:none}.card .act .btn{flex:1}}
@media(prefers-reduced-motion:reduce){.hero-art img,.cfg-stage img,.hero-art .ring,.vf .specks i,.scroll-hint span::after{animation:none}}

/* ===== Catalogue thật: ảnh chai PNG trong suốt, bảng giá Tết, chip ===== */
.card .ph img,.hero-art figure img,.cfg-stage img,.tier .mini img,.pdp .gal img{object-fit:contain}
.card .ph img{padding:14px 18px}.pdp .gal img{padding:30px;aspect-ratio:3/4}.pdp .gal{background:linear-gradient(180deg,#faf7f1,#ece6d9)}
.cart-t img{object-fit:contain;background:var(--tone)}
.ask{color:var(--wine);font-weight:600;font-size:.95rem;letter-spacing:.02em}
.chip-tet{background:var(--wine);color:var(--gold);border-color:var(--wine)}.chip-tet:hover{color:#fff}
.pt-tools{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:16px}.pt-tools input{flex:1;min-width:220px;padding:11px 12px;border:1px solid var(--line);font:inherit;font-size:14px;background:#fff;outline:0}.pt-tools input:focus{border-color:var(--wine)}
.pt-seg{display:flex;flex-wrap:wrap;gap:6px}.pt-seg button{padding:9px 12px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.pt-seg button b{font-size:12px}
.pt-wrap{max-height:640px;overflow:auto;border:1px solid var(--line);background:#fff}.pt-wrap table{border:0}.pt-wrap thead th{position:sticky;top:0;background:#fff;z-index:1}table.pt td .btn{padding:7px 10px;font-size:10.5px}
nav.main>a.hide-md{display:inline-block}
@media(max-width:1280px){nav.main>a.hide-md{display:none}}
@media(max-width:620px){.pt-wrap{max-height:none}table.pt th:nth-child(3),table.pt td:nth-child(3),table.pt th:nth-child(5),table.pt td:nth-child(5){display:none}.pt-tools input{min-width:0;width:100%}}
/* ---- Tự thiết kế giỏ quà ---- */
.gb-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:6px 0 28px}.gb-steps div{background:#fff;border:1px solid var(--line);padding:18px 20px;font-size:14px;color:var(--muted);line-height:1.5}.gb-steps b{display:block;color:var(--wine);font-family:var(--serif);font-size:1.45rem;font-weight:600;margin-bottom:4px}
.gb{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:32px;align-items:start}
.gb-tpl{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:18px}.gb-tpl button{border:1px dashed var(--gold-d);background:#fff;padding:8px 14px;font:inherit;font-size:13px;cursor:pointer;transition:.25s}.gb-tpl button:hover{background:#fbf5de;border-style:solid}
.gb-tools{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px;align-items:center}.gb-tools input[type=search]{flex:1;min-width:200px;padding:12px 14px;border:1px solid var(--line);background:#fff;font:inherit;font-size:14px}.gb-tools select{font:inherit;font-size:13px;padding:11px 10px;border:1px solid var(--line);background:#fff;border-radius:var(--r)}.gb-tools input:focus,.gb-tools select:focus{outline:0;border-color:var(--gold-d)}
.gb-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}.gb-cats button{border:1px solid var(--line);background:#fff;padding:8px 14px;font:inherit;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted);cursor:pointer;transition:.25s}.gb-cats button:hover{border-color:var(--wine);color:var(--wine)}.gb-cats button.on{background:var(--wine);color:#fff;border-color:var(--wine)}
.gb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.gb-it{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;min-width:0;transition:transform .35s var(--ease),border-color .3s,box-shadow .35s}.gb-it:hover{border-color:var(--gold-d);transform:translateY(-3px);box-shadow:0 14px 30px rgba(60,20,10,.08)}.gb-it.in{border-color:var(--gold-d);box-shadow:inset 0 0 0 1px var(--gold-d)}
.gb-it .ph{aspect-ratio:3/4;background:var(--tone);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.gb-it .ph img{width:100%;height:100%;object-fit:contain;padding:12px;transition:transform .8s var(--ease)}.gb-it:hover .ph img{transform:scale(1.05)}.gb-it .tg{position:absolute;left:8px;top:8px;background:var(--wine);color:var(--gold);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;padding:4px 7px;font-weight:600}
.gb-it .bd{padding:10px 12px 12px;display:flex;flex-direction:column;gap:4px;flex:1}.gb-it .nm{font-size:13.5px;font-weight:500;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.gb-it .mt{font-size:12px;color:var(--muted);line-height:1.3}
.gb-it button{margin-top:auto;border:1px solid var(--wine);background:#fff;color:var(--wine);padding:9px 6px;font:inherit;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;cursor:pointer;transition:.25s;margin-top:8px}.gb-it button:hover{background:var(--wine);color:#fff}.gb-it.in button{background:var(--gold);border-color:var(--gold);color:var(--wine-d)}
.gb-side{position:sticky;top:90px;background:#fff;border:1px solid var(--line);max-height:calc(100vh - 110px);display:flex;flex-direction:column}.gb-cl{display:none}
.gb-tabs{display:flex;overflow-x:auto;border-bottom:1px solid var(--line);background:var(--tone);scrollbar-width:thin;flex:0 0 auto}.gb-tabs button{flex:0 0 auto;padding:12px 16px;border:0;border-right:1px solid var(--line);background:transparent;font:inherit;font-size:13px;cursor:pointer;color:var(--muted);white-space:nowrap;display:inline-flex;gap:6px;align-items:center}.gb-tabs button small{background:var(--line);color:var(--ink);font-size:11px;min-width:18px;height:18px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}.gb-tabs button.on{background:#fff;color:var(--wine);font-weight:600;box-shadow:inset 0 2px 0 var(--gold)}.gb-tabs button.on small{background:var(--wine);color:var(--gold)}.gb-tabs button.add{color:var(--wine);font-weight:600}
.gb-bk{padding:18px 20px 20px;overflow:auto}.gb-bk .nm{display:flex;gap:8px;align-items:center}.gb-bk .nm input{flex:1;min-width:0;font:inherit;font-family:var(--serif);font-size:1.55rem;font-weight:600;border:0;border-bottom:1px solid transparent;background:transparent;color:var(--wine);padding:4px 0}.gb-bk .nm input:focus{outline:0;border-color:var(--gold-d)}
.gb-lines{margin:12px 0 6px;border-top:1px solid var(--line)}.gb-ln{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px}.gb-ln img{width:44px;height:56px;object-fit:contain;background:var(--tone);padding:3px}.gb-ln a{color:var(--ink);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.gb-ln small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.gb-ln .q{display:inline-flex;border:1px solid var(--line)}.gb-ln .q button{width:28px;height:30px;border:0;background:#fff;cursor:pointer;font-size:16px;color:var(--ink)}.gb-ln .q button:hover{background:var(--tone)}.gb-ln .q span{width:30px;display:inline-flex;align-items:center;justify-content:center;font-weight:600;font-size:13px}.gb-ln .rm{border:0;background:none;color:var(--muted);font-size:20px;cursor:pointer;line-height:1;padding:4px}.gb-ln .rm:hover{color:var(--wine)}
.gb-empty{padding:26px 12px;text-align:center;color:var(--muted);font-size:13.5px;border:1px dashed var(--line);margin:12px 0;line-height:1.5}
.gb-f{margin:16px 0 0}.gb-f>b{display:block;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.gb-pack{display:grid;grid-template-columns:1fr 1fr;gap:6px}.gb-pack button{border:1px solid var(--line);background:#fff;padding:10px 12px;font:inherit;font-size:13px;cursor:pointer;text-align:left;transition:.25s;color:var(--ink)}.gb-pack button:hover{border-color:var(--wine)}.gb-pack button.on{border-color:var(--wine);background:var(--wine);color:#fff}
.gb-x{display:flex;flex-wrap:wrap;gap:6px}.gb-x label{border:1px solid var(--line);padding:7px 10px;font-size:13px;cursor:pointer;display:inline-flex;gap:6px;align-items:center;transition:.25s}.gb-x label.on{border-color:var(--gold-d);background:#fbf5de}.gb-x input{accent-color:var(--wine);margin:0}
.gb-sets{display:flex;align-items:center;gap:10px}.gb-sets .qty input{width:60px}
.gb-bk textarea{width:100%;font:inherit;font-size:14px;padding:10px;border:1px solid var(--line);min-height:66px;resize:vertical}.gb-bk textarea:focus{outline:0;border-color:var(--gold-d)}
.gb-sum{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;color:var(--muted);padding:14px 0;border-top:1px solid var(--line);margin-top:16px}.gb-sum b{font-family:var(--serif);font-size:1.35rem;color:var(--wine);font-weight:600}
.gb-bk .btn.dis{opacity:.55}
.gb-act{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;justify-content:center}.gb-act .lk{background:none;border:0;color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;text-decoration:underline;padding:6px 0}.gb-act .lk:hover{color:var(--wine)}
.gb-bar{display:none}
/* band giới thiệu */
.gb-stack{position:relative;height:320px}.gb-stack figure{position:absolute;margin:0;width:38%;aspect-ratio:3/4;display:flex;align-items:flex-end;justify-content:center;transition:transform .7s var(--ease)}.gb-stack img{width:100%;height:100%;object-fit:contain;padding:0;filter:drop-shadow(0 24px 22px rgba(0,0,0,.5))}.gb-stack .s1{left:6%;top:14%;transform:rotate(-8deg)}.gb-stack .s2{left:31%;top:0;z-index:2}.gb-stack .s3{left:56%;top:16%;transform:rotate(8deg)}.gb-band:hover .gb-stack .s1{transform:rotate(-13deg) translate(-6px,-8px)}.gb-band:hover .gb-stack .s3{transform:rotate(13deg) translate(6px,-8px)}.gb-band:hover .gb-stack .s2{transform:translateY(-10px)}.gb-stack .lbl{position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);color:var(--gold);font-family:var(--serif);font-style:italic;font-size:1.25rem;white-space:nowrap}
/* hộp chọn giỏ */
.bk-pop{position:fixed;inset:0;z-index:190;background:rgba(28,20,20,.55);display:none;align-items:center;justify-content:center;padding:16px}.bk-pop.on{display:flex}.bk-pop .bx{background:var(--paper);width:100%;max-width:420px;padding:26px 24px;animation:popin .35s var(--ease)}@keyframes popin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.bk-pop h3{margin:0 0 4px}
.bk-pop .ls{margin:16px 0;max-height:50vh;overflow:auto}.bk-pop .ls button{display:flex;flex-direction:column;gap:2px;width:100%;padding:12px 14px;border:1px solid var(--line);background:#fff;font:inherit;font-size:14px;cursor:pointer;margin-bottom:6px;text-align:left;color:var(--ink);transition:.25s}.bk-pop .ls button small{color:var(--muted);font-size:12px}.bk-pop .ls button:hover{border-color:var(--wine)}.bk-pop .ls button.new{border-style:dashed;color:var(--wine);font-weight:600}
.bk-pop .ft{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px}
/* giỏ quà trong trang báo giá */
.bk-sum{background:#fff;border:1px solid var(--line);border-left:3px solid var(--gold);padding:16px 18px;margin-bottom:12px}.bk-h{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:14px}.bk-h b{font-family:var(--serif);font-size:1.25rem;color:var(--wine)}.bk-h>span{color:var(--muted)}.bk-h .act{margin-left:auto;display:flex;gap:12px;color:var(--ink)}.bk-h .act button{border:0;background:none;color:var(--muted);cursor:pointer;font:inherit;text-decoration:underline;padding:0}.bk-h .act button:hover{color:var(--wine)}.bk-sum ul{margin:10px 0 0;padding-left:18px;font-size:14px}.bk-sum li{margin:3px 0}
@media(max-width:980px){.gb{grid-template-columns:1fr}.gb-steps{grid-template-columns:1fr;gap:8px}.gb-steps div{padding:12px 16px}.gb-side{position:fixed;left:0;right:0;bottom:0;top:auto;max-height:86vh;transform:translateY(100%);transition:transform .45s var(--ease);z-index:120;border-radius:14px 14px 0 0;box-shadow:0 -20px 50px rgba(0,0,0,.25)}.gb-side.on{transform:none}.gb-cl{display:block;border:0;background:var(--tone);width:100%;padding:12px;font:inherit;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted);cursor:pointer;border-radius:14px 14px 0 0}
.gb-bar{display:flex;position:fixed;left:0;right:0;bottom:46px;z-index:110;background:var(--wine-d);color:#f6ece4;padding:10px 16px;justify-content:space-between;align-items:center;gap:10px;font-size:13px;border-top:1px solid rgba(232,210,133,.3)}.gb-bar b{color:var(--gold);font-weight:600}.gb-bar.pulse{animation:barpulse .6s var(--ease)}@keyframes barpulse{0%{background:var(--wine)}100%{background:var(--wine-d)}}
body:has(.gb-bar) .float{bottom:120px}.gb-stack{height:230px}.gb-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}}
@media(max-width:620px){.gb-grid{grid-template-columns:repeat(2,1fr)}.gb-tools select{flex:1}.gb-pack{grid-template-columns:1fr 1fr}.gb-bk{padding:14px 16px 90px}}

/* ---- Chai tách nền: hero và khối thiết kế suất quà ---- */
.hero-art figure a{background:none;box-shadow:none;overflow:visible;position:relative;padding:0 6%}
.hero-art figure a::before{content:"";position:absolute;left:8%;right:8%;bottom:4%;height:22%;background:radial-gradient(50% 50% at 50% 50%,rgba(232,210,133,.38),rgba(232,210,133,0) 72%);filter:blur(8px);z-index:0;pointer-events:none}
.hero-art figure a::after{content:"";position:absolute;left:22%;right:22%;bottom:7%;height:7%;border-radius:50%;background:rgba(0,0,0,.45);filter:blur(10px);z-index:0}
.hero-art figure img{position:relative;z-index:1;object-fit:contain;aspect-ratio:1/2;padding:0;background:none;filter:drop-shadow(0 26px 22px rgba(0,0,0,.5))}
.hero-art .main{width:42%;left:29%;top:0}.hero-art .side{width:30%;top:22%;opacity:1}.hero-art .side.a{left:2%}.hero-art .side.b{right:2%}
.hero-art figcaption{margin-top:2px}
.cfg-stage{background:radial-gradient(75% 70% at 50% 42%,#7a1a14,var(--wine-d) 100%);border-radius:var(--r)}
.cfg-bg{background:radial-gradient(40% 22% at 50% 88%,rgba(232,210,133,.16),transparent 70%)}
.cfg-stage img{object-fit:contain;padding:0;background:none;box-shadow:none;width:50%;filter:drop-shadow(0 30px 26px rgba(0,0,0,.55))}
.cfg-tag{background:rgba(250,248,243,.92);color:var(--wine)}
@media(max-width:980px){.hero-art .main{width:40%;left:30%}.hero-art .side{width:28%;top:20%}}
.b2b-band .ask{color:var(--gold);font-size:inherit}