:root{
  --ink:#1A1C1E;--footer:#33373B;--steel:#6B7177;--text2:#4A4F55;--soft:#EEF0F1;
  --line:#D3D6D9;--line2:#E4E6E8;--gold:#C8A15A;--gold-deep:#A8864A;--white:#fff;
  --serif:'Playfair Display',Georgia,serif;--sans:'Be Vietnam Pro',system-ui,sans-serif;
  --pad:clamp(20px,5vw,96px);--h2:clamp(24px,2.4vw,38px);--h1:clamp(34px,4vw,68px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:15px;line-height:1.65;color:var(--ink);background:#fff;overflow-x:hidden}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--ink)}
button{font-family:inherit}
h1,h2{font-family:var(--serif);font-weight:700;line-height:1.2}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.hw-wrap{max-width:1600px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}

/* Buttons — vuông, không gạch chân */
.hw-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 36px;border:1px solid var(--ink);background:var(--ink);color:#fff!important;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s;border-radius:0}
.hw-btn:hover{background:var(--footer);border-color:var(--footer)}
.hw-btn--line{background:transparent;color:var(--ink)!important;min-height:44px;padding:0 22px}
.hw-btn--line:hover{background:var(--ink);color:#fff!important}

/* ---------- Header ---------- */
.hw-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #E6E6E6;transition:transform .35s ease-out}
.hw-header.is-hidden{transform:translateY(-100%)}
.admin-bar .hw-header{top:32px}
.hw-header__bar{height:64px;display:flex;align-items:center;gap:24px;padding:0 clamp(16px,3vw,48px)}
.hw-logo img{height:36px;width:auto}
.hw-nav{flex:1;display:flex;justify-content:center}
.hw-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(16px,2.2vw,40px)}
.hw-nav li{position:relative}
.hw-nav a{display:flex;align-items:center;height:64px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--steel)}
.hw-nav a:hover,.hw-nav .is-active>a{color:var(--ink)}
.hw-nav .hw-drop{position:absolute;top:100%;left:-20px;min-width:240px;max-height:60vh;overflow-y:auto;background:#fff;border:1px solid var(--line2);padding:10px 0;display:none;box-shadow:0 12px 32px rgba(0,0,0,.08)}
.hw-nav li:hover>.hw-drop,.hw-nav li:focus-within>.hw-drop{display:block}
.hw-drop a{height:auto;padding:8px 20px;font-weight:500;letter-spacing:.04em;font-size:13px}
.hw-icons{display:flex;gap:2px;margin-left:auto}
.hw-ico{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:#000;background:none;border:0;cursor:pointer}
.hw-badge{position:absolute;top:3px;right:-1px;min-width:17px;height:17px;border-radius:9px;background:#E0443C;color:#fff;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;padding:0 4px}
.hw-badge:empty,.hw-badge[data-n="0"]{display:none}
.hw-search{display:none;padding:12px clamp(16px,3vw,48px) 16px;border-top:1px solid #eee}
.hw-search.is-open{display:block}
.hw-search form{display:flex;max-width:720px;margin:0 auto}
.hw-search input[type=search]{flex:1;height:46px;border:1px solid var(--line);padding:0 16px;font:inherit}
.hw-search button{height:46px;border:0;background:var(--ink);color:#fff;padding:0 24px;font-weight:600;letter-spacing:.12em;font-size:12px}
.hw-mnav{display:none}
@media (max-width:960px){
  .hw-header__bar{height:56px}
  .hw-logo img{height:32px}
  .hw-nav{display:none}
  .hw-mnav{display:flex;gap:22px;overflow-x:auto;scrollbar-width:none;padding:0 16px;height:40px;align-items:center;border-top:1px solid #eee;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
  .hw-mnav::-webkit-scrollbar{display:none}
  .hw-mnav a{color:var(--steel);flex:0 0 auto}.hw-mnav a.is-active{color:var(--ink)}
}
@media (max-width:782px){.admin-bar .hw-header{top:46px}}

/* ---------- Reveal ---------- */
.js .hw-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .hw-reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .hw-reveal{opacity:1;transform:none;transition:none}}
@media print{.js .hw-reveal{opacity:1;transform:none}}

/* ---------- Section heads ---------- */
.hw-head{text-align:center;padding:0 20px;margin-bottom:clamp(28px,3vw,48px)}
.hw-head h2{margin:0 0 12px;font-size:var(--h2);letter-spacing:.04em;color:var(--ink);text-transform:uppercase}
.hw-head p{margin:0;font-size:clamp(15px,1.1vw,18px);color:var(--text2)}

/* 1. Hero */
.hw-herowrap{position:relative}
.hw-hero{position:sticky;top:0;z-index:1;height:clamp(480px,46vw,860px);overflow:hidden;background:#1A1A1A}
.hw-hero video,.hw-hero__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hw-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(0,0,0,.2) 45%,rgba(0,0,0,0) 70%);pointer-events:none}
.hw-hero__slides{position:relative;z-index:2;height:100%}
.hw-hero__slide{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,2.4vw,40px);padding:40px clamp(20px,4vw,76px);opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .8s,transform .8s,visibility .8s}
.hw-hero__slide.is-on{opacity:1;visibility:visible;transform:none}
.hw-pill{align-self:flex-start;border:1px solid #fff;border-radius:32px;padding:clamp(9px,.9vw,14px) clamp(22px,2vw,38px);font-size:clamp(12px,1.1vw,19px);font-weight:500;letter-spacing:.14em;color:#fff}
.hw-hero h1,.hw-hero .hw-h1{margin:0;font-family:var(--serif);font-weight:700;font-size:clamp(34px,4.6vw,86px);line-height:1.15;color:#fff;text-transform:uppercase}
.hw-hero p{margin:0;font-size:clamp(14px,1.25vw,22px);line-height:1.75;color:#fff;max-width:1060px}
.hw-hero__dots{position:absolute;z-index:3;left:clamp(20px,4vw,76px);bottom:28px;display:flex;gap:10px}
.hw-hero__dots button{width:28px;height:2px;border:0;padding:0;background:rgba(255,255,255,.45);cursor:pointer}
.hw-hero__dots button.is-on{background:#fff}

/* 2. Banner mở rộng */
.hw-promos{position:relative;z-index:3;background:#fff;display:flex;gap:16px;height:clamp(380px,44vw,843px)}
.hw-promo{position:relative;flex:1 1 0;min-width:0;overflow:hidden;cursor:pointer;transition:flex-grow .7s cubic-bezier(.4,0,.2,1)}
.hw-promo.is-on{flex-grow:3}
.hw-promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hw-promo::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.15);transition:background .5s ease-out}
.hw-promo.is-on::after{background:rgba(0,0,0,.35)}
.hw-promo__txt{position:absolute;z-index:2;left:24px;right:24px;bottom:clamp(40px,5vw,64px);display:flex;flex-direction:column;align-items:center;gap:clamp(24px,3vw,48px);text-align:center;opacity:0;transform:translateY(16px);transition:opacity .5s ease-out .15s,transform .5s ease-out .15s}
.hw-promo.is-on .hw-promo__txt{opacity:1;transform:none}
.hw-promo h3{margin:0;font-family:var(--sans);font-weight:500;font-size:clamp(18px,2.6vw,46px);line-height:1.2;letter-spacing:.02em;color:#fff;text-transform:uppercase}
.hw-trace{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 clamp(28px,2.6vw,44px);font-size:clamp(12px,1vw,18px);letter-spacing:.14em;font-weight:600;color:#fff!important}
.hw-trace i{position:absolute;background:#fff;pointer-events:none;transform:scale(0)}
.hw-trace i:nth-child(1){top:0;left:0;right:0;height:1px;transform-origin:left center;transform:scaleX(0)}
.hw-trace i:nth-child(2){top:0;bottom:0;right:0;width:1px;transform-origin:center top;transform:scaleY(0)}
.hw-trace i:nth-child(3){bottom:0;left:0;right:0;height:1px;transform-origin:right center;transform:scaleX(0)}
.hw-trace i:nth-child(4){top:0;bottom:0;left:0;width:1px;transform-origin:center bottom;transform:scaleY(0)}
.hw-promo.is-on .hw-trace i:nth-child(1){animation:hwX .25s linear .5s both}
.hw-promo.is-on .hw-trace i:nth-child(2){animation:hwY .25s linear .75s both}
.hw-promo.is-on .hw-trace i:nth-child(3){animation:hwX .25s linear 1s both}
.hw-promo.is-on .hw-trace i:nth-child(4){animation:hwY .25s linear 1.25s both}
@keyframes hwX{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hwY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.hw-promo.is-on .hw-trace i{animation:none!important;transform:none!important}}
@media (max-width:700px){.hw-promos{flex-direction:column;height:auto;gap:8px}.hw-promo{flex:none!important;height:96px;transition:height .6s cubic-bezier(.4,0,.2,1)}.hw-promo.is-on{height:380px}.hw-promo__txt{bottom:24px;gap:16px}}
@media (max-width:700px) and (prefers-reduced-motion:reduce){.hw-promo{transition:none}}

/* 3. Thương hiệu */
.hw-brands{background:#fff;padding:clamp(80px,9vw,160px) 0 clamp(80px,9vw,150px)}
.hw-brands .hw-head{margin-bottom:clamp(48px,5.5vw,104px)}
.hw-brands .hw-head h2{font-size:var(--h1);letter-spacing:.01em;line-height:1.15}
.hw-brands .hw-head p{font-size:clamp(16px,1.3vw,22px)}
.hw-car{position:relative}
.hw-car__track{display:flex;overflow-x:auto;scrollbar-width:none;padding:24px 0 8px}
.hw-car__track::-webkit-scrollbar{display:none}
.hw-bcard{flex:0 0 clamp(220px,22.6vw,440px);display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 20px 12px;transition:opacity .45s ease}
.hw-car__track:hover .hw-bcard{opacity:.45}.hw-car__track .hw-bcard:hover{opacity:1}
.hw-bcard__img{position:relative;width:100%;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.hw-bcard__img::before{content:"";position:absolute;left:22%;right:22%;bottom:4%;height:18px;border-radius:50%;background:radial-gradient(closest-side,rgba(26,28,30,.28),rgba(26,28,30,0));opacity:.5;transition:opacity .5s,transform .5s}
.hw-bcard:hover .hw-bcard__img::before{opacity:1;transform:scale(.85)}
.hw-bcard__img img{position:relative;width:100%;height:100%;object-fit:contain;padding:6%;mix-blend-mode:multiply;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.hw-bcard:hover .hw-bcard__img img{transform:translateY(-16px) rotate(-3deg)}
.hw-bcard__logo{height:56px;width:100%;margin-top:16px;display:flex;align-items:center;justify-content:center}
.hw-bcard__logo img{max-width:70%;width:auto;height:auto}
.hw-bcard__model{margin-top:10px;font-size:clamp(14px,1.05vw,16px);color:var(--text2);line-height:1.5;height:3em;overflow:hidden;max-width:300px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.hw-bcard .hw-btn--line{margin-top:18px;border-color:#111;color:#111!important}
.hw-arrow{position:absolute;top:30%;width:52px;height:52px;border-radius:50%;border:1px solid #ddd;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.08);cursor:pointer;color:#111;display:flex;align-items:center;justify-content:center;z-index:3}
.hw-arrow:hover{background:#111;color:#fff}
.hw-arrow--prev{left:clamp(6px,2vw,40px)}.hw-arrow--next{right:clamp(6px,2vw,40px)}
.hw-chev{position:absolute;top:36%;width:48px;height:64px;border:0;background:transparent;cursor:pointer;color:#111;z-index:3}
.hw-chev--prev{left:clamp(8px,3vw,60px)}.hw-chev--next{right:clamp(8px,3vw,60px)}

/* 4. Sale */
.hw-sale__video{position:relative;height:clamp(280px,40vw,640px);overflow:hidden;background:#E9E9E9}
.hw-sale__video video{width:100%;height:100%;object-fit:cover}
.hw-sale__body{max-width:1600px;margin:0 auto;padding:clamp(64px,7vw,128px) var(--pad) clamp(80px,8vw,144px);display:flex;flex-direction:column;gap:clamp(40px,4vw,64px)}
.hw-sale__top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.hw-sale__top h2{margin:0 0 14px;font-size:clamp(28px,3vw,48px);text-transform:uppercase;line-height:1.15}
.hw-sale__top p{margin:0;font-size:16px;color:var(--text2)}
.hw-eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:.16em;color:var(--steel);text-transform:uppercase;margin-bottom:10px}
.hw-grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,32px)}
@media (max-width:900px){.hw-grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hw-scard{display:flex;flex-direction:column;gap:12px}
.hw-scard__img{position:relative;aspect-ratio:1/1;background:#fff;overflow:hidden}
.hw-scard__img img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply;transition:transform .6s}
.hw-scard:hover .hw-scard__img img{transform:scale(1.05)}
.hw-off{position:absolute;top:12px;left:12px;font-size:13px;font-weight:700;color:#fff;background:var(--ink);padding:6px 10px}
.hw-scard__name{font-size:15px;font-weight:500;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em}
.hw-price{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.hw-price b{font-size:17px;font-weight:600}
.hw-price s{font-size:14px;color:var(--steel)}

/* 5/8. product carousels (ProductCardLight) */
.hw-pcar{padding:clamp(48px,5vw,80px) 0 clamp(40px,4vw,64px)}
.hw-pcar--grey{background:#E3E3E3}
.hw-pcar__track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 0 4px}
.hw-pcar__track::-webkit-scrollbar{display:none}
.hw-pcard{flex:0 0 clamp(260px,31.8vw,520px);scroll-snap-align:start;display:flex;flex-direction:column;background:#fff}
.hw-pcard__img{display:block;aspect-ratio:1/1;background:#fff;overflow:hidden}
.hw-pcard__img img{width:100%;height:100%;object-fit:contain;padding:8%;transition:transform .6s}
.hw-pcard:hover .hw-pcard__img img{transform:scale(1.04)}
.hw-pcard__body{flex:1;background:var(--soft);padding:20px 22px 24px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.hw-pcard__name{font-size:15px;font-weight:500;line-height:1.4;height:4.2em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;color:#1A1A1A}
.hw-pcard__meta{font-size:13px;color:#555;line-height:1.6;height:3.2em;overflow:hidden}
.hw-pcard__old{font-size:13px;color:#777;text-decoration:line-through;min-height:1.4em}
.hw-pcard__price{font-size:15px;font-weight:600;color:#111;margin-bottom:8px}
.hw-pcard .hw-addcart{margin-top:auto;height:38px;padding:0 20px;border:1px solid #111;background:transparent;color:#111!important;font-size:11px;font-weight:600;letter-spacing:.14em;display:inline-flex;align-items:center;transition:background .2s,color .2s}
.hw-pcard .hw-addcart:hover{background:#111;color:#fff!important}
.hw-pcard .hw-addcart.added{background:#111;color:#fff!important}
.hw-pcard .added_to_cart{display:none}
.hw-dots{display:flex;justify-content:center;gap:10px;margin-top:28px}
.hw-dots span{width:9px;height:9px;border-radius:50%;border:1px solid #333}
.hw-dots span.is-on{background:#333}

/* 6. Eco-Drive */
.hw-eco{position:relative;height:300vh;background:#fff;z-index:10}
.hw-eco__stick{position:sticky;top:0;height:100vh;display:flex;overflow:hidden}
.hw-eco__vid{flex:6;position:relative;min-height:0}
.hw-eco__vid video{width:100%;height:100%;object-fit:cover}
.hw-eco__txt{flex:4;position:relative;display:flex;align-items:center;justify-content:center;padding:0 40px;min-height:0}
.hw-eco__f{position:absolute;width:100%;max-width:450px;padding:0 24px;text-align:center;opacity:0;visibility:hidden;transform:translateY(30px);transition:all .6s cubic-bezier(.25,.46,.45,.94)}
.hw-eco__f.is-on{opacity:1;visibility:visible;transform:none}
.hw-eco__f h2{font-size:30px;margin:0 0 15px;text-transform:uppercase;letter-spacing:1px}
.hw-eco__f p{font-size:18px;color:#666;font-weight:300;margin:0}
.hw-eco__f .hw-btn{margin-top:40px;background:#000;border-color:#000;letter-spacing:2px;font-size:13px}
.hw-eco__f .hw-btn:hover{background:transparent;color:#000!important}
@media (max-width:800px){.hw-eco__stick{flex-direction:column}.hw-eco__vid{flex:6}.hw-eco__txt{flex:4}}
@media (prefers-reduced-motion:reduce){.hw-eco{height:auto}.hw-eco__stick{position:relative;height:auto;flex-direction:column}.hw-eco__vid{height:60vh}.hw-eco__txt{display:block;padding:40px 20px}.hw-eco__f{position:relative;opacity:1;visibility:visible;transform:none;margin:0 auto 40px}}

/* 11. Marquee */
.hw-marquee{background:var(--ink);padding:14px 0;overflow:hidden;white-space:nowrap}
.hw-marquee__in{display:flex;width:max-content;animation:hwMarq 60s linear infinite}
.hw-marquee__g{display:flex;gap:40px;padding-right:40px;font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.9vw,30px);color:#fff}
@keyframes hwMarq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.hw-marquee__in{animation:none}}

/* 7. About */
.hw-about{background:#E3E3E3;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));align-items:start}
.hw-about__txt{position:sticky;top:64px;padding:clamp(40px,5vw,100px) clamp(20px,4vw,64px);display:flex;flex-direction:column;gap:18px;max-width:780px}
.hw-about__txt h2{margin:0 0 8px;font-size:clamp(24px,2.3vw,38px);letter-spacing:.02em;color:#3A3E42}
.hw-about__txt h3{margin:56px 0 8px;font-weight:600;font-size:clamp(24px,2.3vw,38px);color:#3A3E42}
.hw-about__txt p{margin:0;font-weight:300;font-size:clamp(15px,1.15vw,19px);line-height:1.7;color:#444;text-align:justify}
.hw-about__txt blockquote{margin:16px 0 0;padding:0 0 0 26px;border-left:3px solid var(--ink);font-weight:300;font-size:clamp(15px,1.15vw,19px);line-height:1.7;color:#444}
.hw-about__img{padding:clamp(40px,5vw,100px) 0}
.hw-about__img img{width:100%;aspect-ratio:733/1024;max-height:1100px;object-fit:cover}
@media (max-width:900px){.hw-about__txt{position:relative;top:0}}

/* 9. Perks */
.hw-perks{background:#E3E3E3;padding:clamp(40px,4vw,64px) clamp(20px,6vw,110px) clamp(56px,6vw,96px)}
.hw-perks h2{margin:0 0 clamp(32px,3vw,48px);text-align:center;font-size:var(--h2);letter-spacing:.04em}
.hw-perks__grid{max-width:1420px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 48px}
@media (max-width:700px){.hw-perks__grid{grid-template-columns:1fr}}
.hw-perk{display:flex;gap:22px;align-items:flex-start}
.hw-perk span{font-family:var(--serif);font-style:italic;font-size:60px;line-height:.9;color:var(--gold-deep)}
.hw-perk h3{margin:0 0 14px;font-family:var(--sans);font-weight:500;font-size:clamp(18px,1.6vw,26px);line-height:1.25;color:#111}
.hw-perk p{margin:0;font-size:17px;line-height:1.7;color:#555;max-width:260px}

/* 10. News */
.hw-news{background:#fff;padding:clamp(48px,5vw,80px) clamp(20px,6vw,110px) clamp(56px,6vw,120px)}
.hw-news h2{margin:0 0 clamp(32px,3vw,56px);text-align:center;font-size:var(--h2);letter-spacing:.04em}
.hw-news__track{max-width:1420px;margin:0 auto;display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.hw-news__track::-webkit-scrollbar{display:none}
.hw-post{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;display:flex;flex-direction:column;gap:12px}
@media (max-width:1100px){.hw-post{flex-basis:calc((100% - 24px)/2)}}
@media (max-width:700px){.hw-post{flex-basis:88%}}
.hw-post__img{position:relative;display:block;aspect-ratio:16/9;background:var(--soft);overflow:hidden}
.hw-post__img img{width:100%;height:100%;object-fit:cover}
.hw-post__date{position:absolute;top:0;right:24px;width:64px;height:64px;background:#2A2D30;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;line-height:1.05}
.hw-post__date b{font-size:24px;font-weight:400}.hw-post__date small{font-size:15px}
.hw-post__cat{font-size:15px;color:#333;margin-top:6px}
.hw-post h3{margin:0;font-family:var(--sans);font-weight:400;font-size:clamp(17px,1.35vw,22px);line-height:1.3;min-height:2.6em;text-transform:uppercase}
.hw-post p{margin:0;font-size:14px;line-height:1.65;color:#555}
.hw-post__more{margin-top:auto;padding-top:6px;font-size:14px;font-weight:500;letter-spacing:.06em}

/* 12. CTA */
.hw-cta{background:var(--line2);padding:clamp(72px,9vw,130px) clamp(20px,4vw,48px);min-height:clamp(360px,42vw,560px);display:flex;align-items:center;justify-content:center}
.hw-cta__in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.hw-cta h2{margin:0;font-size:clamp(28px,4.6vw,72px);letter-spacing:.04em;line-height:1.3}
.hw-cta em{font-family:var(--serif);font-style:italic;font-weight:700;font-size:clamp(28px,4.6vw,72px);line-height:1.3;margin-top:8px;color:var(--gold-deep)}
.hw-cta p{margin:clamp(20px,2vw,28px) 0 0;max-width:520px;font-size:16px;color:var(--text2)}
.hw-cta .hw-btn{margin-top:24px;min-height:54px;padding:0 40px;font-size:13px;letter-spacing:.14em}
.hw-seal{position:relative;width:96px;height:96px;margin-top:clamp(32px,3.5vw,52px);display:block}
.hw-seal svg{animation:hwSpin 14s linear infinite;display:block}
.hw-seal img{position:absolute;inset:0;margin:auto;width:30px;height:auto}
@keyframes hwSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.hw-seal svg{animation:none}}

/* Quiz modal */
.hw-quiz{position:fixed;inset:0;z-index:96;background:rgba(14,15,16,.62);display:none;align-items:flex-start;justify-content:center;padding:clamp(12px,6vh,72px) 12px;overflow-y:auto}
.hw-quiz.is-open{display:flex}
.hw-quiz__box{position:relative;background:#fff;width:100%;max-width:760px;padding:clamp(24px,4vw,48px)}
.hw-quiz__x{position:absolute;top:12px;right:12px;width:40px;height:40px;border:0;background:none;font-size:26px;cursor:pointer}
.hw-quiz__step{font-size:12px;font-weight:600;letter-spacing:.16em;color:var(--steel)}
.hw-quiz__bar{height:2px;background:var(--line2);margin:12px 0 28px}.hw-quiz__bar i{display:block;height:2px;background:var(--gold);transition:width .3s}
.hw-quiz h3{font-family:var(--serif);font-size:clamp(22px,2.4vw,32px);margin:0 0 24px}
.hw-quiz__opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.hw-quiz__opts button{min-height:56px;border:1px solid var(--line);background:#fff;font-size:15px;cursor:pointer;padding:10px 16px;text-align:left}
.hw-quiz__opts button:hover{border-color:var(--ink)}
.hw-quiz__back{margin-top:20px;border:0;background:none;color:var(--steel);cursor:pointer;padding:0}
.hw-quiz__res{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0}
@media (max-width:600px){.hw-quiz__res{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hw-quiz__res a{display:flex;flex-direction:column;gap:6px;font-size:13px}
.hw-quiz__res img{aspect-ratio:1/1;object-fit:contain;background:#F7F7F8}
.hw-quiz__acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* Footer */
.hw-footer{background:var(--footer);color:var(--line2)}
.hw-footer a{color:var(--line2)}.hw-footer a:hover{color:#fff}
.hw-footer__grid{max-width:1400px;margin:0 auto;padding:clamp(48px,5vw,72px) clamp(20px,5vw,80px) clamp(32px,3vw,48px);display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:40px 48px}
@media (max-width:1100px){.hw-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.hw-footer__grid{grid-template-columns:1fr}}
.hw-footer__col{display:flex;flex-direction:column;gap:12px;min-width:0;font-size:14px;line-height:1.6}
.hw-footer h4{margin:0 0 6px;font-weight:600;font-size:14px;letter-spacing:.12em;color:var(--gold)}
.hw-footer__logo{width:150px;margin-bottom:8px}
.hw-frow{display:flex;gap:12px;align-items:flex-start}.hw-frow svg{flex:0 0 16px;margin-top:3px;color:#B4B8BC}
.hw-bct{margin-top:20px;display:flex;align-items:center;gap:10px;width:max-content;background:#fff;padding:8px 14px 8px 8px;color:var(--ink)}
.hw-bct span:first-child{width:34px;height:34px;border-radius:50%;background:#4A4F55;color:#fff;display:flex;align-items:center;justify-content:center}
.hw-bct b{display:block;font-size:13px;line-height:1.15}.hw-bct small{font-size:10px;letter-spacing:.06em}
.hw-pay{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.hw-pay span{height:34px;min-width:54px;padding:0 10px;background:#fff;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--ink)}
.hw-sub{display:flex;margin-top:4px}
.hw-sub input{flex:1;min-width:0;height:46px;border:0;border-radius:23px 0 0 23px;padding:0 18px;font:inherit}
.hw-sub button{height:46px;border:0;border-radius:0 23px 23px 0;background:var(--ink);color:#fff;padding:0 18px;font-size:12px;font-weight:600;letter-spacing:.1em;cursor:pointer}
.hw-social{display:flex;gap:10px;margin-top:16px}
.hw-social a{width:38px;height:38px;border-radius:50%;background:#4A4F55;display:flex;align-items:center;justify-content:center;color:#fff}
.hw-social a:hover{background:var(--ink)}
.hw-copy{border-top:1px solid #4A4F55;text-align:center;padding:18px 20px;font-size:13px;color:#B4B8BC}

/* Floating contact */
.hw-float{position:fixed;right:16px;bottom:20px;z-index:60;display:flex;flex-direction:column;gap:10px}
.hw-float a{width:48px;height:48px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.18)}

/* ---------- Generic pages / Woo fallback ---------- */
.hw-page-banner{background:var(--ink);color:#fff;text-align:center;padding:clamp(48px,6vw,96px) 20px}
.hw-page-banner h1{margin:0;font-size:var(--h1);text-transform:uppercase;letter-spacing:.04em;color:#fff}
.hw-crumb{font-size:13px;color:#B4B8BC;margin-top:12px}.hw-crumb a{color:#E4E6E8}
.hw-main{padding:clamp(40px,5vw,80px) 0}
.hw-content{max-width:900px;margin:0 auto;padding:0 20px;font-size:16px;line-height:1.75;color:var(--text2)}
.hw-content h2,.hw-content h3{color:var(--ink)}
.hw-content img{height:auto}
.hw-postgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px}
@media (max-width:900px){.hw-postgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.hw-postgrid{grid-template-columns:1fr}}
.hw-pagination{margin-top:48px;display:flex;justify-content:center;gap:8px}
.hw-pagination .page-numbers{min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);padding:0 12px}
.hw-pagination .current{background:var(--ink);color:#fff;border-color:var(--ink)}
.hw-404{text-align:center;padding:clamp(80px,10vw,160px) 20px}
.hw-404 .num{font-family:var(--serif);font-style:italic;font-size:clamp(80px,12vw,180px);color:var(--gold-deep);line-height:1}
.hw-404 h1{font-size:var(--h2);text-transform:uppercase}

/* WooCommerce */
.hw-woo{max-width:1600px;margin:0 auto;padding:clamp(32px,4vw,64px) var(--pad) clamp(56px,6vw,96px)}
.woocommerce .woocommerce-breadcrumb{font-size:13px;color:var(--steel);margin-bottom:24px}
.woocommerce-products-header__title.page-title{font-size:var(--h1);text-transform:uppercase;margin:0 0 24px}
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px;margin:0 0 32px!important;padding:0;list-style:none}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none!important}
@media (max-width:1100px){.woocommerce ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}}
.woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important;position:relative;display:flex;flex-direction:column}
.woocommerce ul.products li.product a img{aspect-ratio:1/1;object-fit:contain;background:#F7F7F8;padding:8%;margin:0 0 12px!important;transition:transform .6s}
.woocommerce ul.products li.product:hover a img{transform:scale(1.03)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--sans);font-size:15px!important;font-weight:500;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em;padding:0!important;color:var(--ink)}
.woocommerce ul.products li.product .price{color:var(--ink)!important;font-size:16px!important;font-weight:600}
.woocommerce ul.products li.product .price del{color:var(--steel);font-weight:400;font-size:14px}
.woocommerce ul.products li.product .price ins{text-decoration:none}
.woocommerce span.onsale{border-radius:0!important;background:var(--ink)!important;min-height:0!important;min-width:0!important;line-height:1!important;padding:6px 10px!important;font-size:12px;top:10px!important;left:10px!important;right:auto!important;margin:0!important}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt{border-radius:0!important;background:var(--ink)!important;color:#fff!important;font-family:var(--sans);font-size:12px!important;font-weight:600!important;letter-spacing:.12em;text-transform:uppercase;padding:14px 24px!important;min-height:44px}
.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--footer)!important}
.woocommerce ul.products li.product .button{margin-top:auto;align-self:flex-start;background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important}
.woocommerce ul.products li.product .button:hover{background:var(--ink)!important;color:#fff!important}
.woocommerce .woocommerce-ordering select,.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{border:1px solid var(--line);border-radius:0;min-height:46px;padding:8px 12px;font:inherit}
.woocommerce nav.woocommerce-pagination ul{border:0!important}
.woocommerce nav.woocommerce-pagination ul li{border:0!important;margin:0 4px!important}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{min-width:44px;height:44px;display:flex!important;align-items:center;justify-content:center;border:1px solid var(--line)}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--ink)!important;color:#fff!important}
.woocommerce div.product .product_title{font-size:clamp(24px,2.4vw,36px);text-transform:none}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--ink)!important;font-size:30px!important;font-weight:600}
.woocommerce div.product p.price del{font-size:18px;color:var(--steel)}
.woocommerce div.product p.price ins{text-decoration:none}
.woocommerce div.product div.images img{background:#F7F7F8}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{border-radius:0!important;background:#fff!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product form.cart .button{min-height:56px;padding:0 40px!important}
.woocommerce .quantity .qty{height:56px;border:1px solid var(--line);width:72px}
.woocommerce-message,.woocommerce-info{border-top-color:var(--ink)!important}
.woocommerce-message::before,.woocommerce-info::before{color:var(--ink)!important}
.hw-promise{list-style:none;padding:0;margin:20px 0;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--text2)}
.hw-promise li::before{content:"✓ ";color:var(--ink);font-weight:700}
.hw-pd-contact{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.hw-pd-contact a{flex:1;min-width:140px;min-height:48px;display:flex;align-items:center;justify-content:center;border:1px solid var(--ink);font-size:12px;font-weight:600;letter-spacing:.12em}
.hw-pd-contact a:hover{background:var(--ink);color:#fff}

/* Hamburger + drawer (mobile) */
.hw-burger,.hw-drawer{display:none}
@media (max-width:960px){
  .hw-mnav{display:none!important}
  .hw-header__bar{gap:12px}
  .hw-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;margin-left:-8px;padding:0 9px;background:none;border:0;cursor:pointer}
  .hw-burger span{display:block;height:2px;background:var(--ink);border-radius:2px}
  .hw-drawer{display:block;position:fixed;inset:0;z-index:1000;visibility:hidden;pointer-events:none}
  .hw-drawer.is-open{visibility:visible;pointer-events:auto}
  .hw-drawer__bg{position:absolute;inset:0;background:rgba(0,0,0,.45);opacity:0;transition:opacity .3s}
  .hw-drawer.is-open .hw-drawer__bg{opacity:1}
  .hw-drawer__panel{position:absolute;top:0;left:0;bottom:0;width:min(84vw,340px);background:#fff;display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto}
  .hw-drawer.is-open .hw-drawer__panel{transform:none}
  .hw-drawer__top{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #eee}
  .hw-drawer__x{width:40px;height:40px;font-size:30px;line-height:1;background:none;border:0;color:var(--ink);cursor:pointer}
  .hw-drawer__list{list-style:none;margin:0;padding:8px 0;flex:1}
  .hw-drawer__list>li>a,.hw-drawer__list summary{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--ink);text-decoration:none;cursor:pointer;list-style:none}
  .hw-drawer__list summary::-webkit-details-marker{display:none}
  .hw-drawer__list summary::after{content:"+";font-size:20px;font-weight:400}
  .hw-drawer__list details[open] summary::after{content:"\2212"}
  .hw-drawer__list li.is-active>a,.hw-drawer__list li.is-active summary{color:var(--gold)}
  .hw-drawer__sub{display:grid;grid-template-columns:1fr 1fr;gap:2px 12px;padding:0 20px 12px}
  .hw-drawer__sub a{padding:8px 0;font-size:14px;color:var(--steel);text-decoration:none}
  .hw-drawer__foot{display:flex;flex-direction:column;gap:10px;padding:16px 20px 24px;border-top:1px solid #eee}
  .hw-drawer__foot a{font-size:14px;font-weight:600;color:var(--ink);text-decoration:none}
  body.hw-lock{overflow:hidden}
  body.hw-lock .hw-float{display:none}
}
@media (prefers-reduced-motion:reduce){.hw-drawer__panel,.hw-drawer__bg{transition:none}}
/* Loader cu cua WPCode: an ca tren trang chu (snippet dung body.home #id) */
#hwatch-epic-loader#hwatch-epic-loader{display:none!important}

/* promo media */
.hw-promo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* coll block */
.hw-cpages{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}
.hw-cgrid{grid-area:1/1;display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:clamp(16px,2vw,32px)}
.hw-cpages[data-hw-rotate] .hw-cgrid{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s}
.hw-cpages[data-hw-rotate] .hw-cgrid.is-on{opacity:1;visibility:visible;transition:opacity .6s ease}
.hw-cpages:not([data-hw-rotate]) .hw-cgrid:not(.is-on){display:none}
@media (max-width:900px){.hw-cgrid:not([data-cols="1"]){grid-template-columns:repeat(2,minmax(0,1fr))}}
.hw-cd{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.hw-cd span{display:grid;justify-items:center;min-width:64px;padding:10px 8px;border:1px solid var(--line2);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.hw-cd b{font-family:var(--serif);font-size:26px;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:0}
@media (prefers-reduced-motion:reduce){.hw-cpages[data-hw-rotate] .hw-cgrid{transition:none}}

/* brands zoom */
.hw-brands--zoom .hw-bcard__img{overflow:hidden}
.hw-brands--zoom .hw-bcard:hover .hw-bcard__img img{transform:scale(1.2)}
@media (prefers-reduced-motion:reduce){.hw-brands--zoom .hw-bcard:hover .hw-bcard__img img{transform:none}}

/* home viewed */
.hw-viewed{padding:clamp(48px,6vw,96px) 0;background:#fff}
.hw-viewed__head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px}
.hw-viewed__head .hw-sec-title{margin:0}
.hw-viewed__nav{display:flex;gap:8px}
.hw-viewed__btn{width:44px;height:44px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.hw-viewed__btn:hover{border-color:var(--ink)}
.hw-viewed__btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.hw-viewed__track{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(160px,22%,280px);gap:clamp(16px,2vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.hw-viewed__track::-webkit-scrollbar{display:none}
.hw-viewed__track .hw-scard{scroll-snap-align:start}
@media (max-width:640px){.hw-viewed__track{grid-auto-columns:46%}.hw-viewed__nav{display:none}}
/* 1.6.53: chan tran ngang mobile - .hw-cpages track auto co the no theo min-content; iOS<16 khong co overflow-x:clip */
.hw-sale,.hw-sale__body,.hw-sale__top>div{min-width:0;max-width:100%}
@supports not (overflow-x:clip){html,body{overflow-x:hidden}}