html,body{overflow-x:hidden}
.qw-header-main{position:sticky;top:0;z-index:100;border-bottom:1px solid #E4E2DD}
@media(max-width:600px){.qw-topbar{display:none}}
/* Nút "Nhận báo giá" trong Header (.qw-header-cta) bị vỡ dòng ký tự và đẩy tràn ngang
   ở màn hình hẹp vì nằm chung hàng flex nowrap với logo + menu + icon tài khoản.
   Mobile CTA Bar đã có sẵn đúng hành động này nên ẩn bản trong Header dưới 768px thay vì cố nhồi vừa. */
@media(max-width:767px){.qw-header-cta{display:none!important}}
@media(max-width:767px){body{padding-bottom:calc(56px + env(safe-area-inset-bottom))}}
.qw-mobile-cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:200;display:flex;background:#15171A;box-shadow:0 -2px 12px rgba(0,0,0,.25);padding-bottom:env(safe-area-inset-bottom)}
@media(min-width:768px){.qw-mobile-cta-bar{display:none}}
.qw-mobile-cta-item{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px;padding:12px 8px;color:#FAFAF8;font-size:13px;font-weight:600;text-decoration:none;border-right:1px solid #33363B}
.qw-mobile-cta-item:last-child{border-right:0}
.qw-mobile-cta-primary{background:#C9A44C;color:#15171A}
.wp-block-navigation__responsive-container-open:focus-visible,.wp-block-navigation__responsive-container-close:focus-visible{outline:2px solid #C9A44C;outline-offset:2px}

/* Product Card B2B — dùng chung cho Shop (Product Collection block), trang danh mục
   và các shortcode sản phẩm cổ điển trên trang chủ. WooCommerce hiện tại render sản phẩm
   theo 2 kiểu markup khác nhau tùy ngữ cảnh:
   - Cổ điển (shortcode [featured_products], [product_categories]): <ul class="products"><li class="product">
   - Block (trang Shop dùng Product Collection block): <li class="product wc-block-product">,
     giá nằm trong .wp-block-woocommerce-product-price, nút mặc định trong .wp-block-woocommerce-product-button
   Cả hai kiểu đều có chung class "product" trên thẻ li nên style chung nhắm vào "li.product". */
li.product{list-style:none;width:100%;margin:0!important;border:1px solid #E4E2DD;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;background:#FAFAF8}
li.product img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
li.product .woocommerce-loop-product__title,li.product .wp-block-post-title{font-size:15px;font-weight:600;padding:14px 16px 0;margin:0;color:#15171A;text-align:left!important}
li.product .price,li.product .wp-block-woocommerce-product-price,li.product .add_to_cart_button,li.product .added_to_cart,li.product .wp-block-woocommerce-product-button{display:none!important}
li.product .qw-card-desc{font-size:13px;color:#6B6E73;padding:6px 16px 0;margin:0;line-height:1.5}
li.product .qw-card-cta{display:flex;gap:8px;padding:14px 16px 16px;margin-top:auto}
ul.products,ul.wc-block-product-template{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:24px!important;list-style:none;margin:0!important;padding:0!important}
@media(max-width:1024px){ul.products,ul.wc-block-product-template{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:767px){ul.products,ul.wc-block-product-template{grid-template-columns:repeat(2,1fr)!important;gap:16px!important}}
@media(max-width:430px){ul.products,ul.wc-block-product-template{grid-template-columns:1fr!important}}
ul.wc-block-product-template.is-flex-container{display:flex!important;flex-wrap:wrap!important}
ul.wc-block-product-template.is-flex-container>li.product{width:auto!important;flex:0 1 calc(25% - 18px)!important}
@media(max-width:1024px){ul.wc-block-product-template.is-flex-container>li.product{flex-basis:calc(33.333% - 16px)!important}}
@media(max-width:767px){ul.wc-block-product-template.is-flex-container>li.product{flex-basis:calc(50% - 8px)!important}}
@media(max-width:430px){ul.wc-block-product-template.is-flex-container>li.product{flex-basis:100%!important}}
.qw-card-btn{flex:1;text-align:center;font-size:13px;font-weight:600;padding:10px 8px;border-radius:8px;text-decoration:none;line-height:1.2}
.qw-card-btn--outline{border:1px solid #15171A;color:#15171A}
.qw-card-btn--solid{background:#C9A44C;color:#15171A}
.qw-card-btn--outline:hover{background:#15171A;color:#FAFAF8}
.qw-card-btn--solid:hover{background:#b3903f}


/* Hero Slider — 2 slide: banner QUYN mới (slide 1, ưu tiên LCP) + Hero gốc (slide 2, giữ nguyên).
   Dùng flex-track + transform:translateX thay vì absolute cross-fade để tránh container sập chiều cao. */
.qw-hero-slider{position:relative;overflow:hidden}
.qw-hero-track{display:flex;align-items:flex-start;transition:transform .5s ease}
.qw-hero-slide{flex:0 0 100%;min-width:100%}
.qw-hero-slide--banner{line-height:0;background:#15171A}
.qw-hero-slide--banner img{width:100%;height:auto;display:block}
.qw-hero-slide--original{padding-top:120px;padding-bottom:120px}
.qw-hero-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:5}
.qw-hero-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55);border:0;padding:0;cursor:pointer}
.qw-hero-dot.is-active{background:#C9A44C;width:22px;border-radius:5px;transition:width .2s ease,background .2s ease}
@media(max-width:767px){.qw-hero-dots{bottom:10px}}