/* =====================================================================
   BEAUTY V9 — 4 bản sửa (tải sau style.css)
   ===================================================================== */

/* [FIX 1] ẢNH SẢN PHẨM — khung vuông 1:1, không méo ---------------------- */
.bv-prod .bv-prod-media{aspect-ratio:1/1;background:#f7f0e6}
.bv-prod .bv-prod-media img,.bv-prod .bv-prod-image-link img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1;display:block}
.bv-detail-media-product{aspect-ratio:1/1;overflow:hidden;border-radius:14px;background:#f7f0e6}
.bv-detail-media-product img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1}
/* giỏ hàng tích hợp */
.bv-cart-thumb{aspect-ratio:1/1}
.bv-cart-thumb img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1}
/* giỏ hàng / mini-cart / checkout của WooCommerce */
.woocommerce-cart-form .product-thumbnail img,.woocommerce-mini-cart-item img,.woocommerce-checkout-review-order-table .product-thumbnail img,.woocommerce ul.products li.product img{aspect-ratio:1/1;object-fit:cover;height:auto}
.woocommerce-cart-form .product-thumbnail img{width:80px;height:80px;border-radius:10px}
.woocommerce-mini-cart-item img{width:56px;height:56px;border-radius:8px}

/* [FIX 2] TRANG GIỚI THIỆU — ảnh lớn bên phải ------------------------------ */
.beauty-about-hero-image{aspect-ratio:4/5;min-height:320px;overflow:hidden;border-radius:12px;background:#f1e8dd;box-shadow:0 14px 36px rgba(53,40,32,.14)}
.beauty-about-hero-image img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px}
@media(max-width:900px){.beauty-about-hero-image{aspect-ratio:4/3;min-height:0}}

/* [FIX 3] TRANG HÌNH ẢNH — ALBUM ------------------------------------------- */
.bva-wrap{max-width:1120px;margin:0 auto}
.bva-wrap .beauty-gallery-lead{max-width:780px;margin:0 auto 40px;text-align:center}
.bva-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:56px}
.bva-card{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:#3f3028;color:#fff;box-shadow:0 10px 28px rgba(53,40,32,.12);cursor:pointer}
.bva-card--big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.bva-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.bva-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(36,25,18,.8))}
.bva-card:hover img,.bva-card:focus-visible img{transform:scale(1.06)}
.bva-card:focus-visible{outline:3px solid var(--spa-gold,#c9a96e);outline-offset:3px}
.bva-info{position:absolute;left:20px;right:20px;bottom:18px;z-index:1;display:flex;flex-direction:column;gap:2px}
.bva-name{font-family:var(--font-serif);font-size:22px;font-weight:700;line-height:1.25}
.bva-card--big .bva-name{font-size:30px}
.bva-count{font-size:13px;opacity:.9}
.bva-open{position:absolute;top:16px;right:16px;z-index:1;padding:6px 14px;border-radius:30px;background:rgba(255,253,249,.92);color:var(--spa-deep,#352820);font-size:12px;font-weight:700;opacity:0;transform:translateY(-6px);transition:.25s}
.bva-card:hover .bva-open,.bva-card:focus-visible .bva-open{opacity:1;transform:none}
@media(hover:none){.bva-open{opacity:1;transform:none}}
@media(max-width:800px){.bva-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.bva-card--big{grid-column:span 2;grid-row:auto;aspect-ratio:16/10}.bva-name{font-size:18px}.bva-card--big .bva-name{font-size:24px}}
@media(max-width:520px){.bva-grid{grid-template-columns:1fr}.bva-card--big{grid-column:auto}.bva-card{aspect-ratio:4/3}}

/* Lightbox album */
body.bva-lock{overflow:hidden}
.bva-lb{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;background:rgba(26,18,13,.95);color:#fff}
.bva-lb[hidden]{display:none}
.bva-lb-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px}
.bva-lb-title{font-family:var(--font-serif);font-size:20px;font-weight:700}
.bva-lb-count{font-size:13px;opacity:.8;margin-left:10px;font-weight:400;font-family:var(--font-sans)}
.bva-lb button{border:0;cursor:pointer;font:inherit}
.bva-lb-close,.bva-lb-prev,.bva-lb-next{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,253,249,.92);color:#352820;font-size:26px;line-height:1}
.bva-lb-close:hover,.bva-lb-prev:hover,.bva-lb-next:hover{background:#fff}
.bva-lb-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 70px}
.bva-lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.bva-lb-prev,.bva-lb-next{position:absolute;top:50%;transform:translateY(-50%)}
.bva-lb-prev{left:14px}.bva-lb-next{right:14px}
.bva-lb-cap{text-align:center;padding:10px 16px 4px;font-size:15px}
.bva-lb-thumbs{display:flex;gap:8px;justify-content:center;padding:8px 16px 16px;overflow-x:auto}
.bva-lb-thumbs button{flex:0 0 auto;width:64px;height:48px;padding:0;border:2px solid transparent;border-radius:6px;overflow:hidden;background:#000;opacity:.6}
.bva-lb-thumbs button[aria-current="true"]{border-color:var(--spa-gold,#c9a96e);opacity:1}
.bva-lb-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.bva-lb.is-single .bva-lb-prev,.bva-lb.is-single .bva-lb-next,.bva-lb.is-single .bva-lb-thumbs{display:none}
@media(max-width:640px){.bva-lb-stage{padding:0 10px}.bva-lb-prev,.bva-lb-next{width:40px;height:40px;top:auto;bottom:6px;transform:none}.bva-lb-prev{left:10px}.bva-lb-next{right:10px}}

/* [FIX 4] THẺ GÓI DỊCH VỤ / COMBO ------------------------------------------ */
.bvp-card{display:flex;flex-direction:column;overflow:hidden;padding:0}
.bvp-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#f3eadf}
.bvp-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.bvp-card:hover .bvp-media img{transform:scale(1.05)}
.bvp-badge{position:absolute;top:14px;left:14px}
.bvp-body{display:flex;flex-direction:column;flex:1;gap:12px;padding:20px 22px 24px}
.bvp-body h3{font-size:22px;line-height:1.3;margin:0}
.bvp-body h3 a{color:inherit}
.bvp-inc{font-size:14px;color:var(--spa-muted,#6f5d50)}
.bvp-inc strong{display:block;margin-bottom:6px;color:var(--spa-deep,#352820);font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.bvp-inc ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.bvp-inc li{position:relative;padding-left:22px;line-height:1.5}
.bvp-inc li::before{content:"✓";position:absolute;left:0;top:0;color:var(--spa-gold,#a87948);font-weight:700}
.bvp-price{margin-top:auto;padding-top:6px;font-family:var(--font-serif);color:var(--spa-brown,#604b3f)}
.bvp-price-now{font-size:30px;font-weight:700;line-height:1.1}
.bvp-price del{font-size:15px;opacity:.6;margin-left:6px}
.bvp-price-contact{font-size:18px;font-weight:700}
.bvp-actions{display:flex;gap:10px}
.bvp-actions .btn{flex:1 1 0;min-width:0;min-height:46px;display:flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;padding:0 10px}

/* [FIX 5] DANH MỤC DỊCH VỤ — tab biểu tượng + khung mô tả + thẻ ảnh (tông nâu/kem/vàng của Beauty) */
.bsc-wrap{max-width:1120px;margin:0 auto 56px}
.bsc-head{text-align:center;margin-bottom:28px}
.bsc-head h2{font-family:var(--font-serif)!important;font-size:clamp(28px,3.4vw,40px)!important;margin:8px 0 10px!important;color:var(--spa-deep,#352820)}
.bsc-dot{display:block;width:8px;height:8px;border-radius:50%;background:var(--spa-gold,#a87948);margin:0 auto}
.bsc-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:22px}
.bsc-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:104px;padding:12px 8px;background:#fffdf9;border:1px solid var(--spa-border,#e6d8c8);border-radius:14px;color:var(--spa-brown,#604b3f);cursor:pointer;font:inherit;transition:.25s}
.bsc-tab:hover{border-color:var(--spa-gold,#a87948);transform:translateY(-2px);box-shadow:0 10px 24px rgba(96,75,63,.1)}
.bsc-tab.is-active{background:#f3eadf;border-color:var(--spa-brown,#604b3f);box-shadow:0 0 0 2px rgba(96,75,63,.12)}
.bsc-tab:focus-visible{outline:3px solid var(--spa-gold,#c9a96e);outline-offset:2px}
.bsc-ico{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#fff;color:var(--spa-brown,#604b3f)}
.bsc-tab.is-active .bsc-ico{background:var(--spa-brown,#604b3f);color:#fff}
.bsc-name{font-size:14px;font-weight:600;line-height:1.3;text-align:center}
.bsc-panel{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:28px;background:#fffdf9;border:1px solid var(--spa-border,#e6d8c8);border-radius:16px;margin-bottom:28px}
.bsc-panel[hidden]{display:none}
.bsc-text p{margin:0 0 16px;font-size:15px;line-height:1.9;color:var(--spa-muted,#6f5d50)}
.bsc-more{font-weight:700;color:var(--spa-brown,#604b3f);border-bottom:1px solid currentColor;padding-bottom:2px}
.bsc-more:hover{color:var(--spa-gold,#a87948)}
.bsc-pic{aspect-ratio:16/10;overflow:hidden;border-radius:12px;background:#f1e8dd;box-shadow:0 10px 28px rgba(53,40,32,.12)}
.bsc-pic img{width:100%;height:100%;object-fit:cover;display:block}
.bsc-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:28px}
.bsc-card{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:14px;background:#3f3028;box-shadow:0 10px 26px rgba(53,40,32,.14)}
.bsc-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.bsc-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(36,25,18,.82))}
.bsc-card:hover img{transform:scale(1.06)}
.bsc-card span{position:absolute;left:16px;right:16px;bottom:16px;z-index:1;color:#fff;font-family:var(--font-serif);font-size:20px;font-weight:700;line-height:1.25}
.bsc-cta{text-align:center}
@media(max-width:900px){.bsc-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.bsc-panel{grid-template-columns:1fr;padding:20px}.bsc-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.bsc-tabs{gap:10px}.bsc-tab{min-height:92px}.bsc-card span{font-size:16px}}


/* [FIX 6] DANH MỤC HÌNH ẢNH — bộ lọc + lưới 4 cột theo mẫu tham khảo */
.beauty-image-categories{width:100%;max-width:1200px;margin:0 auto 20px}
.bic-heading{text-align:center;max-width:760px;margin:0 auto 22px}
.bic-heading h2{margin:8px 0 10px;color:var(--spa-deep,#352820);font-family:var(--font-serif);font-size:clamp(25px,3vw,36px);line-height:1.25}
.bic-heading p{margin:0;color:var(--spa-muted,#6f5d50);font-size:14px;line-height:1.7}
.bic-filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:0 auto 22px}
/* [FIX 1] THANH FILTER — đổi hồng sang tone Be/Nâu thương hiệu */
.bic-filter{appearance:none;border:1px solid #d4a373;border-radius:999px;padding:8px 14px;background:#f5ebe0;color:#5c4033;font:600 12px/1.2 var(--font-sans);cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.bic-filter:hover{background:#ebd9c4;border-color:#d4a373;color:#5c4033;transform:translateY(-1px)}
.bic-filter.is-active,.bic-filter.is-active:hover{background:#8b5e3c;border-color:#8b5e3c;color:#fff}
.bic-filter:focus-visible{outline:3px solid rgba(139,94,60,.3);outline-offset:2px}
.bic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bic-card{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:8px;background:#f5ebe0;box-shadow:0 4px 12px rgba(92,64,51,.1);color:#fff}
.bic-card[hidden]{display:none!important}
.bic-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.bic-card:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(53,40,32,.6));pointer-events:none}
.bic-card:hover img,.bic-card:focus-visible img{transform:scale(1.045)}
.bic-card-label{position:absolute;z-index:1;left:12px;right:12px;bottom:10px;color:#fff;font-size:13px;font-weight:700;line-height:1.35;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.bic-more{text-align:center;margin-top:22px}
@media(max-width:900px){.bic-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(max-width:640px){.bic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bic-filter{padding:8px 11px}.bic-card-label{font-size:12px}}
@media(max-width:360px){.bic-grid{grid-template-columns:1fr}}

/* [FIX 3] THANH CUỘN — tiệp tone nâu be (track #f5ebe0, thumb #d4a373) */
html{scrollbar-width:thin;scrollbar-color:#d4a373 #f5ebe0}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:#f5ebe0}
::-webkit-scrollbar-thumb{background:#d4a373;border-radius:999px;border:3px solid #f5ebe0}
::-webkit-scrollbar-thumb:hover{background:#8b5e3c}
::-webkit-scrollbar-corner{background:#f5ebe0}

/* [FIX 4] ẢNH SẢN PHẨM — hover zoom nhẹ, giữ khung 1:1 */
.bv-prod .bv-prod-media,.bv-detail-media-product,.bv-cart-thumb{overflow:hidden}
.bv-prod .bv-prod-media img,.bv-detail-media-product img,.bv-cart-thumb img{transition:transform .45s ease;will-change:transform}
.bv-prod:hover .bv-prod-media img,.bv-detail-media-product:hover img{transform:scale(1.06)}
@media(prefers-reduced-motion:reduce){.bv-prod .bv-prod-media img,.bv-detail-media-product img{transition:none}.bv-prod:hover .bv-prod-media img,.bv-detail-media-product:hover img{transform:none}}

/* [SPACING] THU GỌN KHOẢNG CÁCH GIỮA CÁC SECTION (tải sau cùng nên ghi đè style.css) */
.bv-section{padding:36px 0!important;margin:0!important}
.section-heading{margin:0 auto 20px!important}
.section-heading h2{margin:6px 0 8px!important}
.section-cta{margin-top:20px!important}
.trust-grid{padding:10px 0!important}
.beauty-image-categories{margin:0 auto!important}
.bic-heading{margin-bottom:16px!important}
.bic-filters{margin-bottom:16px!important}
.bic-more{margin-top:16px!important}
.bv-feedback{margin-top:28px!important;padding-top:24px!important}
.bv-cta-band{padding:32px 0!important}
.bv-faq{gap:8px!important}
main>section:last-of-type,main>section:last-child{margin-bottom:0!important}
@media(max-width:900px){.bv-section{padding:28px 0!important}.section-heading{margin-bottom:16px!important}}
@media(max-width:620px){.bv-section{padding:22px 0!important}}

/* [MARQUEE] THANH THÔNG TIN CHẠY CHỮ — pause khi rê chuột; tắt chuyển động nếu người dùng chọn "giảm chuyển động" */
.topbar{overflow:hidden}
.topbar-marquee{overflow:hidden;padding:7px 0;white-space:nowrap;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tb-track{display:flex;width:max-content;animation:beauty-marquee 24s linear infinite!important;will-change:transform}
.topbar:hover .tb-track{animation-play-state:paused}
.tb-group{display:flex;align-items:center;flex-shrink:0}
.tb-item{padding:0 28px;font-weight:500;letter-spacing:.2px}
.tb-item a{color:inherit;font-weight:700}
.tb-item a:hover{color:#f5ebe0;text-decoration:underline}
.tb-sep{color:#d4a373;font-size:10px}
@keyframes beauty-marquee{from{transform:translateX(0)}to{transform:translateX(calc(-100% / 6))}}
@media(max-width:620px){.tb-track{animation-duration:18s!important}.tb-item{padding:0 20px}}


/* Banner quảng cáo Beauty Spa – bảng màu kem, vàng champagne và xanh olive */
.bv-promo-banner-section{padding:8px 0 22px!important;margin:0!important;background:linear-gradient(180deg,#fffdf8 0%,#f8f1e6 100%)}
.bv-promo-banner-link{display:block;overflow:hidden;border:1px solid rgba(183,145,82,.32);border-radius:16px;box-shadow:0 12px 32px rgba(92,67,42,.13);background:#f8f1e6;transition:transform .25s ease,box-shadow .25s ease}
.bv-promo-banner-link:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(92,67,42,.18)}
.bv-promo-banner-link img{display:block;width:100%;height:auto;aspect-ratio:1300/296;object-fit:cover}
@media(max-width:620px){.bv-promo-banner-section{padding:4px 0 16px!important}.bv-promo-banner-link{border-radius:10px}.bv-promo-banner-link img{aspect-ratio:1.7/1;object-position:center}}
@media(prefers-reduced-motion:reduce){.bv-promo-banner-link{transition:none}.bv-promo-banner-link:hover{transform:none}}
